ngx-t-forms 2.0.2 → 2.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/{ngx-t-forms-api-value-access-rules.component-pmyW-mx7.mjs → ngx-t-forms-api-value-access-rules.component-CZuOneM4.mjs} +8 -8
- package/fesm2022/{ngx-t-forms-api-value-access-rules.component-pmyW-mx7.mjs.map → ngx-t-forms-api-value-access-rules.component-CZuOneM4.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-calculated-field-rules.component-DP1UlCew.mjs → ngx-t-forms-calculated-field-rules.component-CyI98qg-.mjs} +7 -7
- package/fesm2022/{ngx-t-forms-calculated-field-rules.component-DP1UlCew.mjs.map → ngx-t-forms-calculated-field-rules.component-CyI98qg-.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-config-mscoa-additional-inputs.component-CbZRg_zQ.mjs → ngx-t-forms-config-mscoa-additional-inputs.component-CqIs3vX5.mjs} +4 -4
- package/fesm2022/{ngx-t-forms-config-mscoa-additional-inputs.component-CbZRg_zQ.mjs.map → ngx-t-forms-config-mscoa-additional-inputs.component-CqIs3vX5.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-form-input-selector.component-BJm9gyXk.mjs → ngx-t-forms-form-input-selector.component-D4QnMgZV.mjs} +5 -5
- package/fesm2022/{ngx-t-forms-form-input-selector.component-BJm9gyXk.mjs.map → ngx-t-forms-form-input-selector.component-D4QnMgZV.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-form-json-view.component-BY1A6dqj.mjs → ngx-t-forms-form-json-view.component-Dmd0DIAm.mjs} +2 -2
- package/fesm2022/{ngx-t-forms-form-json-view.component-BY1A6dqj.mjs.map → ngx-t-forms-form-json-view.component-Dmd0DIAm.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-form-section-stepper.component-CYUj3li9.mjs → ngx-t-forms-form-section-stepper.component-DlvXkLBk.mjs} +10 -10
- package/fesm2022/{ngx-t-forms-form-section-stepper.component-CYUj3li9.mjs.map → ngx-t-forms-form-section-stepper.component-DlvXkLBk.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-forms-builder-menu.component-DBh2XvMV.mjs → ngx-t-forms-forms-builder-menu.component-CNNd7BqK.mjs} +16 -16
- package/fesm2022/{ngx-t-forms-forms-builder-menu.component-DBh2XvMV.mjs.map → ngx-t-forms-forms-builder-menu.component-CNNd7BqK.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-input-editor.component-Pv9Ka-hF.mjs → ngx-t-forms-input-editor.component-hf6AapZI.mjs} +31 -15
- package/fesm2022/ngx-t-forms-input-editor.component-hf6AapZI.mjs.map +1 -0
- package/fesm2022/{ngx-t-forms-mat-chip-list-editor.component-BgfStriH.mjs → ngx-t-forms-mat-chip-list-editor.component-C4_iUWzY.mjs} +2 -2
- package/fesm2022/{ngx-t-forms-mat-chip-list-editor.component-BgfStriH.mjs.map → ngx-t-forms-mat-chip-list-editor.component-C4_iUWzY.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-mat-slider-editor.component-CYyAcNf2.mjs → ngx-t-forms-mat-slider-editor.component-CapaodC5.mjs} +2 -2
- package/fesm2022/{ngx-t-forms-mat-slider-editor.component-CYyAcNf2.mjs.map → ngx-t-forms-mat-slider-editor.component-CapaodC5.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-mat-slider-toggle-editor.component-DFlNcNXN.mjs → ngx-t-forms-mat-slider-toggle-editor.component-By2FAlH_.mjs} +2 -2
- package/fesm2022/{ngx-t-forms-mat-slider-toggle-editor.component-DFlNcNXN.mjs.map → ngx-t-forms-mat-slider-toggle-editor.component-By2FAlH_.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-missing-form-configs.component-C5_wwf2z.mjs → ngx-t-forms-missing-form-configs.component-fAU-JAr1.mjs} +5 -5
- package/fesm2022/{ngx-t-forms-missing-form-configs.component-C5_wwf2z.mjs.map → ngx-t-forms-missing-form-configs.component-fAU-JAr1.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-mscoa-segment-config.component-DD9mv-Lb.mjs → ngx-t-forms-mscoa-segment-config.component-BR1ALZeD.mjs} +6 -6
- package/fesm2022/{ngx-t-forms-mscoa-segment-config.component-DD9mv-Lb.mjs.map → ngx-t-forms-mscoa-segment-config.component-BR1ALZeD.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-ngx-t-forms-BiFqmAIA.mjs → ngx-t-forms-ngx-t-forms-DW5CqjCd.mjs} +77 -68
- package/fesm2022/ngx-t-forms-ngx-t-forms-DW5CqjCd.mjs.map +1 -0
- package/fesm2022/{ngx-t-forms-pipeline-generator.component-DGEidXgr.mjs → ngx-t-forms-pipeline-generator.component-BBQEFIyY.mjs} +12 -12
- package/fesm2022/{ngx-t-forms-pipeline-generator.component-DGEidXgr.mjs.map → ngx-t-forms-pipeline-generator.component-BBQEFIyY.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-required-inputs.component-DS-D1d89.mjs → ngx-t-forms-required-inputs.component-Dm4DQOlu.mjs} +9 -9
- package/fesm2022/{ngx-t-forms-required-inputs.component-DS-D1d89.mjs.map → ngx-t-forms-required-inputs.component-Dm4DQOlu.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-rest-api-call-setup.component-BY555_zO.mjs → ngx-t-forms-rest-api-call-setup.component-C0lOrUPY.mjs} +10 -10
- package/fesm2022/{ngx-t-forms-rest-api-call-setup.component-BY555_zO.mjs.map → ngx-t-forms-rest-api-call-setup.component-C0lOrUPY.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-section-report.component-CUNhFUtC.mjs → ngx-t-forms-section-report.component-CqtN0ffr.mjs} +2 -2
- package/fesm2022/{ngx-t-forms-section-report.component-CUNhFUtC.mjs.map → ngx-t-forms-section-report.component-CqtN0ffr.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-selection-options-editor.component-zg8iAImG.mjs → ngx-t-forms-selection-options-editor.component-DSundfcO.mjs} +6 -6
- package/fesm2022/{ngx-t-forms-selection-options-editor.component-zg8iAImG.mjs.map → ngx-t-forms-selection-options-editor.component-DSundfcO.mjs.map} +1 -1
- package/fesm2022/{ngx-t-forms-validators-config.component-Dt5oXQcY.mjs → ngx-t-forms-validators-config.component-DSZO3LdN.mjs} +12 -12
- package/fesm2022/{ngx-t-forms-validators-config.component-Dt5oXQcY.mjs.map → ngx-t-forms-validators-config.component-DSZO3LdN.mjs.map} +1 -1
- package/fesm2022/ngx-t-forms.mjs +1 -1
- package/lib/components/form-builder/elements/input-element-editor/input-element-editor.component.d.ts +1 -0
- package/lib/components/forms/forms.component.d.ts +1 -1
- package/package.json +1 -1
- package/fesm2022/ngx-t-forms-input-editor.component-Pv9Ka-hF.mjs.map +0 -1
- package/fesm2022/ngx-t-forms-ngx-t-forms-BiFqmAIA.mjs.map +0 -1
package/fesm2022/{ngx-t-forms-ngx-t-forms-BiFqmAIA.mjs → ngx-t-forms-ngx-t-forms-DW5CqjCd.mjs}
RENAMED
|
@@ -13,7 +13,7 @@ import * as i1$1 from '@angular/material/dialog';
|
|
|
13
13
|
import { MatDialogModule, MatDialogRef, MAT_DIALOG_DATA, MatDialog } from '@angular/material/dialog';
|
|
14
14
|
import { CdkAccordionModule } from '@angular/cdk/accordion';
|
|
15
15
|
import { ClipboardModule } from '@angular/cdk/clipboard';
|
|
16
|
-
import * as i2 from '@angular/cdk/drag-drop';
|
|
16
|
+
import * as i2$1 from '@angular/cdk/drag-drop';
|
|
17
17
|
import { DragDropModule } from '@angular/cdk/drag-drop';
|
|
18
18
|
import { PortalModule } from '@angular/cdk/portal';
|
|
19
19
|
import { ScrollingModule } from '@angular/cdk/scrolling';
|
|
@@ -22,20 +22,20 @@ import { CdkTableModule } from '@angular/cdk/table';
|
|
|
22
22
|
import { CdkTreeModule, FlatTreeControl } from '@angular/cdk/tree';
|
|
23
23
|
import { MatBadgeModule } from '@angular/material/badge';
|
|
24
24
|
import { MatBottomSheetModule } from '@angular/material/bottom-sheet';
|
|
25
|
-
import * as
|
|
25
|
+
import * as i2 from '@angular/material/button';
|
|
26
26
|
import { MatButtonModule } from '@angular/material/button';
|
|
27
27
|
import { MatButtonToggleModule } from '@angular/material/button-toggle';
|
|
28
|
-
import * as i3
|
|
28
|
+
import * as i3 from '@angular/material/card';
|
|
29
29
|
import { MatCardModule } from '@angular/material/card';
|
|
30
|
-
import * as i3$
|
|
30
|
+
import * as i3$2 from '@angular/material/checkbox';
|
|
31
31
|
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
32
|
-
import * as i4$
|
|
32
|
+
import * as i4$4 from '@angular/material/chips';
|
|
33
33
|
import { MatChipsModule } from '@angular/material/chips';
|
|
34
|
-
import * as i3$
|
|
34
|
+
import * as i3$3 from '@angular/material/stepper';
|
|
35
35
|
import { MatStepperModule } from '@angular/material/stepper';
|
|
36
|
-
import * as i2$
|
|
36
|
+
import * as i2$5 from '@angular/material/datepicker';
|
|
37
37
|
import { MatDatepickerModule } from '@angular/material/datepicker';
|
|
38
|
-
import * as
|
|
38
|
+
import * as i4$1 from '@angular/material/divider';
|
|
39
39
|
import { MatDividerModule } from '@angular/material/divider';
|
|
40
40
|
import { MatExpansionModule } from '@angular/material/expansion';
|
|
41
41
|
import { MatGridListModule } from '@angular/material/grid-list';
|
|
@@ -47,40 +47,40 @@ import * as i6 from '@angular/material/list';
|
|
|
47
47
|
import { MatListModule } from '@angular/material/list';
|
|
48
48
|
import * as i6$1 from '@angular/material/menu';
|
|
49
49
|
import { MatMenuModule } from '@angular/material/menu';
|
|
50
|
-
import * as i2$
|
|
50
|
+
import * as i2$3 from '@angular/material/core';
|
|
51
51
|
import { MatNativeDateModule, MatRippleModule, provideNativeDateAdapter } from '@angular/material/core';
|
|
52
|
-
import * as i7$
|
|
52
|
+
import * as i7$3 from '@angular/material/paginator';
|
|
53
53
|
import { MatPaginatorModule, MatPaginator } from '@angular/material/paginator';
|
|
54
|
-
import * as i4$
|
|
54
|
+
import * as i4$3 from '@angular/material/progress-bar';
|
|
55
55
|
import { MatProgressBarModule } from '@angular/material/progress-bar';
|
|
56
|
-
import * as
|
|
56
|
+
import * as i7 from '@angular/material/progress-spinner';
|
|
57
57
|
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
|
|
58
58
|
import { MatRadioModule } from '@angular/material/radio';
|
|
59
|
-
import * as i7 from '@angular/material/select';
|
|
59
|
+
import * as i7$1 from '@angular/material/select';
|
|
60
60
|
import { MatSelectModule } from '@angular/material/select';
|
|
61
|
-
import * as i8$
|
|
61
|
+
import * as i8$1 from '@angular/material/sidenav';
|
|
62
62
|
import { MatSidenavModule } from '@angular/material/sidenav';
|
|
63
63
|
import { MatSliderModule } from '@angular/material/slider';
|
|
64
|
-
import * as i2$
|
|
64
|
+
import * as i2$4 from '@angular/material/slide-toggle';
|
|
65
65
|
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
|
|
66
66
|
import { MatSnackBarModule, MatSnackBar } from '@angular/material/snack-bar';
|
|
67
|
-
import * as i4$
|
|
67
|
+
import * as i4$2 from '@angular/material/sort';
|
|
68
68
|
import { MatSortModule, MatSort } from '@angular/material/sort';
|
|
69
|
-
import * as i5$
|
|
69
|
+
import * as i5$2 from '@angular/material/table';
|
|
70
70
|
import { MatTableModule, MatTableDataSource } from '@angular/material/table';
|
|
71
71
|
import { MatTabsModule } from '@angular/material/tabs';
|
|
72
72
|
import * as i9 from '@angular/material/toolbar';
|
|
73
73
|
import { MatToolbarModule } from '@angular/material/toolbar';
|
|
74
|
-
import * as i8
|
|
74
|
+
import * as i8 from '@angular/material/tooltip';
|
|
75
75
|
import { MatTooltipModule } from '@angular/material/tooltip';
|
|
76
|
-
import * as i3$
|
|
76
|
+
import * as i3$1 from '@angular/material/tree';
|
|
77
77
|
import { MatTreeModule, MatTreeFlattener, MatTreeFlatDataSource } from '@angular/material/tree';
|
|
78
78
|
import { OverlayModule } from '@angular/cdk/overlay';
|
|
79
79
|
import * as i4 from '@angular/material/form-field';
|
|
80
80
|
import { MatFormFieldModule, MatFormFieldControl } from '@angular/material/form-field';
|
|
81
81
|
import * as i1$5 from '@angular/material/autocomplete';
|
|
82
82
|
import { MatAutocompleteModule } from '@angular/material/autocomplete';
|
|
83
|
-
import * as i2$
|
|
83
|
+
import * as i2$2 from '@angular/common';
|
|
84
84
|
import { CommonModule, DOCUMENT } from '@angular/common';
|
|
85
85
|
import { ComponentStore } from '@ngrx/component-store';
|
|
86
86
|
import * as i1$3 from '@angular/router';
|
|
@@ -89,7 +89,7 @@ import { toSignal } from '@angular/core/rxjs-interop';
|
|
|
89
89
|
import * as i1$4 from '@syncfusion/ej2-angular-richtexteditor';
|
|
90
90
|
import { RichTextEditorModule, ToolbarService, LinkService, ImageService, HtmlEditorService } from '@syncfusion/ej2-angular-richtexteditor';
|
|
91
91
|
import _ from 'lodash';
|
|
92
|
-
import * as i7$
|
|
92
|
+
import * as i7$2 from 'ngx-ui-tour-md-menu';
|
|
93
93
|
import { TourMatMenuModule } from 'ngx-ui-tour-md-menu';
|
|
94
94
|
import { coerceBooleanProperty } from '@angular/cdk/coercion';
|
|
95
95
|
import SignaturePad from 'signature_pad';
|
|
@@ -3085,7 +3085,7 @@ class DialogTemplateComponent {
|
|
|
3085
3085
|
this.dialogRef.close(true);
|
|
3086
3086
|
}
|
|
3087
3087
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: DialogTemplateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3088
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.2", type: DialogTemplateComponent, isStandalone: true, selector: "lib-dialog-template", ngImport: i0, template: "<h2 mat-dialog-title>\r\n {{data.title}}\r\n</h2>\r\n<mat-dialog-content>\r\n{{data.message}}\r\n</mat-dialog-content>\r\n\r\n<mat-dialog-actions >\r\n <button \r\n color=\"warn\"\r\n mat-flat-button mat-dialog-close>\r\n {{data.noText}}\r\n </button>\r\n <span class=\"spacer\"></span>\r\n <button \r\n (click)=\"proceed()\"\r\n color=\"primary\"\r\n mat-raised-button mat-dialog-close cdkFocusInitial>\r\n {{data.yesText}}\r\n </button>\r\n</mat-dialog-actions>", styles: ["mat-dialog-content{max-width:368px}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type:
|
|
3088
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.2", type: DialogTemplateComponent, isStandalone: true, selector: "lib-dialog-template", ngImport: i0, template: "<h2 mat-dialog-title>\r\n {{data.title}}\r\n</h2>\r\n<mat-dialog-content>\r\n{{data.message}}\r\n</mat-dialog-content>\r\n\r\n<mat-dialog-actions >\r\n <button \r\n color=\"warn\"\r\n mat-flat-button mat-dialog-close>\r\n {{data.noText}}\r\n </button>\r\n <span class=\"spacer\"></span>\r\n <button \r\n (click)=\"proceed()\"\r\n color=\"primary\"\r\n mat-raised-button mat-dialog-close cdkFocusInitial>\r\n {{data.yesText}}\r\n </button>\r\n</mat-dialog-actions>", styles: ["mat-dialog-content{max-width:368px}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: i1$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }] }); }
|
|
3089
3089
|
}
|
|
3090
3090
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: DialogTemplateComponent, decorators: [{
|
|
3091
3091
|
type: Component,
|
|
@@ -3528,15 +3528,24 @@ function testAgainstItem(test, item) {
|
|
|
3528
3528
|
;
|
|
3529
3529
|
function inputElementEditorConfigs(form, inputInEdit, NGX_T_FORMS_CONFIG, utils) {
|
|
3530
3530
|
try {
|
|
3531
|
+
// Get base configuration
|
|
3531
3532
|
const config = getElementEditorConfig;
|
|
3533
|
+
// Get validation errors for the input being edited
|
|
3532
3534
|
const errors = inputInEditValidationErrors(form, inputInEdit);
|
|
3535
|
+
// Create a completely new configuration object (for change detection)
|
|
3533
3536
|
return {
|
|
3534
|
-
...config,
|
|
3535
|
-
|
|
3536
|
-
|
|
3537
|
-
elements
|
|
3538
|
-
|
|
3539
|
-
|
|
3537
|
+
...config, // Copy all base properties
|
|
3538
|
+
// Create new array with new section objects
|
|
3539
|
+
editorSections: config.editorSections.map(section => {
|
|
3540
|
+
const elements = getSectionElements(section.elements, inputInEdit, NGX_T_FORMS_CONFIG, utils, errors);
|
|
3541
|
+
// Check if any element in this section has errors
|
|
3542
|
+
const hasErrors = section.elements.some(el => errors.some(err => err.key === el.deepBind?.join('.')));
|
|
3543
|
+
return ({
|
|
3544
|
+
...section,
|
|
3545
|
+
elements: [...[], ...elements],
|
|
3546
|
+
hasErrors
|
|
3547
|
+
});
|
|
3548
|
+
})
|
|
3540
3549
|
};
|
|
3541
3550
|
}
|
|
3542
3551
|
catch (error) {
|
|
@@ -4925,9 +4934,9 @@ class FormBuilderComponent {
|
|
|
4925
4934
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: FormBuilderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4926
4935
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: FormBuilderComponent, isStandalone: true, selector: "app-form-builder", inputs: { formId: "formId" }, providers: [
|
|
4927
4936
|
FormsStoreService
|
|
4928
|
-
], ngImport: i0, template: "<header>\r\n <mat-toolbar color=\"primary\">\r\n @if (closeButton) {\r\n <button mat-icon-button [style.color]=\"closeButton.color\" (click)=\"closeButton.onClick()\">\r\n <mat-icon>{{closeButton.icon}}</mat-icon>\r\n </button>\r\n }\r\n\r\n <!-- Navigation group -->\r\n <div class=\"nav-group\">\r\n <button mat-button routerLink=\"/\">Forms</button>\r\n <mat-icon>navigate_next</mat-icon>\r\n </div>\r\n\r\n <!-- Title input with optimized binding -->\r\n @if (selectHasFormId()) {\r\n <input [(ngModel)]=\"titleValue\" class=\"section-title-input\" placeholder=\"Enter Form Title\">\r\n }\r\n\r\n <span class=\"spacer\"></span>\r\n\r\n @defer (on viewport) {\r\n <app-forms-builder-menu />\r\n } @placeholder {\r\n <div style=\"padding: 50px;display:flex;justify-content:center;align-items:center; text-align: center;\">\r\n <mat-spinner diameter=\"20\" />\r\n </div>\r\n\r\n }\r\n\r\n <span class=\"divider\">|</span>\r\n\r\n <!-- Save/Update button with optimized reactive state -->\r\n <button mat-raised-button color=\"accent\" class=\"save-button\" [disabled]=\"!(canSaveForm())\"\r\n (click)=\"saveForm()\">\r\n\r\n <mat-icon>\r\n {{(isNewForm()) ? 'save' : 'update'}}\r\n </mat-icon>\r\n\r\n @if (selectFormBuilderIsBusy()) {\r\n {{(isNewForm()) ? '..Saving new form' : '..Updating Form'}}\r\n } @else {\r\n {{(isNewForm()) ? 'Save' : 'Update'}}\r\n }\r\n </button>\r\n\r\n <!-- Updated time info -->\r\n @if (!(isNewForm())) {\r\n <div class=\"updated-time\">\r\n <mat-icon>update</mat-icon>\r\n <span>Updated {{ selectFormUpdated() }}</span>\r\n </div>\r\n }\r\n </mat-toolbar>\r\n</header>\r\n\r\n<!-- Main content with optimized loading -->\r\n@defer (on viewport) {\r\n<div class=\"container\">\r\n <div class=\"middle\">\r\n <br>\r\n @if (selectLoadingForm()) {\r\n <div class=\"loading-container\">\r\n <mat-spinner />\r\n </div>\r\n } @else {\r\n <app-form-section-stepper />\r\n }\r\n <br>\r\n @if ((hasMissingConfigs()) && !(selectLoadingForm())) {\r\n <app-missing-form-configs />\r\n }\r\n </div>\r\n\r\n @if (elementEditorOpen()) {\r\n <app-input-editor style=\"max-width:480px;height:calc(100vh - 64px);z-index:1\" cdkDrag cdkDragBoundary=\"container\" class=\"middle editor-container\" />\r\n }\r\n <!-- Missing fields section -->`\r\n\r\n\r\n</div>\r\n}@placeholder {\r\n <div style=\"padding: 50px;display:flex;justify-content:center;align-items:center; text-align: center;\">\r\n <mat-spinner diameter=\"50\" />\r\n </div>\r\n}", styles: [".container{display:flex;width:100%;height:calc(100% - 64px)}.side{width:100px;background-color:#f8d7da}.middle{flex-grow:1;height:100%;overflow:auto;background-color:none}.section-title-input{border:none;background-color:transparent;font-size:16px;font-weight:600;color:#fff;padding-top:12px;padding-bottom:12px;outline:none;min-width:268px;transition:border-bottom-color .3s ease-in-out}.section-title-input:focus{border-bottom:1px solid #ffffff}.missing-fields{position:fixed;bottom:0}.updated-time{display:flex;gap:8px;align-items:center;line-height:normal;font-size:14px;bottom:0;position:absolute;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:8px;border-radius:4px}.nav-group{display:flex;align-items:center;gap:8px}.save-button{margin-left:8px;min-width:168px}.loading-container{display:flex;height:calc(100% - 150px);justify-content:center;align-items:center}.editor-container{max-width:500px}.divider{margin:0 8px;opacity:.5}app-missing-form-configs{position:absolute;bottom:0;right:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type:
|
|
4937
|
+
], ngImport: i0, template: "<header>\r\n <mat-toolbar color=\"primary\">\r\n @if (closeButton) {\r\n <button mat-icon-button [style.color]=\"closeButton.color\" (click)=\"closeButton.onClick()\">\r\n <mat-icon>{{closeButton.icon}}</mat-icon>\r\n </button>\r\n }\r\n\r\n <!-- Navigation group -->\r\n <div class=\"nav-group\">\r\n <button mat-button routerLink=\"/\">Forms</button>\r\n <mat-icon>navigate_next</mat-icon>\r\n </div>\r\n\r\n <!-- Title input with optimized binding -->\r\n @if (selectHasFormId()) {\r\n <input [(ngModel)]=\"titleValue\" class=\"section-title-input\" placeholder=\"Enter Form Title\">\r\n }\r\n\r\n <span class=\"spacer\"></span>\r\n\r\n @defer (on viewport) {\r\n <app-forms-builder-menu />\r\n } @placeholder {\r\n <div style=\"padding: 50px;display:flex;justify-content:center;align-items:center; text-align: center;\">\r\n <mat-spinner diameter=\"20\" />\r\n </div>\r\n\r\n }\r\n\r\n <span class=\"divider\">|</span>\r\n\r\n <!-- Save/Update button with optimized reactive state -->\r\n <button mat-raised-button color=\"accent\" class=\"save-button\" [disabled]=\"!(canSaveForm())\"\r\n (click)=\"saveForm()\">\r\n\r\n <mat-icon>\r\n {{(isNewForm()) ? 'save' : 'update'}}\r\n </mat-icon>\r\n\r\n @if (selectFormBuilderIsBusy()) {\r\n {{(isNewForm()) ? '..Saving new form' : '..Updating Form'}}\r\n } @else {\r\n {{(isNewForm()) ? 'Save' : 'Update'}}\r\n }\r\n </button>\r\n\r\n <!-- Updated time info -->\r\n @if (!(isNewForm())) {\r\n <div class=\"updated-time\">\r\n <mat-icon>update</mat-icon>\r\n <span>Updated {{ selectFormUpdated() }}</span>\r\n </div>\r\n }\r\n </mat-toolbar>\r\n</header>\r\n\r\n<!-- Main content with optimized loading -->\r\n@defer (on viewport) {\r\n<div class=\"container\">\r\n <div class=\"middle\">\r\n <br>\r\n @if (selectLoadingForm()) {\r\n <div class=\"loading-container\">\r\n <mat-spinner />\r\n </div>\r\n } @else {\r\n <app-form-section-stepper />\r\n }\r\n <br>\r\n @if ((hasMissingConfigs()) && !(selectLoadingForm())) {\r\n <app-missing-form-configs />\r\n }\r\n </div>\r\n\r\n @if (elementEditorOpen()) {\r\n <app-input-editor style=\"max-width:480px;height:calc(100vh - 64px);z-index:1\" cdkDrag cdkDragBoundary=\"container\" class=\"middle editor-container\" />\r\n }\r\n <!-- Missing fields section -->`\r\n\r\n\r\n</div>\r\n}@placeholder {\r\n <div style=\"padding: 50px;display:flex;justify-content:center;align-items:center; text-align: center;\">\r\n <mat-spinner diameter=\"50\" />\r\n </div>\r\n}", styles: [".container{display:flex;width:100%;height:calc(100% - 64px)}.side{width:100px;background-color:#f8d7da}.middle{flex-grow:1;height:100%;overflow:auto;background-color:none}.section-title-input{border:none;background-color:transparent;font-size:16px;font-weight:600;color:#fff;padding-top:12px;padding-bottom:12px;outline:none;min-width:268px;transition:border-bottom-color .3s ease-in-out}.section-title-input:focus{border-bottom:1px solid #ffffff}.missing-fields{position:fixed;bottom:0}.updated-time{display:flex;gap:8px;align-items:center;line-height:normal;font-size:14px;bottom:0;position:absolute;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:8px;border-radius:4px}.nav-group{display:flex;align-items:center;gap:8px}.save-button{margin-left:8px;min-width:168px}.loading-container{display:flex;height:calc(100% - 150px);justify-content:center;align-items:center}.editor-container{max-width:500px}.divider{margin:0 8px;opacity:.5}app-missing-form-configs{position:absolute;bottom:0;right:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: i9.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], deferBlockDependencies: [() => [import('./ngx-t-forms-forms-builder-menu.component-CNNd7BqK.mjs').then(m => m.FormsBuilderMenuComponent)], () => [i2$1.CdkDrag, i7.MatProgressSpinner, import('./ngx-t-forms-input-editor.component-hf6AapZI.mjs').then(m => m.InputEditorComponent), import('./ngx-t-forms-form-section-stepper.component-DlvXkLBk.mjs').then(m => m.FormSectionStepperComponent), import('./ngx-t-forms-missing-form-configs.component-fAU-JAr1.mjs').then(m => m.MissingFormConfigsComponent)]] }); }
|
|
4929
4938
|
}
|
|
4930
|
-
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "19.2.2", ngImport: i0, type: FormBuilderComponent, resolveDeferredDeps: () => [import('./ngx-t-forms-forms-builder-menu.component-
|
|
4939
|
+
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "19.2.2", ngImport: i0, type: FormBuilderComponent, resolveDeferredDeps: () => [import('./ngx-t-forms-forms-builder-menu.component-CNNd7BqK.mjs').then(m => m.FormsBuilderMenuComponent), import('./ngx-t-forms-input-editor.component-hf6AapZI.mjs').then(m => m.InputEditorComponent), import('./ngx-t-forms-form-section-stepper.component-DlvXkLBk.mjs').then(m => m.FormSectionStepperComponent), import('./ngx-t-forms-missing-form-configs.component-fAU-JAr1.mjs').then(m => m.MissingFormConfigsComponent)], resolveMetadata: (FormsBuilderMenuComponent, InputEditorComponent, FormSectionStepperComponent, MissingFormConfigsComponent) => ({ decorators: [{
|
|
4931
4940
|
type: Component,
|
|
4932
4941
|
args: [{ selector: 'app-form-builder', standalone: true, imports: [CommonModule,
|
|
4933
4942
|
MatModulesModule,
|
|
@@ -5089,7 +5098,7 @@ class FormsComponent {
|
|
|
5089
5098
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: FormsComponent, deps: [{ token: i1$3.ActivatedRoute }, { token: FormsStoreService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5090
5099
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: FormsComponent, isStandalone: true, selector: "app-forms", providers: [
|
|
5091
5100
|
FormsStoreService,
|
|
5092
|
-
], ngImport: i0, template: "<header>\r\n <mat-toolbar class=\"app-header\" color=\"primary\">\r\n @if(closeButton){\r\n <button mat-icon-button [style.color]=\"closeButton.color\" (click)=\"closeButton.onClick()\">\r\n <mat-icon>{{closeButton.icon}}</mat-icon>\r\n </button>\r\n }\r\n <span class=\"app-title\">Form List</span>\r\n\r\n\r\n <span class=\"flex-spacer\"></span>\r\n @for (section of formListSections; track section.value) {\r\n @if(section.value === (selectFormListSection$|async)){\r\n <button mat-flat-button (click)=\"setSection(section.value)\">\r\n <span>{{section.label}}</span>\r\n </button>\r\n }@else {\r\n <button mat-button (click)=\"setSection(section.value)\" >\r\n <span>{{section.label}}</span>\r\n </button>\r\n }\r\n }\r\n <span class=\"flex-spacer\"></span>\r\n <button mat-raised-button color=\"accent\" (click)=\"addNewForm()\" class=\"action-button\"\r\n aria-label=\"Create new form\">\r\n <mat-icon>add</mat-icon>\r\n <span>Add Form</span>\r\n </button>\r\n </mat-toolbar>\r\n</header>\r\n\r\n<div class=\"content-container\">\r\n\r\n @if((selectErrors$ |async)?.['LoadForms']){\r\n <div class=\"error-container mat-elevation-z2\">\r\n <div class=\"error-content\">\r\n <mat-icon class=\"error-icon\" color=\"warn\">error_outline</mat-icon>\r\n <span class=\"error-message\">{{(selectErrors$ |async)?.['LoadForms']}}</span>\r\n <button mat-icon-button class=\"refresh-button\" (click)=\"loadForms()\" aria-label=\"Retry\">\r\n <mat-icon>refresh</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n }\r\n\r\n\r\n @if (selectLoadingForms$ | async) {\r\n <div class=\"loading-container\">\r\n\r\n <span>\r\n <mat-spinner style=\" margin: auto;\"></mat-spinner>\r\n <span style=\"position: relative;text-align: center;\">\r\n <br>\r\n Loading forms...\r\n\r\n </span>\r\n\r\n\r\n\r\n </span>\r\n\r\n\r\n </div>\r\n } @else {\r\n @if ((selectFormsList$ | async)?.length === 0) {\r\n <div class=\"empty-container\">\r\n <img src=\"https://res.cloudinary.com/glick/image/upload/v1738529610/ngx-t-forms/Blank_canvas-cuate_v7rpe0.svg\" alt=\"\">\r\n <p style=\"font-style: italic;\">\r\n <strong >\r\n No forms available.\r\n </strong>\r\n \r\n </p>\r\n </div>\r\n \r\n \r\n \r\n }\r\n <mat-nav-list class=\"forms-list\">\r\n \r\n @for (form of (selectFormsList$ | async) ?? []; track form._id) {\r\n\r\n <mat-list-item \r\n \r\n (click)=\"editForm(form)\"\r\n [disabled]=\"form.busy\"\r\n [class.archived]=\"form.archived\"\r\n [class.mat-elevation-z1]=\"activeForm !== form._id\" \r\n [class.mat-elevation-z2]=\"activeForm === form._id\"\r\n (mouseover)=\"activeForm = form._id\"\r\n (mouseleave)=\"activeForm = null\" \r\n class=\"form-list-item\">\r\n @if (form.busy) {\r\n <mat-spinner style=\"position: absolute; margin-left: 12px;\" matListItemAvatar [diameter]=\"48\"></mat-spinner>\r\n }\r\n\r\n <img [class.error]=\"form.errors.length > 0\" matListItemAvatar [src]=\"getFormAvatar(form.formTitle)\"\r\n [alt]=\"'form image ' + form.formTitle\">\r\n <div matListItemTitle class=\"form-item-content\">\r\n <div class=\"form-title\">{{ form.formTitle | titlecase }}</div>\r\n <div class=\"form-metadata\">\r\n\r\n @if(form.errors.length > 0) {\r\n <span><mat-icon \r\n [matTooltip]=\"form.errors.length + ' error(s) found in this form'\"\r\n color=\"warn\">error</mat-icon> <small>{{ form.errors.length}}</small></span>\r\n <span class=\"metadata-divider\">\u2022</span>\r\n }\r\n <span><mat-icon>add_circle_outline</mat-icon> <small>{{ form.createdAt | daysAgo }}</small> </span>\r\n <span class=\"metadata-divider\">\u2022</span>\r\n <span><mat-icon>update</mat-icon><small> {{ form.updatedAt | daysAgo }}</small></span>\r\n\r\n\r\n\r\n </div>\r\n </div>\r\n @if (activeForm === form._id) {\r\n <span class=\"form-actions\" matListItemMeta>\r\n\r\n @if(!form.archived){\r\n <button mat-icon-button color=\"warn\" (click)=\"archive(form,$event)\"\r\n matTooltip=\"Archiving a form will affect all the workflows it is linked to. Make sure to review and update all workflow configurations accordingly.\"\r\n aria-label=\"Archive form\">\r\n\r\n <mat-icon>archive</mat-icon>\r\n </button>\r\n }@else {\r\n <button mat-icon-button (click)=\"delete(form,$event)\" color=\"warn\" \r\n matTooltip=\"Permanently delete a form. This action cannot be undone.\"\r\n aria-label=\"Restore form\">\r\n <mat-icon>\r\n delete_forever\r\n </mat-icon>\r\n </button>\r\n <button mat-icon-button color=\"primary\" (click)=\"unarchive(form,$event)\"\r\n matTooltip=\"Restore a form will make it available for use in workflows.\"\r\n aria-label=\"Restore form\">\r\n <mat-icon>unarchive</mat-icon>\r\n </button>\r\n }\r\n \r\n\r\n </span>\r\n }\r\n </mat-list-item>\r\n }\r\n </mat-nav-list>\r\n }\r\n\r\n</div>", styles: [".app-header{box-shadow:0 2px 4px #0000001f;position:fixed;top:0;z-index:1000}.app-title{margin-left:4px;font-weight:500}.content-container{max-width:1440px;margin:84px auto 0;padding:0 24px}.page-toolbar{background:none;padding:0;height:64px;margin-bottom:24px}.action-button .mat-icon{margin-right:8px}.forms-list{background:none;box-shadow:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(312px,1fr));grid-auto-rows:min-content;gap:12px;padding:16px;width:100%;min-height:calc(100vh - 172px)}.form-list-item{margin:0;border-radius:8px!important;border:solid 1px var(--mat-divider-color, var(--mat-sys-outline))!important;transition:background-color .2s ease;background:var(--mdc-elevated-card-container-color, var(--mat-app-surface-container-low));height:fit-content!important;min-width:280px;max-width:none}.form-item-content{padding:16px 0}.form-title{margin-bottom:0}.form-metadata{color:#0009;font-size:14px;line-height:normal;display:flex}.form-metadata .metadata-divider{margin:0 8px}.form-metadata span{display:inline-flex;gap:4px}.form-metadata span mat-icon{font-size:14px;height:14px;width:14px}.loading-container{display:flex;justify-content:center;align-items:center;padding:48px 0}.flex-spacer{flex:1 1 auto}.active-link{background-color:#0000000d}@media screen and (max-width: 599px){.forms-list{grid-template-columns:1fr;padding:8px}.form-list-item{width:100%;max-width:100%}.content-container{padding:0 16px}}.error{border:solid #f44336 1px}.error-container{background-color:#fef2f2;border-radius:8px;border-left:4px solid #ef4444;padding:16px;margin:16px 0;transition:all .2s ease-in-out;position:relative}.error-container:hover{transform:translateY(-1px);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.error-content{display:flex;align-items:center;gap:12px}.error-icon{flex-shrink:0;font-size:24px;height:24px;width:24px}.error-message{flex-grow:1;color:#f44336;font-size:14px;line-height:1.5;margin:0}.refresh-button{flex-shrink:0;color:#f44336;opacity:.8;transition:opacity .2s ease-in-out}.refresh-button:hover{opacity:1;background-color:#991b1b0a}.archived{opacity:.6!important}.archived:hover{opacity:1!important}.empty-container{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;max-width:500px;margin:auto;gap:16px;background:#ffffff52;box-shadow:0 4px 30px #0000001a;backdrop-filter:blur(8.2px);-webkit-backdrop-filter:blur(8.2px);border:1px solid rgba(255,255,255,.77);aspect-ratio:1;width:350px;height:430px;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$
|
|
5101
|
+
], ngImport: i0, template: "<header>\r\n <mat-toolbar class=\"app-header\" color=\"primary\">\r\n @if(closeButton){\r\n <button mat-icon-button [style.color]=\"closeButton.color\" (click)=\"closeButton.onClick()\">\r\n <mat-icon>{{closeButton.icon}}</mat-icon>\r\n </button>\r\n }\r\n <span class=\"app-title\">Form List</span>\r\n\r\n\r\n <span class=\"flex-spacer\"></span>\r\n @for (section of formListSections; track section.value) {\r\n @if(section.value === (selectFormListSection$|async)){\r\n <button mat-flat-button (click)=\"setSection(section.value)\">\r\n <span>{{section.label}}</span>\r\n </button>\r\n }@else {\r\n <button mat-button (click)=\"setSection(section.value)\" >\r\n <span>{{section.label}}</span>\r\n </button>\r\n }\r\n }\r\n <span class=\"flex-spacer\"></span>\r\n <button mat-raised-button color=\"accent\" (click)=\"addNewForm()\" class=\"action-button\"\r\n aria-label=\"Create new form\">\r\n <mat-icon>add</mat-icon>\r\n <span>Add Form</span>\r\n </button>\r\n </mat-toolbar>\r\n</header>\r\n\r\n<div class=\"content-container\">\r\n\r\n @if((selectErrors$ |async)?.['LoadForms']){\r\n <div class=\"error-container mat-elevation-z2\">\r\n <div class=\"error-content\">\r\n <mat-icon class=\"error-icon\" color=\"warn\">error_outline</mat-icon>\r\n <span class=\"error-message\">{{(selectErrors$ |async)?.['LoadForms']}}</span>\r\n <button mat-icon-button class=\"refresh-button\" (click)=\"loadForms()\" aria-label=\"Retry\">\r\n <mat-icon>refresh</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n }\r\n\r\n\r\n @if (selectLoadingForms$ | async) {\r\n <div class=\"loading-container\">\r\n\r\n <span>\r\n <mat-spinner style=\" margin: auto;\"></mat-spinner>\r\n <span style=\"position: relative;text-align: center;\">\r\n <br>\r\n Loading forms...\r\n\r\n </span>\r\n\r\n\r\n\r\n </span>\r\n\r\n\r\n </div>\r\n } @else {\r\n @if ((selectFormsList$ | async)?.length === 0) {\r\n <div class=\"empty-container\">\r\n <img src=\"https://res.cloudinary.com/glick/image/upload/v1738529610/ngx-t-forms/Blank_canvas-cuate_v7rpe0.svg\" alt=\"\">\r\n <p style=\"font-style: italic;\">\r\n <strong >\r\n No forms available.\r\n </strong>\r\n \r\n </p>\r\n </div>\r\n \r\n \r\n \r\n }\r\n <mat-nav-list class=\"forms-list\">\r\n \r\n @for (form of (selectFormsList$ | async) ?? []; track form._id) {\r\n\r\n <mat-list-item \r\n \r\n (click)=\"editForm(form)\"\r\n [disabled]=\"form.busy\"\r\n [class.archived]=\"form.archived\"\r\n [class.mat-elevation-z1]=\"activeForm !== form._id\" \r\n [class.mat-elevation-z2]=\"activeForm === form._id\"\r\n (mouseover)=\"activeForm = form._id\"\r\n (mouseleave)=\"activeForm = null\" \r\n class=\"form-list-item\">\r\n @if (form.busy) {\r\n <mat-spinner style=\"position: absolute; margin-left: 12px;\" matListItemAvatar [diameter]=\"48\"></mat-spinner>\r\n }\r\n\r\n <img [class.error]=\"form.errors.length > 0\" matListItemAvatar [src]=\"getFormAvatar(form.formTitle)\"\r\n [alt]=\"'form image ' + form.formTitle\">\r\n <div matListItemTitle class=\"form-item-content\">\r\n <div class=\"form-title\">{{ form.formTitle | titlecase }}</div>\r\n <div class=\"form-metadata\">\r\n\r\n @if(form.errors.length > 0) {\r\n <span><mat-icon \r\n [matTooltip]=\"form.errors.length + ' error(s) found in this form'\"\r\n color=\"warn\">error</mat-icon> <small>{{ form.errors.length}}</small></span>\r\n <span class=\"metadata-divider\">\u2022</span>\r\n }\r\n <span><mat-icon>add_circle_outline</mat-icon> <small>{{ form.createdAt | daysAgo }}</small> </span>\r\n <span class=\"metadata-divider\">\u2022</span>\r\n <span><mat-icon>update</mat-icon><small> {{ form.updatedAt | daysAgo }}</small></span>\r\n\r\n\r\n\r\n </div>\r\n </div>\r\n @if (activeForm === form._id) {\r\n <span class=\"form-actions\" matListItemMeta>\r\n\r\n @if(!form.archived){\r\n <button mat-icon-button color=\"warn\" (click)=\"archive(form,$event)\"\r\n matTooltip=\"Archiving a form will affect all the workflows it is linked to. Make sure to review and update all workflow configurations accordingly.\"\r\n aria-label=\"Archive form\">\r\n\r\n <mat-icon>archive</mat-icon>\r\n </button>\r\n }@else {\r\n <button mat-icon-button (click)=\"delete(form,$event)\" color=\"warn\" \r\n matTooltip=\"Permanently delete a form. This action cannot be undone.\"\r\n aria-label=\"Restore form\">\r\n <mat-icon>\r\n delete_forever\r\n </mat-icon>\r\n </button>\r\n <button mat-icon-button color=\"primary\" (click)=\"unarchive(form,$event)\"\r\n matTooltip=\"Restore a form will make it available for use in workflows.\"\r\n aria-label=\"Restore form\">\r\n <mat-icon>unarchive</mat-icon>\r\n </button>\r\n }\r\n \r\n\r\n </span>\r\n }\r\n </mat-list-item>\r\n }\r\n </mat-nav-list>\r\n }\r\n\r\n</div>", styles: [".app-header{box-shadow:0 2px 4px #0000001f;position:fixed;top:0;z-index:1000}.app-title{margin-left:4px;font-weight:500}.content-container{max-width:1440px;margin:84px auto 0;padding:0 24px}.page-toolbar{background:none;padding:0;height:64px;margin-bottom:24px}.action-button .mat-icon{margin-right:8px}.forms-list{background:none;box-shadow:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(312px,1fr));grid-auto-rows:min-content;gap:12px;padding:16px;width:100%;min-height:calc(100vh - 172px)}.form-list-item{margin:0;border-radius:8px!important;border:solid 1px var(--mat-divider-color, var(--mat-sys-outline))!important;transition:background-color .2s ease;background:var(--mdc-elevated-card-container-color, var(--mat-app-surface-container-low));height:fit-content!important;min-width:280px;max-width:none}.form-item-content{padding:16px 0}.form-title{margin-bottom:0}.form-metadata{color:#0009;font-size:14px;line-height:normal;display:flex}.form-metadata .metadata-divider{margin:0 8px}.form-metadata span{display:inline-flex;gap:4px}.form-metadata span mat-icon{font-size:14px;height:14px;width:14px}.loading-container{display:flex;justify-content:center;align-items:center;padding:48px 0}.flex-spacer{flex:1 1 auto}.active-link{background-color:#0000000d}@media screen and (max-width: 599px){.forms-list{grid-template-columns:1fr;padding:8px}.form-list-item{width:100%;max-width:100%}.content-container{padding:0 16px}}.error{border:solid #f44336 1px}.error-container{background-color:#fef2f2;border-radius:8px;border-left:4px solid #ef4444;padding:16px;margin:16px 0;transition:all .2s ease-in-out;position:relative}.error-container:hover{transform:translateY(-1px);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.error-content{display:flex;align-items:center;gap:12px}.error-icon{flex-shrink:0;font-size:24px;height:24px;width:24px}.error-message{flex-grow:1;color:#f44336;font-size:14px;line-height:1.5;margin:0}.refresh-button{flex-shrink:0;color:#f44336;opacity:.8;transition:opacity .2s ease-in-out}.refresh-button:hover{opacity:1;background-color:#991b1b0a}.archived{opacity:.6!important}.archived:hover{opacity:1!important}.empty-container{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;max-width:500px;margin:auto;gap:16px;background:#ffffff52;box-shadow:0 4px 30px #0000001a;backdrop-filter:blur(8.2px);-webkit-backdrop-filter:blur(8.2px);border:1px solid rgba(255,255,255,.77);aspect-ratio:1;width:350px;height:430px;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2$2.TitleCasePipe, name: "titlecase" }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i6.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i6.MatListItemAvatar, selector: "[matListItemAvatar]" }, { kind: "directive", type: i6.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "directive", type: i6.MatListItemMeta, selector: "[matListItemMeta]" }, { kind: "component", type: i7.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: i9.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: DaysAgoPipe, name: "daysAgo" }, { kind: "ngmodule", type: RouterModule }] }); }
|
|
5093
5102
|
}
|
|
5094
5103
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: FormsComponent, decorators: [{
|
|
5095
5104
|
type: Component,
|
|
@@ -5268,9 +5277,9 @@ class TDynamicDataEditComponent {
|
|
|
5268
5277
|
}
|
|
5269
5278
|
}
|
|
5270
5279
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: TDynamicDataEditComponent, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5271
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: TDynamicDataEditComponent, isStandalone: true, selector: "lib-t-dynamic-data-edit", inputs: { editorConfig: "editorConfig", formInputs: "formInputs", data: "data", validationErrors: "validationErrors" }, outputs: { valueChange: "valueChange", blur: "blur" }, ngImport: i0, template: "@defer {\r\n <ng-container *ngIf=\"( vm$ |async) as vm\" >\r\n\r\n <mat-form-field appearance=\"outline\"\r\n [color]=\"((validationErrors)||[]||[]).length>0 ? 'warn' : 'primary'\"\r\n [floatLabel]=\"'always'\" [subscriptSizing]=\"'dynamic'\"\r\n [hintLabel]=\"vm.editorConfigValue?.hint||''\">\r\n <mat-label> {{ (vm. editorConfigValue)?.label + ((vm. editorConfigValue)?.required ? '*' : '')}} </mat-label>\r\n \r\n @switch ((vm. editorConfigValue)?.editType) {\r\n @default {\r\n <input \r\n (blur)=\"elementBlur($event)\" \r\n (input)=\"inputChange($event)\" \r\n [disabled]=\"(vm.disabled)\"\r\n [value]=\"(vm.value)\" matInput \r\n \r\n [placeholder]=\"(vm. editorConfigValue)?.placeholder ||'Enter value'\">\r\n \r\n \r\n }\r\n @case ( elementEditorTypes.Toggle) {\r\n <lib-mat-slider-toggle-editor \r\n [name]=\"((vm. editorConfigValue)?.name||'') \" \r\n [label]=\"((vm. editorConfigValue)?.label||'')\"\r\n \r\n (valueChange)=\"valueChanged(!!$event)\" [value]=\"(vm.value)\" \r\n [errors]=\"(validationErrors)||[]\">\r\n </lib-mat-slider-toggle-editor>\r\n \r\n }\r\n \r\n @case (elementEditorTypes.Range) {\r\n \r\n \r\n <lib-mat-slider-editor [format]=\"( vm.editorConfigValue)?.format \" [formatLabel]=\" formatLabel\"\r\n [max]=\"( vm.editorConfigValue)?.max || 100\" [value]=\"(vm.value)\" [errors]=\"(validationErrors)||[]\"\r\n [min]=\"( vm.editorConfigValue)?.min || 0\" (valueChange)=\"inputChange($event)\"\r\n [step]=\"( vm.editorConfigValue)?.step || 1\" tickInterval=\"( vm.editorConfigValue)?.step || 1\">\r\n \r\n \r\n </lib-mat-slider-editor>\r\n \r\n \r\n \r\n }\r\n \r\n @case (elementEditorTypes.ChipSelect) {\r\n <lib-mat-chip-list-editor [options]=\"(vm.editorConfigValue)?.options\" [required]=\"!!( vm.editorConfigValue)?.required\"\r\n [value]=\"(vm.value)\" [errors]=\"(validationErrors)||[]\" (valueChange)=\" valueChanged($event)\"></lib-mat-chip-list-editor>\r\n \r\n }\r\n \r\n @case (elementEditorTypes.OptionSelect) {\r\n \r\n <mat-select [value]=\"(vm.value)\" (selectionChange)=\"valueChanged($event.value)\">\r\n @for(option of ( vm.editorConfigValue)?.options;track option.value){\r\n <mat-option [value]=\"option.value\">{{option.label}}</mat-option>\r\n }\r\n </mat-select>\r\n \r\n }\r\n <!--\r\n @case (elementEditorTypes.RichTextEditor) {\r\n <p>\r\n Not implemented yet\r\n </p>\r\n }\r\n --->\r\n \r\n @case (elementEditorTypes.SelectionOptions) {\r\n \r\n <app-selection-options-editor [errors]=\"(validationErrors)||[]\" [id]=\"((vm.editorConfigValue)?.label||'')+((vm.editorConfigValue)?.editType||'')\"\r\n [options]=\"(vm.value) || []\" (valueChanged)=\"valueChanged($event)\"></app-selection-options-editor>\r\n }\r\n \r\n @case (\r\n elementEditorTypes.ApiCall) {\r\n \r\n <lib-rest-api-call-setup \r\n [postmanCollectionConfig]=\"(vm.editorConfigValue)?.postmanCollectionConfig\"\r\n [httpGetDataFunction]=\"(vm.editorConfigValue)?.httpGetDataFunction\"\r\n [id]=\"((vm.editorConfigValue)?.label||'')+((vm.editorConfigValue)?.editType||'')\" [value]=\"(vm.value)\" [errors]=\"(validationErrors)||[]\"\r\n (valueChanged)=\"valueChanged($event)\">\r\n \r\n </lib-rest-api-call-setup>\r\n }\r\n \r\n @case (elementEditorTypes.MongoPipelineBuilder) {\r\n \r\n <app-pipeline-generator [id]=\"((vm.editorConfigValue)?.label||'')+((vm.editorConfigValue)?.editType||'')\" [value]=\"(vm.value)\"\r\n [errors]=\"(validationErrors)||[]\" [getWorkflowOptions]=\"getWorkflowOptions$\"\r\n (valueChanged)=\"valueChanged($event)\"></app-pipeline-generator>\r\n \r\n }\r\n @case (elementEditorTypes.ApiValueAccessRules) {\r\n \r\n \r\n \r\n <app-api-value-access-rules \r\n [id]=\"((vm.editorConfigValue)?.label||'')+((vm.editorConfigValue)?.editType||'')\" [value]=\"(vm.value)\"\r\n [errors]=\"(validationErrors)||[]\" [formInputs]=\"formInputs ||[]\" \r\n [postmanCollectionConfig]=\"(vm.editorConfigValue)?.postmanCollectionConfig\"\r\n \r\n [mapToData]=\"vm.dataOptions\"\r\n (valueChanged)=\"valueChanged($event)\">\r\n </app-api-value-access-rules>\r\n \r\n }\r\n \r\n @case (elementEditorTypes.FormInputSelector)\r\n {\r\n \r\n <lib-form-input-selector [formInputs]=\"formInputs ||[]\" [errors]=\"(validationErrors)||[]\" [value]=\"(vm.value) || []\"\r\n (change)=\"valueChanged($event)\">\r\n </lib-form-input-selector>\r\n }\r\n \r\n @case (\r\n elementEditorTypes.RequiredInputs\r\n ){\r\n \r\n <app-required-inputs [formInputs]=\"formInputs ||[]\" [id]=\"((vm.editorConfigValue)?.label||'')+((vm.editorConfigValue)?.editType||'')\"\r\n [value]=\"(vm.value)\" [errors]=\"(validationErrors)||[]\" (valueChanged)=\"valueChanged($event)\">\r\n </app-required-inputs>\r\n }\r\n \r\n @case(elementEditorTypes.CalculatedFieldRules){\r\n \r\n <app-calculated-field-rules [formInputs]=\"formInputs ||[]\"\r\n [id]=\"((vm.editorConfigValue)?.label||'')+((vm.editorConfigValue)?.editType||'')\" [value]=\"(vm.value)\" [errors]=\"(validationErrors)||[]\"\r\n (valueChanged)=\"valueChanged($event)\" [mapToData]=\"vm.dataOptions\"></app-calculated-field-rules>\r\n }\r\n \r\n @case(elementEditorTypes.Validators){\r\n \r\n <app-validators-config [id]=\"((vm.editorConfigValue)?.label||'')+((vm.editorConfigValue)?.editType||'')\" [value]=\"(vm.value)\"\r\n [errors]=\"(validationErrors)||[]\" (valueChanged)=\"valueChanged($event)\" [formInputs]=\"formInputs ||[]\"\r\n [mapToData]=\"vm.dataOptions\">\r\n </app-validators-config>\r\n \r\n }\r\n @case(elementEditorTypes.ConfigMscoaSegments){\r\n \r\n <app-mscoa-segment-config [value]=\"(vm.value)\" [errors]=\"(validationErrors)||[]\" [getMscoaTree]=\"getMscoaTree$\"\r\n [showAllSegments]=\"vm.dataOptions\" (valueChanged)=\"valueChanged($event)\"></app-mscoa-segment-config>\r\n }\r\n @case(elementEditorTypes.ConfigMscoaAdditionalInputs){\r\n \r\n <app-config-mscoa-additional-inputs [id]=\"((vm.editorConfigValue)?.label||'')+((vm.editorConfigValue)?.editType||'')\"\r\n [value]=\"(vm.value)\" [errors]=\"(validationErrors)||[]\" [getMscoaTree]=\"getMscoaTree$\"\r\n (valueChanged)=\"valueChanged($event)\">\r\n </app-config-mscoa-additional-inputs>\r\n \r\n }\r\n }\r\n \r\n <button [matTooltip]=\"blurFunctionTooltip((vm.editorConfigValue)?.blurHandle)\" *ngIf=\"(vm.inputHasBlurFunction)\"\r\n [disabled]=\"(vm.disabled)\" [color]=\"blurOff?'':'primary'\" (click)=\"blurOff=!blurOff\" matSuffix\r\n mat-icon-button>\r\n <mat-icon>{{\r\n blurOff?'blur_off':'blur_on'\r\n }}\r\n \r\n \r\n </mat-icon>\r\n </button>\r\n </mat-form-field>\r\n\r\n \r\n <mat-error style=\" font-size: 12px;\r\n margin-left: 14px;\r\n \" *ngFor=\"let error of (validationErrors)||[]\">\r\n \r\n {{error.message}}</mat-error>\r\n \r\n </ng-container>\r\n \r\n}@error {\r\n <mat-card>\r\n <mat-card-content>\r\n \r\n <span> \r\n Failed to load form inputs\r\n </span>\r\n </mat-card-content>\r\n </mat-card>\r\n }\r\n\r\n\r\n\r\n<!-- - \r\n `TableConfigSetup`\r\n- `ConditionalInputConfig`\r\n- `MatrixTable`-->", styles: [".showItemValue{opacity:.6}mat-form-field{width:100%}mat-slider{width:100%}.range{display:flex;align-items:center}label{line-height:normal;margin-top:12px;font-weight:500;font-size:12px;color:var(--mdc-filled-text-field-focus-label-text-color, var(--mat-app-primary));display:flex;justify-content:space-between;align-items:center}.elementInfo{display:flex;align-items:center;justify-content:center;padding:0;height:24px;width:24px}.infoIcon{font-size:16px;height:16px;width:16px}.toggle-label{margin-left:5px;align-items:center;display:flex;font-weight:500;line-height:normal;justify-content:space-between;color:var(--mdc-filled-text-field-focus-label-text-color, var(--mat-app-primary))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i3$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i3$1.MatCardContent, selector: "mat-card-content" }], deferBlockDependencies: [() => [i2$1.NgForOf, i2$1.NgIf, i2$1.AsyncPipe, import('./ngx-t-forms-selection-options-editor.component-zg8iAImG.mjs').then(m => m.SelectionOptionsEditorComponent), import('./ngx-t-forms-form-input-selector.component-BJm9gyXk.mjs').then(m => m.FormInputSelectorComponent), import('./ngx-t-forms-rest-api-call-setup.component-BY555_zO.mjs').then(m => m.RestApiCallSetupComponent), import('./ngx-t-forms-api-value-access-rules.component-pmyW-mx7.mjs').then(m => m.ApiValueAccessRulesComponent), import('./ngx-t-forms-required-inputs.component-DS-D1d89.mjs').then(m => m.RequiredInputsComponent), import('./ngx-t-forms-pipeline-generator.component-DGEidXgr.mjs').then(m => m.PipelineGeneratorComponent), import('./ngx-t-forms-calculated-field-rules.component-DP1UlCew.mjs').then(m => m.CalculatedFieldRulesComponent), import('./ngx-t-forms-validators-config.component-Dt5oXQcY.mjs').then(m => m.ValidatorsConfigComponent), import('./ngx-t-forms-config-mscoa-additional-inputs.component-CbZRg_zQ.mjs').then(m => m.ConfigMscoaAdditionalInputsComponent), import('./ngx-t-forms-mat-slider-editor.component-CYyAcNf2.mjs').then(m => m.MatSliderEditorComponent), import('./ngx-t-forms-mscoa-segment-config.component-DD9mv-Lb.mjs').then(m => m.MscoaSegmentConfigComponent), import('./ngx-t-forms-mat-slider-toggle-editor.component-DFlNcNXN.mjs').then(m => m.MatSliderToggleEditorComponent), import('./ngx-t-forms-mat-chip-list-editor.component-BgfStriH.mjs').then(m => m.MatChipListEditorComponent), i2$2.MatOption, i3.MatIconButton, i5.MatIcon, i4.MatFormField, i4.MatLabel, i4.MatError, i4.MatSuffix, i7.MatSelect, i8$1.MatTooltip, i5$1.MatInput]] }); }
|
|
5280
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: TDynamicDataEditComponent, isStandalone: true, selector: "lib-t-dynamic-data-edit", inputs: { editorConfig: "editorConfig", formInputs: "formInputs", data: "data", validationErrors: "validationErrors" }, outputs: { valueChange: "valueChange", blur: "blur" }, ngImport: i0, template: "@defer {\r\n <ng-container *ngIf=\"( vm$ |async) as vm\" >\r\n\r\n <mat-form-field appearance=\"outline\"\r\n [color]=\"((validationErrors)||[]||[]).length>0 ? 'warn' : 'primary'\"\r\n [floatLabel]=\"'always'\" [subscriptSizing]=\"'dynamic'\"\r\n [hintLabel]=\"vm.editorConfigValue?.hint||''\">\r\n <mat-label> {{ (vm. editorConfigValue)?.label + ((vm. editorConfigValue)?.required ? '*' : '')}} </mat-label>\r\n \r\n @switch ((vm. editorConfigValue)?.editType) {\r\n @default {\r\n <input \r\n (blur)=\"elementBlur($event)\" \r\n (input)=\"inputChange($event)\" \r\n [disabled]=\"(vm.disabled)\"\r\n [value]=\"(vm.value)\" matInput \r\n \r\n [placeholder]=\"(vm. editorConfigValue)?.placeholder ||'Enter value'\">\r\n \r\n \r\n }\r\n @case ( elementEditorTypes.Toggle) {\r\n <lib-mat-slider-toggle-editor \r\n [name]=\"((vm. editorConfigValue)?.name||'') \" \r\n [label]=\"((vm. editorConfigValue)?.label||'')\"\r\n \r\n (valueChange)=\"valueChanged(!!$event)\" [value]=\"(vm.value)\" \r\n [errors]=\"(validationErrors)||[]\">\r\n </lib-mat-slider-toggle-editor>\r\n \r\n }\r\n \r\n @case (elementEditorTypes.Range) {\r\n \r\n \r\n <lib-mat-slider-editor [format]=\"( vm.editorConfigValue)?.format \" [formatLabel]=\" formatLabel\"\r\n [max]=\"( vm.editorConfigValue)?.max || 100\" [value]=\"(vm.value)\" [errors]=\"(validationErrors)||[]\"\r\n [min]=\"( vm.editorConfigValue)?.min || 0\" (valueChange)=\"inputChange($event)\"\r\n [step]=\"( vm.editorConfigValue)?.step || 1\" tickInterval=\"( vm.editorConfigValue)?.step || 1\">\r\n \r\n \r\n </lib-mat-slider-editor>\r\n \r\n \r\n \r\n }\r\n \r\n @case (elementEditorTypes.ChipSelect) {\r\n <lib-mat-chip-list-editor [options]=\"(vm.editorConfigValue)?.options\" [required]=\"!!( vm.editorConfigValue)?.required\"\r\n [value]=\"(vm.value)\" [errors]=\"(validationErrors)||[]\" (valueChange)=\" valueChanged($event)\"></lib-mat-chip-list-editor>\r\n \r\n }\r\n \r\n @case (elementEditorTypes.OptionSelect) {\r\n \r\n <mat-select [value]=\"(vm.value)\" (selectionChange)=\"valueChanged($event.value)\">\r\n @for(option of ( vm.editorConfigValue)?.options;track option.value){\r\n <mat-option [value]=\"option.value\">{{option.label}}</mat-option>\r\n }\r\n </mat-select>\r\n \r\n }\r\n <!--\r\n @case (elementEditorTypes.RichTextEditor) {\r\n <p>\r\n Not implemented yet\r\n </p>\r\n }\r\n --->\r\n \r\n @case (elementEditorTypes.SelectionOptions) {\r\n \r\n <app-selection-options-editor [errors]=\"(validationErrors)||[]\" [id]=\"((vm.editorConfigValue)?.label||'')+((vm.editorConfigValue)?.editType||'')\"\r\n [options]=\"(vm.value) || []\" (valueChanged)=\"valueChanged($event)\"></app-selection-options-editor>\r\n }\r\n \r\n @case (\r\n elementEditorTypes.ApiCall) {\r\n \r\n <lib-rest-api-call-setup \r\n [postmanCollectionConfig]=\"(vm.editorConfigValue)?.postmanCollectionConfig\"\r\n [httpGetDataFunction]=\"(vm.editorConfigValue)?.httpGetDataFunction\"\r\n [id]=\"((vm.editorConfigValue)?.label||'')+((vm.editorConfigValue)?.editType||'')\" [value]=\"(vm.value)\" [errors]=\"(validationErrors)||[]\"\r\n (valueChanged)=\"valueChanged($event)\">\r\n \r\n </lib-rest-api-call-setup>\r\n }\r\n \r\n @case (elementEditorTypes.MongoPipelineBuilder) {\r\n \r\n <app-pipeline-generator [id]=\"((vm.editorConfigValue)?.label||'')+((vm.editorConfigValue)?.editType||'')\" [value]=\"(vm.value)\"\r\n [errors]=\"(validationErrors)||[]\" [getWorkflowOptions]=\"getWorkflowOptions$\"\r\n (valueChanged)=\"valueChanged($event)\"></app-pipeline-generator>\r\n \r\n }\r\n @case (elementEditorTypes.ApiValueAccessRules) {\r\n \r\n \r\n \r\n <app-api-value-access-rules \r\n [id]=\"((vm.editorConfigValue)?.label||'')+((vm.editorConfigValue)?.editType||'')\" [value]=\"(vm.value)\"\r\n [errors]=\"(validationErrors)||[]\" [formInputs]=\"formInputs ||[]\" \r\n [postmanCollectionConfig]=\"(vm.editorConfigValue)?.postmanCollectionConfig\"\r\n \r\n [mapToData]=\"vm.dataOptions\"\r\n (valueChanged)=\"valueChanged($event)\">\r\n </app-api-value-access-rules>\r\n \r\n }\r\n \r\n @case (elementEditorTypes.FormInputSelector)\r\n {\r\n \r\n <lib-form-input-selector [formInputs]=\"formInputs ||[]\" [errors]=\"(validationErrors)||[]\" [value]=\"(vm.value) || []\"\r\n (change)=\"valueChanged($event)\">\r\n </lib-form-input-selector>\r\n }\r\n \r\n @case (\r\n elementEditorTypes.RequiredInputs\r\n ){\r\n \r\n <app-required-inputs [formInputs]=\"formInputs ||[]\" [id]=\"((vm.editorConfigValue)?.label||'')+((vm.editorConfigValue)?.editType||'')\"\r\n [value]=\"(vm.value)\" [errors]=\"(validationErrors)||[]\" (valueChanged)=\"valueChanged($event)\">\r\n </app-required-inputs>\r\n }\r\n \r\n @case(elementEditorTypes.CalculatedFieldRules){\r\n \r\n <app-calculated-field-rules [formInputs]=\"formInputs ||[]\"\r\n [id]=\"((vm.editorConfigValue)?.label||'')+((vm.editorConfigValue)?.editType||'')\" [value]=\"(vm.value)\" [errors]=\"(validationErrors)||[]\"\r\n (valueChanged)=\"valueChanged($event)\" [mapToData]=\"vm.dataOptions\"></app-calculated-field-rules>\r\n }\r\n \r\n @case(elementEditorTypes.Validators){\r\n \r\n <app-validators-config [id]=\"((vm.editorConfigValue)?.label||'')+((vm.editorConfigValue)?.editType||'')\" [value]=\"(vm.value)\"\r\n [errors]=\"(validationErrors)||[]\" (valueChanged)=\"valueChanged($event)\" [formInputs]=\"formInputs ||[]\"\r\n [mapToData]=\"vm.dataOptions\">\r\n </app-validators-config>\r\n \r\n }\r\n @case(elementEditorTypes.ConfigMscoaSegments){\r\n \r\n <app-mscoa-segment-config [value]=\"(vm.value)\" [errors]=\"(validationErrors)||[]\" [getMscoaTree]=\"getMscoaTree$\"\r\n [showAllSegments]=\"vm.dataOptions\" (valueChanged)=\"valueChanged($event)\"></app-mscoa-segment-config>\r\n }\r\n @case(elementEditorTypes.ConfigMscoaAdditionalInputs){\r\n \r\n <app-config-mscoa-additional-inputs [id]=\"((vm.editorConfigValue)?.label||'')+((vm.editorConfigValue)?.editType||'')\"\r\n [value]=\"(vm.value)\" [errors]=\"(validationErrors)||[]\" [getMscoaTree]=\"getMscoaTree$\"\r\n (valueChanged)=\"valueChanged($event)\">\r\n </app-config-mscoa-additional-inputs>\r\n \r\n }\r\n }\r\n \r\n <button [matTooltip]=\"blurFunctionTooltip((vm.editorConfigValue)?.blurHandle)\" *ngIf=\"(vm.inputHasBlurFunction)\"\r\n [disabled]=\"(vm.disabled)\" [color]=\"blurOff?'':'primary'\" (click)=\"blurOff=!blurOff\" matSuffix\r\n mat-icon-button>\r\n <mat-icon>{{\r\n blurOff?'blur_off':'blur_on'\r\n }}\r\n \r\n \r\n </mat-icon>\r\n </button>\r\n </mat-form-field>\r\n\r\n \r\n <mat-error style=\" font-size: 12px;\r\n margin-left: 14px;\r\n \" *ngFor=\"let error of (validationErrors)||[]\">\r\n \r\n {{error.message}}</mat-error>\r\n \r\n </ng-container>\r\n \r\n}@error {\r\n <mat-card>\r\n <mat-card-content>\r\n \r\n <span> \r\n Failed to load form inputs\r\n </span>\r\n </mat-card-content>\r\n </mat-card>\r\n }\r\n\r\n\r\n\r\n<!-- - \r\n `TableConfigSetup`\r\n- `ConditionalInputConfig`\r\n- `MatrixTable`-->", styles: [".showItemValue{opacity:.6}mat-form-field{width:100%}mat-slider{width:100%}.range{display:flex;align-items:center}label{line-height:normal;margin-top:12px;font-weight:500;font-size:12px;color:var(--mdc-filled-text-field-focus-label-text-color, var(--mat-app-primary));display:flex;justify-content:space-between;align-items:center}.elementInfo{display:flex;align-items:center;justify-content:center;padding:0;height:24px;width:24px}.infoIcon{font-size:16px;height:16px;width:16px}.toggle-label{margin-left:5px;align-items:center;display:flex;font-weight:500;line-height:normal;justify-content:space-between;color:var(--mdc-filled-text-field-focus-label-text-color, var(--mat-app-primary))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i3.MatCardContent, selector: "mat-card-content" }], deferBlockDependencies: [() => [i2$2.NgForOf, i2$2.NgIf, i2$2.AsyncPipe, import('./ngx-t-forms-selection-options-editor.component-DSundfcO.mjs').then(m => m.SelectionOptionsEditorComponent), import('./ngx-t-forms-form-input-selector.component-D4QnMgZV.mjs').then(m => m.FormInputSelectorComponent), import('./ngx-t-forms-rest-api-call-setup.component-C0lOrUPY.mjs').then(m => m.RestApiCallSetupComponent), import('./ngx-t-forms-api-value-access-rules.component-CZuOneM4.mjs').then(m => m.ApiValueAccessRulesComponent), import('./ngx-t-forms-required-inputs.component-Dm4DQOlu.mjs').then(m => m.RequiredInputsComponent), import('./ngx-t-forms-pipeline-generator.component-BBQEFIyY.mjs').then(m => m.PipelineGeneratorComponent), import('./ngx-t-forms-calculated-field-rules.component-CyI98qg-.mjs').then(m => m.CalculatedFieldRulesComponent), import('./ngx-t-forms-validators-config.component-DSZO3LdN.mjs').then(m => m.ValidatorsConfigComponent), import('./ngx-t-forms-config-mscoa-additional-inputs.component-CqIs3vX5.mjs').then(m => m.ConfigMscoaAdditionalInputsComponent), import('./ngx-t-forms-mat-slider-editor.component-CapaodC5.mjs').then(m => m.MatSliderEditorComponent), import('./ngx-t-forms-mscoa-segment-config.component-BR1ALZeD.mjs').then(m => m.MscoaSegmentConfigComponent), import('./ngx-t-forms-mat-slider-toggle-editor.component-By2FAlH_.mjs').then(m => m.MatSliderToggleEditorComponent), import('./ngx-t-forms-mat-chip-list-editor.component-C4_iUWzY.mjs').then(m => m.MatChipListEditorComponent), i2$3.MatOption, i2.MatIconButton, i5.MatIcon, i4.MatFormField, i4.MatLabel, i4.MatError, i4.MatSuffix, i7$1.MatSelect, i8.MatTooltip, i5$1.MatInput]] }); }
|
|
5272
5281
|
}
|
|
5273
|
-
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "19.2.2", ngImport: i0, type: TDynamicDataEditComponent, resolveDeferredDeps: () => [import('./ngx-t-forms-selection-options-editor.component-
|
|
5282
|
+
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "19.2.2", ngImport: i0, type: TDynamicDataEditComponent, resolveDeferredDeps: () => [import('./ngx-t-forms-selection-options-editor.component-DSundfcO.mjs').then(m => m.SelectionOptionsEditorComponent), import('./ngx-t-forms-form-input-selector.component-D4QnMgZV.mjs').then(m => m.FormInputSelectorComponent), import('./ngx-t-forms-rest-api-call-setup.component-C0lOrUPY.mjs').then(m => m.RestApiCallSetupComponent), import('./ngx-t-forms-api-value-access-rules.component-CZuOneM4.mjs').then(m => m.ApiValueAccessRulesComponent), import('./ngx-t-forms-required-inputs.component-Dm4DQOlu.mjs').then(m => m.RequiredInputsComponent), import('./ngx-t-forms-pipeline-generator.component-BBQEFIyY.mjs').then(m => m.PipelineGeneratorComponent), import('./ngx-t-forms-calculated-field-rules.component-CyI98qg-.mjs').then(m => m.CalculatedFieldRulesComponent), import('./ngx-t-forms-validators-config.component-DSZO3LdN.mjs').then(m => m.ValidatorsConfigComponent), import('./ngx-t-forms-config-mscoa-additional-inputs.component-CqIs3vX5.mjs').then(m => m.ConfigMscoaAdditionalInputsComponent), import('./ngx-t-forms-mat-slider-editor.component-CapaodC5.mjs').then(m => m.MatSliderEditorComponent), import('./ngx-t-forms-mscoa-segment-config.component-BR1ALZeD.mjs').then(m => m.MscoaSegmentConfigComponent), import('./ngx-t-forms-mat-slider-toggle-editor.component-By2FAlH_.mjs').then(m => m.MatSliderToggleEditorComponent), import('./ngx-t-forms-mat-chip-list-editor.component-C4_iUWzY.mjs').then(m => m.MatChipListEditorComponent)], resolveMetadata: (SelectionOptionsEditorComponent, FormInputSelectorComponent, RestApiCallSetupComponent, ApiValueAccessRulesComponent, RequiredInputsComponent, PipelineGeneratorComponent, CalculatedFieldRulesComponent, ValidatorsConfigComponent, ConfigMscoaAdditionalInputsComponent, MatSliderEditorComponent, MscoaSegmentConfigComponent, MatSliderToggleEditorComponent, MatChipListEditorComponent) => ({ decorators: [{
|
|
5274
5283
|
type: Component,
|
|
5275
5284
|
args: [{ selector: 'lib-t-dynamic-data-edit', standalone: true, imports: [CommonModule,
|
|
5276
5285
|
SelectionOptionsEditorComponent,
|
|
@@ -5591,7 +5600,7 @@ class TDynamicDataViewComponent {
|
|
|
5591
5600
|
return 'black';
|
|
5592
5601
|
}
|
|
5593
5602
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: TDynamicDataViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5594
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.2", type: TDynamicDataViewComponent, isStandalone: true, selector: "lib-t-dynamic-data-view", inputs: { data: "data" }, usesOnChanges: true, ngImport: i0, template: "<mat-tree [dataSource]=\"treeClass.dataSource\" [treeControl]=\"treeClass.treeControl\">\r\n <mat-tree-node *matTreeNodeDef=\"let node\" matTreeNodePadding>\r\n <button disabled style=\"padding: 0px; \r\n width: 24px;\" mat-icon-button>\r\n\r\n </button>\r\n <div style=\"display: flex;align-items: center;\">\r\n <span class=\"node-key\">{{ node.key }}</span>\r\n <span>\r\n :\r\n </span>\r\n <span \r\n style=\" white-space: nowrap;\"\r\n [style.color]=\"getNodeValueColor(node.value)\"\r\n class=\"node-value\" >\r\n {{ node.value }}\r\n </span>\r\n </div>\r\n \r\n </mat-tree-node>\r\n\r\n <mat-tree-node *matTreeNodeDef=\"let node; when: treeClass.hasChild\" matTreeNodePadding>\r\n <button style=\"padding: 0px; \r\n width: 24px;\" mat-icon-button matTreeNodeToggle [attr.aria-label]=\"'Toggle ' + node.key\">\r\n <mat-icon>\r\n {{ treeClass.treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right' }}\r\n </mat-icon>\r\n </button>\r\n <span class=\"node-key\"> <strong>{{ node.key }}</strong></span>\r\n \r\n </mat-tree-node>\r\n </mat-tree>", styles: ["mat-tree-node{min-height:28px!important;height:32px!important}mat-tree{background:none}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type:
|
|
5603
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.2", type: TDynamicDataViewComponent, isStandalone: true, selector: "lib-t-dynamic-data-view", inputs: { data: "data" }, usesOnChanges: true, ngImport: i0, template: "<mat-tree [dataSource]=\"treeClass.dataSource\" [treeControl]=\"treeClass.treeControl\">\r\n <mat-tree-node *matTreeNodeDef=\"let node\" matTreeNodePadding>\r\n <button disabled style=\"padding: 0px; \r\n width: 24px;\" mat-icon-button>\r\n\r\n </button>\r\n <div style=\"display: flex;align-items: center;\">\r\n <span class=\"node-key\">{{ node.key }}</span>\r\n <span>\r\n :\r\n </span>\r\n <span \r\n style=\" white-space: nowrap;\"\r\n [style.color]=\"getNodeValueColor(node.value)\"\r\n class=\"node-value\" >\r\n {{ node.value }}\r\n </span>\r\n </div>\r\n \r\n </mat-tree-node>\r\n\r\n <mat-tree-node *matTreeNodeDef=\"let node; when: treeClass.hasChild\" matTreeNodePadding>\r\n <button style=\"padding: 0px; \r\n width: 24px;\" mat-icon-button matTreeNodeToggle [attr.aria-label]=\"'Toggle ' + node.key\">\r\n <mat-icon>\r\n {{ treeClass.treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right' }}\r\n </mat-icon>\r\n </button>\r\n <span class=\"node-key\"> <strong>{{ node.key }}</strong></span>\r\n \r\n </mat-tree-node>\r\n </mat-tree>", styles: ["mat-tree-node{min-height:28px!important;height:32px!important}mat-tree{background:none}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i3$1.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i3$1.MatTreeNodePadding, selector: "[matTreeNodePadding]", inputs: ["matTreeNodePadding", "matTreeNodePaddingIndent"] }, { kind: "directive", type: i3$1.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i3$1.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i3$1.MatTreeNode, selector: "mat-tree-node", inputs: ["tabIndex", "disabled"], outputs: ["activation", "expandedChange"], exportAs: ["matTreeNode"] }] }); }
|
|
5595
5604
|
}
|
|
5596
5605
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: TDynamicDataViewComponent, decorators: [{
|
|
5597
5606
|
type: Component,
|
|
@@ -5653,7 +5662,7 @@ class TFormInputStatusComponent {
|
|
|
5653
5662
|
return busyMessages.join(', ');
|
|
5654
5663
|
}
|
|
5655
5664
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: TFormInputStatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5656
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: TFormInputStatusComponent, isStandalone: true, selector: "lib-t-form-input-status", inputs: { inputConfig: "inputConfig" }, ngImport: i0, template: "\r\n\r\n<mat-icon color=\"primary\" \r\nmatTooltip=\"recently updated\"\r\n*ngIf=\"!busy && recentlyUpdated()\">update\r\n</mat-icon>\r\n\r\n\r\n @if(busy === true) { \r\n <mat-spinner\r\n [matTooltip]=\"busyMessage\" \r\n [diameter]=\"12\"\r\n style=\"display: inline-block;\" > \r\n </mat-spinner>\r\n \r\n }", styles: [".spinner{display:inline-block;position:absolute;height:10px!important;width:10px!important;--mdc-circular-progress-size: 10px;--mdc-circular-progress-active-indicator-width: 10px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
5665
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: TFormInputStatusComponent, isStandalone: true, selector: "lib-t-form-input-status", inputs: { inputConfig: "inputConfig" }, ngImport: i0, template: "\r\n\r\n<mat-icon color=\"primary\" \r\nmatTooltip=\"recently updated\"\r\n*ngIf=\"!busy && recentlyUpdated()\">update\r\n</mat-icon>\r\n\r\n\r\n @if(busy === true) { \r\n <mat-spinner\r\n [matTooltip]=\"busyMessage\" \r\n [diameter]=\"12\"\r\n style=\"display: inline-block;\" > \r\n </mat-spinner>\r\n \r\n }", styles: [".spinner{display:inline-block;position:absolute;height:10px!important;width:10px!important;--mdc-circular-progress-size: 10px;--mdc-circular-progress-active-indicator-width: 10px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
|
|
5657
5666
|
}
|
|
5658
5667
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: TFormInputStatusComponent, decorators: [{
|
|
5659
5668
|
type: Component,
|
|
@@ -5925,7 +5934,7 @@ class ScoaInputComponent {
|
|
|
5925
5934
|
return of();
|
|
5926
5935
|
}
|
|
5927
5936
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: ScoaInputComponent, deps: [{ token: i1$1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5928
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: ScoaInputComponent, isStandalone: true, selector: "app-scoa-input", ngImport: i0, template: "<h2 mat-dialog-title style=\"font-weight: 500;\"> {{heading|titlecase}}</h2>\r\n<p style=\" padding-left: 28px;padding-right:24px;margin-top:0px\">\r\n {{subHeading}}\r\n</p>\r\n<mat-dialog-content>\r\n\r\n <ng-container>\r\n @for (input of getContentInput(); track input.input.id) {\r\n <div style=\"padding: 5px;\" [class]=\"'col-xs-' + input.input.colSize\">\r\n <div [tourAnchor]=\"input.input.id\" class=\"box\">\r\n\r\n @if(activeFormClass){\r\n <!-- <lib-t-form-input [formGroup]=\"(activeFormClass).activeFormGroup()\" [id]=\"input.input.id\"\r\n [inputClass]=\"input\"></lib-t-form-input> -->\r\n }\r\n\r\n </div>\r\n </div>\r\n }\r\n\r\n </ng-container>\r\n</mat-dialog-content>\r\n<mat-dialog-actions align=\"end\">\r\n <button mat-button mat-dialog-close>Close</button>\r\n <button mat-flat-button color=\"primary\" (click)=\"save({})\" cdkFocusInitial>Save</button>\r\n</mat-dialog-actions>", styles: [".minimal-input{width:100%;padding:8px;margin:4px 0;box-sizing:border-box;border:1px solid #ccc;border-radius:4px}.error-message{color:red;font-size:12px}mat-form-field{width:100%;margin-top:20px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$
|
|
5937
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: ScoaInputComponent, isStandalone: true, selector: "app-scoa-input", ngImport: i0, template: "<h2 mat-dialog-title style=\"font-weight: 500;\"> {{heading|titlecase}}</h2>\r\n<p style=\" padding-left: 28px;padding-right:24px;margin-top:0px\">\r\n {{subHeading}}\r\n</p>\r\n<mat-dialog-content>\r\n\r\n <ng-container>\r\n @for (input of getContentInput(); track input.input.id) {\r\n <div style=\"padding: 5px;\" [class]=\"'col-xs-' + input.input.colSize\">\r\n <div [tourAnchor]=\"input.input.id\" class=\"box\">\r\n\r\n @if(activeFormClass){\r\n <!-- <lib-t-form-input [formGroup]=\"(activeFormClass).activeFormGroup()\" [id]=\"input.input.id\"\r\n [inputClass]=\"input\"></lib-t-form-input> -->\r\n }\r\n\r\n </div>\r\n </div>\r\n }\r\n\r\n </ng-container>\r\n</mat-dialog-content>\r\n<mat-dialog-actions align=\"end\">\r\n <button mat-button mat-dialog-close>Close</button>\r\n <button mat-flat-button color=\"primary\" (click)=\"save({})\" cdkFocusInitial>Save</button>\r\n</mat-dialog-actions>", styles: [".minimal-input{width:100%;padding:8px;margin:4px 0;box-sizing:border-box;border:1px solid #ccc;border-radius:4px}.error-message{color:red;font-size:12px}mat-form-field{width:100%;margin-top:20px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$2.TitleCasePipe, name: "titlecase" }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: i1$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: TourMatMenuModule }, { kind: "directive", type: i7$2.TourAnchorMatMenuDirective, selector: "[tourAnchor]", inputs: ["tourAnchor"] }] }); }
|
|
5929
5938
|
}
|
|
5930
5939
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: ScoaInputComponent, decorators: [{
|
|
5931
5940
|
type: Component,
|
|
@@ -5991,7 +6000,7 @@ class AccountValueComponent {
|
|
|
5991
6000
|
});
|
|
5992
6001
|
}
|
|
5993
6002
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: AccountValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5994
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: AccountValueComponent, isStandalone: true, selector: "app-account-value", inputs: { mscoaAccount: "mscoaAccount", accountInputs: "accountInputs", userCanClearAccount: "userCanClearAccount" }, outputs: { clearSelectedAccount: "clearSelectedAccount", updateAccount: "updateAccount" }, ngImport: i0, template: "<div style=\"max-width: 500px; background: var(--mat-toolbar-container-background-color);\">\r\n <mat-toolbar>\r\n Account Details\r\n <span class=\"spacer\"></span>\r\n <button *ngIf=\"userCanClearAccount\" (click)=\"clearAccount()\" mat-flat-button color=\"accent\">\r\n Clear Account\r\n <mat-icon>\r\n backspace\r\n </mat-icon>\r\n </button>\r\n </mat-toolbar>\r\n <div class=\"account-grid\">\r\n <ng-container *ngFor=\"let item of accountDetails; let last = last\">\r\n <div class=\"label\">\r\n {{item.label}}\r\n </div>\r\n <div class=\"value\">\r\n @if (item?.input) {\r\n @if( !item.value){\r\n <button (click)=\"openValueEdit(item)\" style=\"width: 100%;\" mat-stroked-button>\r\n {{item.value? item.value: 'set ' + item.label}}\r\n </button>\r\n }@else{\r\n <button color=\"primary\" (click)=\"openValueEdit(item)\" style=\"width: 100%;text-align:start\" mat-button>\r\n {{item.value? item.value: 'set ' + item.label}}\r\n </button>\r\n }\r\n }@else {\r\n {{item.value}}\r\n }\r\n </div>\r\n <mat-divider *ngIf=\"!last\"></mat-divider>\r\n </ng-container>\r\n\r\n </div>\r\n</div>", styles: [".account-card{max-width:500px;margin:20px auto;border-radius:8px;border:solid 1px #243d91}mat-card-header{background-color:#f5f5f5;padding:16px;border-bottom:1px solid #e0e0e0}mat-card-title{font-size:1.2rem;color:#333;margin:0}.account-grid{display:grid;grid-template-columns:max-content 1fr;gap:0px 16px;padding:16px;max-height:calc(95vh - 192px);overflow:auto}.label{font-weight:500;color:#555;text-align:right;font-size:14px}.value{color:#333;font-size:14px}mat-divider{grid-column:1/-1;margin:8px 0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
6003
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: AccountValueComponent, isStandalone: true, selector: "app-account-value", inputs: { mscoaAccount: "mscoaAccount", accountInputs: "accountInputs", userCanClearAccount: "userCanClearAccount" }, outputs: { clearSelectedAccount: "clearSelectedAccount", updateAccount: "updateAccount" }, ngImport: i0, template: "<div style=\"max-width: 500px; background: var(--mat-toolbar-container-background-color);\">\r\n <mat-toolbar>\r\n Account Details\r\n <span class=\"spacer\"></span>\r\n <button *ngIf=\"userCanClearAccount\" (click)=\"clearAccount()\" mat-flat-button color=\"accent\">\r\n Clear Account\r\n <mat-icon>\r\n backspace\r\n </mat-icon>\r\n </button>\r\n </mat-toolbar>\r\n <div class=\"account-grid\">\r\n <ng-container *ngFor=\"let item of accountDetails; let last = last\">\r\n <div class=\"label\">\r\n {{item.label}}\r\n </div>\r\n <div class=\"value\">\r\n @if (item?.input) {\r\n @if( !item.value){\r\n <button (click)=\"openValueEdit(item)\" style=\"width: 100%;\" mat-stroked-button>\r\n {{item.value? item.value: 'set ' + item.label}}\r\n </button>\r\n }@else{\r\n <button color=\"primary\" (click)=\"openValueEdit(item)\" style=\"width: 100%;text-align:start\" mat-button>\r\n {{item.value? item.value: 'set ' + item.label}}\r\n </button>\r\n }\r\n }@else {\r\n {{item.value}}\r\n }\r\n </div>\r\n <mat-divider *ngIf=\"!last\"></mat-divider>\r\n </ng-container>\r\n\r\n </div>\r\n</div>", styles: [".account-card{max-width:500px;margin:20px auto;border-radius:8px;border:solid 1px #243d91}mat-card-header{background-color:#f5f5f5;padding:16px;border-bottom:1px solid #e0e0e0}mat-card-title{font-size:1.2rem;color:#333;margin:0}.account-grid{display:grid;grid-template-columns:max-content 1fr;gap:0px 16px;padding:16px;max-height:calc(95vh - 192px);overflow:auto}.label{font-weight:500;color:#555;text-align:right;font-size:14px}.value{color:#333;font-size:14px}mat-divider{grid-column:1/-1;margin:8px 0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i4$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i9.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }] }); }
|
|
5995
6004
|
}
|
|
5996
6005
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: AccountValueComponent, decorators: [{
|
|
5997
6006
|
type: Component,
|
|
@@ -6100,7 +6109,7 @@ class ScoaAccountTableComponent {
|
|
|
6100
6109
|
}
|
|
6101
6110
|
}
|
|
6102
6111
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: ScoaAccountTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6103
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: ScoaAccountTableComponent, isStandalone: true, selector: "app-scoa-account-table", inputs: { data: "data", selectedAccount: "selectedAccount", segment: "segment" }, outputs: { accountSelected: "accountSelected" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }, { propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div >\r\n <mat-toolbar class=\"search\">\r\n <mat-form-field>\r\n <mat-label>Search Accounts</mat-label>\r\n <input matInput [formControl]=\"searchControl\" placeholder=\"Enter SCOA ID, Account Number, or Description\">\r\n @if ( !!this.searchControl.value) {\r\n <button matSuffix mat-icon-button (click)=\"clearSearch()\">\r\n <mat-icon>\r\n close\r\n </mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n\r\n \r\n <span class=\"spacer\"></span>\r\n <button mat-flat-button [matMenuTriggerFor]=\"menu\">\r\n <mat-icon>\r\n view_column\r\n </mat-icon>\r\n Columns\r\n\r\n </button>\r\n <mat-menu #menu=\"matMenu\">\r\n <div style=\" padding-left: 16px;\r\n margin-top: 8px;\" mat-subheader>Account list headers</div>\r\n <br>\r\n\r\n <section style=\"padding-left: 16px; padding-right:16px\">\r\n <button style=\"width: 100%;\" (click)=\"toogleDetails()\" class=\"cols\" color=\"primary\" mat-flat-button>\r\n {{showMinMal ? 'show all details' : 'Show less details'}}\r\n </button>\r\n </section>\r\n <p style=\"\r\n padding-left: 16px;\r\n padding-right:16px;\r\n \r\n font-size:14px\">Only selected headers will be shown.</p>\r\n @for (col of scoaAccountColumns; track $index) {\r\n <button (click)=\"$event.stopPropagation()\" class=\"cols\" mat-menu-item>\r\n\r\n <mat-checkbox [checked]=\"colIsChecked(col.key)\" (change)=\"colDisplayChanged($event,col.key)\"\r\n class=\"cols\">\r\n {{col.label}}</mat-checkbox>\r\n </button>\r\n }\r\n </mat-menu>\r\n </mat-toolbar>\r\n\r\n @if (dataSource.filteredData.length === 0) {\r\n <div class=\"no-results\">\r\n No accounts match your search criteria.\r\n </div>\r\n }@else {\r\n\r\n <table mat-table [dataSource]=\"dataSource||[]\" matSort>\r\n <ng-container *ngFor=\"let column of scoaAccountColumns\" [matColumnDef]=\"column.key\">\r\n <th mat-header-cell *matHeaderCellDef mat-sort-header>{{ column.label }}</th>\r\n <td mat-cell *matCellDef=\"let element\">{{ element[column.key] }}</td>\r\n </ng-container>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayColumns;\" class=\"account-row\" (click)=\"selectAccount(row)\"\r\n [class.deactivated-row]=\"rowIsActivated(row) === false\" [class.selected-row]=\"selectedAccount === row\"></tr>\r\n </table>\r\n <mat-paginator [pageSizeOptions]=\"[5, 10, 20]\" showFirstLastButtons></mat-paginator>\r\n\r\n }\r\n</div>", styles: [".search-container{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:1rem}.mat-form-field{flex-grow:1;margin-right:1rem}.selected-row{background-color:#243d91!important;color:#fff}.no-results{text-align:center;padding:2rem;color:#0000008a}.no-results mat-icon{font-size:3rem;height:3rem;width:3rem;margin-bottom:1rem}.selected-account{margin-top:1rem}.cols{font-size:14px;min-height:28px}.account-row{cursor:pointer}.deactivated-row{opacity:.6;cursor:not-allowed!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
6112
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: ScoaAccountTableComponent, isStandalone: true, selector: "app-scoa-account-table", inputs: { data: "data", selectedAccount: "selectedAccount", segment: "segment" }, outputs: { accountSelected: "accountSelected" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }, { propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div >\r\n <mat-toolbar class=\"search\">\r\n <mat-form-field>\r\n <mat-label>Search Accounts</mat-label>\r\n <input matInput [formControl]=\"searchControl\" placeholder=\"Enter SCOA ID, Account Number, or Description\">\r\n @if ( !!this.searchControl.value) {\r\n <button matSuffix mat-icon-button (click)=\"clearSearch()\">\r\n <mat-icon>\r\n close\r\n </mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n\r\n \r\n <span class=\"spacer\"></span>\r\n <button mat-flat-button [matMenuTriggerFor]=\"menu\">\r\n <mat-icon>\r\n view_column\r\n </mat-icon>\r\n Columns\r\n\r\n </button>\r\n <mat-menu #menu=\"matMenu\">\r\n <div style=\" padding-left: 16px;\r\n margin-top: 8px;\" mat-subheader>Account list headers</div>\r\n <br>\r\n\r\n <section style=\"padding-left: 16px; padding-right:16px\">\r\n <button style=\"width: 100%;\" (click)=\"toogleDetails()\" class=\"cols\" color=\"primary\" mat-flat-button>\r\n {{showMinMal ? 'show all details' : 'Show less details'}}\r\n </button>\r\n </section>\r\n <p style=\"\r\n padding-left: 16px;\r\n padding-right:16px;\r\n \r\n font-size:14px\">Only selected headers will be shown.</p>\r\n @for (col of scoaAccountColumns; track $index) {\r\n <button (click)=\"$event.stopPropagation()\" class=\"cols\" mat-menu-item>\r\n\r\n <mat-checkbox [checked]=\"colIsChecked(col.key)\" (change)=\"colDisplayChanged($event,col.key)\"\r\n class=\"cols\">\r\n {{col.label}}</mat-checkbox>\r\n </button>\r\n }\r\n </mat-menu>\r\n </mat-toolbar>\r\n\r\n @if (dataSource.filteredData.length === 0) {\r\n <div class=\"no-results\">\r\n No accounts match your search criteria.\r\n </div>\r\n }@else {\r\n\r\n <table mat-table [dataSource]=\"dataSource||[]\" matSort>\r\n <ng-container *ngFor=\"let column of scoaAccountColumns\" [matColumnDef]=\"column.key\">\r\n <th mat-header-cell *matHeaderCellDef mat-sort-header>{{ column.label }}</th>\r\n <td mat-cell *matCellDef=\"let element\">{{ element[column.key] }}</td>\r\n </ng-container>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayColumns;\" class=\"account-row\" (click)=\"selectAccount(row)\"\r\n [class.deactivated-row]=\"rowIsActivated(row) === false\" [class.selected-row]=\"selectedAccount === row\"></tr>\r\n </table>\r\n <mat-paginator [pageSizeOptions]=\"[5, 10, 20]\" showFirstLastButtons></mat-paginator>\r\n\r\n }\r\n</div>", styles: [".search-container{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:1rem}.mat-form-field{flex-grow:1;margin-right:1rem}.selected-row{background-color:#243d91!important;color:#fff}.no-results{text-align:center;padding:2rem;color:#0000008a}.no-results mat-icon{font-size:3rem;height:3rem;width:3rem;margin-bottom:1rem}.selected-account{margin-top:1rem}.cols{font-size:14px;min-height:28px}.account-row{cursor:pointer}.deactivated-row{opacity:.6;cursor:not-allowed!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i3$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i6.MatListSubheaderCssMatStyler, selector: "[mat-subheader], [matSubheader]" }, { kind: "component", type: i6$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i6$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i7$3.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i4$2.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i4$2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i5$2.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5$2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5$2.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5$2.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i5$2.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5$2.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5$2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5$2.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5$2.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5$2.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i9.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i5$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
|
|
6104
6113
|
}
|
|
6105
6114
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: ScoaAccountTableComponent, decorators: [{
|
|
6106
6115
|
type: Component,
|
|
@@ -6270,7 +6279,7 @@ class MscoaComputationComponent {
|
|
|
6270
6279
|
return !this.segmentConfig?.readOnly;
|
|
6271
6280
|
}
|
|
6272
6281
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MscoaComputationComponent, deps: [{ token: i1$1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6273
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: MscoaComputationComponent, isStandalone: true, selector: "app-mscoa-computation", ngImport: i0, template: "<mat-toolbar class=\"glass\" [color]=\"activeColumn ==='debit'?'primary':'warn'\">\r\n <span>\r\n <h1>\r\n {{ segment|| 'No segment' | titlecase}} : {{activeColumn |\r\n titlecase}}\r\n account\r\n </h1>\r\n\r\n </span>\r\n\r\n <span class=\"spacer\">\r\n </span>\r\n\r\n</mat-toolbar>\r\n\r\n@if ( _selectedAccount ) {\r\n<div style=\"max-height:calc(98vh - 128px); max-width: 98vw;\">\r\n <app-account-value [accountInputs]=\"accountInputs\" [userCanClearAccount]=\"userCanClearAccount\"\r\n [mscoaAccount]=\"_selectedAccount\" \r\n (updateAccount)=\"updateAccount($event)\"\r\n \r\n (clearSelectedAccount)=\"clearSelectedAccount()\">\r\n </app-account-value> \r\n</div>\r\n\r\n\r\n}@else{\r\n<mat-drawer-container style=\"max-height:calc(98vh - 128px); max-width: 98vw;\" autosize>\r\n <mat-drawer #drawer style=\" \r\n max-width: 98vw;\r\n overflow: auto;\r\n background: var(--mat-toolbar-container-background-color) !important;padding:16px\" mode=\"side\" position=\"end\"\r\n [opened]=\"!searchingAccounts && !!this._selected\">\r\n\r\n <h4>Select an Account</h4>\r\n <p class=\"info\">Please choose from the options below. Search results for account\r\n <strong>{{account}}</strong>\r\n </p>\r\n\r\n\r\n <app-scoa-account-table [selectedAccount]=\" _selectedAccount\" [segment]=\"segment\"\r\n (accountSelected)=\" selectAccount($event)\" [data]=\"{\r\n accounts: searchAccount,\r\n account: ''\r\n }\">\r\n </app-scoa-account-table> \r\n\r\n <footer>\r\n <mat-toolbar>\r\n <span class=\"spacer\"></span>\r\n <button mat-flat-button color=\"warn\" (click)=\"cancel()\">Cancel account selection</button>\r\n\r\n </mat-toolbar>\r\n </footer>\r\n </mat-drawer>\r\n <div class=\"tree-content\">\r\n\r\n <mat-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\">\r\n <mat-tree-node *matTreeNodeDef=\"let node\" matTreeNodePadding>\r\n\r\n\r\n <button class=\"toggle-button\" mat-icon-button disabled></button>\r\n <mat-checkbox (change)=\"selectNode(node)\"\r\n disabled=\"{{isActivePathOrParent(node.path) && searchingAccounts}}\"\r\n [checked]=\"isActivePathOrParent(node.path)\">\r\n <mat-spinner color=\"primary\" *ngIf=\"isActivePathOrParent(node.path) && searchingAccounts\"\r\n class=\"loading\"></mat-spinner>\r\n <span *ngIf=\"!(isActivePathOrParent(node.path) && searchingAccounts)\" class=\"label\"\r\n [class.selected]=\"isActivePathOrParent(node.path)\">\r\n {{node.name}}\r\n\r\n </span>\r\n <span *ngIf=\"isActivePathOrParent(node.path) && searchingAccounts\" class=\"label\"\r\n [class.selected]=\"isActivePathOrParent(node.path)\">\r\n ...Loading <strong>{{node.name}}</strong> accounts\r\n </span>\r\n </mat-checkbox>\r\n\r\n </mat-tree-node>\r\n <mat-tree-node *matTreeNodeDef=\"let node; when: hasChild\" matTreeNodePadding>\r\n\r\n <button class=\"toggle-button\" mat-icon-button [attr.aria-label]=\"'Toggle ' + node.name\"\r\n (click)=\"toggleNode(node)\">\r\n <mat-icon class=\"mat-icon-rtl-mirror\">\r\n {{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}\r\n </mat-icon>\r\n </button>\r\n <mat-checkbox (change)=\"selectNode(node)\" disabled=\"true\" checked=\"true\"\r\n *ngIf=\"isActivePathOrParent(node.path)\">\r\n <span class=\"label\" [class.selected]=\"isActivePathOrParent(node.path)\">\r\n {{node.name}}\r\n </span>\r\n </mat-checkbox>\r\n\r\n <span *ngIf=\"!isActivePathOrParent(node.path)\" class=\"label\"\r\n [class.selected]=\"isActivePathOrParent(node.path)\">\r\n {{node.name}} {{node.selected}}\r\n </span>\r\n\r\n\r\n\r\n </mat-tree-node>\r\n </mat-tree>\r\n </div>\r\n</mat-drawer-container>\r\n}\r\n<mat-divider></mat-divider>\r\n<mat-toolbar class=\"glass\" style=\" background: rgba(255, 255, 255, 0.15)\">\r\n <span class=\"spacer\"></span>\r\n <button mat-button (click)=\"closeAndPassData(undefined)\">Close</button>\r\n <button *ngIf=\"userCanClearAccount\" mat-raised-button color=\"primary\" [disabled]=\"!saveSelection\"\r\n (click)=\"saveAccount()\">Save</button>\r\n</mat-toolbar>", styles: ["h4{margin-top:0;margin-bottom:0;padding-left:16px}.label{font-size:14px}.selected{color:#243d91!important;font-weight:500}.accountSeperator{margin-left:2px;margin-right:2px}.loading{width:24px!important;height:24px!important;--mdc-circular-progress-size: 28px !important;--mdc-circular-progress-active-indicator-width: 24px !important;position:absolute;left:8px;bottom:8px}.info{font-size:.875rem;opacity:.8;padding-left:16px;border-radius:4px;margin-top:10px;line-height:1.6;max-width:500px}.info strong{opacity:1}.toggle-button{height:28px;width:28px;padding:0;margin-right:4px;margin-left:4px}mat-tree{min-height:368px;min-width:fit-content;max-height:calc(98vh - 128px);overflow:auto;margin-top:8px}mat-tree-node{display:flex;align-items:flex-start;min-height:28px;padding-right:4px!important;box-sizing:border-box;width:100%;padding-top:2px!important;padding-bottom:2px!important}.mat-tree-node{display:flex;align-items:center;flex-wrap:nowrap;min-height:28px;padding:4px 0;box-sizing:border-box}.mat-tree-node button,.mat-tree-node mat-checkbox{flex-shrink:0;height:28px;max-width:236px}.mat-tree-node mat-checkbox{display:flex;align-items:center;height:28px;max-width:236px;min-height:fit-content}.mat-tree-node .label{flex:1;min-width:0;word-wrap:break-word;overflow-wrap:break-word;white-space:normal}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
6282
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: MscoaComputationComponent, isStandalone: true, selector: "app-mscoa-computation", ngImport: i0, template: "<mat-toolbar class=\"glass\" [color]=\"activeColumn ==='debit'?'primary':'warn'\">\r\n <span>\r\n <h1>\r\n {{ segment|| 'No segment' | titlecase}} : {{activeColumn |\r\n titlecase}}\r\n account\r\n </h1>\r\n\r\n </span>\r\n\r\n <span class=\"spacer\">\r\n </span>\r\n\r\n</mat-toolbar>\r\n\r\n@if ( _selectedAccount ) {\r\n<div style=\"max-height:calc(98vh - 128px); max-width: 98vw;\">\r\n <app-account-value [accountInputs]=\"accountInputs\" [userCanClearAccount]=\"userCanClearAccount\"\r\n [mscoaAccount]=\"_selectedAccount\" \r\n (updateAccount)=\"updateAccount($event)\"\r\n \r\n (clearSelectedAccount)=\"clearSelectedAccount()\">\r\n </app-account-value> \r\n</div>\r\n\r\n\r\n}@else{\r\n<mat-drawer-container style=\"max-height:calc(98vh - 128px); max-width: 98vw;\" autosize>\r\n <mat-drawer #drawer style=\" \r\n max-width: 98vw;\r\n overflow: auto;\r\n background: var(--mat-toolbar-container-background-color) !important;padding:16px\" mode=\"side\" position=\"end\"\r\n [opened]=\"!searchingAccounts && !!this._selected\">\r\n\r\n <h4>Select an Account</h4>\r\n <p class=\"info\">Please choose from the options below. Search results for account\r\n <strong>{{account}}</strong>\r\n </p>\r\n\r\n\r\n <app-scoa-account-table [selectedAccount]=\" _selectedAccount\" [segment]=\"segment\"\r\n (accountSelected)=\" selectAccount($event)\" [data]=\"{\r\n accounts: searchAccount,\r\n account: ''\r\n }\">\r\n </app-scoa-account-table> \r\n\r\n <footer>\r\n <mat-toolbar>\r\n <span class=\"spacer\"></span>\r\n <button mat-flat-button color=\"warn\" (click)=\"cancel()\">Cancel account selection</button>\r\n\r\n </mat-toolbar>\r\n </footer>\r\n </mat-drawer>\r\n <div class=\"tree-content\">\r\n\r\n <mat-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\">\r\n <mat-tree-node *matTreeNodeDef=\"let node\" matTreeNodePadding>\r\n\r\n\r\n <button class=\"toggle-button\" mat-icon-button disabled></button>\r\n <mat-checkbox (change)=\"selectNode(node)\"\r\n disabled=\"{{isActivePathOrParent(node.path) && searchingAccounts}}\"\r\n [checked]=\"isActivePathOrParent(node.path)\">\r\n <mat-spinner color=\"primary\" *ngIf=\"isActivePathOrParent(node.path) && searchingAccounts\"\r\n class=\"loading\"></mat-spinner>\r\n <span *ngIf=\"!(isActivePathOrParent(node.path) && searchingAccounts)\" class=\"label\"\r\n [class.selected]=\"isActivePathOrParent(node.path)\">\r\n {{node.name}}\r\n\r\n </span>\r\n <span *ngIf=\"isActivePathOrParent(node.path) && searchingAccounts\" class=\"label\"\r\n [class.selected]=\"isActivePathOrParent(node.path)\">\r\n ...Loading <strong>{{node.name}}</strong> accounts\r\n </span>\r\n </mat-checkbox>\r\n\r\n </mat-tree-node>\r\n <mat-tree-node *matTreeNodeDef=\"let node; when: hasChild\" matTreeNodePadding>\r\n\r\n <button class=\"toggle-button\" mat-icon-button [attr.aria-label]=\"'Toggle ' + node.name\"\r\n (click)=\"toggleNode(node)\">\r\n <mat-icon class=\"mat-icon-rtl-mirror\">\r\n {{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}\r\n </mat-icon>\r\n </button>\r\n <mat-checkbox (change)=\"selectNode(node)\" disabled=\"true\" checked=\"true\"\r\n *ngIf=\"isActivePathOrParent(node.path)\">\r\n <span class=\"label\" [class.selected]=\"isActivePathOrParent(node.path)\">\r\n {{node.name}}\r\n </span>\r\n </mat-checkbox>\r\n\r\n <span *ngIf=\"!isActivePathOrParent(node.path)\" class=\"label\"\r\n [class.selected]=\"isActivePathOrParent(node.path)\">\r\n {{node.name}} {{node.selected}}\r\n </span>\r\n\r\n\r\n\r\n </mat-tree-node>\r\n </mat-tree>\r\n </div>\r\n</mat-drawer-container>\r\n}\r\n<mat-divider></mat-divider>\r\n<mat-toolbar class=\"glass\" style=\" background: rgba(255, 255, 255, 0.15)\">\r\n <span class=\"spacer\"></span>\r\n <button mat-button (click)=\"closeAndPassData(undefined)\">Close</button>\r\n <button *ngIf=\"userCanClearAccount\" mat-raised-button color=\"primary\" [disabled]=\"!saveSelection\"\r\n (click)=\"saveAccount()\">Save</button>\r\n</mat-toolbar>", styles: ["h4{margin-top:0;margin-bottom:0;padding-left:16px}.label{font-size:14px}.selected{color:#243d91!important;font-weight:500}.accountSeperator{margin-left:2px;margin-right:2px}.loading{width:24px!important;height:24px!important;--mdc-circular-progress-size: 28px !important;--mdc-circular-progress-active-indicator-width: 24px !important;position:absolute;left:8px;bottom:8px}.info{font-size:.875rem;opacity:.8;padding-left:16px;border-radius:4px;margin-top:10px;line-height:1.6;max-width:500px}.info strong{opacity:1}.toggle-button{height:28px;width:28px;padding:0;margin-right:4px;margin-left:4px}mat-tree{min-height:368px;min-width:fit-content;max-height:calc(98vh - 128px);overflow:auto;margin-top:8px}mat-tree-node{display:flex;align-items:flex-start;min-height:28px;padding-right:4px!important;box-sizing:border-box;width:100%;padding-top:2px!important;padding-bottom:2px!important}.mat-tree-node{display:flex;align-items:center;flex-wrap:nowrap;min-height:28px;padding:4px 0;box-sizing:border-box}.mat-tree-node button,.mat-tree-node mat-checkbox{flex-shrink:0;height:28px;max-width:236px}.mat-tree-node mat-checkbox{display:flex;align-items:center;height:28px;max-width:236px;min-height:fit-content}.mat-tree-node .label{flex:1;min-width:0;word-wrap:break-word;overflow-wrap:break-word;white-space:normal}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2$2.TitleCasePipe, name: "titlecase" }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i3$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i4$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: i8$1.MatDrawer, selector: "mat-drawer", inputs: ["position", "mode", "disableClose", "autoFocus", "opened"], outputs: ["openedChange", "opened", "openedStart", "closed", "closedStart", "positionChanged"], exportAs: ["matDrawer"] }, { kind: "component", type: i8$1.MatDrawerContainer, selector: "mat-drawer-container", inputs: ["autosize", "hasBackdrop"], outputs: ["backdropClick"], exportAs: ["matDrawerContainer"] }, { kind: "component", type: i9.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i3$1.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i3$1.MatTreeNodePadding, selector: "[matTreeNodePadding]", inputs: ["matTreeNodePadding", "matTreeNodePaddingIndent"] }, { kind: "component", type: i3$1.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i3$1.MatTreeNode, selector: "mat-tree-node", inputs: ["tabIndex", "disabled"], outputs: ["activation", "expandedChange"], exportAs: ["matTreeNode"] }, { kind: "component", type: AccountValueComponent, selector: "app-account-value", inputs: ["mscoaAccount", "accountInputs", "userCanClearAccount"], outputs: ["clearSelectedAccount", "updateAccount"] }, { kind: "component", type: ScoaAccountTableComponent, selector: "app-scoa-account-table", inputs: ["data", "selectedAccount", "segment"], outputs: ["accountSelected"] }] }); }
|
|
6274
6283
|
}
|
|
6275
6284
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MscoaComputationComponent, decorators: [{
|
|
6276
6285
|
type: Component,
|
|
@@ -6433,7 +6442,7 @@ class MscoaChartComponent {
|
|
|
6433
6442
|
console.error("onContainerClick not implemented");
|
|
6434
6443
|
}
|
|
6435
6444
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MscoaChartComponent, deps: [{ token: MscoaComponentStore }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6436
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: MscoaChartComponent, isStandalone: true, selector: "app-mscoa-chart", inputs: { formBuilderFunctions: "formBuilderFunctions", segmentValues: "segmentValues", readonly: "readonly", config: "config" }, outputs: { segmentValuesChanged: "segmentValuesChanged", interaction: "interaction" }, providers: [MscoaComponentStore,], ngImport: i0, template: "\r\n<section class=\"p-4\" *ngIf=\"(viewData$ | async) as viewData\">\r\n \r\n @if (viewData.loading) {\r\n <div style=\"padding: 24px; display: flex; align-items: center; justify-content: center;\">\r\n <mat-spinner></mat-spinner>\r\n </div>\r\n } @else {\r\n @defer (on viewport) {\r\n <ng-container *ngIf=\"viewData.accountTreeKeys\">\r\n <div class=\"table-container\">\r\n <table mat-table [dataSource]=\"viewData.tableData\" class=\"table\">\r\n @for (col of viewData.cols; track col; let i = $index) {\r\n <ng-container [matColumnDef]=\"col\">\r\n <th [style.text-align]=\"i === 0 ? 'right' : 'center'\"\r\n style=\"background: var(--mat-toolbar-container-background-color);\" \r\n mat-header-cell\r\n *matHeaderCellDef>\r\n @if (viewData.hasMultiSelect || i === 0) {\r\n {{col | titlecase}}\r\n } @else if (col === 'debit') {\r\n Debit / Credit\r\n }\r\n </th>\r\n <td mat-cell \r\n *matCellDef=\"let row\" \r\n [style.text-align]=\"i === 0 ? 'right' : 'center'\"\r\n [ngClass]=\"{'segment-cell': i === 0}\" \r\n [class.active]=\"editSelection?.segment === row['segment'] && activeColumn === col\">\r\n @if (i === 0) {\r\n {{row[col]}}\r\n } @else {\r\n @if (row[col]) {\r\n <button \r\n [disabled]=\"!!row['singleSelect'] === true && col === 'credit'\"\r\n (mousedown)=\"$event.preventDefault(); $event.stopPropagation(); selectAccount(row, col);\" \r\n color=\"primary\"\r\n mat-button \r\n class=\"cell-button\">\r\n <div class=\"content\">\r\n {{row[col]}}\r\n </div>\r\n </button>\r\n } @else {\r\n <button \r\n [disabled]=\"!!row['singleSelect'] === true && col === 'credit'\"\r\n (click)=\"selectAccount(row, col); $event.stopPropagation()\" \r\n mat-stroked-button\r\n class=\"cell-button\">\r\n <div class=\"content\">\r\n {{!!row['singleSelect'] === true && col === 'credit' ? 'auto selected ' : 'Select ' + row['segment'] + ' ' + col + ' account'}}\r\n </div>\r\n </button>\r\n }\r\n }\r\n </td>\r\n </ng-container>\r\n }\r\n <tr mat-header-row *matHeaderRowDef=\"viewData.cols\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: viewData.cols;\"></tr>\r\n </table>\r\n </div>\r\n <ng-container *ngIf=\"viewData.accountTreeKeys.length === 0\">\r\n <section style=\"padding: 16px; text-align: center; display: flex;\">\r\n <span><mat-icon>info</mat-icon></span>\r\n <span>\r\n No account segments are currently configured. \r\n Please configure account segments to proceed.\r\n </span>\r\n </section>\r\n </ng-container>\r\n </ng-container>\r\n } @placeholder {\r\n <div class=\"table-container\">\r\n <p class=\"text-gray-500\">Loading data...</p>\r\n </div>\r\n }\r\n \r\n @loading (minimum 100ms) {\r\n <div class=\"flex justify-center items-center h-64\">\r\n <mat-progress-spinner mode=\"indeterminate\"></mat-progress-spinner>\r\n </div>\r\n } @error {\r\n <div class=\"table-container\">\r\n <p class=\"text-red-500\">Error loading data. Please try again.</p>\r\n </div>\r\n }\r\n }\r\n\r\n </section>", styles: [".cell-button{height:fit-content;min-height:38px;min-width:100%}.content{padding:8px}.info-box{display:flex;align-items:center;gap:8px;padding:12px;background:azure;border-radius:4px;margin-bottom:16px}.info-icon{min-width:38px;margin:8px auto auto}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type:
|
|
6445
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: MscoaChartComponent, isStandalone: true, selector: "app-mscoa-chart", inputs: { formBuilderFunctions: "formBuilderFunctions", segmentValues: "segmentValues", readonly: "readonly", config: "config" }, outputs: { segmentValuesChanged: "segmentValuesChanged", interaction: "interaction" }, providers: [MscoaComponentStore,], ngImport: i0, template: "\r\n<section class=\"p-4\" *ngIf=\"(viewData$ | async) as viewData\">\r\n \r\n @if (viewData.loading) {\r\n <div style=\"padding: 24px; display: flex; align-items: center; justify-content: center;\">\r\n <mat-spinner></mat-spinner>\r\n </div>\r\n } @else {\r\n @defer (on viewport) {\r\n <ng-container *ngIf=\"viewData.accountTreeKeys\">\r\n <div class=\"table-container\">\r\n <table mat-table [dataSource]=\"viewData.tableData\" class=\"table\">\r\n @for (col of viewData.cols; track col; let i = $index) {\r\n <ng-container [matColumnDef]=\"col\">\r\n <th [style.text-align]=\"i === 0 ? 'right' : 'center'\"\r\n style=\"background: var(--mat-toolbar-container-background-color);\" \r\n mat-header-cell\r\n *matHeaderCellDef>\r\n @if (viewData.hasMultiSelect || i === 0) {\r\n {{col | titlecase}}\r\n } @else if (col === 'debit') {\r\n Debit / Credit\r\n }\r\n </th>\r\n <td mat-cell \r\n *matCellDef=\"let row\" \r\n [style.text-align]=\"i === 0 ? 'right' : 'center'\"\r\n [ngClass]=\"{'segment-cell': i === 0}\" \r\n [class.active]=\"editSelection?.segment === row['segment'] && activeColumn === col\">\r\n @if (i === 0) {\r\n {{row[col]}}\r\n } @else {\r\n @if (row[col]) {\r\n <button \r\n [disabled]=\"!!row['singleSelect'] === true && col === 'credit'\"\r\n (mousedown)=\"$event.preventDefault(); $event.stopPropagation(); selectAccount(row, col);\" \r\n color=\"primary\"\r\n mat-button \r\n class=\"cell-button\">\r\n <div class=\"content\">\r\n {{row[col]}}\r\n </div>\r\n </button>\r\n } @else {\r\n <button \r\n [disabled]=\"!!row['singleSelect'] === true && col === 'credit'\"\r\n (click)=\"selectAccount(row, col); $event.stopPropagation()\" \r\n mat-stroked-button\r\n class=\"cell-button\">\r\n <div class=\"content\">\r\n {{!!row['singleSelect'] === true && col === 'credit' ? 'auto selected ' : 'Select ' + row['segment'] + ' ' + col + ' account'}}\r\n </div>\r\n </button>\r\n }\r\n }\r\n </td>\r\n </ng-container>\r\n }\r\n <tr mat-header-row *matHeaderRowDef=\"viewData.cols\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: viewData.cols;\"></tr>\r\n </table>\r\n </div>\r\n <ng-container *ngIf=\"viewData.accountTreeKeys.length === 0\">\r\n <section style=\"padding: 16px; text-align: center; display: flex;\">\r\n <span><mat-icon>info</mat-icon></span>\r\n <span>\r\n No account segments are currently configured. \r\n Please configure account segments to proceed.\r\n </span>\r\n </section>\r\n </ng-container>\r\n </ng-container>\r\n } @placeholder {\r\n <div class=\"table-container\">\r\n <p class=\"text-gray-500\">Loading data...</p>\r\n </div>\r\n }\r\n \r\n @loading (minimum 100ms) {\r\n <div class=\"flex justify-center items-center h-64\">\r\n <mat-progress-spinner mode=\"indeterminate\"></mat-progress-spinner>\r\n </div>\r\n } @error {\r\n <div class=\"table-container\">\r\n <p class=\"text-red-500\">Error loading data. Please try again.</p>\r\n </div>\r\n }\r\n }\r\n\r\n </section>", styles: [".cell-button{height:fit-content;min-height:38px;min-width:100%}.content{padding:8px}.info-box{display:flex;align-items:center;gap:8px;padding:12px;background:azure;border-radius:4px;margin-bottom:16px}.info-icon{min-width:38px;margin:8px auto auto}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i7.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2$2.AsyncPipe, name: "async" }], deferBlockDependencies: [() => [i2.MatButton, i5.MatIcon, i5$2.MatTable, i5$2.MatHeaderCellDef, i5$2.MatHeaderRowDef, i5$2.MatColumnDef, i5$2.MatCellDef, i5$2.MatRowDef, i5$2.MatHeaderCell, i5$2.MatCell, i5$2.MatHeaderRow, i5$2.MatRow, i2$2.NgClass, i2$2.NgIf, i2$2.TitleCasePipe]] }); }
|
|
6437
6446
|
}
|
|
6438
6447
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MscoaChartComponent, decorators: [{
|
|
6439
6448
|
type: Component,
|
|
@@ -6736,7 +6745,7 @@ class MscoaReactiveFormFieldComponent extends BaseCustomInput {
|
|
|
6736
6745
|
return !!this._inputConfig.readonly;
|
|
6737
6746
|
}
|
|
6738
6747
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MscoaReactiveFormFieldComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6739
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.2", type: MscoaReactiveFormFieldComponent, isStandalone: true, selector: "lib-mscoa-reactive-form-field", inputs: { formBuilderFunctions: "formBuilderFunctions", inputConfig: "inputConfig" }, providers: [{ provide: MatFormFieldControl, useExisting: MscoaReactiveFormFieldComponent }], usesInheritance: true, ngImport: i0, template: "\r\n<div (click)=\"onContainerClick($event)\">\r\n <app-mscoa-chart \r\n (segmentValuesChanged)=\"segmentValuesChanged($event)\" \r\n [config]=\" mscoaInputConfig$|async\"\r\n [readonly]=\"readonly\"\r\n [formBuilderFunctions]=\"formBuilderFunctions\"\r\n [segmentValues]=\"value\"></app-mscoa-chart>\r\n \r\n\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "component", type: MscoaChartComponent, selector: "app-mscoa-chart", inputs: ["formBuilderFunctions", "segmentValues", "readonly", "config"], outputs: ["segmentValuesChanged", "interaction"] }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$
|
|
6748
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.2", type: MscoaReactiveFormFieldComponent, isStandalone: true, selector: "lib-mscoa-reactive-form-field", inputs: { formBuilderFunctions: "formBuilderFunctions", inputConfig: "inputConfig" }, providers: [{ provide: MatFormFieldControl, useExisting: MscoaReactiveFormFieldComponent }], usesInheritance: true, ngImport: i0, template: "\r\n<div (click)=\"onContainerClick($event)\">\r\n <app-mscoa-chart \r\n (segmentValuesChanged)=\"segmentValuesChanged($event)\" \r\n [config]=\" mscoaInputConfig$|async\"\r\n [readonly]=\"readonly\"\r\n [formBuilderFunctions]=\"formBuilderFunctions\"\r\n [segmentValues]=\"value\"></app-mscoa-chart>\r\n \r\n\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "component", type: MscoaChartComponent, selector: "app-mscoa-chart", inputs: ["formBuilderFunctions", "segmentValues", "readonly", "config"], outputs: ["segmentValuesChanged", "interaction"] }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$2.AsyncPipe, name: "async" }] }); }
|
|
6740
6749
|
}
|
|
6741
6750
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MscoaReactiveFormFieldComponent, decorators: [{
|
|
6742
6751
|
type: Component,
|
|
@@ -6807,7 +6816,7 @@ class MscoaFormInputComponent {
|
|
|
6807
6816
|
return getInputErrorMessage(this.inputConfig, this.formGroup);
|
|
6808
6817
|
}
|
|
6809
6818
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MscoaFormInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6810
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: MscoaFormInputComponent, isStandalone: true, selector: "lib-mscoa-form-input", inputs: { inputConfig: "inputConfig", formGroup: "formGroup", formBuilderFunctions: "formBuilderFunctions" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<form [formGroup]=\"formGroup\">\r\n <mat-form-field \r\n\r\n [appearance]=\"this.inputConfig.appearance ||'fill' \"\r\n [floatLabel]=\"'always'\"\r\n subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status \r\n [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <mat-card style=\"overflow:auto\">\r\n <lib-mscoa-reactive-form-field \r\n [inputConfig]=\"this.inputConfig\"\r\n [formControlName]=\"this.inputConfig.id\"\r\n [formBuilderFunctions]=\"formBuilderFunctions\"\r\n ></lib-mscoa-reactive-form-field>\r\n \r\n </mat-card>\r\n \r\n\r\n <!-- @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n }\r\n -->\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n \r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n \r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n \r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n \r\n \r\n </mat-form-field>\r\n\r\n\r\n \r\n \r\n \r\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i3
|
|
6819
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: MscoaFormInputComponent, isStandalone: true, selector: "lib-mscoa-form-input", inputs: { inputConfig: "inputConfig", formGroup: "formGroup", formBuilderFunctions: "formBuilderFunctions" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<form [formGroup]=\"formGroup\">\r\n <mat-form-field \r\n\r\n [appearance]=\"this.inputConfig.appearance ||'fill' \"\r\n [floatLabel]=\"'always'\"\r\n subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status \r\n [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <mat-card style=\"overflow:auto\">\r\n <lib-mscoa-reactive-form-field \r\n [inputConfig]=\"this.inputConfig\"\r\n [formControlName]=\"this.inputConfig.id\"\r\n [formBuilderFunctions]=\"formBuilderFunctions\"\r\n ></lib-mscoa-reactive-form-field>\r\n \r\n </mat-card>\r\n \r\n\r\n <!-- @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n }\r\n -->\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n \r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n \r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n \r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n \r\n \r\n </mat-form-field>\r\n\r\n\r\n \r\n \r\n \r\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }, { kind: "component", type: MscoaReactiveFormFieldComponent, selector: "lib-mscoa-reactive-form-field", inputs: ["formBuilderFunctions", "inputConfig"] }] }); }
|
|
6811
6820
|
}
|
|
6812
6821
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MscoaFormInputComponent, decorators: [{
|
|
6813
6822
|
type: Component,
|
|
@@ -7161,7 +7170,7 @@ class SignaturePadInputComponent extends BaseCustomInput {
|
|
|
7161
7170
|
provide: MatFormFieldControl,
|
|
7162
7171
|
useExisting: SignaturePadInputComponent
|
|
7163
7172
|
}
|
|
7164
|
-
], viewQueries: [{ propertyName: "signatureElement", first: true, predicate: ["signature"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div [style.opacity]=\"canApplySignature?'0.1':'1'\" #signature class=\"signature-container\">\r\n \r\n \r\n</div>\r\n@if (canSaveSignature) {\r\n\r\n<mat-toolbar>\r\n\r\n <button style=\" width: 100%;\" \r\n matTooltip=\"You can save this signature for quick use in future documents\" \r\n mat-flat-button\r\n color=\"accent\"\r\n (click)=\"saveUserSignature()\">\r\n <mat-icon>save</mat-icon>\r\n Save for future use\r\n </button>\r\n</mat-toolbar>\r\n}\r\n@if (canApplySignature) {\r\n\r\n <mat-card appearance=\"outlined\" class=\"signature-card\">\r\n <mat-card-header>\r\n <img \r\n class=\"userAvatar\"\r\n mat-card-avatar \r\n [src]=\"getUserUrl()\" \r\n [attr.aria-label]=\"'Profile picture of ' + userStoredSignature?.userName\"\r\n >\r\n \r\n \r\n <mat-card-title class=\"existingTitle\">Found an existing signature</mat-card-title>\r\n \r\n <mat-card-subtitle class=\"signature-metadata\">\r\n <span class=\"metadata-item\">\r\n <mat-icon aria-hidden=\"true\">person</mat-icon>\r\n <span class=\"metadata-text\">{{userStoredSignature?.userName}}</span>\r\n </span>\r\n \r\n <span class=\"metadata-item\">\r\n <mat-icon aria-hidden=\"true\">calendar_month</mat-icon>\r\n <span class=\"metadata-text\">{{userStoredSignature?.signatureDate | date: 'mediumDate'}}</span>\r\n </span>\r\n </mat-card-subtitle>\r\n </mat-card-header>\r\n \r\n <mat-card-content>\r\n <p class=\"signature-description\">\r\n You can apply your saved signature or clear to draw a new one\r\n </p>\r\n </mat-card-content>\r\n \r\n <mat-card-actions align=\"end\">\r\n <button \r\n mat-flat-button\r\n color=\"primary\" \r\n class=\"apply-signature-btn\"\r\n (click)=\"saveSignature()\"\r\n [matTooltip]=\"'Apply your saved signature from ' + (userStoredSignature?.signatureDate | date: 'mediumDate')\">\r\n <mat-icon>done</mat-icon>\r\n <span>Apply Existing Signature</span>\r\n </button>\r\n </mat-card-actions>\r\n </mat-card>\r\n }\r\n<mat-toolbar style=\"max-width: 100%; overflow:auto\">\r\n <span>\r\n <div style=\"font-size:14px;line-height:normal;font-weight:500\">\r\n Signature:\r\n </div>\r\n <div style=\"font-size:12px;font-weight:400;line-height:1.5\">\r\n Secured and Encrypted.\r\n </div>\r\n\r\n </span>\r\n <span class=\"spacer\"></span>\r\n\r\n@if(!inputConfig.readonly){\r\n <button mat-stroked-button color=\"warn\" (click)=\"clearSignature()\">\r\n Clear\r\n\r\n</button>\r\n}\r\n\r\n</mat-toolbar>\r\n@if(loading){\r\n<div class=\"signature-pad-container\">\r\n <mat-spinner diameter=\"50\">\r\n </mat-spinner>\r\n <span>\r\n {{loading}}\r\n </span>\r\n\r\n</div>\r\n}", styles: [".signature-container{border:solid 1px var(--mat-divider-color, var(--mat-app-outline))}.signature-container canvas{width:100%;height:200px}.signature-container .controls{padding:10px;text-align:center}.signature-pad-container{position:absolute;display:flex;width:100%;height:100%;justify-content:center;align-items:center;background:#3f51b51a;gap:12px;top:0}.userAvatar{height:50px;width:50px}.existingTitle{font-size:14px}.metadata-item{display:flex;align-items:center;gap:8px}.metadata-item mat-icon{font-size:12px;height:12px;width:12px}.metadata-item .metadata-text,.signature-description{font-size:12px}.apply-signature-btn{width:100%}.signature-metadata{margin-top:4px}.canApply{position:absolute}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$
|
|
7173
|
+
], viewQueries: [{ propertyName: "signatureElement", first: true, predicate: ["signature"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div [style.opacity]=\"canApplySignature?'0.1':'1'\" #signature class=\"signature-container\">\r\n \r\n \r\n</div>\r\n@if (canSaveSignature) {\r\n\r\n<mat-toolbar>\r\n\r\n <button style=\" width: 100%;\" \r\n matTooltip=\"You can save this signature for quick use in future documents\" \r\n mat-flat-button\r\n color=\"accent\"\r\n (click)=\"saveUserSignature()\">\r\n <mat-icon>save</mat-icon>\r\n Save for future use\r\n </button>\r\n</mat-toolbar>\r\n}\r\n@if (canApplySignature) {\r\n\r\n <mat-card appearance=\"outlined\" class=\"signature-card\">\r\n <mat-card-header>\r\n <img \r\n class=\"userAvatar\"\r\n mat-card-avatar \r\n [src]=\"getUserUrl()\" \r\n [attr.aria-label]=\"'Profile picture of ' + userStoredSignature?.userName\"\r\n >\r\n \r\n \r\n <mat-card-title class=\"existingTitle\">Found an existing signature</mat-card-title>\r\n \r\n <mat-card-subtitle class=\"signature-metadata\">\r\n <span class=\"metadata-item\">\r\n <mat-icon aria-hidden=\"true\">person</mat-icon>\r\n <span class=\"metadata-text\">{{userStoredSignature?.userName}}</span>\r\n </span>\r\n \r\n <span class=\"metadata-item\">\r\n <mat-icon aria-hidden=\"true\">calendar_month</mat-icon>\r\n <span class=\"metadata-text\">{{userStoredSignature?.signatureDate | date: 'mediumDate'}}</span>\r\n </span>\r\n </mat-card-subtitle>\r\n </mat-card-header>\r\n \r\n <mat-card-content>\r\n <p class=\"signature-description\">\r\n You can apply your saved signature or clear to draw a new one\r\n </p>\r\n </mat-card-content>\r\n \r\n <mat-card-actions align=\"end\">\r\n <button \r\n mat-flat-button\r\n color=\"primary\" \r\n class=\"apply-signature-btn\"\r\n (click)=\"saveSignature()\"\r\n [matTooltip]=\"'Apply your saved signature from ' + (userStoredSignature?.signatureDate | date: 'mediumDate')\">\r\n <mat-icon>done</mat-icon>\r\n <span>Apply Existing Signature</span>\r\n </button>\r\n </mat-card-actions>\r\n </mat-card>\r\n }\r\n<mat-toolbar style=\"max-width: 100%; overflow:auto\">\r\n <span>\r\n <div style=\"font-size:14px;line-height:normal;font-weight:500\">\r\n Signature:\r\n </div>\r\n <div style=\"font-size:12px;font-weight:400;line-height:1.5\">\r\n Secured and Encrypted.\r\n </div>\r\n\r\n </span>\r\n <span class=\"spacer\"></span>\r\n\r\n@if(!inputConfig.readonly){\r\n <button mat-stroked-button color=\"warn\" (click)=\"clearSignature()\">\r\n Clear\r\n\r\n</button>\r\n}\r\n\r\n</mat-toolbar>\r\n@if(loading){\r\n<div class=\"signature-pad-container\">\r\n <mat-spinner diameter=\"50\">\r\n </mat-spinner>\r\n <span>\r\n {{loading}}\r\n </span>\r\n\r\n</div>\r\n}", styles: [".signature-container{border:solid 1px var(--mat-divider-color, var(--mat-app-outline))}.signature-container canvas{width:100%;height:200px}.signature-container .controls{padding:10px;text-align:center}.signature-pad-container{position:absolute;display:flex;width:100%;height:100%;justify-content:center;align-items:center;background:#3f51b51a;gap:12px;top:0}.userAvatar{height:50px;width:50px}.existingTitle{font-size:14px}.metadata-item{display:flex;align-items:center;gap:8px}.metadata-item mat-icon{font-size:12px;height:12px;width:12px}.metadata-item .metadata-text,.signature-description{font-size:12px}.apply-signature-btn{width:100%}.signature-metadata{margin-top:4px}.canApply{position:absolute}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$2.DatePipe, name: "date" }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i3.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i3.MatCardAvatar, selector: "[mat-card-avatar], [matCardAvatar]" }, { kind: "directive", type: i3.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i3.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i3.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "directive", type: i3.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: i9.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
7165
7174
|
}
|
|
7166
7175
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: SignaturePadInputComponent, decorators: [{
|
|
7167
7176
|
type: Component,
|
|
@@ -7193,7 +7202,7 @@ class SignatureInputElementComponent {
|
|
|
7193
7202
|
return getInputErrorMessage(this.inputConfig, this.formGroup);
|
|
7194
7203
|
}
|
|
7195
7204
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: SignatureInputElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7196
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: SignatureInputElementComponent, isStandalone: true, selector: "lib-signature-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<form [formGroup]=\"formGroup\">\r\n <mat-form-field \r\n [appearance]=\"this.inputConfig.appearance ||'fill' \"\r\n [floatLabel]=\"'always'\"\r\n subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <lib-signature-pad-input [inputConfig]=\"this.inputConfig\"\r\n [formControlName]=\"inputConfig.id\"></lib-signature-pad-input>\r\n <!-- <app-signature-input [inputConfig]=\"this.inputConfig\"\r\n [formControlName]=\"inputConfig.id\"></app-signature-input>\r\n -->\r\n\r\n <!-- @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n } -->\r\n\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n\r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n\r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n\r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n\r\n \r\n\r\n </mat-form-field>\r\n</form>", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
7205
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: SignatureInputElementComponent, isStandalone: true, selector: "lib-signature-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<form [formGroup]=\"formGroup\">\r\n <mat-form-field \r\n [appearance]=\"this.inputConfig.appearance ||'fill' \"\r\n [floatLabel]=\"'always'\"\r\n subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <lib-signature-pad-input [inputConfig]=\"this.inputConfig\"\r\n [formControlName]=\"inputConfig.id\"></lib-signature-pad-input>\r\n <!-- <app-signature-input [inputConfig]=\"this.inputConfig\"\r\n [formControlName]=\"inputConfig.id\"></app-signature-input>\r\n -->\r\n\r\n <!-- @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n } -->\r\n\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n\r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n\r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n\r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n\r\n \r\n\r\n </mat-form-field>\r\n</form>", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: SignaturePadInputComponent, selector: "lib-signature-pad-input", inputs: ["inputConfig"] }] }); }
|
|
7197
7206
|
}
|
|
7198
7207
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: SignatureInputElementComponent, decorators: [{
|
|
7199
7208
|
type: Component,
|
|
@@ -7231,7 +7240,7 @@ class AutoCompleteInputElementComponent {
|
|
|
7231
7240
|
return getInputErrorMessage(this.inputConfig, this.formGroup);
|
|
7232
7241
|
}
|
|
7233
7242
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: AutoCompleteInputElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7234
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: AutoCompleteInputElementComponent, isStandalone: true, selector: "lib-auto-complete-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup", options: "options" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "\r\n<form [formGroup]=\"formGroup\">\r\n\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <input [readonly]=\"this.inputConfig.readonly\" [pattern]=\"this.inputConfig.pattern || ''\"\r\n [required]=\"this.inputConfig.required\" [attr.maxlength]=\"this.inputConfig.maxLength\"\r\n [formControlName]=\"this.inputConfig.id\" [attr.minlength]=\"this.inputConfig.minLength\"\r\n [type]=\"this.inputConfig.type||'text'\" \r\n [min]=\"this.inputConfig.min\" [max]=\"this.inputConfig.max\" autocomplete=\"on\"\r\n [matAutocomplete]=\"auto\"\r\n matInput />\r\n \r\n <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\">\r\n @for (option of options ; track option.id) {\r\n <mat-option [value]=\"option.value\">{{option.label}}</mat-option>\r\n }\r\n </mat-autocomplete>\r\n\r\n<!-- \r\n @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint [matTooltip]=\"inputConfig.hintLabel ||''\" class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n } -->\r\n \r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n \r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n \r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n \r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n \r\n \r\n \r\n \r\n </mat-form-field>\r\n</form>\r\n\r\n", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i1$5.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2$
|
|
7243
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: AutoCompleteInputElementComponent, isStandalone: true, selector: "lib-auto-complete-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup", options: "options" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "\r\n<form [formGroup]=\"formGroup\">\r\n\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <input [readonly]=\"this.inputConfig.readonly\" [pattern]=\"this.inputConfig.pattern || ''\"\r\n [required]=\"this.inputConfig.required\" [attr.maxlength]=\"this.inputConfig.maxLength\"\r\n [formControlName]=\"this.inputConfig.id\" [attr.minlength]=\"this.inputConfig.minLength\"\r\n [type]=\"this.inputConfig.type||'text'\" \r\n [min]=\"this.inputConfig.min\" [max]=\"this.inputConfig.max\" autocomplete=\"on\"\r\n [matAutocomplete]=\"auto\"\r\n matInput />\r\n \r\n <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\">\r\n @for (option of options ; track option.id) {\r\n <mat-option [value]=\"option.value\">{{option.label}}</mat-option>\r\n }\r\n </mat-autocomplete>\r\n\r\n<!-- \r\n @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint [matTooltip]=\"inputConfig.hintLabel ||''\" class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n } -->\r\n \r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n \r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n \r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n \r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n \r\n \r\n \r\n \r\n </mat-form-field>\r\n</form>\r\n\r\n", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i1$5.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i1$5.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i5$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }] }); }
|
|
7235
7244
|
}
|
|
7236
7245
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: AutoCompleteInputElementComponent, decorators: [{
|
|
7237
7246
|
type: Component,
|
|
@@ -7271,7 +7280,7 @@ class ToggleComponent extends BaseCustomInput {
|
|
|
7271
7280
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.2", type: ToggleComponent, isStandalone: true, selector: "lib-toggle", inputs: { inputConfig: "inputConfig", changed: "changed" }, providers: [{
|
|
7272
7281
|
provide: MatFormFieldControl,
|
|
7273
7282
|
useExisting: forwardRef(() => ToggleComponent)
|
|
7274
|
-
}], usesInheritance: true, ngImport: i0, template: "\r\n<mat-slide-toggle \r\n\r\nstyle=\"display: block\" \r\n[required]=\"this.inputConfig.required\" \r\n[labelPosition]=\"this.inputConfig.labelPosition || 'after'\"\r\n(change)=\"this.changed($event)\"\r\n[checked]=\"this.value\"\r\n[ariaReadOnly]=\"this.inputConfig.disabled\"\r\n[disabled]=\"this.inputConfig.disabled\"\r\n>\r\n{{this.inputConfig.label | titlecase }}</mat-slide-toggle>", styles: [""], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2$
|
|
7283
|
+
}], usesInheritance: true, ngImport: i0, template: "\r\n<mat-slide-toggle \r\n\r\nstyle=\"display: block\" \r\n[required]=\"this.inputConfig.required\" \r\n[labelPosition]=\"this.inputConfig.labelPosition || 'after'\"\r\n(change)=\"this.changed($event)\"\r\n[checked]=\"this.value\"\r\n[ariaReadOnly]=\"this.inputConfig.disabled\"\r\n[disabled]=\"this.inputConfig.disabled\"\r\n>\r\n{{this.inputConfig.label | titlecase }}</mat-slide-toggle>", styles: [""], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2$4.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$2.TitleCasePipe, name: "titlecase" }] }); }
|
|
7275
7284
|
}
|
|
7276
7285
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: ToggleComponent, decorators: [{
|
|
7277
7286
|
type: Component,
|
|
@@ -7300,7 +7309,7 @@ class ToggleInputElementComponent {
|
|
|
7300
7309
|
return getInputErrorMessage(this.inputConfig, this.formGroup);
|
|
7301
7310
|
}
|
|
7302
7311
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: ToggleInputElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7303
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: ToggleInputElementComponent, isStandalone: true, selector: "lib-toggle-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "\r\n<form [formGroup]=\"formGroup\" >\r\n <mat-form-field \r\n [appearance]=\"this.inputConfig.appearance ||'fill' \"\r\n floatLabel=\"always\"\r\n subscriptSizing=\"dynamic\"\r\n *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n toggle to select\r\n \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n<lib-toggle [inputConfig]=\"this.inputConfig\"\r\n[formControlName]=\"inputConfig.id\" ></lib-toggle>\r\n \r\n\r\n<!-- @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n } -->\r\n\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n\r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n\r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n\r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n\r\n </mat-form-field>\r\n</form>\r\n", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
7312
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: ToggleInputElementComponent, isStandalone: true, selector: "lib-toggle-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "\r\n<form [formGroup]=\"formGroup\" >\r\n <mat-form-field \r\n [appearance]=\"this.inputConfig.appearance ||'fill' \"\r\n floatLabel=\"always\"\r\n subscriptSizing=\"dynamic\"\r\n *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n toggle to select\r\n \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n<lib-toggle [inputConfig]=\"this.inputConfig\"\r\n[formControlName]=\"inputConfig.id\" ></lib-toggle>\r\n \r\n\r\n<!-- @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n } -->\r\n\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n\r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n\r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n\r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n\r\n </mat-form-field>\r\n</form>\r\n", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ToggleComponent, selector: "lib-toggle", inputs: ["inputConfig", "changed"] }] }); }
|
|
7304
7313
|
}
|
|
7305
7314
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: ToggleInputElementComponent, decorators: [{
|
|
7306
7315
|
type: Component,
|
|
@@ -7357,7 +7366,7 @@ class SelectInputElementComponent {
|
|
|
7357
7366
|
this.valueChange.emit(event.value);
|
|
7358
7367
|
}
|
|
7359
7368
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: SelectInputElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7360
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: SelectInputElementComponent, isStandalone: true, selector: "lib-select-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<ng-container [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\"\r\n *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n {{this.inputConfig.label }}\r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <mat-select #select [errorStateMatcher]=\"errorStateMatcher\" \r\n (selectionChange)=\"onSelectionChange($event)\"\r\n \r\n [formControlName]=\"inputConfig.id\" [required]=\"inputConfig.required\">\r\n\r\n <input [placeholder]=\"'search ' + inputConfig.label\" \r\n (keyup.Space)=\"$event.stopPropagation()\"\r\n style=\"--box-shadow: none; padding: 0px\" class=\"bottomLine\"\r\n (keyup.enter)=\"selectInputSearchWord($event)\"\r\n showCancelButton=\"never\">\r\n\r\n <mat-option *ngFor=\"\r\n let option of getSelectOptions();trackBy:trackOptions\" [value]=\"option.value\">\r\n <div [ngSwitch]=\"this.inputConfig.matOptions?.optionType\">\r\n <div *ngSwitchCase=\"'user'\">\r\n <mat-list-item style=\"padding: 0px;\">\r\n <img matListItemAvatar [src]=\"getAvatar(option.username)\" />\r\n <div matListItemTitle>{{ option.username | titlecase }}</div>\r\n <div matListItemLine> {{ option.email }}</div>\r\n </mat-list-item>\r\n\r\n </div>\r\n <div *ngSwitchDefault>{{ option.label }}</div>\r\n </div>\r\n </mat-option>\r\n </mat-select>\r\n\r\n\r\n @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n }\r\n\r\n\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n\r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n\r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n\r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n\r\n\r\n\r\n </mat-form-field>\r\n</ng-container>\r\n", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
7369
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: SelectInputElementComponent, isStandalone: true, selector: "lib-select-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<ng-container [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\"\r\n *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n {{this.inputConfig.label }}\r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <mat-select #select [errorStateMatcher]=\"errorStateMatcher\" \r\n (selectionChange)=\"onSelectionChange($event)\"\r\n \r\n [formControlName]=\"inputConfig.id\" [required]=\"inputConfig.required\">\r\n\r\n <input [placeholder]=\"'search ' + inputConfig.label\" \r\n (keyup.Space)=\"$event.stopPropagation()\"\r\n style=\"--box-shadow: none; padding: 0px\" class=\"bottomLine\"\r\n (keyup.enter)=\"selectInputSearchWord($event)\"\r\n showCancelButton=\"never\">\r\n\r\n <mat-option *ngFor=\"\r\n let option of getSelectOptions();trackBy:trackOptions\" [value]=\"option.value\">\r\n <div [ngSwitch]=\"this.inputConfig.matOptions?.optionType\">\r\n <div *ngSwitchCase=\"'user'\">\r\n <mat-list-item style=\"padding: 0px;\">\r\n <img matListItemAvatar [src]=\"getAvatar(option.username)\" />\r\n <div matListItemTitle>{{ option.username | titlecase }}</div>\r\n <div matListItemLine> {{ option.email }}</div>\r\n </mat-list-item>\r\n\r\n </div>\r\n <div *ngSwitchDefault>{{ option.label }}</div>\r\n </div>\r\n </mat-option>\r\n </mat-select>\r\n\r\n\r\n @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n }\r\n\r\n\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n\r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n\r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n\r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n\r\n\r\n\r\n </mat-form-field>\r\n</ng-container>\r\n", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2$2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: i2$2.TitleCasePipe, name: "titlecase" }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i6.MatListItemAvatar, selector: "[matListItemAvatar]" }, { kind: "directive", type: i6.MatListItemLine, selector: "[matListItemLine]" }, { kind: "directive", type: i6.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i7$1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }] }); }
|
|
7361
7370
|
}
|
|
7362
7371
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: SelectInputElementComponent, decorators: [{
|
|
7363
7372
|
type: Component,
|
|
@@ -7381,7 +7390,7 @@ class TextareaInputElementComponent {
|
|
|
7381
7390
|
return getInputErrorMessage(this.inputConfig, this.formGroup);
|
|
7382
7391
|
}
|
|
7383
7392
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: TextareaInputElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7384
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: TextareaInputElementComponent, isStandalone: true, selector: "lib-textarea-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<form [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n<textarea \r\n [readonly]=\"this.inputConfig.readonly\"\r\n [required]=\"inputConfig.required\" [formControlName]=\"inputConfig.id\"\r\n [attr.maxlength]=\"inputConfig.maxLength\" [attr.minlength]=\"inputConfig.minLength\"\r\n [rows]=\"inputConfig.rows\" [spellcheck]=\"inputConfig.spellcheck\"\r\n [autocapitalize]=\"inputConfig.autocapitalize\" [autocomplete]=\"inputConfig.autocomplete\"\r\n [placeholder]=\"inputConfig.placeholder||''\" [wrap]=\"inputConfig.wrap\" matInput></textarea>\r\n\r\n\r\n <!-- @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n }\r\n -->\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n \r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n \r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n \r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n \r\n \r\n </mat-form-field>\r\n</form>\r\n", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
7393
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: TextareaInputElementComponent, isStandalone: true, selector: "lib-textarea-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<form [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n<textarea \r\n [readonly]=\"this.inputConfig.readonly\"\r\n [required]=\"inputConfig.required\" [formControlName]=\"inputConfig.id\"\r\n [attr.maxlength]=\"inputConfig.maxLength\" [attr.minlength]=\"inputConfig.minLength\"\r\n [rows]=\"inputConfig.rows\" [spellcheck]=\"inputConfig.spellcheck\"\r\n [autocapitalize]=\"inputConfig.autocapitalize\" [autocomplete]=\"inputConfig.autocomplete\"\r\n [placeholder]=\"inputConfig.placeholder||''\" [wrap]=\"inputConfig.wrap\" matInput></textarea>\r\n\r\n\r\n <!-- @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n }\r\n -->\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n \r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n \r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n \r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n \r\n \r\n </mat-form-field>\r\n</form>\r\n", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i5$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }] }); }
|
|
7385
7394
|
}
|
|
7386
7395
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: TextareaInputElementComponent, decorators: [{
|
|
7387
7396
|
type: Component,
|
|
@@ -7405,7 +7414,7 @@ class DateRangePickerInputElementComponent {
|
|
|
7405
7414
|
this.valueChange.emit({ value: event.value, formControlName: formControlName });
|
|
7406
7415
|
}
|
|
7407
7416
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: DateRangePickerInputElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7408
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: DateRangePickerInputElementComponent, isStandalone: true, selector: "lib-date-range-picker-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, providers: [provideNativeDateAdapter()], ngImport: i0, template: "<!-- <mat-form-field [appearance]=\"this.inputConfig.appearance || 'fill'\" floatLabel=\"auto\">\r\n <mat-label></mat-label>\r\n @if(inputConfig.startDateControl && inputConfig.endDateControl) {\r\n <ng-container>\r\n <mat-date-range-input [formGroup]=\"formGroup\" [rangePicker]=\"picker\">\r\n <input matStartDate [formControlName]=\"inputConfig.startDateControl\" placeholder=\"Start date\">\r\n <input matEndDate [formControlName]=\"inputConfig.endDateControl\" placeholder=\"End date\">\r\n </mat-date-range-input>\r\n <mat-hint>{{inputConfig.hintLabel}}</mat-hint>\r\n <mat-datepicker-toggle matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n <mat-date-range-picker #picker></mat-date-range-picker>\r\n\r\n @if (formGroup.controls[inputConfig.startDateControl]?.hasError('matStartDateInvalid')) {\r\n <mat-error>Invalid start date</mat-error>\r\n }\r\n @if (formGroup.controls[inputConfig.endDateControl]?.hasError('matEndDateInvalid')) {\r\n <mat-error>Invalid end date</mat-error>\r\n }\r\n \r\n @if(!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n </ng-container>\r\n }\r\n</mat-form-field> -->\r\n<form [formGroup]=\"formGroup\">\r\n\r\n\r\n<mat-form-field [appearance]=\"this.inputConfig.appearance || 'fill'\" subscriptSizing=\"dynamic\">\r\n <mat-label>{{inputConfig.label}} <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status></mat-label>\r\n <mat-date-range-input [required]=\"inputConfig.required\" [formGroup]=\"formGroup\" [rangePicker]=\"picker\">\r\n @if (inputConfig.startDateControl) {\r\n <input matStartDate \r\n [formControlName]=\"inputConfig.id+'.'+inputConfig.startDateControl\"\r\n [min]=\"inputConfig.startMinDate\"\r\n [max]=\"inputConfig.startMaxDate\"\r\n\r\n (dateChange)=\"dateChanged($event, inputConfig.startDateControl)\"\r\n placeholder=\"Start date\">\r\n }\r\n @if (inputConfig.endDateControl) {\r\n <input matEndDate \r\n [formControlName]=\"inputConfig.id+'.'+inputConfig.endDateControl\" \r\n placeholder=\"End date\"\r\n [min]=\"inputConfig.endMinDate\" \r\n [max]=\"inputConfig.endMaxDate\"\r\n (dateChange)=\"dateChanged($event, inputConfig.endDateControl)\"\r\n >\r\n }\r\n </mat-date-range-input>\r\n\r\n <mat-datepicker-toggle matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n <mat-date-range-picker touchUi #picker></mat-date-range-picker>\r\n\r\n @if (formGroup.controls[inputConfig.startDateControl||'startDate']?.hasError('matStartDateInvalid')) {\r\n <mat-error>Invalid start date</mat-error>\r\n }\r\n @if (formGroup.controls[inputConfig.endDateControl||'endDate']?.hasError('matEndDateInvalid')) {\r\n <mat-error>Invalid end date</mat-error>\r\n }\r\n \r\n\r\n<!-- \r\n @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint [matTooltip]=\"inputConfig.hintLabel ||''\" class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n } -->\r\n\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n\r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n</mat-form-field>\r\n</form>", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
7417
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: DateRangePickerInputElementComponent, isStandalone: true, selector: "lib-date-range-picker-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, providers: [provideNativeDateAdapter()], ngImport: i0, template: "<!-- <mat-form-field [appearance]=\"this.inputConfig.appearance || 'fill'\" floatLabel=\"auto\">\r\n <mat-label></mat-label>\r\n @if(inputConfig.startDateControl && inputConfig.endDateControl) {\r\n <ng-container>\r\n <mat-date-range-input [formGroup]=\"formGroup\" [rangePicker]=\"picker\">\r\n <input matStartDate [formControlName]=\"inputConfig.startDateControl\" placeholder=\"Start date\">\r\n <input matEndDate [formControlName]=\"inputConfig.endDateControl\" placeholder=\"End date\">\r\n </mat-date-range-input>\r\n <mat-hint>{{inputConfig.hintLabel}}</mat-hint>\r\n <mat-datepicker-toggle matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n <mat-date-range-picker #picker></mat-date-range-picker>\r\n\r\n @if (formGroup.controls[inputConfig.startDateControl]?.hasError('matStartDateInvalid')) {\r\n <mat-error>Invalid start date</mat-error>\r\n }\r\n @if (formGroup.controls[inputConfig.endDateControl]?.hasError('matEndDateInvalid')) {\r\n <mat-error>Invalid end date</mat-error>\r\n }\r\n \r\n @if(!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n </ng-container>\r\n }\r\n</mat-form-field> -->\r\n<form [formGroup]=\"formGroup\">\r\n\r\n\r\n<mat-form-field [appearance]=\"this.inputConfig.appearance || 'fill'\" subscriptSizing=\"dynamic\">\r\n <mat-label>{{inputConfig.label}} <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status></mat-label>\r\n <mat-date-range-input [required]=\"inputConfig.required\" [formGroup]=\"formGroup\" [rangePicker]=\"picker\">\r\n @if (inputConfig.startDateControl) {\r\n <input matStartDate \r\n [formControlName]=\"inputConfig.id+'.'+inputConfig.startDateControl\"\r\n [min]=\"inputConfig.startMinDate\"\r\n [max]=\"inputConfig.startMaxDate\"\r\n\r\n (dateChange)=\"dateChanged($event, inputConfig.startDateControl)\"\r\n placeholder=\"Start date\">\r\n }\r\n @if (inputConfig.endDateControl) {\r\n <input matEndDate \r\n [formControlName]=\"inputConfig.id+'.'+inputConfig.endDateControl\" \r\n placeholder=\"End date\"\r\n [min]=\"inputConfig.endMinDate\" \r\n [max]=\"inputConfig.endMaxDate\"\r\n (dateChange)=\"dateChanged($event, inputConfig.endDateControl)\"\r\n >\r\n }\r\n </mat-date-range-input>\r\n\r\n <mat-datepicker-toggle matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n <mat-date-range-picker touchUi #picker></mat-date-range-picker>\r\n\r\n @if (formGroup.controls[inputConfig.startDateControl||'startDate']?.hasError('matStartDateInvalid')) {\r\n <mat-error>Invalid start date</mat-error>\r\n }\r\n @if (formGroup.controls[inputConfig.endDateControl||'endDate']?.hasError('matEndDateInvalid')) {\r\n <mat-error>Invalid end date</mat-error>\r\n }\r\n \r\n\r\n<!-- \r\n @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint [matTooltip]=\"inputConfig.hintLabel ||''\" class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n } -->\r\n\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n\r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n</mat-form-field>\r\n</form>", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2$5.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i2$5.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i2$5.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i2$5.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i2$5.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }] }); }
|
|
7409
7418
|
}
|
|
7410
7419
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: DateRangePickerInputElementComponent, decorators: [{
|
|
7411
7420
|
type: Component,
|
|
@@ -7429,7 +7438,7 @@ class DatePickerInputElementComponent {
|
|
|
7429
7438
|
return getInputErrorMessage(this.inputConfig, this.formGroup);
|
|
7430
7439
|
}
|
|
7431
7440
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: DatePickerInputElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7432
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: DatePickerInputElementComponent, isStandalone: true, selector: "lib-date-picker-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "\r\n\r\n<form [formGroup]=\"formGroup\">\r\n\r\n <mat-form-field \r\n [appearance]=\"this.inputConfig.appearance ||'fill' \" \r\n subscriptSizing=\"dynamic\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <input [required]=\"inputConfig.required\" \r\n [formControlName]=\"inputConfig.id\"\r\n [min]=\"inputConfig.min\" \r\n (dateChange)=\"changed($event)\"\r\n [max]=\"inputConfig.max\" matInput \r\n [matDatepicker]=\"picker\" />\r\n <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n <mat-datepicker touchUi #picker></mat-datepicker>\r\n \r\n\r\n <!-- @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n }\r\n -->\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n \r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <!-- <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button>\r\n </ng-container> -->\r\n \r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n \r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n </mat-form-field>\r\n</form>", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
7441
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: DatePickerInputElementComponent, isStandalone: true, selector: "lib-date-picker-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "\r\n\r\n<form [formGroup]=\"formGroup\">\r\n\r\n <mat-form-field \r\n [appearance]=\"this.inputConfig.appearance ||'fill' \" \r\n subscriptSizing=\"dynamic\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <input [required]=\"inputConfig.required\" \r\n [formControlName]=\"inputConfig.id\"\r\n [min]=\"inputConfig.min\" \r\n (dateChange)=\"changed($event)\"\r\n [max]=\"inputConfig.max\" matInput \r\n [matDatepicker]=\"picker\" />\r\n <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n <mat-datepicker touchUi #picker></mat-datepicker>\r\n \r\n\r\n <!-- @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n }\r\n -->\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n \r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <!-- <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button>\r\n </ng-container> -->\r\n \r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n \r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n </mat-form-field>\r\n</form>", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2$5.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i2$5.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i2$5.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i5$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }] }); }
|
|
7433
7442
|
}
|
|
7434
7443
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: DatePickerInputElementComponent, decorators: [{
|
|
7435
7444
|
type: Component,
|
|
@@ -7585,7 +7594,7 @@ class FileUploaderComponent extends BaseCustomInput {
|
|
|
7585
7594
|
this.stateChanges.next();
|
|
7586
7595
|
}
|
|
7587
7596
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: FileUploaderComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7588
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: FileUploaderComponent, isStandalone: true, selector: "app-file-uploader", inputs: { inputConfig: "inputConfig" }, host: { properties: { "fileUploader.floating": "shouldLabelFloat", "id": "id" } }, providers: [{ provide: MatFormFieldControl, useExisting: FileUploaderComponent }], viewQueries: [{ propertyName: "uploader", first: true, predicate: ["uploader"], descendants: true }], usesInheritance: true, ngImport: i0, template: "\r\n <mat-progress-bar *ngIf=\"loading\" mode=\"indeterminate\"></mat-progress-bar>\r\n\r\n\r\n\r\n\r\n<section *ngIf=\"!shouldLabelFloat\">\r\n <br>\r\n <div \r\n [style.border-color]=\"dragOver ? ' var(--mat-stepper-header-selected-state-icon-background-color)' : '#ccc;'\"\r\n(dragover)=\"onDragOver($event)\" \r\n(drop)=\"onDrop($event)\" \r\n(dragleave)=\"onDragLeave($event)\"\r\n class=\"drop-zone\" >\r\n <div>\r\n <mat-icon>\r\n cloud_upload\r\n </mat-icon>\r\n </div>\r\n <div>\r\n @if (!!errorMessage\r\n\r\n ) {\r\n <span class=\"mat-mdc-form-field-error\" >\r\n {{errorMessage}}\r\n </span>\r\n }@else {\r\n Drag and drop files or click to upload\r\n }\r\n \r\n \r\n \r\n </div>\r\n \r\n </div>\r\n</section>\r\n\r\n<input\r\nstyle=\"display: none\"\r\nhidden\r\n[readonly]=\"!!this.inputConfig?.readonly\"\r\n[type]=\"this.inputConfig?.type|| 'file'\"\r\n[accept]=\"uploadType()\"\r\n(change)=\"onFileSelected($event)\"\r\n#uploader\r\n/>\r\n<div \r\n[style.border-color]=\"dragOver ? 'var(--mat-stepper-header-selected-state-icon-background-color)' : '#ccc;'\"\r\n*ngIf=\"!!shouldLabelFloat\" \r\nclass=\"drop-zone\"\r\n\r\n(dragover)=\"onDragOver($event)\" \r\n(drop)=\"onDrop($event)\" \r\n(dragleave)=\"onDragLeave($event)\">\r\n<img style=\"width: 100%;\" [src]=\"returnPreview()\" alt=\"\">\r\n<mat-toolbar style=\" height: min-content !important;\">\r\n <mat-icon\r\n [style.color]=\"dragOver ? 'var(--mat-stepper-header-selected-state-icon-background-color)' : ''\"\r\n >\r\n cloud_upload\r\n </mat-icon>\r\n <span class=\"spacer\"></span>\r\n <div style=\"padding: 8px;\" >\r\n <div style=\"\r\n line-height: normal;width: 100%;\r\n white-space:normal;overflow: hidden;text-overflow: ellipsis;\r\n font-size: 12px;color:var(--mat-stepper-header-selected-state-icon-background-color);\"\r\n *ngIf=\"!!this.fileName\">\r\n {{ this.fileName}}\r\n </div>\r\n <div style=\"font-size: 14px;\">\r\n \r\n Drag and drop files or click to upload\r\n \r\n </div>\r\n </div>\r\n \r\n \r\n <span class=\"spacer\"></span>\r\n <button (click)=\"clearFile($event)\" mat-icon-button>\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n</mat-toolbar>\r\n</div>\r\n", styles: [".fileUploader{opacity:0;display:none;transition:opacity .2s;height:50px}:host.floating .fileUploader{opacity:1}.drop-zone{border:2px dashed #ccc;padding:20px;text-align:center;cursor:pointer}.drop-zone:hover{border-color:var(--mat-stepper-header-selected-state-icon-background-color)}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type:
|
|
7597
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: FileUploaderComponent, isStandalone: true, selector: "app-file-uploader", inputs: { inputConfig: "inputConfig" }, host: { properties: { "fileUploader.floating": "shouldLabelFloat", "id": "id" } }, providers: [{ provide: MatFormFieldControl, useExisting: FileUploaderComponent }], viewQueries: [{ propertyName: "uploader", first: true, predicate: ["uploader"], descendants: true }], usesInheritance: true, ngImport: i0, template: "\r\n <mat-progress-bar *ngIf=\"loading\" mode=\"indeterminate\"></mat-progress-bar>\r\n\r\n\r\n\r\n\r\n<section *ngIf=\"!shouldLabelFloat\">\r\n <br>\r\n <div \r\n [style.border-color]=\"dragOver ? ' var(--mat-stepper-header-selected-state-icon-background-color)' : '#ccc;'\"\r\n(dragover)=\"onDragOver($event)\" \r\n(drop)=\"onDrop($event)\" \r\n(dragleave)=\"onDragLeave($event)\"\r\n class=\"drop-zone\" >\r\n <div>\r\n <mat-icon>\r\n cloud_upload\r\n </mat-icon>\r\n </div>\r\n <div>\r\n @if (!!errorMessage\r\n\r\n ) {\r\n <span class=\"mat-mdc-form-field-error\" >\r\n {{errorMessage}}\r\n </span>\r\n }@else {\r\n Drag and drop files or click to upload\r\n }\r\n \r\n \r\n \r\n </div>\r\n \r\n </div>\r\n</section>\r\n\r\n<input\r\nstyle=\"display: none\"\r\nhidden\r\n[readonly]=\"!!this.inputConfig?.readonly\"\r\n[type]=\"this.inputConfig?.type|| 'file'\"\r\n[accept]=\"uploadType()\"\r\n(change)=\"onFileSelected($event)\"\r\n#uploader\r\n/>\r\n<div \r\n[style.border-color]=\"dragOver ? 'var(--mat-stepper-header-selected-state-icon-background-color)' : '#ccc;'\"\r\n*ngIf=\"!!shouldLabelFloat\" \r\nclass=\"drop-zone\"\r\n\r\n(dragover)=\"onDragOver($event)\" \r\n(drop)=\"onDrop($event)\" \r\n(dragleave)=\"onDragLeave($event)\">\r\n<img style=\"width: 100%;\" [src]=\"returnPreview()\" alt=\"\">\r\n<mat-toolbar style=\" height: min-content !important;\">\r\n <mat-icon\r\n [style.color]=\"dragOver ? 'var(--mat-stepper-header-selected-state-icon-background-color)' : ''\"\r\n >\r\n cloud_upload\r\n </mat-icon>\r\n <span class=\"spacer\"></span>\r\n <div style=\"padding: 8px;\" >\r\n <div style=\"\r\n line-height: normal;width: 100%;\r\n white-space:normal;overflow: hidden;text-overflow: ellipsis;\r\n font-size: 12px;color:var(--mat-stepper-header-selected-state-icon-background-color);\"\r\n *ngIf=\"!!this.fileName\">\r\n {{ this.fileName}}\r\n </div>\r\n <div style=\"font-size: 14px;\">\r\n \r\n Drag and drop files or click to upload\r\n \r\n </div>\r\n </div>\r\n \r\n \r\n <span class=\"spacer\"></span>\r\n <button (click)=\"clearFile($event)\" mat-icon-button>\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n</mat-toolbar>\r\n</div>\r\n", styles: [".fileUploader{opacity:0;display:none;transition:opacity .2s;height:50px}:host.floating .fileUploader{opacity:1}.drop-zone{border:2px dashed #ccc;padding:20px;text-align:center;cursor:pointer}.drop-zone:hover{border-color:var(--mat-stepper-header-selected-state-icon-background-color)}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4$3.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: i9.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
7589
7598
|
}
|
|
7590
7599
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: FileUploaderComponent, decorators: [{
|
|
7591
7600
|
type: Component,
|
|
@@ -7621,7 +7630,7 @@ class FileUploadInputElementComponent {
|
|
|
7621
7630
|
return getInputErrorMessage(this.inputConfig, this.formGroup);
|
|
7622
7631
|
}
|
|
7623
7632
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: FileUploadInputElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7624
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: FileUploadInputElementComponent, isStandalone: true, selector: "lib-file-upload-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<form [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as classInput\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <app-file-uploader\r\n [inputConfig]=\"inputConfig\"\r\n [formControlName]=\"inputConfig.id\"\r\n ></app-file-uploader>\r\n\r\n\r\n <!-- @if(inputConfig.hintLabel || classInput.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ classInput.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n } -->\r\n \r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n \r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"classInput.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ classInput.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n \r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n \r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n \r\n \r\n \r\n </mat-form-field>\r\n</form>\r\n\r\n", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "component", type: FileUploaderComponent, selector: "app-file-uploader", inputs: ["inputConfig"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
7633
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: FileUploadInputElementComponent, isStandalone: true, selector: "lib-file-upload-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<form [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as classInput\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <app-file-uploader\r\n [inputConfig]=\"inputConfig\"\r\n [formControlName]=\"inputConfig.id\"\r\n ></app-file-uploader>\r\n\r\n\r\n <!-- @if(inputConfig.hintLabel || classInput.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ classInput.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n } -->\r\n \r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n \r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"classInput.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ classInput.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n \r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n \r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n \r\n \r\n \r\n </mat-form-field>\r\n</form>\r\n\r\n", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "component", type: FileUploaderComponent, selector: "app-file-uploader", inputs: ["inputConfig"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }] }); }
|
|
7625
7634
|
}
|
|
7626
7635
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: FileUploadInputElementComponent, decorators: [{
|
|
7627
7636
|
type: Component,
|
|
@@ -7852,7 +7861,7 @@ class EditorInputElementComponent {
|
|
|
7852
7861
|
return getInputErrorMessage(this.inputConfig, this.formGroup);
|
|
7853
7862
|
}
|
|
7854
7863
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: EditorInputElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7855
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: EditorInputElementComponent, isStandalone: true, selector: "lib-editor-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "\r\n@if (inputConfig.richTextEditorLibrary === 'EditorJS') {\r\n <form [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as classInput\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <lib-editor-js-input \r\n [inputConfig]=\"inputConfig\"\r\n [formControlName]=\"inputConfig.id\"\r\n (change)=\"changed($event)\"\r\n ></lib-editor-js-input>\r\n <!-- <app-form-input-rich-text-editor\r\n [inputConfig]=\"inputConfig\"\r\n [formControlName]=\"inputConfig.id\"\r\n (change)=\"changed($event)\"\r\n >\r\n </app-form-input-rich-text-editor> -->\r\n\r\n\r\n <!-- @if(inputConfig.hintLabel || classInput.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ classInput.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n }\r\n -->\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n \r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"classInput.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ classInput.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n \r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n \r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n \r\n\r\n \r\n </mat-form-field>\r\n \r\n</form>\r\n\r\n}\r\n\r\n\r\n\r\n\r\n@if (inputConfig.richTextEditorLibrary === 'CkEditor') {\r\n <form [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as classInput\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n<app-form-input-rich-text-editor\r\n [inputConfig]=\"inputConfig\"\r\n [formControlName]=\"inputConfig.id\"\r\n (change)=\"changed($event)\"\r\n >\r\n </app-form-input-rich-text-editor>\r\n \r\n <mat-hint *ngIf=\"inputConfig.hintLabel\" [matTooltip]=\"inputConfig.hintLabel\" class=\"inputHint\">\r\n {{inputConfig.hintLabel}}\r\n </mat-hint>\r\n\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n\r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <!-- <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"classInput.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ classInput.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button>\r\n </ng-container> -->\r\n\r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n\r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n \r\n </mat-form-field>\r\n \r\n</form>\r\n\r\n}\r\n", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i8
|
|
7864
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: EditorInputElementComponent, isStandalone: true, selector: "lib-editor-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "\r\n@if (inputConfig.richTextEditorLibrary === 'EditorJS') {\r\n <form [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as classInput\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <lib-editor-js-input \r\n [inputConfig]=\"inputConfig\"\r\n [formControlName]=\"inputConfig.id\"\r\n (change)=\"changed($event)\"\r\n ></lib-editor-js-input>\r\n <!-- <app-form-input-rich-text-editor\r\n [inputConfig]=\"inputConfig\"\r\n [formControlName]=\"inputConfig.id\"\r\n (change)=\"changed($event)\"\r\n >\r\n </app-form-input-rich-text-editor> -->\r\n\r\n\r\n <!-- @if(inputConfig.hintLabel || classInput.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ classInput.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n }\r\n -->\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n \r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"classInput.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ classInput.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n \r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n \r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n \r\n\r\n \r\n </mat-form-field>\r\n \r\n</form>\r\n\r\n}\r\n\r\n\r\n\r\n\r\n@if (inputConfig.richTextEditorLibrary === 'CkEditor') {\r\n <form [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as classInput\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n<app-form-input-rich-text-editor\r\n [inputConfig]=\"inputConfig\"\r\n [formControlName]=\"inputConfig.id\"\r\n (change)=\"changed($event)\"\r\n >\r\n </app-form-input-rich-text-editor>\r\n \r\n <mat-hint *ngIf=\"inputConfig.hintLabel\" [matTooltip]=\"inputConfig.hintLabel\" class=\"inputHint\">\r\n {{inputConfig.hintLabel}}\r\n </mat-hint>\r\n\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n\r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <!-- <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"classInput.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ classInput.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button>\r\n </ng-container> -->\r\n\r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n\r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n \r\n </mat-form-field>\r\n \r\n</form>\r\n\r\n}\r\n", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormInputRichTextEditorComponent, selector: "app-form-input-rich-text-editor", inputs: ["inputConfig"] }, { kind: "component", type: EditorJsInputComponent, selector: "lib-editor-js-input", inputs: ["inputConfig"] }] }); }
|
|
7856
7865
|
}
|
|
7857
7866
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: EditorInputElementComponent, decorators: [{
|
|
7858
7867
|
type: Component,
|
|
@@ -7964,7 +7973,7 @@ class BasicInputInputElementComponent {
|
|
|
7964
7973
|
return control?.invalid && (control?.touched || control?.dirty);
|
|
7965
7974
|
}
|
|
7966
7975
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: BasicInputInputElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7967
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: BasicInputInputElementComponent, isStandalone: true, selector: "lib-basic-input-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "\r\n <ng-container [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill'\" subscriptSizing=\"dynamic\"\r\n *ngIf=\"this.inputConfig as classInput\">\r\n <mat-label>\r\n {{inputConfig.label }}\r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <lib-input-custom\r\n [inputConfig]=\"this.inputConfig\"\r\n [formControlName]=\"this.inputConfig.id\" \r\n ></lib-input-custom>\r\n\r\n @if(errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- [type]=\"this.inputConfig.showPassword ? 'text' : this.inputConfig.type||'text'\"-->\r\n <!-- @if(classInput.canRefresh){\r\n <button\r\n (click)=\"classInput.refresh()\"\r\n style=\" min-width: 1%;\"\r\n [matTooltip]=\"'Click to refresh this field. This will update any calculated values, fetch latest data from services, or reload available options'\"\r\n color=\"primary\" matSuffix mat-icon-button>\r\n <mat-icon>\r\n sync\r\n </mat-icon>\r\n </button>\r\n } -->\r\n\r\n\r\n @if(inputConfig.hintLabel || classInput.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ classInput.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n }\r\n\r\n \r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n\r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <!-- <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"classInput.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ classInput.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button>\r\n </ng-container> -->\r\n\r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n\r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n\r\n <!-- Password Strength Hint -->\r\n <mat-hint *ngIf=\"inputConfig.type === 'password'\" [style.color]=\"passwordStrengthColor(inputConfig.id)\"\r\n matTooltip=\"The password should be at least 8 characters long. Have at least one uppercase letter, one lowercase, one digit, one special character.\"\r\n align=\"end\">\r\n {{ checkPasswordStrength(inputConfig.id) }} password\r\n </mat-hint>\r\n\r\n </mat-form-field>\r\n\r\n \r\n\r\n\r\n</ng-container>\r\n", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i8
|
|
7976
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: BasicInputInputElementComponent, isStandalone: true, selector: "lib-basic-input-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "\r\n <ng-container [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill'\" subscriptSizing=\"dynamic\"\r\n *ngIf=\"this.inputConfig as classInput\">\r\n <mat-label>\r\n {{inputConfig.label }}\r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <lib-input-custom\r\n [inputConfig]=\"this.inputConfig\"\r\n [formControlName]=\"this.inputConfig.id\" \r\n ></lib-input-custom>\r\n\r\n @if(errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- [type]=\"this.inputConfig.showPassword ? 'text' : this.inputConfig.type||'text'\"-->\r\n <!-- @if(classInput.canRefresh){\r\n <button\r\n (click)=\"classInput.refresh()\"\r\n style=\" min-width: 1%;\"\r\n [matTooltip]=\"'Click to refresh this field. This will update any calculated values, fetch latest data from services, or reload available options'\"\r\n color=\"primary\" matSuffix mat-icon-button>\r\n <mat-icon>\r\n sync\r\n </mat-icon>\r\n </button>\r\n } -->\r\n\r\n\r\n @if(inputConfig.hintLabel || classInput.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ classInput.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n }\r\n\r\n \r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n\r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <!-- <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"classInput.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ classInput.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button>\r\n </ng-container> -->\r\n\r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n\r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n\r\n <!-- Password Strength Hint -->\r\n <mat-hint *ngIf=\"inputConfig.type === 'password'\" [style.color]=\"passwordStrengthColor(inputConfig.id)\"\r\n matTooltip=\"The password should be at least 8 characters long. Have at least one uppercase letter, one lowercase, one digit, one special character.\"\r\n align=\"end\">\r\n {{ checkPasswordStrength(inputConfig.id) }} password\r\n </mat-hint>\r\n\r\n </mat-form-field>\r\n\r\n \r\n\r\n\r\n</ng-container>\r\n", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: InputCustomComponent, selector: "lib-input-custom", inputs: ["inputConfig"] }] }); }
|
|
7968
7977
|
}
|
|
7969
7978
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: BasicInputInputElementComponent, decorators: [{
|
|
7970
7979
|
type: Component,
|
|
@@ -8274,7 +8283,7 @@ class MultipleInputTableViewComponent {
|
|
|
8274
8283
|
return !!this.inputConfig?.formIsOpen && this.formGroup?.controls[`${this.inputConfig?.id}.id`]?.value === row[`${this.inputConfig?.id}.id`];
|
|
8275
8284
|
}
|
|
8276
8285
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MultipleInputTableViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8277
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: MultipleInputTableViewComponent, isStandalone: true, selector: "lib-multiple-input-table-view", inputs: { inputConfig: "inputConfig", dataSource: "dataSource", applyOptionsTo: "applyOptionsTo", formGroup: "formGroup" }, outputs: { onEditItem: "onEditItem", onDeleteItem: "onDeleteItem", onCopy: "onCopy", onApplyOptionsTo: "onApplyOptionsTo" }, ngImport: i0, template: "@defer (on viewport) {\r\n\r\n@if (configureCols.displayedColumnsInOrder.length===0) {\r\n<div style=\"\r\n padding-left: 16px;\r\n padding-right: 16px;\r\n padding-top: 16px;\r\n padding-bottom: 16px;\r\n\r\n display: flex;\r\n justify-content: center;\r\n opacity: 0.6;\r\n font-size: 13px;\r\n \">\r\n No columns\r\n</div>\r\n}\r\n<div class=\"table-container\">\r\n\r\n <table mat-table [dataSource]=\"(dataSource || [])\" class=\"example-table\" matSort matSortActive=\"created\"\r\n matSortDisableClear matSortDirection=\"desc\">\r\n @for (col of (configureCols.displayedColumnsInOrder||[]); track col) {\r\n <ng-container [matColumnDef]=\"col\">\r\n <th mat-header-cell mat-sort-header *matHeaderCellDef>\r\n <span style=\"text-align: start; line-height: normal; font-size: 13px\">\r\n {{ configureCols.columnsConfig?.[col]?.[\"label\"] }}\r\n </span>\r\n </th>\r\n <td [class.functionClass]=\"row['SYSTEM_KEY_PROPERTY_FOR_MULTIPLE_INPUTS_CALCULATION_FUNCTION']\"\r\n \r\n [style.background]=\"\r\n returnBackground(row, configureCols.columnsConfig?.[col])\r\n \" mat-cell *matCellDef=\"let row\">\r\n <div *ngIf=\" configureCols.columnsConfig?.[col]?.['type'] === 'removal'\" class=\"cellClass\">\r\n <span *ngIf=\"\r\n !!row['SYSTEM_KEY_PROPERTY_FOR_MULTIPLE_INPUTS_CALCULATION_FUNCTION'] &&\r\n inputConfig?.multipleInputInEditId !== row['id']\">\r\n <strong>\r\n\r\n {{getCalculationFunction(row)}}\r\n </strong>\r\n\r\n </span>\r\n <button mat-icon-button\r\n [color]=\"t.menuOpen ? 'primary' : 'basic'\"\r\n *ngIf=\"\r\n !row['SYSTEM_KEY_PROPERTY_FOR_MULTIPLE_INPUTS_CALCULATION_FUNCTION'] &&\r\n row['' ] !== 'true'\r\n \r\n \" \r\n [matMenuTriggerFor]=\"rowOptions\" \r\n [matMenuTriggerData]=\"{row}\" \r\n #t=\"matMenuTrigger\" (click)=\"applyOptionsToFn(row)\"\r\n expand=\"block\" fill=\"clear\" style=\"margin-left: auto;margin-right:0px;display:block\">\r\n @if (rowIsInEdit(row)) {\r\n <mat-icon color=\"primary\">\r\n edit\r\n </mat-icon> \r\n\r\n }@else {\r\n <mat-icon >\r\n {{\r\n t.menuOpen ? 'close' : 'more_horiz'\r\n }}\r\n \r\n </mat-icon>\r\n }\r\n \r\n\r\n </button>\r\n\r\n\r\n <mat-chip *ngIf=\"\r\n row['SYSTEM_KEY_IN_EDIT']\r\n \r\n \">\r\n In {{ inputConfig?.readonly ? 'View' : 'Edit' }}\r\n\r\n </mat-chip>\r\n\r\n </div>\r\n <div *ngIf=\"configureCols.columnsConfig && configureCols.columnsConfig?.[col]?.type !== 'removal'\"\r\n class=\"cellClass\">\r\n <span *ngIf=\"isNumber(row[col])\">\r\n {{ row[col] | number }}\r\n </span>\r\n <span *ngIf=\"!isNumber(row[col])\"> {{ row[col] }}\r\n\r\n </span>\r\n </div>\r\n </td>\r\n </ng-container>\r\n }\r\n\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"configureCols.displayedColumnsInOrder \"></tr>\r\n <tr [style.border-top]=\"hasTopBorder(row) ? 'solid 2px' : ''\" mat-row\r\n *matRowDef=\"let row; columns: configureCols.displayedColumnsInOrder\"></tr>\r\n </table>\r\n <div *ngIf=\"(dataSource?._filterData)?.length === 0\">\r\n <div style=\"\r\n padding-left: 16px;\r\n padding-right: 16px;\r\n padding-top: 16px;\r\n padding-bottom: 16px;\r\n\r\n display: flex;\r\n justify-content: center;\r\n opacity: 0.6;\r\n font-size: 13px;\r\n \">\r\n No items\r\n </div>\r\n </div>\r\n</div>\r\n}@placeholder {\r\n<div style=\"padding: 50px;display:flex;justify-content:center;align-items:center; text-align: center;\">\r\n <mat-spinner diameter=\"50\" />\r\n</div>\r\n}\r\n<mat-menu #rowOptions=\"matMenu\">\r\n <ng-template matMenuContent let-row=\"row\">\r\n\r\n <button mat-menu-item (click)=\"editItem(row)\">\r\n <mat-icon>\r\n {{inputConfig?.readonly ? 'visibility' : 'edit'}}\r\n </mat-icon>\r\n <div class=\"option-text\">\r\n <div class=\"option-main-text\">\r\n {{inputConfig?.readonly ? 'View details' : 'Edit'}}\r\n </div>\r\n <div class=\"option-sub-text\">\r\n {{inputConfig?.readonly ? 'View item properties' : 'Modify item properties'}}\r\n </div>\r\n </div>\r\n </button>\r\n @if(!inputConfig?.readonly){\r\n <button mat-menu-item (click)=\"copy(row)\">\r\n <mat-icon>\r\n content_copy\r\n </mat-icon>\r\n <div class=\"option-text\">\r\n <div class=\"option-main-text\">\r\n Duplicate\r\n </div>\r\n <div class=\"option-sub-text\">\r\n Create a copy with same values\r\n </div>\r\n </div>\r\n </button>\r\n @if(isAboutToDeleteRow(row)){\r\n <button mat-menu-item (click)=\"multipleInputRemoveItem($event,row)\">\r\n <mat-icon color=\"accent\">\r\n cancel\r\n </mat-icon>\r\n <div class=\"option-text\">\r\n <div class=\"option-main-text\" style=\"color: #2196F3;\">\r\n Cancel Deletion\r\n </div>\r\n <div class=\"option-sub-text\">\r\n Auto-deleting in {{ secondsCountDown()}} seconds...\r\n </div>\r\n </div>\r\n </button>\r\n <div class=\"deletion-progress-container\">\r\n <mat-progress-bar color=\"warn\" mode=\"determinate\" [value]=\"getCountdownSeconds()\"></mat-progress-bar>\r\n <div class=\"deletion-message\" *ngIf=\"getCountdownSeconds() > 75\">\r\n Deleting soon...\r\n </div>\r\n </div>\r\n }@else {\r\n <button mat-menu-item (click)=\"multipleInputRemoveItem($event,row)\">\r\n <mat-icon color=\"warn\">\r\n delete_outline\r\n </mat-icon>\r\n <div class=\"option-text\">\r\n <div class=\"option-main-text\">\r\n Delete \r\n </div>\r\n <div class=\"option-sub-text\">\r\n Will delete after 3 seconds (click to cancel)\r\n </div>\r\n </div>\r\n </button>\r\n }\r\n }\r\n </ng-template>\r\n</mat-menu>", styles: [".functionClass{background:var(--mat-toolbar-container-background-color, var(--mat-app-surface));font-weight:500}.option-text{display:flex;flex-direction:column;margin-left:8px}.option-main-text{font-size:14px;font-weight:500;margin-bottom:2px;line-height:normal}.option-sub-text{line-height:normal;font-size:12px;color:#0000008a;font-weight:400;line-height:1.2}.deletion-progress-container{position:relative;padding:0 16px 8px}.deletion-message{position:absolute;right:16px;top:2px;font-size:11px;color:#f44336;font-weight:500;line-height:1.6;animation:pulse 1s infinite}button:has(+.deletion-progress-container){border-bottom:none!important;padding-bottom:4px!important}@keyframes pulse{0%{opacity:.7}50%{opacity:1}to{opacity:.7}}@media (max-width: 600px){.option-sub-text{max-width:180px;white-space:normal}}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i6$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6$1.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "component", type: i4$
|
|
8286
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: MultipleInputTableViewComponent, isStandalone: true, selector: "lib-multiple-input-table-view", inputs: { inputConfig: "inputConfig", dataSource: "dataSource", applyOptionsTo: "applyOptionsTo", formGroup: "formGroup" }, outputs: { onEditItem: "onEditItem", onDeleteItem: "onDeleteItem", onCopy: "onCopy", onApplyOptionsTo: "onApplyOptionsTo" }, ngImport: i0, template: "@defer (on viewport) {\r\n\r\n@if (configureCols.displayedColumnsInOrder.length===0) {\r\n<div style=\"\r\n padding-left: 16px;\r\n padding-right: 16px;\r\n padding-top: 16px;\r\n padding-bottom: 16px;\r\n\r\n display: flex;\r\n justify-content: center;\r\n opacity: 0.6;\r\n font-size: 13px;\r\n \">\r\n No columns\r\n</div>\r\n}\r\n<div class=\"table-container\">\r\n\r\n <table mat-table [dataSource]=\"(dataSource || [])\" class=\"example-table\" matSort matSortActive=\"created\"\r\n matSortDisableClear matSortDirection=\"desc\">\r\n @for (col of (configureCols.displayedColumnsInOrder||[]); track col) {\r\n <ng-container [matColumnDef]=\"col\">\r\n <th mat-header-cell mat-sort-header *matHeaderCellDef>\r\n <span style=\"text-align: start; line-height: normal; font-size: 13px\">\r\n {{ configureCols.columnsConfig?.[col]?.[\"label\"] }}\r\n </span>\r\n </th>\r\n <td [class.functionClass]=\"row['SYSTEM_KEY_PROPERTY_FOR_MULTIPLE_INPUTS_CALCULATION_FUNCTION']\"\r\n \r\n [style.background]=\"\r\n returnBackground(row, configureCols.columnsConfig?.[col])\r\n \" mat-cell *matCellDef=\"let row\">\r\n <div *ngIf=\" configureCols.columnsConfig?.[col]?.['type'] === 'removal'\" class=\"cellClass\">\r\n <span *ngIf=\"\r\n !!row['SYSTEM_KEY_PROPERTY_FOR_MULTIPLE_INPUTS_CALCULATION_FUNCTION'] &&\r\n inputConfig?.multipleInputInEditId !== row['id']\">\r\n <strong>\r\n\r\n {{getCalculationFunction(row)}}\r\n </strong>\r\n\r\n </span>\r\n <button mat-icon-button\r\n [color]=\"t.menuOpen ? 'primary' : 'basic'\"\r\n *ngIf=\"\r\n !row['SYSTEM_KEY_PROPERTY_FOR_MULTIPLE_INPUTS_CALCULATION_FUNCTION'] &&\r\n row['' ] !== 'true'\r\n \r\n \" \r\n [matMenuTriggerFor]=\"rowOptions\" \r\n [matMenuTriggerData]=\"{row}\" \r\n #t=\"matMenuTrigger\" (click)=\"applyOptionsToFn(row)\"\r\n expand=\"block\" fill=\"clear\" style=\"margin-left: auto;margin-right:0px;display:block\">\r\n @if (rowIsInEdit(row)) {\r\n <mat-icon color=\"primary\">\r\n edit\r\n </mat-icon> \r\n\r\n }@else {\r\n <mat-icon >\r\n {{\r\n t.menuOpen ? 'close' : 'more_horiz'\r\n }}\r\n \r\n </mat-icon>\r\n }\r\n \r\n\r\n </button>\r\n\r\n\r\n <mat-chip *ngIf=\"\r\n row['SYSTEM_KEY_IN_EDIT']\r\n \r\n \">\r\n In {{ inputConfig?.readonly ? 'View' : 'Edit' }}\r\n\r\n </mat-chip>\r\n\r\n </div>\r\n <div *ngIf=\"configureCols.columnsConfig && configureCols.columnsConfig?.[col]?.type !== 'removal'\"\r\n class=\"cellClass\">\r\n <span *ngIf=\"isNumber(row[col])\">\r\n {{ row[col] | number }}\r\n </span>\r\n <span *ngIf=\"!isNumber(row[col])\"> {{ row[col] }}\r\n\r\n </span>\r\n </div>\r\n </td>\r\n </ng-container>\r\n }\r\n\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"configureCols.displayedColumnsInOrder \"></tr>\r\n <tr [style.border-top]=\"hasTopBorder(row) ? 'solid 2px' : ''\" mat-row\r\n *matRowDef=\"let row; columns: configureCols.displayedColumnsInOrder\"></tr>\r\n </table>\r\n <div *ngIf=\"(dataSource?._filterData)?.length === 0\">\r\n <div style=\"\r\n padding-left: 16px;\r\n padding-right: 16px;\r\n padding-top: 16px;\r\n padding-bottom: 16px;\r\n\r\n display: flex;\r\n justify-content: center;\r\n opacity: 0.6;\r\n font-size: 13px;\r\n \">\r\n No items\r\n </div>\r\n </div>\r\n</div>\r\n}@placeholder {\r\n<div style=\"padding: 50px;display:flex;justify-content:center;align-items:center; text-align: center;\">\r\n <mat-spinner diameter=\"50\" />\r\n</div>\r\n}\r\n<mat-menu #rowOptions=\"matMenu\">\r\n <ng-template matMenuContent let-row=\"row\">\r\n\r\n <button mat-menu-item (click)=\"editItem(row)\">\r\n <mat-icon>\r\n {{inputConfig?.readonly ? 'visibility' : 'edit'}}\r\n </mat-icon>\r\n <div class=\"option-text\">\r\n <div class=\"option-main-text\">\r\n {{inputConfig?.readonly ? 'View details' : 'Edit'}}\r\n </div>\r\n <div class=\"option-sub-text\">\r\n {{inputConfig?.readonly ? 'View item properties' : 'Modify item properties'}}\r\n </div>\r\n </div>\r\n </button>\r\n @if(!inputConfig?.readonly){\r\n <button mat-menu-item (click)=\"copy(row)\">\r\n <mat-icon>\r\n content_copy\r\n </mat-icon>\r\n <div class=\"option-text\">\r\n <div class=\"option-main-text\">\r\n Duplicate\r\n </div>\r\n <div class=\"option-sub-text\">\r\n Create a copy with same values\r\n </div>\r\n </div>\r\n </button>\r\n @if(isAboutToDeleteRow(row)){\r\n <button mat-menu-item (click)=\"multipleInputRemoveItem($event,row)\">\r\n <mat-icon color=\"accent\">\r\n cancel\r\n </mat-icon>\r\n <div class=\"option-text\">\r\n <div class=\"option-main-text\" style=\"color: #2196F3;\">\r\n Cancel Deletion\r\n </div>\r\n <div class=\"option-sub-text\">\r\n Auto-deleting in {{ secondsCountDown()}} seconds...\r\n </div>\r\n </div>\r\n </button>\r\n <div class=\"deletion-progress-container\">\r\n <mat-progress-bar color=\"warn\" mode=\"determinate\" [value]=\"getCountdownSeconds()\"></mat-progress-bar>\r\n <div class=\"deletion-message\" *ngIf=\"getCountdownSeconds() > 75\">\r\n Deleting soon...\r\n </div>\r\n </div>\r\n }@else {\r\n <button mat-menu-item (click)=\"multipleInputRemoveItem($event,row)\">\r\n <mat-icon color=\"warn\">\r\n delete_outline\r\n </mat-icon>\r\n <div class=\"option-text\">\r\n <div class=\"option-main-text\">\r\n Delete \r\n </div>\r\n <div class=\"option-sub-text\">\r\n Will delete after 3 seconds (click to cancel)\r\n </div>\r\n </div>\r\n </button>\r\n }\r\n }\r\n </ng-template>\r\n</mat-menu>", styles: [".functionClass{background:var(--mat-toolbar-container-background-color, var(--mat-app-surface));font-weight:500}.option-text{display:flex;flex-direction:column;margin-left:8px}.option-main-text{font-size:14px;font-weight:500;margin-bottom:2px;line-height:normal}.option-sub-text{line-height:normal;font-size:12px;color:#0000008a;font-weight:400;line-height:1.2}.deletion-progress-container{position:relative;padding:0 16px 8px}.deletion-message{position:absolute;right:16px;top:2px;font-size:11px;color:#f44336;font-weight:500;line-height:1.6;animation:pulse 1s infinite}button:has(+.deletion-progress-container){border-bottom:none!important;padding-bottom:4px!important}@keyframes pulse{0%{opacity:.7}50%{opacity:1}to{opacity:.7}}@media (max-width: 600px){.option-sub-text{max-width:180px;white-space:normal}}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i6$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6$1.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "component", type: i4$3.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: i7.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatTableModule }], deferBlockDependencies: [() => [i2.MatIconButton, i4$4.MatChip, i5.MatIcon, i6$1.MatMenuTrigger, i4$2.MatSort, i4$2.MatSortHeader, i5$2.MatTable, i5$2.MatHeaderCellDef, i5$2.MatHeaderRowDef, i5$2.MatColumnDef, i5$2.MatCellDef, i5$2.MatRowDef, i5$2.MatHeaderCell, i5$2.MatCell, i5$2.MatHeaderRow, i5$2.MatRow, i2$2.NgIf, i2$2.DecimalPipe]] }); }
|
|
8278
8287
|
}
|
|
8279
8288
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MultipleInputTableViewComponent, decorators: [{
|
|
8280
8289
|
type: Component,
|
|
@@ -8420,7 +8429,7 @@ class MultipleInputTableEditComponent {
|
|
|
8420
8429
|
return !!this.inputConfig?.formIsOpen && !!this.formGroup?.controls[`${this.inputConfig?.id}.id`]?.value;
|
|
8421
8430
|
}
|
|
8422
8431
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MultipleInputTableEditComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8423
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: MultipleInputTableEditComponent, isStandalone: true, selector: "lib-multiple-input-table-edit", inputs: { inputConfig: "inputConfig", editorMode: "editorMode", formGroup: "formGroup", formBuilderFunctions: "formBuilderFunctions" }, outputs: { onSaveMultipleInputForm: "onSaveMultipleInputForm", editMultipleInput: "editMultipleInput", deleteInput: "deleteInput", showItemAsLabel: "showItemAsLabel", addFunction: "addFunction", reorderItems: "reorderItems" }, ngImport: i0, template: "\r\n<mat-card appearance=\"outlined\" style=\" margin-top: 8px;background:var(--mat-toolbar-container-background-color)\" class=\" mat-elevation-z4\">\r\n <mat-card-content>\r\n <div class=\"list\" (cdkDropListDropped)=\"dropItems($event)\"\r\n \r\n [cdkDropListData]=\"innerInputs\" cdkDropList\r\n \r\n #InputList=\"cdkDropList\" class=\"row\">\r\n @for( innerInput of innerInputs|| [];track innerInput.id\r\n ){\r\n <ng-container>\r\n @if(editorMode){\r\n <mat-card (mouseover)=\"activeInput = innerInput.id\" *ngIf=\"!!formGroup\" cdkDrag\r\n (cdkDragStarted)=\"dragging =true\" (cdkDragReleased)=\"dragging =false\"\r\n [class.inputCardElevated]=\"activeInput ===innerInput.id\"\r\n [class.inputCard]=\"activeInput !==innerInput.id\"\r\n [class]=\"'col-md-'+(dragging?'12':innerInput.colSize)\" class=\"box\">\r\n <div class=\"custom-placeholder\" *cdkDragPlaceholder></div>\r\n <ng-container *ngComponentOutlet=\"InputComponent; \r\n inputs: {\r\n inputConfig: innerInput,\r\n formGroup: formGroup,\r\n formBuilderFunctions: formBuilderFunctions,\r\n }\">\r\n </ng-container>\r\n <mat-card-actions *ngIf=\"activeInput === innerInput.id\">\r\n <span class=\"spacer\"></span>\r\n <button [matTooltip]=\"'Edit Input: ' + innerInput.label \"\r\n (click)=\"editInput(innerInput)\" mat-icon-button>\r\n <mat-icon>\r\n edit\r\n </mat-icon>\r\n\r\n </button>\r\n @if(!!inputWillBeRemovedIn(innerInput.id) ){\r\n <button (mouseover)=\"overId = innerInput.id\" (mouseout)=\"overId = null\"\r\n (click)=\"removeInput(innerInput)\" color=\"warn\" mat-stroked-button>\r\n <div style=\"display: flex; align-items: center;\">\r\n <mat-progress-spinner style=\"margin-right: 5px;\" color=\"primary\" class=\"cancelProgress\"\r\n [value]=\"((inputWillBeRemovedIn(innerInput.id)||0)/5)*100\">\r\n </mat-progress-spinner>\r\n\r\n {{overId === innerInput.id ? 'Click to cancel':'Deleting in'}}\r\n {{inputWillBeRemovedIn(innerInput.id)}}\r\n </div>\r\n\r\n </button>\r\n\r\n }@else {\r\n <button [matTooltip]=\"'Delete input ' + innerInput.label \"\r\n (click)=\"removeInput(innerInput)\" mat-icon-button>\r\n\r\n <mat-icon>\r\n delete\r\n </mat-icon>\r\n </button>\r\n }\r\n |\r\n <button *ngIf=\"!!innerInput.showAsLabel && innerInput.dataType=== 'number' ||!!innerInput.showAsLabel && innerInput.type === 'number'\"\r\n [matMenuTriggerFor]=\"calculationMenu\" \r\n [matMenuTriggerData]=\"{inputId:innerInput.originalId || innerInput.id}\"\r\n [matTooltip]=\"'calculate sum,avg,min,max'\"\r\n mat-icon-button>\r\n\r\n <mat-icon>\r\n calculate\r\n </mat-icon>\r\n </button>\r\n <button [color]=\"innerInput.showAsLabel? 'primary' : ''\"\r\n (click)=\"toggleLabel(innerInput)\"\r\n [matTooltip]=\"innerInput.showAsLabel? 'Hide as label' : 'Show as label'\"\r\n mat-icon-button>\r\n\r\n <mat-icon>\r\n label\r\n </mat-icon>\r\n </button>\r\n <span class=\"spacer\"></span>\r\n </mat-card-actions>\r\n </mat-card>\r\n }@else {\r\n \r\n <div [class]=\"'col-md-'+(dragging?'12':innerInput.colSize)\" class=\"box\">\r\n <ng-container *ngComponentOutlet=\"InputComponent; \r\n inputs: {\r\n inputConfig: innerInput,\r\n formGroup: formGroup,\r\n formBuilderFunctions: formBuilderFunctions,\r\n }\">\r\n </ng-container>\r\n </div>\r\n \r\n }\r\n\r\n </ng-container>\r\n }\r\n @if (!!editorMode && ( innerInputs|| []).length === 0) {\r\n\r\n <div class=\"tree-instructions\">\r\n <mat-icon style=\"margin-top: 4px;margin-bottom:auto\" class=\"info-icon\" color=\"primary\">info</mat-icon>\r\n <span>\r\n <strong>Add Form Input</strong>\r\n <br>\r\n Manage your list by adding, editing, or removing items. Each item is customizable through a form.\r\n </span>\r\n </div>\r\n\r\n }\r\n\r\n </div>\r\n </mat-card-content>\r\n @if ( ( innerInputs|| []).length !== 0) {\r\n <br>\r\n <mat-divider></mat-divider>\r\n <mat-card-actions align=\"end\" class=\"ion-margin-top\">\r\n <button [color]=\"areYouSure ? 'warn' : ''\" class=\"ion-margin-end\"\r\n [style.text-decoration]=\"areYouSure ? 'underline' : ''\" mat-flat-button\r\n (click)=\"closeMultipleInput()\">\r\n {{ areYouSure ? \"leave without saving\" : \"cancel\" }}\r\n </button>\r\n @if(!inputConfig?.readonly){\r\n <button [disabled]=\"!!formInvalid\" style=\"min-width: 10em\" color=\"primary\" (click)=\"saveMultipleInputForm()\" class=\"ion-padding-horizontal\"\r\n mat-raised-button>\r\n {{\r\n rowInUpdate\r\n ? \"Update\"\r\n : \"save\"\r\n }}\r\n </button>\r\n }\r\n\r\n </mat-card-actions>\r\n }\r\n\r\n</mat-card>\r\n<mat-menu #calculationMenu=\"matMenu\">\r\n <ng-template matMenuContent let-inputId=\"sectionId\">\r\n <button (click)=\"toggleFunction(func,inputId)\" mat-menu-item *ngFor=\"let func of calculationFunctions\">\r\n {{ func }}\r\n <mat-icon color=\"primary\" *ngIf=\"selectedFunction(func)\">check_circle</mat-icon>\r\n </button>\r\n </ng-template>\r\n</mat-menu> ", styles: [".inputCardElevated{background:var(--mat-toolbar-container-background-color, var(--mat-app-surface));box-shadow:var(--mdc-elevated-card-container-elevation)}.inputCard{box-shadow:none}.list{min-height:60px;display:block}.box{padding:4px;cursor:move}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.box:last-child{border:none}.list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.custom-placeholder{background:#ccc;border:dotted 3px #999;min-width:100%;min-height:60px;transition:transform .25s cubic-bezier(0,0,.2,1)}.cancelProgress{height:24px!important;width:24px!important}.tree-instructions{display:flex;align-items:center;gap:8px;padding:12px;background:azure;border-radius:4px;margin-bottom:16px}.info-icon{min-width:38px!important;display:block}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "directive", type: i2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i2.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }, { kind: "component", type: i3.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i3$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i3$1.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i3$1.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i5$2.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i6$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6$1.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i6$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i8.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: i8$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: DragDropModule }] }); }
|
|
8432
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: MultipleInputTableEditComponent, isStandalone: true, selector: "lib-multiple-input-table-edit", inputs: { inputConfig: "inputConfig", editorMode: "editorMode", formGroup: "formGroup", formBuilderFunctions: "formBuilderFunctions" }, outputs: { onSaveMultipleInputForm: "onSaveMultipleInputForm", editMultipleInput: "editMultipleInput", deleteInput: "deleteInput", showItemAsLabel: "showItemAsLabel", addFunction: "addFunction", reorderItems: "reorderItems" }, ngImport: i0, template: "\r\n<mat-card appearance=\"outlined\" style=\" margin-top: 8px;background:var(--mat-toolbar-container-background-color)\" class=\" mat-elevation-z4\">\r\n <mat-card-content>\r\n <div class=\"list\" (cdkDropListDropped)=\"dropItems($event)\"\r\n \r\n [cdkDropListData]=\"innerInputs\" cdkDropList\r\n \r\n #InputList=\"cdkDropList\" class=\"row\">\r\n @for( innerInput of innerInputs|| [];track innerInput.id\r\n ){\r\n <ng-container>\r\n @if(editorMode){\r\n <mat-card (mouseover)=\"activeInput = innerInput.id\" *ngIf=\"!!formGroup\" cdkDrag\r\n (cdkDragStarted)=\"dragging =true\" (cdkDragReleased)=\"dragging =false\"\r\n [class.inputCardElevated]=\"activeInput ===innerInput.id\"\r\n [class.inputCard]=\"activeInput !==innerInput.id\"\r\n [class]=\"'col-md-'+(dragging?'12':innerInput.colSize)\" class=\"box\">\r\n <div class=\"custom-placeholder\" *cdkDragPlaceholder></div>\r\n <ng-container *ngComponentOutlet=\"InputComponent; \r\n inputs: {\r\n inputConfig: innerInput,\r\n formGroup: formGroup,\r\n formBuilderFunctions: formBuilderFunctions,\r\n }\">\r\n </ng-container>\r\n <mat-card-actions *ngIf=\"activeInput === innerInput.id\">\r\n <span class=\"spacer\"></span>\r\n <button [matTooltip]=\"'Edit Input: ' + innerInput.label \"\r\n (click)=\"editInput(innerInput)\" mat-icon-button>\r\n <mat-icon>\r\n edit\r\n </mat-icon>\r\n\r\n </button>\r\n @if(!!inputWillBeRemovedIn(innerInput.id) ){\r\n <button (mouseover)=\"overId = innerInput.id\" (mouseout)=\"overId = null\"\r\n (click)=\"removeInput(innerInput)\" color=\"warn\" mat-stroked-button>\r\n <div style=\"display: flex; align-items: center;\">\r\n <mat-progress-spinner style=\"margin-right: 5px;\" color=\"primary\" class=\"cancelProgress\"\r\n [value]=\"((inputWillBeRemovedIn(innerInput.id)||0)/5)*100\">\r\n </mat-progress-spinner>\r\n\r\n {{overId === innerInput.id ? 'Click to cancel':'Deleting in'}}\r\n {{inputWillBeRemovedIn(innerInput.id)}}\r\n </div>\r\n\r\n </button>\r\n\r\n }@else {\r\n <button [matTooltip]=\"'Delete input ' + innerInput.label \"\r\n (click)=\"removeInput(innerInput)\" mat-icon-button>\r\n\r\n <mat-icon>\r\n delete\r\n </mat-icon>\r\n </button>\r\n }\r\n |\r\n <button *ngIf=\"!!innerInput.showAsLabel && innerInput.dataType=== 'number' ||!!innerInput.showAsLabel && innerInput.type === 'number'\"\r\n [matMenuTriggerFor]=\"calculationMenu\" \r\n [matMenuTriggerData]=\"{inputId:innerInput.originalId || innerInput.id}\"\r\n [matTooltip]=\"'calculate sum,avg,min,max'\"\r\n mat-icon-button>\r\n\r\n <mat-icon>\r\n calculate\r\n </mat-icon>\r\n </button>\r\n <button [color]=\"innerInput.showAsLabel? 'primary' : ''\"\r\n (click)=\"toggleLabel(innerInput)\"\r\n [matTooltip]=\"innerInput.showAsLabel? 'Hide as label' : 'Show as label'\"\r\n mat-icon-button>\r\n\r\n <mat-icon>\r\n label\r\n </mat-icon>\r\n </button>\r\n <span class=\"spacer\"></span>\r\n </mat-card-actions>\r\n </mat-card>\r\n }@else {\r\n \r\n <div [class]=\"'col-md-'+(dragging?'12':innerInput.colSize)\" class=\"box\">\r\n <ng-container *ngComponentOutlet=\"InputComponent; \r\n inputs: {\r\n inputConfig: innerInput,\r\n formGroup: formGroup,\r\n formBuilderFunctions: formBuilderFunctions,\r\n }\">\r\n </ng-container>\r\n </div>\r\n \r\n }\r\n\r\n </ng-container>\r\n }\r\n @if (!!editorMode && ( innerInputs|| []).length === 0) {\r\n\r\n <div class=\"tree-instructions\">\r\n <mat-icon style=\"margin-top: 4px;margin-bottom:auto\" class=\"info-icon\" color=\"primary\">info</mat-icon>\r\n <span>\r\n <strong>Add Form Input</strong>\r\n <br>\r\n Manage your list by adding, editing, or removing items. Each item is customizable through a form.\r\n </span>\r\n </div>\r\n\r\n }\r\n\r\n </div>\r\n </mat-card-content>\r\n @if ( ( innerInputs|| []).length !== 0) {\r\n <br>\r\n <mat-divider></mat-divider>\r\n <mat-card-actions align=\"end\" class=\"ion-margin-top\">\r\n <button [color]=\"areYouSure ? 'warn' : ''\" class=\"ion-margin-end\"\r\n [style.text-decoration]=\"areYouSure ? 'underline' : ''\" mat-flat-button\r\n (click)=\"closeMultipleInput()\">\r\n {{ areYouSure ? \"leave without saving\" : \"cancel\" }}\r\n </button>\r\n @if(!inputConfig?.readonly){\r\n <button [disabled]=\"!!formInvalid\" style=\"min-width: 10em\" color=\"primary\" (click)=\"saveMultipleInputForm()\" class=\"ion-padding-horizontal\"\r\n mat-raised-button>\r\n {{\r\n rowInUpdate\r\n ? \"Update\"\r\n : \"save\"\r\n }}\r\n </button>\r\n }\r\n\r\n </mat-card-actions>\r\n }\r\n\r\n</mat-card>\r\n<mat-menu #calculationMenu=\"matMenu\">\r\n <ng-template matMenuContent let-inputId=\"sectionId\">\r\n <button (click)=\"toggleFunction(func,inputId)\" mat-menu-item *ngFor=\"let func of calculationFunctions\">\r\n {{ func }}\r\n <mat-icon color=\"primary\" *ngIf=\"selectedFunction(func)\">check_circle</mat-icon>\r\n </button>\r\n </ng-template>\r\n</mat-menu> ", styles: [".inputCardElevated{background:var(--mat-toolbar-container-background-color, var(--mat-app-surface));box-shadow:var(--mdc-elevated-card-container-elevation)}.inputCard{box-shadow:none}.list{min-height:60px;display:block}.box{padding:4px;cursor:move}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.box:last-child{border:none}.list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.custom-placeholder{background:#ccc;border:dotted 3px #999;min-width:100%;min-height:60px;transition:transform .25s cubic-bezier(0,0,.2,1)}.cancelProgress{height:24px!important;width:24px!important}.tree-instructions{display:flex;align-items:center;gap:8px;padding:12px;background:azure;border-radius:4px;margin-bottom:16px}.info-icon{min-width:38px!important;display:block}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "directive", type: i2$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i2$1.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i3.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i3.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i4$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i6$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6$1.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i6$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i7.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: DragDropModule }] }); }
|
|
8424
8433
|
}
|
|
8425
8434
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MultipleInputTableEditComponent, decorators: [{
|
|
8426
8435
|
type: Component,
|
|
@@ -8628,7 +8637,7 @@ class MultipleInputTableComponent extends BaseCustomInput {
|
|
|
8628
8637
|
return this.ngControl?.control?.parent;
|
|
8629
8638
|
}
|
|
8630
8639
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MultipleInputTableComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8631
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: MultipleInputTableComponent, isStandalone: true, selector: "app-multiple-input-table", inputs: { editorMode: "editorMode", inputConfig: "inputConfig", formBuilderFunctions: "formBuilderFunctions" }, providers: [{ provide: MatFormFieldControl, useExisting: MultipleInputTableComponent }], usesInheritance: true, ngImport: i0, template: "\r\n<lib-multiple-input-table-view\r\n[inputConfig]=\"inputConfig\"\r\n[dataSource]=\"dataSource\"\r\n[applyOptionsTo]=\"applyOptionsTo\"\r\n[formGroup]=\"parentFormGroup\"\r\n(onEditItem)=\"editItem($event)\"\r\n(onDeleteItem)=\"multipleInputRemoveItem(applyOptionsTo)\"\r\n(onCopy)=\"copy($event)\"\r\n(onApplyOptionsTo)=\"applyOptionsTo = $event\"\r\n></lib-multiple-input-table-view>\r\n\r\n@if(!!inputConfig?.formIsOpen){\r\n<lib-multiple-input-table-edit \r\n[editorMode]=\"editorMode\"\r\n(editMultipleInput)=\"editInput($event)\"\r\n(deleteInput)=\" deleteItemInput($event)\"\r\n(addFunction)=\"addFunction($event)\"\r\n(showItemAsLabel)=\"showItemAsLabel($event)\"\r\n(onSaveMultipleInputForm)=\"saveMultipleInputForm()\"\r\n(reorderItems)=\"reorderItems($event)\"\r\n[formBuilderFunctions]=\"formBuilderFunctions\"\r\n[formGroup]=\"parentFormGroup\"\r\n[inputConfig]=\"inputConfig\"\r\n></lib-multiple-input-table-edit>\r\n\r\n}\r\n\r\n@if (\r\n !inputConfig?.readonly &&\r\n !inputConfig?.formIsOpen\r\n) {\r\n <section >\r\n <button \r\n color=\"primary\" \r\n style=\" display: block;\r\n margin-top: 8px;\r\n width: 100%;\" (click)=\"generateMultipleInputForm()\" mat-stroked-button>\r\n \r\n {{handleLabel}}\r\n <mat-icon matPrefix>{{\r\n handleIcon()\r\n }}</mat-icon>\r\n \r\n \r\n </button>\r\n </section>\r\n \r\n}\r\n\r\n", styles: [".table-container{position:relative;max-height:400px;overflow:auto}table{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type:
|
|
8640
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: MultipleInputTableComponent, isStandalone: true, selector: "app-multiple-input-table", inputs: { editorMode: "editorMode", inputConfig: "inputConfig", formBuilderFunctions: "formBuilderFunctions" }, providers: [{ provide: MatFormFieldControl, useExisting: MultipleInputTableComponent }], usesInheritance: true, ngImport: i0, template: "\r\n<lib-multiple-input-table-view\r\n[inputConfig]=\"inputConfig\"\r\n[dataSource]=\"dataSource\"\r\n[applyOptionsTo]=\"applyOptionsTo\"\r\n[formGroup]=\"parentFormGroup\"\r\n(onEditItem)=\"editItem($event)\"\r\n(onDeleteItem)=\"multipleInputRemoveItem(applyOptionsTo)\"\r\n(onCopy)=\"copy($event)\"\r\n(onApplyOptionsTo)=\"applyOptionsTo = $event\"\r\n></lib-multiple-input-table-view>\r\n\r\n@if(!!inputConfig?.formIsOpen){\r\n<lib-multiple-input-table-edit \r\n[editorMode]=\"editorMode\"\r\n(editMultipleInput)=\"editInput($event)\"\r\n(deleteInput)=\" deleteItemInput($event)\"\r\n(addFunction)=\"addFunction($event)\"\r\n(showItemAsLabel)=\"showItemAsLabel($event)\"\r\n(onSaveMultipleInputForm)=\"saveMultipleInputForm()\"\r\n(reorderItems)=\"reorderItems($event)\"\r\n[formBuilderFunctions]=\"formBuilderFunctions\"\r\n[formGroup]=\"parentFormGroup\"\r\n[inputConfig]=\"inputConfig\"\r\n></lib-multiple-input-table-edit>\r\n\r\n}\r\n\r\n@if (\r\n !inputConfig?.readonly &&\r\n !inputConfig?.formIsOpen\r\n) {\r\n <section >\r\n <button \r\n color=\"primary\" \r\n style=\" display: block;\r\n margin-top: 8px;\r\n width: 100%;\" (click)=\"generateMultipleInputForm()\" mat-stroked-button>\r\n \r\n {{handleLabel}}\r\n <mat-icon matPrefix>{{\r\n handleIcon()\r\n }}</mat-icon>\r\n \r\n \r\n </button>\r\n </section>\r\n \r\n}\r\n\r\n", styles: [".table-container{position:relative;max-height:400px;overflow:auto}table{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "component", type: MultipleInputTableEditComponent, selector: "lib-multiple-input-table-edit", inputs: ["inputConfig", "editorMode", "formGroup", "formBuilderFunctions"], outputs: ["onSaveMultipleInputForm", "editMultipleInput", "deleteInput", "showItemAsLabel", "addFunction", "reorderItems"] }, { kind: "component", type: MultipleInputTableViewComponent, selector: "lib-multiple-input-table-view", inputs: ["inputConfig", "dataSource", "applyOptionsTo", "formGroup"], outputs: ["onEditItem", "onDeleteItem", "onCopy", "onApplyOptionsTo"] }] }); }
|
|
8632
8641
|
}
|
|
8633
8642
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MultipleInputTableComponent, decorators: [{
|
|
8634
8643
|
type: Component,
|
|
@@ -8665,7 +8674,7 @@ class MultipleInputInputElementComponent {
|
|
|
8665
8674
|
return getInputErrorMessage(this.inputConfig, this.formGroup);
|
|
8666
8675
|
}
|
|
8667
8676
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MultipleInputInputElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8668
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: MultipleInputInputElementComponent, isStandalone: true, selector: "lib-multiple-input-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup", editorMode: "editorMode", formBuilderFunctions: "formBuilderFunctions" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<form [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\"\r\n floatLabel=\"always\" *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n {{this.inputConfig.label }}\r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n\r\n <app-multiple-input-table \r\n [editorMode]=\"editorMode\"\r\n [formGroup]=\"formGroup\"\r\n [formBuilderFunctions]=\"formBuilderFunctions\"\r\n *ngIf=\"inputConfig.id\" [formControlName]=\"inputConfig.id\"\r\n [inputConfig]=\"inputConfig\"></app-multiple-input-table>\r\n\r\n\r\n <!-- @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n } -->\r\n\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n\r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n\r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n\r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n\r\n </mat-form-field>\r\n</form>", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
8677
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: MultipleInputInputElementComponent, isStandalone: true, selector: "lib-multiple-input-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup", editorMode: "editorMode", formBuilderFunctions: "formBuilderFunctions" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<form [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\"\r\n floatLabel=\"always\" *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n {{this.inputConfig.label }}\r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n\r\n <app-multiple-input-table \r\n [editorMode]=\"editorMode\"\r\n [formGroup]=\"formGroup\"\r\n [formBuilderFunctions]=\"formBuilderFunctions\"\r\n *ngIf=\"inputConfig.id\" [formControlName]=\"inputConfig.id\"\r\n [inputConfig]=\"inputConfig\"></app-multiple-input-table>\r\n\r\n\r\n <!-- @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n } -->\r\n\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n\r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n\r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n\r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n\r\n </mat-form-field>\r\n</form>", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: MultipleInputTableComponent, selector: "app-multiple-input-table", inputs: ["editorMode", "inputConfig", "formBuilderFunctions"] }] }); }
|
|
8669
8678
|
}
|
|
8670
8679
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MultipleInputInputElementComponent, decorators: [{
|
|
8671
8680
|
type: Component,
|
|
@@ -8748,7 +8757,7 @@ class GeoLocationFormInputComponent extends BaseCustomInput {
|
|
|
8748
8757
|
provide: MatFormFieldControl,
|
|
8749
8758
|
useExisting: GeoLocationFormInputComponent
|
|
8750
8759
|
}
|
|
8751
|
-
], usesInheritance: true, ngImport: i0, template: "@if(!!empty){\r\n\r\n<p class=\"empty-state\">\r\n Click icon to get your location\r\n\r\n</p>\r\n\r\n\r\n}\r\n<div class=\"coordinates-section\">\r\n @if(!empty){\r\n <div class=\"coordinate-item\">\r\n <mat-icon color=\"primary\">map</mat-icon>\r\n <span class=\"value\">\r\n <div class=\"inner-value\">\r\n {{value?.coords?.latitude || 'N/A'}} <span class=\"unit\">\u00B0N</span>\r\n </div>\r\n <div class=\"inner-value label\">\r\n latitude\r\n </div>\r\n </span>\r\n\r\n\r\n </div>\r\n <div class=\"coordinate-item\">\r\n <mat-icon color=\"primary\">map</mat-icon>\r\n\r\n <span class=\"value\">\r\n <div class=\"inner-value\">\r\n {{value?.coords?.longitude || 'N/A'}}\r\n <span class=\"unit\">\u00B0E</span>\r\n </div>\r\n <div class=\"inner-value label\">\r\n longitude\r\n </div>\r\n </span>\r\n\r\n </div>\r\n\r\n\r\n <div class=\"coordinate-item\">\r\n <mat-icon color=\"primary\">zoom_in_map</mat-icon>\r\n <span class=\"value\">\r\n <div class=\"inner-value\">\r\n {{value?.coords?.accuracy | number:'1.0-0'}}\r\n <span class=\"unit\">m</span>\r\n </div>\r\n <div class=\"inner-value label\">\r\n accuracy\r\n </div>\r\n </span>\r\n\r\n\r\n </div>\r\n }\r\n <button mat-flat-button (click)=\"getLocation()\">\r\n {{empty ? 'Get Location' : 'Update Location'}}\r\n <mat-icon>my_location</mat-icon>\r\n </button>\r\n</div>", styles: [".coordinates-section{display:flex;padding:0;flex-direction:row;flex-wrap:wrap;gap:8px;justify-content:flex-start;align-items:center}.coordinate-item{flex:0 1 auto;width:fit-content;min-width:100px;display:flex;flex-direction:row;align-items:center;gap:8px;padding:4px;background:#f0f8ff;border-radius:8px;white-space:nowrap;font-size:small;border:solid 1px #daedfd}.empty-state{padding-left:16px;padding-right:16px;font-size:small;font-weight:500;line-height:normal;white-space:normal}mat-toolbar{max-width:100%;padding:0}.inner-value{line-height:normal;font-weight:500}.label{opacity:.6}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$
|
|
8760
|
+
], usesInheritance: true, ngImport: i0, template: "@if(!!empty){\r\n\r\n<p class=\"empty-state\">\r\n Click icon to get your location\r\n\r\n</p>\r\n\r\n\r\n}\r\n<div class=\"coordinates-section\">\r\n @if(!empty){\r\n <div class=\"coordinate-item\">\r\n <mat-icon color=\"primary\">map</mat-icon>\r\n <span class=\"value\">\r\n <div class=\"inner-value\">\r\n {{value?.coords?.latitude || 'N/A'}} <span class=\"unit\">\u00B0N</span>\r\n </div>\r\n <div class=\"inner-value label\">\r\n latitude\r\n </div>\r\n </span>\r\n\r\n\r\n </div>\r\n <div class=\"coordinate-item\">\r\n <mat-icon color=\"primary\">map</mat-icon>\r\n\r\n <span class=\"value\">\r\n <div class=\"inner-value\">\r\n {{value?.coords?.longitude || 'N/A'}}\r\n <span class=\"unit\">\u00B0E</span>\r\n </div>\r\n <div class=\"inner-value label\">\r\n longitude\r\n </div>\r\n </span>\r\n\r\n </div>\r\n\r\n\r\n <div class=\"coordinate-item\">\r\n <mat-icon color=\"primary\">zoom_in_map</mat-icon>\r\n <span class=\"value\">\r\n <div class=\"inner-value\">\r\n {{value?.coords?.accuracy | number:'1.0-0'}}\r\n <span class=\"unit\">m</span>\r\n </div>\r\n <div class=\"inner-value label\">\r\n accuracy\r\n </div>\r\n </span>\r\n\r\n\r\n </div>\r\n }\r\n <button mat-flat-button (click)=\"getLocation()\">\r\n {{empty ? 'Get Location' : 'Update Location'}}\r\n <mat-icon>my_location</mat-icon>\r\n </button>\r\n</div>", styles: [".coordinates-section{display:flex;padding:0;flex-direction:row;flex-wrap:wrap;gap:8px;justify-content:flex-start;align-items:center}.coordinate-item{flex:0 1 auto;width:fit-content;min-width:100px;display:flex;flex-direction:row;align-items:center;gap:8px;padding:4px;background:#f0f8ff;border-radius:8px;white-space:nowrap;font-size:small;border:solid 1px #daedfd}.empty-state{padding-left:16px;padding-right:16px;font-size:small;font-weight:500;line-height:normal;white-space:normal}mat-toolbar{max-width:100%;padding:0}.inner-value{line-height:normal;font-weight:500}.label{opacity:.6}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2$2.DecimalPipe, name: "number" }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
|
|
8752
8761
|
}
|
|
8753
8762
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: GeoLocationFormInputComponent, decorators: [{
|
|
8754
8763
|
type: Component,
|
|
@@ -8780,7 +8789,7 @@ class GeoLocationComponent {
|
|
|
8780
8789
|
return getInputErrorMessage(this.inputConfig, this.formGroup);
|
|
8781
8790
|
}
|
|
8782
8791
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: GeoLocationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8783
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: GeoLocationComponent, isStandalone: true, selector: "lib-geo-location", inputs: { inputConfig: "inputConfig", formGroup: "formGroup", editorMode: "editorMode", formBuilderFunctions: "formBuilderFunctions" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "\r\n\r\n<form [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as classInput\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status \r\n [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <lib-geo-location-form-input\r\n [inputConfig]=\"this.inputConfig\"\r\n [formControlName]=\"this.inputConfig.id\"\r\n ></lib-geo-location-form-input>\r\n \r\nL\r\n <!-- @if(inputConfig.hintLabel || classInput.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ classInput.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n }\r\n -->\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n \r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"classInput.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ classInput.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n \r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n \r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n \r\n\r\n </mat-form-field>\r\n</form>", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
8792
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: GeoLocationComponent, isStandalone: true, selector: "lib-geo-location", inputs: { inputConfig: "inputConfig", formGroup: "formGroup", editorMode: "editorMode", formBuilderFunctions: "formBuilderFunctions" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "\r\n\r\n<form [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as classInput\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status \r\n [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n <lib-geo-location-form-input\r\n [inputConfig]=\"this.inputConfig\"\r\n [formControlName]=\"this.inputConfig.id\"\r\n ></lib-geo-location-form-input>\r\n \r\nL\r\n <!-- @if(inputConfig.hintLabel || classInput.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ classInput.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n }\r\n -->\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n \r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"classInput.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ classInput.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n \r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n \r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n \r\n\r\n </mat-form-field>\r\n</form>", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }, { kind: "component", type: GeoLocationFormInputComponent, selector: "lib-geo-location-form-input", inputs: ["formBuilderFunctions", "inputConfig"] }] }); }
|
|
8784
8793
|
}
|
|
8785
8794
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: GeoLocationComponent, decorators: [{
|
|
8786
8795
|
type: Component,
|
|
@@ -8901,7 +8910,7 @@ class CameraCaptureComponent extends BaseCustomInput {
|
|
|
8901
8910
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.2", type: CameraCaptureComponent, isStandalone: true, selector: "app-camera-capture", inputs: { inputConfig: "inputConfig" }, providers: [{
|
|
8902
8911
|
provide: MatFormFieldControl,
|
|
8903
8912
|
useExisting: CameraCaptureComponent
|
|
8904
|
-
}], viewQueries: [{ propertyName: "video", first: true, predicate: ["video"], descendants: true }, { propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<br>\r\n<div class=\"video-container\">\r\n <video\r\n style=\"margin: auto;\"\r\n [style.display]=\"!isCaptured ? 'block' : 'none'\"\r\n #video\r\n id=\"video\"\r\n [width]=\"WIDTH\"\r\n [height]=\"HEIGHT\"\r\n autoplay\r\n ></video>\r\n <canvas\r\n [style.display]=\"isCaptured ? 'block' : 'none'\"\r\n #canvas\r\n id=\"canvas\"\r\n [width]=\"WIDTH\"\r\n [height]=\"HEIGHT\"\r\n ></canvas>\r\n</div>\r\n<mat-toolbar style=\"background: none;\">\r\n <span class=\"spacer\"></span>\r\n <button (click)=\"isCaptured ? recapture() : capture()\" [color]=\"isCaptured?'primary':'warn'\" mat-icon-button>\r\n <mat-icon>\r\n photo_camera\r\n </mat-icon>\r\n\r\n </button>\r\n <button (click)=\"stopVideo()\" *ngIf=\"!isCaptured\" mat-icon-button>\r\n <mat-icon>\r\n stop\r\n </mat-icon>\r\n\r\n </button>\r\n <span class=\"spacer\"></span>\r\n</mat-toolbar>\r\n\r\n\r\n\r\n\r\n\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
8913
|
+
}], viewQueries: [{ propertyName: "video", first: true, predicate: ["video"], descendants: true }, { propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<br>\r\n<div class=\"video-container\">\r\n <video\r\n style=\"margin: auto;\"\r\n [style.display]=\"!isCaptured ? 'block' : 'none'\"\r\n #video\r\n id=\"video\"\r\n [width]=\"WIDTH\"\r\n [height]=\"HEIGHT\"\r\n autoplay\r\n ></video>\r\n <canvas\r\n [style.display]=\"isCaptured ? 'block' : 'none'\"\r\n #canvas\r\n id=\"canvas\"\r\n [width]=\"WIDTH\"\r\n [height]=\"HEIGHT\"\r\n ></canvas>\r\n</div>\r\n<mat-toolbar style=\"background: none;\">\r\n <span class=\"spacer\"></span>\r\n <button (click)=\"isCaptured ? recapture() : capture()\" [color]=\"isCaptured?'primary':'warn'\" mat-icon-button>\r\n <mat-icon>\r\n photo_camera\r\n </mat-icon>\r\n\r\n </button>\r\n <button (click)=\"stopVideo()\" *ngIf=\"!isCaptured\" mat-icon-button>\r\n <mat-icon>\r\n stop\r\n </mat-icon>\r\n\r\n </button>\r\n <span class=\"spacer\"></span>\r\n</mat-toolbar>\r\n\r\n\r\n\r\n\r\n\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i9.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }] }); }
|
|
8905
8914
|
}
|
|
8906
8915
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: CameraCaptureComponent, decorators: [{
|
|
8907
8916
|
type: Component,
|
|
@@ -8934,7 +8943,7 @@ class ImageCaptureInputElementComponent {
|
|
|
8934
8943
|
return getInputErrorMessage(this.inputConfig, this.formGroup);
|
|
8935
8944
|
}
|
|
8936
8945
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: ImageCaptureInputElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8937
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: ImageCaptureInputElementComponent, isStandalone: true, selector: "lib-image-capture-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "\r\n\r\n<ng-container [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n {{inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n \r\n <app-camera-capture\r\n \r\n [inputConfig]=\"inputConfig\"\r\n [formControlName]=\"inputConfig.id\"\r\n ></app-camera-capture> \r\n\r\n\r\n <!-- @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n } -->\r\n\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n\r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n\r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n\r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n\r\n\r\n </mat-form-field>\r\n</ng-container>\r\n", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
8946
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: ImageCaptureInputElementComponent, isStandalone: true, selector: "lib-image-capture-input-element", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "\r\n\r\n<ng-container [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n {{inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n \r\n <app-camera-capture\r\n \r\n [inputConfig]=\"inputConfig\"\r\n [formControlName]=\"inputConfig.id\"\r\n ></app-camera-capture> \r\n\r\n\r\n <!-- @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n } -->\r\n\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n\r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n\r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n\r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n\r\n\r\n </mat-form-field>\r\n</ng-container>\r\n", styles: ["mat-form-field{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }, { kind: "component", type: CameraCaptureComponent, selector: "app-camera-capture", inputs: ["inputConfig"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
|
|
8938
8947
|
}
|
|
8939
8948
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: ImageCaptureInputElementComponent, decorators: [{
|
|
8940
8949
|
type: Component,
|
|
@@ -9042,7 +9051,7 @@ class InputTableComponent extends BaseCustomInput {
|
|
|
9042
9051
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.2", type: InputTableComponent, isStandalone: true, selector: "app-input-table", inputs: { inputConfig: "inputConfig" }, providers: [{
|
|
9043
9052
|
provide: MatFormFieldControl,
|
|
9044
9053
|
useExisting: InputTableComponent
|
|
9045
|
-
}], viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"example-container\">\r\n <div style=\" min-height: 50px;\r\n max-height: 400px;\r\n overflow: auto;\" class=\"example-table-container\">\r\n <table\r\n matSort\r\n mat-table\r\n [dataSource]=\"this.dataSource\"\r\n class=\"example-table\"\r\n >\r\n <ng-container\r\n class=\"borderBottomL\"\r\n *ngFor=\"let col of getTableCol(); trackBy: identify\"\r\n [matColumnDef]=\"col\"\r\n >\r\n <th mat-header-cell mat-sort-header *matHeaderCellDef>\r\n <span style=\"text-align: start\">\r\n {{ this.inputConfig.tableConfig?.columnsConfig?.[col][\"label\"] }}\r\n </span>\r\n </th>\r\n \r\n <td\r\n mat-cell\r\n [style.background]=\"\r\n getColor(\r\n this.inputConfig.tableConfig?.columnsConfig?.[col],\r\n row[col],\r\n col\r\n )\r\n \"\r\n *matCellDef=\"let row\"\r\n >\r\n <div\r\n [ngSwitch]=\"\r\n this.inputConfig.tableConfig?.columnsConfig?.[col]['type']\r\n \"\r\n >\r\n <div class=\"cellClass\" *ngSwitchCase=\"'checkBox'\">\r\n <mat-checkbox\r\n [disabled]=\"\r\n row[col]\r\n ? false\r\n : checklistIsDisabled(\r\n this.inputConfig.tableConfig?.columnsConfig?.[col],\r\n col\r\n )\r\n \"\r\n ngDefaultControl\r\n [(ngModel)]=\"row[col]\"\r\n (ionChange)=\"checkedCell($event, row, col)\"\r\n [checked]=\"row[col]\"\r\n ></mat-checkbox>\r\n </div>\r\n <div class=\"cellClass\" *ngSwitchCase=\"'priceCheckImages'\">\r\n \r\n <img\r\n [src]=\"\r\n getDeepProperty(\r\n this.inputConfig.tableConfig?.columnsConfig?.[col][\r\n 'deepBind'\r\n ],\r\n row\r\n )\r\n \"\r\n />\r\n \r\n </div>\r\n <div *ngSwitchDefault class=\"cellClass\">\r\n <div [innerHTML]=\"row[col]\"> </div>\r\n </div>\r\n </div>\r\n </td>\r\n </ng-container>\r\n \r\n <tr\r\n mat-header-row\r\n *matHeaderRowDef=\"\r\n this.inputConfig.tableConfig?.displayedColumnsInOrder\r\n \"\r\n ></tr>\r\n <tr\r\n mat-row\r\n *matRowDef=\"\r\n let row;\r\n columns: this.inputConfig.tableConfig?.displayedColumnsInOrder\r\n \"\r\n ></tr>\r\n </table>\r\n <div\r\n style=\"min-height: 140px; background: rgb(234 234 234 / 12%)\"\r\n *ngIf=\"!this.dataSource\"\r\n class=\"center\"\r\n >\r\n <label style=\"opacity: 0.6; font-size: 10.5px\">\r\n Nothing yet\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n ", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
9054
|
+
}], viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"example-container\">\r\n <div style=\" min-height: 50px;\r\n max-height: 400px;\r\n overflow: auto;\" class=\"example-table-container\">\r\n <table\r\n matSort\r\n mat-table\r\n [dataSource]=\"this.dataSource\"\r\n class=\"example-table\"\r\n >\r\n <ng-container\r\n class=\"borderBottomL\"\r\n *ngFor=\"let col of getTableCol(); trackBy: identify\"\r\n [matColumnDef]=\"col\"\r\n >\r\n <th mat-header-cell mat-sort-header *matHeaderCellDef>\r\n <span style=\"text-align: start\">\r\n {{ this.inputConfig.tableConfig?.columnsConfig?.[col][\"label\"] }}\r\n </span>\r\n </th>\r\n \r\n <td\r\n mat-cell\r\n [style.background]=\"\r\n getColor(\r\n this.inputConfig.tableConfig?.columnsConfig?.[col],\r\n row[col],\r\n col\r\n )\r\n \"\r\n *matCellDef=\"let row\"\r\n >\r\n <div\r\n [ngSwitch]=\"\r\n this.inputConfig.tableConfig?.columnsConfig?.[col]['type']\r\n \"\r\n >\r\n <div class=\"cellClass\" *ngSwitchCase=\"'checkBox'\">\r\n <mat-checkbox\r\n [disabled]=\"\r\n row[col]\r\n ? false\r\n : checklistIsDisabled(\r\n this.inputConfig.tableConfig?.columnsConfig?.[col],\r\n col\r\n )\r\n \"\r\n ngDefaultControl\r\n [(ngModel)]=\"row[col]\"\r\n (ionChange)=\"checkedCell($event, row, col)\"\r\n [checked]=\"row[col]\"\r\n ></mat-checkbox>\r\n </div>\r\n <div class=\"cellClass\" *ngSwitchCase=\"'priceCheckImages'\">\r\n \r\n <img\r\n [src]=\"\r\n getDeepProperty(\r\n this.inputConfig.tableConfig?.columnsConfig?.[col][\r\n 'deepBind'\r\n ],\r\n row\r\n )\r\n \"\r\n />\r\n \r\n </div>\r\n <div *ngSwitchDefault class=\"cellClass\">\r\n <div [innerHTML]=\"row[col]\"> </div>\r\n </div>\r\n </div>\r\n </td>\r\n </ng-container>\r\n \r\n <tr\r\n mat-header-row\r\n *matHeaderRowDef=\"\r\n this.inputConfig.tableConfig?.displayedColumnsInOrder\r\n \"\r\n ></tr>\r\n <tr\r\n mat-row\r\n *matRowDef=\"\r\n let row;\r\n columns: this.inputConfig.tableConfig?.displayedColumnsInOrder\r\n \"\r\n ></tr>\r\n </table>\r\n <div\r\n style=\"min-height: 140px; background: rgb(234 234 234 / 12%)\"\r\n *ngIf=\"!this.dataSource\"\r\n class=\"center\"\r\n >\r\n <label style=\"opacity: 0.6; font-size: 10.5px\">\r\n Nothing yet\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n ", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2$2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i3$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i4$2.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i4$2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i5$2.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5$2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5$2.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5$2.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i5$2.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5$2.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5$2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5$2.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5$2.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5$2.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
9046
9055
|
}
|
|
9047
9056
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: InputTableComponent, decorators: [{
|
|
9048
9057
|
type: Component,
|
|
@@ -9075,7 +9084,7 @@ class SelectTableInputComponent {
|
|
|
9075
9084
|
return getInputErrorMessage(this.inputConfig, this.formGroup);
|
|
9076
9085
|
}
|
|
9077
9086
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: SelectTableInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9078
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: SelectTableInputComponent, isStandalone: true, selector: "lib-select-table-input", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<p>select-table-input works!</p>\r\n\r\n\r\n<form [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n \r\n <app-input-table\r\n \r\n [inputConfig]=\"inputConfig\"\r\n [formControlName]=\"inputConfig.id\"\r\n ></app-input-table> \r\n \r\n \r\n <!-- @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n }\r\n -->\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n \r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n \r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n \r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n \r\n \r\n </mat-form-field>\r\n </form>\r\n ", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
9087
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: SelectTableInputComponent, isStandalone: true, selector: "lib-select-table-input", inputs: { inputConfig: "inputConfig", formGroup: "formGroup" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<p>select-table-input works!</p>\r\n\r\n\r\n<form [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"this.inputConfig.appearance ||'fill' \" subscriptSizing=\"dynamic\" *ngIf=\"this.inputConfig as inputConfig\">\r\n <mat-label>\r\n {{this.inputConfig.label }} \r\n <lib-t-form-input-status [inputConfig]=\"this.inputConfig\"></lib-t-form-input-status>\r\n </mat-label>\r\n \r\n <app-input-table\r\n \r\n [inputConfig]=\"inputConfig\"\r\n [formControlName]=\"inputConfig.id\"\r\n ></app-input-table> \r\n \r\n \r\n <!-- @if(inputConfig.hintLabel || inputConfig.temporaryHint ){\r\n <mat-hint class=\"inputHint\">\r\n {{ inputConfig.temporaryHint || inputConfig.hintLabel}}\r\n </mat-hint>\r\n }\r\n -->\r\n @if (!!errorMessage) {\r\n <mat-error class=\"oneLineTextEllipsis\" matTooltipClass=\"errorToolTip\">{{errorMessage}}</mat-error>\r\n }\r\n <!-- Prefix Icon -->\r\n <mat-icon *ngIf=\"inputConfig.prefixIcon\" matPrefix>{{ inputConfig.prefixIcon }}</mat-icon>\r\n \r\n <!-- Suffix Icon or Password Visibility Toggle -->\r\n <ng-container *ngIf=\"inputConfig.suffixIcon\">\r\n <mat-icon *ngIf=\"inputConfig.id !== 'password'\" matSuffix>{{ inputConfig.suffixIcon\r\n }}</mat-icon>\r\n <!-- <button *ngIf=\"inputConfig.id === 'password'\" (click)=\"inputConfig.togglePasswordVisibility()\"\r\n mat-icon-button matSuffix>\r\n <mat-icon>{{ inputConfig.showPassword ? 'remove_red_eye' : 'eye_off' }}</mat-icon>\r\n </button> -->\r\n </ng-container>\r\n \r\n <!-- Prefix & Suffix Text -->\r\n <span *ngIf=\"inputConfig.prefixText\" matPrefix style=\"top: 0\">{{ inputConfig.prefixText }}</span>\r\n <span *ngIf=\"inputConfig.suffixText\" matSuffix style=\"padding-left: 5px\">{{ inputConfig.suffixText\r\n }}</span>\r\n \r\n <!-- Character Count Hint -->\r\n <mat-hint *ngIf=\"inputConfig.maxLength && formGroup\" align=\"end\">\r\n {{ (formGroup.controls[inputConfig.id]?.value?.length || 0) + '/' + inputConfig.maxLength\r\n }}\r\n </mat-hint>\r\n \r\n \r\n </mat-form-field>\r\n </form>\r\n ", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: InputTableComponent, selector: "app-input-table", inputs: ["inputConfig"] }, { kind: "component", type: TFormInputStatusComponent, selector: "lib-t-form-input-status", inputs: ["inputConfig"] }] }); }
|
|
9079
9088
|
}
|
|
9080
9089
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: SelectTableInputComponent, decorators: [{
|
|
9081
9090
|
type: Component,
|
|
@@ -10338,7 +10347,7 @@ class UserFormStepperComponent extends FormTowerControllerService {
|
|
|
10338
10347
|
this.submitForm(this.passParamsOnSubmit);
|
|
10339
10348
|
}
|
|
10340
10349
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: UserFormStepperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
10341
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: UserFormStepperComponent, isStandalone: true, selector: "lib-user-form-stepper", inputs: { formId: "formId", initialValues: "initialValues", passParamsOnSubmit: "passParamsOnSubmit" }, viewQueries: [{ propertyName: "stepper", first: true, predicate: ["stepper"], descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (loading) {\r\n <div class=\"loading-container\">\r\n <mat-spinner diameter=\"48\" aria-label=\"Loading form\" />\r\n </div>\r\n} \r\n<mat-stepper [style.display]=\"loading?'none':'block'\" #stepper class=\"form-stepper\" orientation=\"vertical\"\r\n [linear]=\"!isEditable\" aria-label=\"Form sections stepper\" [animationDuration]=\"'300'\"\r\n (selectionChange)=\"handleStepChange($event)\">\r\n\r\n @for (step of selectFormSteps(); track step.sectionId) {\r\n @if (!!step.sectionForm ) {\r\n <mat-step \r\n [stepControl]=\"step.sectionForm\" [completed]=\"step.sectionIsSeen && !step.sectionIsInvalid\"\r\n [editable]=\"isEditable\" \r\n [errorMessage]=\"step.sectionFormErrorMessage||''\" \r\n [state]=\"getStepState(step,$index)\"\r\n [hasError]=\"!step.sectionForm.valid && !!step.sectionForm.touched\"\r\n >\r\n <ng-template matStepLabel>\r\n <div class=\"step-label-container\" [attr.aria-label]=\"'Section ' + step.label\">\r\n <span class=\"step-label-text\">{{step.label|titlecase}}</span>\r\n @if (step.sectionIsSeen) {\r\n <mat-icon [class.error]=\"step.sectionIsInvalid\"\r\n [attr.aria-label]=\"step.sectionIsInvalid ? 'Section has errors' : 'Section completed'\">\r\n {{step.sectionIsSeen}}\r\n </mat-icon>\r\n }\r\n\r\n <span class=\"tour-trigger \" *ngIf=\"(step)?.activeSectionHasTour&&!!step.isActive \">\r\n <button tourAnchor=\"Form-Tour-trigger\" matTooltip=\"Start section tour\" mat-flat-button>\r\n <mat-icon>tour</mat-icon>\r\n </button>\r\n </span>\r\n </div>\r\n </ng-template>\r\n @if(!!step.isActive){\r\n @defer (on viewport; prefetch on idle) {\r\n <div class=\"step-content\">\r\n <div class=\"row form-section\">\r\n @for (col of step.columns; track col.id) {\r\n <div [class]=\"'col-md-'+col.colSize + ' box'\">\r\n <lib-t-form-input [tourAnchor]=\"col.id\" \r\n (valueChange)=\"updateValue(col.id,$event)\"\r\n [editorMode]=\"false\" \r\n [formBuilderFunctions]=\"formBuilderFunctions\"\r\n [inputConfig]=\"col\" [formGroup]=\"step.sectionForm\" [attr.aria-label]=\"col?.label || ''\">\r\n </lib-t-form-input>\r\n </div>\r\n }\r\n </div>\r\n\r\n <div class=\"step-actions\">\r\n @if(!$first) {\r\n <button mat-button matStepperPrevious type=\"button\" class=\"navigation-button\"\r\n [attr.aria-label]=\"'Go back to ' + getPreviousStepLabel()\">\r\n\r\n Back\r\n </button>\r\n }\r\n @if (!$last) {\r\n <button mat-flat-button matStepperNext color=\"primary\" type=\"button\" class=\"navigation-button\"\r\n [attr.aria-label]=\"'Continue to ' + getNextStepLabel()\">\r\n Next\r\n </button>\r\n }\r\n @if (!!$last) {\r\n <button mat-button (click)=\"stepper.reset()\">Reset</button>\r\n }\r\n </div>\r\n </div>\r\n } @placeholder {\r\n <div style=\"padding: 50px;display:flex;justify-content:center;align-items:center; text-align: center;\">\r\n <mat-spinner diameter=\"24\" />\r\n </div>\r\n }\r\n\r\n }\r\n \r\n </mat-step>\r\n }\r\n }\r\n</mat-stepper>\r\n <!-- Defer the footer toolbar until after the main form is loaded -->\r\n @defer (on idle; prefetch on viewport) {\r\n<footer><mat-toolbar class=\"submission-toolbar\" role=\"toolbar\" aria-label=\"Form submission actions\">\r\n <span class=\"submission-status\" role=\"status\">\r\n {{getSubmissionStatus}}\r\n </span>\r\n <button mat-raised-button color=\"primary\" [disabled]=\"mainForm?.invalid\" \r\n (click)=\"handleSubmit()\"\r\n aria-label=\"Submit form\">\r\n <span>\r\n {{ formSubmissionMessage()}} \r\n </span>\r\n @if(submittingForm){\r\n <mat-spinner diameter=\"10\"></mat-spinner>\r\n }\r\n \r\n </button>\r\n</mat-toolbar>\r\n</footer>\r\n} @placeholder {\r\n <!-- Simple placeholder for the footer that maintains layout -->\r\n <footer>\r\n <div class=\"submission-toolbar-placeholder\"></div>\r\n </footer>\r\n}\r\n", styles: [".form-stepper{min-height:400px}.step-label-container{display:flex;justify-content:space-between;align-items:center;width:100%;gap:16px}.step-error-message{font-size:12px;opacity:.9;margin-left:16px}.form-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:8px;margin-bottom:24px}.step-actions{display:flex;gap:16px;margin-top:24px}.navigation-button{display:flex;align-items:center;gap:8px}.loading-container{display:flex;justify-content:center;padding:32px}footer{position:sticky;bottom:0}.submission-toolbar{z-index:1000;background:#ffffff0d;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-top:var(--mat-divider-width) solid var(--mat-divider-color);padding:8px 16px;display:flex;justify-content:flex-end;gap:16px}.submission-status{font-size:12px;opacity:.87;display:flex;align-items:center}.box{padding:8px 4px 4px}.tour-trigger{position:absolute;right:8px;font-size:12px;opacity:.6}.tour-trigger:hover{opacity:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$
|
|
10350
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: UserFormStepperComponent, isStandalone: true, selector: "lib-user-form-stepper", inputs: { formId: "formId", initialValues: "initialValues", passParamsOnSubmit: "passParamsOnSubmit" }, viewQueries: [{ propertyName: "stepper", first: true, predicate: ["stepper"], descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (loading) {\r\n <div class=\"loading-container\">\r\n <mat-spinner diameter=\"48\" aria-label=\"Loading form\" />\r\n </div>\r\n} \r\n<mat-stepper [style.display]=\"loading?'none':'block'\" #stepper class=\"form-stepper\" orientation=\"vertical\"\r\n [linear]=\"!isEditable\" aria-label=\"Form sections stepper\" [animationDuration]=\"'300'\"\r\n (selectionChange)=\"handleStepChange($event)\">\r\n\r\n @for (step of selectFormSteps(); track step.sectionId) {\r\n @if (!!step.sectionForm ) {\r\n <mat-step \r\n [stepControl]=\"step.sectionForm\" [completed]=\"step.sectionIsSeen && !step.sectionIsInvalid\"\r\n [editable]=\"isEditable\" \r\n [errorMessage]=\"step.sectionFormErrorMessage||''\" \r\n [state]=\"getStepState(step,$index)\"\r\n [hasError]=\"!step.sectionForm.valid && !!step.sectionForm.touched\"\r\n >\r\n <ng-template matStepLabel>\r\n <div class=\"step-label-container\" [attr.aria-label]=\"'Section ' + step.label\">\r\n <span class=\"step-label-text\">{{step.label|titlecase}}</span>\r\n @if (step.sectionIsSeen) {\r\n <mat-icon [class.error]=\"step.sectionIsInvalid\"\r\n [attr.aria-label]=\"step.sectionIsInvalid ? 'Section has errors' : 'Section completed'\">\r\n {{step.sectionIsSeen}}\r\n </mat-icon>\r\n }\r\n\r\n <span class=\"tour-trigger \" *ngIf=\"(step)?.activeSectionHasTour&&!!step.isActive \">\r\n <button tourAnchor=\"Form-Tour-trigger\" matTooltip=\"Start section tour\" mat-flat-button>\r\n <mat-icon>tour</mat-icon>\r\n </button>\r\n </span>\r\n </div>\r\n </ng-template>\r\n @if(!!step.isActive){\r\n @defer (on viewport; prefetch on idle) {\r\n <div class=\"step-content\">\r\n <div class=\"row form-section\">\r\n @for (col of step.columns; track col.id) {\r\n <div [class]=\"'col-md-'+col.colSize + ' box'\">\r\n <lib-t-form-input [tourAnchor]=\"col.id\" \r\n (valueChange)=\"updateValue(col.id,$event)\"\r\n [editorMode]=\"false\" \r\n [formBuilderFunctions]=\"formBuilderFunctions\"\r\n [inputConfig]=\"col\" [formGroup]=\"step.sectionForm\" [attr.aria-label]=\"col?.label || ''\">\r\n </lib-t-form-input>\r\n </div>\r\n }\r\n </div>\r\n\r\n <div class=\"step-actions\">\r\n @if(!$first) {\r\n <button mat-button matStepperPrevious type=\"button\" class=\"navigation-button\"\r\n [attr.aria-label]=\"'Go back to ' + getPreviousStepLabel()\">\r\n\r\n Back\r\n </button>\r\n }\r\n @if (!$last) {\r\n <button mat-flat-button matStepperNext color=\"primary\" type=\"button\" class=\"navigation-button\"\r\n [attr.aria-label]=\"'Continue to ' + getNextStepLabel()\">\r\n Next\r\n </button>\r\n }\r\n @if (!!$last) {\r\n <button mat-button (click)=\"stepper.reset()\">Reset</button>\r\n }\r\n </div>\r\n </div>\r\n } @placeholder {\r\n <div style=\"padding: 50px;display:flex;justify-content:center;align-items:center; text-align: center;\">\r\n <mat-spinner diameter=\"24\" />\r\n </div>\r\n }\r\n\r\n }\r\n \r\n </mat-step>\r\n }\r\n }\r\n</mat-stepper>\r\n <!-- Defer the footer toolbar until after the main form is loaded -->\r\n @defer (on idle; prefetch on viewport) {\r\n<footer><mat-toolbar class=\"submission-toolbar\" role=\"toolbar\" aria-label=\"Form submission actions\">\r\n <span class=\"submission-status\" role=\"status\">\r\n {{getSubmissionStatus}}\r\n </span>\r\n <button mat-raised-button color=\"primary\" [disabled]=\"mainForm?.invalid\" \r\n (click)=\"handleSubmit()\"\r\n aria-label=\"Submit form\">\r\n <span>\r\n {{ formSubmissionMessage()}} \r\n </span>\r\n @if(submittingForm){\r\n <mat-spinner diameter=\"10\"></mat-spinner>\r\n }\r\n \r\n </button>\r\n</mat-toolbar>\r\n</footer>\r\n} @placeholder {\r\n <!-- Simple placeholder for the footer that maintains layout -->\r\n <footer>\r\n <div class=\"submission-toolbar-placeholder\"></div>\r\n </footer>\r\n}\r\n", styles: [".form-stepper{min-height:400px}.step-label-container{display:flex;justify-content:space-between;align-items:center;width:100%;gap:16px}.step-error-message{font-size:12px;opacity:.9;margin-left:16px}.form-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:8px;margin-bottom:24px}.step-actions{display:flex;gap:16px;margin-top:24px}.navigation-button{display:flex;align-items:center;gap:8px}.loading-container{display:flex;justify-content:center;padding:32px}footer{position:sticky;bottom:0}.submission-toolbar{z-index:1000;background:#ffffff0d;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-top:var(--mat-divider-width) solid var(--mat-divider-color);padding:8px 16px;display:flex;justify-content:flex-end;gap:16px}.submission-status{font-size:12px;opacity:.87;display:flex;align-items:center}.box{padding:8px 4px 4px}.tour-trigger{position:absolute;right:8px;font-size:12px;opacity:.6}.tour-trigger:hover{opacity:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2$2.TitleCasePipe, name: "titlecase" }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i3$3.MatStep, selector: "mat-step", inputs: ["color"], exportAs: ["matStep"] }, { kind: "directive", type: i3$3.MatStepLabel, selector: "[matStepLabel]" }, { kind: "component", type: i3$3.MatStepper, selector: "mat-stepper, mat-vertical-stepper, mat-horizontal-stepper, [matStepper]", inputs: ["disableRipple", "color", "labelPosition", "headerPosition", "animationDuration"], outputs: ["animationDone"], exportAs: ["matStepper", "matVerticalStepper", "matHorizontalStepper"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: TourMatMenuModule }, { kind: "directive", type: i7$2.TourAnchorMatMenuDirective, selector: "[tourAnchor]", inputs: ["tourAnchor"] }, { kind: "ngmodule", type: ReactiveFormsModule }], deferBlockDependencies: [() => [i2.MatButton, i3$3.MatStepperNext, i3$3.MatStepperPrevious, Promise.resolve().then(function () { return tFormInput_component; }).then(m => m.TFormInputComponent), i7$2.TourAnchorMatMenuDirective, i1$2.NgControlStatusGroup, i1$2.FormGroupDirective], () => [i2.MatButton, i7.MatProgressSpinner, i9.MatToolbar]] }); }
|
|
10342
10351
|
}
|
|
10343
10352
|
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "19.2.2", ngImport: i0, type: UserFormStepperComponent, resolveDeferredDeps: () => [Promise.resolve().then(function () { return tFormInput_component; }).then(m => m.TFormInputComponent)], resolveMetadata: TFormInputComponent => ({ decorators: [{
|
|
10344
10353
|
type: Component,
|
|
@@ -10386,5 +10395,5 @@ console.debug = () => { };
|
|
|
10386
10395
|
* Generated bundle index. Do not edit.
|
|
10387
10396
|
*/
|
|
10388
10397
|
|
|
10389
|
-
export { safeReturnDeepProperty as A, getUrl as B, textIconsForUserHints as C, DaysAgoPipe as D, index as E, FormsStoreService as F, MatModulesModule as M, NGX_T_FORMS_CONFIG_TOKEN as N, PropertyAccessError as P, SyncEditorComponent as S, TDynamicDataEditComponent as T, UTILS_OBJECT_TOKEN as U, assignDeepPropertyToObject as a, TDynamicDataViewComponent as b, FormTowerControllerService as c, getSubmissionStatusFn as d, TreeComponent as e, NgxTFormsService as f, getAvatar as g, NgxTFormsComponent as h, initFormConfigToV2 as i, formGenerator as j, FORM_ACTIONS_TOKEN as k, FORM_CONFIG_TOKEN as l, FORM_SLIDES_TOKEN as m, FORM_INPUTS_TOKEN as n, MULTIPLE_FORM_INPUT_TOKEN as o, provideNgxTForms as p, MSCOA_TREE_PROVIDER as q, FormsComponent as r, FormBuilderComponent as s, testAgainstItem as t, MscoaFormInputComponent as u, UserFormStepperComponent as v, TFormInputComponent as w, DialogTemplateComponent as x, SignatureInputElementComponent as y, returnDeepProperty as z };
|
|
10390
|
-
//# sourceMappingURL=ngx-t-forms-ngx-t-forms-
|
|
10398
|
+
export { safeReturnDeepProperty as A, getUrl as B, textIconsForUserHints as C, DaysAgoPipe as D, index as E, FormsStoreService as F, MatModulesModule as M, NGX_T_FORMS_CONFIG_TOKEN as N, PropertyAccessError as P, SyncEditorComponent as S, TDynamicDataEditComponent as T, UTILS_OBJECT_TOKEN as U, _isEqual as _, assignDeepPropertyToObject as a, TDynamicDataViewComponent as b, FormTowerControllerService as c, getSubmissionStatusFn as d, TreeComponent as e, NgxTFormsService as f, getAvatar as g, NgxTFormsComponent as h, initFormConfigToV2 as i, formGenerator as j, FORM_ACTIONS_TOKEN as k, FORM_CONFIG_TOKEN as l, FORM_SLIDES_TOKEN as m, FORM_INPUTS_TOKEN as n, MULTIPLE_FORM_INPUT_TOKEN as o, provideNgxTForms as p, MSCOA_TREE_PROVIDER as q, FormsComponent as r, FormBuilderComponent as s, testAgainstItem as t, MscoaFormInputComponent as u, UserFormStepperComponent as v, TFormInputComponent as w, DialogTemplateComponent as x, SignatureInputElementComponent as y, returnDeepProperty as z };
|
|
10399
|
+
//# sourceMappingURL=ngx-t-forms-ngx-t-forms-DW5CqjCd.mjs.map
|