@verdocs/web-sdk 1.10.9 → 1.11.0

package/dist/esm/verdocs-dropdown.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-f78d163d.js';
 import { c as createPopper } from './popper-f860750c.js';
 
-const verdocsDropdownCss = "verdocs-dropdown{font-family:\"Barlow\", sans-serif;display:block}verdocs-dropdown .arrow{width:32px;height:26px;background:#fff;cursor:pointer;border-radius:4px;-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;border:1px solid #cccccc;-ms-flex-pack:center;justify-content:center}verdocs-dropdown .arrow svg{fill:#55bc81;-webkit-transition:0.3s;transition:0.3s}verdocs-dropdown .items{width:200px;display:none;z-index:10000;border-radius:5px;background:#33354c;border:1px solid #654dcb}verdocs-dropdown .items[data-show]{display:block}verdocs-dropdown .option{width:100%;color:#fff;border:none;display:block;text-align:left;background:none;padding:10px 20px}verdocs-dropdown .option:hover{cursor:pointer;background:#55bc81}verdocs-dropdown .option[disabled]{color:#aaaaaa}verdocs-dropdown .option[disabled]:hover{color:#aaaaaa;cursor:inherit;background:transparent}verdocs-dropdown.open .items{display:block}verdocs-dropdown.open .arrow{background:#4c56cb;border:1px solid #707ae5}verdocs-dropdown.open .arrow svg{-webkit-transform:scaleY(-1);transform:scaleY(-1);fill:#fff}";
+const verdocsDropdownCss = "verdocs-dropdown{font-family:\"Barlow\", sans-serif;display:block}verdocs-dropdown .arrow{width:32px;height:26px;background:#fff;cursor:pointer;border-radius:4px;-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;border:1px solid #cccccc;-ms-flex-pack:center;justify-content:center}verdocs-dropdown .arrow svg{fill:#55bc81;-webkit-transition:0.3s;transition:0.3s}verdocs-dropdown .items{width:200px;display:none;z-index:10000;border-radius:5px;background:#33354c;border:1px solid #654dcb}verdocs-dropdown .items[data-show]{display:block}verdocs-dropdown .option{width:100%;color:#fff;border:none;display:block;text-align:left;background:none;padding:10px 20px}verdocs-dropdown .option:hover{cursor:pointer;background:#55bc81}verdocs-dropdown .option[disabled]{color:#aaaaaa}verdocs-dropdown .option[disabled]:hover{color:#aaaaaa;cursor:inherit;background:transparent}verdocs-dropdown .separator{border-top:1px solid #ffffff5f;height:1px;padding-top:5px;margin-top:5px}verdocs-dropdown.open .items{display:block}verdocs-dropdown.open .arrow{background:#4c56cb;border:1px solid #707ae5}verdocs-dropdown.open .arrow svg{-webkit-transform:scaleY(-1);transform:scaleY(-1);fill:#fff}";
 
 const DropdownArrow = `<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#50BE80"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M7 10l5 5 5-5H7z"/></svg>`;
 const VerdocsDropdown = class {
@@ -75,7 +75,7 @@ const VerdocsDropdown = class {
   }
   render() {
     var _a;
-    return (h(Host, { class: { open: !!this.open } }, h("button", { class: "arrow", innerHTML: DropdownArrow, "aria-label": "Open Menu", onClick: e => this.toggleDropdown(e), onBlur: e => this.handleHideDropdown(e), ref: el => (this.dropdownButton = el) }), h("div", { class: "items", "aria-hidden": !this.open, ref: el => (this.dropdownMenu = el) }, (_a = this.options) === null || _a === void 0 ? void 0 : _a.map(option => (h("button", { onClick: e => this.handleSelectOption(e, option), class: "option", disabled: option.disabled }, option.label))))));
+    return (h(Host, { class: { open: !!this.open } }, h("button", { class: "arrow", innerHTML: DropdownArrow, "aria-label": "Open Menu", onClick: e => this.toggleDropdown(e), onBlur: e => this.handleHideDropdown(e), ref: el => (this.dropdownButton = el) }), h("div", { class: "items", "aria-hidden": !this.open, ref: el => (this.dropdownMenu = el) }, (_a = this.options) === null || _a === void 0 ? void 0 : _a.map(option => option.label ? (h("button", { onClick: e => this.handleSelectOption(e, option), class: "option", disabled: option.disabled }, option.label)) : (h("div", { class: "separator" }))))));
   }
   get el() { return getElement(this); }
 };

package/dist/esm/verdocs-envelope-sidebar.entry.js

@@ -1,10 +1,10 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-7f17b088.js';
-import { g as getEnvelopeById, s as state } from './Envelopes-91d7e139.js';
+import { g as getEnvelopeById, s as state } from './Envelopes-b8945309.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import { f as format } from './index-d264c496.js';
 import './Token-54690789.js';
-import './Envelopes-130fd6ea.js';
+import './Envelopes-eb3eef02.js';
 import './index-fd7b8a34.js';
 import './Templates-8e4ab976.js';
 
@@ -38,6 +38,7 @@ const VerdocsEnvelopeSidebar = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.sdkError = createEvent(this, "sdkError", 7);
+    this.envelopeUpdated = createEvent(this, "envelopeUpdated", 7);
     this.endpoint = VerdocsEndpoint.getDefault();
     this.envelopeId = '';
     this.activeTab = 1;
@@ -76,7 +77,9 @@ const VerdocsEnvelopeSidebar = class {
       !['complete', 'declined', 'canceled'].includes(state.envelope.status));
   }
   handleRecipientAction(recipient, id) {
+    var _a;
     console.log('recipient action', id, recipient);
+    (_a = this.envelopeUpdated) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, envelope: state.envelope, event: id });
   }
   prepareHistoryEntries() {
     const entries = [];
@@ -200,7 +203,7 @@ const VerdocsEnvelopeSidebar = class {
     const session = this.endpoint.getSession();
     const isEnvelopeOwner = session.profile_id === state.envelope.profile_id; // TODO: What about org admins?
     const historyEntries = this.prepareHistoryEntries();
-    return (h(Host, { class: this.panelOpen ? 'open' : '' }, h("div", { class: "buttons" }, h("button", { class: this.activeTab === 1 ? 'active' : '', onClick: () => this.setTab(1), innerHTML: InformationCircle }), h("button", { class: this.activeTab === 2 ? 'active' : '', onClick: () => this.setTab(2), innerHTML: Users }), h("button", { class: this.activeTab === 3 ? 'active' : '', onClick: () => this.setTab(3), innerHTML: ClipboardDocuments })), this.activeTab === 1 && (h("div", { class: "content" }, h("div", { class: "title" }, "Details"), h("div", { class: "label" }, "Envelope ID"), h("div", { class: "value" }, state.envelope.id), h("div", { class: "label" }, "Date Created"), h("div", { class: "value" }, format(new Date(state.envelope.created_at), 'PP pp')), h("div", { class: "label" }, "Last Modified"), h("div", { class: "value" }, format(new Date(state.envelope.updated_at), 'PP pp')), h("div", { class: "label" }, "Status"), h("div", { class: "value" }, state.envelope.status), h("div", { class: "label" }, "Verdoc Owner UUID"), h("div", { class: "value" }, state.envelope.profile_id), h("div", { class: "label" }, "Verdoc Owner Name"), h("div", { class: "value" }, (_a = state.envelope.profile) === null || _a === void 0 ? void 0 :
+    return (h(Host, { class: this.panelOpen ? 'open' : '', "data-r": state.updateCount }, h("div", { class: "buttons" }, h("button", { class: this.activeTab === 1 ? 'active' : '', onClick: () => this.setTab(1), innerHTML: InformationCircle }), h("button", { class: this.activeTab === 2 ? 'active' : '', onClick: () => this.setTab(2), innerHTML: Users }), h("button", { class: this.activeTab === 3 ? 'active' : '', onClick: () => this.setTab(3), innerHTML: ClipboardDocuments })), this.activeTab === 1 && (h("div", { class: "content" }, h("div", { class: "title" }, "Details"), h("div", { class: "label" }, "Envelope ID"), h("div", { class: "value" }, state.envelope.id), h("div", { class: "label" }, "Date Created"), h("div", { class: "value" }, format(new Date(state.envelope.created_at), 'PP pp')), h("div", { class: "label" }, "Last Modified"), h("div", { class: "value" }, format(new Date(state.envelope.updated_at), 'PP pp')), h("div", { class: "label" }, "Status"), h("div", { class: "value" }, state.envelope.status), h("div", { class: "label" }, "Verdoc Owner UUID"), h("div", { class: "value" }, state.envelope.profile_id), h("div", { class: "label" }, "Verdoc Owner Name"), h("div", { class: "value" }, (_a = state.envelope.profile) === null || _a === void 0 ? void 0 :
       _a.first_name, " ", (_b = state.envelope.profile) === null || _b === void 0 ? void 0 :
       _b.last_name), h("div", { class: "label" }, "Verdoc Owner Email"), h("div", { class: "value" }, (_c = state.envelope.profile) === null || _c === void 0 ? void 0 : _c.email))), this.activeTab === 2 && (h("div", { class: "content" }, h("div", { class: "title" }, "Recipients"), state.envelope.recipients.map((recipient, index) => (h("div", { class: "recipient-detail" }, h("div", { class: "recipient-header" }, h("div", { class: "recipient-number" }, index + 1), h("div", { class: "recipient-type" }, recipient.type), h("div", { class: { 'recipient-status': true, [recipient.status]: true } }, recipient.status), isEnvelopeOwner && (h("verdocs-dropdown", { onOptionSelected: item => this.handleRecipientAction(recipient, item.detail.id), options: [
         { id: 'reminder', label: 'Send Reminder', disabled: !this.canResendRecipient(recipient) },

package/dist/esm/verdocs-field-checkbox.entry.js

@@ -1,10 +1,11 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-274e2e93.js';
+import { g as getFieldSettings } from './utils-8065a62d.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import './Envelopes-130fd6ea.js';
+import './Envelopes-eb3eef02.js';
 import './Token-54690789.js';
 import './Files-70a192df.js';
+import './index-d264c496.js';
 import './index-fd7b8a34.js';
 import './Primitives-054bc6e5.js';
 

package/dist/esm/verdocs-field-date.entry.js

@@ -1,9 +1,9 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
-import { g as getFieldSettings } from './utils-274e2e93.js';
+import { g as getFieldSettings } from './utils-8065a62d.js';
 import { g as getRGBA } from './Colors-1b298092.js';
 import { s as state } from './templateStore-fd4beaae.js';
 import { f as format } from './index-d264c496.js';
-import './Envelopes-130fd6ea.js';
+import './Envelopes-eb3eef02.js';
 import './Token-54690789.js';
 import './Files-70a192df.js';
 import './index-fd7b8a34.js';

package/dist/esm/verdocs-field-dropdown.entry.js

@@ -1,10 +1,11 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-274e2e93.js';
+import { g as getFieldSettings } from './utils-8065a62d.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import './Envelopes-130fd6ea.js';
+import './Envelopes-eb3eef02.js';
 import './Token-54690789.js';
 import './Files-70a192df.js';
+import './index-d264c496.js';
 import './index-fd7b8a34.js';
 import './Primitives-054bc6e5.js';
 

package/dist/esm/verdocs-field-initial.entry.js

@@ -1,10 +1,11 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-274e2e93.js';
+import { g as getFieldSettings } from './utils-8065a62d.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import './Envelopes-130fd6ea.js';
+import './Envelopes-eb3eef02.js';
 import './Token-54690789.js';
 import './Files-70a192df.js';
+import './index-d264c496.js';
 import './index-fd7b8a34.js';
 import './Primitives-054bc6e5.js';
 

package/dist/esm/verdocs-field-payment.entry.js

@@ -1,10 +1,11 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-274e2e93.js';
+import { g as getFieldSettings } from './utils-8065a62d.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import './Envelopes-130fd6ea.js';
+import './Envelopes-eb3eef02.js';
 import './Token-54690789.js';
 import './Files-70a192df.js';
+import './index-d264c496.js';
 import './index-fd7b8a34.js';
 import './Primitives-054bc6e5.js';
 

package/dist/esm/verdocs-field-radio-button.entry.js

@@ -1,10 +1,11 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-274e2e93.js';
+import { g as getFieldSettings } from './utils-8065a62d.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import './Envelopes-130fd6ea.js';
+import './Envelopes-eb3eef02.js';
 import './Token-54690789.js';
 import './Files-70a192df.js';
+import './index-d264c496.js';
 import './index-fd7b8a34.js';
 import './Primitives-054bc6e5.js';
 

package/dist/esm/verdocs-field-signature.entry.js

@@ -1,10 +1,11 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-274e2e93.js';
+import { g as getFieldSettings } from './utils-8065a62d.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import './Envelopes-130fd6ea.js';
+import './Envelopes-eb3eef02.js';
 import './Token-54690789.js';
 import './Files-70a192df.js';
+import './index-d264c496.js';
 import './index-fd7b8a34.js';
 import './Primitives-054bc6e5.js';
 

package/dist/esm/verdocs-field-textarea.entry.js

@@ -1,10 +1,11 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-274e2e93.js';
+import { g as getFieldSettings } from './utils-8065a62d.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import './Envelopes-130fd6ea.js';
+import './Envelopes-eb3eef02.js';
 import './Token-54690789.js';
 import './Files-70a192df.js';
+import './index-d264c496.js';
 import './index-fd7b8a34.js';
 import './Primitives-054bc6e5.js';
 

package/dist/esm/verdocs-field-textbox.entry.js

@@ -1,12 +1,13 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
 import { g as getRGBA } from './Colors-1b298092.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import { g as getFieldSettings } from './utils-274e2e93.js';
+import { g as getFieldSettings } from './utils-8065a62d.js';
 import './index-fd7b8a34.js';
 import './Primitives-054bc6e5.js';
-import './Envelopes-130fd6ea.js';
+import './Envelopes-eb3eef02.js';
 import './Token-54690789.js';
 import './Files-70a192df.js';
+import './index-d264c496.js';
 
 const verdocsFieldTextboxCss = "verdocs-field-textbox{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;width:150px;height:15px;display:block;font-size:11px;position:relative;letter-spacing:-0.2px;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left;border:1px solid rgba(0, 0, 0, 0.2)}verdocs-field-textbox.disabled{opacity:0.5}verdocs-field-textbox input{width:100%;height:100%;font-size:11px;background:none;font-weight:500;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-box-sizing:border-box;box-sizing:border-box;color:rgba(0, 0, 0, 0.87);border:none;outline:none}verdocs-field-textbox input.hide{display:none}verdocs-field-textbox.required{border:1px solid #cc0000}verdocs-field-textbox.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}verdocs-field-textbox verdocs-button-panel{top:-3px;left:-2px;opacity:0.5;z-index:1000;cursor:pointer;position:absolute;-webkit-transform:scale(0.6);transform:scale(0.6)}verdocs-field-textbox verdocs-button-panel[data-active],verdocs-field-textbox verdocs-button-panel:hover{opacity:1}verdocs-field-textbox verdocs-button-panel .icon svg{fill:#333333}verdocs-field-textbox verdocs-button-panel .icon:hover svg{fill:#000000}verdocs-field-textbox [data-lastpass-icon-root]{display:none !important}";
 

package/dist/esm/verdocs-field-timestamp.entry.js

@@ -1,9 +1,9 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-274e2e93.js';
+import { g as getFieldSettings } from './utils-8065a62d.js';
 import { s as state } from './templateStore-fd4beaae.js';
 import { f as format } from './index-d264c496.js';
-import './Envelopes-130fd6ea.js';
+import './Envelopes-eb3eef02.js';
 import './Token-54690789.js';
 import './Files-70a192df.js';
 import './index-fd7b8a34.js';

package/dist/esm/verdocs-preview.entry.js

@@ -1,12 +1,13 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-7f17b088.js';
-import { r as renderDocumentField, a as getRoleIndex } from './utils-274e2e93.js';
+import { r as renderDocumentField, a as getRoleIndex } from './utils-8065a62d.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import { l as loadTemplate } from './Templates-7595bdbf.js';
+import { l as loadTemplate } from './Templates-a7530314.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import './Token-54690789.js';
-import './Envelopes-130fd6ea.js';
+import './Envelopes-eb3eef02.js';
 import './Files-70a192df.js';
+import './index-d264c496.js';
 import './index-fd7b8a34.js';
 import './Primitives-054bc6e5.js';
 import './Templates-8e4ab976.js';

package/dist/esm/verdocs-send.entry.js

@@ -3,15 +3,16 @@ import { V as VerdocsEndpoint } from './VerdocsEndpoint-7f17b088.js';
 import { i as isValidEmail, a as isValidPhone } from './Validators-f110bae2.js';
 import { g as getRGBA } from './Colors-1b298092.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import { l as loadTemplate } from './Templates-7595bdbf.js';
-import { a as getRoleIndex } from './utils-274e2e93.js';
+import { l as loadTemplate } from './Templates-a7530314.js';
+import { a as getRoleIndex } from './utils-8065a62d.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import './Token-54690789.js';
 import './index-fd7b8a34.js';
 import './Primitives-054bc6e5.js';
 import './Templates-8e4ab976.js';
-import './Envelopes-130fd6ea.js';
+import './Envelopes-eb3eef02.js';
 import './Files-70a192df.js';
+import './index-d264c496.js';
 
 const verdocsSendCss = "verdocs-send{display:-ms-flexbox;display:flex;padding:10px;position:relative;background:#ffffff;-ms-flex-direction:column;flex-direction:column;font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-send .recipients{position:relative}verdocs-send .left-line{top:32px;left:20px;z-index:1;width:12px;bottom:30px;position:absolute;background:#ffffff;border-left:3px dotted #9b9b9b}verdocs-send .level{display:-ms-flexbox;display:flex;-webkit-column-gap:10px;-moz-column-gap:10px;column-gap:10px;margin-left:50px;position:relative;-ms-flex-direction:row;flex-direction:row;padding:8px 0 4px 0;border-bottom:1px solid #97979744}verdocs-send .level .level-icon{top:14px;z-index:2;left:-40px;width:24px;height:24px;position:absolute;background:#ffffff}verdocs-send .level .level-icon svg{fill:#00000089}verdocs-send .level .recipient{height:30px;display:-ms-flexbox;display:flex;-ms-flex:0 0 30px;flex:0 0 30px;color:#000000;cursor:pointer;font-size:14px;-ms-flex-align:center;align-items:center;border-radius:30px;-ms-flex-direction:row;flex-direction:row;background:#dddddd;white-space:nowrap;padding:2px 10px 2px 14px}verdocs-send .level .recipient .icon{width:22px;height:22px;-ms-flex:0 0 22px;flex:0 0 22px;margin:0 0 0 10px}verdocs-send .level .recipient .icon svg{width:22px;height:22px;fill:#333333;outline:none}verdocs-send .level .complete{-ms-flex:1;flex:1;height:30px;display:-ms-flexbox;display:flex;color:#000000;font-size:14px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;padding:3px 10px 3px 2px}verdocs-send .buttons{display:-ms-flexbox;display:flex;margin-top:10px;-webkit-column-gap:15px;-moz-column-gap:15px;column-gap:15px;-ms-flex-direction:row;flex-direction:row}verdocs-send verdocs-contact-picker{left:0;top:41px;z-index:10;position:absolute;border:1px solid #dddddd;-webkit-box-shadow:0 0 6px 3px rgba(0, 0, 0, 0.1);box-shadow:0 0 6px 3px rgba(0, 0, 0, 0.1)}";
 

package/dist/esm/verdocs-sign.entry.js

@@ -1,13 +1,14 @@
 import { r as registerInstance, c as createEvent, h, H as Host, F as Fragment } from './index-f78d163d.js';
-import { b as getSigningSession, u as updateEnvelopeField, c as updateEnvelopeFieldSignature, d as updateEnvelopeFieldInitials } from './Envelopes-130fd6ea.js';
+import { c as getSigningSession, u as updateEnvelopeField, d as updateEnvelopeFieldSignature, e as updateEnvelopeFieldInitials } from './Envelopes-eb3eef02.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-7f17b088.js';
 import { a as isValidPhone, i as isValidEmail } from './Validators-f110bae2.js';
 import { f as fullNameToInitials } from './Primitives-054bc6e5.js';
-import { s as savePDF, u as updateDocumentFieldValue, a as getRoleIndex, r as renderDocumentField, b as getFieldId } from './utils-274e2e93.js';
-import { g as getEnvelopeById, s as state } from './Envelopes-91d7e139.js';
+import { s as saveAttachment, u as updateDocumentFieldValue, a as getRoleIndex, r as renderDocumentField, b as getFieldId } from './utils-8065a62d.js';
+import { g as getEnvelopeById, s as state } from './Envelopes-b8945309.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import './Token-54690789.js';
 import './Files-70a192df.js';
+import './index-d264c496.js';
 import './index-fd7b8a34.js';
 import './Templates-8e4ab976.js';
 
@@ -213,29 +214,35 @@ const VerdocsSign = class {
     });
   }
   async handleOptionSelected(e) {
+    var _a, _b, _c, _d, _e;
     switch (e.detail.id) {
       case 'later':
         this.finishLater = true;
         this.showFinishLater = true;
+        (_a = this.envelopeUpdated) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, envelope: state.envelope, event: 'later' });
         // this.router.navigate([`view/sign/${this.envelopeId}/role/${this.roleName}/saved`]);
         break;
       case 'claim':
         window.alert('This feature will be available in an upcoming release.');
+        (_b = this.envelopeUpdated) === null || _b === void 0 ? void 0 : _b.emit({ endpoint: this.endpoint, envelope: state.envelope, event: 'claimed' });
         break;
       case 'decline':
         {
           const declineResult = await envelopeRecipientDecline(this.endpoint, this.envelopeId, this.roleId);
           console.log('Decline result', declineResult);
+          (_c = this.envelopeUpdated) === null || _c === void 0 ? void 0 : _c.emit({ endpoint: this.endpoint, envelope: state.envelope, event: 'declined' });
           this.isDone = true;
         }
         break;
       case 'print':
         window.print();
+        (_d = this.envelopeUpdated) === null || _d === void 0 ? void 0 : _d.emit({ endpoint: this.endpoint, envelope: state.envelope, event: 'printed' });
         break;
       case 'download':
-        savePDF(this.endpoint, state.envelope, state.envelope.envelope_document_id).catch(e => {
+        saveAttachment(this.endpoint, state.envelope, state.envelope.envelope_document_id).catch(e => {
           console.log('Error downloading PDF', e);
         });
+        (_e = this.envelopeUpdated) === null || _e === void 0 ? void 0 : _e.emit({ endpoint: this.endpoint, envelope: state.envelope, event: 'downloaded' });
         break;
     }
   }
@@ -491,7 +498,7 @@ const VerdocsSign = class {
     if (state.loading || !state.envelope) {
       return (h(Host, null, h("verdocs-loader", null)));
     }
-    return (h(Host, { class: { agreed: this.agreed } }, !this.isDone && !this.finishLater && h("div", { class: "intro" }, "Please review and act on these documents."), !this.isDone && (h("div", { class: "header" }, !this.agreed ? (h("div", { class: "agree" }, h("verdocs-checkbox", { name: "agree", label: "I agree to use electronic records and signatures.", onInput: () => this.handleClickAgree() }))) : (h(Fragment, null, h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), h("div", { class: "title" }, state.envelope.name), h("div", { style: { flex: '1' } }))), !this.isDone && !this.finishLater && h("verdocs-button", { size: "small", label: this.nextButtonLabel, disabled: !this.agreed, onClick: () => this.handleNext() }), h("div", { style: { marginLeft: '10px' } }), h("verdocs-dropdown", { options: !this.isDone && !this.finishLater ? inProgressMenuOptions : doneMenuOptions, onOptionSelected: e => this.handleOptionSelected(e) }))), !this.isDone && !this.agreed ? h("div", { class: "cover" }) : h("div", { style: { display: 'none' } }), this.isDone ? (
+    return (h(Host, { class: { agreed: this.agreed }, "data-r": state.updateCount }, !this.isDone && !this.finishLater && h("div", { class: "intro" }, "Please review and act on these documents."), !this.isDone && (h("div", { class: "header" }, !this.agreed ? (h("div", { class: "agree" }, h("verdocs-checkbox", { name: "agree", label: "I agree to use electronic records and signatures.", onInput: () => this.handleClickAgree() }))) : (h(Fragment, null, h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), h("div", { class: "title" }, state.envelope.name), h("div", { style: { flex: '1' } }))), !this.isDone && !this.finishLater && h("verdocs-button", { size: "small", label: this.nextButtonLabel, disabled: !this.agreed, onClick: () => this.handleNext() }), h("div", { style: { marginLeft: '10px' } }), h("verdocs-dropdown", { options: !this.isDone && !this.finishLater ? inProgressMenuOptions : doneMenuOptions, onOptionSelected: e => this.handleOptionSelected(e) }))), !this.isDone && !this.agreed ? h("div", { class: "cover" }) : h("div", { style: { display: 'none' } }), this.isDone ? (
     // <div>test</div>
     h("verdocs-view", { endpoint: this.endpoint, envelopeId: this.envelopeId, onSdkError: e => { var _a; return (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } })) : (h("div", { class: "document" }, (state.envelope.documents || []).map(envelopeDocument => {
       const pages = [...((envelopeDocument === null || envelopeDocument === void 0 ? void 0 : envelopeDocument.pages) || [])];

package/dist/esm/verdocs-template-attachments.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-7f17b088.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import { l as loadTemplate } from './Templates-7595bdbf.js';
+import { l as loadTemplate } from './Templates-a7530314.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import './Token-54690789.js';
 import './index-fd7b8a34.js';

package/dist/esm/verdocs-template-create_2.entry.js

@@ -2,14 +2,15 @@ import { r as registerInstance, c as createEvent, h, H as Host } from './index-f
 import { c as createTemplate, g as getTemplate } from './Templates-8e4ab976.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-7f17b088.js';
 import { S as SDKError } from './errors-9b5498c8.js';
-import { i as interact } from './interact.min-32c1c1e4.js';
+import { i as interact } from './interact.min-e472871a.js';
 import { u as updateField, c as createField } from './Fields-c82e6df3.js';
-import { a as getRoleIndex, r as renderDocumentField, c as updateCssTransform, d as defaultWidth, e as defaultHeight } from './utils-274e2e93.js';
+import { a as getRoleIndex, r as renderDocumentField, e as updateCssTransform, f as defaultWidth, h as defaultHeight } from './utils-8065a62d.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import { l as loadTemplate } from './Templates-7595bdbf.js';
+import { l as loadTemplate } from './Templates-a7530314.js';
 import './Token-54690789.js';
-import './Envelopes-130fd6ea.js';
+import './Envelopes-eb3eef02.js';
 import './Files-70a192df.js';
+import './index-d264c496.js';
 import './index-fd7b8a34.js';
 import './Primitives-054bc6e5.js';
 
@@ -142,6 +143,7 @@ const VerdocsTemplateFields = class {
     this.next = createEvent(this, "next", 7);
     this.cancel = createEvent(this, "cancel", 7);
     this.sdkError = createEvent(this, "sdkError", 7);
+    this.templateUpdated = createEvent(this, "templateUpdated", 7);
     this.pageHeights = {};
     this.cachedPageInfo = {};
     this.endpoint = VerdocsEndpoint.getDefault();
@@ -163,7 +165,7 @@ const VerdocsTemplateFields = class {
       }
       try {
         console.log(`[FIELDS] Loading template ${this.templateId}`, this.endpoint.session);
-        await loadTemplate(this.endpoint, this.templateId);
+        await loadTemplate(this.endpoint, this.templateId, true);
         this.selectedRoleName = state.roleNames[0];
         console.log('Starting with role', this.selectedRoleName);
       }
@@ -186,7 +188,9 @@ const VerdocsTemplateFields = class {
   attachFieldAttributes(pageInfo, field, roleIndex, el) {
     el.addEventListener('input', e => this.handleFieldChange(field, e));
     el.addEventListener('settingsChanged', () => {
+      var _a;
       el.setAttribute('roleindex', getRoleIndex(state.roleNames, field.role_name));
+      (_a = this.templateUpdated) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, template: state.template, event: 'updated-field' });
     });
     el.setAttribute('roleindex', roleIndex);
     el.setAttribute('pageNumber', pageInfo.pageNumber);
@@ -270,6 +274,7 @@ const VerdocsTemplateFields = class {
     return { x, y };
   }
   async handleClickPage(e, page) {
+    var _a;
     if (this.placing) {
       const pageNumber = page.sequence;
       const clickedX = e.offsetX;
@@ -328,6 +333,7 @@ const VerdocsTemplateFields = class {
       console.log('Saved field', saved);
       state.fields.push(saved);
       this.placing = null;
+      (_a = this.templateUpdated) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, template: state.template, event: 'added-field' });
       this.handlePageRendered({ detail: this.cachedPageInfo[pageNumber] });
     }
   }
@@ -342,7 +348,7 @@ const VerdocsTemplateFields = class {
     }
     const pages = [...state.template.pages];
     pages.sort((a, b) => a.sequence - b.sequence);
-    return (h(Host, { class: this.placing ? { [`placing-${this.placing}`]: true } : {}, "data-updated": state.updateCount, onSubmit: () => {
+    return (h(Host, { class: this.placing ? { [`placing-${this.placing}`]: true } : {}, "data-r": state.updateCount, onSubmit: () => {
         console.log('onSubmit');
       } }, h("div", { class: "pages" }, pages.map(page => {
       // console.log('rendering page', page);

package/dist/esm/verdocs-template-name.entry.js

@@ -2,7 +2,7 @@ import { r as registerInstance, c as createEvent, h, H as Host } from './index-f
 import { u as updateTemplate } from './Templates-8e4ab976.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-7f17b088.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import { l as loadTemplate } from './Templates-7595bdbf.js';
+import { l as loadTemplate } from './Templates-a7530314.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import './Token-54690789.js';
 import './index-fd7b8a34.js';

package/dist/esm/verdocs-template-recipients.entry.js

@@ -1,18 +1,19 @@
 import { r as registerInstance, c as createEvent, h, F as Fragment, H as Host, a as getElement } from './index-f78d163d.js';
-import { i as interact } from './interact.min-32c1c1e4.js';
+import { i as interact } from './interact.min-e472871a.js';
 import { u as updateRole, c as createRole } from './Roles-2488d047.js';
 import { V as VerdocsEndpoint, T as TemplateSenderTypes } from './VerdocsEndpoint-7f17b088.js';
 import { g as getRGBA } from './Colors-1b298092.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import { l as loadTemplate } from './Templates-7595bdbf.js';
-import { a as getRoleIndex } from './utils-274e2e93.js';
+import { l as loadTemplate } from './Templates-a7530314.js';
+import { a as getRoleIndex } from './utils-8065a62d.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import './Token-54690789.js';
 import './index-fd7b8a34.js';
 import './Primitives-054bc6e5.js';
 import './Templates-8e4ab976.js';
-import './Envelopes-130fd6ea.js';
+import './Envelopes-eb3eef02.js';
 import './Files-70a192df.js';
+import './index-d264c496.js';
 
 const verdocsTemplateRecipientsCss = "verdocs-template-recipients{display:block;min-width:400px;font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-template-recipients>form{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;background-color:#ffffff;padding:12px}verdocs-template-recipients>form h5{font-size:16px;font-weight:bold;color:#4c56cb;margin:0 0 10px 0}verdocs-template-recipients>form .participants{position:relative}verdocs-template-recipients>form .left-line{top:32px;left:11px;z-index:1;width:12px;bottom:30px;position:absolute;background:#ffffff;border-left:3px dotted #9b9b9b}verdocs-template-recipients>form .row{display:-ms-flexbox;display:flex;-webkit-column-gap:0;-moz-column-gap:0;column-gap:0;margin-left:40px;position:relative;-ms-flex-direction:row;flex-direction:row;padding:6px 0 4px 0}verdocs-template-recipients>form .row .row-recipients{-ms-flex:1;flex:1;display:-ms-flexbox;display:flex;-webkit-column-gap:10px;-moz-column-gap:10px;column-gap:10px;-ms-flex-direction:row;flex-direction:row}verdocs-template-recipients>form .row .icon{top:14px;z-index:2;left:-40px;width:24px;height:24px;position:absolute;background:#ffffff}verdocs-template-recipients>form .row .sender{height:30px;display:-ms-flexbox;display:flex;font-size:14px;padding:0 5px 0 15px;line-height:30px;-ms-flex-direction:row;flex-direction:row;border-radius:30px;border:1px solid #c6c9cc;background-color:#f5f5fa}verdocs-template-recipients>form .row .complete{height:30px;display:-ms-flexbox;display:flex;font-size:14px;padding:0 15px;line-height:30px;-ms-flex-direction:row;flex-direction:row;border-radius:30px;background-color:#f5f5fa;border:1px solid #aeb4bf}verdocs-template-recipients>form .row .label{font-weight:bold;margin-right:6px;color:#33364b}verdocs-template-recipients>form .row .settings-button{margin:4px 0 0 9px;cursor:pointer}verdocs-template-recipients>form .row .recipient{height:30px;display:-ms-flexbox;display:flex;font-size:14px;line-height:30px;border-radius:30px;-ms-flex-direction:row;flex-direction:row;padding:0 5px 0 6px;white-space:nowrap;border:1px solid #aeb4bf}verdocs-template-recipients>form .row .recipient .type-icon{width:24px;height:24px;-webkit-transform:scale(0.8);transform:scale(0.8);opacity:0.6;margin:4px 12px 0 0}verdocs-template-recipients>form .row .recipient.dragging{position:absolute}verdocs-template-recipients>form .row .recipient.dragging+.dropzone{display:none !important}verdocs-template-recipients>form .row .dropzone{width:14px;height:30px;display:none}verdocs-template-recipients>form .row .dropzone svg{fill:#cccccc}verdocs-template-recipients>form .row .dropzone.visible{margin:0 7px;display:-ms-flexbox;display:flex;-ms-flex:0 0 14px;flex:0 0 14px}verdocs-template-recipients>form .row .dropzone.active{-ms-flex:0 0 120px;flex:0 0 120px;border-radius:30px;background:#654dcb7f;border:1px dashed #654dcb}verdocs-template-recipients>form label{display:block;font-size:14px;font-weight:500;margin:0 0 4px 0;color:#5c6575}verdocs-template-recipients>form input{border:none;font-size:18px;padding:3px 6px 3px 0;background:transparent;border-bottom:1px solid #33364b}verdocs-template-recipients>form input:focus{outline:none}verdocs-template-recipients .row.add-sequence{display:none}verdocs-template-recipients .add-role{margin:0;padding:0;border:none;opacity:0.5;cursor:pointer;background:none}verdocs-template-recipients .add-role:hover{opacity:1}verdocs-template-recipients .add-role svg{width:32px;height:32px}verdocs-template-recipients.dragging .add-role{display:none}verdocs-template-recipients.dragging form .row .recipient+.dropzone{display:-ms-flexbox;display:flex}verdocs-template-recipients.dragging .row.add-sequence{display:-ms-flexbox;display:flex}verdocs-template-recipients.dragging .row.add-sequence .dropzone{opacity:0.5;-ms-flex:0 0 120px;flex:0 0 120px;border-radius:30px;-ms-flex-align:center;align-items:center;background:#654dcb7f;-ms-flex-pack:center;justify-content:center;border:1px dashed #654dcb}verdocs-template-recipients.dragging .row.add-sequence .dropzone.active{opacity:1}verdocs-template-recipients .buttons{display:-ms-flexbox;display:flex;-webkit-column-gap:8px;-moz-column-gap:8px;column-gap:8px;margin-top:16px;-ms-flex-direction:row;flex-direction:row}verdocs-template-recipients .empty{font-size:13px;margin-top:15px;margin-bottom:5px}verdocs-template-recipients .empty svg{width:20px;height:20px;stroke:#666666;margin-bottom:-5px}verdocs-template-recipients ::-webkit-input-placeholder{color:#aaaaaa}verdocs-template-recipients ::-moz-placeholder{color:#aaaaaa}verdocs-template-recipients :-ms-input-placeholder{color:#aaaaaa}verdocs-template-recipients ::-ms-input-placeholder{color:#aaaaaa}verdocs-template-recipients ::placeholder{color:#aaaaaa}";
 
@@ -37,6 +38,7 @@ const VerdocsTemplateRecipients = class {
     this.next = createEvent(this, "next", 7);
     this.cancel = createEvent(this, "cancel", 7);
     this.sdkError = createEvent(this, "sdkError", 7);
+    this.templateUpdated = createEvent(this, "templateUpdated", 7);
     this.sequences = [];
     this.endpoint = VerdocsEndpoint.getDefault();
     this.templateId = '';
@@ -59,7 +61,7 @@ const VerdocsTemplateRecipients = class {
       }
       try {
         console.log(`[RECIPIENTS] Loading template ${this.templateId}`, this.endpoint.session);
-        await loadTemplate(this.endpoint, this.templateId);
+        await loadTemplate(this.endpoint, this.templateId, true);
       }
       catch (e) {
         console.log('[RECIPIENTS] Error loading template', e);

package/dist/esm/verdocs-template-reminders.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-7f17b088.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import { l as loadTemplate } from './Templates-7595bdbf.js';
+import { l as loadTemplate } from './Templates-a7530314.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import './Token-54690789.js';
 import './index-fd7b8a34.js';

package/dist/esm/verdocs-template-role-properties_2.entry.js

@@ -2,7 +2,7 @@ import { r as registerInstance, c as createEvent, h, H as Host } from './index-f
 import { u as updateRole, d as deleteRole } from './Roles-2488d047.js';
 import { V as VerdocsEndpoint, T as TemplateSenderTypes } from './VerdocsEndpoint-7f17b088.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import { l as loadTemplate } from './Templates-7595bdbf.js';
+import { l as loadTemplate } from './Templates-a7530314.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import { u as updateTemplate } from './Templates-8e4ab976.js';
 import './Token-54690789.js';

package/dist/esm/verdocs-template-visibility.entry.js

@@ -2,7 +2,7 @@ import { r as registerInstance, c as createEvent, h, H as Host } from './index-f
 import { u as updateTemplate } from './Templates-8e4ab976.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-7f17b088.js';
 import { s as state } from './templateStore-fd4beaae.js';
-import { l as loadTemplate } from './Templates-7595bdbf.js';
+import { l as loadTemplate } from './Templates-a7530314.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import './Token-54690789.js';
 import './index-fd7b8a34.js';

package/dist/esm/verdocs-view.entry.js

@@ -1,24 +1,22 @@
 import { r as registerInstance, c as createEvent, h, H as Host, F as Fragment, a as getElement } from './index-f78d163d.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-7f17b088.js';
-import { g as getEnvelopeById, s as state } from './Envelopes-91d7e139.js';
+import { i as saveEnvelopesAsZip, j as saveCertificate, s as saveAttachment } from './utils-8065a62d.js';
+import { g as getEnvelopeById, s as state } from './Envelopes-b8945309.js';
 import { S as SDKError } from './errors-9b5498c8.js';
-import { s as savePDF } from './utils-274e2e93.js';
 import './Token-54690789.js';
-import './Envelopes-130fd6ea.js';
+import './Envelopes-eb3eef02.js';
+import './Files-70a192df.js';
+import './index-d264c496.js';
 import './index-fd7b8a34.js';
 import './Templates-8e4ab976.js';
-import './Files-70a192df.js';
 
 const verdocsViewCss = "verdocs-view{display:-ms-flexbox;display:flex;overflow:hidden;position:relative;min-height:600px;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-view div,verdocs-view canvas{-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-view .header{color:#fff;display:-ms-flexbox;display:flex;z-index:1000;-ms-flex:0 0 56px;flex:0 0 56px;padding:0 15px;font-size:12px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;-webkit-transition:all 0.25s;transition:all 0.25s;background-color:#33354c;-webkit-box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.24), 0 0 4px 0 rgba(0, 0, 0, 0.12);box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.24), 0 0 4px 0 rgba(0, 0, 0, 0.12)}verdocs-view .header .logo{width:80px;display:none;margin:-6px 0 0 10px}verdocs-view .header .title{padding-left:16px;font-size:18px;font-weight:500;text-overflow:ellipsis;white-space:nowrap}verdocs-view .document{-ms-flex:1;flex:1;height:100%;display:-ms-flexbox;display:flex;padding:15px;row-gap:15px;min-height:200px;position:relative;overflow-y:scroll;-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}verdocs-view .document .inner{width:100%;max-width:1028px}";
 
-const menuOptions = [
-  { id: 'print', label: 'Print' },
-  { id: 'download', label: 'Download' },
-];
 const VerdocsView = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.sdkError = createEvent(this, "sdkError", 7);
+    this.envelopeUpdated = createEvent(this, "envelopeUpdated", 7);
     this.endpoint = VerdocsEndpoint.getDefault();
     this.envelopeId = '';
   }
@@ -60,15 +58,42 @@ const VerdocsView = class {
     // });
   }
   async handleOptionSelected(e) {
+    var _a;
     switch (e.detail.id) {
       case 'print':
         window.print();
+        (_a = this.envelopeUpdated) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, envelope: state.envelope, event: 'printed' });
+        break;
+      case 'download-attachments':
+        saveAttachment(this.endpoint, state.envelope, state.envelope.envelope_document_id)
+          .then(() => {
+          var _a;
+          (_a = this.envelopeUpdated) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, envelope: state.envelope, event: 'downloaded' });
+        })
+          .catch(e => {
+          console.log('Error downloading PDF', e);
+        });
         break;
-      case 'download':
-        savePDF(this.endpoint, state.envelope, state.envelope.envelope_document_id).catch(e => {
+      case 'download-certificate':
+        saveCertificate(this.endpoint, state.envelope, state.envelope.certificate_document_id)
+          .then(() => {
+          var _a;
+          (_a = this.envelopeUpdated) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, envelope: state.envelope, event: 'downloaded' });
+        })
+          .catch(e => {
           console.log('Error downloading PDF', e);
         });
         break;
+      case 'download-all':
+        saveEnvelopesAsZip(this.endpoint, [state.envelope])
+          .then(() => {
+          var _a;
+          (_a = this.envelopeUpdated) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, envelope: state.envelope, event: 'downloaded' });
+        })
+          .catch(e => {
+          console.log('Error downloading Zip', e);
+        });
+        break;
     }
   }
   render() {
@@ -80,7 +105,22 @@ const VerdocsView = class {
     if (state.error) {
       return (h(Host, null, h("div", null, state.error)));
     }
-    return (h(Host, null, h("div", { class: "header" }, h(Fragment, null, h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), h("div", { class: "title" }, state.envelope.name), h("div", { style: { flex: '1' } }), h("div", { style: { marginLeft: '10px' } }), h("verdocs-dropdown", { options: menuOptions, onOptionSelected: e => this.handleOptionSelected(e) }))), h("div", { class: "document" }, (((_a = state.envelope) === null || _a === void 0 ? void 0 : _a.documents) || [])
+    const menuOptions = [{ id: 'print', label: 'Print' }];
+    const hasAttachments = state.envelope.documents.length > 0;
+    const hasCertificate = !!state.envelope.certificate;
+    if (hasAttachments || hasCertificate) {
+      menuOptions.push({ label: '' });
+    }
+    if (hasAttachments) {
+      menuOptions.push({ id: 'download-attachments', label: 'Download Attachment(s)' });
+    }
+    if (hasCertificate) {
+      menuOptions.push({ id: 'download-certificate', label: 'Download Certificate' });
+    }
+    if (hasAttachments && hasCertificate) {
+      menuOptions.push({ id: 'download-all', label: 'Download All Files' });
+    }
+    return (h(Host, { "data-r": state.updateCount }, h("div", { class: "header" }, h(Fragment, null, h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), h("div", { class: "title" }, state.envelope.name), h("div", { style: { flex: '1' } }), h("div", { style: { marginLeft: '10px' } }), h("verdocs-dropdown", { options: menuOptions, onOptionSelected: e => this.handleOptionSelected(e) }))), h("div", { class: "document" }, (((_a = state.envelope) === null || _a === void 0 ? void 0 : _a.documents) || [])
       .filter(document => document.type !== 'certificate')
       .map(envelopeDocument => {
       const pages = [...((envelopeDocument === null || envelopeDocument === void 0 ? void 0 : envelopeDocument.pages) || [])];