@covalent/dynamic-forms 9.1.3 → 10.0.0
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/covalent-dynamic-forms.mjs +473 -239
- package/fesm2022/covalent-dynamic-forms.mjs.map +1 -1
- package/lib/dynamic-element.component.d.ts +3 -3
- package/lib/dynamic-elements/dynamic-checkbox/dynamic-checkbox.component.d.ts +1 -1
- package/lib/dynamic-elements/dynamic-datepicker/dynamic-datepicker.component.d.ts +1 -1
- package/lib/dynamic-elements/dynamic-file-input/dynamic-file-input.component.d.ts +1 -1
- package/lib/dynamic-elements/dynamic-input/dynamic-input.component.d.ts +1 -1
- package/lib/dynamic-elements/dynamic-select/dynamic-select.component.d.ts +1 -1
- package/lib/dynamic-elements/dynamic-slide-toggle/dynamic-slide-toggle.component.d.ts +1 -1
- package/lib/dynamic-elements/dynamic-slider/dynamic-slider.component.d.ts +1 -1
- package/lib/dynamic-elements/dynamic-textarea/dynamic-textarea.component.d.ts +1 -1
- package/lib/dynamic-forms.component.d.ts +1 -1
- package/lib/dynamic-forms.module.d.ts +1 -13
- package/package.json +9 -8
- package/esm2022/covalent-dynamic-forms.mjs +0 -5
- package/esm2022/lib/dynamic-element.component.mjs +0 -229
- package/esm2022/lib/dynamic-elements/dynamic-checkbox/dynamic-checkbox.component.mjs +0 -18
- package/esm2022/lib/dynamic-elements/dynamic-datepicker/dynamic-datepicker.component.mjs +0 -26
- package/esm2022/lib/dynamic-elements/dynamic-file-input/dynamic-file-input.component.mjs +0 -28
- package/esm2022/lib/dynamic-elements/dynamic-input/dynamic-input.component.mjs +0 -27
- package/esm2022/lib/dynamic-elements/dynamic-select/dynamic-select.component.mjs +0 -25
- package/esm2022/lib/dynamic-elements/dynamic-slide-toggle/dynamic-slide-toggle.component.mjs +0 -18
- package/esm2022/lib/dynamic-elements/dynamic-slider/dynamic-slider.component.mjs +0 -30
- package/esm2022/lib/dynamic-elements/dynamic-textarea/dynamic-textarea.component.mjs +0 -22
- package/esm2022/lib/dynamic-forms.component.mjs +0 -191
- package/esm2022/lib/dynamic-forms.module.mjs +0 -125
- package/esm2022/lib/services/dynamic-forms.service.mjs +0 -140
- package/esm2022/public_api.mjs +0 -13
|
@@ -1,35 +1,27 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { Component, Injectable, Optional, SkipSelf, Directive, Input, Type, ViewChild, HostBinding, ChangeDetectionStrategy, ContentChildren, NgModule } from '@angular/core';
|
|
3
|
+
import * as i2 from '@angular/forms';
|
|
4
|
+
import { ReactiveFormsModule, UntypedFormControl, Validators, NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
3
5
|
import * as i1 from '@angular/common';
|
|
4
6
|
import { CommonModule } from '@angular/common';
|
|
5
|
-
import
|
|
6
|
-
import {
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import * as i4 from '@angular/material/input';
|
|
10
|
-
import { MatInputModule } from '@angular/material/input';
|
|
11
|
-
import * as i4$1 from '@angular/material/select';
|
|
12
|
-
import { MatSelectModule } from '@angular/material/select';
|
|
13
|
-
import * as i2$2 from '@angular/material/checkbox';
|
|
14
|
-
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
15
|
-
import * as i3$1 from '@angular/material/slider';
|
|
16
|
-
import { MatSliderModule } from '@angular/material/slider';
|
|
17
|
-
import * as i2$1 from '@angular/material/slide-toggle';
|
|
18
|
-
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
|
|
19
|
-
import * as i5 from '@angular/material/icon';
|
|
20
|
-
import { MatIconModule } from '@angular/material/icon';
|
|
21
|
-
import * as i6 from '@angular/material/button';
|
|
22
|
-
import { MatButtonModule } from '@angular/material/button';
|
|
23
|
-
import * as i5$2 from '@angular/material/datepicker';
|
|
24
|
-
import { MatDatepickerModule } from '@angular/material/datepicker';
|
|
25
|
-
import * as i7 from '@covalent/core/file';
|
|
7
|
+
import { MatFormField, MatLabel, MatError, MatHint } from '@angular/material/form-field';
|
|
8
|
+
import { MatInput } from '@angular/material/input';
|
|
9
|
+
import { MatIcon } from '@angular/material/icon';
|
|
10
|
+
import * as i3 from '@covalent/core/file';
|
|
26
11
|
import { CovalentFileModule } from '@covalent/core/file';
|
|
27
|
-
import
|
|
12
|
+
import { MatSlideToggle } from '@angular/material/slide-toggle';
|
|
13
|
+
import { MatCheckbox } from '@angular/material/checkbox';
|
|
14
|
+
import { MatSlider, MatSliderThumb } from '@angular/material/slider';
|
|
15
|
+
import { MatSelect, MatOption } from '@angular/material/select';
|
|
16
|
+
import * as i3$1 from '@angular/material/datepicker';
|
|
17
|
+
import { MatDatepickerModule } from '@angular/material/datepicker';
|
|
28
18
|
import { CdkPortal } from '@angular/cdk/portal';
|
|
29
19
|
import { mixinControlValueAccessor } from '@covalent/core/common';
|
|
30
20
|
import { Subject, timer } from 'rxjs';
|
|
31
21
|
import { filter, takeUntil } from 'rxjs/operators';
|
|
32
22
|
|
|
23
|
+
const _c0$5 = (a0, a1) => ({ control: a0, errors: a1 });
|
|
24
|
+
function TdDynamicInputComponent_ng_template_9_Template(rf, ctx) { }
|
|
33
25
|
class TdDynamicInputComponent {
|
|
34
26
|
control;
|
|
35
27
|
label = '';
|
|
@@ -43,14 +35,46 @@ class TdDynamicInputComponent {
|
|
|
43
35
|
maxLength;
|
|
44
36
|
errorMessageTemplate;
|
|
45
37
|
placeholder = '';
|
|
46
|
-
static ɵfac =
|
|
47
|
-
static ɵcmp = i0.ɵɵ
|
|
38
|
+
static ɵfac = function TdDynamicInputComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdDynamicInputComponent)(); };
|
|
39
|
+
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdDynamicInputComponent, selectors: [["td-dynamic-input"]], decls: 10, vars: 16, consts: [["elementInput", ""], [1, "td-dynamic-input-wrapper"], [1, "td-dynamic-input-field"], ["matInput", "", 3, "formControl", "placeholder", "type", "required", "name"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"]], template: function TdDynamicInputComponent_Template(rf, ctx) { if (rf & 1) {
|
|
40
|
+
i0.ɵɵelementStart(0, "div", 1)(1, "mat-form-field", 2)(2, "mat-label");
|
|
41
|
+
i0.ɵɵtext(3);
|
|
42
|
+
i0.ɵɵelementEnd();
|
|
43
|
+
i0.ɵɵelement(4, "input", 3, 0);
|
|
44
|
+
i0.ɵɵelementStart(6, "mat-hint");
|
|
45
|
+
i0.ɵɵtext(7);
|
|
46
|
+
i0.ɵɵelementEnd();
|
|
47
|
+
i0.ɵɵelementStart(8, "mat-error");
|
|
48
|
+
i0.ɵɵtemplate(9, TdDynamicInputComponent_ng_template_9_Template, 0, 0, "ng-template", 4);
|
|
49
|
+
i0.ɵɵelementEnd()()();
|
|
50
|
+
} if (rf & 2) {
|
|
51
|
+
i0.ɵɵadvance(3);
|
|
52
|
+
i0.ɵɵtextInterpolate(ctx.label);
|
|
53
|
+
i0.ɵɵadvance();
|
|
54
|
+
i0.ɵɵproperty("formControl", ctx.control)("placeholder", ctx.placeholder)("type", ctx.type)("required", ctx.required)("name", ctx.name);
|
|
55
|
+
i0.ɵɵattribute("min", ctx.min)("max", ctx.max)("minLength", ctx.minLength)("maxLength", ctx.maxLength);
|
|
56
|
+
i0.ɵɵadvance(3);
|
|
57
|
+
i0.ɵɵtextInterpolate(ctx.hint);
|
|
58
|
+
i0.ɵɵadvance(2);
|
|
59
|
+
i0.ɵɵproperty("ngTemplateOutlet", ctx.errorMessageTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction2(13, _c0$5, ctx.control, ctx.control.errors));
|
|
60
|
+
} }, dependencies: [CommonModule, i1.NgTemplateOutlet, ReactiveFormsModule, i2.DefaultValueAccessor, i2.NgControlStatus, i2.RequiredValidator, i2.FormControlDirective, MatFormField, MatInput, MatLabel, MatError, MatHint], styles: [".td-dynamic-input-wrapper[_ngcontent-%COMP%]{flex-direction:row;display:flex;box-sizing:border-box}.td-dynamic-input-wrapper[_ngcontent-%COMP%] .td-dynamic-input-field[_ngcontent-%COMP%]{flex:1;box-sizing:border-box}"] });
|
|
48
61
|
}
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
62
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdDynamicInputComponent, [{
|
|
63
|
+
type: Component,
|
|
64
|
+
args: [{ selector: 'td-dynamic-input', imports: [CommonModule, ReactiveFormsModule, MatFormField, MatInput, MatLabel, MatError, MatHint], template: "<div class=\"td-dynamic-input-wrapper\">\n <mat-form-field class=\"td-dynamic-input-field\">\n <mat-label>{{ label }}</mat-label>\n <input\n #elementInput\n matInput\n [formControl]=\"control\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [name]=\"name\"\n [attr.min]=\"min\"\n [attr.max]=\"max\"\n [attr.minLength]=\"minLength\"\n [attr.maxLength]=\"maxLength\"\n />\n <mat-hint>{{ hint }}</mat-hint>\n <mat-error>\n <ng-template\n [ngTemplateOutlet]=\"errorMessageTemplate\"\n [ngTemplateOutletContext]=\"{\n control: control,\n errors: control.errors\n }\"\n ></ng-template>\n </mat-error>\n </mat-form-field>\n</div>\n", styles: [".td-dynamic-input-wrapper{flex-direction:row;display:flex;box-sizing:border-box}.td-dynamic-input-wrapper .td-dynamic-input-field{flex:1;box-sizing:border-box}\n"] }]
|
|
65
|
+
}], null, null); })();
|
|
66
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdDynamicInputComponent, { className: "TdDynamicInputComponent", filePath: "lib/dynamic-elements/dynamic-input/dynamic-input.component.ts", lineNumber: 13 }); })();
|
|
53
67
|
|
|
68
|
+
const _c0$4 = (a0, a1) => ({ control: a0, errors: a1 });
|
|
69
|
+
function TdDynamicFileInputComponent_ng_template_8_Template(rf, ctx) { }
|
|
70
|
+
function TdDynamicFileInputComponent_button_9_Template(rf, ctx) { if (rf & 1) {
|
|
71
|
+
const _r3 = i0.ɵɵgetCurrentView();
|
|
72
|
+
i0.ɵɵelementStart(0, "button", 7);
|
|
73
|
+
i0.ɵɵlistener("click", function TdDynamicFileInputComponent_button_9_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r3); i0.ɵɵnextContext(); const fileInput_r2 = i0.ɵɵreference(11); return i0.ɵɵresetView(fileInput_r2.clear()); })("keyup.enter", function TdDynamicFileInputComponent_button_9_Template_button_keyup_enter_0_listener() { i0.ɵɵrestoreView(_r3); i0.ɵɵnextContext(); const fileInput_r2 = i0.ɵɵreference(11); return i0.ɵɵresetView(fileInput_r2.clear()); });
|
|
74
|
+
i0.ɵɵelementStart(1, "mat-icon");
|
|
75
|
+
i0.ɵɵtext(2, "cancel");
|
|
76
|
+
i0.ɵɵelementEnd()();
|
|
77
|
+
} }
|
|
54
78
|
class TdDynamicFileInputComponent {
|
|
55
79
|
control;
|
|
56
80
|
required = false;
|
|
@@ -62,14 +86,55 @@ class TdDynamicFileInputComponent {
|
|
|
62
86
|
_handlefileDrop(value) {
|
|
63
87
|
this.control?.setValue(value);
|
|
64
88
|
}
|
|
65
|
-
static ɵfac =
|
|
66
|
-
static ɵcmp = i0.ɵɵ
|
|
89
|
+
static ɵfac = function TdDynamicFileInputComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdDynamicFileInputComponent)(); };
|
|
90
|
+
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdDynamicFileInputComponent, selectors: [["td-dynamic-file-input"]], decls: 16, vars: 15, consts: [["fileInput", ""], [1, "td-dynamic-file-input-wrapper"], ["tdFileDrop", "", 1, "td-dynamic-file-input-field", 3, "fileDrop", "click", "keyup.enter", "keyup.delete", "keyup.backspace", "disabled"], ["matInput", "", "readonly", "", 3, "value", "placeholder", "name", "disabled"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], ["mat-icon-button", "", 3, "click", "keyup.enter", 4, "ngIf"], [1, "td-file-input", 3, "formControl"], ["mat-icon-button", "", 3, "click", "keyup.enter"]], template: function TdDynamicFileInputComponent_Template(rf, ctx) { if (rf & 1) {
|
|
91
|
+
const _r1 = i0.ɵɵgetCurrentView();
|
|
92
|
+
i0.ɵɵelementStart(0, "div", 1)(1, "mat-form-field", 2);
|
|
93
|
+
i0.ɵɵlistener("fileDrop", function TdDynamicFileInputComponent_Template_mat_form_field_fileDrop_1_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx._handlefileDrop($event)); })("click", function TdDynamicFileInputComponent_Template_mat_form_field_click_1_listener() { i0.ɵɵrestoreView(_r1); const fileInput_r2 = i0.ɵɵreference(11); return i0.ɵɵresetView(!ctx.control.disabled && fileInput_r2.inputElement.click()); })("keyup.enter", function TdDynamicFileInputComponent_Template_mat_form_field_keyup_enter_1_listener() { i0.ɵɵrestoreView(_r1); const fileInput_r2 = i0.ɵɵreference(11); return i0.ɵɵresetView(!ctx.control.disabled && fileInput_r2.inputElement.click()); })("keyup.delete", function TdDynamicFileInputComponent_Template_mat_form_field_keyup_delete_1_listener() { i0.ɵɵrestoreView(_r1); const fileInput_r2 = i0.ɵɵreference(11); return i0.ɵɵresetView(fileInput_r2.clear()); })("keyup.backspace", function TdDynamicFileInputComponent_Template_mat_form_field_keyup_backspace_1_listener() { i0.ɵɵrestoreView(_r1); const fileInput_r2 = i0.ɵɵreference(11); return i0.ɵɵresetView(fileInput_r2.clear()); });
|
|
94
|
+
i0.ɵɵelementStart(2, "mat-label");
|
|
95
|
+
i0.ɵɵtext(3);
|
|
96
|
+
i0.ɵɵelementEnd();
|
|
97
|
+
i0.ɵɵelement(4, "input", 3);
|
|
98
|
+
i0.ɵɵelementStart(5, "mat-hint");
|
|
99
|
+
i0.ɵɵtext(6);
|
|
100
|
+
i0.ɵɵelementEnd();
|
|
101
|
+
i0.ɵɵelementStart(7, "mat-error");
|
|
102
|
+
i0.ɵɵtemplate(8, TdDynamicFileInputComponent_ng_template_8_Template, 0, 0, "ng-template", 4);
|
|
103
|
+
i0.ɵɵelementEnd()();
|
|
104
|
+
i0.ɵɵtemplate(9, TdDynamicFileInputComponent_button_9_Template, 3, 0, "button", 5);
|
|
105
|
+
i0.ɵɵelementStart(10, "td-file-input", 6, 0)(12, "mat-icon");
|
|
106
|
+
i0.ɵɵtext(13, "folder");
|
|
107
|
+
i0.ɵɵelementEnd();
|
|
108
|
+
i0.ɵɵelementStart(14, "span");
|
|
109
|
+
i0.ɵɵtext(15);
|
|
110
|
+
i0.ɵɵelementEnd()()();
|
|
111
|
+
} if (rf & 2) {
|
|
112
|
+
i0.ɵɵadvance();
|
|
113
|
+
i0.ɵɵproperty("disabled", ctx.control.disabled);
|
|
114
|
+
i0.ɵɵadvance(2);
|
|
115
|
+
i0.ɵɵtextInterpolate(ctx.label);
|
|
116
|
+
i0.ɵɵadvance();
|
|
117
|
+
i0.ɵɵproperty("value", ctx.control.value == null ? null : ctx.control.value.name)("placeholder", ctx.placeholder)("name", ctx.name)("disabled", ctx.control.disabled);
|
|
118
|
+
i0.ɵɵadvance(2);
|
|
119
|
+
i0.ɵɵtextInterpolate(ctx.hint);
|
|
120
|
+
i0.ɵɵadvance(2);
|
|
121
|
+
i0.ɵɵproperty("ngTemplateOutlet", ctx.errorMessageTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction2(12, _c0$4, ctx.control, ctx.control.errors));
|
|
122
|
+
i0.ɵɵadvance();
|
|
123
|
+
i0.ɵɵproperty("ngIf", ctx.control.value);
|
|
124
|
+
i0.ɵɵadvance();
|
|
125
|
+
i0.ɵɵproperty("formControl", ctx.control);
|
|
126
|
+
i0.ɵɵadvance(5);
|
|
127
|
+
i0.ɵɵtextInterpolate(ctx.label);
|
|
128
|
+
} }, dependencies: [CommonModule, i1.NgIf, i1.NgTemplateOutlet, ReactiveFormsModule, i2.NgControlStatus, i2.FormControlDirective, MatFormField, MatInput, MatLabel, MatError, MatHint, MatIcon, CovalentFileModule, i3.TdFileDropDirective, i3.TdFileInputComponent], styles: [".td-dynamic-file-input-wrapper[_ngcontent-%COMP%]{flex-direction:row;display:flex;box-sizing:border-box}.td-dynamic-file-input-wrapper[_ngcontent-%COMP%] .td-dynamic-file-input-field[_ngcontent-%COMP%]{flex:1;box-sizing:border-box}.td-file-input[_ngcontent-%COMP%]{margin-left:10px}.td-file-input[_ngcontent-%COMP%] mat-icon[_ngcontent-%COMP%]{margin-right:8px}"] });
|
|
67
129
|
}
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
130
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdDynamicFileInputComponent, [{
|
|
131
|
+
type: Component,
|
|
132
|
+
args: [{ selector: 'td-dynamic-file-input', imports: [CommonModule, ReactiveFormsModule, MatFormField, MatInput, MatLabel, MatError, MatHint, MatIcon, CovalentFileModule], template: "<div class=\"td-dynamic-file-input-wrapper\">\n <mat-form-field\n tdFileDrop\n class=\"td-dynamic-file-input-field\"\n [disabled]=\"control.disabled\"\n (fileDrop)=\"_handlefileDrop($event)\"\n (click)=\"!control.disabled && fileInput.inputElement.click()\"\n (keyup.enter)=\"!control.disabled && fileInput.inputElement.click()\"\n (keyup.delete)=\"fileInput.clear()\"\n (keyup.backspace)=\"fileInput.clear()\"\n >\n <mat-label>{{ label }}</mat-label>\n <input\n matInput\n [value]=\"control.value?.name\"\n [placeholder]=\"placeholder\"\n [name]=\"name\"\n [disabled]=\"control.disabled\"\n readonly\n />\n <mat-hint>{{ hint }}</mat-hint>\n <mat-error>\n <ng-template\n [ngTemplateOutlet]=\"errorMessageTemplate\"\n [ngTemplateOutletContext]=\"{\n control: control,\n errors: control.errors\n }\"\n ></ng-template>\n </mat-error>\n </mat-form-field>\n <button\n mat-icon-button\n *ngIf=\"control.value\"\n (click)=\"fileInput.clear()\"\n (keyup.enter)=\"fileInput.clear()\"\n >\n <mat-icon>cancel</mat-icon>\n </button>\n <td-file-input class=\"td-file-input\" #fileInput [formControl]=\"control\">\n <mat-icon>folder</mat-icon>\n <span>{{ label }}</span>\n </td-file-input>\n</div>\n", styles: [".td-dynamic-file-input-wrapper{flex-direction:row;display:flex;box-sizing:border-box}.td-dynamic-file-input-wrapper .td-dynamic-file-input-field{flex:1;box-sizing:border-box}.td-file-input{margin-left:10px}.td-file-input mat-icon{margin-right:8px}\n"] }]
|
|
133
|
+
}], null, null); })();
|
|
134
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdDynamicFileInputComponent, { className: "TdDynamicFileInputComponent", filePath: "lib/dynamic-elements/dynamic-file-input/dynamic-file-input.component.ts", lineNumber: 15 }); })();
|
|
72
135
|
|
|
136
|
+
const _c0$3 = (a0, a1) => ({ control: a0, errors: a1 });
|
|
137
|
+
function TdDynamicTextareaComponent_ng_template_9_Template(rf, ctx) { }
|
|
73
138
|
class TdDynamicTextareaComponent {
|
|
74
139
|
control;
|
|
75
140
|
label = '';
|
|
@@ -78,13 +143,34 @@ class TdDynamicTextareaComponent {
|
|
|
78
143
|
required = false;
|
|
79
144
|
errorMessageTemplate;
|
|
80
145
|
placeholder = '';
|
|
81
|
-
static ɵfac =
|
|
82
|
-
static ɵcmp = i0.ɵɵ
|
|
146
|
+
static ɵfac = function TdDynamicTextareaComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdDynamicTextareaComponent)(); };
|
|
147
|
+
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdDynamicTextareaComponent, selectors: [["td-dynamic-textarea"]], decls: 10, vars: 11, consts: [["elementInput", ""], [1, "td-dynamic-textarea-wrapper"], [1, "td-dynamic-textarea-field"], ["matInput", "", "rows", "4", 3, "formControl", "placeholder", "required", "name"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"]], template: function TdDynamicTextareaComponent_Template(rf, ctx) { if (rf & 1) {
|
|
148
|
+
i0.ɵɵelementStart(0, "div", 1)(1, "mat-form-field", 2)(2, "mat-label");
|
|
149
|
+
i0.ɵɵtext(3);
|
|
150
|
+
i0.ɵɵelementEnd();
|
|
151
|
+
i0.ɵɵelement(4, "textarea", 3, 0);
|
|
152
|
+
i0.ɵɵelementStart(6, "mat-hint");
|
|
153
|
+
i0.ɵɵtext(7);
|
|
154
|
+
i0.ɵɵelementEnd();
|
|
155
|
+
i0.ɵɵelementStart(8, "mat-error");
|
|
156
|
+
i0.ɵɵtemplate(9, TdDynamicTextareaComponent_ng_template_9_Template, 0, 0, "ng-template", 4);
|
|
157
|
+
i0.ɵɵelementEnd()()();
|
|
158
|
+
} if (rf & 2) {
|
|
159
|
+
i0.ɵɵadvance(3);
|
|
160
|
+
i0.ɵɵtextInterpolate(ctx.label);
|
|
161
|
+
i0.ɵɵadvance();
|
|
162
|
+
i0.ɵɵproperty("formControl", ctx.control)("placeholder", ctx.placeholder)("required", ctx.required)("name", ctx.name);
|
|
163
|
+
i0.ɵɵadvance(3);
|
|
164
|
+
i0.ɵɵtextInterpolate(ctx.hint);
|
|
165
|
+
i0.ɵɵadvance(2);
|
|
166
|
+
i0.ɵɵproperty("ngTemplateOutlet", ctx.errorMessageTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction2(8, _c0$3, ctx.control, ctx.control.errors));
|
|
167
|
+
} }, dependencies: [CommonModule, i1.NgTemplateOutlet, ReactiveFormsModule, i2.DefaultValueAccessor, i2.NgControlStatus, i2.RequiredValidator, i2.FormControlDirective, MatInput, MatLabel, MatError, MatHint, MatFormField], styles: [".td-dynamic-textarea-wrapper[_ngcontent-%COMP%]{flex-direction:row;display:flex;box-sizing:border-box}.td-dynamic-textarea-wrapper[_ngcontent-%COMP%] .td-dynamic-textarea-field[_ngcontent-%COMP%]{flex:1;box-sizing:border-box}"] });
|
|
83
168
|
}
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
169
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdDynamicTextareaComponent, [{
|
|
170
|
+
type: Component,
|
|
171
|
+
args: [{ selector: 'td-dynamic-textarea', imports: [CommonModule, ReactiveFormsModule, MatInput, MatLabel, MatError, MatHint, MatFormField], template: "<div class=\"td-dynamic-textarea-wrapper\">\n <mat-form-field class=\"td-dynamic-textarea-field\">\n <mat-label>{{ label }}</mat-label>\n <textarea\n #elementInput\n matInput\n [formControl]=\"control\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n [name]=\"name\"\n rows=\"4\"\n ></textarea>\n <mat-hint>{{ hint }}</mat-hint>\n <mat-error>\n <ng-template\n [ngTemplateOutlet]=\"errorMessageTemplate\"\n [ngTemplateOutletContext]=\"{\n control: control,\n errors: control.errors\n }\"\n ></ng-template>\n </mat-error>\n </mat-form-field>\n</div>\n", styles: [".td-dynamic-textarea-wrapper{flex-direction:row;display:flex;box-sizing:border-box}.td-dynamic-textarea-wrapper .td-dynamic-textarea-field{flex:1;box-sizing:border-box}\n"] }]
|
|
172
|
+
}], null, null); })();
|
|
173
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdDynamicTextareaComponent, { className: "TdDynamicTextareaComponent", filePath: "lib/dynamic-elements/dynamic-textarea/dynamic-textarea.component.ts", lineNumber: 13 }); })();
|
|
88
174
|
|
|
89
175
|
class TdDynamicSlideToggleComponent {
|
|
90
176
|
control;
|
|
@@ -92,13 +178,29 @@ class TdDynamicSlideToggleComponent {
|
|
|
92
178
|
name = '';
|
|
93
179
|
hint = '';
|
|
94
180
|
required = false;
|
|
95
|
-
static ɵfac =
|
|
96
|
-
static ɵcmp = i0.ɵɵ
|
|
181
|
+
static ɵfac = function TdDynamicSlideToggleComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdDynamicSlideToggleComponent)(); };
|
|
182
|
+
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdDynamicSlideToggleComponent, selectors: [["td-dynamic-slide-toggle"]], decls: 5, vars: 5, consts: [[1, "td-dynamic-slide-toggle-wrapper"], ["color", "primary", 3, "formControl", "required"], [1, "mat-hint", "td-dynamic-element-hint"]], template: function TdDynamicSlideToggleComponent_Template(rf, ctx) { if (rf & 1) {
|
|
183
|
+
i0.ɵɵelementStart(0, "div", 0)(1, "mat-slide-toggle", 1);
|
|
184
|
+
i0.ɵɵtext(2);
|
|
185
|
+
i0.ɵɵelementEnd();
|
|
186
|
+
i0.ɵɵelementStart(3, "span", 2);
|
|
187
|
+
i0.ɵɵtext(4);
|
|
188
|
+
i0.ɵɵelementEnd()();
|
|
189
|
+
} if (rf & 2) {
|
|
190
|
+
i0.ɵɵadvance();
|
|
191
|
+
i0.ɵɵproperty("formControl", ctx.control)("required", ctx.required);
|
|
192
|
+
i0.ɵɵattribute("name", ctx.name);
|
|
193
|
+
i0.ɵɵadvance();
|
|
194
|
+
i0.ɵɵtextInterpolate1(" ", ctx.label, " ");
|
|
195
|
+
i0.ɵɵadvance(2);
|
|
196
|
+
i0.ɵɵtextInterpolate(ctx.hint);
|
|
197
|
+
} }, dependencies: [ReactiveFormsModule, i2.NgControlStatus, i2.RequiredValidator, i2.FormControlDirective, MatSlideToggle], encapsulation: 2 });
|
|
97
198
|
}
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
199
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdDynamicSlideToggleComponent, [{
|
|
200
|
+
type: Component,
|
|
201
|
+
args: [{ selector: 'td-dynamic-slide-toggle', imports: [ReactiveFormsModule, MatSlideToggle], template: "<div class=\"td-dynamic-slide-toggle-wrapper\">\n <mat-slide-toggle\n [formControl]=\"control\"\n [attr.name]=\"name\"\n [required]=\"required\"\n color=\"primary\"\n >\n {{ label }}\n </mat-slide-toggle>\n <span class=\"mat-hint td-dynamic-element-hint\">{{ hint }}</span>\n</div>\n" }]
|
|
202
|
+
}], null, null); })();
|
|
203
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdDynamicSlideToggleComponent, { className: "TdDynamicSlideToggleComponent", filePath: "lib/dynamic-elements/dynamic-slide-toggle/dynamic-slide-toggle.component.ts", lineNumber: 11 }); })();
|
|
102
204
|
|
|
103
205
|
class TdDynamicCheckboxComponent {
|
|
104
206
|
control;
|
|
@@ -106,14 +208,34 @@ class TdDynamicCheckboxComponent {
|
|
|
106
208
|
name = '';
|
|
107
209
|
hint = '';
|
|
108
210
|
required = false;
|
|
109
|
-
static ɵfac =
|
|
110
|
-
static ɵcmp = i0.ɵɵ
|
|
211
|
+
static ɵfac = function TdDynamicCheckboxComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdDynamicCheckboxComponent)(); };
|
|
212
|
+
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdDynamicCheckboxComponent, selectors: [["td-dynamic-checkbox"]], decls: 5, vars: 5, consts: [[1, "td-dynamic-checkbox-wrapper"], [3, "formControl", "name", "required"], [1, "mat-hint", "td-dynamic-element-hint"]], template: function TdDynamicCheckboxComponent_Template(rf, ctx) { if (rf & 1) {
|
|
213
|
+
i0.ɵɵelementStart(0, "div", 0)(1, "mat-checkbox", 1);
|
|
214
|
+
i0.ɵɵtext(2);
|
|
215
|
+
i0.ɵɵelementEnd();
|
|
216
|
+
i0.ɵɵelementStart(3, "span", 2);
|
|
217
|
+
i0.ɵɵtext(4);
|
|
218
|
+
i0.ɵɵelementEnd()();
|
|
219
|
+
} if (rf & 2) {
|
|
220
|
+
i0.ɵɵadvance();
|
|
221
|
+
i0.ɵɵproperty("formControl", ctx.control)("name", ctx.name)("required", ctx.required);
|
|
222
|
+
i0.ɵɵadvance();
|
|
223
|
+
i0.ɵɵtextInterpolate1(" ", ctx.label, " ");
|
|
224
|
+
i0.ɵɵadvance(2);
|
|
225
|
+
i0.ɵɵtextInterpolate(ctx.hint);
|
|
226
|
+
} }, dependencies: [ReactiveFormsModule, i2.NgControlStatus, i2.RequiredValidator, i2.FormControlDirective, MatCheckbox], encapsulation: 2 });
|
|
111
227
|
}
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
228
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdDynamicCheckboxComponent, [{
|
|
229
|
+
type: Component,
|
|
230
|
+
args: [{ selector: 'td-dynamic-checkbox', imports: [ReactiveFormsModule, MatCheckbox], template: "<div class=\"td-dynamic-checkbox-wrapper\">\n <mat-checkbox [formControl]=\"control\" [name]=\"name\" [required]=\"required\">\n {{ label }}\n </mat-checkbox>\n <span class=\"mat-hint td-dynamic-element-hint\">{{ hint }}</span>\n</div>\n" }]
|
|
231
|
+
}], null, null); })();
|
|
232
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdDynamicCheckboxComponent, { className: "TdDynamicCheckboxComponent", filePath: "lib/dynamic-elements/dynamic-checkbox/dynamic-checkbox.component.ts", lineNumber: 11 }); })();
|
|
116
233
|
|
|
234
|
+
function TdDynamicSliderComponent_span_4_Template(rf, ctx) { if (rf & 1) {
|
|
235
|
+
i0.ɵɵelementStart(0, "span", 9);
|
|
236
|
+
i0.ɵɵtext(1, "*");
|
|
237
|
+
i0.ɵɵelementEnd();
|
|
238
|
+
} }
|
|
117
239
|
class TdDynamicSliderComponent {
|
|
118
240
|
_changeDetectorRef;
|
|
119
241
|
control;
|
|
@@ -131,14 +253,51 @@ class TdDynamicSliderComponent {
|
|
|
131
253
|
this._changeDetectorRef.markForCheck();
|
|
132
254
|
});
|
|
133
255
|
}
|
|
134
|
-
static ɵfac =
|
|
135
|
-
static ɵcmp = i0.ɵɵ
|
|
256
|
+
static ɵfac = function TdDynamicSliderComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdDynamicSliderComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
|
|
257
|
+
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdDynamicSliderComponent, selectors: [["td-dynamic-slider"]], decls: 11, vars: 8, consts: [["slider", ""], [1, "td-dynamic-slider-wrapper", "mat-form-field", "mat-form-field-can-float", "mat-form-field-should-float"], [1, "mat-form-field-label-wrapper"], [1, "mat-form-field-label", "mat-primary", "td-slider-label"], ["class", "mat-form-field-required-marker", 4, "ngIf"], [1, "td-dynamic-slider-field"], ["thumbLabel", "", "tickInterval", "auto", 1, "td-dynamic-slider", 3, "blur"], ["matSliderThumb", "", 3, "min", "max", "formControl", "required"], [1, "mat-hint", "td-dynamic-element-hint"], [1, "mat-form-field-required-marker"]], template: function TdDynamicSliderComponent_Template(rf, ctx) { if (rf & 1) {
|
|
258
|
+
const _r1 = i0.ɵɵgetCurrentView();
|
|
259
|
+
i0.ɵɵelementStart(0, "div", 1)(1, "span", 2)(2, "label", 3);
|
|
260
|
+
i0.ɵɵtext(3);
|
|
261
|
+
i0.ɵɵtemplate(4, TdDynamicSliderComponent_span_4_Template, 2, 0, "span", 4);
|
|
262
|
+
i0.ɵɵelementEnd()();
|
|
263
|
+
i0.ɵɵelementStart(5, "div", 5)(6, "mat-slider", 6, 0);
|
|
264
|
+
i0.ɵɵlistener("blur", function TdDynamicSliderComponent_Template_mat_slider_blur_6_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx._handleBlur()); });
|
|
265
|
+
i0.ɵɵelement(8, "input", 7);
|
|
266
|
+
i0.ɵɵelementEnd()();
|
|
267
|
+
i0.ɵɵelementStart(9, "span", 8);
|
|
268
|
+
i0.ɵɵtext(10);
|
|
269
|
+
i0.ɵɵelementEnd()();
|
|
270
|
+
} if (rf & 2) {
|
|
271
|
+
i0.ɵɵadvance(3);
|
|
272
|
+
i0.ɵɵtextInterpolate1(" ", ctx.label, " ");
|
|
273
|
+
i0.ɵɵadvance();
|
|
274
|
+
i0.ɵɵproperty("ngIf", ctx.required && !(ctx.control == null ? null : ctx.control.disabled));
|
|
275
|
+
i0.ɵɵadvance(4);
|
|
276
|
+
i0.ɵɵproperty("min", ctx.min)("max", ctx.max)("formControl", ctx.control)("required", ctx.required);
|
|
277
|
+
i0.ɵɵattribute("name", ctx.name);
|
|
278
|
+
i0.ɵɵadvance(2);
|
|
279
|
+
i0.ɵɵtextInterpolate(ctx.hint);
|
|
280
|
+
} }, dependencies: [CommonModule, i1.NgIf, ReactiveFormsModule, i2.DefaultValueAccessor, i2.NgControlStatus, i2.RequiredValidator, i2.FormControlDirective, MatSlider, MatSliderThumb], styles: ["[_nghost-%COMP%] .td-dynamic-slider-wrapper[_ngcontent-%COMP%]{display:block}.td-dynamic-slider-field[_ngcontent-%COMP%]{position:relative;flex-direction:row;display:flex;box-sizing:border-box}.td-dynamic-slider-field[_ngcontent-%COMP%] .td-dynamic-slider[_ngcontent-%COMP%]{flex:1}"] });
|
|
136
281
|
}
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
282
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdDynamicSliderComponent, [{
|
|
283
|
+
type: Component,
|
|
284
|
+
args: [{ selector: 'td-dynamic-slider', imports: [CommonModule, ReactiveFormsModule, MatSlider, MatSliderThumb], template: "<div\n class=\"td-dynamic-slider-wrapper mat-form-field mat-form-field-can-float mat-form-field-should-float\"\n>\n <span class=\"mat-form-field-label-wrapper\">\n <label class=\"mat-form-field-label mat-primary td-slider-label\">\n {{ label }}\n <span\n *ngIf=\"required && !control?.disabled\"\n class=\"mat-form-field-required-marker\"\n >*</span\n >\n </label>\n </span>\n <div class=\"td-dynamic-slider-field\">\n <mat-slider\n #slider\n class=\"td-dynamic-slider\"\n thumbLabel\n tickInterval=\"auto\"\n (blur)=\"_handleBlur()\"\n >\n <input\n [attr.name]=\"name\"\n [min]=\"min\"\n [max]=\"max\"\n [formControl]=\"control\"\n [required]=\"required\"\n matSliderThumb\n />\n </mat-slider>\n </div>\n <span class=\"mat-hint td-dynamic-element-hint\">{{ hint }}</span>\n</div>\n", styles: [":host .td-dynamic-slider-wrapper{display:block}.td-dynamic-slider-field{position:relative;flex-direction:row;display:flex;box-sizing:border-box}.td-dynamic-slider-field .td-dynamic-slider{flex:1}\n"] }]
|
|
285
|
+
}], () => [{ type: i0.ChangeDetectorRef }], null); })();
|
|
286
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdDynamicSliderComponent, { className: "TdDynamicSliderComponent", filePath: "lib/dynamic-elements/dynamic-slider/dynamic-slider.component.ts", lineNumber: 12 }); })();
|
|
141
287
|
|
|
288
|
+
const _c0$2 = (a0, a1) => ({ control: a0, errors: a1 });
|
|
289
|
+
function TdDynamicSelectComponent_mat_option_5_Template(rf, ctx) { if (rf & 1) {
|
|
290
|
+
i0.ɵɵelementStart(0, "mat-option", 5);
|
|
291
|
+
i0.ɵɵtext(1);
|
|
292
|
+
i0.ɵɵelementEnd();
|
|
293
|
+
} if (rf & 2) {
|
|
294
|
+
let tmp_2_0;
|
|
295
|
+
const selection_r1 = ctx.$implicit;
|
|
296
|
+
i0.ɵɵproperty("value", (tmp_2_0 = selection_r1.value) !== null && tmp_2_0 !== undefined ? tmp_2_0 : selection_r1);
|
|
297
|
+
i0.ɵɵadvance();
|
|
298
|
+
i0.ɵɵtextInterpolate1(" ", selection_r1.label || selection_r1, " ");
|
|
299
|
+
} }
|
|
300
|
+
function TdDynamicSelectComponent_ng_template_9_Template(rf, ctx) { }
|
|
142
301
|
class TdDynamicSelectComponent {
|
|
143
302
|
control;
|
|
144
303
|
label = '';
|
|
@@ -149,14 +308,42 @@ class TdDynamicSelectComponent {
|
|
|
149
308
|
multiple;
|
|
150
309
|
errorMessageTemplate;
|
|
151
310
|
placeholder = '';
|
|
152
|
-
static ɵfac =
|
|
153
|
-
static ɵcmp = i0.ɵɵ
|
|
311
|
+
static ɵfac = function TdDynamicSelectComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdDynamicSelectComponent)(); };
|
|
312
|
+
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdDynamicSelectComponent, selectors: [["td-dynamic-select"]], decls: 10, vars: 13, consts: [[1, "td-dynamic-select-wrapper"], [1, "td-dynamic-select-field"], [3, "formControl", "placeholder", "required", "multiple"], [3, "value", 4, "ngFor", "ngForOf"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], [3, "value"]], template: function TdDynamicSelectComponent_Template(rf, ctx) { if (rf & 1) {
|
|
313
|
+
i0.ɵɵelementStart(0, "div", 0)(1, "mat-form-field", 1)(2, "mat-label");
|
|
314
|
+
i0.ɵɵtext(3);
|
|
315
|
+
i0.ɵɵelementEnd();
|
|
316
|
+
i0.ɵɵelementStart(4, "mat-select", 2);
|
|
317
|
+
i0.ɵɵtemplate(5, TdDynamicSelectComponent_mat_option_5_Template, 2, 2, "mat-option", 3);
|
|
318
|
+
i0.ɵɵelementEnd();
|
|
319
|
+
i0.ɵɵelementStart(6, "mat-hint");
|
|
320
|
+
i0.ɵɵtext(7);
|
|
321
|
+
i0.ɵɵelementEnd();
|
|
322
|
+
i0.ɵɵelementStart(8, "mat-error");
|
|
323
|
+
i0.ɵɵtemplate(9, TdDynamicSelectComponent_ng_template_9_Template, 0, 0, "ng-template", 4);
|
|
324
|
+
i0.ɵɵelementEnd()()();
|
|
325
|
+
} if (rf & 2) {
|
|
326
|
+
i0.ɵɵadvance(3);
|
|
327
|
+
i0.ɵɵtextInterpolate(ctx.label);
|
|
328
|
+
i0.ɵɵadvance();
|
|
329
|
+
i0.ɵɵproperty("formControl", ctx.control)("placeholder", ctx.placeholder)("required", ctx.required)("multiple", ctx.multiple);
|
|
330
|
+
i0.ɵɵattribute("name", ctx.name);
|
|
331
|
+
i0.ɵɵadvance();
|
|
332
|
+
i0.ɵɵproperty("ngForOf", ctx.selections);
|
|
333
|
+
i0.ɵɵadvance(2);
|
|
334
|
+
i0.ɵɵtextInterpolate(ctx.hint);
|
|
335
|
+
i0.ɵɵadvance(2);
|
|
336
|
+
i0.ɵɵproperty("ngTemplateOutlet", ctx.errorMessageTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction2(10, _c0$2, ctx.control, ctx.control.errors));
|
|
337
|
+
} }, dependencies: [CommonModule, i1.NgForOf, i1.NgTemplateOutlet, ReactiveFormsModule, i2.NgControlStatus, i2.RequiredValidator, i2.FormControlDirective, MatFormField, MatSelect, MatOption, MatLabel, MatError, MatHint], styles: [".td-dynamic-select-wrapper[_ngcontent-%COMP%]{flex-direction:row;display:flex;box-sizing:border-box}.td-dynamic-select-wrapper[_ngcontent-%COMP%] .td-dynamic-select-field[_ngcontent-%COMP%]{flex:1;box-sizing:border-box}"] });
|
|
154
338
|
}
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
339
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdDynamicSelectComponent, [{
|
|
340
|
+
type: Component,
|
|
341
|
+
args: [{ selector: 'td-dynamic-select', imports: [CommonModule, ReactiveFormsModule, MatFormField, MatSelect, MatOption, MatLabel, MatError, MatHint], template: "<div class=\"td-dynamic-select-wrapper\">\n <mat-form-field class=\"td-dynamic-select-field\">\n <mat-label>{{ label }}</mat-label>\n <mat-select\n [formControl]=\"control\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n [attr.name]=\"name\"\n [multiple]=\"multiple\"\n >\n <mat-option\n *ngFor=\"let selection of selections\"\n [value]=\"selection.value ?? selection\"\n >\n {{ selection.label || selection }}\n </mat-option>\n </mat-select>\n <mat-hint>{{ hint }}</mat-hint>\n <mat-error>\n <ng-template\n [ngTemplateOutlet]=\"errorMessageTemplate\"\n [ngTemplateOutletContext]=\"{\n control: control,\n errors: control.errors\n }\"\n ></ng-template>\n </mat-error>\n </mat-form-field>\n</div>\n", styles: [".td-dynamic-select-wrapper{flex-direction:row;display:flex;box-sizing:border-box}.td-dynamic-select-wrapper .td-dynamic-select-field{flex:1;box-sizing:border-box}\n"] }]
|
|
342
|
+
}], null, null); })();
|
|
343
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdDynamicSelectComponent, { className: "TdDynamicSelectComponent", filePath: "lib/dynamic-elements/dynamic-select/dynamic-select.component.ts", lineNumber: 13 }); })();
|
|
159
344
|
|
|
345
|
+
const _c0$1 = (a0, a1) => ({ control: a0, errors: a1 });
|
|
346
|
+
function TdDynamicDatepickerComponent_ng_template_9_Template(rf, ctx) { }
|
|
160
347
|
class TdDynamicDatepickerComponent {
|
|
161
348
|
control;
|
|
162
349
|
label = '';
|
|
@@ -168,13 +355,39 @@ class TdDynamicDatepickerComponent {
|
|
|
168
355
|
max;
|
|
169
356
|
errorMessageTemplate;
|
|
170
357
|
placeholder = '';
|
|
171
|
-
static ɵfac =
|
|
172
|
-
static ɵcmp = i0.ɵɵ
|
|
358
|
+
static ɵfac = function TdDynamicDatepickerComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdDynamicDatepickerComponent)(); };
|
|
359
|
+
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdDynamicDatepickerComponent, selectors: [["td-dynamic-datepicker"]], decls: 13, vars: 15, consts: [["elementInput", ""], ["dynamicDatePicker", ""], [1, "td-dynamic-datepicker-wrapper"], [1, "td-dynamic-datepicker-field"], ["matInput", "", 3, "matDatepicker", "formControl", "placeholder", "required", "name", "min", "max"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], ["matSuffix", "", 3, "for"]], template: function TdDynamicDatepickerComponent_Template(rf, ctx) { if (rf & 1) {
|
|
360
|
+
i0.ɵɵelementStart(0, "div", 2)(1, "mat-form-field", 3)(2, "mat-label");
|
|
361
|
+
i0.ɵɵtext(3);
|
|
362
|
+
i0.ɵɵelementEnd();
|
|
363
|
+
i0.ɵɵelement(4, "input", 4, 0);
|
|
364
|
+
i0.ɵɵelementStart(6, "mat-hint");
|
|
365
|
+
i0.ɵɵtext(7);
|
|
366
|
+
i0.ɵɵelementEnd();
|
|
367
|
+
i0.ɵɵelementStart(8, "mat-error");
|
|
368
|
+
i0.ɵɵtemplate(9, TdDynamicDatepickerComponent_ng_template_9_Template, 0, 0, "ng-template", 5);
|
|
369
|
+
i0.ɵɵelementEnd();
|
|
370
|
+
i0.ɵɵelement(10, "mat-datepicker-toggle", 6)(11, "mat-datepicker", null, 1);
|
|
371
|
+
i0.ɵɵelementEnd()();
|
|
372
|
+
} if (rf & 2) {
|
|
373
|
+
const dynamicDatePicker_r1 = i0.ɵɵreference(12);
|
|
374
|
+
i0.ɵɵadvance(3);
|
|
375
|
+
i0.ɵɵtextInterpolate(ctx.label);
|
|
376
|
+
i0.ɵɵadvance();
|
|
377
|
+
i0.ɵɵproperty("matDatepicker", dynamicDatePicker_r1)("formControl", ctx.control)("placeholder", ctx.placeholder)("required", ctx.required)("name", ctx.name)("min", ctx.min)("max", ctx.max);
|
|
378
|
+
i0.ɵɵadvance(3);
|
|
379
|
+
i0.ɵɵtextInterpolate(ctx.hint);
|
|
380
|
+
i0.ɵɵadvance(2);
|
|
381
|
+
i0.ɵɵproperty("ngTemplateOutlet", ctx.errorMessageTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction2(12, _c0$1, ctx.control, ctx.control.errors));
|
|
382
|
+
i0.ɵɵadvance();
|
|
383
|
+
i0.ɵɵproperty("for", dynamicDatePicker_r1);
|
|
384
|
+
} }, dependencies: [CommonModule, i1.NgTemplateOutlet, ReactiveFormsModule, i2.DefaultValueAccessor, i2.NgControlStatus, i2.RequiredValidator, i2.FormControlDirective, MatFormField, MatInput, MatLabel, MatError, MatHint, MatDatepickerModule, i3$1.MatDatepicker, i3$1.MatDatepickerInput, i3$1.MatDatepickerToggle], styles: [".td-dynamic-datepicker-wrapper[_ngcontent-%COMP%]{flex-direction:row;display:flex;box-sizing:border-box}.td-dynamic-datepicker-wrapper[_ngcontent-%COMP%] .td-dynamic-datepicker-field[_ngcontent-%COMP%]{flex:1;box-sizing:border-box}"] });
|
|
173
385
|
}
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
386
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdDynamicDatepickerComponent, [{
|
|
387
|
+
type: Component,
|
|
388
|
+
args: [{ selector: 'td-dynamic-datepicker', imports: [CommonModule, ReactiveFormsModule, MatFormField, MatInput, MatLabel, MatError, MatHint, MatDatepickerModule], template: "<div class=\"td-dynamic-datepicker-wrapper\">\n <mat-form-field class=\"td-dynamic-datepicker-field\">\n <mat-label>{{ label }}</mat-label>\n <input\n #elementInput\n matInput\n [matDatepicker]=\"dynamicDatePicker\"\n [formControl]=\"control\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n [name]=\"name\"\n [min]=\"min\"\n [max]=\"max\"\n />\n <mat-hint>{{ hint }}</mat-hint>\n <mat-error>\n <ng-template\n [ngTemplateOutlet]=\"errorMessageTemplate\"\n [ngTemplateOutletContext]=\"{\n control: control,\n errors: control.errors\n }\"\n ></ng-template>\n </mat-error>\n <mat-datepicker-toggle\n matSuffix\n [for]=\"dynamicDatePicker\"\n ></mat-datepicker-toggle>\n <mat-datepicker #dynamicDatePicker></mat-datepicker>\n </mat-form-field>\n</div>\n", styles: [".td-dynamic-datepicker-wrapper{flex-direction:row;display:flex;box-sizing:border-box}.td-dynamic-datepicker-wrapper .td-dynamic-datepicker-field{flex:1;box-sizing:border-box}\n"] }]
|
|
389
|
+
}], null, null); })();
|
|
390
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdDynamicDatepickerComponent, { className: "TdDynamicDatepickerComponent", filePath: "lib/dynamic-elements/dynamic-datepicker/dynamic-datepicker.component.ts", lineNumber: 14 }); })();
|
|
178
391
|
|
|
179
392
|
var TdDynamicType;
|
|
180
393
|
(function (TdDynamicType) {
|
|
@@ -289,12 +502,12 @@ class TdDynamicFormsService {
|
|
|
289
502
|
}
|
|
290
503
|
return validator;
|
|
291
504
|
}
|
|
292
|
-
static ɵfac =
|
|
293
|
-
static ɵprov = i0.ɵɵ
|
|
505
|
+
static ɵfac = function TdDynamicFormsService_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdDynamicFormsService)(); };
|
|
506
|
+
static ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: TdDynamicFormsService, factory: TdDynamicFormsService.ɵfac });
|
|
294
507
|
}
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
508
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdDynamicFormsService, [{
|
|
509
|
+
type: Injectable
|
|
510
|
+
}], null, null); })();
|
|
298
511
|
function DYNAMIC_FORMS_PROVIDER_FACTORY(parent) {
|
|
299
512
|
return parent || new TdDynamicFormsService();
|
|
300
513
|
}
|
|
@@ -320,29 +533,29 @@ class TdDynamicFormsErrorTemplateDirective extends CdkPortal {
|
|
|
320
533
|
super(templateRef, viewContainerRef);
|
|
321
534
|
this.templateRef = templateRef;
|
|
322
535
|
}
|
|
323
|
-
static ɵfac =
|
|
324
|
-
static ɵdir = i0.ɵɵ
|
|
536
|
+
static ɵfac = function TdDynamicFormsErrorTemplateDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdDynamicFormsErrorTemplateDirective)(i0.ɵɵdirectiveInject(i0.TemplateRef), i0.ɵɵdirectiveInject(i0.ViewContainerRef)); };
|
|
537
|
+
static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TdDynamicFormsErrorTemplateDirective, selectors: [["ng-template", "tdDynamicFormsError", ""]], inputs: { tdDynamicFormsError: "tdDynamicFormsError" }, features: [i0.ɵɵInheritDefinitionFeature] });
|
|
325
538
|
}
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
539
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdDynamicFormsErrorTemplateDirective, [{
|
|
540
|
+
type: Directive,
|
|
541
|
+
args: [{ selector: '[tdDynamicFormsError]ng-template' }]
|
|
542
|
+
}], () => [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }], { tdDynamicFormsError: [{
|
|
543
|
+
type: Input
|
|
544
|
+
}] }); })();
|
|
332
545
|
class TdDynamicElementDirective {
|
|
333
546
|
viewContainer;
|
|
334
547
|
constructor(viewContainer) {
|
|
335
548
|
this.viewContainer = viewContainer;
|
|
336
549
|
}
|
|
337
|
-
static ɵfac =
|
|
338
|
-
static ɵdir = i0.ɵɵ
|
|
550
|
+
static ɵfac = function TdDynamicElementDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdDynamicElementDirective)(i0.ɵɵdirectiveInject(i0.ViewContainerRef)); };
|
|
551
|
+
static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TdDynamicElementDirective, selectors: [["", "tdDynamicContainer", ""]] });
|
|
339
552
|
}
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
553
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdDynamicElementDirective, [{
|
|
554
|
+
type: Directive,
|
|
555
|
+
args: [{
|
|
556
|
+
selector: '[tdDynamicContainer]',
|
|
557
|
+
}]
|
|
558
|
+
}], () => [{ type: i0.ViewContainerRef }], null); })();
|
|
346
559
|
class TdDynamicElementComponent extends _TdDynamicElementMixinBase {
|
|
347
560
|
_injector;
|
|
348
561
|
_dynamicFormsService;
|
|
@@ -461,71 +674,102 @@ class TdDynamicElementComponent extends _TdDynamicElementMixinBase {
|
|
|
461
674
|
}
|
|
462
675
|
}
|
|
463
676
|
}
|
|
464
|
-
static ɵfac =
|
|
465
|
-
static ɵcmp = i0.ɵɵ
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
677
|
+
static ɵfac = function TdDynamicElementComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdDynamicElementComponent)(i0.ɵɵdirectiveInject(i0.Injector), i0.ɵɵdirectiveInject(TdDynamicFormsService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
|
|
678
|
+
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdDynamicElementComponent, selectors: [["td-dynamic-element"]], viewQuery: function TdDynamicElementComponent_Query(rf, ctx) { if (rf & 1) {
|
|
679
|
+
i0.ɵɵviewQuery(TdDynamicElementDirective, 7);
|
|
680
|
+
} if (rf & 2) {
|
|
681
|
+
let _t;
|
|
682
|
+
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.childElement = _t.first);
|
|
683
|
+
} }, hostVars: 2, hostBindings: function TdDynamicElementComponent_HostBindings(rf, ctx) { if (rf & 2) {
|
|
684
|
+
i0.ɵɵattribute("max", ctx.maxAttr)("min", ctx.minAttr);
|
|
685
|
+
} }, inputs: { dynamicControl: "dynamicControl", label: "label", hint: "hint", name: "name", type: "type", required: "required", min: "min", max: "max", minLength: "minLength", maxLength: "maxLength", selections: "selections", multiple: "multiple", customConfig: "customConfig", errorMessageTemplate: "errorMessageTemplate", placeholder: "placeholder" }, features: [i0.ɵɵProvidersFeature([
|
|
686
|
+
TdDynamicFormsService,
|
|
687
|
+
{
|
|
688
|
+
provide: NG_VALUE_ACCESSOR,
|
|
689
|
+
useExisting: TdDynamicElementComponent,
|
|
690
|
+
multi: true,
|
|
691
|
+
},
|
|
692
|
+
]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 1, vars: 0, consts: [["tdDynamicContainer", ""]], template: function TdDynamicElementComponent_Template(rf, ctx) { if (rf & 1) {
|
|
693
|
+
i0.ɵɵelement(0, "div", 0);
|
|
694
|
+
} }, dependencies: [TdDynamicElementDirective], encapsulation: 2 });
|
|
473
695
|
}
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
696
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdDynamicElementComponent, [{
|
|
697
|
+
type: Component,
|
|
698
|
+
args: [{
|
|
699
|
+
providers: [
|
|
700
|
+
TdDynamicFormsService,
|
|
701
|
+
{
|
|
702
|
+
provide: NG_VALUE_ACCESSOR,
|
|
703
|
+
useExisting: TdDynamicElementComponent,
|
|
704
|
+
multi: true,
|
|
705
|
+
},
|
|
706
|
+
],
|
|
707
|
+
selector: 'td-dynamic-element',
|
|
708
|
+
template: '<div tdDynamicContainer></div>',
|
|
709
|
+
imports: [TdDynamicElementDirective],
|
|
710
|
+
}]
|
|
711
|
+
}], () => [{ type: i0.Injector }, { type: TdDynamicFormsService }, { type: i0.ChangeDetectorRef }], { dynamicControl: [{
|
|
712
|
+
type: Input
|
|
713
|
+
}], label: [{
|
|
714
|
+
type: Input
|
|
715
|
+
}], hint: [{
|
|
716
|
+
type: Input
|
|
717
|
+
}], name: [{
|
|
718
|
+
type: Input
|
|
719
|
+
}], type: [{
|
|
720
|
+
type: Input
|
|
721
|
+
}], required: [{
|
|
722
|
+
type: Input
|
|
723
|
+
}], min: [{
|
|
724
|
+
type: Input
|
|
725
|
+
}], max: [{
|
|
726
|
+
type: Input
|
|
727
|
+
}], minLength: [{
|
|
728
|
+
type: Input
|
|
729
|
+
}], maxLength: [{
|
|
730
|
+
type: Input
|
|
731
|
+
}], selections: [{
|
|
732
|
+
type: Input
|
|
733
|
+
}], multiple: [{
|
|
734
|
+
type: Input
|
|
735
|
+
}], customConfig: [{
|
|
736
|
+
type: Input
|
|
737
|
+
}], errorMessageTemplate: [{
|
|
738
|
+
type: Input
|
|
739
|
+
}], placeholder: [{
|
|
740
|
+
type: Input
|
|
741
|
+
}], childElement: [{
|
|
742
|
+
type: ViewChild,
|
|
743
|
+
args: [TdDynamicElementDirective, { static: true }]
|
|
744
|
+
}], maxAttr: [{
|
|
745
|
+
type: HostBinding,
|
|
746
|
+
args: ['attr.max']
|
|
747
|
+
}], minAttr: [{
|
|
748
|
+
type: HostBinding,
|
|
749
|
+
args: ['attr.min']
|
|
750
|
+
}] }); })();
|
|
751
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdDynamicElementComponent, { className: "TdDynamicElementComponent", filePath: "lib/dynamic-element.component.ts", lineNumber: 69 }); })();
|
|
528
752
|
|
|
753
|
+
const _c0 = ["*"];
|
|
754
|
+
function TdDynamicFormsComponent_ng_template_2_td_dynamic_element_1_Template(rf, ctx) { if (rf & 1) {
|
|
755
|
+
i0.ɵɵelement(0, "td-dynamic-element", 6, 0);
|
|
756
|
+
} if (rf & 2) {
|
|
757
|
+
let tmp_11_0;
|
|
758
|
+
const element_r1 = i0.ɵɵnextContext().$implicit;
|
|
759
|
+
const ctx_r1 = i0.ɵɵnextContext();
|
|
760
|
+
i0.ɵɵproperty("formControlName", element_r1.name)("dynamicControl", ctx_r1.dynamicForm.controls[element_r1.name])("id", element_r1.name)("name", element_r1.name)("label", element_r1.label || element_r1.name)("hint", element_r1.hint)("type", element_r1.type)("required", (tmp_11_0 = element_r1.required) !== null && tmp_11_0 !== undefined ? tmp_11_0 : false)("min", element_r1.min)("max", element_r1.max)("minLength", element_r1.minLength)("maxLength", element_r1.maxLength)("selections", element_r1.selections)("multiple", element_r1.multiple)("customConfig", element_r1.customConfig)("errorMessageTemplate", ctx_r1.getErrorTemplateRef(element_r1.name))("placeholder", element_r1.placeholder);
|
|
761
|
+
} }
|
|
762
|
+
function TdDynamicFormsComponent_ng_template_2_Template(rf, ctx) { if (rf & 1) {
|
|
763
|
+
i0.ɵɵelementStart(0, "div", 4);
|
|
764
|
+
i0.ɵɵtemplate(1, TdDynamicFormsComponent_ng_template_2_td_dynamic_element_1_Template, 2, 17, "td-dynamic-element", 5);
|
|
765
|
+
i0.ɵɵelementEnd();
|
|
766
|
+
} if (rf & 2) {
|
|
767
|
+
const element_r1 = ctx.$implicit;
|
|
768
|
+
const ctx_r1 = i0.ɵɵnextContext();
|
|
769
|
+
i0.ɵɵstyleProp("max-width", element_r1.flex ? element_r1.flex : 100, "%")("flex", "1 1 " + (element_r1.flex ? element_r1.flex : 100) + "%")("-ms-flex", "1 1 " + (element_r1.flex ? element_r1.flex : 100) + "%")("-webkit-box-flex", 1);
|
|
770
|
+
i0.ɵɵadvance();
|
|
771
|
+
i0.ɵɵproperty("ngIf", ctx_r1.dynamicForm.controls[element_r1.name]);
|
|
772
|
+
} }
|
|
529
773
|
class TdDynamicFormsComponent {
|
|
530
774
|
_formBuilder;
|
|
531
775
|
_dynamicFormsService;
|
|
@@ -667,7 +911,7 @@ class TdDynamicFormsComponent {
|
|
|
667
911
|
this._renderedElements.push(Object.assign({}, elem));
|
|
668
912
|
});
|
|
669
913
|
// call a change detection since the whole form might change
|
|
670
|
-
this._changeDetectorRef.detectChanges();
|
|
914
|
+
//this._changeDetectorRef.detectChanges();
|
|
671
915
|
timer(0)
|
|
672
916
|
.toPromise()
|
|
673
917
|
.then(() => {
|
|
@@ -693,18 +937,35 @@ class TdDynamicFormsComponent {
|
|
|
693
937
|
this._changeDetectorRef.markForCheck();
|
|
694
938
|
});
|
|
695
939
|
}
|
|
696
|
-
static ɵfac =
|
|
697
|
-
static ɵcmp = i0.ɵɵ
|
|
940
|
+
static ɵfac = function TdDynamicFormsComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdDynamicFormsComponent)(i0.ɵɵdirectiveInject(i2.UntypedFormBuilder), i0.ɵɵdirectiveInject(TdDynamicFormsService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
|
|
941
|
+
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdDynamicFormsComponent, selectors: [["td-dynamic-forms"]], contentQueries: function TdDynamicFormsComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
|
|
942
|
+
i0.ɵɵcontentQuery(dirIndex, TdDynamicFormsErrorTemplateDirective, 5);
|
|
943
|
+
} if (rf & 2) {
|
|
944
|
+
let _t;
|
|
945
|
+
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx._errorTemplates = _t);
|
|
946
|
+
} }, inputs: { elements: "elements" }, ngContentSelectors: _c0, decls: 4, vars: 2, consts: [["dynamicElement", ""], ["novalidate", "", 3, "formGroup"], [1, "td-dynamic-form-wrapper"], ["ngFor", "", 3, "ngForOf"], [1, "td-dynamic-element-wrapper"], [3, "formControlName", "dynamicControl", "id", "name", "label", "hint", "type", "required", "min", "max", "minLength", "maxLength", "selections", "multiple", "customConfig", "errorMessageTemplate", "placeholder", 4, "ngIf"], [3, "formControlName", "dynamicControl", "id", "name", "label", "hint", "type", "required", "min", "max", "minLength", "maxLength", "selections", "multiple", "customConfig", "errorMessageTemplate", "placeholder"]], template: function TdDynamicFormsComponent_Template(rf, ctx) { if (rf & 1) {
|
|
947
|
+
i0.ɵɵprojectionDef();
|
|
948
|
+
i0.ɵɵelementStart(0, "form", 1)(1, "div", 2);
|
|
949
|
+
i0.ɵɵtemplate(2, TdDynamicFormsComponent_ng_template_2_Template, 2, 9, "ng-template", 3);
|
|
950
|
+
i0.ɵɵelementEnd();
|
|
951
|
+
i0.ɵɵprojection(3);
|
|
952
|
+
i0.ɵɵelementEnd();
|
|
953
|
+
} if (rf & 2) {
|
|
954
|
+
i0.ɵɵproperty("formGroup", ctx.dynamicForm);
|
|
955
|
+
i0.ɵɵadvance(2);
|
|
956
|
+
i0.ɵɵproperty("ngForOf", ctx.elements);
|
|
957
|
+
} }, dependencies: [CommonModule, i1.NgForOf, i1.NgIf, TdDynamicElementComponent, ReactiveFormsModule, i2.ɵNgNoValidate, i2.NgControlStatus, i2.NgControlStatusGroup, i2.RequiredValidator, i2.FormGroupDirective, i2.FormControlName], styles: [".td-dynamic-form-wrapper[_ngcontent-%COMP%]{flex-flow:row wrap;box-sizing:border-box;display:flex;align-items:center;align-content:center;max-width:100%;justify-content:flex-start}.td-dynamic-form-wrapper[_ngcontent-%COMP%] .mat-form-field-infix{width:auto}.td-dynamic-form-wrapper[_ngcontent-%COMP%] .td-dynamic-element-hint{font-size:75%;display:block}.td-dynamic-form-wrapper[_ngcontent-%COMP%] .td-dynamic-element-wrapper[_ngcontent-%COMP%]{max-height:100%;box-sizing:border-box;position:relative;padding:4px 4px 8px}"], changeDetection: 0 });
|
|
698
958
|
}
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
959
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdDynamicFormsComponent, [{
|
|
960
|
+
type: Component,
|
|
961
|
+
args: [{ selector: 'td-dynamic-forms', imports: [CommonModule, TdDynamicElementComponent, ReactiveFormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<form [formGroup]=\"dynamicForm\" novalidate>\n <div class=\"td-dynamic-form-wrapper\">\n <ng-template let-element ngFor [ngForOf]=\"elements\">\n <div\n class=\"td-dynamic-element-wrapper\"\n [style.max-width.%]=\"element.flex ? element.flex : 100\"\n [style.flex]=\"'1 1 ' + (element.flex ? element.flex : 100) + '%'\"\n [style.-ms-flex]=\"'1 1 ' + (element.flex ? element.flex : 100) + '%'\"\n [style.-webkit-box-flex]=\"1\"\n >\n <td-dynamic-element\n #dynamicElement\n *ngIf=\"dynamicForm.controls[element.name]\"\n [formControlName]=\"element.name\"\n [dynamicControl]=\"dynamicForm.controls[element.name]\"\n [id]=\"element.name\"\n [name]=\"element.name\"\n [label]=\"element.label || element.name\"\n [hint]=\"element.hint\"\n [type]=\"element.type\"\n [required]=\"element.required ?? false\"\n [min]=\"element.min\"\n [max]=\"element.max\"\n [minLength]=\"element.minLength\"\n [maxLength]=\"element.maxLength\"\n [selections]=\"element.selections\"\n [multiple]=\"element.multiple\"\n [customConfig]=\"element.customConfig\"\n [errorMessageTemplate]=\"getErrorTemplateRef(element.name)\"\n [placeholder]=\"element.placeholder\"\n ></td-dynamic-element>\n </div>\n </ng-template>\n </div>\n <ng-content></ng-content>\n</form>\n", styles: [".td-dynamic-form-wrapper{flex-flow:row wrap;box-sizing:border-box;display:flex;align-items:center;align-content:center;max-width:100%;justify-content:flex-start}.td-dynamic-form-wrapper ::ng-deep .mat-form-field-infix{width:auto}.td-dynamic-form-wrapper ::ng-deep .td-dynamic-element-hint{font-size:75%;display:block}.td-dynamic-form-wrapper .td-dynamic-element-wrapper{max-height:100%;box-sizing:border-box;position:relative;padding:4px 4px 8px}\n"] }]
|
|
962
|
+
}], () => [{ type: i2.UntypedFormBuilder }, { type: TdDynamicFormsService }, { type: i0.ChangeDetectorRef }], { _errorTemplates: [{
|
|
963
|
+
type: ContentChildren,
|
|
964
|
+
args: [TdDynamicFormsErrorTemplateDirective, { descendants: true }]
|
|
965
|
+
}], elements: [{
|
|
966
|
+
type: Input
|
|
967
|
+
}] }); })();
|
|
968
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdDynamicFormsComponent, { className: "TdDynamicFormsComponent", filePath: "lib/dynamic-forms.component.ts", lineNumber: 36 }); })();
|
|
708
969
|
|
|
709
970
|
const TD_DYNAMIC_FORMS = [
|
|
710
971
|
TdDynamicFormsComponent,
|
|
@@ -723,11 +984,9 @@ const TD_DYNAMIC_FORMS_ENTRY_COMPONENTS = [
|
|
|
723
984
|
TdDynamicDatepickerComponent,
|
|
724
985
|
];
|
|
725
986
|
class CovalentDynamicFormsModule {
|
|
726
|
-
static ɵfac =
|
|
727
|
-
static ɵmod = i0.ɵɵ
|
|
728
|
-
|
|
729
|
-
TdDynamicElementDirective,
|
|
730
|
-
TdDynamicFormsErrorTemplateDirective,
|
|
987
|
+
static ɵfac = function CovalentDynamicFormsModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CovalentDynamicFormsModule)(); };
|
|
988
|
+
static ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: CovalentDynamicFormsModule });
|
|
989
|
+
static ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ providers: [DYNAMIC_FORMS_PROVIDER], imports: [TdDynamicFormsComponent,
|
|
731
990
|
TdDynamicInputComponent,
|
|
732
991
|
TdDynamicFileInputComponent,
|
|
733
992
|
TdDynamicTextareaComponent,
|
|
@@ -735,76 +994,51 @@ class CovalentDynamicFormsModule {
|
|
|
735
994
|
TdDynamicCheckboxComponent,
|
|
736
995
|
TdDynamicSliderComponent,
|
|
737
996
|
TdDynamicSelectComponent,
|
|
738
|
-
TdDynamicDatepickerComponent], imports: [CommonModule,
|
|
739
|
-
ReactiveFormsModule,
|
|
740
|
-
MatFormFieldModule,
|
|
741
|
-
MatInputModule,
|
|
742
|
-
MatSelectModule,
|
|
743
|
-
MatCheckboxModule,
|
|
744
|
-
MatSliderModule,
|
|
745
|
-
MatSlideToggleModule,
|
|
746
|
-
MatIconModule,
|
|
747
|
-
MatButtonModule,
|
|
748
|
-
MatDatepickerModule,
|
|
749
|
-
CovalentFileModule], exports: [TdDynamicFormsComponent,
|
|
750
|
-
TdDynamicElementComponent,
|
|
751
|
-
TdDynamicElementDirective,
|
|
752
|
-
TdDynamicFormsErrorTemplateDirective, TdDynamicInputComponent,
|
|
753
|
-
TdDynamicFileInputComponent,
|
|
754
|
-
TdDynamicTextareaComponent,
|
|
755
|
-
TdDynamicSlideToggleComponent,
|
|
756
|
-
TdDynamicCheckboxComponent,
|
|
757
|
-
TdDynamicSliderComponent,
|
|
758
|
-
TdDynamicSelectComponent,
|
|
759
997
|
TdDynamicDatepickerComponent] });
|
|
760
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.11", ngImport: i0, type: CovalentDynamicFormsModule, providers: [DYNAMIC_FORMS_PROVIDER], imports: [CommonModule,
|
|
761
|
-
ReactiveFormsModule,
|
|
762
|
-
MatFormFieldModule,
|
|
763
|
-
MatInputModule,
|
|
764
|
-
MatSelectModule,
|
|
765
|
-
MatCheckboxModule,
|
|
766
|
-
MatSliderModule,
|
|
767
|
-
MatSlideToggleModule,
|
|
768
|
-
MatIconModule,
|
|
769
|
-
MatButtonModule,
|
|
770
|
-
MatDatepickerModule,
|
|
771
|
-
CovalentFileModule] });
|
|
772
998
|
}
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
778
|
-
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
|
|
789
|
-
|
|
790
|
-
|
|
791
|
-
|
|
792
|
-
|
|
793
|
-
|
|
794
|
-
|
|
795
|
-
|
|
796
|
-
|
|
797
|
-
|
|
798
|
-
|
|
799
|
-
|
|
800
|
-
|
|
801
|
-
|
|
802
|
-
|
|
803
|
-
|
|
804
|
-
|
|
805
|
-
|
|
806
|
-
|
|
807
|
-
|
|
999
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CovalentDynamicFormsModule, [{
|
|
1000
|
+
type: NgModule,
|
|
1001
|
+
args: [{
|
|
1002
|
+
imports: [
|
|
1003
|
+
TdDynamicFormsComponent,
|
|
1004
|
+
TdDynamicElementComponent,
|
|
1005
|
+
TdDynamicElementDirective,
|
|
1006
|
+
TdDynamicFormsErrorTemplateDirective,
|
|
1007
|
+
TdDynamicInputComponent,
|
|
1008
|
+
TdDynamicFileInputComponent,
|
|
1009
|
+
TdDynamicTextareaComponent,
|
|
1010
|
+
TdDynamicSlideToggleComponent,
|
|
1011
|
+
TdDynamicCheckboxComponent,
|
|
1012
|
+
TdDynamicSliderComponent,
|
|
1013
|
+
TdDynamicSelectComponent,
|
|
1014
|
+
TdDynamicDatepickerComponent,
|
|
1015
|
+
],
|
|
1016
|
+
exports: [...TD_DYNAMIC_FORMS, ...TD_DYNAMIC_FORMS_ENTRY_COMPONENTS],
|
|
1017
|
+
providers: [DYNAMIC_FORMS_PROVIDER],
|
|
1018
|
+
}]
|
|
1019
|
+
}], null, null); })();
|
|
1020
|
+
(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(CovalentDynamicFormsModule, { imports: [TdDynamicFormsComponent,
|
|
1021
|
+
TdDynamicElementComponent,
|
|
1022
|
+
TdDynamicElementDirective,
|
|
1023
|
+
TdDynamicFormsErrorTemplateDirective,
|
|
1024
|
+
TdDynamicInputComponent,
|
|
1025
|
+
TdDynamicFileInputComponent,
|
|
1026
|
+
TdDynamicTextareaComponent,
|
|
1027
|
+
TdDynamicSlideToggleComponent,
|
|
1028
|
+
TdDynamicCheckboxComponent,
|
|
1029
|
+
TdDynamicSliderComponent,
|
|
1030
|
+
TdDynamicSelectComponent,
|
|
1031
|
+
TdDynamicDatepickerComponent], exports: [TdDynamicFormsComponent,
|
|
1032
|
+
TdDynamicElementComponent,
|
|
1033
|
+
TdDynamicElementDirective,
|
|
1034
|
+
TdDynamicFormsErrorTemplateDirective, TdDynamicInputComponent,
|
|
1035
|
+
TdDynamicFileInputComponent,
|
|
1036
|
+
TdDynamicTextareaComponent,
|
|
1037
|
+
TdDynamicSlideToggleComponent,
|
|
1038
|
+
TdDynamicCheckboxComponent,
|
|
1039
|
+
TdDynamicSliderComponent,
|
|
1040
|
+
TdDynamicSelectComponent,
|
|
1041
|
+
TdDynamicDatepickerComponent] }); })();
|
|
808
1042
|
|
|
809
1043
|
/**
|
|
810
1044
|
* Generated bundle index. Do not edit.
|