@verdocs/web-sdk 2.0.22 → 2.0.25

package/dist/esm/verdocs-envelopes-list.entry.js

@@ -1,9 +1,10 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-151c0874.js';
-import { s as searchEnvelopes, c as cancelEnvelope } from './Envelopes-9ccae245.js';
-import { g as getRecipientsWithActions, a as userCanAct, b as userCanCancelEnvelope } from './Permissions-391258bd.js';
+import { l as listEnvelopes, c as cancelEnvelope } from './Envelopes-5e32159f.js';
+import { g as getRecipientsWithActions, a as userCanAct, b as userCanCancelEnvelope } from './Permissions-f2eb0421.js';
 import './Types-5f31149e.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-d58d5544.js';
-import { s as saveEnvelopesAsZip } from './utils-a3504472.js';
+import { i as integerSequence } from './Primitives-054bc6e5.js';
+import { s as saveEnvelopesAsZip } from './utils-51d998e2.js';
 import { V as VerdocsToast } from './Toast-f3b8fd46.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import './_commonjsHelpers-5ec8f9b7.js';
@@ -11,7 +12,7 @@ import './Files-70a192df.js';
 import './Types-de18e225.js';
 import './index-914ed6f7.js';
 
-const verdocsEnvelopesListCss = "verdocs-envelopes-list{display:-ms-flexbox;display:flex;padding:10px;font-size:18px;-ms-flex-wrap:nowrap;flex-wrap:nowrap;border-radius:6px;color:#33364b;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;font-family:\"Inter\", \"Barlow\", sans-serif}verdocs-envelopes-list .header{width:100%;row-gap:4px;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-column-gap:12px;-moz-column-gap:12px;column-gap:12px;margin:0 0 10px 0;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}verdocs-envelopes-list .header .filter{width:150px}verdocs-envelopes-list .header verdocs-text-input{margin:0}verdocs-envelopes-list .header verdocs-text-input input{height:32px}verdocs-envelopes-list .filter{-ms-flex-align:center;align-items:center}verdocs-envelopes-list .envelope{width:100%;margin:3px 0;background:#ffffff}verdocs-envelopes-list .envelope:hover{cursor:pointer;background:#f5f5fa}verdocs-envelopes-list .envelope .inner{gap:14px;display:-ms-flexbox;display:flex;padding:8px 20px;border-radius:6px;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}verdocs-envelopes-list .envelope .inner svg{width:24px;height:24px}verdocs-envelopes-list .vert-spacer{height:50px;display:-ms-flexbox;display:flex;-ms-flex:0 0 1px;flex:0 0 1px;border-right:1px solid #dad8dd}verdocs-envelopes-list .last-modified{color:#444;display:-ms-flexbox;display:flex;-ms-flex:0 0 180px;flex:0 0 180px;font-size:16px;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;white-space:nowrap}verdocs-envelopes-list .envelope-name{-ms-flex:1;flex:1;display:-ms-flexbox;display:flex;color:#000000;font-size:18px;overflow:hidden;line-height:28px;white-space:nowrap;text-overflow:ellipsis}verdocs-envelopes-list .envelope-recipients{color:#4b5563;font-weight:700;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}verdocs-envelopes-list .empty-text{font-size:20px;text-align:center;margin:16px 0 0 0;padding:80px 80px;border:2px solid #ccc}verdocs-envelopes-list .containing{gap:12px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}";
+const verdocsEnvelopesListCss = "verdocs-envelopes-list{display:-ms-flexbox;display:flex;padding:10px;font-size:18px;-ms-flex-wrap:nowrap;flex-wrap:nowrap;border-radius:6px;color:#33364b;-ms-flex-direction:column;flex-direction:column;font-family:\"Inter\", \"Barlow\", sans-serif}verdocs-envelopes-list .envelope-placeholder{height:48px;-ms-flex:0 0 48px;flex:0 0 48px;margin:5px 0;border-radius:5px;background:#f5f5fa}verdocs-envelopes-list .header{width:100%;row-gap:4px;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-column-gap:12px;-moz-column-gap:12px;column-gap:12px;margin:0 0 10px 0;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}verdocs-envelopes-list .header .filter{width:300px}verdocs-envelopes-list .header verdocs-text-input{margin:0}verdocs-envelopes-list .header verdocs-text-input input{height:32px}verdocs-envelopes-list .filter{-ms-flex-align:center;align-items:center}verdocs-envelopes-list .envelope{width:100%;margin:3px 0;background:#ffffff}verdocs-envelopes-list .envelope:hover{cursor:pointer;background:#f5f5fa}verdocs-envelopes-list .envelope .inner{gap:14px;display:-ms-flexbox;display:flex;padding:8px 20px;border-radius:6px;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}verdocs-envelopes-list .envelope .inner svg{width:24px;height:24px}verdocs-envelopes-list .vert-spacer{height:50px;display:-ms-flexbox;display:flex;-ms-flex:0 0 1px;flex:0 0 1px;border-right:1px solid #dad8dd}verdocs-envelopes-list .last-modified{color:#444;display:-ms-flexbox;display:flex;-ms-flex:0 0 180px;flex:0 0 180px;font-size:16px;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;white-space:nowrap}verdocs-envelopes-list .envelope-name{-ms-flex:1;flex:1;display:-ms-flexbox;display:flex;color:#000000;font-size:18px;overflow:hidden;line-height:28px;white-space:nowrap;text-overflow:ellipsis}verdocs-envelopes-list .envelope-recipients{color:#4b5563;font-weight:700;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}verdocs-envelopes-list .empty-text{font-size:20px;text-align:center;margin:16px 0 0 0;padding:80px 80px;border:2px solid #ccc}verdocs-envelopes-list .containing{gap:12px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}";
 
 const DocumentIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="#000000" viewBox="0 0 24 24" stroke-width="1.5"><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>`;
 const ViewFilters = [
@@ -40,17 +41,23 @@ const SortFilters = [
 const VerdocsEnvelopesList = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
+    this.changeView = createEvent(this, "changeView", 7);
+    this.changeStatus = createEvent(this, "changeStatus", 7);
+    this.changeSort = createEvent(this, "changeSort", 7);
+    this.changeMatch = createEvent(this, "changeMatch", 7);
     this.sdkError = createEvent(this, "sdkError", 7);
     this.viewEnvelope = createEvent(this, "viewEnvelope", 7);
     this.finishLater = createEvent(this, "finishLater", 7);
     this.endpoint = VerdocsEndpoint.getDefault();
     this.view = undefined;
     this.status = 'all';
-    this.sort = 'updated_at';
-    this.name = '';
-    this.containing = '';
+    this.sort = 'created_at';
+    this.match = '';
+    this.showPagination = true;
+    this.rowsPerPage = 10;
     this.selectedPage = 0;
     this.count = 0;
+    this.initiallyLoaded = false;
     this.loading = true;
     this.selectedEnvelopes = [];
     this.envelopes = [];
@@ -64,12 +71,13 @@ const VerdocsEnvelopesList = class {
   handleSortUpdated() {
     return this.queryEnvelopes();
   }
-  handleNameUpdated() {
-    return this.queryEnvelopes();
-  }
-  handleContainingUpdated() {
+  handleMatchUpdated() {
     return this.queryEnvelopes();
   }
+  // @Watch('containing')
+  // handleContainingUpdated() {
+  //   return this.queryEnvelopes();
+  // }
   handlePageUpdated() {
     return this.queryEnvelopes();
   }
@@ -79,30 +87,34 @@ const VerdocsEnvelopesList = class {
       console.log('[ENVELOPES] Must be authenticated');
       return;
     }
-    return this.queryEnvelopes();
+  }
+  async componentDidLoad() {
+    await this.queryEnvelopes();
+    this.initiallyLoaded = true;
   }
   async queryEnvelopes() {
     var _a, _b, _c;
     try {
       this.loading = true;
       let queryParams = {
-        page: this.selectedPage + 1,
-        limit: 10,
+        page: this.selectedPage,
+        sort: this.sort,
+        rows: this.rowsPerPage,
       };
       switch (this.view) {
         case 'all':
           queryParams = {
             ...queryParams,
-            sort_by: this.sort,
-            ascending: this.sort === 'envelope_name',
-            envelope_status: (this.status === 'all' ? ['pending', 'in progress', 'complete', 'declined', 'canceled'] : [this.status]),
+            sort: this.sort,
+            direction: this.sort === 'name' ? 'asc' : 'desc',
+            status: (this.status === 'all' ? ['pending', 'in progress', 'complete', 'declined', 'canceled'] : [this.status]),
           };
           break;
         case 'inbox':
           queryParams = {
             ...queryParams,
             is_recipient: true,
-            sort_by: 'updated_at',
+            sort: 'updated_at',
             recipient_status: ['invited', 'declined', 'opened', 'signed', 'submitted', 'canceled'],
           };
           break;
@@ -110,15 +122,15 @@ const VerdocsEnvelopesList = class {
           queryParams = {
             ...queryParams,
             is_owner: true,
-            sort_by: 'updated_at',
+            sort: 'updated_at',
           };
           break;
         case 'action':
           queryParams = {
             ...queryParams,
-            sort_by: 'updated_at',
+            sort: 'updated_at',
             is_recipient: true,
-            envelope_status: ['pending', 'in progress'],
+            status: ['pending', 'in progress'],
             recipient_status: ['invited', 'opened', 'signed'],
           };
           break;
@@ -126,25 +138,25 @@ const VerdocsEnvelopesList = class {
           queryParams = {
             ...queryParams,
             is_owner: true,
-            sort_by: 'updated_at',
-            ascending: false,
-            envelope_status: ['pending', 'in progress'],
+            sort: 'updated_at',
+            direction: 'desc',
+            status: ['pending', 'in progress'],
           };
           break;
         case 'completed':
           queryParams = {
             ...queryParams,
-            sort_by: 'updated_at',
-            ascending: false,
-            envelope_status: ['complete'],
+            sort: 'updated_at',
+            direction: 'desc',
+            status: ['complete'],
           };
           break;
         default:
           queryParams = {
             ...queryParams,
-            sort_by: 'updated_at',
-            ascending: false,
-            envelope_status: (this.status === 'all' ? ['pending', 'in progress', 'complete', 'declined', 'canceled'] : [this.status]),
+            sort: 'updated_at',
+            direction: 'desc',
+            status: (this.status === 'all' ? ['pending', 'in progress', 'complete', 'declined', 'canceled'] : [this.status]),
           };
       }
       // These filters should only be applied in "View All" mode. Otherwise the user could have set them to something
@@ -152,27 +164,27 @@ const VerdocsEnvelopesList = class {
       // would never return anything).
       if (this.view === 'all') {
         if (this.status !== 'all') {
-          queryParams.envelope_status = [this.status];
+          queryParams.status = [this.status];
         }
       }
       if (this.sort !== 'updated_at') {
-        queryParams.sort_by = this.sort;
-        queryParams.ascending = this.sort === 'envelope_name';
+        queryParams.sort = this.sort;
+        queryParams.direction = this.sort === 'name' ? 'asc' : 'desc';
       }
-      if (this.name.trim()) {
-        queryParams.name = this.name.trim();
+      if (this.match.trim()) {
+        queryParams.match = this.match.trim();
       }
-      if (this.containing.trim()) {
-        queryParams.text_field_value = this.containing.trim();
-      }
-      const response = await searchEnvelopes(this.endpoint, queryParams);
-      this.envelopes = response.result;
+      // if (this.containing.trim()) {
+      //   queryParams.field_value = this.containing.trim();
+      // }
+      const response = await listEnvelopes(this.endpoint, queryParams);
+      this.envelopes = response.records;
       this.count = response.total;
       this.loading = false;
     }
     catch (e) {
-      console.log('[ENVELOPES] Error with preview session', e);
-      this.loading = true;
+      this.loading = false;
+      console.log('[ENVELOPES] Error listing envelopes', 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));
     }
   }
@@ -193,22 +205,18 @@ const VerdocsEnvelopesList = class {
     });
   }
   render() {
-    return (h(Host, null, h("div", { class: "header" }, h("div", { class: "filter" }, h("verdocs-text-input", { id: "verdocs-filter-name", value: this.name, autocomplete: "off", placeholder: "Filter by Name...", onFocusout: (e) => {
-        this.name = e.target.value;
-        return this.queryEnvelopes();
+    return (h(Host, null, h("div", { class: "header" }, h("div", { class: "filter" }, h("verdocs-text-input", { 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", { label: "View", value: this.view, options: ViewFilters, onOptionSelected: e => {
         this.view = e.detail.value;
-        return this.queryEnvelopes();
       } }), this.view === 'all' && (h("verdocs-quick-filter", { label: "Status", value: this.status, options: StatusFilters, onOptionSelected: e => {
         this.status = e.detail.value;
-        return this.queryEnvelopes();
       } })), this.view === 'all' && (h("verdocs-quick-filter", { label: "Sort By", value: this.sort, options: SortFilters, onOptionSelected: e => {
         this.sort = e.detail.value;
-        return this.queryEnvelopes();
-      } })), h("div", { class: "containing" }, h("div", { class: "filter" }, h("verdocs-text-input", { id: "verdocs-filter-containing", value: this.containing, autocomplete: "off", placeholder: "Fields Containing...", onInput: (e) => {
-        this.containing = e.target.value;
-        return this.queryEnvelopes();
-      } }))), this.loading && h("verdocs-spinner", { mode: "dark", size: 24 }), h("div", { style: { display: 'flex', flex: '1' } }), this.selectedEnvelopes.length > 0 && h("verdocs-button", { label: `Download (${this.selectedEnvelopes.length})`, onClick: () => this.handleDownload() })), this.envelopes.map(envelope => {
+      } })), this.loading && h("verdocs-spinner", { mode: "dark", size: 24 }), h("div", { style: { display: 'flex', flex: '1' } }), this.selectedEnvelopes.length > 0 && h("verdocs-button", { label: `Download (${this.selectedEnvelopes.length})`, onClick: () => this.handleDownload() })), this.envelopes.map(envelope => {
       var _a;
       const recipientsWithActions = getRecipientsWithActions(envelope);
       const userCanCancel = userCanCancelEnvelope(this.endpoint.session, envelope);
@@ -248,17 +256,15 @@ const VerdocsEnvelopesList = class {
               break;
           }
         } }))));
-    }), !this.loading && !this.envelopes.length ? (h("div", { class: "empty-text" }, "No matching envelopes found. Please adjust your filters and try again.")) : (h("div", { style: { marginTop: '10px' } }, h("verdocs-pagination", { selectedPage: this.selectedPage, perPage: 10, itemCount: this.count, onSelectPage: e => {
+    }), !this.initiallyLoaded && (h("div", { style: { width: '100%' } }, integerSequence(0, this.rowsPerPage).map(() => (h("div", { class: "envelope-placeholder" }))))), this.initiallyLoaded && !this.envelopes.length && h("div", { 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;
-        return this.queryEnvelopes();
-      } })))));
+      } }))) : (h("div", null))));
   }
   static get watchers() { return {
     "view": ["handleViewUpdated"],
     "status": ["handleStatusUpdated"],
     "sort": ["handleSortUpdated"],
-    "name": ["handleNameUpdated"],
-    "containing": ["handleContainingUpdated"],
+    "match": ["handleMatchUpdated"],
     "selectedPage": ["handlePageUpdated"]
   }; }
 };

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

@@ -1,8 +1,8 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-151c0874.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-a3504472.js';
+import { g as getFieldSettings } from './utils-51d998e2.js';
 import './_commonjsHelpers-5ec8f9b7.js';
-import './Envelopes-9ccae245.js';
+import './Envelopes-5e32159f.js';
 import './Types-5f31149e.js';
 import './Files-70a192df.js';
 import './Types-de18e225.js';

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

@@ -1,8 +1,8 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-151c0874.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-a3504472.js';
+import { g as getFieldSettings } from './utils-51d998e2.js';
 import './_commonjsHelpers-5ec8f9b7.js';
-import './Envelopes-9ccae245.js';
+import './Envelopes-5e32159f.js';
 import './Types-5f31149e.js';
 import './Files-70a192df.js';
 import './Types-de18e225.js';

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

@@ -1,10 +1,10 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-151c0874.js';
-import { g as getFieldSettings } from './utils-a3504472.js';
+import { g as getFieldSettings } from './utils-51d998e2.js';
 import { g as getRGBA } from './Colors-1b298092.js';
 import { a as FORMAT_DATE } from './Types-de18e225.js';
 import { f as format } from './index-914ed6f7.js';
 import './_commonjsHelpers-5ec8f9b7.js';
-import './Envelopes-9ccae245.js';
+import './Envelopes-5e32159f.js';
 import './Types-5f31149e.js';
 import './Files-70a192df.js';
 

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

@@ -1,8 +1,8 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-151c0874.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-a3504472.js';
+import { g as getFieldSettings } from './utils-51d998e2.js';
 import './_commonjsHelpers-5ec8f9b7.js';
-import './Envelopes-9ccae245.js';
+import './Envelopes-5e32159f.js';
 import './Types-5f31149e.js';
 import './Files-70a192df.js';
 import './Types-de18e225.js';

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

@@ -1,8 +1,8 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-151c0874.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-a3504472.js';
+import { g as getFieldSettings } from './utils-51d998e2.js';
 import './_commonjsHelpers-5ec8f9b7.js';
-import './Envelopes-9ccae245.js';
+import './Envelopes-5e32159f.js';
 import './Types-5f31149e.js';
 import './Files-70a192df.js';
 import './Types-de18e225.js';

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

@@ -1,8 +1,8 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-151c0874.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-a3504472.js';
+import { g as getFieldSettings } from './utils-51d998e2.js';
 import './_commonjsHelpers-5ec8f9b7.js';
-import './Envelopes-9ccae245.js';
+import './Envelopes-5e32159f.js';
 import './Types-5f31149e.js';
 import './Files-70a192df.js';
 import './Types-de18e225.js';

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

@@ -1,8 +1,8 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-151c0874.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-a3504472.js';
+import { g as getFieldSettings } from './utils-51d998e2.js';
 import './_commonjsHelpers-5ec8f9b7.js';
-import './Envelopes-9ccae245.js';
+import './Envelopes-5e32159f.js';
 import './Types-5f31149e.js';
 import './Files-70a192df.js';
 import './Types-de18e225.js';

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

@@ -1,8 +1,8 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-151c0874.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-a3504472.js';
+import { g as getFieldSettings } from './utils-51d998e2.js';
 import './_commonjsHelpers-5ec8f9b7.js';
-import './Envelopes-9ccae245.js';
+import './Envelopes-5e32159f.js';
 import './Types-5f31149e.js';
 import './Files-70a192df.js';
 import './Types-de18e225.js';

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

@@ -4,9 +4,9 @@ import './Types-5f31149e.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-d58d5544.js';
 import { u as updateField } from './Fields-c82e6df3.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-a3504472.js';
+import { g as getFieldSettings } from './utils-51d998e2.js';
 import './_commonjsHelpers-5ec8f9b7.js';
-import './Envelopes-9ccae245.js';
+import './Envelopes-5e32159f.js';
 import './Files-70a192df.js';
 import './Types-de18e225.js';
 import './index-914ed6f7.js';

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

@@ -4,9 +4,9 @@ import './Types-5f31149e.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-d58d5544.js';
 import { u as updateField } from './Fields-c82e6df3.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-a3504472.js';
+import { g as getFieldSettings } from './utils-51d998e2.js';
 import './_commonjsHelpers-5ec8f9b7.js';
-import './Envelopes-9ccae245.js';
+import './Envelopes-5e32159f.js';
 import './Files-70a192df.js';
 import './Types-de18e225.js';
 import './index-914ed6f7.js';

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

@@ -1,10 +1,10 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-151c0874.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-a3504472.js';
+import { g as getFieldSettings } from './utils-51d998e2.js';
 import { F as FORMAT_TIMESTAMP } from './Types-de18e225.js';
 import { f as format } from './index-914ed6f7.js';
 import './_commonjsHelpers-5ec8f9b7.js';
-import './Envelopes-9ccae245.js';
+import './Envelopes-5e32159f.js';
 import './Types-5f31149e.js';
 import './Files-70a192df.js';
 

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

@@ -1,9 +1,9 @@
 import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-151c0874.js';
 import { i as integerSequence } from './Primitives-054bc6e5.js';
-import { f as renderedTextWidth } from './utils-a3504472.js';
+import { f as renderedTextWidth } from './utils-51d998e2.js';
 import { c as createPopper } from './popper-15e448b4.js';
 import './_commonjsHelpers-5ec8f9b7.js';
-import './Envelopes-9ccae245.js';
+import './Envelopes-5e32159f.js';
 import './Types-5f31149e.js';
 import './Files-70a192df.js';
 import './Types-de18e225.js';
@@ -13,6 +13,7 @@ const verdocsPaginationCss = "verdocs-pagination{gap:8px;display:-ms-flexbox;dis
 
 const ChevronDoubleLeft = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M18.75 19.5l-7.5-7.5 7.5-7.5m-6 15L5.25 12l7.5-7.5" /></svg>`;
 const ChevronDoubleRight = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M11.25 4.5l7.5 7.5-7.5 7.5m-6-15l7.5 7.5-7.5 7.5" /></svg>`;
+const VISIBLE_PAGES = 5;
 const PageButton = ({ page, selected, onClick }) => {
   let label;
   if (page === 'first') {
@@ -40,12 +41,10 @@ const VerdocsQuickFilter$2 = class {
     (_a = this.selectPage) === null || _a === void 0 ? void 0 : _a.emit({ selectedPage: page });
   }
   render() {
-    const numPages = this.itemCount > 0 ? Math.ceil(this.itemCount / this.perPage) : 0;
-    // If there are 10 pages:
-    //   If page == 0 => firstPage: 0, numPagesToDisplay:
     const firstPage = Math.max(0, this.selectedPage - 2);
-    const numPagesToDisplay = Math.min(numPages, 5);
-    return (h(Host, null, this.selectedPage > 0 && h(PageButton, { page: 'first', selected: this.selectedPage, onClick: () => this.handleSelectPage(0) }), firstPage > 0 && h("div", { class: "ellipsis" }, "..."), integerSequence(firstPage, numPagesToDisplay - firstPage).map(pageNumber => (h(PageButton, { page: pageNumber, selected: this.selectedPage, onClick: page => this.handleSelectPage(+page) }))), numPagesToDisplay < numPages && h("div", { class: "ellipsis" }, "..."), this.selectedPage < numPages - 1 && h(PageButton, { page: 'last', selected: this.selectedPage, onClick: () => this.handleSelectPage(numPages - 1) })));
+    const numPages = this.itemCount > 0 ? Math.ceil(this.itemCount / this.perPage) : 0;
+    const pagesToDisplay = integerSequence(0, Math.ceil(this.itemCount / this.perPage)).slice(firstPage, firstPage + VISIBLE_PAGES);
+    return (h(Host, null, this.selectedPage > 0 && h(PageButton, { page: 'first', selected: this.selectedPage, onClick: () => this.handleSelectPage(0) }), firstPage > 0 && h("div", { class: "ellipsis" }, "..."), pagesToDisplay.map(pageNumber => (h(PageButton, { page: pageNumber, selected: this.selectedPage, onClick: page => this.handleSelectPage(+page) }))), this.selectedPage < numPages - 1 && h("div", { class: "ellipsis" }, "..."), this.selectedPage < numPages - 1 && h(PageButton, { page: 'last', selected: this.selectedPage, onClick: () => this.handleSelectPage(numPages - 1) })));
   }
   get el() { return getElement(this); }
 };

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

@@ -1,11 +1,11 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-151c0874.js';
 import './Types-5f31149e.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-d58d5544.js';
-import { r as renderDocumentField, a as getRoleIndex } from './utils-a3504472.js';
+import { r as renderDocumentField, a as getRoleIndex } from './utils-51d998e2.js';
 import { g as getTemplateStore, a as getRoleNames } from './TemplateStore-01a9d18f.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import './_commonjsHelpers-5ec8f9b7.js';
-import './Envelopes-9ccae245.js';
+import './Envelopes-5e32159f.js';
 import './Files-70a192df.js';
 import './Types-de18e225.js';
 import './index-914ed6f7.js';

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

@@ -4,12 +4,12 @@ import { V as VerdocsEndpoint } from './VerdocsEndpoint-d58d5544.js';
 import { i as isValidEmail, a as isValidPhone } from './Validators-f110bae2.js';
 import { g as getRGBA } from './Colors-1b298092.js';
 import { g as getTemplateStore } from './TemplateStore-01a9d18f.js';
-import { a as getRoleIndex } from './utils-a3504472.js';
+import { a as getRoleIndex } from './utils-51d998e2.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import './index-38d7bc0b.js';
 import './Templates-f90883f7.js';
 import './_commonjsHelpers-5ec8f9b7.js';
-import './Envelopes-9ccae245.js';
+import './Envelopes-5e32159f.js';
 import './Files-70a192df.js';
 import './Types-de18e225.js';
 import './index-914ed6f7.js';

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

@@ -1,11 +1,11 @@
 import { r as registerInstance, c as createEvent, h, H as Host, F as Fragment } from './index-151c0874.js';
-import { e as getSigningSession, t as throttledGetEnvelope, u as updateEnvelopeField, f as updateEnvelopeFieldSignature, h as updateEnvelopeFieldInitials, i as uploadEnvelopeFieldAttachment } from './Envelopes-9ccae245.js';
+import { e as getSigningSession, t as throttledGetEnvelope, u as updateEnvelopeField, f as updateEnvelopeFieldSignature, h as updateEnvelopeFieldInitials, i as uploadEnvelopeFieldAttachment } from './Envelopes-5e32159f.js';
 import { R as RecipientStates } from './Types-5f31149e.js';
 import { e as envelopeRecipientAgree, a as envelopeRecipientDecline, b as envelopeRecipientSubmit } from './Recipients-4ec2138c.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-d58d5544.js';
 import { a as isValidPhone, i as isValidEmail } from './Validators-f110bae2.js';
 import { f as fullNameToInitials, i as integerSequence } from './Primitives-054bc6e5.js';
-import { b as saveAttachment, u as updateDocumentFieldValue, a as getRoleIndex, r as renderDocumentField, c as getFieldId } from './utils-a3504472.js';
+import { b as saveAttachment, u as updateDocumentFieldValue, a as getRoleIndex, r as renderDocumentField, c as getFieldId } from './utils-51d998e2.js';
 import { a as FORMAT_DATE } from './Types-de18e225.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import { V as VerdocsToast } from './Toast-f3b8fd46.js';
@@ -332,10 +332,10 @@ const VerdocsSign = class {
         this.isDone = true;
         // TODO: This is a temporary hack. After submitting, if we immediately show the View component it won't have re-renedered the
         //  pages yet with our submitted data.
-        setTimeout(() => {
-          console.log('[SIGN] Reloading');
-          window.location.reload();
-        }, 1000);
+        // setTimeout(() => {
+        //   console.log('[SIGN] Reloading');
+        //   window.location.reload();
+        // }, 250);
       }
       catch (e) {
         console.log('[SIGN] Error submitting', e);
@@ -471,7 +471,7 @@ const VerdocsSign = class {
           this.isDone = true;
         } })), this.submitting && (h("div", { class: "loading-indicator" }, h("verdocs-loader", null)))));
     }
-    return (h(Host, { class: { agreed: this.agreed } }, !this.agreed && !this.finishLater && (h("div", { class: "intro" }, h("div", { class: "inner" }, "Please review and act on these documents."))), h("div", { id: "verdocs-sign-header" }, h("div", { class: "inner" }, !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" }, this.envelope.name), h("div", { style: { flex: '1' } }))), !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.agreed ? h("div", { class: "cover" }) : h("div", { style: { display: 'none' } }), h("div", { class: "document", style: { paddingTop: this.headerTargetId ? '70px' : '15px' } }, (this.envelope.documents || []).map(envelopeDocument => {
+    return (h(Host, { class: { agreed: this.agreed } }, !this.agreed && !this.finishLater && (h("div", { class: "intro" }, h("div", { class: "inner" }, "Please review and act on these documents."))), h("div", { id: "verdocs-sign-header" }, h("div", { class: "inner" }, !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" }, this.envelope.name), h("div", { style: { flex: '1' } }))), !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.agreed && h("div", { class: "cover" }), h("div", { class: "document", style: { paddingTop: this.headerTargetId ? '70px' : '15px' } }, (this.envelope.documents || []).map(envelopeDocument => {
       const pageNumbers = integerSequence(1, envelopeDocument.page_numbers);
       return (h(Fragment, null, pageNumbers.map(pageNumber => {
         // In signing mode we show the original template page with all the recipient fields so we can show source formatting and

package/dist/esm/verdocs-template-document-page_2.entry.js

@@ -2,10 +2,10 @@ import { r as registerInstance, c as createEvent, h, H as Host, a as getElement
 import './Types-5f31149e.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-d58d5544.js';
 import { g as getTemplateDocumentPageDisplayUri } from './TemplateDocuments-6fd2f4e2.js';
-import { t as throttle } from './utils-a3504472.js';
+import { t as throttle } from './utils-51d998e2.js';
 import { c as createPopper } from './popper-15e448b4.js';
 import './_commonjsHelpers-5ec8f9b7.js';
-import './Envelopes-9ccae245.js';
+import './Envelopes-5e32159f.js';
 import './Files-70a192df.js';
 import './Types-de18e225.js';
 import './index-914ed6f7.js';

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

@@ -4,13 +4,13 @@ import './Types-5f31149e.js';
 import { V as VerdocsEndpoint, T as TemplateSenderTypes } from './VerdocsEndpoint-d58d5544.js';
 import { u as updateField, c as createField } from './Fields-c82e6df3.js';
 import { i as integerSequence } from './Primitives-054bc6e5.js';
-import { a as getRoleIndex, r as renderDocumentField, h as updateCssTransform, i as defaultWidth, j as defaultHeight } from './utils-a3504472.js';
+import { a as getRoleIndex, r as renderDocumentField, h as updateCssTransform, i as defaultWidth, j as defaultHeight } from './utils-51d998e2.js';
 import { g as getTemplateStore, a as getRoleNames } from './TemplateStore-01a9d18f.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import { g as getRGBA } from './Colors-1b298092.js';
 import { u as updateTemplate } from './Templates-f90883f7.js';
 import './_commonjsHelpers-5ec8f9b7.js';
-import './Envelopes-9ccae245.js';
+import './Envelopes-5e32159f.js';
 import './Files-70a192df.js';
 import './Types-de18e225.js';
 import './index-914ed6f7.js';

package/dist/esm/verdocs-templates-list.entry.js

@@ -83,6 +83,7 @@ const VerdocsTemplatesList = class {
     this.loading = true;
     this.confirmDelete = null;
     this.templates = [];
+    this.localNameFilter = '';
   }
   handleSharingUpdated() {
     return this.queryTemplates();
@@ -96,6 +97,9 @@ const VerdocsTemplatesList = class {
   handleNameUpdated() {
     return this.queryTemplates();
   }
+  handlePageUpdated() {
+    return this.queryTemplates();
+  }
   componentWillLoad() {
     this.endpoint.loadSession();
     if (!this.endpoint.session) {
@@ -129,7 +133,8 @@ const VerdocsTemplatesList = class {
       this.loading = false;
     }
     catch (e) {
-      console.log('[TEMPLATES] Error with preview session', e);
+      this.loading = false;
+      console.log('[TEMPLATES] Error listing templates', 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));
     }
   }
@@ -149,9 +154,13 @@ const VerdocsTemplatesList = class {
     });
   }
   render() {
-    return (h(Host, null, h("div", { class: "header" }, h("div", { class: "filter" }, h("verdocs-text-input", { id: "verdocs-filter-name", value: this.name, autocomplete: "off", placeholder: "Filter by Name...", onFocusout: (e) => {
+    // In addition to the server query we also filter locally. This provides a faster UI update
+    // while the onBlur re-queries the server for any new records that now qualify by the filter.
+    const locallyFilteredTemplates = !this.localNameFilter ? this.templates : this.templates.filter(t => t.name.toLowerCase().includes(this.localNameFilter.toLowerCase()));
+    return (h(Host, null, h("div", { class: "header" }, h("div", { class: "filter" }, h("verdocs-text-input", { id: "verdocs-filter-name", value: this.name, clearable: true, autocomplete: "off", placeholder: "Filter by Name...", onInput: (e) => (this.localNameFilter = e.target.value.trim()), onFocusout: (e) => {
         var _a;
-        this.name = e.target.value;
+        this.name = e.target.value.trim();
+        this.localNameFilter = e.target.value.trim();
         (_a = this.changeName) === null || _a === void 0 ? void 0 : _a.emit(this.name);
       } })), h("verdocs-quick-filter", { label: "Sharing", value: this.sharing, options: SharingFilters, onOptionSelected: e => {
         var _a;
@@ -165,7 +174,7 @@ const VerdocsTemplatesList = class {
         var _a;
         this.sort = e.detail.value;
         (_a = this.changeSort) === null || _a === void 0 ? void 0 : _a.emit(this.sort);
-      } }), this.loading && h("verdocs-spinner", { mode: "dark", size: 24 }), h("div", { style: { display: 'flex', flex: '1' } })), this.templates.map(template => {
+      } }), this.loading && h("verdocs-spinner", { mode: "dark", size: 24 }), h("div", { style: { display: 'flex', flex: '1' } })), locallyFilteredTemplates.map(template => {
       const dateToShow = this.sort === 'created_at' ? 'created_at' : this.sort === 'updated_at' ? 'updated_at' : 'last_used_at';
       const date = template[dateToShow];
       const MENU_OPTIONS = [];
@@ -203,14 +212,14 @@ const VerdocsTemplatesList = class {
         } }, h("div", { class: "inner" }, h("verdocs-template-star", { template: template, endpoint: this.endpoint }), h("div", { class: "spacer icon-spacer" }), h("div", { class: "name" }, template.name), h("div", { class: "spacer usage-spacer" }), h("div", { class: "usage" }, h("span", { innerHTML: EnvelopeIcon, title: "Usage Counter" }), template.counter || '--'), h("div", { class: "spacer last-used-spacer" }), h("div", { class: "last-used" }, dateToShow === 'created_at' && h("span", { innerHTML: CreatedIcon, title: "Created" }), dateToShow === 'updated_at' && h("span", { innerHTML: UpdatedIcon, title: "Last Updated" }), dateToShow === 'last_used_at' && h("span", { innerHTML: LastUsedIcon, title: "Last Used" }), date ? format(new Date(date), 'P') : 'Never'), h("div", { class: "spacer ownership-spacer" }), template.is_public && (h("div", { class: "ownership" }, h("span", { innerHTML: GlobeAltIcon }), " Public")), !template.is_public && !template.is_personal && (h("div", { class: "ownership" }, h("span", { innerHTML: LockClosedIcon }), " Private")), !template.is_public && template.is_personal && (h("div", { class: "ownership" }, h("span", { innerHTML: BuildingOfficeIcon }), " Shared")), h("verdocs-dropdown", { options: MENU_OPTIONS, onOptionSelected: e => this.handleOptionSelected(e.detail.id, template) }))));
     }), !this.initiallyLoaded && (h("div", null, integerSequence(0, this.rowsPerPage).map(() => (h("div", { class: "template-placeholder" }))))), this.initiallyLoaded && !this.templates.length && h("div", { class: "empty-text" }, "No matching templates found. Please adjust your filters and try again."), this.initiallyLoaded && this.templates.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;
-        return this.queryTemplates();
       } }))) : (h("div", null)), this.confirmDelete && (h("verdocs-ok-dialog", { heading: "Delete this Template?", message: "This operation cannot be undone.", onNext: () => this.deleteTemplate(this.confirmDelete), onExit: () => (this.confirmDelete = null), showCancel: true }))));
   }
   static get watchers() { return {
     "sharing": ["handleSharingUpdated"],
     "starred": ["handleStarredUpdated"],
     "sort": ["handleSortUpdated"],
-    "name": ["handleNameUpdated"]
+    "name": ["handleNameUpdated"],
+    "selectedPage": ["handlePageUpdated"]
   }; }
 };
 VerdocsTemplatesList.style = verdocsTemplatesListCss;