@memberjunction/ng-base-forms 1.0.8 → 1.0.11
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/dist/lib/base-field-component.d.ts +60 -0
- package/dist/lib/base-field-component.d.ts.map +1 -0
- package/dist/lib/base-field-component.js +295 -0
- package/dist/lib/base-form-component.d.ts +2 -0
- package/dist/lib/base-form-component.d.ts.map +1 -1
- package/dist/lib/base-form-component.js +32 -0
- package/dist/lib/base-record-component.d.ts.map +1 -1
- package/dist/lib/base-record-component.js +3 -2
- package/dist/lib/form-toolbar.d.ts.map +1 -1
- package/dist/lib/form-toolbar.js +126 -64
- package/dist/module.d.ts +11 -6
- package/dist/module.d.ts.map +1 -1
- package/dist/module.js +28 -7
- package/dist/public-api.d.ts +1 -0
- package/dist/public-api.d.ts.map +1 -1
- package/dist/public-api.js +1 -0
- package/package.json +9 -5
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import { EventEmitter } from '@angular/core';
|
|
2
|
+
import { BaseEntity } from '@memberjunction/core';
|
|
3
|
+
import { BaseRecordComponent } from './base-record-component';
|
|
4
|
+
import * as i0 from "@angular/core";
|
|
5
|
+
/**
|
|
6
|
+
* This component is used to automatically generate a UI for any field in a given BaseEntity object. The CodeGen tool will generate forms and form sections that
|
|
7
|
+
* use this component. This component automatically determines the type of the field and generates the appropriate UI element for it. It is possible to use other
|
|
8
|
+
* elements to render a field as desired in a custom form, think of this component as a nice "base" component you can use for many cases, and you can create custom
|
|
9
|
+
* components for field rendering/editing when needed.
|
|
10
|
+
*/
|
|
11
|
+
export declare class MJFormField extends BaseRecordComponent {
|
|
12
|
+
/**
|
|
13
|
+
* The record object that contains the field to be rendered. This object should be an instance of BaseEntity or a derived class.
|
|
14
|
+
*/
|
|
15
|
+
record: BaseEntity;
|
|
16
|
+
/**
|
|
17
|
+
* EditMode must be bound to the containing form's edit mode/state. When the form is in edit mode, the field will be rendered as an editable control (if not a read only field), otherwise the field will be rendered read-only.
|
|
18
|
+
*/
|
|
19
|
+
EditMode: boolean;
|
|
20
|
+
/**
|
|
21
|
+
* The name of the field in the entity to be rendered.
|
|
22
|
+
*/
|
|
23
|
+
FieldName: string;
|
|
24
|
+
/**
|
|
25
|
+
* The type of control to be rendered for the field. The default is 'textbox'. Other possible values are 'textarea', 'numerictextbox', 'datepicker', 'checkbox', 'dropdownlist', 'combobox'.
|
|
26
|
+
*/
|
|
27
|
+
Type: 'textbox' | 'textarea' | 'numerictextbox' | 'datepicker' | 'checkbox' | 'dropdownlist' | 'combobox';
|
|
28
|
+
/**
|
|
29
|
+
* Optional, the type of link field that should be shown. Email and URL fields will be rendered as hyperlinks, Record fields will be rendered as links to the record. The default is 'None'. Record Fields are only
|
|
30
|
+
* valid when the FieldName field is a foreign key field to another entity.
|
|
31
|
+
*/
|
|
32
|
+
LinkType: 'Email' | 'URL' | 'Record' | 'None';
|
|
33
|
+
/**
|
|
34
|
+
* If set to false, the label for the field will not be shown. The default is true.
|
|
35
|
+
*/
|
|
36
|
+
ShowLabel: boolean;
|
|
37
|
+
private _displayName;
|
|
38
|
+
/**
|
|
39
|
+
* Display Name to show on the the control. By default, this is derived from the DisplayName in the entity field metadata, and can be overridden if desired by setting this property manually. Leave it empty to use the default.
|
|
40
|
+
*/
|
|
41
|
+
get DisplayName(): string;
|
|
42
|
+
set DisplayName(newValue: string);
|
|
43
|
+
private _possibleValues;
|
|
44
|
+
/**
|
|
45
|
+
* The possible values for the field. This is only used when the field is a dropdownlist or combobox. The possible values are derived from the EntityFieldValues in the entity field metadata.
|
|
46
|
+
* If the field is not a dropdownlist or combobox, this property is ignored. If you would like to specify a custom list of values, you can set this property manually.
|
|
47
|
+
*/
|
|
48
|
+
get PossibleValues(): string[];
|
|
49
|
+
set PossibleValues(newValue: string[]);
|
|
50
|
+
get Value(): any;
|
|
51
|
+
set Value(newValue: any);
|
|
52
|
+
ValueChange: EventEmitter<any>;
|
|
53
|
+
/**
|
|
54
|
+
* Returns true if the field is read only. This is determined by the ReadOnly property in the entity field metadata.
|
|
55
|
+
*/
|
|
56
|
+
get IsFieldReadOnly(): boolean;
|
|
57
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<MJFormField, never>;
|
|
58
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<MJFormField, "mj-form-field", never, { "record": { "alias": "record"; "required": false; }; "EditMode": { "alias": "EditMode"; "required": false; }; "FieldName": { "alias": "FieldName"; "required": false; }; "Type": { "alias": "Type"; "required": false; }; "LinkType": { "alias": "LinkType"; "required": false; }; "ShowLabel": { "alias": "ShowLabel"; "required": false; }; "DisplayName": { "alias": "DisplayName"; "required": false; }; "PossibleValues": { "alias": "PossibleValues"; "required": false; }; "Value": { "alias": "Value"; "required": false; }; }, { "ValueChange": "ValueChange"; }, never, never, false, never>;
|
|
59
|
+
}
|
|
60
|
+
//# sourceMappingURL=base-field-component.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"base-field-component.d.ts","sourceRoot":"","sources":["../../src/lib/base-field-component.ts"],"names":[],"mappings":"AAAA,OAAO,EAA4B,YAAY,EAAE,MAAM,eAAe,CAAC;AACvE,OAAO,EAAE,UAAU,EAAqB,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;;AAG9D;;;;;GAKG;AACH,qBAKa,WAAY,SAAQ,mBAAmB;IAChD;;OAEG;IACM,MAAM,EAAG,UAAU,CAAC;IAC7B;;OAEG;IACM,QAAQ,EAAE,OAAO,CAAS;IACnC;;OAEG;IACM,SAAS,EAAE,MAAM,CAAM;IAChC;;OAEG;IACM,IAAI,EAAE,SAAS,GAAG,UAAU,GAAG,gBAAgB,GAAG,YAAY,GAAG,UAAU,GAAG,cAAc,GAAG,UAAU,CAAa;IAC/H;;;OAGG;IACM,QAAQ,EAAE,OAAO,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,CAAU;IAEhE;;OAEG;IACM,SAAS,EAAE,OAAO,CAAQ;IAEnC,OAAO,CAAC,YAAY,CAAuB;IAC3C;;OAEG;IACH,IACW,WAAW,IAAI,MAAM,CAS/B;IAED,IAAW,WAAW,CAAC,QAAQ,EAAE,MAAM,EAEtC;IAED,OAAO,CAAC,eAAe,CAAyB;IAChD;;;OAGG;IACH,IAAa,cAAc,IAAI,MAAM,EAAE,CAStC;IAED,IAAI,cAAc,CAAC,QAAQ,EAAE,MAAM,EAAE,EAEpC;IAED,IACW,KAAK,IAAI,GAAG,CAWtB;IACD,IAAW,KAAK,CAAC,QAAQ,EAAE,GAAG,EAM7B;IACS,WAAW,oBAA2B;IAEhD;;OAEG;IACH,IAAW,eAAe,IAAI,OAAO,CAMpC;yCAnGQ,WAAW;2CAAX,WAAW;CAoGvB"}
|
|
@@ -0,0 +1,295 @@
|
|
|
1
|
+
import { Component, Input, Output, EventEmitter } from '@angular/core';
|
|
2
|
+
import { EntityFieldTSType } from '@memberjunction/core';
|
|
3
|
+
import { BaseRecordComponent } from './base-record-component';
|
|
4
|
+
import * as i0 from "@angular/core";
|
|
5
|
+
import * as i1 from "@angular/common";
|
|
6
|
+
import * as i2 from "@angular/forms";
|
|
7
|
+
import * as i3 from "@progress/kendo-angular-inputs";
|
|
8
|
+
import * as i4 from "@progress/kendo-angular-dateinputs";
|
|
9
|
+
import * as i5 from "@progress/kendo-angular-dropdowns";
|
|
10
|
+
import * as i6 from "@memberjunction/ng-link-directives";
|
|
11
|
+
function MJFormField_Conditional_0_div_0_label_1_Template(rf, ctx) { if (rf & 1) {
|
|
12
|
+
i0.ɵɵelementStart(0, "label");
|
|
13
|
+
i0.ɵɵtext(1);
|
|
14
|
+
i0.ɵɵelementEnd();
|
|
15
|
+
} if (rf & 2) {
|
|
16
|
+
const ctx_r3 = i0.ɵɵnextContext(3);
|
|
17
|
+
i0.ɵɵadvance();
|
|
18
|
+
i0.ɵɵtextInterpolate(ctx_r3.DisplayName);
|
|
19
|
+
} }
|
|
20
|
+
function MJFormField_Conditional_0_div_0_Case_2_Template(rf, ctx) { if (rf & 1) {
|
|
21
|
+
i0.ɵɵelementStart(0, "span");
|
|
22
|
+
i0.ɵɵtext(1);
|
|
23
|
+
i0.ɵɵelementEnd();
|
|
24
|
+
} if (rf & 2) {
|
|
25
|
+
const ctx_r4 = i0.ɵɵnextContext(3);
|
|
26
|
+
i0.ɵɵadvance();
|
|
27
|
+
i0.ɵɵtextInterpolate(ctx_r4.FormatValue(ctx_r4.FieldName, 0));
|
|
28
|
+
} }
|
|
29
|
+
function MJFormField_Conditional_0_div_0_Case_3_Template(rf, ctx) { if (rf & 1) {
|
|
30
|
+
i0.ɵɵelementStart(0, "span", 3);
|
|
31
|
+
i0.ɵɵtext(1);
|
|
32
|
+
i0.ɵɵelementEnd();
|
|
33
|
+
} if (rf & 2) {
|
|
34
|
+
const ctx_r5 = i0.ɵɵnextContext(3);
|
|
35
|
+
i0.ɵɵproperty("field", ctx_r5.record.GetFieldByName(ctx_r5.FieldName));
|
|
36
|
+
i0.ɵɵadvance();
|
|
37
|
+
i0.ɵɵtextInterpolate(ctx_r5.FormatValue(ctx_r5.FieldName, 0));
|
|
38
|
+
} }
|
|
39
|
+
function MJFormField_Conditional_0_div_0_Case_4_Template(rf, ctx) { if (rf & 1) {
|
|
40
|
+
i0.ɵɵelementStart(0, "span", 4);
|
|
41
|
+
i0.ɵɵtext(1);
|
|
42
|
+
i0.ɵɵelementEnd();
|
|
43
|
+
} if (rf & 2) {
|
|
44
|
+
const ctx_r6 = i0.ɵɵnextContext(3);
|
|
45
|
+
i0.ɵɵproperty("field", ctx_r6.record.GetFieldByName(ctx_r6.FieldName));
|
|
46
|
+
i0.ɵɵadvance();
|
|
47
|
+
i0.ɵɵtextInterpolate(ctx_r6.FormatValue(ctx_r6.FieldName, 0));
|
|
48
|
+
} }
|
|
49
|
+
function MJFormField_Conditional_0_div_0_Case_5_Template(rf, ctx) { if (rf & 1) {
|
|
50
|
+
i0.ɵɵelementStart(0, "span", 5);
|
|
51
|
+
i0.ɵɵtext(1);
|
|
52
|
+
i0.ɵɵelementEnd();
|
|
53
|
+
} if (rf & 2) {
|
|
54
|
+
const ctx_r7 = i0.ɵɵnextContext(3);
|
|
55
|
+
i0.ɵɵproperty("record", ctx_r7.record)("fieldName", ctx_r7.FieldName);
|
|
56
|
+
i0.ɵɵadvance();
|
|
57
|
+
i0.ɵɵtextInterpolate(ctx_r7.FormatValue(ctx_r7.FieldName, 0));
|
|
58
|
+
} }
|
|
59
|
+
function MJFormField_Conditional_0_div_0_Template(rf, ctx) { if (rf & 1) {
|
|
60
|
+
i0.ɵɵelementStart(0, "div", 1);
|
|
61
|
+
i0.ɵɵtemplate(1, MJFormField_Conditional_0_div_0_label_1_Template, 2, 1, "label", 2)(2, MJFormField_Conditional_0_div_0_Case_2_Template, 2, 1)(3, MJFormField_Conditional_0_div_0_Case_3_Template, 2, 2)(4, MJFormField_Conditional_0_div_0_Case_4_Template, 2, 2)(5, MJFormField_Conditional_0_div_0_Case_5_Template, 2, 3);
|
|
62
|
+
i0.ɵɵelementEnd();
|
|
63
|
+
} if (rf & 2) {
|
|
64
|
+
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
65
|
+
let MJFormField_Conditional_0_div_0_contFlowTmp;
|
|
66
|
+
i0.ɵɵadvance();
|
|
67
|
+
i0.ɵɵproperty("ngIf", ctx_r1.ShowLabel);
|
|
68
|
+
i0.ɵɵadvance();
|
|
69
|
+
i0.ɵɵconditional(2, (MJFormField_Conditional_0_div_0_contFlowTmp = ctx_r1.LinkType) === "None" ? 2 : MJFormField_Conditional_0_div_0_contFlowTmp === "Email" ? 3 : MJFormField_Conditional_0_div_0_contFlowTmp === "URL" ? 4 : MJFormField_Conditional_0_div_0_contFlowTmp === "Record" ? 5 : -1);
|
|
70
|
+
} }
|
|
71
|
+
function MJFormField_Conditional_0_div_1_label_1_Template(rf, ctx) { if (rf & 1) {
|
|
72
|
+
i0.ɵɵelementStart(0, "label");
|
|
73
|
+
i0.ɵɵtext(1);
|
|
74
|
+
i0.ɵɵelementEnd();
|
|
75
|
+
} if (rf & 2) {
|
|
76
|
+
const ctx_r8 = i0.ɵɵnextContext(3);
|
|
77
|
+
i0.ɵɵadvance();
|
|
78
|
+
i0.ɵɵtextInterpolate(ctx_r8.DisplayName);
|
|
79
|
+
} }
|
|
80
|
+
function MJFormField_Conditional_0_div_1_Case_2_Template(rf, ctx) { if (rf & 1) {
|
|
81
|
+
const _r17 = i0.ɵɵgetCurrentView();
|
|
82
|
+
i0.ɵɵelementStart(0, "kendo-textbox", 6);
|
|
83
|
+
i0.ɵɵtwoWayListener("ngModelChange", function MJFormField_Conditional_0_div_1_Case_2_Template_kendo_textbox_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r16 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r16.Value, $event) || (ctx_r16.Value = $event); return i0.ɵɵresetView($event); });
|
|
84
|
+
i0.ɵɵelementEnd();
|
|
85
|
+
} if (rf & 2) {
|
|
86
|
+
const ctx_r9 = i0.ɵɵnextContext(3);
|
|
87
|
+
i0.ɵɵtwoWayProperty("ngModel", ctx_r9.Value);
|
|
88
|
+
} }
|
|
89
|
+
function MJFormField_Conditional_0_div_1_Case_3_Template(rf, ctx) { if (rf & 1) {
|
|
90
|
+
const _r19 = i0.ɵɵgetCurrentView();
|
|
91
|
+
i0.ɵɵelementStart(0, "kendo-textarea", 6);
|
|
92
|
+
i0.ɵɵtwoWayListener("ngModelChange", function MJFormField_Conditional_0_div_1_Case_3_Template_kendo_textarea_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r19); const ctx_r18 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r18.Value, $event) || (ctx_r18.Value = $event); return i0.ɵɵresetView($event); });
|
|
93
|
+
i0.ɵɵelementEnd();
|
|
94
|
+
} if (rf & 2) {
|
|
95
|
+
const ctx_r10 = i0.ɵɵnextContext(3);
|
|
96
|
+
i0.ɵɵtwoWayProperty("ngModel", ctx_r10.Value);
|
|
97
|
+
} }
|
|
98
|
+
function MJFormField_Conditional_0_div_1_Case_4_Template(rf, ctx) { if (rf & 1) {
|
|
99
|
+
const _r21 = i0.ɵɵgetCurrentView();
|
|
100
|
+
i0.ɵɵelementStart(0, "kendo-numerictextbox", 7);
|
|
101
|
+
i0.ɵɵtwoWayListener("valueChange", function MJFormField_Conditional_0_div_1_Case_4_Template_kendo_numerictextbox_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r21); const ctx_r20 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r20.Value, $event) || (ctx_r20.Value = $event); return i0.ɵɵresetView($event); });
|
|
102
|
+
i0.ɵɵelementEnd();
|
|
103
|
+
} if (rf & 2) {
|
|
104
|
+
const ctx_r11 = i0.ɵɵnextContext(3);
|
|
105
|
+
i0.ɵɵtwoWayProperty("value", ctx_r11.Value);
|
|
106
|
+
} }
|
|
107
|
+
function MJFormField_Conditional_0_div_1_Case_5_Template(rf, ctx) { if (rf & 1) {
|
|
108
|
+
const _r23 = i0.ɵɵgetCurrentView();
|
|
109
|
+
i0.ɵɵelementStart(0, "kendo-datepicker", 7);
|
|
110
|
+
i0.ɵɵtwoWayListener("valueChange", function MJFormField_Conditional_0_div_1_Case_5_Template_kendo_datepicker_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r23); const ctx_r22 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r22.Value, $event) || (ctx_r22.Value = $event); return i0.ɵɵresetView($event); });
|
|
111
|
+
i0.ɵɵelementEnd();
|
|
112
|
+
} if (rf & 2) {
|
|
113
|
+
const ctx_r12 = i0.ɵɵnextContext(3);
|
|
114
|
+
i0.ɵɵtwoWayProperty("value", ctx_r12.Value);
|
|
115
|
+
} }
|
|
116
|
+
function MJFormField_Conditional_0_div_1_Case_6_Template(rf, ctx) { if (rf & 1) {
|
|
117
|
+
const _r25 = i0.ɵɵgetCurrentView();
|
|
118
|
+
i0.ɵɵelementStart(0, "input", 8);
|
|
119
|
+
i0.ɵɵtwoWayListener("ngModelChange", function MJFormField_Conditional_0_div_1_Case_6_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r25); const ctx_r24 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r24.Value, $event) || (ctx_r24.Value = $event); return i0.ɵɵresetView($event); });
|
|
120
|
+
i0.ɵɵelementEnd();
|
|
121
|
+
} if (rf & 2) {
|
|
122
|
+
const ctx_r13 = i0.ɵɵnextContext(3);
|
|
123
|
+
i0.ɵɵtwoWayProperty("ngModel", ctx_r13.Value);
|
|
124
|
+
} }
|
|
125
|
+
function MJFormField_Conditional_0_div_1_Case_7_Template(rf, ctx) { if (rf & 1) {
|
|
126
|
+
const _r27 = i0.ɵɵgetCurrentView();
|
|
127
|
+
i0.ɵɵelementStart(0, "kendo-dropdownlist", 9);
|
|
128
|
+
i0.ɵɵtwoWayListener("ngModelChange", function MJFormField_Conditional_0_div_1_Case_7_Template_kendo_dropdownlist_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r27); const ctx_r26 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r26.Value, $event) || (ctx_r26.Value = $event); return i0.ɵɵresetView($event); });
|
|
129
|
+
i0.ɵɵelementEnd();
|
|
130
|
+
} if (rf & 2) {
|
|
131
|
+
const ctx_r14 = i0.ɵɵnextContext(3);
|
|
132
|
+
i0.ɵɵproperty("data", ctx_r14.PossibleValues);
|
|
133
|
+
i0.ɵɵtwoWayProperty("ngModel", ctx_r14.Value);
|
|
134
|
+
} }
|
|
135
|
+
function MJFormField_Conditional_0_div_1_Case_8_Template(rf, ctx) { if (rf & 1) {
|
|
136
|
+
const _r29 = i0.ɵɵgetCurrentView();
|
|
137
|
+
i0.ɵɵelementStart(0, "kendo-combobox", 10);
|
|
138
|
+
i0.ɵɵtwoWayListener("ngModelChange", function MJFormField_Conditional_0_div_1_Case_8_Template_kendo_combobox_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r29); const ctx_r28 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r28.Value, $event) || (ctx_r28.Value = $event); return i0.ɵɵresetView($event); });
|
|
139
|
+
i0.ɵɵelementEnd();
|
|
140
|
+
} if (rf & 2) {
|
|
141
|
+
const ctx_r15 = i0.ɵɵnextContext(3);
|
|
142
|
+
i0.ɵɵproperty("data", ctx_r15.PossibleValues)("allowCustom", true);
|
|
143
|
+
i0.ɵɵtwoWayProperty("ngModel", ctx_r15.Value);
|
|
144
|
+
} }
|
|
145
|
+
function MJFormField_Conditional_0_div_1_Template(rf, ctx) { if (rf & 1) {
|
|
146
|
+
i0.ɵɵelementStart(0, "div", 1);
|
|
147
|
+
i0.ɵɵtemplate(1, MJFormField_Conditional_0_div_1_label_1_Template, 2, 1, "label", 2)(2, MJFormField_Conditional_0_div_1_Case_2_Template, 1, 1)(3, MJFormField_Conditional_0_div_1_Case_3_Template, 1, 1)(4, MJFormField_Conditional_0_div_1_Case_4_Template, 1, 1)(5, MJFormField_Conditional_0_div_1_Case_5_Template, 1, 1)(6, MJFormField_Conditional_0_div_1_Case_6_Template, 1, 1)(7, MJFormField_Conditional_0_div_1_Case_7_Template, 1, 2)(8, MJFormField_Conditional_0_div_1_Case_8_Template, 1, 3);
|
|
148
|
+
i0.ɵɵelementEnd();
|
|
149
|
+
} if (rf & 2) {
|
|
150
|
+
const ctx_r2 = i0.ɵɵnextContext(2);
|
|
151
|
+
let MJFormField_Conditional_0_div_1_contFlowTmp;
|
|
152
|
+
i0.ɵɵadvance();
|
|
153
|
+
i0.ɵɵproperty("ngIf", ctx_r2.ShowLabel);
|
|
154
|
+
i0.ɵɵadvance();
|
|
155
|
+
i0.ɵɵconditional(2, (MJFormField_Conditional_0_div_1_contFlowTmp = ctx_r2.Type) === "textbox" ? 2 : MJFormField_Conditional_0_div_1_contFlowTmp === "textarea" ? 3 : MJFormField_Conditional_0_div_1_contFlowTmp === "numerictextbox" ? 4 : MJFormField_Conditional_0_div_1_contFlowTmp === "datepicker" ? 5 : MJFormField_Conditional_0_div_1_contFlowTmp === "checkbox" ? 6 : MJFormField_Conditional_0_div_1_contFlowTmp === "dropdownlist" ? 7 : MJFormField_Conditional_0_div_1_contFlowTmp === "combobox" ? 8 : -1);
|
|
156
|
+
} }
|
|
157
|
+
function MJFormField_Conditional_0_Template(rf, ctx) { if (rf & 1) {
|
|
158
|
+
i0.ɵɵtemplate(0, MJFormField_Conditional_0_div_0_Template, 6, 2, "div", 0)(1, MJFormField_Conditional_0_div_1_Template, 9, 2, "div", 0);
|
|
159
|
+
} if (rf & 2) {
|
|
160
|
+
const ctx_r0 = i0.ɵɵnextContext();
|
|
161
|
+
i0.ɵɵproperty("ngIf", !ctx_r0.EditMode || ctx_r0.IsFieldReadOnly);
|
|
162
|
+
i0.ɵɵadvance();
|
|
163
|
+
i0.ɵɵproperty("ngIf", ctx_r0.EditMode && !ctx_r0.IsFieldReadOnly);
|
|
164
|
+
} }
|
|
165
|
+
/**
|
|
166
|
+
* This component is used to automatically generate a UI for any field in a given BaseEntity object. The CodeGen tool will generate forms and form sections that
|
|
167
|
+
* use this component. This component automatically determines the type of the field and generates the appropriate UI element for it. It is possible to use other
|
|
168
|
+
* elements to render a field as desired in a custom form, think of this component as a nice "base" component you can use for many cases, and you can create custom
|
|
169
|
+
* components for field rendering/editing when needed.
|
|
170
|
+
*/
|
|
171
|
+
export class MJFormField extends BaseRecordComponent {
|
|
172
|
+
constructor() {
|
|
173
|
+
super(...arguments);
|
|
174
|
+
/**
|
|
175
|
+
* EditMode must be bound to the containing form's edit mode/state. When the form is in edit mode, the field will be rendered as an editable control (if not a read only field), otherwise the field will be rendered read-only.
|
|
176
|
+
*/
|
|
177
|
+
this.EditMode = false;
|
|
178
|
+
/**
|
|
179
|
+
* The name of the field in the entity to be rendered.
|
|
180
|
+
*/
|
|
181
|
+
this.FieldName = '';
|
|
182
|
+
/**
|
|
183
|
+
* The type of control to be rendered for the field. The default is 'textbox'. Other possible values are 'textarea', 'numerictextbox', 'datepicker', 'checkbox', 'dropdownlist', 'combobox'.
|
|
184
|
+
*/
|
|
185
|
+
this.Type = 'textbox';
|
|
186
|
+
/**
|
|
187
|
+
* Optional, the type of link field that should be shown. Email and URL fields will be rendered as hyperlinks, Record fields will be rendered as links to the record. The default is 'None'. Record Fields are only
|
|
188
|
+
* valid when the FieldName field is a foreign key field to another entity.
|
|
189
|
+
*/
|
|
190
|
+
this.LinkType = 'None';
|
|
191
|
+
/**
|
|
192
|
+
* If set to false, the label for the field will not be shown. The default is true.
|
|
193
|
+
*/
|
|
194
|
+
this.ShowLabel = true;
|
|
195
|
+
this._displayName = null;
|
|
196
|
+
this._possibleValues = null;
|
|
197
|
+
this.ValueChange = new EventEmitter();
|
|
198
|
+
}
|
|
199
|
+
/**
|
|
200
|
+
* Display Name to show on the the control. By default, this is derived from the DisplayName in the entity field metadata, and can be overridden if desired by setting this property manually. Leave it empty to use the default.
|
|
201
|
+
*/
|
|
202
|
+
get DisplayName() {
|
|
203
|
+
var _a;
|
|
204
|
+
if (!this._displayName) {
|
|
205
|
+
const ef = (_a = this.record.Fields.find(f => f.Name == this.FieldName)) === null || _a === void 0 ? void 0 : _a.EntityFieldInfo;
|
|
206
|
+
if (ef)
|
|
207
|
+
this._displayName = ef.DisplayNameOrName;
|
|
208
|
+
else
|
|
209
|
+
this._displayName = this.FieldName;
|
|
210
|
+
}
|
|
211
|
+
return this._displayName;
|
|
212
|
+
}
|
|
213
|
+
// use the custom value
|
|
214
|
+
set DisplayName(newValue) {
|
|
215
|
+
this._displayName = newValue;
|
|
216
|
+
}
|
|
217
|
+
/**
|
|
218
|
+
* The possible values for the field. This is only used when the field is a dropdownlist or combobox. The possible values are derived from the EntityFieldValues in the entity field metadata.
|
|
219
|
+
* If the field is not a dropdownlist or combobox, this property is ignored. If you would like to specify a custom list of values, you can set this property manually.
|
|
220
|
+
*/
|
|
221
|
+
get PossibleValues() {
|
|
222
|
+
var _a;
|
|
223
|
+
if (!this._possibleValues) {
|
|
224
|
+
const ef = (_a = this.record.Fields.find(f => f.Name == this.FieldName)) === null || _a === void 0 ? void 0 : _a.EntityFieldInfo;
|
|
225
|
+
if (ef && ef.ValueListType !== 'None')
|
|
226
|
+
this._possibleValues = ef.EntityFieldValues.map(v => v.Value);
|
|
227
|
+
else
|
|
228
|
+
this._possibleValues = [];
|
|
229
|
+
}
|
|
230
|
+
return this._possibleValues;
|
|
231
|
+
}
|
|
232
|
+
// use the custom value if provided
|
|
233
|
+
set PossibleValues(newValue) {
|
|
234
|
+
this._possibleValues = newValue;
|
|
235
|
+
}
|
|
236
|
+
get Value() {
|
|
237
|
+
const v = this.record.Get(this.FieldName);
|
|
238
|
+
const f = this.record.Fields.find(f => f.Name == this.FieldName);
|
|
239
|
+
if (v === null || v === undefined) {
|
|
240
|
+
// check to see if this is a text type of field
|
|
241
|
+
if ((f === null || f === void 0 ? void 0 : f.EntityFieldInfo.TSType) === EntityFieldTSType.String)
|
|
242
|
+
return '';
|
|
243
|
+
}
|
|
244
|
+
// get here, return the value as it is
|
|
245
|
+
return v;
|
|
246
|
+
}
|
|
247
|
+
set Value(newValue) {
|
|
248
|
+
if (!this.IsFieldReadOnly) {
|
|
249
|
+
this.record.Set(this.FieldName, newValue);
|
|
250
|
+
this.ValueChange.emit(newValue);
|
|
251
|
+
}
|
|
252
|
+
// ignore this if it is read only
|
|
253
|
+
}
|
|
254
|
+
/**
|
|
255
|
+
* Returns true if the field is read only. This is determined by the ReadOnly property in the entity field metadata.
|
|
256
|
+
*/
|
|
257
|
+
get IsFieldReadOnly() {
|
|
258
|
+
const f = this.record.Fields.find(f => f.Name == this.FieldName);
|
|
259
|
+
if (f)
|
|
260
|
+
return f.ReadOnly;
|
|
261
|
+
else
|
|
262
|
+
throw new Error(`Field ${this.FieldName} not found in record ${this.record.EntityInfo.Name}`);
|
|
263
|
+
}
|
|
264
|
+
}
|
|
265
|
+
MJFormField.ɵfac = /*@__PURE__*/ (() => { let ɵMJFormField_BaseFactory; return function MJFormField_Factory(t) { return (ɵMJFormField_BaseFactory || (ɵMJFormField_BaseFactory = i0.ɵɵgetInheritedFactory(MJFormField)))(t || MJFormField); }; })();
|
|
266
|
+
MJFormField.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MJFormField, selectors: [["mj-form-field"]], inputs: { record: "record", EditMode: "EditMode", FieldName: "FieldName", Type: "Type", LinkType: "LinkType", ShowLabel: "ShowLabel", DisplayName: "DisplayName", PossibleValues: "PossibleValues", Value: "Value" }, outputs: { ValueChange: "ValueChange" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 1, consts: [["class", "record-form-row", 4, "ngIf"], [1, "record-form-row"], [4, "ngIf"], ["mjEmailLink", "", 3, "field"], ["mjWebLink", "", 3, "field"], ["mjFieldLink", "", 3, "record", "fieldName"], [3, "ngModel", "ngModelChange"], [3, "value", "valueChange"], ["type", "checkbox", "kendoCheckBox", "", 3, "ngModel", "ngModelChange"], [3, "data", "ngModel", "ngModelChange"], [3, "data", "allowCustom", "ngModel", "ngModelChange"]], template: function MJFormField_Template(rf, ctx) { if (rf & 1) {
|
|
267
|
+
i0.ɵɵtemplate(0, MJFormField_Conditional_0_Template, 2, 2);
|
|
268
|
+
} if (rf & 2) {
|
|
269
|
+
i0.ɵɵconditional(0, ctx.record.IsSaved || !ctx.IsFieldReadOnly ? 0 : -1);
|
|
270
|
+
} }, dependencies: [i1.NgIf, i2.CheckboxControlValueAccessor, i2.NgControlStatus, i2.NgModel, i3.TextAreaComponent, i3.TextBoxComponent, i3.NumericTextBoxComponent, i3.CheckBoxDirective, i4.DatePickerComponent, i5.ComboBoxComponent, i5.DropDownListComponent, i6.EmailLink, i6.FieldLink, i6.WebLink], styles: [".record-form-row[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: auto 1fr;\n align-items: start;\n gap: 10px;\n margin-bottom: 12px;\n padding-top: 5px;\n padding-bottom: 5px;\n} \n \n \n.record-form-row[_ngcontent-%COMP%] label[_ngcontent-%COMP%] {\n font-weight: bold;\n padding-right: 10px;\n width: 240px;\n margin-bottom: 0;\n}\n\n\n\n@media (min-width: 768px) {\n .record-form-row[_ngcontent-%COMP%] {\n flex-direction: row;\n align-items: center;\n }\n \n .record-form-row[_ngcontent-%COMP%] label[_ngcontent-%COMP%] {\n width: 240px;\n margin-bottom: 0;\n }\n }"] });
|
|
271
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MJFormField, [{
|
|
272
|
+
type: Component,
|
|
273
|
+
args: [{ selector: 'mj-form-field', template: "<!-- \n Using a blend of *ngIf and the new @switch control flow because of a bug in early Angular 17 where \n the @if wrapping the @switch didn't fully remove elements when swtiching back and forth. In the future if Angular fixes the bug\n we can get rid of the *ngIf outer div blocks and instead use @if and contain the @switch within the same div block.\n-->\n@if (record.IsSaved || !IsFieldReadOnly) {\n <!-- We only render a field if the record is either saved, or the field is editable. Meaning, for NEW records, we only show editable fields -->\n <div class=\"record-form-row\" *ngIf=\"!EditMode || IsFieldReadOnly\">\n <label *ngIf=\"ShowLabel\">{{DisplayName}}</label>\n @switch (LinkType) {\n @case ('None') {\n <span>{{FormatValue(FieldName, 0)}}</span>\n }\n @case ('Email') {\n <span mjEmailLink [field]=\"record.GetFieldByName(FieldName)\" >{{FormatValue(FieldName, 0)}}</span>\n }\n @case ('URL') {\n <span mjWebLink [field]=\"record.GetFieldByName(FieldName)\" >{{FormatValue(FieldName, 0)}}</span>\n }\n @case ('Record') {\n <span mjFieldLink [record]=\"record\" [fieldName]=\"FieldName\" >{{FormatValue(FieldName, 0)}}</span>\n }\n }\n </div> \n <div class=\"record-form-row\" *ngIf=\"EditMode && !IsFieldReadOnly\">\n <label *ngIf=\"ShowLabel\">{{DisplayName}}</label>\n @switch (Type) {\n @case ('textbox') {\n <kendo-textbox [(ngModel)]=\"Value\" /> \n }\n @case ('textarea') {\n <kendo-textarea [(ngModel)]=\"Value\" ></kendo-textarea>\n }\n @case ('numerictextbox') {\n <kendo-numerictextbox [(value)]=\"Value\" /> \n }\n @case ('datepicker') {\n <kendo-datepicker [(value)]=\"Value\"></kendo-datepicker>\n }\n @case ('checkbox') {\n <input type=\"checkbox\" [(ngModel)]=\"Value\" kendoCheckBox /> \n }\n @case ('dropdownlist') {\n <kendo-dropdownlist [data]=\"PossibleValues\" [(ngModel)]=\"Value\"></kendo-dropdownlist> \n }\n @case ('combobox') {\n <kendo-combobox [data]=\"PossibleValues\" [allowCustom]=\"true\" [(ngModel)]=\"Value\"></kendo-combobox>\n }\n }\n </div> \n}", styles: [".record-form-row {\n display: grid;\n grid-template-columns: auto 1fr;\n align-items: start;\n gap: 10px;\n margin-bottom: 12px;\n padding-top: 5px;\n padding-bottom: 5px;\n} \n \n \n.record-form-row label {\n font-weight: bold;\n padding-right: 10px;\n width: 240px;\n margin-bottom: 0;\n}\n\n\n\n@media (min-width: 768px) {\n .record-form-row {\n flex-direction: row;\n align-items: center;\n }\n \n .record-form-row label {\n width: 240px;\n margin-bottom: 0;\n }\n }\n "] }]
|
|
274
|
+
}], null, { record: [{
|
|
275
|
+
type: Input
|
|
276
|
+
}], EditMode: [{
|
|
277
|
+
type: Input
|
|
278
|
+
}], FieldName: [{
|
|
279
|
+
type: Input
|
|
280
|
+
}], Type: [{
|
|
281
|
+
type: Input
|
|
282
|
+
}], LinkType: [{
|
|
283
|
+
type: Input
|
|
284
|
+
}], ShowLabel: [{
|
|
285
|
+
type: Input
|
|
286
|
+
}], DisplayName: [{
|
|
287
|
+
type: Input
|
|
288
|
+
}], PossibleValues: [{
|
|
289
|
+
type: Input
|
|
290
|
+
}], Value: [{
|
|
291
|
+
type: Input
|
|
292
|
+
}], ValueChange: [{
|
|
293
|
+
type: Output
|
|
294
|
+
}] }); })();
|
|
295
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJFormField, { className: "MJFormField", filePath: "src/lib/base-field-component.ts", lineNumber: 17 }); })();
|
|
@@ -28,6 +28,7 @@ export declare abstract class BaseFormComponent extends BaseRecordComponent impl
|
|
|
28
28
|
private splitterLayoutChangeSubject;
|
|
29
29
|
private _pendingRecords;
|
|
30
30
|
private _updatingBrowserUrl;
|
|
31
|
+
private __debug;
|
|
31
32
|
constructor(elementRef: ElementRef, sharedService: SharedService, router: Router, route: ActivatedRoute);
|
|
32
33
|
tabComponent: MJTabStripComponent;
|
|
33
34
|
ngOnInit(): Promise<void>;
|
|
@@ -44,6 +45,7 @@ export declare abstract class BaseFormComponent extends BaseRecordComponent impl
|
|
|
44
45
|
onTabSelect(tabIndex: any): void;
|
|
45
46
|
StartEditMode(): void;
|
|
46
47
|
handleHistoryDialog(): void;
|
|
48
|
+
ShowChanges(): void;
|
|
47
49
|
RemoveFavorite(): Promise<void>;
|
|
48
50
|
MakeFavorite(): Promise<void>;
|
|
49
51
|
SetFavoriteStatus(isFavorite: boolean): Promise<void>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"base-form-component.d.ts","sourceRoot":"","sources":["../../src/lib/base-form-component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,EAAE,SAAS,EAA2B,SAAS,EAAE,UAAU,EAAa,MAAM,eAAe,CAAC;AAG5H,OAAO,EAAE,UAAU,EAAE,gBAAgB,EAAE,UAAU,EAAE,oBAAoB,EAC9D,sBAAsB,EAAY,aAAa,EAAY,MAAM,sBAAsB,CAAC;AACjG,OAAO,EAAE,qBAAqB,EAAE,MAAM,mCAAmC,CAAC;AAC1E,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC1D,OAAO,EAAE,cAAc,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzD,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;;AAElE,8BACsB,iBAAkB,SAAQ,mBAAoB,YAAW,aAAa,EAAE,MAAM,EAAE,SAAS;
|
|
1
|
+
{"version":3,"file":"base-form-component.d.ts","sourceRoot":"","sources":["../../src/lib/base-form-component.ts"],"names":[],"mappings":"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"}
|
|
@@ -41,6 +41,7 @@ export class BaseFormComponent extends BaseRecordComponent {
|
|
|
41
41
|
this.splitterLayoutChangeSubject = new Subject();
|
|
42
42
|
this._pendingRecords = [];
|
|
43
43
|
this._updatingBrowserUrl = false;
|
|
44
|
+
this.__debug = false;
|
|
44
45
|
this.resizeSub = null;
|
|
45
46
|
this._isFavorite = false;
|
|
46
47
|
this._tabIndexes = [];
|
|
@@ -53,6 +54,26 @@ export class BaseFormComponent extends BaseRecordComponent {
|
|
|
53
54
|
const md = new Metadata();
|
|
54
55
|
this._isFavorite = yield md.GetRecordFavoriteStatus(md.CurrentUser.ID, this.record.EntityInfo.Name, this.record.PrimaryKeys.map(pk => { return { FieldName: pk.Name, Value: pk.Value }; }));
|
|
55
56
|
this.FavoriteInitDone = true;
|
|
57
|
+
// DEBUG ONLY output to console our full record info for debugging
|
|
58
|
+
if (this.__debug) {
|
|
59
|
+
const start = new Date().getTime();
|
|
60
|
+
console.log('Full Record Info: ' + this.record.EntityInfo.Name + ' ' + this.record.PrimaryKey.Value);
|
|
61
|
+
const dataObject = yield this.record.GetDataObject({
|
|
62
|
+
includeRelatedEntityData: true,
|
|
63
|
+
oldValues: false,
|
|
64
|
+
omitEmptyStrings: false,
|
|
65
|
+
omitNullValues: false,
|
|
66
|
+
excludeFields: [],
|
|
67
|
+
relatedEntityList: this.record.EntityInfo.RelatedEntities.map(x => {
|
|
68
|
+
return {
|
|
69
|
+
relatedEntityName: x.RelatedEntity
|
|
70
|
+
};
|
|
71
|
+
})
|
|
72
|
+
});
|
|
73
|
+
const end = new Date().getTime();
|
|
74
|
+
console.log(dataObject);
|
|
75
|
+
console.log('Time to get full record info: ' + (end - start) + 'ms');
|
|
76
|
+
}
|
|
56
77
|
}
|
|
57
78
|
});
|
|
58
79
|
}
|
|
@@ -128,6 +149,17 @@ export class BaseFormComponent extends BaseRecordComponent {
|
|
|
128
149
|
handleHistoryDialog() {
|
|
129
150
|
this.isHistoryDialogOpen = !this.isHistoryDialogOpen;
|
|
130
151
|
}
|
|
152
|
+
ShowChanges() {
|
|
153
|
+
if (this.record) {
|
|
154
|
+
const changes = this.record.GetAll(false, true);
|
|
155
|
+
const oldValues = this.record.GetAll(true, true);
|
|
156
|
+
console.log('Changes for: ' + this.record.EntityInfo.Name + ' ' + this.record.PrimaryKey.Value);
|
|
157
|
+
console.log(changes);
|
|
158
|
+
console.log('Old Values');
|
|
159
|
+
console.log(oldValues);
|
|
160
|
+
alert('Changes for: ' + this.record.EntityInfo.Name + ' ' + this.record.PrimaryKey.Value + '\n\n' + JSON.stringify(changes, null, 2) + '\n\nOld Values\n\n' + JSON.stringify(oldValues, null, 2));
|
|
161
|
+
}
|
|
162
|
+
}
|
|
131
163
|
RemoveFavorite() {
|
|
132
164
|
return __awaiter(this, void 0, void 0, function* () {
|
|
133
165
|
return this.SetFavoriteStatus(false);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"base-record-component.d.ts","sourceRoot":"","sources":["../../src/lib/base-record-component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAEnE,8BAAsB,mBAAmB;IACrC,SAAgB,MAAM,EAAE,UAAU,CAAA;IAE3B,WAAW,CAAC,eAAe,EAAE,eAAe,EAAE,KAAK,EAAE,GAAG,EAAE,QAAQ,GAAE,MAAU,EAAE,QAAQ,GAAE,MAAc;IAIxG,WAAW,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,GAAE,MAAU,EAAE,QAAQ,GAAE,MAAc;
|
|
1
|
+
{"version":3,"file":"base-record-component.d.ts","sourceRoot":"","sources":["../../src/lib/base-record-component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAEnE,8BAAsB,mBAAmB;IACrC,SAAgB,MAAM,EAAE,UAAU,CAAA;IAE3B,WAAW,CAAC,eAAe,EAAE,eAAe,EAAE,KAAK,EAAE,GAAG,EAAE,QAAQ,GAAE,MAAU,EAAE,QAAQ,GAAE,MAAc;IAIxG,WAAW,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,GAAE,MAAU,EAAE,QAAQ,GAAE,MAAc;CAavF"}
|
|
@@ -6,8 +6,9 @@ export class BaseRecordComponent {
|
|
|
6
6
|
if (!this.record)
|
|
7
7
|
throw new Error('this.record not set');
|
|
8
8
|
const r = this.record;
|
|
9
|
-
const
|
|
10
|
-
|
|
9
|
+
const fName = fieldName.trim().toLowerCase();
|
|
10
|
+
const f = r.Fields.find(f => f.Name.trim().toLowerCase() === fName ||
|
|
11
|
+
f.CodeName.trim().toLowerCase() === fName);
|
|
11
12
|
if (!f)
|
|
12
13
|
throw new Error(`Field ${fieldName} not found in entity ${r.EntityInfo.Name}`);
|
|
13
14
|
return f.FormatValue(decimals, currency);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"form-toolbar.d.ts","sourceRoot":"","sources":["../../src/lib/form-toolbar.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;;AAG1D,
|
|
1
|
+
{"version":3,"file":"form-toolbar.d.ts","sourceRoot":"","sources":["../../src/lib/form-toolbar.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;;AAG1D,qBAyDa,oBAAoB;IACpB,IAAI,EAAG,iBAAiB,CAAC;IAE3B,UAAU,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI;yCAHjC,oBAAoB;2CAApB,oBAAoB;CAWhC"}
|
package/dist/lib/form-toolbar.js
CHANGED
|
@@ -1,58 +1,90 @@
|
|
|
1
1
|
import { Component, Input } from '@angular/core';
|
|
2
2
|
import * as i0 from "@angular/core";
|
|
3
|
-
import * as i1 from "@
|
|
4
|
-
import * as i2 from "@
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
const _r8 = i0.ɵɵgetCurrentView();
|
|
3
|
+
import * as i1 from "@memberjunction/ng-record-changes";
|
|
4
|
+
import * as i2 from "@progress/kendo-angular-buttons";
|
|
5
|
+
function FormToolbarComponent_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
|
|
6
|
+
const _r7 = i0.ɵɵgetCurrentView();
|
|
8
7
|
i0.ɵɵelementStart(0, "button", 4);
|
|
9
|
-
i0.ɵɵlistener("click", function
|
|
10
|
-
i0.ɵɵ
|
|
11
|
-
i0.ɵɵ
|
|
8
|
+
i0.ɵɵlistener("click", function FormToolbarComponent_Conditional_1_Conditional_0_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r7); const ctx_r6 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r6.form.StartEditMode()); });
|
|
9
|
+
i0.ɵɵelement(1, "span", 5);
|
|
10
|
+
i0.ɵɵelementStart(2, "span", 6);
|
|
11
|
+
i0.ɵɵtext(3, "Edit");
|
|
12
|
+
i0.ɵɵelementEnd()();
|
|
12
13
|
} }
|
|
13
|
-
function
|
|
14
|
-
const
|
|
15
|
-
i0.ɵɵelementStart(0, "button",
|
|
16
|
-
i0.ɵɵlistener("
|
|
17
|
-
i0.ɵɵ
|
|
14
|
+
function FormToolbarComponent_Conditional_1_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
|
|
15
|
+
const _r11 = i0.ɵɵgetCurrentView();
|
|
16
|
+
i0.ɵɵelementStart(0, "button", 8);
|
|
17
|
+
i0.ɵɵlistener("click", function FormToolbarComponent_Conditional_1_Conditional_1_Conditional_0_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r11); const ctx_r10 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r10.form.RemoveFavorite()); });
|
|
18
|
+
i0.ɵɵelement(1, "span", 9);
|
|
18
19
|
i0.ɵɵelementEnd();
|
|
19
20
|
} }
|
|
20
|
-
function
|
|
21
|
-
const
|
|
22
|
-
i0.ɵɵelementStart(0, "button",
|
|
23
|
-
i0.ɵɵlistener("click", function
|
|
24
|
-
i0.ɵɵ
|
|
21
|
+
function FormToolbarComponent_Conditional_1_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
|
|
22
|
+
const _r13 = i0.ɵɵgetCurrentView();
|
|
23
|
+
i0.ɵɵelementStart(0, "button", 10);
|
|
24
|
+
i0.ɵɵlistener("click", function FormToolbarComponent_Conditional_1_Conditional_1_Conditional_1_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r13); const ctx_r12 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r12.form.MakeFavorite()); });
|
|
25
|
+
i0.ɵɵelement(1, "span", 11);
|
|
25
26
|
i0.ɵɵelementEnd();
|
|
26
27
|
} }
|
|
27
|
-
function
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
i0.ɵɵ
|
|
32
|
-
i0.ɵɵelementEnd();
|
|
28
|
+
function FormToolbarComponent_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
|
|
29
|
+
i0.ɵɵtemplate(0, FormToolbarComponent_Conditional_1_Conditional_1_Conditional_0_Template, 2, 0, "button", 7)(1, FormToolbarComponent_Conditional_1_Conditional_1_Conditional_1_Template, 2, 0);
|
|
30
|
+
} if (rf & 2) {
|
|
31
|
+
const ctx_r5 = i0.ɵɵnextContext(2);
|
|
32
|
+
i0.ɵɵconditional(0, ctx_r5.form.IsFavorite ? 0 : 1);
|
|
33
33
|
} }
|
|
34
|
-
function
|
|
34
|
+
function FormToolbarComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
|
|
35
|
+
i0.ɵɵtemplate(0, FormToolbarComponent_Conditional_1_Conditional_0_Template, 4, 0, "button", 3)(1, FormToolbarComponent_Conditional_1_Conditional_1_Template, 2, 1);
|
|
36
|
+
} if (rf & 2) {
|
|
37
|
+
const ctx_r0 = i0.ɵɵnextContext();
|
|
38
|
+
i0.ɵɵconditional(0, ctx_r0.form.UserCanEdit ? 0 : -1);
|
|
39
|
+
i0.ɵɵadvance();
|
|
40
|
+
i0.ɵɵconditional(1, ctx_r0.form.FavoriteInitDone ? 1 : -1);
|
|
41
|
+
} }
|
|
42
|
+
function FormToolbarComponent_Conditional_2_Conditional_8_Template(rf, ctx) { if (rf & 1) {
|
|
35
43
|
const _r16 = i0.ɵɵgetCurrentView();
|
|
36
|
-
i0.ɵɵelementStart(0, "button",
|
|
37
|
-
i0.ɵɵlistener("click", function
|
|
38
|
-
i0.ɵɵ
|
|
39
|
-
i0.ɵɵ
|
|
44
|
+
i0.ɵɵelementStart(0, "button", 17);
|
|
45
|
+
i0.ɵɵlistener("click", function FormToolbarComponent_Conditional_2_Conditional_8_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r16); const ctx_r15 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r15.form.ShowChanges()); });
|
|
46
|
+
i0.ɵɵelement(1, "span", 18);
|
|
47
|
+
i0.ɵɵelementStart(2, "span", 6);
|
|
48
|
+
i0.ɵɵtext(3, "Changes");
|
|
49
|
+
i0.ɵɵelementEnd()();
|
|
40
50
|
} }
|
|
41
|
-
function
|
|
51
|
+
function FormToolbarComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
|
|
42
52
|
const _r18 = i0.ɵɵgetCurrentView();
|
|
43
|
-
i0.ɵɵelementStart(0, "button",
|
|
44
|
-
i0.ɵɵlistener("
|
|
45
|
-
i0.ɵɵ
|
|
46
|
-
i0.ɵɵ
|
|
53
|
+
i0.ɵɵelementStart(0, "button", 12);
|
|
54
|
+
i0.ɵɵlistener("mouseup", function FormToolbarComponent_Conditional_2_Template_button_mouseup_0_listener($event) { i0.ɵɵrestoreView(_r18); const ctx_r17 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r17.saveRecord($event)); });
|
|
55
|
+
i0.ɵɵelement(1, "span", 13);
|
|
56
|
+
i0.ɵɵelementStart(2, "span", 6);
|
|
57
|
+
i0.ɵɵtext(3, "Save");
|
|
58
|
+
i0.ɵɵelementEnd()();
|
|
59
|
+
i0.ɵɵelementStart(4, "button", 14);
|
|
60
|
+
i0.ɵɵlistener("click", function FormToolbarComponent_Conditional_2_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r18); const ctx_r19 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r19.form.CancelEdit()); });
|
|
61
|
+
i0.ɵɵelement(5, "span", 15);
|
|
62
|
+
i0.ɵɵelementStart(6, "span", 6);
|
|
63
|
+
i0.ɵɵtext(7, "Cancel");
|
|
64
|
+
i0.ɵɵelementEnd()();
|
|
65
|
+
i0.ɵɵtemplate(8, FormToolbarComponent_Conditional_2_Conditional_8_Template, 4, 0, "button", 16);
|
|
66
|
+
} if (rf & 2) {
|
|
67
|
+
const ctx_r1 = i0.ɵɵnextContext();
|
|
68
|
+
i0.ɵɵadvance(8);
|
|
69
|
+
i0.ɵɵconditional(8, ctx_r1.form.record.Dirty ? 8 : -1);
|
|
47
70
|
} }
|
|
48
|
-
function
|
|
49
|
-
const
|
|
50
|
-
i0.ɵɵelementStart(0, "
|
|
51
|
-
i0.ɵɵlistener("
|
|
71
|
+
function FormToolbarComponent_Conditional_3_Template(rf, ctx) { if (rf & 1) {
|
|
72
|
+
const _r21 = i0.ɵɵgetCurrentView();
|
|
73
|
+
i0.ɵɵelementStart(0, "button", 19);
|
|
74
|
+
i0.ɵɵlistener("click", function FormToolbarComponent_Conditional_3_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r21); const ctx_r20 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r20.form.handleHistoryDialog()); });
|
|
75
|
+
i0.ɵɵelement(1, "span", 20);
|
|
76
|
+
i0.ɵɵelementStart(2, "span", 6);
|
|
77
|
+
i0.ɵɵtext(3, "History");
|
|
78
|
+
i0.ɵɵelementEnd()();
|
|
79
|
+
} }
|
|
80
|
+
function FormToolbarComponent_Conditional_4_Template(rf, ctx) { if (rf & 1) {
|
|
81
|
+
const _r23 = i0.ɵɵgetCurrentView();
|
|
82
|
+
i0.ɵɵelementStart(0, "mj-record-changes", 21);
|
|
83
|
+
i0.ɵɵlistener("dialogClosed", function FormToolbarComponent_Conditional_4_Template_mj_record_changes_dialogClosed_0_listener() { i0.ɵɵrestoreView(_r23); const ctx_r22 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r22.form.handleHistoryDialog()); });
|
|
52
84
|
i0.ɵɵelementEnd();
|
|
53
85
|
} if (rf & 2) {
|
|
54
|
-
const
|
|
55
|
-
i0.ɵɵproperty("record",
|
|
86
|
+
const ctx_r3 = i0.ɵɵnextContext();
|
|
87
|
+
i0.ɵɵproperty("record", ctx_r3.form.record);
|
|
56
88
|
} }
|
|
57
89
|
export class FormToolbarComponent {
|
|
58
90
|
saveRecord(event) {
|
|
@@ -64,40 +96,70 @@ export class FormToolbarComponent {
|
|
|
64
96
|
}
|
|
65
97
|
}
|
|
66
98
|
FormToolbarComponent.ɵfac = function FormToolbarComponent_Factory(t) { return new (t || FormToolbarComponent)(); };
|
|
67
|
-
FormToolbarComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: FormToolbarComponent, selectors: [["mj-form-toolbar"]], inputs: { form: "form" }, decls:
|
|
99
|
+
FormToolbarComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: FormToolbarComponent, selectors: [["mj-form-toolbar"]], inputs: { form: "form" }, decls: 5, vars: 3, consts: [[1, "toolbar-container"], ["kendoButton", "", "title", "Show History"], [3, "record"], ["kendoButton", "", "title", "Edit Record"], ["kendoButton", "", "title", "Edit Record", 3, "click"], [1, "fa-solid", "fa-pen-to-square"], [1, "button-text"], ["kendoButton", "", "title", "Remove Favorite"], ["kendoButton", "", "title", "Remove Favorite", 3, "click"], [1, "fa-solid", "fa-star"], ["kendoButton", "", "title", "Make Favorite", 3, "click"], [1, "fa-regular", "fa-star"], ["kendoButton", "", "title", "Save Record", 3, "mouseup"], [1, "fa-solid", "fa-floppy-disk"], ["kendoButton", "", "title", "Cancel Edit", 3, "click"], [1, "fa-solid", "fa-rotate-left"], ["kendoButton", "", "title", "Fields you have changed"], ["kendoButton", "", "title", "Fields you have changed", 3, "click"], [1, "fa-solid", "fa-clipboard-list"], ["kendoButton", "", "title", "Show History", 3, "click"], [1, "fa-solid", "fa-business-time"], [3, "record", "dialogClosed"]], template: function FormToolbarComponent_Template(rf, ctx) { if (rf & 1) {
|
|
68
100
|
i0.ɵɵelementStart(0, "div", 0);
|
|
69
|
-
i0.ɵɵtemplate(1,
|
|
101
|
+
i0.ɵɵtemplate(1, FormToolbarComponent_Conditional_1_Template, 2, 2)(2, FormToolbarComponent_Conditional_2_Template, 9, 1)(3, FormToolbarComponent_Conditional_3_Template, 4, 0, "button", 1)(4, FormToolbarComponent_Conditional_4_Template, 1, 1, "mj-record-changes", 2);
|
|
70
102
|
i0.ɵɵelementEnd();
|
|
71
103
|
} if (rf & 2) {
|
|
72
104
|
i0.ɵɵadvance();
|
|
73
|
-
i0.ɵɵ
|
|
74
|
-
i0.ɵɵadvance();
|
|
75
|
-
i0.ɵɵ
|
|
76
|
-
i0.ɵɵadvance();
|
|
77
|
-
i0.ɵɵproperty("ngIf", ctx.form.EditMode);
|
|
78
|
-
i0.ɵɵadvance();
|
|
79
|
-
i0.ɵɵproperty("ngIf", ctx.form.FavoriteInitDone && ctx.form.IsFavorite);
|
|
80
|
-
i0.ɵɵadvance();
|
|
81
|
-
i0.ɵɵproperty("ngIf", ctx.form.FavoriteInitDone && !ctx.form.IsFavorite);
|
|
82
|
-
i0.ɵɵadvance();
|
|
83
|
-
i0.ɵɵproperty("ngIf", ctx.form.EntityInfo == null ? null : ctx.form.EntityInfo.TrackRecordChanges);
|
|
105
|
+
i0.ɵɵconditional(1, !ctx.form.EditMode ? 1 : 2);
|
|
106
|
+
i0.ɵɵadvance(2);
|
|
107
|
+
i0.ɵɵconditional(3, (ctx.form.EntityInfo == null ? null : ctx.form.EntityInfo.TrackRecordChanges) ? 3 : -1);
|
|
84
108
|
i0.ɵɵadvance();
|
|
85
|
-
i0.ɵɵ
|
|
86
|
-
} }, dependencies: [i1.
|
|
109
|
+
i0.ɵɵconditional(4, ctx.form.isHistoryDialogOpen ? 4 : -1);
|
|
110
|
+
} }, dependencies: [i1.RecordChangesComponent, i2.ButtonComponent], styles: ["button[_ngcontent-%COMP%] { margin-right: 10px; }", ".button-text[_ngcontent-%COMP%] { margin-left: 7px; }", ".toolbar-container[_ngcontent-%COMP%] { border-bottom: solid 1px lightgray; padding-bottom: 10px; margin-bottom: 5px; }"] });
|
|
87
111
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FormToolbarComponent, [{
|
|
88
112
|
type: Component,
|
|
89
113
|
args: [{ selector: 'mj-form-toolbar', template: `
|
|
90
114
|
<div class="toolbar-container">
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
115
|
+
@if (!form.EditMode) {
|
|
116
|
+
@if (form.UserCanEdit) {
|
|
117
|
+
<button kendoButton (click)="form.StartEditMode()" title="Edit Record">
|
|
118
|
+
<span class="fa-solid fa-pen-to-square"></span>
|
|
119
|
+
<span class="button-text">Edit</span>
|
|
120
|
+
</button>
|
|
121
|
+
}
|
|
122
|
+
@if (form.FavoriteInitDone) {
|
|
123
|
+
@if (form.IsFavorite) {
|
|
124
|
+
<button kendoButton (click)="form.RemoveFavorite()" title="Remove Favorite">
|
|
125
|
+
<span class="fa-solid fa-star"></span>
|
|
126
|
+
</button>
|
|
127
|
+
}
|
|
128
|
+
@else {
|
|
129
|
+
<button kendoButton (click)="form.MakeFavorite()" title="Make Favorite">
|
|
130
|
+
<span class="fa-regular fa-star"></span>
|
|
131
|
+
</button>
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
}
|
|
135
|
+
@else {
|
|
136
|
+
<button kendoButton (mouseup)="saveRecord($event)" title="Save Record">
|
|
137
|
+
<span class="fa-solid fa-floppy-disk"></span>
|
|
138
|
+
<span class="button-text">Save</span>
|
|
139
|
+
</button>
|
|
140
|
+
<button kendoButton (click)="form.CancelEdit()" title="Cancel Edit">
|
|
141
|
+
<span class="fa-solid fa-rotate-left"></span>
|
|
142
|
+
<span class="button-text">Cancel</span>
|
|
143
|
+
</button>
|
|
144
|
+
@if (form.record.Dirty) {
|
|
145
|
+
<button kendoButton (click)="form.ShowChanges()" title="Fields you have changed">
|
|
146
|
+
<span class="fa-solid fa-clipboard-list"></span>
|
|
147
|
+
<span class="button-text">Changes</span>
|
|
148
|
+
</button>
|
|
149
|
+
}
|
|
150
|
+
}
|
|
151
|
+
@if (form.EntityInfo?.TrackRecordChanges) {
|
|
152
|
+
<button kendoButton (click)="form.handleHistoryDialog()" title="Show History">
|
|
153
|
+
<span class="fa-solid fa-business-time"></span>
|
|
154
|
+
<span class="button-text">History</span>
|
|
155
|
+
</button>
|
|
156
|
+
}
|
|
157
|
+
@if (form.isHistoryDialogOpen) {
|
|
158
|
+
<mj-record-changes [record]="form.record" (dialogClosed)="form.handleHistoryDialog()"></mj-record-changes>
|
|
159
|
+
}
|
|
98
160
|
</div>
|
|
99
|
-
`, styles: ["button { margin-right: 10px; }", ".toolbar-container { border-bottom: solid 1px lightgray; padding-bottom: 10px; margin-bottom: 5px; }"] }]
|
|
161
|
+
`, styles: ["button { margin-right: 10px; }", ".button-text { margin-left: 7px; }", ".toolbar-container { border-bottom: solid 1px lightgray; padding-bottom: 10px; margin-bottom: 5px; }"] }]
|
|
100
162
|
}], null, { form: [{
|
|
101
163
|
type: Input
|
|
102
164
|
}] }); })();
|
|
103
|
-
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FormToolbarComponent, { className: "FormToolbarComponent", filePath: "src/lib/form-toolbar.ts", lineNumber:
|
|
165
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FormToolbarComponent, { className: "FormToolbarComponent", filePath: "src/lib/form-toolbar.ts", lineNumber: 62 }); })();
|
package/dist/module.d.ts
CHANGED
|
@@ -1,14 +1,19 @@
|
|
|
1
1
|
import * as i0 from "@angular/core";
|
|
2
2
|
import * as i1 from "./lib/section-loader-component";
|
|
3
3
|
import * as i2 from "./lib/form-toolbar";
|
|
4
|
-
import * as i3 from "
|
|
5
|
-
import * as i4 from "@angular/
|
|
6
|
-
import * as i5 from "@
|
|
7
|
-
import * as i6 from "@memberjunction/ng-
|
|
8
|
-
import * as i7 from "@
|
|
4
|
+
import * as i3 from "./lib/base-field-component";
|
|
5
|
+
import * as i4 from "@angular/common";
|
|
6
|
+
import * as i5 from "@angular/forms";
|
|
7
|
+
import * as i6 from "@memberjunction/ng-tabstrip";
|
|
8
|
+
import * as i7 from "@memberjunction/ng-record-changes";
|
|
9
|
+
import * as i8 from "@progress/kendo-angular-buttons";
|
|
10
|
+
import * as i9 from "@progress/kendo-angular-inputs";
|
|
11
|
+
import * as i10 from "@progress/kendo-angular-dateinputs";
|
|
12
|
+
import * as i11 from "@progress/kendo-angular-dropdowns";
|
|
13
|
+
import * as i12 from "@memberjunction/ng-link-directives";
|
|
9
14
|
export declare class BaseFormsModule {
|
|
10
15
|
static ɵfac: i0.ɵɵFactoryDeclaration<BaseFormsModule, never>;
|
|
11
|
-
static ɵmod: i0.ɵɵNgModuleDeclaration<BaseFormsModule, [typeof i1.SectionLoaderComponent, typeof i2.FormToolbarComponent], [typeof
|
|
16
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<BaseFormsModule, [typeof i1.SectionLoaderComponent, typeof i2.FormToolbarComponent, typeof i3.MJFormField], [typeof i4.CommonModule, typeof i5.FormsModule, typeof i6.MJTabStripModule, typeof i7.RecordChangesModule, typeof i8.ButtonsModule, typeof i9.InputsModule, typeof i10.DateInputsModule, typeof i11.DropDownsModule, typeof i12.LinkDirectivesModule], [typeof i1.SectionLoaderComponent, typeof i2.FormToolbarComponent, typeof i3.MJFormField]>;
|
|
12
17
|
static ɵinj: i0.ɵɵInjectorDeclaration<BaseFormsModule>;
|
|
13
18
|
}
|
|
14
19
|
//# sourceMappingURL=module.d.ts.map
|
package/dist/module.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../src/module.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../src/module.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAmBA,qBAuBa,eAAe;yCAAf,eAAe;0CAAf,eAAe;0CAAf,eAAe;CAAI"}
|
package/dist/module.js
CHANGED
|
@@ -3,10 +3,15 @@ import { CommonModule } from '@angular/common';
|
|
|
3
3
|
import { FormsModule } from '@angular/forms';
|
|
4
4
|
// Kendo UI Angular imports
|
|
5
5
|
import { ButtonsModule } from '@progress/kendo-angular-buttons';
|
|
6
|
+
import { DropDownsModule } from '@progress/kendo-angular-dropdowns';
|
|
7
|
+
import { InputsModule } from '@progress/kendo-angular-inputs';
|
|
8
|
+
import { DateInputsModule } from '@progress/kendo-angular-dateinputs';
|
|
6
9
|
import { RecordChangesModule } from '@memberjunction/ng-record-changes';
|
|
7
10
|
import { MJTabStripModule } from '@memberjunction/ng-tabstrip';
|
|
8
11
|
import { SectionLoaderComponent } from './lib/section-loader-component';
|
|
9
12
|
import { FormToolbarComponent } from './lib/form-toolbar';
|
|
13
|
+
import { MJFormField } from './lib/base-field-component';
|
|
14
|
+
import { LinkDirectivesModule } from '@memberjunction/ng-link-directives';
|
|
10
15
|
import * as i0 from "@angular/core";
|
|
11
16
|
export class BaseFormsModule {
|
|
12
17
|
}
|
|
@@ -16,31 +21,47 @@ BaseFormsModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [CommonMo
|
|
|
16
21
|
FormsModule,
|
|
17
22
|
MJTabStripModule,
|
|
18
23
|
RecordChangesModule,
|
|
19
|
-
ButtonsModule
|
|
24
|
+
ButtonsModule,
|
|
25
|
+
InputsModule,
|
|
26
|
+
DateInputsModule,
|
|
27
|
+
DropDownsModule,
|
|
28
|
+
LinkDirectivesModule] });
|
|
20
29
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(BaseFormsModule, [{
|
|
21
30
|
type: NgModule,
|
|
22
31
|
args: [{
|
|
23
32
|
declarations: [
|
|
24
33
|
SectionLoaderComponent,
|
|
25
|
-
FormToolbarComponent
|
|
34
|
+
FormToolbarComponent,
|
|
35
|
+
MJFormField
|
|
26
36
|
],
|
|
27
37
|
imports: [
|
|
28
38
|
CommonModule,
|
|
29
39
|
FormsModule,
|
|
30
40
|
MJTabStripModule,
|
|
31
41
|
RecordChangesModule,
|
|
32
|
-
ButtonsModule
|
|
42
|
+
ButtonsModule,
|
|
43
|
+
InputsModule,
|
|
44
|
+
DateInputsModule,
|
|
45
|
+
DropDownsModule,
|
|
46
|
+
LinkDirectivesModule
|
|
33
47
|
],
|
|
34
48
|
exports: [
|
|
35
49
|
SectionLoaderComponent,
|
|
36
|
-
FormToolbarComponent
|
|
50
|
+
FormToolbarComponent,
|
|
51
|
+
MJFormField
|
|
37
52
|
]
|
|
38
53
|
}]
|
|
39
54
|
}], null, null); })();
|
|
40
55
|
(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(BaseFormsModule, { declarations: [SectionLoaderComponent,
|
|
41
|
-
FormToolbarComponent
|
|
56
|
+
FormToolbarComponent,
|
|
57
|
+
MJFormField], imports: [CommonModule,
|
|
42
58
|
FormsModule,
|
|
43
59
|
MJTabStripModule,
|
|
44
60
|
RecordChangesModule,
|
|
45
|
-
ButtonsModule
|
|
46
|
-
|
|
61
|
+
ButtonsModule,
|
|
62
|
+
InputsModule,
|
|
63
|
+
DateInputsModule,
|
|
64
|
+
DropDownsModule,
|
|
65
|
+
LinkDirectivesModule], exports: [SectionLoaderComponent,
|
|
66
|
+
FormToolbarComponent,
|
|
67
|
+
MJFormField] }); })();
|
package/dist/public-api.d.ts
CHANGED
|
@@ -2,6 +2,7 @@ export * from './module';
|
|
|
2
2
|
export * from './lib/base-record-component';
|
|
3
3
|
export * from './lib/base-form-section-component';
|
|
4
4
|
export * from './lib/base-form-component';
|
|
5
|
+
export * from './lib/base-field-component';
|
|
5
6
|
export * from './lib/section-loader-component';
|
|
6
7
|
export * from './lib/form-toolbar';
|
|
7
8
|
//# sourceMappingURL=public-api.d.ts.map
|
package/dist/public-api.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"public-api.d.ts","sourceRoot":"","sources":["../src/public-api.ts"],"names":[],"mappings":"AAIA,cAAc,UAAU,CAAC;AACzB,cAAc,6BAA6B,CAAC;AAC5C,cAAc,mCAAmC,CAAC;AAClD,cAAc,2BAA2B,CAAC;AAC1C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,oBAAoB,CAAC"}
|
|
1
|
+
{"version":3,"file":"public-api.d.ts","sourceRoot":"","sources":["../src/public-api.ts"],"names":[],"mappings":"AAIA,cAAc,UAAU,CAAC;AACzB,cAAc,6BAA6B,CAAC;AAC5C,cAAc,mCAAmC,CAAC;AAClD,cAAc,2BAA2B,CAAC;AAC1C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,oBAAoB,CAAC"}
|
package/dist/public-api.js
CHANGED
|
@@ -5,5 +5,6 @@ export * from './module';
|
|
|
5
5
|
export * from './lib/base-record-component';
|
|
6
6
|
export * from './lib/base-form-section-component';
|
|
7
7
|
export * from './lib/base-form-component';
|
|
8
|
+
export * from './lib/base-field-component';
|
|
8
9
|
export * from './lib/section-loader-component';
|
|
9
10
|
export * from './lib/form-toolbar';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@memberjunction/ng-base-forms",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.11",
|
|
4
4
|
"description": "MemberJunction: Angular Base Form Components",
|
|
5
5
|
"main": "./dist/public-api.js",
|
|
6
6
|
"typings": "./dist/public-api.d.ts",
|
|
@@ -25,11 +25,15 @@
|
|
|
25
25
|
"@angular/router": "~17.2.2"
|
|
26
26
|
},
|
|
27
27
|
"dependencies": {
|
|
28
|
-
"@memberjunction/global": "^1.0.
|
|
29
|
-
"@memberjunction/core": "^1.0.
|
|
30
|
-
"@memberjunction/ng-record-changes": "^1.0.
|
|
31
|
-
"@memberjunction/ng-tabstrip": "^1.0.
|
|
28
|
+
"@memberjunction/global": "^1.0.11",
|
|
29
|
+
"@memberjunction/core": "^1.0.11",
|
|
30
|
+
"@memberjunction/ng-record-changes": "^1.0.11",
|
|
31
|
+
"@memberjunction/ng-tabstrip": "^1.0.11",
|
|
32
|
+
"@memberjunction/ng-link-directives": "^1.0.11",
|
|
32
33
|
"@progress/kendo-angular-buttons": "~15.1.0",
|
|
34
|
+
"@progress/kendo-angular-dropdowns": "~15.1.0",
|
|
35
|
+
"@progress/kendo-angular-inputs": "~15.1.0",
|
|
36
|
+
"@progress/kendo-angular-dateinputs": "~15.1.0",
|
|
33
37
|
"tslib": "^2.3.0"
|
|
34
38
|
},
|
|
35
39
|
"sideEffects": false
|