@verdocs/web-sdk 4.2.93 → 4.2.95

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 (111) hide show
  1. package/dist/cjs/{Types-db1bd1d8.js → Types-7a726ff3.js} +1 -1
  2. package/dist/cjs/loader.cjs.js +1 -1
  3. package/dist/cjs/{utils-b7682f9b.js → utils-2da37620.js} +3 -7
  4. package/dist/cjs/verdocs-contact-picker_2.cjs.entry.js +2 -2
  5. package/dist/cjs/verdocs-envelope-document-page.cjs.entry.js +2 -2
  6. package/dist/cjs/verdocs-envelope-sidebar.cjs.entry.js +4 -1
  7. package/dist/cjs/verdocs-envelopes-list.cjs.entry.js +2 -2
  8. package/dist/cjs/verdocs-field-attachment_13.cjs.entry.js +63 -88
  9. package/dist/cjs/verdocs-organization-card_2.cjs.entry.js +18 -16
  10. package/dist/cjs/verdocs-pagination_2.cjs.entry.js +2 -2
  11. package/dist/cjs/verdocs-preview_9.cjs.entry.js +2 -2
  12. package/dist/cjs/verdocs-sign.cjs.entry.js +27 -24
  13. package/dist/cjs/verdocs-template-document-page_2.cjs.entry.js +2 -2
  14. package/dist/cjs/verdocs-view.cjs.entry.js +2 -2
  15. package/dist/cjs/verdocs-web-sdk.cjs.js +1 -1
  16. package/dist/collection/components/controls/verdocs-portal/verdocs-portal.js +18 -34
  17. package/dist/collection/components/dialogs/verdocs-upload-dialog/verdocs-upload-dialog.css +1 -1
  18. package/dist/collection/components/dialogs/verdocs-upload-dialog/verdocs-upload-dialog.js +44 -30
  19. package/dist/collection/components/embeds/verdocs-sign/verdocs-sign.js +25 -22
  20. package/dist/collection/components/envelopes/verdocs-envelope-sidebar/verdocs-envelope-sidebar.js +3 -0
  21. package/dist/collection/components/fields/verdocs-field-attachment/verdocs-field-attachment.js +3 -47
  22. package/dist/collection/components/fields/verdocs-field-checkbox/verdocs-field-checkbox.css +6 -3
  23. package/dist/collection/components/fields/verdocs-field-checkbox/verdocs-field-checkbox.js +35 -8
  24. package/dist/collection/components/fields/verdocs-field-radio/verdocs-field-radio.css +2 -2
  25. package/dist/collection/components/fields/verdocs-field-radio/verdocs-field-radio.js +5 -6
  26. package/dist/collection/components/fields/verdocs-field-signature/verdocs-field-signature.js +1 -2
  27. package/dist/collection/utils/Types.js +1 -1
  28. package/dist/collection/utils/utils.js +2 -6
  29. package/dist/components/Types.js +1 -1
  30. package/dist/components/utils.js +2 -6
  31. package/dist/components/verdocs-envelope-sidebar.js +3 -0
  32. package/dist/components/verdocs-field-attachment2.js +3 -47
  33. package/dist/components/verdocs-field-checkbox2.js +19 -8
  34. package/dist/components/verdocs-field-radio2.js +6 -7
  35. package/dist/components/verdocs-field-signature2.js +1 -2
  36. package/dist/components/verdocs-portal2.js +19 -18
  37. package/dist/components/verdocs-sign.js +25 -22
  38. package/dist/components/verdocs-upload-dialog2.js +37 -27
  39. package/dist/esm/{Types-e4a6eba5.js → Types-95d86a44.js} +1 -1
  40. package/dist/esm/loader.js +1 -1
  41. package/dist/esm/{utils-7b0b77d8.js → utils-a79aa5dd.js} +3 -7
  42. package/dist/esm/verdocs-contact-picker_2.entry.js +2 -2
  43. package/dist/esm/verdocs-envelope-document-page.entry.js +2 -2
  44. package/dist/esm/verdocs-envelope-sidebar.entry.js +4 -1
  45. package/dist/esm/verdocs-envelopes-list.entry.js +2 -2
  46. package/dist/esm/verdocs-field-attachment_13.entry.js +64 -89
  47. package/dist/esm/verdocs-organization-card_2.entry.js +18 -16
  48. package/dist/esm/verdocs-pagination_2.entry.js +2 -2
  49. package/dist/esm/verdocs-preview_9.entry.js +2 -2
  50. package/dist/esm/verdocs-sign.entry.js +27 -24
  51. package/dist/esm/verdocs-template-document-page_2.entry.js +2 -2
  52. package/dist/esm/verdocs-view.entry.js +2 -2
  53. package/dist/esm/verdocs-web-sdk.js +1 -1
  54. package/dist/esm-es5/Types-95d86a44.js +1 -0
  55. package/dist/esm-es5/loader.js +1 -1
  56. package/dist/esm-es5/{utils-7b0b77d8.js → utils-a79aa5dd.js} +2 -2
  57. package/dist/esm-es5/verdocs-contact-picker_2.entry.js +1 -1
  58. package/dist/esm-es5/verdocs-envelope-document-page.entry.js +1 -1
  59. package/dist/esm-es5/verdocs-envelope-sidebar.entry.js +1 -1
  60. package/dist/esm-es5/verdocs-envelopes-list.entry.js +1 -1
  61. package/dist/esm-es5/verdocs-field-attachment_13.entry.js +1 -1
  62. package/dist/esm-es5/verdocs-organization-card_2.entry.js +1 -1
  63. package/dist/esm-es5/verdocs-pagination_2.entry.js +1 -1
  64. package/dist/esm-es5/verdocs-preview_9.entry.js +1 -1
  65. package/dist/esm-es5/verdocs-sign.entry.js +1 -1
  66. package/dist/esm-es5/verdocs-template-document-page_2.entry.js +1 -1
  67. package/dist/esm-es5/verdocs-view.entry.js +1 -1
  68. package/dist/esm-es5/verdocs-web-sdk.js +1 -1
  69. package/dist/types/components/controls/verdocs-portal/verdocs-portal.d.ts +0 -4
  70. package/dist/types/components/dialogs/verdocs-upload-dialog/verdocs-upload-dialog.d.ts +2 -3
  71. package/dist/types/components/fields/verdocs-field-attachment/verdocs-field-attachment.d.ts +0 -4
  72. package/dist/types/components/fields/verdocs-field-checkbox/verdocs-field-checkbox.d.ts +2 -0
  73. package/dist/types/components.d.ts +5 -12
  74. package/dist/types/utils/Types.d.ts +1 -1
  75. package/dist/types/utils/utils.d.ts +0 -1
  76. package/dist/verdocs-web-sdk/{p-04e53cb3.entry.js → p-01199d7a.entry.js} +1 -1
  77. package/dist/verdocs-web-sdk/{p-18dd4952.system.entry.js → p-143f1bdf.system.entry.js} +1 -1
  78. package/dist/verdocs-web-sdk/p-185dac12.entry.js +1 -0
  79. package/dist/verdocs-web-sdk/{p-c8e439cc.entry.js → p-1c04628f.entry.js} +1 -1
  80. package/dist/verdocs-web-sdk/{p-dc4a5bc3.entry.js → p-2531fcad.entry.js} +1 -1
  81. package/dist/verdocs-web-sdk/p-267df026.system.js +1 -1
  82. package/dist/verdocs-web-sdk/{p-44ef8fc5.system.entry.js → p-35ca7ec1.system.entry.js} +1 -1
  83. package/dist/verdocs-web-sdk/{p-0833c8d4.system.entry.js → p-39453c48.system.entry.js} +1 -1
  84. package/dist/verdocs-web-sdk/{p-9cde1db5.entry.js → p-4e97fc5c.entry.js} +1 -1
  85. package/dist/verdocs-web-sdk/{p-38ab701b.entry.js → p-61860777.entry.js} +1 -1
  86. package/dist/verdocs-web-sdk/{p-965631d9.entry.js → p-61a3e6ab.entry.js} +1 -1
  87. package/dist/verdocs-web-sdk/p-73f2e118.entry.js +1 -0
  88. package/dist/verdocs-web-sdk/{p-7f52a1c4.entry.js → p-85aaa229.entry.js} +1 -1
  89. package/dist/verdocs-web-sdk/p-8b707999.system.entry.js +1 -0
  90. package/dist/verdocs-web-sdk/p-8ef13092.entry.js +1 -0
  91. package/dist/verdocs-web-sdk/{p-6589d38a.system.entry.js → p-96276131.system.entry.js} +1 -1
  92. package/dist/verdocs-web-sdk/{p-a4a60476.system.entry.js → p-9d383fad.system.entry.js} +1 -1
  93. package/dist/verdocs-web-sdk/{p-5c50ce79.system.entry.js → p-a5b56406.system.entry.js} +1 -1
  94. package/dist/verdocs-web-sdk/{p-86ccc8c9.system.js → p-ae347813.system.js} +2 -2
  95. package/dist/verdocs-web-sdk/{p-e8dd697f.system.entry.js → p-be7fa476.system.entry.js} +1 -1
  96. package/dist/verdocs-web-sdk/p-bf698049.system.entry.js +1 -0
  97. package/dist/verdocs-web-sdk/{p-2c2a9483.entry.js → p-c6549055.entry.js} +1 -1
  98. package/dist/verdocs-web-sdk/p-c7ee88c7.js +1 -0
  99. package/dist/verdocs-web-sdk/{p-1289c3d5.js → p-ca7ef3ff.js} +1 -1
  100. package/dist/verdocs-web-sdk/{p-1a180595.system.js → p-d738b5db.system.js} +1 -1
  101. package/dist/verdocs-web-sdk/{p-c1978016.system.entry.js → p-d971f8f0.system.entry.js} +1 -1
  102. package/dist/verdocs-web-sdk/{p-a324eeca.system.entry.js → p-fe1b68ae.system.entry.js} +1 -1
  103. package/dist/verdocs-web-sdk/verdocs-web-sdk.esm.js +1 -1
  104. package/package.json +3 -3
  105. package/dist/esm-es5/Types-e4a6eba5.js +0 -1
  106. package/dist/verdocs-web-sdk/p-1acc504b.system.entry.js +0 -1
  107. package/dist/verdocs-web-sdk/p-251c4106.js +0 -1
  108. package/dist/verdocs-web-sdk/p-88437b42.entry.js +0 -1
  109. package/dist/verdocs-web-sdk/p-bb4674a6.system.entry.js +0 -1
  110. package/dist/verdocs-web-sdk/p-e5e05e63.entry.js +0 -1
  111. package/dist/verdocs-web-sdk/p-f0449967.entry.js +0 -1
@@ -1,4 +1,4 @@
1
- import { fileToDataUrl } from "@verdocs/js-sdk";
1
+ // import {fileToDataUrl, IFileWithData} from '@verdocs/js-sdk';
2
2
  import { h, Host } from "@stencil/core";
3
3
  const TrashIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" /></svg>`;
4
4
  const PaperclipIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.172 7l-6.586 6.586a2 2 0 102.828 2.828l6.414-6.586a4 4 0 00-5.656-5.656l-6.415 6.585a6 6 0 108.486 8.486L20.5 13" /></svg>`;
@@ -10,8 +10,9 @@ const PaperclipIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewB
10
10
  export class VerdocsUploadDialog {
11
11
  constructor() {
12
12
  this.draggingOver = false;
13
- this.decodedFiles = [];
13
+ this.selectedFiles = [];
14
14
  }
15
+ // @State() droppedFiles = [] as IFileWithData[];
15
16
  handleCancel() {
16
17
  this.exit.emit();
17
18
  }
@@ -23,7 +24,8 @@ export class VerdocsUploadDialog {
23
24
  }
24
25
  }
25
26
  handleDone() {
26
- this.next.emit(this.decodedFiles);
27
+ this.next.emit(this.selectedFiles);
28
+ // this.next.emit(this.droppedFiles);
27
29
  }
28
30
  handleDragOver(e) {
29
31
  e.preventDefault();
@@ -36,40 +38,53 @@ export class VerdocsUploadDialog {
36
38
  async handleDrop(e) {
37
39
  e.preventDefault();
38
40
  this.draggingOver = false;
41
+ this.selectedFiles = Array.from(e.dataTransfer.items);
39
42
  // Required for cross-browser support. Note that dataTransfer.items is of type DataTransferItemList and is not an array.
40
- let droppedFiles = [];
41
- if (e.dataTransfer.items) {
42
- for (let i = 0; i < e.dataTransfer.items.length; i++) {
43
- if (e.dataTransfer.items[i].kind === 'file') {
44
- const file = e.dataTransfer.items[i].getAsFile();
45
- droppedFiles.push(file);
46
- }
47
- }
48
- }
49
- else {
50
- droppedFiles = e.dataTransfer.files;
51
- }
52
- this.decodedFiles = await Promise.all(droppedFiles.map(fileToDataUrl));
43
+ // let droppedFiles = [] as File[];
44
+ // if (e.dataTransfer.items) {
45
+ // for (let i = 0; i < e.dataTransfer.items.length; i++) {
46
+ // if (e.dataTransfer.items[i].kind === 'file') {
47
+ // const file = e.dataTransfer.items[i].getAsFile();
48
+ // droppedFiles.push(file);
49
+ // }
50
+ // }
51
+ // } else {
52
+ // droppedFiles = e.dataTransfer.files;
53
+ // }
54
+ // this.decodedFiles = await Promise.all(droppedFiles.map(fileToDataUrl));
53
55
  }
54
56
  handleRemoveAttachment(index) {
55
- const newFiles = [...this.decodedFiles];
57
+ const newFiles = [...this.selectedFiles];
56
58
  newFiles.splice(index, 1);
57
- this.decodedFiles = newFiles;
59
+ this.selectedFiles = newFiles;
60
+ // const newFiles = [...this.decodedFiles];
61
+ // newFiles.splice(index, 1);
62
+ // this.decodedFiles = newFiles;
58
63
  }
59
64
  handleSelectFile() {
60
65
  var _a;
61
66
  (_a = this.fileInput) === null || _a === void 0 ? void 0 : _a.click();
62
67
  }
63
68
  async handleFileChange() {
64
- var _a, _b;
69
+ var _a, _b, _c;
70
+ this.selectedFiles = Array.from((_a = this.fileInput) === null || _a === void 0 ? void 0 : _a.files);
65
71
  let droppedFiles = [];
66
- for (let i = 0; i < ((_a = this.fileInput) === null || _a === void 0 ? void 0 : _a.files.length); i++) {
67
- droppedFiles.push((_b = this.fileInput) === null || _b === void 0 ? void 0 : _b.files[i]);
72
+ for (let i = 0; i < ((_b = this.fileInput) === null || _b === void 0 ? void 0 : _b.files.length); i++) {
73
+ droppedFiles.push((_c = this.fileInput) === null || _c === void 0 ? void 0 : _c.files[i]);
68
74
  }
69
- this.decodedFiles = await Promise.all(droppedFiles.map(fileToDataUrl));
75
+ // this.decodedFiles = await Promise.all(droppedFiles.map(fileToDataUrl));
76
+ // let droppedFiles = [] as File[];
77
+ // for (let i = 0; i < this.fileInput?.files.length; i++) {
78
+ // droppedFiles.push(this.fileInput?.files[i]);
79
+ // }
80
+ // this.decodedFiles = await Promise.all(droppedFiles.map(fileToDataUrl));
70
81
  }
71
82
  render() {
72
- return (h(Host, { key: '2cd98783a0cba44f723273fe01518cc96d6b0618' }, h("div", { key: '118f116c01a7a555564d95e42472333c59476e64', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '73f17cb245b77d8b67a4bca73599bb0cd4a527da', class: "dialog" }, h("div", { key: '4047027eea9e427cca5b6e70d4173b254952995a', class: "heading" }, "Upload attachment"), this.decodedFiles.length < 1 ? (h("div", { class: { 'drop-target': true, 'dragging-over': this.draggingOver }, onDragOver: e => this.handleDragOver(e), onDragLeave: e => this.handleDragLeave(e), onDrop: e => this.handleDrop(e) }, h("p", null, "Drag and drop a file here..."), h("p", null, "- or -"), h("verdocs-button", { label: "Select a file...", onClick: () => this.handleSelectFile() }), h("input", { type: "file", ref: el => (this.fileInput = el), style: { display: 'none' }, onChange: () => this.handleFileChange() }))) : (h("div", { class: "attachments" }, this.decodedFiles.map((file, index) => (h("div", { class: "attachment" }, h("div", { class: "icon", innerHTML: PaperclipIcon }), h("div", { class: "name" }, file.name), h("div", { class: "icon trash", innerHTML: TrashIcon, onClick: () => this.handleRemoveAttachment(index) })))))), h("div", { key: 'c406436cf2827cb59da7acc8e0f023aa16870c2f', class: "buttons" }, h("verdocs-button", { key: '8d12c1a94e3981148d09888bf17926e07606b1ed', label: "Cancel", variant: "outline", onClick: () => this.handleCancel() }), h("verdocs-button", { key: '581b0253772c130efbee4f6ef8a65c38bbf3ea62', label: "Done", onClick: () => this.handleDone(), disabled: this.decodedFiles.length < 1 }))))));
83
+ return (h(Host, { key: 'f64e07a78fc85647e8f9434b5a113320f3d7e4f0' }, h("div", { key: 'e982fab85ed6d9e7a19bfd701887b481d6386a68', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: 'd5f998907651e578adb315f0305d15b08a24d574', class: "dialog" }, h("div", { key: '8258e31e6e261c60156cf1370630d8f34fe84141', class: "heading" }, "Upload attachment"), this.selectedFiles.length < 1 ? (
84
+ // {this.decodedFiles.length < 1 ? (
85
+ h("div", { class: { 'drop-target': true, 'dragging-over': this.draggingOver }, onDragOver: e => this.handleDragOver(e), onDragLeave: e => this.handleDragLeave(e), onDrop: e => this.handleDrop(e) }, h("p", null, "Drag and drop a file here..."), h("p", null, "- or -"), h("verdocs-button", { label: "Select a file...", onClick: () => this.handleSelectFile() }), h("input", { type: "file", ref: el => (this.fileInput = el), style: { display: 'none' }, onChange: () => this.handleFileChange() }))) : (h("div", { class: "attachments" }, this.selectedFiles.map((file, index) => (
86
+ // {this.decodedFiles.map((file, index) => (
87
+ h("div", { class: "attachment" }, h("div", { class: "icon", innerHTML: PaperclipIcon }), h("div", { class: "name" }, file.name), h("div", { class: "icon trash", innerHTML: TrashIcon, onClick: () => this.handleRemoveAttachment(index) })))))), h("div", { key: '566289404d41ef017e101c68601593bd85b4fb4a', class: "buttons" }, h("verdocs-button", { key: 'd1d62c6590dd3d800f329e2c70aca963527d42b4', label: "Cancel", variant: "outline", onClick: () => this.handleCancel() }), h("verdocs-button", { key: '000b401b00de23141b2c7f856d14715835ce2f7c', label: "Done", onClick: () => this.handleDone(), disabled: this.selectedFiles.length < 1 }))))));
73
88
  }
74
89
  static get is() { return "verdocs-upload-dialog"; }
75
90
  static get originalStyleUrls() {
@@ -85,7 +100,7 @@ export class VerdocsUploadDialog {
85
100
  static get states() {
86
101
  return {
87
102
  "draggingOver": {},
88
- "decodedFiles": {}
103
+ "selectedFiles": {}
89
104
  };
90
105
  }
91
106
  static get events() {
@@ -115,13 +130,12 @@ export class VerdocsUploadDialog {
115
130
  "text": "Event fired when the dialog is closed. The event data will contain the file selected."
116
131
  },
117
132
  "complexType": {
118
- "original": "IFileWithData[]",
119
- "resolved": "IFileWithData[]",
133
+ "original": "File[]",
134
+ "resolved": "File[]",
120
135
  "references": {
121
- "IFileWithData": {
122
- "location": "import",
123
- "path": "@verdocs/js-sdk",
124
- "id": "node_modules::IFileWithData"
136
+ "File": {
137
+ "location": "global",
138
+ "id": "global::File"
125
139
  }
126
140
  }
127
141
  }
@@ -112,7 +112,7 @@ export class VerdocsSign {
112
112
  (_d = this.envelopeLoaded) === null || _d === void 0 ? void 0 : _d.emit({ endpoint: this.endpoint, envelope: this.envelope });
113
113
  }
114
114
  catch (e) {
115
- console.log('Error with signing session', e);
115
+ console.log('[SIGN] Error with signing session', e);
116
116
  (_e = this.sdkError) === null || _e === void 0 ? void 0 : _e.emit(new SDKError(e.message, (_f = e.response) === null || _f === void 0 ? void 0 : _f.status, (_g = e.response) === null || _g === void 0 ? void 0 : _g.data));
117
117
  this.showLoadError = true;
118
118
  }
@@ -139,7 +139,7 @@ export class VerdocsSign {
139
139
  })
140
140
  .catch(e => {
141
141
  var _a, _b, _c;
142
- console.log('Update failure', e);
142
+ console.log('[SIGN] Update failure', e);
143
143
  this.submitting = false;
144
144
  (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(new SDKError(e.message, (_b = e.response) === null || _b === void 0 ? void 0 : _b.status, (_c = e.response) === null || _c === void 0 ? void 0 : _c.data));
145
145
  });
@@ -160,7 +160,7 @@ export class VerdocsSign {
160
160
  {
161
161
  this.submitting = true;
162
162
  const declineResult = await envelopeRecipientDecline(this.endpoint, this.envelopeId, this.roleId);
163
- console.log('Decline result', declineResult);
163
+ console.log('[SIGN] Decline result', declineResult);
164
164
  (_c = this.envelopeUpdated) === null || _c === void 0 ? void 0 : _c.emit({ endpoint: this.endpoint, envelope: this.envelope, event: 'declined' });
165
165
  this.submitting = false;
166
166
  this.isDone = true;
@@ -175,7 +175,7 @@ export class VerdocsSign {
175
175
  const firstDoc = this.envelope.documents.find(doc => doc.type === 'attachment');
176
176
  if (firstDoc) {
177
177
  saveAttachment(this.endpoint, this.envelope, firstDoc.id).catch(e => {
178
- console.log('Error downloading PDF', e);
178
+ console.log('[SIGN] Error downloading PDF', e);
179
179
  });
180
180
  (_e = this.envelopeUpdated) === null || _e === void 0 ? void 0 : _e.emit({ endpoint: this.endpoint, envelope: this.envelope, event: 'downloaded' });
181
181
  }
@@ -219,7 +219,7 @@ export class VerdocsSign {
219
219
  return this.saveFieldChange(field.name, { prepared: false, value: e.target.checked });
220
220
  }
221
221
  case 'radio': {
222
- return this.saveFieldChange(field.name, { prepared: false, value: e.target.value === e.target.checked });
222
+ return this.saveFieldChange(field.name, { prepared: false, value: e.target.checked });
223
223
  }
224
224
  case 'dropdown':
225
225
  return this.saveFieldChange(field.name, { prepared: false, value: e.detail });
@@ -251,20 +251,19 @@ export class VerdocsSign {
251
251
  this.updateRecipientFieldValue(field.name, updateResult);
252
252
  })
253
253
  .catch(e => {
254
- console.warn('Error updating signature', e);
254
+ console.warn('[SIGN] Error updating signature', e);
255
255
  });
256
256
  case 'date':
257
- const { date, formattedDate } = e.detail;
257
+ const { formattedDate } = e.detail;
258
258
  if (formattedDate) {
259
- console.log('dt', { date, formattedDate });
260
259
  return this.saveFieldChange(field.name, { prepared: false, value: formattedDate });
261
260
  }
262
261
  break;
263
262
  case 'timestamp':
264
- console.log('Updating timestamp', { value, ts: e.target.getAttribute('timestamp') });
263
+ console.log('[SIGN] Updating timestamp', { value, ts: e.target.getAttribute('timestamp') });
265
264
  break;
266
265
  default:
267
- console.log('Unhandled field update', { value, checked }, field);
266
+ console.log('[SIGN] Unhandled field update', { value, checked }, field);
268
267
  break;
269
268
  }
270
269
  }
@@ -281,28 +280,34 @@ export class VerdocsSign {
281
280
  return value !== '';
282
281
  }
283
282
  case 'signature':
283
+ return value === 'signed';
284
284
  case 'initial':
285
- return value && value !== '';
285
+ return value === 'initialed';
286
286
  // Timestamp fields get automatically filled when the envelope is submitted.
287
287
  case 'timestamp':
288
288
  return true;
289
289
  case 'textarea':
290
290
  case 'date':
291
- case 'attachment':
292
291
  return value !== '';
292
+ case 'attachment':
293
+ return value === 'attached';
293
294
  case 'dropdown':
294
295
  return value !== '';
295
296
  case 'checkbox':
296
- return !!value;
297
+ return value === 'true';
297
298
  case 'radio':
298
- return !!value;
299
+ if (!!field.group) {
300
+ return this.getRecipientFields()
301
+ .filter(f => f.group === field.group)
302
+ .some(field => field.value === 'true');
303
+ }
304
+ return field.value === 'true';
299
305
  default:
300
306
  return false;
301
307
  }
302
308
  }
303
309
  isFieldValid(field) {
304
- const { required = false } = field;
305
- return !required || this.isFieldFilled(field);
310
+ return !field.required || this.isFieldFilled(field);
306
311
  }
307
312
  getSortedFillableFields() {
308
313
  const recipientFields = this.getRecipientFields().filter(field => field.type !== 'timestamp');
@@ -377,7 +382,6 @@ export class VerdocsSign {
377
382
  if (nextRequiredField) {
378
383
  const id = getFieldId(nextRequiredField);
379
384
  const el = document.getElementById(id);
380
- console.log('Jumping to next field', nextRequiredField);
381
385
  el === null || el === void 0 ? void 0 : el.focusField();
382
386
  el === null || el === void 0 ? void 0 : el.scrollTo({ behavior: 'smooth', top: 0 });
383
387
  this.focusedField = nextRequiredField.name;
@@ -406,7 +410,9 @@ export class VerdocsSign {
406
410
  // console.log('[SIGN] onfieldInput', e.detail, e.target.value);
407
411
  // These field types don't emit fieldChange. Should we standardize on that? We don't tap "input" for fields like
408
412
  // text boxes because we'd be updating the field on every keystroke. We do those on blur which fires fieldChange.
409
- if (e.target.name.includes('date') || e.target.name.includes('checkbox') || e.target.name.includes('radio')) {
413
+ console.log('onInput', e.target.type, e.target.name);
414
+ if (e.target.type === 'radio' || e.target.type === 'checkbox') {
415
+ // if (e.target.type === 'radio' || e.target.name.includes('date') || e.target.name.includes('checkbox')) {
410
416
  this.handleFieldChange(field, e).finally(() => this.checkRecipientFields());
411
417
  }
412
418
  else {
@@ -415,7 +421,7 @@ export class VerdocsSign {
415
421
  });
416
422
  el.addEventListener('attached', async (e) => {
417
423
  console.log('[SIGN] onAttached', e.detail, e.target.value);
418
- const r = await uploadEnvelopeFieldAttachment(this.endpoint, this.envelopeId, this.roleId, field.name, e.detail);
424
+ const r = await uploadEnvelopeFieldAttachment(this.endpoint, this.envelopeId, field.name, e.detail);
419
425
  console.log('upload result', r);
420
426
  this.checkRecipientFields();
421
427
  });
@@ -448,9 +454,6 @@ export class VerdocsSign {
448
454
  if (field.page !== pageInfo.pageNumber) {
449
455
  return;
450
456
  }
451
- if (field.type === 'signature') {
452
- console.log('rendering', field);
453
- }
454
457
  const el = renderDocumentField(field, pageInfo, { disabled: false, editable: false, draggable: false, done: this.isDone }, tabIndex);
455
458
  if (!el) {
456
459
  return;
@@ -137,6 +137,8 @@ export class VerdocsEnvelopeSidebar {
137
137
  if (((_f = (_e = this.store) === null || _e === void 0 ? void 0 : _e.state) === null || _f === void 0 ? void 0 : _f.status) === 'complete') {
138
138
  entries.push({ icon: 'pencil', message: 'Envelope completed.', date: new Date((_h = (_g = this.store) === null || _g === void 0 ? void 0 : _g.state) === null || _h === void 0 ? void 0 : _h.updated_at) });
139
139
  }
140
+ // TODO: Shift back to server-side generating these events? We'll still need
141
+ // to tolerate both cases here for a while.
140
142
  const ownerCanceled = histories.some(history => history.event === 'owner:canceled');
141
143
  if (((_k = (_j = this.store) === null || _j === void 0 ? void 0 : _j.state) === null || _k === void 0 ? void 0 : _k.status) === 'canceled' && !ownerCanceled) {
142
144
  entries.push({ icon: 'pencil', message: 'Envelope Cancelled.', date: new Date((_m = (_l = this.store) === null || _l === void 0 ? void 0 : _l.state) === null || _m === void 0 ? void 0 : _m.canceled_at) });
@@ -238,6 +240,7 @@ export class VerdocsEnvelopeSidebar {
238
240
  case 'completed':
239
241
  entries.push({ icon: 'done_all', message: `Envelope was completed.`, date: new Date(history.created_at) });
240
242
  break;
243
+ case 'envelope_canceled':
241
244
  case 'canceled':
242
245
  case 'owner:canceled':
243
246
  entries.push({ icon: 'cancel', message: `Envelope was canceled by the creator.`, date: new Date(history.created_at) });
@@ -1,7 +1,6 @@
1
- import interact from "interactjs";
2
- import { getRGBA, VerdocsEndpoint, updateField } from "@verdocs/js-sdk";
1
+ import { getRGBA, VerdocsEndpoint } from "@verdocs/js-sdk";
3
2
  import { h, Host, Fragment } from "@stencil/core";
4
- import { getTemplateFieldStore, updateStoreField } from "../../../utils/TemplateFieldStore";
3
+ import { getTemplateFieldStore } from "../../../utils/TemplateFieldStore";
5
4
  import { getRoleIndex, getTemplateRoleStore } from "../../../utils/TemplateRoleStore";
6
5
  import { SettingsIcon } from "../../../utils/Icons";
7
6
  const PaperclipIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.172 7l-6.586 6.586a2 2 0 102.828 2.828l6.414-6.586a4 4 0 00-5.656-5.656l-6.415 6.585a6 6 0 108.486 8.486L20.5 13" /></svg>`;
@@ -45,56 +44,13 @@ export class VerdocsFieldAttachment {
45
44
  this.fieldStore = getTemplateFieldStore(this.templateid);
46
45
  this.roleStore = getTemplateRoleStore(this.templateid);
47
46
  }
48
- componentDidRender() {
49
- interact.dynamicDrop(true);
50
- if (this.editable) {
51
- interact(this.el).resizable({
52
- edges: { top: false, bottom: false, left: true, right: true },
53
- listeners: {
54
- start: this.handleResizeStart.bind(this),
55
- move: this.handleResize.bind(this),
56
- end: this.handleResizeEnd.bind(this),
57
- },
58
- });
59
- }
60
- }
61
- handleResizeStart(e) {
62
- e.preventDefault();
63
- e.stopPropagation();
64
- }
65
- handleResize(e) {
66
- let { x = 0, y = 0, h = 0 } = e.target.dataset;
67
- let { width, height } = e.rect;
68
- x = (parseFloat(x) || 0) + e.deltaRect.left;
69
- y = (parseFloat(y) || 0) + e.deltaRect.top;
70
- h = (parseFloat(h) || 0) + e.deltaRect.height;
71
- width /= this.xscale;
72
- height /= this.yscale;
73
- Object.assign(e.target.style, {
74
- width: `${width}px`,
75
- height: `${height}px`,
76
- transform: `scale(${this.xscale}, ${this.yscale}); translate(${x}px, ${y + h}px)`,
77
- });
78
- Object.assign(e.target.dataset, { x, y, h });
79
- }
80
- handleResizeEnd(e) {
81
- const width = Math.round(parseFloat(e.target.style.width));
82
- const height = Math.round(parseFloat(e.target.style.height));
83
- updateField(this.endpoint, this.templateid, this.fieldname, { width, height })
84
- .then(field => {
85
- var _a;
86
- updateStoreField(this.fieldStore, this.fieldname, field);
87
- (_a = this.settingsChanged) === null || _a === void 0 ? void 0 : _a.emit({ fieldName: field.name, field });
88
- Object.assign(e.target.dataset, { x: 0, y: 0, h: 0 });
89
- })
90
- .catch(e => console.log('Field update failed', e));
91
- }
92
47
  handleShow() {
93
48
  this.dialog = document.createElement('verdocs-upload-dialog');
94
49
  this.dialog.open = true;
95
50
  this.dialog.addEventListener('exit', () => { var _a; return (_a = this.dialog) === null || _a === void 0 ? void 0 : _a.remove(); });
96
51
  document.addEventListener('next', (e) => {
97
52
  var _a, _b;
53
+ console.log('attach onNext', e.detail[0]);
98
54
  this.selectedFile = e.detail[0];
99
55
  (_a = this.attached) === null || _a === void 0 ? void 0 : _a.emit(e.detail[0]);
100
56
  (_b = this.dialog) === null || _b === void 0 ? void 0 : _b.remove();
@@ -42,16 +42,19 @@ verdocs-field-checkbox label {
42
42
  verdocs-field-checkbox.disabled label {
43
43
  opacity: 0.5;
44
44
  }
45
+ verdocs-field-checkbox.focused {
46
+ animation: verdocs-field-pulse 0.4s 1;
47
+ }
45
48
  verdocs-field-checkbox label > input[type=checkbox] {
46
49
  display: none;
47
50
  }
48
51
  verdocs-field-checkbox label > input[type=checkbox] + *::before {
49
52
  margin: 0;
50
53
  content: "";
51
- width: 14px;
52
- height: 14px;
54
+ width: 12px;
55
+ height: 12px;
53
56
  display: block;
54
- line-height: 14px;
57
+ line-height: 12px;
55
58
  border-radius: 2px;
56
59
  box-sizing: border-box;
57
60
  border: 1px solid #aeb4bf;
@@ -20,6 +20,16 @@ export class VerdocsFieldCheckbox {
20
20
  this.yscale = 1;
21
21
  this.pagenumber = 1;
22
22
  this.showingProperties = false;
23
+ this.focused = false;
24
+ }
25
+ async focusField() {
26
+ // We don't have a visible input that we can actually focus on, so we fake it
27
+ console.log('Focusing me', this.fieldname);
28
+ this.focused = false;
29
+ this.focused = true;
30
+ setTimeout(() => {
31
+ this.focused = false;
32
+ }, 500);
23
33
  }
24
34
  async showSettingsPanel() {
25
35
  const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`);
@@ -38,18 +48,17 @@ export class VerdocsFieldCheckbox {
38
48
  this.roleStore = getTemplateRoleStore(this.templateid);
39
49
  }
40
50
  render() {
41
- const { templateid, fieldname = '', editable = false, done = false, disabled = false, xscale = 1, yscale = 1 } = this;
51
+ const { templateid, fieldname = '', editable = false, done = false, disabled = false, xscale = 1, yscale = 1, focused } = this;
42
52
  const field = this.fieldStore.get('fields').find(field => field.name === fieldname);
43
- const { required = false, role_name = '', label = '' } = field || {};
53
+ const { required = false, role_name = '', label = '', value = false } = field || {};
44
54
  const backgroundColor = getRGBA(getRoleIndex(this.roleStore, role_name));
45
- // TODO
46
- const { id = 'option1', checked = false } = {};
47
- // const {id = 'option1', checked = false} = options[option] || {};
48
- const fieldId = `${fieldname}-${id}`;
55
+ const fieldId = `${fieldname}`;
56
+ // const fieldId = `${fieldname}-${id}`;
57
+ const checked = value === 'true';
49
58
  if (done) {
50
59
  return h(Host, { class: { done } }, checked ? '✓' : '☐');
51
60
  }
52
- return (h(Host, { class: { required, disabled, done }, style: { backgroundColor } }, label && h("div", { class: "label" }, label), h("label", { htmlFor: fieldId }, h("input", { id: fieldId, name: fieldname, type: "checkbox", checked: checked, disabled: disabled, required: required, value: id }), h("span", null), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
61
+ return (h(Host, { class: { required, disabled, done, focused }, style: { backgroundColor } }, label && h("div", { class: "label" }, label), h("label", { htmlFor: fieldId }, h("input", { id: fieldId, name: fieldname, type: "checkbox", checked: checked, disabled: disabled, required: required }), h("span", null), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
53
62
  e.stopPropagation();
54
63
  this.showingProperties = !this.showingProperties;
55
64
  } }), this.showingProperties && (h("verdocs-portal", { anchor: `verdocs-settings-panel-trigger-${field.name}`, onClickAway: () => (this.showingProperties = false) }, h("verdocs-template-field-properties", { templateId: templateid, fieldName: field.name, onClose: () => (this.showingProperties = false), onDelete: () => {
@@ -241,7 +250,8 @@ export class VerdocsFieldCheckbox {
241
250
  }
242
251
  static get states() {
243
252
  return {
244
- "showingProperties": {}
253
+ "showingProperties": {},
254
+ "focused": {}
245
255
  };
246
256
  }
247
257
  static get events() {
@@ -285,6 +295,23 @@ export class VerdocsFieldCheckbox {
285
295
  }
286
296
  static get methods() {
287
297
  return {
298
+ "focusField": {
299
+ "complexType": {
300
+ "signature": "() => Promise<void>",
301
+ "parameters": [],
302
+ "references": {
303
+ "Promise": {
304
+ "location": "global",
305
+ "id": "global::Promise"
306
+ }
307
+ },
308
+ "return": "Promise<void>"
309
+ },
310
+ "docs": {
311
+ "text": "",
312
+ "tags": []
313
+ }
314
+ },
288
315
  "showSettingsPanel": {
289
316
  "complexType": {
290
317
  "signature": "() => Promise<void>",
@@ -73,8 +73,8 @@ verdocs-field-radio:not(.done) input[type=radio] + label:before {
73
73
  border-radius: 100%;
74
74
  border: 1px solid rgba(0, 0, 0, 0.6);
75
75
  display: inline-block;
76
- width: 10px;
77
- height: 10px;
76
+ width: 12px;
77
+ height: 12px;
78
78
  position: absolute;
79
79
  left: 1px;
80
80
  top: 1px;
@@ -42,16 +42,15 @@ export class VerdocsFieldRadio {
42
42
  render() {
43
43
  const { templateid, fieldname = '', editable = false, done = false, disabled = false, xscale = 1, yscale = 1 } = this;
44
44
  const field = this.fieldStore.get('fields').find(field => field.name === fieldname);
45
- const { required = false, role_name = '', label = '', group = '' } = field || {};
45
+ const { name, required = false, role_name = '', label = '', group = '', value = false } = field || {};
46
46
  const backgroundColor = getRGBA(getRoleIndex(this.roleStore, role_name));
47
- // TODO
48
- const { id = 'option1', selected = false } = {};
49
- // const {id = 'option1', selected = false} = options[option] || {};
50
- const fieldId = `${fieldname}-${id}`;
47
+ const fieldId = `${fieldname}`;
48
+ // const fieldId = `${fieldname}-${id}`;
49
+ const selected = value === 'true';
51
50
  if (done) {
52
51
  return (h(Host, { class: { done }, style: { maxWidth: '10px' } }, h("span", { innerHTML: selected ? RadioIconSelected : RadioIconUnselected })));
53
52
  }
54
- return (h(Host, { class: { required, disabled, done }, style: { backgroundColor } }, label && h("div", { class: "label" }, label), editable && group && h("div", { class: "group" }, group), h("input", { id: fieldId, type: "radio", name: fieldname, value: id, checked: !!selected, disabled: disabled, required: required }), h("label", { htmlFor: fieldId }), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
53
+ return (h(Host, { class: { required, disabled, done }, style: { backgroundColor } }, label && h("div", { class: "label" }, label), editable && group && h("div", { class: "group" }, group), h("input", { id: fieldId, type: "radio", name: group || fieldname, value: name, checked: !!selected, disabled: disabled, required: required }), h("label", { htmlFor: fieldId }), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
55
54
  e.stopPropagation();
56
55
  this.showingProperties = !this.showingProperties;
57
56
  } }), this.showingProperties && (h("verdocs-portal", { anchor: `verdocs-settings-panel-trigger-${fieldname}`, onClickAway: () => (this.showingProperties = false) }, h("verdocs-template-field-properties", { templateId: templateid, fieldName: fieldname, onClose: () => (this.showingProperties = false), onDelete: () => {
@@ -78,9 +78,8 @@ export class VerdocsFieldSignature {
78
78
  const { required = false, role_name = '', value = '', label = '' } = field || {};
79
79
  const { base64 } = field.settings || {};
80
80
  const backgroundColor = getRGBA(getRoleIndex(this.roleStore, role_name));
81
- console.log('sig', field, value, base64);
82
81
  if (done) {
83
- return h(Host, { class: { done } }, value && h("img", { src: value, alt: "Signature" }));
82
+ return h(Host, { class: { done } }, value && h("img", { src: base64, alt: "Signature" }));
84
83
  }
85
84
  return (h(Host, { class: { required, disabled, done, focused }, style: { backgroundColor } }, label && h("label", null, label), base64 ? h("img", { src: base64, alt: "Signature" }) : h("button", { onClick: () => !disabled && this.handleShow() }, "Signature"), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
86
85
  e.stopPropagation();
@@ -1,3 +1,3 @@
1
1
  export const FORMAT_TIMESTAMP = 'P pp';
2
2
  // export const FORMAT_TIMESTAMP = 'Y-MM-dd hh:mm:ss a';
3
- export const FORMAT_DATE = 'Y-MM-dd';
3
+ export const FORMAT_DATE = 'y-MM-dd';
@@ -78,9 +78,6 @@ export const getControlStyles = (field, xScale, yScale) => {
78
78
  export const getFieldId = (field) => {
79
79
  return `verdocs-doc-fld-${field.name}`;
80
80
  };
81
- export const getFieldOptionId = (field, index) => {
82
- return `verdocs-doc-fld-${field.name}-${index}`;
83
- };
84
81
  export const updateDocumentFieldValue = (field) => {
85
82
  const id = getFieldId(field);
86
83
  const existingField = document.getElementById(id);
@@ -134,7 +131,6 @@ export const renderDocumentField = (field, docPage, fieldOptions, tabIndex = 1)
134
131
  else {
135
132
  el.setAttribute('tabIndex', tabIndex);
136
133
  }
137
- console.log(field.name, 'editable', editable);
138
134
  el.setAttribute('editable', editable);
139
135
  el.setAttribute('draggable', draggable);
140
136
  el.setAttribute('done', done);
@@ -143,7 +139,7 @@ export const renderDocumentField = (field, docPage, fieldOptions, tabIndex = 1)
143
139
  return el;
144
140
  }
145
141
  case 'checkbox': {
146
- const id = getFieldOptionId(field, 0);
142
+ const id = getFieldId(field);
147
143
  const existingField = document.getElementById(id);
148
144
  if (existingField) {
149
145
  setControlStyles(existingField, field, docPage.xScale, docPage.yScale);
@@ -170,7 +166,7 @@ export const renderDocumentField = (field, docPage, fieldOptions, tabIndex = 1)
170
166
  return cbEl;
171
167
  }
172
168
  case 'radio': {
173
- const id = getFieldOptionId(field, 0);
169
+ const id = getFieldId(field);
174
170
  const existingField = document.getElementById(id);
175
171
  if (existingField) {
176
172
  setControlStyles(existingField, field, docPage.xScale, docPage.yScale);
@@ -1,5 +1,5 @@
1
1
  const FORMAT_TIMESTAMP = 'P pp';
2
2
  // export const FORMAT_TIMESTAMP = 'Y-MM-dd hh:mm:ss a';
3
- const FORMAT_DATE = 'Y-MM-dd';
3
+ const FORMAT_DATE = 'y-MM-dd';
4
4
 
5
5
  export { FORMAT_TIMESTAMP as F, FORMAT_DATE as a };
@@ -99,9 +99,6 @@ const getControlStyles = (field, xScale, yScale) => {
99
99
  const getFieldId = (field) => {
100
100
  return `verdocs-doc-fld-${field.name}`;
101
101
  };
102
- const getFieldOptionId = (field, index) => {
103
- return `verdocs-doc-fld-${field.name}-${index}`;
104
- };
105
102
  const updateDocumentFieldValue = (field) => {
106
103
  const id = getFieldId(field);
107
104
  const existingField = document.getElementById(id);
@@ -155,7 +152,6 @@ const renderDocumentField = (field, docPage, fieldOptions, tabIndex = 1) => {
155
152
  else {
156
153
  el.setAttribute('tabIndex', tabIndex);
157
154
  }
158
- console.log(field.name, 'editable', editable);
159
155
  el.setAttribute('editable', editable);
160
156
  el.setAttribute('draggable', draggable);
161
157
  el.setAttribute('done', done);
@@ -164,7 +160,7 @@ const renderDocumentField = (field, docPage, fieldOptions, tabIndex = 1) => {
164
160
  return el;
165
161
  }
166
162
  case 'checkbox': {
167
- const id = getFieldOptionId(field, 0);
163
+ const id = getFieldId(field);
168
164
  const existingField = document.getElementById(id);
169
165
  if (existingField) {
170
166
  setControlStyles(existingField, field, docPage.xScale, docPage.yScale);
@@ -191,7 +187,7 @@ const renderDocumentField = (field, docPage, fieldOptions, tabIndex = 1) => {
191
187
  return cbEl;
192
188
  }
193
189
  case 'radio': {
194
- const id = getFieldOptionId(field, 0);
190
+ const id = getFieldId(field);
195
191
  const existingField = document.getElementById(id);
196
192
  if (existingField) {
197
193
  setControlStyles(existingField, field, docPage.xScale, docPage.yScale);
@@ -148,6 +148,8 @@ const VerdocsEnvelopeSidebar$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsE
148
148
  if (((_f = (_e = this.store) === null || _e === void 0 ? void 0 : _e.state) === null || _f === void 0 ? void 0 : _f.status) === 'complete') {
149
149
  entries.push({ icon: 'pencil', message: 'Envelope completed.', date: new Date((_h = (_g = this.store) === null || _g === void 0 ? void 0 : _g.state) === null || _h === void 0 ? void 0 : _h.updated_at) });
150
150
  }
151
+ // TODO: Shift back to server-side generating these events? We'll still need
152
+ // to tolerate both cases here for a while.
151
153
  const ownerCanceled = histories.some(history => history.event === 'owner:canceled');
152
154
  if (((_k = (_j = this.store) === null || _j === void 0 ? void 0 : _j.state) === null || _k === void 0 ? void 0 : _k.status) === 'canceled' && !ownerCanceled) {
153
155
  entries.push({ icon: 'pencil', message: 'Envelope Cancelled.', date: new Date((_m = (_l = this.store) === null || _l === void 0 ? void 0 : _l.state) === null || _m === void 0 ? void 0 : _m.canceled_at) });
@@ -249,6 +251,7 @@ const VerdocsEnvelopeSidebar$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsE
249
251
  case 'completed':
250
252
  entries.push({ icon: 'done_all', message: `Envelope was completed.`, date: new Date(history.created_at) });
251
253
  break;
254
+ case 'envelope_canceled':
252
255
  case 'canceled':
253
256
  case 'owner:canceled':
254
257
  entries.push({ icon: 'cancel', message: `Envelope was canceled by the creator.`, date: new Date(history.created_at) });