@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,108 +1,108 @@
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 { html, property, css, customElement } from 'lit-element';
8
- import { repeat } from 'lit-html/directives/repeat';
9
- import '@polymer/paper-radio-group/paper-radio-group';
10
- import '@polymer/paper-radio-button/paper-radio-button';
11
- import { InputStyles } from '../../lib/styles/input-styles';
12
- import { RepeatableBaseField } from './repeatable-base-field';
13
- import { AbstractFieldBaseClass } from '../abstract-field-base.class';
14
- let RepeatableScaleField = class RepeatableScaleField extends RepeatableBaseField {
15
- constructor() {
16
- super(...arguments);
17
- this.options = [];
18
- }
19
- controlTemplate(value, index) {
20
- return html `
21
- ${InputStyles}
22
- <div class="container">
23
- <paper-radio-group
24
- class="radio-group"
25
- selected="${value}"
26
- @iron-select="${({ detail }) => this.onSelect(detail.item, index)}"
27
- >
28
- ${repeat(this.options, (option) => html `
29
- <paper-radio-button class="radio-button" name="${this.getValue(option)}">
30
- ${this.getLabel(option)}
31
- </paper-radio-button>
32
- `)}
33
- </paper-radio-group>
34
-
35
- <paper-button
36
- ?hidden="${this.isReadonly}"
37
- @click="${() => this.valueChanged(null, index)}"
38
- class="clear-button"
39
- >
40
- <iron-icon icon="clear"></iron-icon>Clear
41
- </paper-button>
42
- </div>
43
- `;
44
- }
45
- onSelect(item, index) {
46
- const newValue = item.get('name');
47
- this.valueChanged(newValue, index);
48
- }
49
- getLabel(option) {
50
- return typeof option === 'object' ? option.label : option;
51
- }
52
- getValue(option) {
53
- return typeof option === 'object' ? option.value : option;
54
- }
55
- customValidation() {
56
- return null;
57
- }
58
- static get styles() {
59
- // language=CSS
60
- return [
61
- ...AbstractFieldBaseClass.styles,
62
- css `
63
- .container {
64
- position: relative;
65
- min-height: 48px;
66
- display: flex;
67
- align-items: center;
68
- flex-direction: row;
69
- }
70
-
71
- .radio-group {
72
- display: flex;
73
- flex-direction: row;
74
- flex-wrap: wrap;
75
- }
76
-
77
- :host([is-readonly]) paper-radio-group {
78
- pointer-events: none;
79
- opacity: 0.55;
80
- }
81
-
82
- @media (max-width: 1080px) {
83
- .container {
84
- flex-direction: column;
85
- align-items: flex-start;
86
- }
87
- .radio-group {
88
- flex-direction: column;
89
- }
90
- .radio-button {
91
- padding-left: 3px;
92
- }
93
- .clear-button {
94
- margin: 0;
95
- padding-left: 0;
96
- }
97
- }
98
- `
99
- ];
100
- }
101
- };
102
- __decorate([
103
- property({ type: Array })
104
- ], RepeatableScaleField.prototype, "options", void 0);
105
- RepeatableScaleField = __decorate([
106
- customElement('repeatable-scale-field')
107
- ], RepeatableScaleField);
108
- export { RepeatableScaleField };
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 { html, property, css, customElement } from 'lit-element';
8
+ import { repeat } from 'lit-html/directives/repeat';
9
+ import '@polymer/paper-radio-group/paper-radio-group';
10
+ import '@polymer/paper-radio-button/paper-radio-button';
11
+ import { InputStyles } from '../../lib/styles/input-styles';
12
+ import { RepeatableBaseField } from './repeatable-base-field';
13
+ import { AbstractFieldBaseClass } from '../abstract-field-base.class';
14
+ let RepeatableScaleField = class RepeatableScaleField extends RepeatableBaseField {
15
+ constructor() {
16
+ super(...arguments);
17
+ this.options = [];
18
+ }
19
+ controlTemplate(value, index) {
20
+ return html `
21
+ ${InputStyles}
22
+ <div class="container">
23
+ <paper-radio-group
24
+ class="radio-group"
25
+ selected="${value}"
26
+ @iron-select="${({ detail }) => this.onSelect(detail.item, index)}"
27
+ >
28
+ ${repeat(this.options, (option) => html `
29
+ <paper-radio-button class="radio-button" name="${this.getValue(option)}">
30
+ ${this.getLabel(option)}
31
+ </paper-radio-button>
32
+ `)}
33
+ </paper-radio-group>
34
+
35
+ <paper-button
36
+ ?hidden="${this.isReadonly}"
37
+ @click="${() => this.valueChanged(null, index)}"
38
+ class="clear-button"
39
+ >
40
+ <iron-icon icon="clear"></iron-icon>Clear
41
+ </paper-button>
42
+ </div>
43
+ `;
44
+ }
45
+ onSelect(item, index) {
46
+ const newValue = item.get('name');
47
+ this.valueChanged(newValue, index);
48
+ }
49
+ getLabel(option) {
50
+ return typeof option === 'object' ? option.label : option;
51
+ }
52
+ getValue(option) {
53
+ return typeof option === 'object' ? option.value : option;
54
+ }
55
+ customValidation() {
56
+ return null;
57
+ }
58
+ static get styles() {
59
+ // language=CSS
60
+ return [
61
+ ...AbstractFieldBaseClass.styles,
62
+ css `
63
+ .container {
64
+ position: relative;
65
+ min-height: 48px;
66
+ display: flex;
67
+ align-items: center;
68
+ flex-direction: row;
69
+ }
70
+
71
+ .radio-group {
72
+ display: flex;
73
+ flex-direction: row;
74
+ flex-wrap: wrap;
75
+ }
76
+
77
+ :host([is-readonly]) paper-radio-group {
78
+ pointer-events: none;
79
+ opacity: 0.55;
80
+ }
81
+
82
+ @media (max-width: 1080px) {
83
+ .container {
84
+ flex-direction: column;
85
+ align-items: flex-start;
86
+ }
87
+ .radio-group {
88
+ flex-direction: column;
89
+ }
90
+ .radio-button {
91
+ padding-left: 3px;
92
+ }
93
+ .clear-button {
94
+ margin: 0;
95
+ padding-left: 0;
96
+ }
97
+ }
98
+ `
99
+ ];
100
+ }
101
+ };
102
+ __decorate([
103
+ property({ type: Array })
104
+ ], RepeatableScaleField.prototype, "options", void 0);
105
+ RepeatableScaleField = __decorate([
106
+ customElement('repeatable-scale-field')
107
+ ], RepeatableScaleField);
108
+ export { RepeatableScaleField };
@@ -1,8 +1,8 @@
1
- import { CSSResultArray, TemplateResult } from 'lit-element';
2
- import '@polymer/paper-input/paper-textarea';
3
- import { RepeatableBaseField } from './repeatable-base-field';
4
- export declare class RepeatableTextField extends RepeatableBaseField<string> {
5
- protected controlTemplate(value: string | null, index: number): TemplateResult;
6
- protected customValidation(): string | null;
7
- static get styles(): CSSResultArray;
8
- }
1
+ import { CSSResultArray, TemplateResult } from 'lit-element';
2
+ import '@polymer/paper-input/paper-textarea';
3
+ import { RepeatableBaseField } from './repeatable-base-field';
4
+ export declare class RepeatableTextField extends RepeatableBaseField<string> {
5
+ protected controlTemplate(value: string | null, index: number): TemplateResult;
6
+ protected customValidation(): string | null;
7
+ static get styles(): CSSResultArray;
8
+ }
@@ -1,53 +1,53 @@
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 } from 'lit-element';
8
- import '@polymer/paper-input/paper-textarea';
9
- import { InputStyles } from '../../lib/styles/input-styles';
10
- import { RepeatableBaseField } from './repeatable-base-field';
11
- import { AbstractFieldBaseClass } from '../abstract-field-base.class';
12
- let RepeatableTextField = class RepeatableTextField extends RepeatableBaseField {
13
- controlTemplate(value, index) {
14
- return html `
15
- ${InputStyles}
16
- <paper-textarea
17
- id="textarea"
18
- class="no-padding-left"
19
- no-label-float
20
- placeholder="${this.isReadonly ? '—' : this.placeholder}"
21
- .value="${value}"
22
- @value-changed="${({ detail }) => this.valueChanged(detail.value, index)}"
23
- ?readonly="${this.isReadonly}"
24
- ?invalid="${this.errorMessage[index]}"
25
- error-message="${this.errorMessage[index]}"
26
- >
27
- </paper-textarea>
28
- `;
29
- }
30
- customValidation() {
31
- return null;
32
- }
33
- static get styles() {
34
- // language=CSS
35
- return [
36
- ...AbstractFieldBaseClass.styles,
37
- css `
38
- :host(.wide) paper-textarea {
39
- padding-left: 0;
40
- }
41
- @media (max-width: 380px) {
42
- .no-padding-left {
43
- padding-left: 0;
44
- }
45
- }
46
- `
47
- ];
48
- }
49
- };
50
- RepeatableTextField = __decorate([
51
- customElement('repeatable-text-field')
52
- ], RepeatableTextField);
53
- export { RepeatableTextField };
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 } from 'lit-element';
8
+ import '@polymer/paper-input/paper-textarea';
9
+ import { InputStyles } from '../../lib/styles/input-styles';
10
+ import { RepeatableBaseField } from './repeatable-base-field';
11
+ import { AbstractFieldBaseClass } from '../abstract-field-base.class';
12
+ let RepeatableTextField = class RepeatableTextField extends RepeatableBaseField {
13
+ controlTemplate(value, index) {
14
+ return html `
15
+ ${InputStyles}
16
+ <paper-textarea
17
+ id="textarea"
18
+ class="no-padding-left"
19
+ no-label-float
20
+ placeholder="${this.isReadonly ? '—' : this.placeholder}"
21
+ .value="${value}"
22
+ @value-changed="${({ detail }) => this.valueChanged(detail.value, index)}"
23
+ ?readonly="${this.isReadonly}"
24
+ ?invalid="${this.errorMessage[index]}"
25
+ error-message="${this.errorMessage[index]}"
26
+ >
27
+ </paper-textarea>
28
+ `;
29
+ }
30
+ customValidation() {
31
+ return null;
32
+ }
33
+ static get styles() {
34
+ // language=CSS
35
+ return [
36
+ ...AbstractFieldBaseClass.styles,
37
+ css `
38
+ :host(.wide) paper-textarea {
39
+ padding-left: 0;
40
+ }
41
+ @media (max-width: 380px) {
42
+ .no-padding-left {
43
+ padding-left: 0;
44
+ }
45
+ }
46
+ `
47
+ ];
48
+ }
49
+ };
50
+ RepeatableTextField = __decorate([
51
+ customElement('repeatable-text-field')
52
+ ], RepeatableTextField);
53
+ export { RepeatableTextField };
@@ -1,16 +1,16 @@
1
- import '@unicef-polymer/etools-upload/etools-upload';
2
- import { BaseField } from './base-field';
3
- import { SingleUploadFinishedDetails, StoredAttachment } from '../../form-attachments-popup';
4
- import { TemplateResult, CSSResultArray } from 'lit-element';
5
- export declare class AttachmentField extends BaseField<StoredAttachment | null> {
6
- get uploadUrl(): string;
7
- get jwtLocalStorageKey(): string;
8
- computedPath: string[];
9
- protected controlTemplate(): TemplateResult;
10
- protected customValidation(): string | null;
11
- protected attachmentsUploaded({ success, error }: SingleUploadFinishedDetails): void;
12
- protected downloadFile(attachment: StoredAttachment | null): void;
13
- private isUploadedAttachment;
14
- private isOfflineSavedAttachment;
15
- static get styles(): CSSResultArray;
16
- }
1
+ import '@unicef-polymer/etools-upload/etools-upload';
2
+ import { BaseField } from './base-field';
3
+ import { SingleUploadFinishedDetails, StoredAttachment } from '../../form-attachments-popup';
4
+ import { TemplateResult, CSSResultArray } from 'lit-element';
5
+ export declare class AttachmentField extends BaseField<StoredAttachment | null> {
6
+ get uploadUrl(): string;
7
+ get jwtLocalStorageKey(): string;
8
+ computedPath: string[];
9
+ protected controlTemplate(): TemplateResult;
10
+ protected customValidation(): string | null;
11
+ protected attachmentsUploaded({ success, error }: SingleUploadFinishedDetails): void;
12
+ protected downloadFile(attachment: StoredAttachment | null): void;
13
+ private isUploadedAttachment;
14
+ private isOfflineSavedAttachment;
15
+ static get styles(): CSSResultArray;
16
+ }
@@ -1,97 +1,98 @@
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 '@unicef-polymer/etools-upload/etools-upload';
8
- import { BaseField } from './base-field';
9
- import { AttachmentsHelper } from '../../form-attachments-popup';
10
- import { html, customElement } from 'lit-element';
11
- import { fireEvent } from '../../lib/utils/fire-custom-event';
12
- import { SharedStyles } from '../../lib/styles/shared-styles';
13
- import { AttachmentsStyles } from '../../lib/styles/attachments.styles';
14
- let AttachmentField = class AttachmentField extends BaseField {
15
- constructor() {
16
- super(...arguments);
17
- this.computedPath = [];
18
- }
19
- get uploadUrl() {
20
- return AttachmentsHelper.uploadUrl;
21
- }
22
- get jwtLocalStorageKey() {
23
- return AttachmentsHelper.jwtLocalStorageKey;
24
- }
25
- controlTemplate() {
26
- return html `
27
- <!-- Upload button -->
28
- <etools-upload
29
- class="with-padding"
30
- activate-offline
31
- .uploadedFileInfo="${this.value}"
32
- ?readonly="${this.isReadonly}"
33
- @upload-finished="${({ detail }) => this.attachmentsUploaded(detail)}"
34
- @delete-file="${() => this.valueChanged(null)}"
35
- .endpointInfo="${{ endpoint: this.uploadUrl, extraInfo: { composedPath: this.computedPath } }}"
36
- .jwtLocalStorageKey="${this.jwtLocalStorageKey}"
37
- >
38
- </etools-upload>
39
- `;
40
- }
41
- customValidation() {
42
- return null;
43
- }
44
- attachmentsUploaded({ success, error }) {
45
- if (this.isUploadedAttachment(success)) {
46
- this.valueChanged({
47
- url: success.file_link,
48
- attachment: success.id,
49
- filename: success.filename,
50
- file_type: null
51
- });
52
- }
53
- else if (this.isOfflineSavedAttachment(success)) {
54
- this.valueChanged({
55
- attachment: success.id,
56
- filename: success.filename,
57
- composedPath: [],
58
- file_type: null
59
- });
60
- }
61
- else {
62
- console.warn('Missing fields in parsed attachment');
63
- this.valueChanged(null);
64
- }
65
- if (error && error.length) {
66
- console.error(error);
67
- fireEvent(this, 'toast', { text: 'Can not upload attachments. Please try again later' });
68
- }
69
- }
70
- downloadFile(attachment) {
71
- if (!(attachment === null || attachment === void 0 ? void 0 : attachment.url)) {
72
- return;
73
- }
74
- const link = document.createElement('a');
75
- link.target = '_blank';
76
- link.href = attachment.url;
77
- link.click();
78
- window.URL.revokeObjectURL(attachment.url);
79
- }
80
- isUploadedAttachment(attachment) {
81
- return (attachment.hasOwnProperty('filename') &&
82
- attachment.hasOwnProperty('id') &&
83
- attachment.hasOwnProperty('file_link') &&
84
- !attachment.hasOwnProperty('unsynced'));
85
- }
86
- isOfflineSavedAttachment(attachment) {
87
- return (attachment.hasOwnProperty('filename') && attachment.hasOwnProperty('id') && attachment.hasOwnProperty('unsynced'));
88
- }
89
- static get styles() {
90
- // language=CSS
91
- return [...BaseField.styles, SharedStyles, AttachmentsStyles];
92
- }
93
- };
94
- AttachmentField = __decorate([
95
- customElement('attachments-field')
96
- ], AttachmentField);
97
- export { AttachmentField };
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 '@unicef-polymer/etools-upload/etools-upload';
8
+ import { BaseField } from './base-field';
9
+ import { AttachmentsHelper } from '../../form-attachments-popup';
10
+ import { html, customElement } from 'lit-element';
11
+ import { fireEvent } from '../../lib/utils/fire-custom-event';
12
+ import { SharedStyles } from '../../lib/styles/shared-styles';
13
+ import { AttachmentsStyles } from '../../lib/styles/attachments.styles';
14
+ import { getTranslation } from '../../lib/utils/translate';
15
+ let AttachmentField = class AttachmentField extends BaseField {
16
+ constructor() {
17
+ super(...arguments);
18
+ this.computedPath = [];
19
+ }
20
+ get uploadUrl() {
21
+ return AttachmentsHelper.uploadUrl;
22
+ }
23
+ get jwtLocalStorageKey() {
24
+ return AttachmentsHelper.jwtLocalStorageKey;
25
+ }
26
+ controlTemplate() {
27
+ return html `
28
+ <!-- Upload button -->
29
+ <etools-upload
30
+ class="with-padding"
31
+ activate-offline
32
+ .uploadedFileInfo="${this.value}"
33
+ ?readonly="${this.isReadonly}"
34
+ @upload-finished="${({ detail }) => this.attachmentsUploaded(detail)}"
35
+ @delete-file="${() => this.valueChanged(null)}"
36
+ .endpointInfo="${{ endpoint: this.uploadUrl, extraInfo: { composedPath: this.computedPath } }}"
37
+ .jwtLocalStorageKey="${this.jwtLocalStorageKey}"
38
+ >
39
+ </etools-upload>
40
+ `;
41
+ }
42
+ customValidation() {
43
+ return null;
44
+ }
45
+ attachmentsUploaded({ success, error }) {
46
+ if (this.isUploadedAttachment(success)) {
47
+ this.valueChanged({
48
+ url: success.file_link,
49
+ attachment: success.id,
50
+ filename: success.filename,
51
+ file_type: null
52
+ });
53
+ }
54
+ else if (this.isOfflineSavedAttachment(success)) {
55
+ this.valueChanged({
56
+ attachment: success.id,
57
+ filename: success.filename,
58
+ composedPath: [],
59
+ file_type: null
60
+ });
61
+ }
62
+ else {
63
+ console.warn('Missing fields in parsed attachment');
64
+ this.valueChanged(null);
65
+ }
66
+ if (error && error.length) {
67
+ console.error(error);
68
+ fireEvent(this, 'toast', { text: getTranslation(this.language, 'UPLOAD_ATTACHMENTS_FAILED') });
69
+ }
70
+ }
71
+ downloadFile(attachment) {
72
+ if (!(attachment === null || attachment === void 0 ? void 0 : attachment.url)) {
73
+ return;
74
+ }
75
+ const link = document.createElement('a');
76
+ link.target = '_blank';
77
+ link.href = attachment.url;
78
+ link.click();
79
+ window.URL.revokeObjectURL(attachment.url);
80
+ }
81
+ isUploadedAttachment(attachment) {
82
+ return (attachment.hasOwnProperty('filename') &&
83
+ attachment.hasOwnProperty('id') &&
84
+ attachment.hasOwnProperty('file_link') &&
85
+ !attachment.hasOwnProperty('unsynced'));
86
+ }
87
+ isOfflineSavedAttachment(attachment) {
88
+ return (attachment.hasOwnProperty('filename') && attachment.hasOwnProperty('id') && attachment.hasOwnProperty('unsynced'));
89
+ }
90
+ static get styles() {
91
+ // language=CSS
92
+ return [...BaseField.styles, SharedStyles, AttachmentsStyles];
93
+ }
94
+ };
95
+ AttachmentField = __decorate([
96
+ customElement('attachments-field')
97
+ ], AttachmentField);
98
+ export { AttachmentField };
@@ -1,11 +1,11 @@
1
- import { TemplateResult } from 'lit-element';
2
- import { AbstractFieldBaseClass } from '../abstract-field-base.class';
3
- export declare abstract class BaseField<T> extends AbstractFieldBaseClass<T> {
4
- set errorMessage(message: string | null);
5
- get errorMessage(): string | null;
6
- protected _errorMessage: string | null;
7
- protected valueChanged(newValue: T): void;
8
- protected setValue(newValue: T | null): void;
9
- protected validateField(value: T): void;
10
- protected abstract controlTemplate(): TemplateResult;
11
- }
1
+ import { TemplateResult } from 'lit-element';
2
+ import { AbstractFieldBaseClass } from '../abstract-field-base.class';
3
+ export declare abstract class BaseField<T> extends AbstractFieldBaseClass<T> {
4
+ set errorMessage(message: string | null);
5
+ get errorMessage(): string | null;
6
+ protected _errorMessage: string | null;
7
+ protected valueChanged(newValue: T): void;
8
+ protected setValue(newValue: T | null): void;
9
+ protected validateField(value: T): void;
10
+ protected abstract controlTemplate(): TemplateResult;
11
+ }