@verdocs/web-sdk 4.2.97 → 4.2.99

package/dist/collection/components/envelopes/verdocs-envelope-sidebar/verdocs-envelope-sidebar.js

@@ -1,10 +1,11 @@
 import { format } from "date-fns";
-import { cancelEnvelope, capitalize, formatFullName, resendInvitation, userIsEnvelopeOwner, VerdocsEndpoint } from "@verdocs/js-sdk";
-import { h, Host } from "@stencil/core";
-import { getEnvelopeStore } from "../../../utils/EnvelopeStore";
+import { h, Fragment, Host } from "@stencil/core";
+import { cancelEnvelope, capitalize, formatFullName, resendInvitation, updateEnvelope, userIsEnvelopeOwner, VerdocsEndpoint } from "@verdocs/js-sdk";
+import { getEnvelopeStore, updateStoreEnvelope } from "../../../utils/EnvelopeStore";
 import { FORMAT_TIMESTAMP } from "../../../utils/Types";
 import { VerdocsToast } from "../../../utils/Toast";
 import { SDKError } from "../../../utils/errors";
+const MS_PER_HOUR = 60 * 60 * 1000;
 const InformationCircle = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#ffffff"><path stroke-linecap="round" stroke-linejoin="round" d="M11.25 11.25l.041-.02a.75.75 0 011.063.852l-.708 2.836a.75.75 0 001.063.853l.041-.021M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9-3.75h.008v.008H12V8.25z" /></svg>`;
 const Users = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#ffffff"><path stroke-linecap="round" stroke-linejoin="round" d="M15 19.128a9.38 9.38 0 002.625.372 9.337 9.337 0 004.121-.952 4.125 4.125 0 00-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 018.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0111.964-3.07M12 6.375a3.375 3.375 0 11-6.75 0 3.375 3.375 0 016.75 0zm8.25 2.25a2.625 2.625 0 11-5.25 0 2.625 2.625 0 015.25 0z" /></svg>`;
 const ClipboardDocuments = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#ffffff"><path stroke-linecap="round" stroke-linejoin="round" d="M9 12h3.75M9 15h3.75M9 18h3.75m3 .75H18a2.25 2.25 0 002.25-2.25V6.108c0-1.135-.845-2.098-1.976-2.192a48.424 48.424 0 00-1.123-.08m-5.801 0c-.065.21-.1.433-.1.664 0 .414.336.75.75.75h4.5a.75.75 0 00.75-.75 2.25 2.25 0 00-.1-.664m-5.8 0A2.251 2.251 0 0113.5 2.25H15c1.012 0 1.867.668 2.15 1.586m-5.8 0c-.376.023-.75.05-1.124.08C9.095 4.01 8.25 4.973 8.25 6.108V8.25m0 0H4.875c-.621 0-1.125.504-1.125 1.125v11.25c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V9.375c0-.621-.504-1.125-1.125-1.125H8.25zM6.75 12h.008v.008H6.75V12zm0 3h.008v.008H6.75V15zm0 3h.008v.008H6.75V18z" /></svg>`;
@@ -41,13 +42,16 @@ export class VerdocsEnvelopeSidebar {
         this.envelopeId = '';
         this.activeTab = 1;
         this.panelOpen = false;
-        this.showManageDialog = false;
         this.showRecipientDialog = '';
         this.showCancelDialog = false;
         this.loading = true;
+        this.remindersEnabled = false;
+        this.updatingReminders = false;
+        this.initialReminder = null;
+        this.followupReminders = null;
     }
     async componentWillLoad() {
-        var _a, _b, _c;
+        var _a, _b, _c, _d, _e, _f, _g;
         try {
             this.endpoint.loadSession();
             if (!this.envelopeId) {
@@ -60,11 +64,14 @@ export class VerdocsEnvelopeSidebar {
             }
             this.store = await getEnvelopeStore(this.endpoint, this.envelopeId, true);
             this.sortEnvelopeRecipients();
+            this.initialReminder = (_b = (_a = this.store) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.initial_reminder;
+            this.followupReminders = (_d = (_c = this.store) === null || _c === void 0 ? void 0 : _c.state) === null || _d === void 0 ? void 0 : _d.followup_reminders;
+            this.remindersEnabled = !!this.initialReminder;
             this.loading = false;
         }
         catch (e) {
             console.log('[SIDEBAR] Error loading envelope', e);
-            (_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));
+            (_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));
         }
     }
     sortEnvelopeRecipients() {
@@ -190,10 +197,10 @@ export class VerdocsEnvelopeSidebar {
                     break;
                 case 'recipient:claimed':
                     if (history.event_detail === 'guest') {
-                        entries.push({ icon: 'account_circle', message: `${fullName} claimed the Verdoc as a guest.`, date: new Date(history.created_at) });
+                        entries.push({ icon: 'account_circle', message: `${fullName} claimed the Envelope as a guest.`, date: new Date(history.created_at) });
                     }
                     else if (history.event_detail === 'profile') {
-                        entries.push({ icon: 'verified_user', message: `${fullName} claimed the Verdoc as a verified user.`, date: new Date(history.created_at) });
+                        entries.push({ icon: 'verified_user', message: `${fullName} claimed the Envelope as a verified user.`, date: new Date(history.created_at) });
                     }
                     break;
                 case 'recipient:agreed':
@@ -261,31 +268,65 @@ export class VerdocsEnvelopeSidebar {
     //   const invalidEnvelopeStatus = ['complete', 'declined', 'canceled'];
     //   return recipient.claimed !== true && invalidRecipientStatus.indexOf(recipient.status) === -1 && invalidEnvelopeStatus.indexOf(this.store?.state?.status) === -1;
     // }
+    handleToggleReminders() {
+        if (this.remindersEnabled) {
+            return this.handleSetReminders(null, null);
+        }
+        else {
+            return this.handleSetReminders(24 * MS_PER_HOUR, 48 * MS_PER_HOUR);
+        }
+    }
+    handleSetReminders(initial_reminder, followup_reminders) {
+        console.log('Updating reminders...');
+        this.updatingReminders = true;
+        updateEnvelope(this.endpoint, this.envelopeId, { initial_reminder, followup_reminders })
+            .then(envelope => {
+            var _a, _b, _c, _d;
+            console.log('Updated', envelope);
+            updateStoreEnvelope(this.store, envelope);
+            this.initialReminder = (_b = (_a = this.store) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.initial_reminder;
+            this.followupReminders = (_d = (_c = this.store) === null || _c === void 0 ? void 0 : _c.state) === null || _d === void 0 ? void 0 : _d.followup_reminders;
+            this.remindersEnabled = !!envelope.initial_reminder;
+            this.updatingReminders = false;
+        })
+            .catch(e => {
+            var _a, _b, _c, _d, _e, _f;
+            console.log('Error updating envelope', e);
+            this.initialReminder = (_b = (_a = this.store) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.initial_reminder;
+            this.followupReminders = (_d = (_c = this.store) === null || _c === void 0 ? void 0 : _c.state) === null || _d === void 0 ? void 0 : _d.followup_reminders;
+            this.remindersEnabled = !!((_f = (_e = this.store) === null || _e === void 0 ? void 0 : _e.state) === null || _f === void 0 ? void 0 : _f.initial_reminder);
+            this.updatingReminders = false;
+            alert(e.response.data.error);
+        });
+    }
     render() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
         if (!this.store.state) {
             return h(Host, null);
         }
         const isEnvelopeOwner = userIsEnvelopeOwner(this.endpoint.profile, this.store.state);
         const historyEntries = this.prepareHistoryEntries();
         const functionsDisabled = ((_b = (_a = this.store) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.status) !== 'pending' && ((_d = (_c = this.store) === null || _c === void 0 ? void 0 : _c.state) === null || _d === void 0 ? void 0 : _d.status) !== 'in progress';
-        return (h(Host, { class: this.panelOpen ? 'open' : '' }, h("div", { class: "side-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" }, (_f = (_e = this.store) === null || _e === void 0 ? void 0 : _e.state) === null || _f === void 0 ? void 0 : _f.id), h("div", { class: "label" }, "Date Created"), h("div", { class: "value" }, format(new Date((_h = (_g = this.store) === null || _g === void 0 ? void 0 : _g.state) === null || _h === void 0 ? void 0 : _h.created_at), FORMAT_TIMESTAMP)), h("div", { class: "label" }, "Last Modified"), h("div", { class: "value" }, format(new Date((_k = (_j = this.store) === null || _j === void 0 ? void 0 : _j.state) === null || _k === void 0 ? void 0 : _k.updated_at), FORMAT_TIMESTAMP)), h("div", { class: "label" }, "Status"), h("div", { class: "value" }, capitalize((_m = (_l = this.store) === null || _l === void 0 ? void 0 : _l.state) === null || _m === void 0 ? void 0 : _m.status)), h("div", { class: "label" }, "Verdoc Owner ID"), h("div", { class: "value" }, (_p = (_o = this.store) === null || _o === void 0 ? void 0 : _o.state) === null || _p === void 0 ? void 0 : _p.profile_id), h("div", { class: "label" }, "Verdoc Owner Name"), h("div", { class: "value" }, formatFullName((_r = (_q = this.store) === null || _q === void 0 ? void 0 : _q.state) === null || _r === void 0 ? void 0 : _r.profile)), h("div", { class: "label" }, "Verdoc Owner Email"), h("div", { class: "value" }, (_u = (_t = (_s = this.store) === null || _s === void 0 ? void 0 : _s.state) === null || _t === void 0 ? void 0 : _t.profile) === null || _u === void 0 ? void 0 : _u.email))), this.activeTab === 2 && (h("div", { class: "content" }, h("div", { class: "title" }, "Recipients"), (_w = (_v = this.store) === null || _v === void 0 ? void 0 : _v.state) === null || _w === void 0 ? void 0 :
+        console.log('re', this.remindersEnabled);
+        return (h(Host, { class: this.panelOpen ? 'open' : '' }, h("div", { class: "side-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" }, (_f = (_e = this.store) === null || _e === void 0 ? void 0 : _e.state) === null || _f === void 0 ? void 0 : _f.id), h("div", { class: "label" }, "Date Created"), h("div", { class: "value" }, format(new Date((_h = (_g = this.store) === null || _g === void 0 ? void 0 : _g.state) === null || _h === void 0 ? void 0 : _h.created_at), FORMAT_TIMESTAMP)), h("div", { class: "label" }, "Last Modified"), h("div", { class: "value" }, format(new Date((_k = (_j = this.store) === null || _j === void 0 ? void 0 : _j.state) === null || _k === void 0 ? void 0 : _k.updated_at), FORMAT_TIMESTAMP)), h("div", { class: "label" }, "Status"), h("div", { class: "value" }, capitalize((_m = (_l = this.store) === null || _l === void 0 ? void 0 : _l.state) === null || _m === void 0 ? void 0 : _m.status)), h("div", { class: "label" }, "Owner ID"), h("div", { class: "value" }, (_p = (_o = this.store) === null || _o === void 0 ? void 0 : _o.state) === null || _p === void 0 ? void 0 : _p.profile_id), h("div", { class: "label" }, "Owner Name"), h("div", { class: "value" }, formatFullName((_r = (_q = this.store) === null || _q === void 0 ? void 0 : _q.state) === null || _r === void 0 ? void 0 : _r.profile)), h("div", { class: "label" }, "Owner Email"), h("div", { class: "value" }, (_u = (_t = (_s = this.store) === null || _s === void 0 ? void 0 : _s.state) === null || _t === void 0 ? void 0 : _t.profile) === null || _u === void 0 ? void 0 : _u.email))), this.activeTab === 2 && (h("div", { class: "content" }, h("div", { class: "title" }, "Recipients"), (_w = (_v = this.store) === null || _v === void 0 ? void 0 : _v.state) === null || _w === void 0 ? void 0 :
             _w.recipients.map((recipient, index) => {
                 const canGetInPersonLink = recipient.status !== 'submitted' && recipient.status !== 'canceled' && recipient.status !== 'declined';
                 const canSendReminder = this.canResendRecipient(recipient);
                 const fullName = formatFullName(recipient);
-                return (h("div", { class: "recipient-detail" }, h("div", { class: "recipient-header" }, h("div", { class: "recipient-number" }, index + 1), h("div", { class: "recipient-type" }, recipient.role_name), h("div", { class: { 'recipient-status': true, [recipient.status]: true } }, recipient.status), isEnvelopeOwner && !functionsDisabled && (h("verdocs-dropdown", { onOptionSelected: item => this.handleRecipientAction(recipient, item.detail.id), options: [
+                return (h("div", { class: "recipient-detail" }, h("div", { class: "recipient-header" }, h("div", { class: "recipient-number" }, index + 1), h("div", { class: "recipient-name" }, recipient.role_name), h("div", { class: { 'recipient-status': true, [recipient.status]: true } }, recipient.status), isEnvelopeOwner && !functionsDisabled && (h("verdocs-dropdown", { onOptionSelected: item => this.handleRecipientAction(recipient, item.detail.id), options: [
                         { id: 'reminder', label: 'Send Reminder', disabled: !canSendReminder },
                         { id: 'inperson', label: 'Get In-Person Link', disabled: !canGetInPersonLink },
                         // {id: 'modify', label: 'Modify Recipient', disabled: !this.canModifyRecipient(recipient)},
                         // TODO: Details dialog
                         // {id:'details',label: 'View Details'},
                     ] }))), h("dic", { class: "recipient-content" }, h("div", { class: "recipient-name" }, fullName), h("div", { class: "recipient-name" }, recipient.email), h("div", { class: "recipient-name" }, recipient.phone))));
-            }), isEnvelopeOwner && (h("verdocs-button", { class: "manage-recipients-button", variant: "standard", label: "Cancel Verdoc", onClick: () => (this.showCancelDialog = !functionsDisabled), disabled: functionsDisabled })))), this.activeTab === 3 && (h("div", { class: "content" }, h("div", { class: "title" }, "History"), historyEntries.map(entry => (h("div", { class: "history-entry" }, h("div", { class: "activity-icon", innerHTML: ActivityIcons[entry.icon] || entry.icon }), h("div", { class: "activity-details" }, h("div", { class: "activity-text" }, entry.message), h("div", { class: "activity-date" }, format(entry.date, FORMAT_TIMESTAMP)))))))), this.showRecipientDialog && (h("verdocs-envelope-recipient-link", { envelopeId: this.envelopeId, roleName: this.showRecipientDialog, onNext: () => (this.showRecipientDialog = '') })), this.showManageDialog && (h("verdocs-envelope-recipient-summary", { envelopeId: this.envelopeId, canView: false, onAnother: () => {
-                var _a;
-                this.showManageDialog = false;
-                (_a = this.another) === null || _a === void 0 ? void 0 : _a.emit({ envelope: this.store.state });
-            }, onNext: () => (this.showManageDialog = false) })), this.showCancelDialog && (h("verdocs-ok-dialog", { heading: "Cancel Envelope?", message: 'Are you sure you want to cancel this Envelope? This action cannot be undone.', onNext: () => {
+            }), isEnvelopeOwner && (h("div", { class: "reminders" }, h("div", { class: "form-row" }, h("div", { class: "reminders-label" }, "Reminders"), h("verdocs-switch", { disabled: this.updatingReminders, checked: this.remindersEnabled, onCheckedChange: () => this.handleToggleReminders() })), this.remindersEnabled && (h(Fragment, null, h("div", { class: "form-row" }, h("div", { class: "form-label" }, "Initial Reminder:"), h("verdocs-text-input", { placeholder: "In hours...", disabled: this.updatingReminders, value: String(Math.floor(this.initialReminder / MS_PER_HOUR)), onBlur: (e) => {
+                this.initialReminder = Number(e.target.value) * MS_PER_HOUR;
+                this.handleSetReminders(this.initialReminder, this.followupReminders);
+            } })), h("div", { class: "form-row" }, h("div", { class: "form-label" }, "Follow-up Reminders:"), h("verdocs-text-input", { placeholder: "In hours...", disabled: this.updatingReminders, value: String(Math.floor(this.followupReminders / MS_PER_HOUR)), onBlur: (e) => {
+                this.followupReminders = Number(e.target.value) * MS_PER_HOUR;
+                this.handleSetReminders(this.initialReminder, this.followupReminders);
+            } })), h("div", { class: "form-row" }, h("div", { class: "form-label" }, "Next Reminder:"), h("div", { style: { color: '#dddddd' } }, format(new Date((_y = (_x = this.store) === null || _x === void 0 ? void 0 : _x.state) === null || _y === void 0 ? void 0 : _y.next_reminder), 'P p'))))))), isEnvelopeOwner && (h("verdocs-button", { class: "manage-recipients-button", variant: "standard", label: "Cancel Envelope", onClick: () => (this.showCancelDialog = !functionsDisabled), disabled: functionsDisabled })))), this.activeTab === 3 && (h("div", { class: "content" }, h("div", { class: "title" }, "History"), historyEntries.map(entry => (h("div", { class: "history-entry" }, h("div", { class: "activity-icon", innerHTML: ActivityIcons[entry.icon] || entry.icon }), h("div", { class: "activity-details" }, h("div", { class: "activity-text" }, entry.message), h("div", { class: "activity-date" }, format(entry.date, FORMAT_TIMESTAMP)))))))), this.showRecipientDialog && (h("verdocs-envelope-recipient-link", { envelopeId: this.envelopeId, roleName: this.showRecipientDialog, onNext: () => (this.showRecipientDialog = '') })), this.showCancelDialog && (h("verdocs-ok-dialog", { heading: "Cancel Envelope?", message: 'Are you sure you want to cancel this Envelope? This action cannot be undone.', onNext: () => {
                 this.showCancelDialog = false;
                 this.cancelEnvelope();
             } }))));
@@ -349,10 +390,13 @@ export class VerdocsEnvelopeSidebar {
         return {
             "activeTab": {},
             "panelOpen": {},
-            "showManageDialog": {},
             "showRecipientDialog": {},
             "showCancelDialog": {},
-            "loading": {}
+            "loading": {},
+            "remindersEnabled": {},
+            "updatingReminders": {},
+            "initialReminder": {},
+            "followupReminders": {}
         };
     }
     static get events() {

package/dist/collection/components/envelopes/verdocs-envelopes-list/verdocs-envelopes-list.js

@@ -191,18 +191,18 @@ export class VerdocsEnvelopesList {
         });
     }
     render() {
-        return (h(Host, { key: '59ef0b8fc3ae12c22594e295fb6c521f4b2422f3' }, h("div", { key: 'dbeeee7bc2e8b4d220b898360097d4e2822bab8d', class: "header" }, h("div", { key: 'ba4e5abd64d769e305290700a70ea577e1a01410', class: "filter" }, h("verdocs-text-input", { key: '1d50c3159fce49afa5b74e0b7070fae63dc3bd7b', id: "verdocs-filter-name", value: this.match, clearable: true, autocomplete: "off", placeholder: "Filter by Name, Recipient, or Field...", onFocusout: (e) => {
+        return (h(Host, { key: '7a00f20ae5c31b9a633d88c21762c3562876fe78' }, h("div", { key: 'a5124808b0ddd25db268f062e41895306dc29aaf', class: "header" }, h("div", { key: '1139d8453c19f0e80a7dccf3be06caf14080709f', class: "filter" }, h("verdocs-text-input", { key: '765d08809106e75b9a65aaf1c2dd231613d954d2', id: "verdocs-filter-name", value: this.match, clearable: true, autocomplete: "off", placeholder: "Filter by Name, Recipient, or Field...", onFocusout: (e) => {
                 var _a;
                 // We don't locally filter envelopes because there are too many fields to match against efficiently.
                 this.match = e.target.value.trim();
                 (_a = this.changeMatch) === null || _a === void 0 ? void 0 : _a.emit(this.match);
-            } })), h("verdocs-quick-filter", { key: 'a48266dee00c69c90a2ac9d7587bef652e9d217a', label: "View", value: this.view, options: ViewFilters, onOptionSelected: e => {
+            } })), h("verdocs-quick-filter", { key: 'bd3ed994b57bfda8134ad9d98ceb92384c535074', label: "View", value: this.view, options: ViewFilters, onOptionSelected: e => {
                 this.view = e.detail.value;
-            } }), this.view === 'all' && (h("verdocs-quick-filter", { key: 'd026d5ad2f2d3d0b76fccac22c7c473fd9a7c883', label: "Status", value: this.status, options: StatusFilters, onOptionSelected: e => {
+            } }), this.view === 'all' && (h("verdocs-quick-filter", { key: '472cc15ce0d48b0c71a280e150f854441e8c0548', label: "Status", value: this.status, options: StatusFilters, onOptionSelected: e => {
                 this.status = e.detail.value;
-            } })), this.view === 'all' && (h("verdocs-quick-filter", { key: '123c21f2f8b4cc7e3c01031dad3176b0bb99f61b', label: "Sort By", value: this.sort, options: SortFilters, onOptionSelected: e => {
+            } })), this.view === 'all' && (h("verdocs-quick-filter", { key: '8913c4ef0c4e5222d116e9baea54066d211e10c2', label: "Sort By", value: this.sort, options: SortFilters, onOptionSelected: e => {
                 this.sort = e.detail.value;
-            } })), this.loading && h("verdocs-spinner", { key: '8239f78abab03fe7e8510f9035b10232d7d69982', mode: "dark", size: 24 }), h("div", { key: '6dd8cf2b5ef5c31ae9675b54b3f0c732c66fae4b', style: { display: 'flex', flex: '1' } }), this.selectedEnvelopes.length > 0 && h("verdocs-button", { key: 'd2784158eaa4a7a6d068b61bac12eaf42bbf7d1a', label: `Download (${this.selectedEnvelopes.length})`, onClick: () => this.handleDownload() })), this.envelopes.map(envelope => {
+            } })), this.loading && h("verdocs-spinner", { key: '191a574650de5061076f939b5ba0657d39dacda0', mode: "dark", size: 24 }), h("div", { key: 'dec432a7d53973a5a5152e1162af3d677af81e1a', style: { display: 'flex', flex: '1' } }), this.selectedEnvelopes.length > 0 && h("verdocs-button", { key: 'ae7f5be9813298b885b1aa0940c614e44af85d85', label: `Download (${this.selectedEnvelopes.length})`, onClick: () => this.handleDownload() })), this.envelopes.map(envelope => {
             var _a;
             const recipientsWithActions = getRecipientsWithActions(envelope);
             const userCanCancel = userCanCancelEnvelope(this.endpoint.profile, envelope);
@@ -243,7 +243,7 @@ export class VerdocsEnvelopesList {
                             break;
                     }
                 } }))));
-        }), !this.initiallyLoaded && (h("div", { key: '2ac72d321f498b86e05767da7696a943dd80e5cd', style: { width: '100%' } }, integerSequence(0, this.rowsPerPage).map(() => (h("div", { class: "envelope-placeholder" }))))), this.initiallyLoaded && !this.envelopes.length && h("div", { key: '3f5c0c044cfd73650df368bb63bb7cf8ac95fc03', class: "empty-text" }, "No matching envelopes found. Please adjust your filters and try again."), this.initiallyLoaded && this.envelopes.length && this.showPagination ? (h("div", { style: { marginTop: '20px' } }, h("verdocs-pagination", { selectedPage: this.selectedPage, perPage: this.rowsPerPage, itemCount: this.count, onSelectPage: e => {
+        }), !this.initiallyLoaded && (h("div", { key: 'c897aa3a14659ce023811609d4e230806c29c470', style: { width: '100%' } }, integerSequence(0, this.rowsPerPage).map(() => (h("div", { class: "envelope-placeholder" }))))), this.initiallyLoaded && !this.envelopes.length && h("div", { key: 'ff60d1d2346009b459fa2ada94e7fdffe9e027e5', class: "empty-text" }, "No matching envelopes found. Please adjust your filters and try again."), this.initiallyLoaded && this.envelopes.length && this.showPagination ? (h("div", { style: { marginTop: '20px' } }, h("verdocs-pagination", { selectedPage: this.selectedPage, perPage: this.rowsPerPage, itemCount: this.count, onSelectPage: e => {
                 this.selectedPage = e.detail.selectedPage;
             } }))) : (h("div", null))));
     }

package/dist/collection/components/envelopes/verdocs-status-indicator/verdocs-status-indicator.js

@@ -238,11 +238,11 @@ export class VerdocsStatusIndicator {
         }
         const icon = this.getStatusIcon(status);
         const statusMessage = this.getStatusMessage(status);
-        return (h(Host, { key: 'd86b4cdd8856bb999cdecbd8314c58fd2d7a4c1a', ref: el => (this.summaryComponent = el), class: `${this.theme} ${this.size} ${this.envelope ? 'has-document' : ''}`, "aria-label": "Click to View Details", onClick: e => {
+        return (h(Host, { key: '96ed56f80adc3b72cffac7ad61c987d61ecf97fb', ref: el => (this.summaryComponent = el), class: `${this.theme} ${this.size} ${this.envelope ? 'has-document' : ''}`, "aria-label": "Click to View Details", onClick: e => {
                 e.stopPropagation();
                 e.preventDefault();
                 this.envelope && this.toggleDropdown();
-            }, onBlur: e => this.envelope && this.handleHideDropdown(e) }, h("span", { key: '8528553b41a85688a6a73270dbe6b94451e53ab9', class: "icon", innerHTML: icon }), h("span", { key: 'd2a5c2c9237f63fb204b059e47d002b2a184924a', class: "content" }, statusMessage), h("div", { key: '592a8c0307ddb80dc2902cffb401b80b9c346e48', class: "detail-panel", ref: el => (this.detailPanel = el) }, h("div", { key: '2c082c319e2661ad2be79a6c674cccf78f37ccde', id: `${this.containerId}` }), this.recipientStatusIcons.map(icon => (h("span", { innerHTML: icon.icon, style: { position: 'absolute', top: `${icon.y}px`, left: `${icon.x}px` } }))))));
+            }, onBlur: e => this.envelope && this.handleHideDropdown(e) }, h("span", { key: '74fd0d79d0c321c186ba1a9fa5b1fe3798d7cac9', class: "icon", innerHTML: icon }), h("span", { key: 'a0a44d7acf6cb17ef1dbf210aaef25e79aaa7247', class: "content" }, statusMessage), h("div", { key: 'a367387674a47bd36568d557cd4c8f1d1defae1b', class: "detail-panel", ref: el => (this.detailPanel = el) }, h("div", { key: 'cfaef5f02fdb7c6a63535d537093a9e1b5e0219e', id: `${this.containerId}` }), this.recipientStatusIcons.map(icon => (h("span", { innerHTML: icon.icon, style: { position: 'absolute', top: `${icon.y}px`, left: `${icon.x}px` } }))))));
     }
     static get is() { return "verdocs-status-indicator"; }
     static get originalStyleUrls() {

package/dist/collection/components/templates/verdocs-template-card/verdocs-template-card.js

@@ -12,7 +12,7 @@ export class VerdocsTemplateCard {
     }
     render() {
         var _a, _b, _c, _d;
-        return (h(Host, { key: '5bc4a692f23987520b72c81283195e81b109ce45' }, h("span", { key: 'b5df9c27e7c2261a7c001510f79ae8c98087a419', class: "name" }, this.template.name), h("span", { key: '8f5b9ae0fd9fd777d0583258afb66abf046abe80', class: "org-name" }, ((_a = this.template.organization) === null || _a === void 0 ? void 0 : _a.name) || 'Public'), h("hr", { key: 'aa4b2185a5d15eff67c382e1b102672e6bb590b6' }), h("div", { key: '06f46bdab531cccb03c41c28467e04ac91849d0c', class: "controls" }, h("div", { key: '4ecc7677cf1e71e8f173d74da2d2ce7c47f761bd', class: "control" }, h("span", { key: 'fc0205562fcbdb340367566f240e0f89c5757963', class: "icon", innerHTML: StarIcon }), h("span", { key: '1922c75e74751dcad1b078e098572222103500fd', class: "value" }, this.template.star_counter)), h("div", { key: '50dda33468212c058ff3d51ca387cd1534bae983', class: "control secondary" }, h("span", { key: '7304ccb8a32ca382d4821c0bfb319616ebb68080', class: "icon", innerHTML: PagesIcon }), h("span", { key: 'ffd067aa17dee9d3376d9e6ce3fd27b840dcd2d2', class: "value" }, ((_d = (_c = (_b = this.template) === null || _b === void 0 ? void 0 : _b.documents) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.pages) || 1)), h("div", { key: '031b25d2005e39e2a90f7337bd6eb9ee77fe2320', class: "control secondary" }, h("span", { key: 'e1cb98119e217c59be551f5f42ca3e03a434a7e4', class: "icon", innerHTML: EmailIcon }), h("span", { key: 'f8921ee58299d79d468a7206adcf06e083c71ba1', class: "value" }, this.template.counter)), h("span", { key: '89f87475b502f97fb8203bd97c15785bb1436051', class: "additional-controls", innerHTML: ActionsIcon }))));
+        return (h(Host, { key: '70fdd3656af0e09d195fe642617864f9e3f040d8' }, h("span", { key: '1f54e749222616d176cd423f46d41e5e0bf43f96', class: "name" }, this.template.name), h("span", { key: '9412db1396f31902d263223bd6eddec6a4c24566', class: "org-name" }, ((_a = this.template.organization) === null || _a === void 0 ? void 0 : _a.name) || 'Public'), h("hr", { key: '48db04497600cdc36a815aadb8880e43444984b9' }), h("div", { key: 'b2076c53a8490886e781fb518902189c0ab15ed4', class: "controls" }, h("div", { key: 'adf1aaeda56bdbbb9fadc781c586ecbd2f5ac668', class: "control" }, h("span", { key: '5489262deab391195f56d4a2291ca9ce4a42beb5', class: "icon", innerHTML: StarIcon }), h("span", { key: 'edc26b6674f6c007a37cbd0ea3274629ffec6bfc', class: "value" }, this.template.star_counter)), h("div", { key: '110575e5f51ce9b44de8bc2856b40949fda7b044', class: "control secondary" }, h("span", { key: 'af5e59792c2745fb13c4267fbab9753c9cc4793d', class: "icon", innerHTML: PagesIcon }), h("span", { key: '229253b847711aed2021f63f2d59b3a6f5de70a1', class: "value" }, ((_d = (_c = (_b = this.template) === null || _b === void 0 ? void 0 : _b.documents) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.pages) || 1)), h("div", { key: 'ffbe166e6d627cb6404b8245829e3530b30b1ed1', class: "control secondary" }, h("span", { key: '70b5ec65e32b455494458844184bdd296d0a53d7', class: "icon", innerHTML: EmailIcon }), h("span", { key: '9148860c1252f2f307e9e018d583fbe745264c92', class: "value" }, this.template.counter)), h("span", { key: '62876a7d469ef34274efdff117aaf8b93e89d5f4', class: "additional-controls", innerHTML: ActionsIcon }))));
     }
     static get is() { return "verdocs-template-card"; }
     static get originalStyleUrls() {

package/dist/collection/components/templates/verdocs-template-document-page/verdocs-template-document-page.js

@@ -94,7 +94,7 @@ export class VerdocsTemplateDocumentPage {
     }
     render() {
         const height = `${this.renderedHeight}px`;
-        return (h(Host, { key: 'c469b9e9a69dbc9ee48b985e2bfe4c6d8667b882', id: `${this.containerId}`, style: { height, flex: `0 0 ${height}` } }, this.layers.map(layer => layer.type === 'div' ? (h("div", { class: "verdocs-template-document-page-layer", id: `${this.containerId}-${layer.name}`, style: { height } }, layer.name === 'controls' &&
+        return (h(Host, { key: 'd40813635689bf60af13c6f719fd3660cd3acf1b', id: `${this.containerId}`, style: { height, flex: `0 0 ${height}` } }, this.layers.map(layer => layer.type === 'div' ? (h("div", { class: "verdocs-template-document-page-layer", id: `${this.containerId}-${layer.name}`, style: { height } }, layer.name === 'controls' &&
             this.fieldStore
                 .get('fields')
                 .filter(field => field && field.page === this.pageNumber)

package/dist/collection/components/templates/verdocs-template-role-properties/verdocs-template-role-properties.js

@@ -116,34 +116,34 @@ export class VerdocsTemplateRoleProperties {
     }
     render() {
         const hasFields = this.fieldStore.get('fields').some(field => field.role_name === this.roleName);
-        return (h(Host, { key: '6e6cb2bb3c63490f4179d5bf784563d9c576357b' }, h("div", { key: '33740faf11b300119982418adda618eeec9ed218', class: "background-overlay", onClick: e => this.handleCancel(e) }, h("div", { key: 'a9529d639d6de02027512439adf6107ee2a3c4d0', class: "dialog" }, h("form", { key: 'ace2ebd0ab4d75f3a6f23243a559b7fe44a4a1da', onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("verdocs-text-input", { key: 'e1880fa8e7cc392cc0c5adc5060c6133e867e878', id: "verdocs-role-name", label: "Role Name", value: this.name, autocomplete: "off", disabled: hasFields, helpText: hasFields
+        return (h(Host, { key: '4daf88d47395c6a637137dc350b353e1854c1bdb' }, h("div", { key: '69dd4130a4712b21dd7d460008da99b58b4b82f6', class: "background-overlay", onClick: e => this.handleCancel(e) }, h("div", { key: '2b0a6f1cae1f6c5eef01ecae23e171ca7dc4e518', class: "dialog" }, h("form", { key: '607ab181a995a9b3112e05a8a00d17b979283a23', onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("verdocs-text-input", { key: '1b689cf1db96209f7734e7a4bb7a3eee822d3537', id: "verdocs-role-name", label: "Role Name", value: this.name, autocomplete: "off", disabled: hasFields, helpText: hasFields
                 ? 'This role has fields assigned and can no longer be renamed.'
                 : 'A unique name to identify the role in the workflow. Submitted data will also be tagged with this value.', placeholder: "Role Name...", onInput: (e) => {
                 this.name = e.target.value;
                 this.dirty = true;
-            } }), h("div", { key: '18a69fe4e7a2171adf92a258071d5e792dc7c9c4', class: "row" }, h("div", { key: 'c89480026dd7b6181c2c173af6132ef957843602', class: "input-label" }, "Type:"), h("verdocs-select-input", { key: '087d26e755588ca924b007338ec4fc46859b0225', value: this.type, options: [
+            } }), h("div", { key: 'da279c9f7ee9ec204c92ebc597b666922c920281', class: "row" }, h("div", { key: 'e5a0b4250480afb5dad0174c674505dadf843a7a', class: "input-label" }, "Type:"), h("verdocs-select-input", { key: '7b7c22a7121038faedb2c6992412e04401045b44', value: this.type, options: [
                 { label: 'Signer', value: 'signer' },
                 { label: 'CC', value: 'cc' },
                 { label: 'Approver', value: 'approver' },
             ], onInput: (e) => {
                 this.type = e.target.value;
                 this.dirty = true;
-            } }), h("verdocs-help-icon", { key: '9aa100ef1af757d7affca4d14ae2a1c6fe55bc61', text: "Most participants are Signers. CC roles are notified when documents are signed, but have no other actions. Approvers get notified when signing is completed to perform a final review." })), h("verdocs-text-input", { key: '8c5f330906aed90c1fcda842ce17b94db927c600', id: "verdocs-recipient-first", label: "First Name", value: this.first_name, autocomplete: "off", helpText: "The recipient's first name, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "First Name...", onInput: (e) => {
+            } }), h("verdocs-help-icon", { key: '1763f108ce1d03ea9bed960375677c03017e0f7e', text: "Most participants are Signers. CC roles are notified when documents are signed, but have no other actions. Approvers get notified when signing is completed to perform a final review." })), h("verdocs-text-input", { key: 'b1b6901b5cb217774f757ede3baefcac85035f19', id: "verdocs-recipient-first", label: "First Name", value: this.first_name, autocomplete: "off", helpText: "The recipient's first name, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "First Name...", onInput: (e) => {
                 this.first_name = e.target.value;
                 this.dirty = true;
-            } }), h("verdocs-text-input", { key: '3a331607503a0eb57bdc618a160e70dff1c1a8ee', id: "verdocs-recipient-first", label: "Last Name", value: this.last_name, autocomplete: "off", helpText: "The recipient's last name, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Last Name...", onInput: (e) => {
+            } }), h("verdocs-text-input", { key: '7cd4144f5a59882a39705753bf4f15d4d205c979', id: "verdocs-recipient-first", label: "Last Name", value: this.last_name, autocomplete: "off", helpText: "The recipient's last name, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Last Name...", onInput: (e) => {
                 this.last_name = e.target.value;
                 this.dirty = true;
-            } }), h("verdocs-text-input", { key: '85c7d12bbbe606c7d95043cb6050339ee82c3e28', id: "verdocs-recipient-email", label: "Email", value: this.email, autocomplete: "off", helpText: "The recipient's email address, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Email Address...", onInput: (e) => {
+            } }), h("verdocs-text-input", { key: 'e6628edbd864a77cf470a9175b3aff55f0be4681', id: "verdocs-recipient-email", label: "Email", value: this.email, autocomplete: "off", helpText: "The recipient's email address, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Email Address...", onInput: (e) => {
                 this.email = e.target.value;
                 this.dirty = true;
-            } }), h("verdocs-text-input", { key: '01a543ee70419c8ada3affb7da7d800222ee69e7', id: "verdocs-recipient-phone", label: "Phone", value: this.phone, autocomplete: "off", helpText: "The recipient's phone number, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Phone Number...", onInput: (e) => {
+            } }), h("verdocs-text-input", { key: 'ce90cd8517539331590cd2ff697e07533a7b5902', id: "verdocs-recipient-phone", label: "Phone", value: this.phone, autocomplete: "off", helpText: "The recipient's phone number, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Phone Number...", onInput: (e) => {
                 this.phone = e.target.value;
                 this.dirty = true;
-            } }), h("div", { key: '00d4b434f9a140163ceb950c79ee081516ec3c8b', class: "row" }, h("div", { key: '8a86970a08bf555662726f8f949c873b3915640e', class: "input-label" }, "May Delegate:"), h("div", { key: '50c6ce67bcb1363aff57d0d2700c1939f06f21ff', class: "checkbox-wrapper" }, h("verdocs-checkbox", { key: 'd060961d1b527120ec5600642933b71b5619784f', checked: this.delegator, onInput: (e) => {
+            } }), h("div", { key: '9510615197a8c28d4522822e6753af993e965fab', class: "row" }, h("div", { key: 'b2958e2c6fdee7548aa53785c718c2aac9533711', class: "input-label" }, "May Delegate:"), h("div", { key: 'e7420c6088db970a53fb257bddf1fa4cf5f4eb37', class: "checkbox-wrapper" }, h("verdocs-checkbox", { key: '5964f954a0390b38018a0644f9caf8e3b08bb766', checked: this.delegator, onInput: (e) => {
                 this.delegator = e.target.checked;
                 this.dirty = true;
-            } })), h("verdocs-help-icon", { key: '5b5d456123d0dd9084fbd5a139ca99ddd4b3788f', text: "If enabled, this recipient may delegate their actions to another individual." })), h("div", { key: '767efd207da665b5da38a30242b039422d1e5fe2', class: "buttons" }, h("button", { key: 'd65e7a9fd071cb9de2c4fb791d071911935656ec', class: "delete-button", disabled: this.dirty, onClick: e => this.handleDelete(e), innerHTML: TrashIcon }), h("div", { key: '45a18048294d452f96c54c36588091600e4296d0', style: { flex: '1' } }), h("verdocs-button", { key: '2ca9a7bf95418813684cc68a96446cfd30fe72f9', size: "small", variant: "outline", label: "Cancel", disabled: !this.dirty, onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: 'ec996494a3f9dfecdb4652a4ce2ef7cb058dfcfb', size: "small", label: "Save", disabled: !this.dirty, onClick: e => this.handleSave(e) })))))));
+            } })), h("verdocs-help-icon", { key: '0cce6b44830647f915f0a0c3940247003254e4ef', text: "If enabled, this recipient may delegate their actions to another individual." })), h("div", { key: '0caae2f472d4013ac76af0cdfc9084b07bee3e6c', class: "buttons" }, h("button", { key: '8bd1ac63a0c6f9355847e1f6babc12dadc29d9c8', class: "delete-button", disabled: this.dirty, onClick: e => this.handleDelete(e), innerHTML: TrashIcon }), h("div", { key: 'd7caf9d0c3ca362043dc9c05cb8f11e73519739b', style: { flex: '1' } }), h("verdocs-button", { key: '33c37de3faedffd4e9f5448084aeb0c3269dfa16', size: "small", variant: "outline", label: "Cancel", disabled: !this.dirty, onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: 'c5e2c7fa597efae316316431fd548ec166a38d86', size: "small", label: "Save", disabled: !this.dirty, onClick: e => this.handleSave(e) })))))));
     }
     static get is() { return "verdocs-template-role-properties"; }
     static get originalStyleUrls() {

package/dist/collection/components/templates/verdocs-template-sender/verdocs-template-sender.js

@@ -61,7 +61,7 @@ export class VerdocsTemplateSender {
         });
     }
     render() {
-        return (h(Host, { key: 'f68de757047cf08e13ca4b5f33e28c0af48fc216' }, h("div", { key: '6d1d7f7fc65b8ec2112dc7c33750cfce5d4f3e8c', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '4d89b066209259145a82549e572b558fc11cf884', class: "dialog" }, h("div", { key: 'fe42cd60ee5ed150318152a21db7bd0bfd41bb6f', class: "options" }, h("div", { key: '5e6193483c37781365aabccef51a67ff56ff937e', class: "option" }, h("verdocs-radio-button", { key: 'ea3ece13bab53d052186194b9708c7a072335103', name: "template-sender", value: 'everyone', checked: this.sender === 'everyone', onInput: () => this.handleSelectSetting('everyone') }), h("div", { key: '785b66f5cc26579d6caafc85924c5ad7e3966d40', class: "description" }, h("div", { key: 'd82d392c83f757ff7f23d5e78bfd68ab97eb0f52', class: "name" }, "Anyone on the Web"), h("verdocs-help-icon", { key: '34f2139c6e1f4cf01bb497066fea7000837c3ee9', text: "Anyone can use this template. (Make its visibility is set to to 'Public' or 'Shared'.)" }))), h("div", { key: '1b20cb65e1ed7bdf317e6af82b5b445f988e98c8', class: "option" }, h("verdocs-radio-button", { key: '236a72f8c58ab2a2ad52824c698b8e0367881c3c', name: "template-sender", value: 'everyone_as_creator', checked: this.sender === 'everyone_as_creator', onInput: () => this.handleSelectSetting('everyone_as_creator') }), h("div", { key: '5e23b141d9d9c126ac2c82ab30bcb279b73d4793', class: "description" }, h("div", { key: 'f9b6deeff27abb6ae722cc8b70aa662c400108b7', class: "name" }, "Anyone on the Web as me"), h("verdocs-help-icon", { key: '03982e3624ba4e858fd478e8dc5c8ee0a1b98f3f', text: "Anyone can use this template on my behalf. (Make sure its visibility is set to 'Public' or 'Shared'.)" }))), h("div", { key: 'db8d9acd7b3a06a6f09a5fb03ca8403dc82db00c', class: "option" }, h("verdocs-radio-button", { key: 'a12f063f0ff6e06eb5aaff35b815621e5b06d8b3', name: "template-sender", value: 'organization_member', checked: this.sender === 'organization_member', onInput: () => this.handleSelectSetting('organization_member') }), h("div", { key: 'acfba148b6c50fac0a3d72a6f46b3a5f144d3986', class: "description" }, h("div", { key: '3120e3ed05176dfc34ce482d359274755dcb55dc', class: "name" }, "Anyone in my organization"), h("verdocs-help-icon", { key: '0e78f7bc767c863d53ed113c52584252f893ecc4', text: "Anyone in my organization can use this template. (Make sure its visibility is set to 'Shared')" }))), h("div", { key: 'ac2f56ad77d0d4aeef9d311e7b44a5c9d19a74c7', class: "option" }, h("verdocs-radio-button", { key: '433e69e8fb00ee8676ec46657ad5c19df76ddd6c', name: "template-sender", value: 'organization_member_as_creator', checked: this.sender === 'organization_member_as_creator', onInput: () => this.handleSelectSetting('organization_member_as_creator') }), h("div", { key: 'ff50c7fee92e6cce3e488b4a4df2274ada44b11a', class: "description" }, h("div", { key: 'de3fd4b8f985e7f348a3743fb7431d4f9ad66598', class: "name" }, "Anyone in my organization as me"), h("verdocs-help-icon", { key: '257a87eb54dbfceb8edbeffca997fe787916ddc8', text: "Anyone in my organization can use this template on my behalf. (Make sure its visibility is set to to 'Shared'.)" }))), h("div", { key: 'f9223854c2616a85d057b7d7208e82ba85413556', class: "option" }, h("verdocs-radio-button", { key: 'c74d08475eb3601c21e75916366908c15c652ba8', name: "template-sender", value: 'creator', checked: this.sender === 'creator', onInput: () => this.handleSelectSetting('creator') }), h("div", { key: '9af51dd805406c23c9fc081d284d661e16f69f0a', class: "description" }, h("div", { key: '16b852696b984473a5dbfc09345dffbc6f3e0a40', class: "name" }, "Me"), h("verdocs-help-icon", { key: '104c0ec597a028b30dcc0d6e00a0bcac0433b0c9', text: "Only I can use this template." })))), h("div", { key: 'ce8b9f36df6c8beab9305dec9d3acc64f5369d07', class: "buttons" }, h("verdocs-button", { key: '722df3e64f41b5c8aee45d66eaa13b33711bba5c', label: "Close", onClick: () => this.handleClose() }))))));
+        return (h(Host, { key: '091ab4be35bc34c3a26242c049f86f674af41e8f' }, h("div", { key: 'd6ab34f28492f84ca36e53e090100512c9bde484', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '14f29acabd224f7547aaedff0a25627cb5381e80', class: "dialog" }, h("div", { key: 'f13bcde2de6738d60055325c607b3b2c409a9dbe', class: "options" }, h("div", { key: '63255db61a5e55d2a4907114614acf6febe85075', class: "option" }, h("verdocs-radio-button", { key: '24a9e9a143e6d298f25a08bdf753b56de1c04961', name: "template-sender", value: 'everyone', checked: this.sender === 'everyone', onInput: () => this.handleSelectSetting('everyone') }), h("div", { key: '45b08d31cc9984e779f8f7789f02f581fc12101c', class: "description" }, h("div", { key: '0fa098f2f7c81e2839b8bba9f5c9d5e9bcb67bab', class: "name" }, "Anyone on the Web"), h("verdocs-help-icon", { key: '31f1d12db9ca50d9b86bbceac2253d4134393e5b', text: "Anyone can use this template. (Make its visibility is set to to 'Public' or 'Shared'.)" }))), h("div", { key: 'f95a9c8e058ef6917d44974d83c6bdd1ec2733ca', class: "option" }, h("verdocs-radio-button", { key: '41ed48647f192747c9a4a490c471689a9ca6a575', name: "template-sender", value: 'everyone_as_creator', checked: this.sender === 'everyone_as_creator', onInput: () => this.handleSelectSetting('everyone_as_creator') }), h("div", { key: '9026a65b7f9b34a3e5b085b6e4f4c4052eafbf78', class: "description" }, h("div", { key: '2c2f2c8d668be05577ff42564f43d3d8149838a7', class: "name" }, "Anyone on the Web as me"), h("verdocs-help-icon", { key: 'd5305c9a396ac5de055b98d5fe70671f6f00fae0', text: "Anyone can use this template on my behalf. (Make sure its visibility is set to 'Public' or 'Shared'.)" }))), h("div", { key: 'e544fbc077842d42bdf8ac186c6b525e352441ab', class: "option" }, h("verdocs-radio-button", { key: 'eec6b7321b00015569012bbf2e99849aad6dc8e6', name: "template-sender", value: 'organization_member', checked: this.sender === 'organization_member', onInput: () => this.handleSelectSetting('organization_member') }), h("div", { key: '031b5b54ae322568a0e1203b40861cbba6a941e5', class: "description" }, h("div", { key: 'f387fed36eaa666a84aa39eda8a93f463a808978', class: "name" }, "Anyone in my organization"), h("verdocs-help-icon", { key: '4079377c2b8344ee474adddea623da565dcd90fd', text: "Anyone in my organization can use this template. (Make sure its visibility is set to 'Shared')" }))), h("div", { key: '7ec74675f7f73b9cb2393e44561524979324a407', class: "option" }, h("verdocs-radio-button", { key: 'cf745f64e9db88e7b8470613000a17531a067bd2', name: "template-sender", value: 'organization_member_as_creator', checked: this.sender === 'organization_member_as_creator', onInput: () => this.handleSelectSetting('organization_member_as_creator') }), h("div", { key: '27584bfc38bcdf136aa2afdf692fa6f883f01fa2', class: "description" }, h("div", { key: '077a63531ff1795f5522632615630fbef4729dbe', class: "name" }, "Anyone in my organization as me"), h("verdocs-help-icon", { key: '65a488ed62f89339fa1721e0f29fe4152048e4e6', text: "Anyone in my organization can use this template on my behalf. (Make sure its visibility is set to to 'Shared'.)" }))), h("div", { key: 'e3466413793e527653545753035737c7f17c4813', class: "option" }, h("verdocs-radio-button", { key: '399790cdb86075a91f3db93485ffa0d91e48a0ac', name: "template-sender", value: 'creator', checked: this.sender === 'creator', onInput: () => this.handleSelectSetting('creator') }), h("div", { key: '8b30d713537b542d96aac5ac4cb9bc7af425a42b', class: "description" }, h("div", { key: '5dd8a9ddf591f400aeebad03cb8daf7cf0966499', class: "name" }, "Me"), h("verdocs-help-icon", { key: '8dc834a6fb5acfd6b2239e80ba97178fef0b70b1', text: "Only I can use this template." })))), h("div", { key: 'c4e71870732c8d5bf444f0d4690944d19a74f093', class: "buttons" }, h("verdocs-button", { key: '46bd6ed671c63a94b0fbdbb4852e27300fd563c4', label: "Close", onClick: () => this.handleClose() }))))));
     }
     static get is() { return "verdocs-template-sender"; }
     static get originalStyleUrls() {

package/dist/collection/components/templates/verdocs-template-star/verdocs-template-star.js

@@ -38,7 +38,7 @@ export class VerdocsTemplateStar {
         });
     }
     render() {
-        return (h(Host, { key: '0bfc2a29037c8753d08852eb5b0d0e7ccae821fc' }, h("div", { key: '16441206c390f010d43fddf52df556f503f2309b', class: `star ${this.updating ? 'updating' : ''}`, innerHTML: this.template.star_counter ? SolidStarIcon : OutlineStarIcon, onClick: e => this.toggle(e) }), h("div", { key: '0b7ed0bba53a2e243c47195efcb09934d056d479', class: "count" }, this.template.star_counter || '--')));
+        return (h(Host, { key: 'a70877334388bd0528a03f3ae08cd479c7dacecc' }, h("div", { key: '09f9dbd54bc662778c48d4663312c0043d694aea', class: `star ${this.updating ? 'updating' : ''}`, innerHTML: this.template.star_counter ? SolidStarIcon : OutlineStarIcon, onClick: e => this.toggle(e) }), h("div", { key: '74a45d4e3153623bd4d9e7f2e66bd561b1ecfcb3', class: "count" }, this.template.star_counter || '--')));
     }
     static get is() { return "verdocs-template-star"; }
     static get originalStyleUrls() {

package/dist/collection/components/templates/verdocs-template-tags/verdocs-template-tags.js

@@ -8,7 +8,7 @@ export class VerdocsTemplateTags {
     }
     render() {
         var _a;
-        return (h(Host, { key: '7926f67d015abdbf2fd62f970974757df81a846b' }, (_a = this.tags) === null || _a === void 0 ? void 0 : _a.map(tag => (h("span", null, tag)))));
+        return (h(Host, { key: '59cfe825d9ab3fbbbf799e392fc5e35a63d39e9e' }, (_a = this.tags) === null || _a === void 0 ? void 0 : _a.map(tag => (h("span", null, tag)))));
     }
     static get is() { return "verdocs-template-tags"; }
     static get originalStyleUrls() {

package/dist/collection/utils/EnvelopeStore.js

@@ -1,6 +1,6 @@
+import { undefined } from "zod";
 import { createStore } from "@stencil/store";
 import { getEnvelope } from "@verdocs/js-sdk";
-import { undefined } from "zod";
 const createEnvelopeStore = (envelopeId) => {
     const now = new Date().toISOString();
     return createStore({
@@ -19,17 +19,18 @@ const createEnvelopeStore = (envelopeId) => {
         created_at: now,
         updated_at: now,
         canceled_at: null,
-        initial_reminder: 0,
-        followup_reminders: 0,
         visibility: 'private',
         recipients: [],
-        profile: null,
         access_keys: [],
         data: undefined,
-        history_entries: [],
-        organization: null,
         search_key: '',
+        initial_reminder: null,
+        followup_reminders: null,
+        next_reminder: null,
+        profile: null,
+        organization: null,
         template: null,
+        history_entries: [],
         documents: [],
         fields: [],
     });
@@ -84,3 +85,6 @@ export const getEnvelopeStore = async (endpoint, envelopeId, forceReload = false
     }
     return store;
 };
+export const updateStoreEnvelope = (store, envelope) => {
+    Object.assign(store.state, envelope);
+};

package/dist/collection/utils/TemplateFieldStore.js

@@ -27,12 +27,10 @@ export const createTemplateFieldStoreFromEnvelope = (envelope) => {
 export const updateStoreField = (store, oldName, newFieldData) => {
     const oldFields = store.get('fields') || [];
     if (oldName !== newFieldData.name) {
-        console.log('Renaming', oldName, newFieldData.name);
         const withoutOldField = oldFields.filter(field => field.name !== oldName);
         store.set('fields', [...withoutOldField, newFieldData]);
     }
     else {
-        console.log('Updating', oldName);
         store.set('fields', oldFields.map(field => (field.name === oldName ? { ...field, ...newFieldData } : { ...field })));
     }
 };

package/dist/components/EnvelopeStore.js

@@ -1,6 +1,6 @@
+import { u as undefinedType } from './index4.js';
 import { c as createStore } from './index3.js';
 import { getEnvelope } from '@verdocs/js-sdk';
-import { u as undefinedType } from './index4.js';
 
 const createEnvelopeStore = (envelopeId) => {
     const now = new Date().toISOString();
@@ -20,17 +20,18 @@ const createEnvelopeStore = (envelopeId) => {
         created_at: now,
         updated_at: now,
         canceled_at: null,
-        initial_reminder: 0,
-        followup_reminders: 0,
         visibility: 'private',
         recipients: [],
-        profile: null,
         access_keys: [],
         data: undefinedType,
-        history_entries: [],
-        organization: null,
         search_key: '',
+        initial_reminder: null,
+        followup_reminders: null,
+        next_reminder: null,
+        profile: null,
+        organization: null,
         template: null,
+        history_entries: [],
         documents: [],
         fields: [],
     });
@@ -85,5 +86,8 @@ const getEnvelopeStore = async (endpoint, envelopeId, forceReload = false) => {
     }
     return store;
 };
+const updateStoreEnvelope = (store, envelope) => {
+    Object.assign(store.state, envelope);
+};
 
-export { getEnvelopeStore as g };
+export { getEnvelopeStore as g, updateStoreEnvelope as u };

package/dist/components/TemplateFieldStore.js

@@ -28,12 +28,10 @@ const createTemplateFieldStoreFromEnvelope = (envelope) => {
 const updateStoreField = (store, oldName, newFieldData) => {
     const oldFields = store.get('fields') || [];
     if (oldName !== newFieldData.name) {
-        console.log('Renaming', oldName, newFieldData.name);
         const withoutOldField = oldFields.filter(field => field.name !== oldName);
         store.set('fields', [...withoutOldField, newFieldData]);
     }
     else {
-        console.log('Updating', oldName);
         store.set('fields', oldFields.map(field => (field.name === oldName ? { ...field, ...newFieldData } : { ...field })));
     }
 };

package/dist/components/index.js

@@ -45,6 +45,7 @@ import { VerdocsSign } from './verdocs-sign.js';
 import { VerdocsSignatureDialog } from './verdocs-signature-dialog.js';
 import { VerdocsSpinner } from './verdocs-spinner.js';
 import { VerdocsStatusIndicator } from './verdocs-status-indicator.js';
+import { VerdocsSwitch } from './verdocs-switch.js';
 import { VerdocsTable } from './verdocs-table.js';
 import { VerdocsTabs } from './verdocs-tabs.js';
 import { VerdocsTemplateAttachments } from './verdocs-template-attachments.js';
@@ -120,6 +121,7 @@ const defineCustomElements = (opts) => {
             VerdocsSignatureDialog,
             VerdocsSpinner,
             VerdocsStatusIndicator,
+            VerdocsSwitch,
             VerdocsTable,
             VerdocsTabs,
             VerdocsTemplateAttachments,

package/dist/components/verdocs-dialog.js

@@ -18,7 +18,7 @@ const VerdocsDialog$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsDialog ext
         }
     }
     render() {
-        return (h(Host, { key: '6248990033ba71022795432afa8679841450431e' }, h("div", { key: 'bdea70156c5d1776977bf7947e326ed118367f82', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '5c8cec9a24b0a892aeb2325a87a6d238ad211992', class: "dialog" }, h("slot", { key: '001678f28acc1ca78772dfa2d2f9cb56c6e1074d', name: "title" }, h("div", { key: 'b5c86535f40180659a6e21b31193c6d0cdd0c706', class: "heading" }, "Please Confirm")), h("div", { key: 'e6c8eddfe1c541d34ac2380f78564bc80b736564', class: "content" }, h("slot", { key: '6d22d23df835be6339b7629a21fe3a3a802eb9b9' }))))));
+        return (h(Host, { key: '81c8ede6508a1ce80ce002b0b94b91604e7a2e73' }, h("div", { key: '2e05c3999a88c0d6e16615953054a4658c6f25d7', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '45e7c3d08b5a2cf830a06a0a938c3e43febb79ca', class: "dialog" }, h("slot", { key: '6c4c0e21c52a0a272df32976288734d09183251a', name: "title" }, h("div", { key: 'd3f30f469242351f95d2e20d58adf4e0ff86881e', class: "heading" }, "Please Confirm")), h("div", { key: '4800a431f9c5b5d65da612fd753533fd8469e9e5', class: "content" }, h("slot", { key: '40dcf76ccc8b799262aaba30435ae2692af53cb7' }))))));
     }
     static get style() { return VerdocsDialogStyle0; }
 }, [4, "verdocs-dialog"]);

package/dist/components/verdocs-dropdown2.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 
-const verdocsDropdownCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-dropdown{display:block;position:relative;font-family:\"Inter\", \"Barlow\", sans-serif}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.open .arrow{background:#4c56cb;border:1px solid #707ae5}verdocs-dropdown.open .arrow svg{-webkit-transform:scaleY(-1);transform:scaleY(-1);fill:#fff}#verdocs-dropdown-menu-items{width:200px;z-index:10000;position:absolute;border-radius:5px;background:#33354c;border:1px solid #654dcb}.verdocs-dropdown-menu-separator{height:1px;margin-top:5px;padding-top:5px;border-top:1px solid rgba(255, 255, 255, 0.3725490196)}.verdocs-dropdown-menu-option{width:100%;color:#fff;border:none;display:block;text-align:left;background:none;padding:10px 20px}.verdocs-dropdown-menu-option:hover{cursor:pointer;background:#55bc81}.verdocs-dropdown-menu-option[disabled]{color:#aaaaaa}.verdocs-dropdown-menu-option[disabled]:hover{cursor:inherit;background:transparent;color:#aaaaaa}";
+const verdocsDropdownCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-dropdown{height:26px;display:block;position:relative;font-family:\"Inter\", \"Barlow\", sans-serif}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.open .arrow{background:#4c56cb;border:1px solid #707ae5}verdocs-dropdown.open .arrow svg{-webkit-transform:scaleY(-1);transform:scaleY(-1);fill:#fff}#verdocs-dropdown-menu-items{width:200px;z-index:10000;position:absolute;border-radius:5px;background:#33354c;border:1px solid #654dcb}.verdocs-dropdown-menu-separator{height:1px;margin-top:5px;padding-top:5px;border-top:1px solid rgba(255, 255, 255, 0.3725490196)}.verdocs-dropdown-menu-option{width:100%;color:#fff;border:none;display:block;text-align:left;background:none;padding:10px 20px}.verdocs-dropdown-menu-option:hover{cursor:pointer;background:#55bc81}.verdocs-dropdown-menu-option[disabled]{color:#aaaaaa}.verdocs-dropdown-menu-option[disabled]:hover{cursor:inherit;background:transparent;color:#aaaaaa}";
 const VerdocsDropdownStyle0 = verdocsDropdownCss;
 
 const MENU_ID = 'verdocs-dropdown-menu-items';

package/dist/components/verdocs-envelope-document-page2.js

@@ -76,7 +76,7 @@ const VerdocsEnvelopeDocumentPage = /*@__PURE__*/ proxyCustomElement(class Verdo
     }
     render() {
         const height = `${this.renderedHeight}px`;
-        return (h(Host, { key: 'fb5e7873cb34621236cee2d6b08c36187f5e2687', id: `${this.containerId}`, style: { height, flex: `0 0 ${height}` } }, this.layers.map(layer => layer.type === 'div' ? (h("div", { class: "verdocs-envelope-document-page-layer", id: `${this.containerId}-${layer.name}`, style: { height } })) : this.pageDisplayUri ? (h("img", { class: "verdocs-envelope-document-page-layer img", id: `${this.containerId}-${layer.name}`, src: this.pageDisplayUri, alt: `Page ${this.pageNumber}`, "aria-hidden": true, loading: "lazy", onLoad: (e) => {
+        return (h(Host, { key: 'c047ed0efbc74b5981dbb631999f33af262559f7', id: `${this.containerId}`, style: { height, flex: `0 0 ${height}` } }, this.layers.map(layer => layer.type === 'div' ? (h("div", { class: "verdocs-envelope-document-page-layer", id: `${this.containerId}-${layer.name}`, style: { height } })) : this.pageDisplayUri ? (h("img", { class: "verdocs-envelope-document-page-layer img", id: `${this.containerId}-${layer.name}`, src: this.pageDisplayUri, alt: `Page ${this.pageNumber}`, "aria-hidden": true, loading: "lazy", onLoad: (e) => {
                 // Note that all we really care about is the aspect ratio. We track the natural Width and Height but they aren't really that
                 // useful as individual values. The image will already have been scaled down to fit a DIV for display (100%, auto height).
                 // Builder places fields offset into the rendered display area, not the original document's dimensions. So its X/Y values