@unicef-polymer/etools-form-builder 2.1.0 → 2.1.2

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.
Files changed (87) hide show
  1. package/LICENSE +674 -674
  2. package/README.md +1 -1
  3. package/dist/assets/translations.d.ts +6 -0
  4. package/dist/assets/translations.js +67 -0
  5. package/dist/form-attachments-popup/form-attachments-popup.d.ts +86 -85
  6. package/dist/form-attachments-popup/form-attachments-popup.helper.d.ts +8 -8
  7. package/dist/form-attachments-popup/form-attachments-popup.helper.js +14 -14
  8. package/dist/form-attachments-popup/form-attachments-popup.js +255 -248
  9. package/dist/form-attachments-popup/form-attachments-popup.tpl.d.ts +3 -3
  10. package/dist/form-attachments-popup/form-attachments-popup.tpl.js +91 -89
  11. package/dist/form-attachments-popup/index.d.ts +2 -2
  12. package/dist/form-attachments-popup/index.js +2 -2
  13. package/dist/form-fields/abstract-field-base.class.d.ts +33 -28
  14. package/dist/form-fields/abstract-field-base.class.js +194 -176
  15. package/dist/form-fields/field-renderer-component.d.ts +20 -20
  16. package/dist/form-fields/field-renderer-component.js +249 -249
  17. package/dist/form-fields/index.d.ts +12 -12
  18. package/dist/form-fields/index.js +12 -12
  19. package/dist/form-fields/repeatable-fields/repeatable-attachment-field.d.ts +17 -17
  20. package/dist/form-fields/repeatable-fields/repeatable-attachment-field.js +209 -208
  21. package/dist/form-fields/repeatable-fields/repeatable-base-field.d.ts +20 -20
  22. package/dist/form-fields/repeatable-fields/repeatable-base-field.js +124 -123
  23. package/dist/form-fields/repeatable-fields/repeatable-number-field.d.ts +10 -10
  24. package/dist/form-fields/repeatable-fields/repeatable-number-field.js +67 -66
  25. package/dist/form-fields/repeatable-fields/repeatable-scale-field.d.ts +15 -15
  26. package/dist/form-fields/repeatable-fields/repeatable-scale-field.js +108 -108
  27. package/dist/form-fields/repeatable-fields/repeatable-text-field.d.ts +8 -8
  28. package/dist/form-fields/repeatable-fields/repeatable-text-field.js +53 -53
  29. package/dist/form-fields/single-fields/attachment-field.d.ts +16 -16
  30. package/dist/form-fields/single-fields/attachment-field.js +98 -97
  31. package/dist/form-fields/single-fields/base-field.d.ts +11 -11
  32. package/dist/form-fields/single-fields/base-field.js +58 -57
  33. package/dist/form-fields/single-fields/boolean-field.d.ts +8 -8
  34. package/dist/form-fields/single-fields/boolean-field.js +49 -49
  35. package/dist/form-fields/single-fields/number-field.d.ts +10 -10
  36. package/dist/form-fields/single-fields/number-field.js +67 -66
  37. package/dist/form-fields/single-fields/scale-field.d.ts +18 -18
  38. package/dist/form-fields/single-fields/scale-field.js +108 -107
  39. package/dist/form-fields/single-fields/text-field.d.ts +8 -8
  40. package/dist/form-fields/single-fields/text-field.js +54 -54
  41. package/dist/form-groups/form-abstract-group.d.ts +65 -60
  42. package/dist/form-groups/form-abstract-group.js +375 -353
  43. package/dist/form-groups/form-card.d.ts +32 -32
  44. package/dist/form-groups/form-card.js +113 -108
  45. package/dist/form-groups/form-collapsed-card.d.ts +70 -70
  46. package/dist/form-groups/form-collapsed-card.js +254 -253
  47. package/dist/form-groups/index.d.ts +3 -3
  48. package/dist/form-groups/index.js +3 -3
  49. package/dist/index.d.ts +3 -3
  50. package/dist/index.js +3 -3
  51. package/dist/lib/additional-components/confirmation-dialog.d.ts +18 -16
  52. package/dist/lib/additional-components/confirmation-dialog.js +72 -65
  53. package/dist/lib/additional-components/etools-fb-card.d.ts +21 -16
  54. package/dist/lib/additional-components/etools-fb-card.js +238 -215
  55. package/dist/lib/styles/attachments.styles.d.ts +2 -2
  56. package/dist/lib/styles/attachments.styles.js +72 -72
  57. package/dist/lib/styles/card-styles.d.ts +2 -2
  58. package/dist/lib/styles/card-styles.js +154 -154
  59. package/dist/lib/styles/dialog.styles.d.ts +2 -2
  60. package/dist/lib/styles/dialog.styles.js +85 -85
  61. package/dist/lib/styles/elevation-styles.d.ts +9 -9
  62. package/dist/lib/styles/elevation-styles.js +43 -43
  63. package/dist/lib/styles/flex-layout-classes.d.ts +2 -2
  64. package/dist/lib/styles/flex-layout-classes.js +319 -319
  65. package/dist/lib/styles/form-builder-card.styles.d.ts +2 -2
  66. package/dist/lib/styles/form-builder-card.styles.js +49 -49
  67. package/dist/lib/styles/input-styles.d.ts +2 -2
  68. package/dist/lib/styles/input-styles.js +138 -138
  69. package/dist/lib/styles/page-layout-styles.d.ts +2 -2
  70. package/dist/lib/styles/page-layout-styles.js +201 -201
  71. package/dist/lib/styles/shared-styles.d.ts +2 -2
  72. package/dist/lib/styles/shared-styles.js +70 -70
  73. package/dist/lib/types/form-builder.interfaces.d.ts +83 -83
  74. package/dist/lib/types/form-builder.interfaces.js +0 -0
  75. package/dist/lib/types/form-builder.types.d.ts +59 -59
  76. package/dist/lib/types/form-builder.types.js +0 -0
  77. package/dist/lib/types/global.types.d.ts +4 -4
  78. package/dist/lib/types/global.types.js +0 -0
  79. package/dist/lib/utils/dialog.d.ts +10 -10
  80. package/dist/lib/utils/dialog.js +21 -21
  81. package/dist/lib/utils/fire-custom-event.d.ts +1 -1
  82. package/dist/lib/utils/fire-custom-event.js +7 -7
  83. package/dist/lib/utils/translate.d.ts +1 -0
  84. package/dist/lib/utils/translate.js +9 -0
  85. package/dist/lib/utils/validations.helper.d.ts +26 -26
  86. package/dist/lib/utils/validations.helper.js +42 -35
  87. package/package.json +56 -56
@@ -1,20 +1,20 @@
1
- import { CSSResultArray, LitElement, TemplateResult } from 'lit-element';
2
- import { BlueprintField } from '../lib/types/form-builder.types';
3
- import { FieldValidator } from '../lib/utils/validations.helper';
4
- import { FieldOption } from './single-fields/scale-field';
5
- export declare class FieldRendererComponent extends LitElement {
6
- field: BlueprintField;
7
- value: any;
8
- errorMessage: string | null;
9
- validations: FieldValidator[];
10
- readonly: boolean;
11
- options: (FieldOption | string | number)[];
12
- computedPath: string[];
13
- defaultValue: any;
14
- render(): TemplateResult;
15
- renderField(blueprintField: BlueprintField): TemplateResult;
16
- renderStandardField({ input_type, label, help_text, required, placeholder, styling }: BlueprintField): TemplateResult;
17
- renderRepeatableField({ input_type, label, help_text, required, placeholder, styling }: BlueprintField): TemplateResult;
18
- renderFieldLabel(label: string, helperText: string): TemplateResult;
19
- static get styles(): CSSResultArray;
20
- }
1
+ import { CSSResultArray, LitElement, TemplateResult } from 'lit-element';
2
+ import { BlueprintField } from '../lib/types/form-builder.types';
3
+ import { FieldValidator } from '../lib/utils/validations.helper';
4
+ import { FieldOption } from './single-fields/scale-field';
5
+ export declare class FieldRendererComponent extends LitElement {
6
+ field: BlueprintField;
7
+ value: any;
8
+ errorMessage: string | null;
9
+ validations: FieldValidator[];
10
+ readonly: boolean;
11
+ options: (FieldOption | string | number)[];
12
+ computedPath: string[];
13
+ defaultValue: any;
14
+ render(): TemplateResult;
15
+ renderField(blueprintField: BlueprintField): TemplateResult;
16
+ renderStandardField({ input_type, label, help_text, required, placeholder, styling }: BlueprintField): TemplateResult;
17
+ renderRepeatableField({ input_type, label, help_text, required, placeholder, styling }: BlueprintField): TemplateResult;
18
+ renderFieldLabel(label: string, helperText: string): TemplateResult;
19
+ static get styles(): CSSResultArray;
20
+ }
@@ -1,249 +1,249 @@
1
- var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
2
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
3
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
4
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
- return c > 3 && r && Object.defineProperty(target, key, r), r;
6
- };
7
- import { css, customElement, html, LitElement, property } from 'lit-element';
8
- import { FlexLayoutClasses } from '../lib/styles/flex-layout-classes';
9
- import { FieldTypes, StructureTypes } from '../form-groups';
10
- import { FormBuilderCardStyles } from '../lib/styles/form-builder-card.styles';
11
- let FieldRendererComponent = class FieldRendererComponent extends LitElement {
12
- constructor() {
13
- super(...arguments);
14
- this.errorMessage = null;
15
- this.validations = [];
16
- this.readonly = false;
17
- this.options = [];
18
- this.computedPath = [];
19
- }
20
- render() {
21
- if (!this.field) {
22
- return html ``;
23
- }
24
- return this.renderField(this.field);
25
- }
26
- renderField(blueprintField) {
27
- const additionalClass = blueprintField.styling.includes(StructureTypes.ADDITIONAL)
28
- ? 'additional-field '
29
- : '';
30
- const wideClass = blueprintField.styling.includes(StructureTypes.WIDE) ? 'wide-field-container ' : '';
31
- return html `
32
- <div class="${`${additionalClass}${wideClass}finding-container`}">
33
- ${blueprintField.repeatable
34
- ? this.renderRepeatableField(blueprintField)
35
- : this.renderStandardField(blueprintField)}
36
- </div>
37
- `;
38
- }
39
- renderStandardField({ input_type, label, help_text, required, placeholder, styling }) {
40
- var _a, _b, _c, _d;
41
- const isWide = styling.includes(StructureTypes.WIDE);
42
- switch (input_type) {
43
- case FieldTypes.TEXT_TYPE:
44
- return html `
45
- <text-field
46
- class="${isWide ? 'wide' : ''}"
47
- ?is-readonly="${this.readonly}"
48
- ?required="${required}"
49
- .placeholder="${placeholder}"
50
- .value="${this.value}"
51
- .validators="${this.validations}"
52
- .errorMessage="${this.errorMessage}"
53
- .defaultValue="${(_a = this.field) === null || _a === void 0 ? void 0 : _a.default_value}"
54
- >
55
- ${this.renderFieldLabel(label, help_text)}
56
- </text-field>
57
- `;
58
- case FieldTypes.NUMBER_TYPE:
59
- case FieldTypes.NUMBER_FLOAT_TYPE:
60
- case FieldTypes.NUMBER_INTEGER_TYPE:
61
- return html `
62
- <number-field
63
- ?is-readonly="${this.readonly}"
64
- ?required="${required}"
65
- .placeholder="${placeholder}"
66
- .value="${this.value}"
67
- .validators="${this.validations}"
68
- .errorMessage="${this.errorMessage}"
69
- .isInteger="${Boolean(input_type === FieldTypes.NUMBER_INTEGER_TYPE)}"
70
- .defaultValue="${(_b = this.field) === null || _b === void 0 ? void 0 : _b.default_value}"
71
- >
72
- ${this.renderFieldLabel(label, help_text)}
73
- </number-field>
74
- `;
75
- case FieldTypes.BOOL_TYPE:
76
- return html `
77
- <boolean-field
78
- ?is-readonly="${this.readonly}"
79
- ?required="${required}"
80
- .value="${this.value}"
81
- .validators="${this.validations}"
82
- .errorMessage="${this.errorMessage}"
83
- .defaultValue="${(_c = this.field) === null || _c === void 0 ? void 0 : _c.default_value}"
84
- >
85
- ${this.renderFieldLabel(label, help_text)}
86
- </boolean-field>
87
- `;
88
- case FieldTypes.SCALE_TYPE:
89
- return html `
90
- <scale-field
91
- .options="${this.options}"
92
- ?is-readonly="${this.readonly}"
93
- ?required="${required}"
94
- .placeholder="${placeholder}"
95
- .value="${this.value}"
96
- .validators="${this.validations}"
97
- .errorMessage="${this.errorMessage}"
98
- .defaultValue="${(_d = this.field) === null || _d === void 0 ? void 0 : _d.default_value}"
99
- >
100
- ${this.renderFieldLabel(label, help_text)}
101
- </scale-field>
102
- `;
103
- case FieldTypes.FILE_TYPE:
104
- return html `
105
- <attachments-field
106
- ?is-readonly="${this.readonly}"
107
- ?required="${required}"
108
- .placeholder="${placeholder}"
109
- .value="${this.value}"
110
- .validators="${this.validations}"
111
- .errorMessage="${this.errorMessage}"
112
- .computedPath="${this.computedPath}"
113
- >
114
- ${this.renderFieldLabel(label, help_text)}
115
- </attachments-field>
116
- `;
117
- default:
118
- console.warn(`FormBuilderGroup: Unknown field type: ${input_type}`);
119
- return html ``;
120
- }
121
- }
122
- renderRepeatableField({ input_type, label, help_text, required, placeholder, styling }) {
123
- var _a, _b, _c;
124
- const isWide = styling.includes(StructureTypes.WIDE);
125
- switch (input_type) {
126
- case FieldTypes.TEXT_TYPE:
127
- return html `
128
- <repeatable-text-field
129
- class="${isWide ? 'wide' : ''}"
130
- ?is-readonly="${this.readonly}"
131
- ?required="${required}"
132
- .placeholder="${placeholder}"
133
- .value="${this.value}"
134
- .validators="${this.validations}"
135
- .errorMessage="${this.errorMessage}"
136
- .defaultValue="${(_a = this.field) === null || _a === void 0 ? void 0 : _a.default_value}"
137
- >
138
- ${this.renderFieldLabel(label, help_text)}
139
- </repeatable-text-field>
140
- `;
141
- case FieldTypes.NUMBER_TYPE:
142
- case FieldTypes.NUMBER_FLOAT_TYPE:
143
- case FieldTypes.NUMBER_INTEGER_TYPE:
144
- return html `
145
- <repeatable-number-field
146
- class="${isWide ? 'wide' : ''}"
147
- ?is-readonly="${this.readonly}"
148
- ?required="${required}"
149
- .placeholder="${placeholder}"
150
- .value="${this.value}"
151
- .validators="${this.validations}"
152
- .errorMessage="${this.errorMessage}"
153
- .isInteger="${Boolean(input_type === FieldTypes.NUMBER_INTEGER_TYPE)}"
154
- .defaultValue="${(_b = this.field) === null || _b === void 0 ? void 0 : _b.default_value}"
155
- >
156
- ${this.renderFieldLabel(label, help_text)}
157
- </repeatable-number-field>
158
- `;
159
- case FieldTypes.SCALE_TYPE:
160
- return html `
161
- <repeatable-scale-field
162
- class="${isWide ? 'wide' : ''}"
163
- .options="${this.options}"
164
- ?is-readonly="${this.readonly}"
165
- ?required="${required}"
166
- .placeholder="${placeholder}"
167
- .value="${this.value}"
168
- .validators="${this.validations}"
169
- .errorMessage="${this.errorMessage}"
170
- .defaultValue="${(_c = this.field) === null || _c === void 0 ? void 0 : _c.default_value}"
171
- >
172
- ${this.renderFieldLabel(label, help_text)}
173
- </repeatable-scale-field>
174
- `;
175
- case FieldTypes.FILE_TYPE:
176
- return html `
177
- <repeatable-attachments-field
178
- ?is-readonly="${this.readonly}"
179
- ?required="${required}"
180
- .placeholder="${placeholder}"
181
- .value="${this.value}"
182
- .validators="${this.validations}"
183
- .errorMessage="${this.errorMessage}"
184
- .computedPath="${this.computedPath}"
185
- >
186
- ${this.renderFieldLabel(label, help_text)}
187
- </repeatable-attachments-field>
188
- `;
189
- default:
190
- console.warn(`FormBuilderGroup: Unknown field type: ${input_type}`);
191
- return html ``;
192
- }
193
- }
194
- renderFieldLabel(label, helperText) {
195
- return html `
196
- <div class="layout vertical question-container">
197
- <div class="question-text">${label}</div>
198
- <div class="question-details">${helperText}</div>
199
- </div>
200
- `;
201
- }
202
- static get styles() {
203
- // language=CSS
204
- return [
205
- FlexLayoutClasses,
206
- FormBuilderCardStyles,
207
- css `
208
- .additional-field {
209
- padding-top: 15px;
210
- padding-bottom: 20px;
211
- background-color: var(--secondary-background-color);
212
- }
213
- .wide-field-container {
214
- padding-bottom: 10px;
215
- }
216
- .wide-field-container .question-container {
217
- min-height: 0;
218
- padding: 7px 0 0;
219
- }
220
- .wide-field-container .question-text {
221
- color: var(--secondary-text-color);
222
- font-weight: 400;
223
- }
224
- `
225
- ];
226
- }
227
- };
228
- __decorate([
229
- property()
230
- ], FieldRendererComponent.prototype, "field", void 0);
231
- __decorate([
232
- property()
233
- ], FieldRendererComponent.prototype, "value", void 0);
234
- __decorate([
235
- property()
236
- ], FieldRendererComponent.prototype, "errorMessage", void 0);
237
- __decorate([
238
- property()
239
- ], FieldRendererComponent.prototype, "validations", void 0);
240
- __decorate([
241
- property({ type: Boolean, attribute: 'readonly' })
242
- ], FieldRendererComponent.prototype, "readonly", void 0);
243
- __decorate([
244
- property({ type: Array })
245
- ], FieldRendererComponent.prototype, "options", void 0);
246
- FieldRendererComponent = __decorate([
247
- customElement('field-renderer')
248
- ], FieldRendererComponent);
249
- export { FieldRendererComponent };
1
+ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
2
+ var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
3
+ if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
4
+ else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
+ return c > 3 && r && Object.defineProperty(target, key, r), r;
6
+ };
7
+ import { css, customElement, html, LitElement, property } from 'lit-element';
8
+ import { FlexLayoutClasses } from '../lib/styles/flex-layout-classes';
9
+ import { FieldTypes, StructureTypes } from '../form-groups';
10
+ import { FormBuilderCardStyles } from '../lib/styles/form-builder-card.styles';
11
+ let FieldRendererComponent = class FieldRendererComponent extends LitElement {
12
+ constructor() {
13
+ super(...arguments);
14
+ this.errorMessage = null;
15
+ this.validations = [];
16
+ this.readonly = false;
17
+ this.options = [];
18
+ this.computedPath = [];
19
+ }
20
+ render() {
21
+ if (!this.field) {
22
+ return html ``;
23
+ }
24
+ return this.renderField(this.field);
25
+ }
26
+ renderField(blueprintField) {
27
+ const additionalClass = blueprintField.styling.includes(StructureTypes.ADDITIONAL)
28
+ ? 'additional-field '
29
+ : '';
30
+ const wideClass = blueprintField.styling.includes(StructureTypes.WIDE) ? 'wide-field-container ' : '';
31
+ return html `
32
+ <div class="${`${additionalClass}${wideClass}finding-container`}">
33
+ ${blueprintField.repeatable
34
+ ? this.renderRepeatableField(blueprintField)
35
+ : this.renderStandardField(blueprintField)}
36
+ </div>
37
+ `;
38
+ }
39
+ renderStandardField({ input_type, label, help_text, required, placeholder, styling }) {
40
+ var _a, _b, _c, _d;
41
+ const isWide = styling.includes(StructureTypes.WIDE);
42
+ switch (input_type) {
43
+ case FieldTypes.TEXT_TYPE:
44
+ return html `
45
+ <text-field
46
+ class="${isWide ? 'wide' : ''}"
47
+ ?is-readonly="${this.readonly}"
48
+ ?required="${required}"
49
+ .placeholder="${placeholder}"
50
+ .value="${this.value}"
51
+ .validators="${this.validations}"
52
+ .errorMessage="${this.errorMessage}"
53
+ .defaultValue="${(_a = this.field) === null || _a === void 0 ? void 0 : _a.default_value}"
54
+ >
55
+ ${this.renderFieldLabel(label, help_text)}
56
+ </text-field>
57
+ `;
58
+ case FieldTypes.NUMBER_TYPE:
59
+ case FieldTypes.NUMBER_FLOAT_TYPE:
60
+ case FieldTypes.NUMBER_INTEGER_TYPE:
61
+ return html `
62
+ <number-field
63
+ ?is-readonly="${this.readonly}"
64
+ ?required="${required}"
65
+ .placeholder="${placeholder}"
66
+ .value="${this.value}"
67
+ .validators="${this.validations}"
68
+ .errorMessage="${this.errorMessage}"
69
+ .isInteger="${Boolean(input_type === FieldTypes.NUMBER_INTEGER_TYPE)}"
70
+ .defaultValue="${(_b = this.field) === null || _b === void 0 ? void 0 : _b.default_value}"
71
+ >
72
+ ${this.renderFieldLabel(label, help_text)}
73
+ </number-field>
74
+ `;
75
+ case FieldTypes.BOOL_TYPE:
76
+ return html `
77
+ <boolean-field
78
+ ?is-readonly="${this.readonly}"
79
+ ?required="${required}"
80
+ .value="${this.value}"
81
+ .validators="${this.validations}"
82
+ .errorMessage="${this.errorMessage}"
83
+ .defaultValue="${(_c = this.field) === null || _c === void 0 ? void 0 : _c.default_value}"
84
+ >
85
+ ${this.renderFieldLabel(label, help_text)}
86
+ </boolean-field>
87
+ `;
88
+ case FieldTypes.SCALE_TYPE:
89
+ return html `
90
+ <scale-field
91
+ .options="${this.options}"
92
+ ?is-readonly="${this.readonly}"
93
+ ?required="${required}"
94
+ .placeholder="${placeholder}"
95
+ .value="${this.value}"
96
+ .validators="${this.validations}"
97
+ .errorMessage="${this.errorMessage}"
98
+ .defaultValue="${(_d = this.field) === null || _d === void 0 ? void 0 : _d.default_value}"
99
+ >
100
+ ${this.renderFieldLabel(label, help_text)}
101
+ </scale-field>
102
+ `;
103
+ case FieldTypes.FILE_TYPE:
104
+ return html `
105
+ <attachments-field
106
+ ?is-readonly="${this.readonly}"
107
+ ?required="${required}"
108
+ .placeholder="${placeholder}"
109
+ .value="${this.value}"
110
+ .validators="${this.validations}"
111
+ .errorMessage="${this.errorMessage}"
112
+ .computedPath="${this.computedPath}"
113
+ >
114
+ ${this.renderFieldLabel(label, help_text)}
115
+ </attachments-field>
116
+ `;
117
+ default:
118
+ console.warn(`FormBuilderGroup: Unknown field type: ${input_type}`);
119
+ return html ``;
120
+ }
121
+ }
122
+ renderRepeatableField({ input_type, label, help_text, required, placeholder, styling }) {
123
+ var _a, _b, _c;
124
+ const isWide = styling.includes(StructureTypes.WIDE);
125
+ switch (input_type) {
126
+ case FieldTypes.TEXT_TYPE:
127
+ return html `
128
+ <repeatable-text-field
129
+ class="${isWide ? 'wide' : ''}"
130
+ ?is-readonly="${this.readonly}"
131
+ ?required="${required}"
132
+ .placeholder="${placeholder}"
133
+ .value="${this.value}"
134
+ .validators="${this.validations}"
135
+ .errorMessage="${this.errorMessage}"
136
+ .defaultValue="${(_a = this.field) === null || _a === void 0 ? void 0 : _a.default_value}"
137
+ >
138
+ ${this.renderFieldLabel(label, help_text)}
139
+ </repeatable-text-field>
140
+ `;
141
+ case FieldTypes.NUMBER_TYPE:
142
+ case FieldTypes.NUMBER_FLOAT_TYPE:
143
+ case FieldTypes.NUMBER_INTEGER_TYPE:
144
+ return html `
145
+ <repeatable-number-field
146
+ class="${isWide ? 'wide' : ''}"
147
+ ?is-readonly="${this.readonly}"
148
+ ?required="${required}"
149
+ .placeholder="${placeholder}"
150
+ .value="${this.value}"
151
+ .validators="${this.validations}"
152
+ .errorMessage="${this.errorMessage}"
153
+ .isInteger="${Boolean(input_type === FieldTypes.NUMBER_INTEGER_TYPE)}"
154
+ .defaultValue="${(_b = this.field) === null || _b === void 0 ? void 0 : _b.default_value}"
155
+ >
156
+ ${this.renderFieldLabel(label, help_text)}
157
+ </repeatable-number-field>
158
+ `;
159
+ case FieldTypes.SCALE_TYPE:
160
+ return html `
161
+ <repeatable-scale-field
162
+ class="${isWide ? 'wide' : ''}"
163
+ .options="${this.options}"
164
+ ?is-readonly="${this.readonly}"
165
+ ?required="${required}"
166
+ .placeholder="${placeholder}"
167
+ .value="${this.value}"
168
+ .validators="${this.validations}"
169
+ .errorMessage="${this.errorMessage}"
170
+ .defaultValue="${(_c = this.field) === null || _c === void 0 ? void 0 : _c.default_value}"
171
+ >
172
+ ${this.renderFieldLabel(label, help_text)}
173
+ </repeatable-scale-field>
174
+ `;
175
+ case FieldTypes.FILE_TYPE:
176
+ return html `
177
+ <repeatable-attachments-field
178
+ ?is-readonly="${this.readonly}"
179
+ ?required="${required}"
180
+ .placeholder="${placeholder}"
181
+ .value="${this.value}"
182
+ .validators="${this.validations}"
183
+ .errorMessage="${this.errorMessage}"
184
+ .computedPath="${this.computedPath}"
185
+ >
186
+ ${this.renderFieldLabel(label, help_text)}
187
+ </repeatable-attachments-field>
188
+ `;
189
+ default:
190
+ console.warn(`FormBuilderGroup: Unknown field type: ${input_type}`);
191
+ return html ``;
192
+ }
193
+ }
194
+ renderFieldLabel(label, helperText) {
195
+ return html `
196
+ <div class="layout vertical question-container">
197
+ <div class="question-text">${label}</div>
198
+ <div class="question-details">${helperText}</div>
199
+ </div>
200
+ `;
201
+ }
202
+ static get styles() {
203
+ // language=CSS
204
+ return [
205
+ FlexLayoutClasses,
206
+ FormBuilderCardStyles,
207
+ css `
208
+ .additional-field {
209
+ padding-top: 15px;
210
+ padding-bottom: 20px;
211
+ background-color: var(--secondary-background-color);
212
+ }
213
+ .wide-field-container {
214
+ padding-bottom: 10px;
215
+ }
216
+ .wide-field-container .question-container {
217
+ min-height: 0;
218
+ padding: 7px 0 0;
219
+ }
220
+ .wide-field-container .question-text {
221
+ color: var(--secondary-text-color);
222
+ font-weight: 400;
223
+ }
224
+ `
225
+ ];
226
+ }
227
+ };
228
+ __decorate([
229
+ property()
230
+ ], FieldRendererComponent.prototype, "field", void 0);
231
+ __decorate([
232
+ property()
233
+ ], FieldRendererComponent.prototype, "value", void 0);
234
+ __decorate([
235
+ property()
236
+ ], FieldRendererComponent.prototype, "errorMessage", void 0);
237
+ __decorate([
238
+ property()
239
+ ], FieldRendererComponent.prototype, "validations", void 0);
240
+ __decorate([
241
+ property({ type: Boolean, attribute: 'readonly' })
242
+ ], FieldRendererComponent.prototype, "readonly", void 0);
243
+ __decorate([
244
+ property({ type: Array })
245
+ ], FieldRendererComponent.prototype, "options", void 0);
246
+ FieldRendererComponent = __decorate([
247
+ customElement('field-renderer')
248
+ ], FieldRendererComponent);
249
+ export { FieldRendererComponent };
@@ -1,12 +1,12 @@
1
- export * from './single-fields/base-field';
2
- export * from './single-fields/number-field';
3
- export * from './single-fields/text-field';
4
- export * from './single-fields/scale-field';
5
- export * from './single-fields/boolean-field';
6
- export * from './single-fields/attachment-field';
7
- export * from './repeatable-fields/repeatable-base-field';
8
- export * from './repeatable-fields/repeatable-text-field';
9
- export * from './repeatable-fields/repeatable-number-field';
10
- export * from './repeatable-fields/repeatable-scale-field';
11
- export * from './repeatable-fields/repeatable-attachment-field';
12
- export * from './field-renderer-component';
1
+ export * from './single-fields/base-field';
2
+ export * from './single-fields/number-field';
3
+ export * from './single-fields/text-field';
4
+ export * from './single-fields/scale-field';
5
+ export * from './single-fields/boolean-field';
6
+ export * from './single-fields/attachment-field';
7
+ export * from './repeatable-fields/repeatable-base-field';
8
+ export * from './repeatable-fields/repeatable-text-field';
9
+ export * from './repeatable-fields/repeatable-number-field';
10
+ export * from './repeatable-fields/repeatable-scale-field';
11
+ export * from './repeatable-fields/repeatable-attachment-field';
12
+ export * from './field-renderer-component';
@@ -1,12 +1,12 @@
1
- export * from './single-fields/base-field';
2
- export * from './single-fields/number-field';
3
- export * from './single-fields/text-field';
4
- export * from './single-fields/scale-field';
5
- export * from './single-fields/boolean-field';
6
- export * from './single-fields/attachment-field';
7
- export * from './repeatable-fields/repeatable-base-field';
8
- export * from './repeatable-fields/repeatable-text-field';
9
- export * from './repeatable-fields/repeatable-number-field';
10
- export * from './repeatable-fields/repeatable-scale-field';
11
- export * from './repeatable-fields/repeatable-attachment-field';
12
- export * from './field-renderer-component';
1
+ export * from './single-fields/base-field';
2
+ export * from './single-fields/number-field';
3
+ export * from './single-fields/text-field';
4
+ export * from './single-fields/scale-field';
5
+ export * from './single-fields/boolean-field';
6
+ export * from './single-fields/attachment-field';
7
+ export * from './repeatable-fields/repeatable-base-field';
8
+ export * from './repeatable-fields/repeatable-text-field';
9
+ export * from './repeatable-fields/repeatable-number-field';
10
+ export * from './repeatable-fields/repeatable-scale-field';
11
+ export * from './repeatable-fields/repeatable-attachment-field';
12
+ export * from './field-renderer-component';
@@ -1,17 +1,17 @@
1
- import '@unicef-polymer/etools-upload/etools-upload';
2
- import { RepeatableBaseField } from './repeatable-base-field';
3
- import { StoredAttachment, UploadFinishedDetails } from '../../form-attachments-popup';
4
- import { TemplateResult, CSSResultArray } from 'lit-element';
5
- export declare class RepeatableAttachmentField extends RepeatableBaseField<StoredAttachment> {
6
- get uploadUrl(): string;
7
- get jwtLocalStorageKey(): string;
8
- computedPath: string[];
9
- protected render(): TemplateResult;
10
- protected controlTemplate(): TemplateResult;
11
- protected customValidation(): string | null;
12
- protected attachmentsUploaded({ success, error }: UploadFinishedDetails): void;
13
- protected downloadFile(attachment: StoredAttachment | null): void;
14
- private isUploadedAttachment;
15
- private isOfflineSavedAttachment;
16
- static get styles(): CSSResultArray;
17
- }
1
+ import '@unicef-polymer/etools-upload/etools-upload';
2
+ import { RepeatableBaseField } from './repeatable-base-field';
3
+ import { StoredAttachment, UploadFinishedDetails } from '../../form-attachments-popup';
4
+ import { TemplateResult, CSSResultArray } from 'lit-element';
5
+ export declare class RepeatableAttachmentField extends RepeatableBaseField<StoredAttachment> {
6
+ get uploadUrl(): string;
7
+ get jwtLocalStorageKey(): string;
8
+ computedPath: string[];
9
+ protected render(): TemplateResult;
10
+ protected controlTemplate(): TemplateResult;
11
+ protected customValidation(): string | null;
12
+ protected attachmentsUploaded({ success, error }: UploadFinishedDetails): void;
13
+ protected downloadFile(attachment: StoredAttachment | null): void;
14
+ private isUploadedAttachment;
15
+ private isOfflineSavedAttachment;
16
+ static get styles(): CSSResultArray;
17
+ }