@verdocs/web-sdk 2.3.87 → 4.0.5

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

@@ -1,11 +1,8 @@
-import { format } from 'date-fns';
-import { VerdocsEndpoint } from '@verdocs/js-sdk';
-import { Templates } from '@verdocs/js-sdk/Templates';
-import { integerSequence } from '@verdocs/js-sdk/Utils/Primitives';
-import { TemplateActions } from '@verdocs/js-sdk/Templates/Types';
-import { h, Host } from '@stencil/core';
-import { SDKError } from '../../../utils/errors';
-import { canPerformTemplateAction } from '@verdocs/js-sdk/Templates/Actions';
+import { format } from "date-fns";
+import { deleteTemplate, listTemplates, VerdocsEndpoint } from "@verdocs/js-sdk";
+import { integerSequence, canPerformTemplateAction } from "@verdocs/js-sdk";
+import { h, Host } from "@stencil/core";
+import { SDKError } from "../../../utils/errors";
 const GlobeAltIcon = `<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="M12 21a9.004 9.004 0 008.716-6.747M12 21a9.004 9.004 0 01-8.716-6.747M12 21c2.485 0 4.5-4.03 4.5-9S14.485 3 12 3m0 18c-2.485 0-4.5-4.03-4.5-9S9.515 3 12 3m0 0a8.997 8.997 0 017.843 4.582M12 3a8.997 8.997 0 00-7.843 4.582m15.686 0A11.953 11.953 0 0112 10.5c-2.998 0-5.74-1.1-7.843-2.918m15.686 0A8.959 8.959 0 0121 12c0 .778-.099 1.533-.284 2.253m0 0A17.919 17.919 0 0112 16.5c-3.162 0-6.133-.815-8.716-2.247m0 0A9.015 9.015 0 013 12c0-1.605.42-3.113 1.157-4.418" /></svg>`;
 const LockClosedIcon = `<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="M16.5 10.5V6.75a4.5 4.5 0 10-9 0v3.75m-.75 11.25h10.5a2.25 2.25 0 002.25-2.25v-6.75a2.25 2.25 0 00-2.25-2.25H6.75a2.25 2.25 0 00-2.25 2.25v6.75a2.25 2.25 0 002.25 2.25z" /></svg>`;
 const BuildingOfficeIcon = `<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="M3.75 21h16.5M4.5 3h15M5.25 3v18m13.5-18v18M9 6.75h1.5m-1.5 3h1.5m-1.5 3h1.5m3-6H15m-1.5 3H15m-1.5 3H15M9 21v-3.375c0-.621.504-1.125 1.125-1.125h3.75c.621 0 1.125.504 1.125 1.125V21" /></svg>`;
@@ -14,628 +11,644 @@ const CreatedIcon = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 122.88
 const LastUsedIcon = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 410.2"><path d="M35.28 35.51h32.54v43.42c0 10.58 4.27 20.06 11.35 27.23 17.03 17.14 45.5 17.45 63.06.93 7.71-7.29 12.4-17.14 12.4-28.16V35.51h65.71v43.42c0 6.34 1.56 12.3 4.35 17.6 2.03 3.85 4.71 7.37 7.92 10.43l2.41 2.24c1.79 1.46 3.71 2.79 5.76 3.97l.31.18.07.04.25.13.16.1.15.08.27.14.05.03.32.17.05.03.27.13.15.08.17.09.26.12.07.04.32.16.03.01.31.15.12.06.2.09.24.11.1.05.33.14.34.16.1.04.23.1.21.09.13.05.31.13h.03l.34.14.08.04.27.1.18.07.16.06.3.11.05.02.34.12.06.02.3.11.16.05.19.07.26.09.09.03.35.12.02.01.34.1.13.04.22.07.25.07.11.03.36.11.36.1.11.03.25.07.22.06.14.04.34.09h.02l.37.1.08.02.29.06.19.05.17.03.32.08.05.01.37.08.06.01.31.06.17.04.21.03.28.06.09.02.37.07h.03l.35.06.14.03.23.03.27.04.11.02.38.06.38.05.12.01.26.04.23.03.15.01.35.05h.03l.39.04.08.01.3.02.21.02.17.02.34.02.05.01.39.03h.05l.34.02.18.01.21.01.3.02h.08l.39.01.03.01.36.01h.39l.28.01h.96l.33-.01h.39l.18-.01.2-.01.25-.01h.13l.32-.02h.07l.38-.02h.01l.37-.02.07-.01.32-.02.12-.01.26-.02.19-.02.19-.02.25-.02.13-.01.31-.04h.07l.37-.05h.01l.37-.04.06-.01.32-.04.12-.02.26-.03.18-.03.19-.03.24-.04.14-.02.3-.05.07-.01.36-.06h.01l.37-.07.05-.01.32-.06.12-.02.25-.05.18-.04.19-.04.23-.05.14-.03.29-.07.08-.01.35-.08.01-.01.36-.08.05-.02.31-.08.11-.02.25-.07.17-.04.2-.06.22-.05.14-.05.28-.08.07-.02.34-.09.02-.01.36-.11.03-.01.32-.1.1-.03.25-.08.16-.05.19-.07.22-.07.13-.04.28-.1.08-.03.32-.11.02-.01.35-.13.04-.01.3-.11.09-.04.26-.1.15-.06.19-.07.21-.09.13-.05.26-.11.08-.03.32-.13.02-.01.33-.14.04-.02.3-.13.09-.04.24-.11.14-.07.19-.08.19-.1.14-.06.25-.12.08-.03.3-.16h.03l.32-.17.03-.01.29-.16.09-.04.24-.12.13-.07.19-.1.18-.1.14-.07.23-.13.08-.05.29-.16.03-.01.31-.18c1.11-.64 2.17-1.31 3.2-2.03l2.71-1.95c4.36-3.56 7.92-7.88 10.43-12.76 2.73-5.26 4.25-11.19 4.25-17.5V35.51h33.97c9.68 0 18.5 3.98 24.91 10.38 6.4 6.37 10.38 15.2 10.38 24.9V192.9H365.1v-53.83H11.3v233.49c0 15.25 12.49 27.74 27.75 27.74h298.3c15.27 0 27.75-12.51 27.75-27.74V325.6h11.31v49.32c0 9.7-3.98 18.53-10.37 24.91-6.42 6.39-15.24 10.37-24.92 10.37H35.28c-9.68 0-18.49-3.97-24.89-10.37C3.97 393.41 0 384.59 0 374.92V70.79C0 61.12 3.97 52.3 10.36 45.9c6.43-6.42 15.25-10.39 24.92-10.39zm211.43-21.54c0-7.71 7.61-13.97 17.03-13.97 9.42 0 17.04 6.26 17.04 13.97v64.96c0 7.7-7.62 13.96-17.04 13.96-9.42 0-17.03-6.26-17.03-13.96V13.97zm-152.52 0C94.19 6.26 101.81 0 111.23 0c9.42 0 17.03 6.26 17.03 13.97v64.96c0 7.7-7.61 13.96-17.03 13.96-9.42 0-17.04-6.26-17.04-13.96V13.97zm311.37 327.72c1.48-14.79 2.69-32.45 3.59-46.5h-75.88v-71.88h77.43c-.39-14.06-1.17-31.75-2.35-46.58-.96-5.93 6.02-9.73 10.51-5.9l90.89 82.99c2.7 2.31 3.02 6.38.7 9.08l-.74.73-93.65 84.05c-4.6 3.89-11.47-.19-10.5-5.99zM63.51 286h50.56c3.53 0 6.43 2.91 6.43 6.44v42.06c0 3.52-2.91 6.44-6.43 6.44H63.51c-3.53 0-6.44-2.91-6.44-6.44v-42.06c0-3.54 2.9-6.44 6.44-6.44zm198.44-98.62h50.55c3.23 0 5.92 2.43 6.37 5.52h-16v49.42h-40.92c-3.53 0-6.45-2.9-6.45-6.45v-42.05c0-3.54 2.9-6.44 6.45-6.44zm0 98.62h40.92v39.6h16.07v8.9c0 3.52-2.92 6.44-6.44 6.44h-50.55c-3.53 0-6.45-2.91-6.45-6.44v-42.06c0-3.54 2.9-6.44 6.45-6.44zm-98.5-98.62h50.56c3.53 0 6.43 2.92 6.43 6.44v42.05c0 3.53-2.91 6.45-6.43 6.45h-50.56c-3.53 0-6.44-2.9-6.44-6.45v-42.05c0-3.54 2.9-6.44 6.44-6.44zm-99.94 0h50.56c3.53 0 6.43 2.92 6.43 6.44v42.05c0 3.53-2.91 6.45-6.43 6.45H63.51c-3.53 0-6.44-2.9-6.44-6.45v-42.05c0-3.54 2.9-6.44 6.44-6.44zM163.45 286h50.56c3.53 0 6.43 2.91 6.43 6.44v42.06c0 3.52-2.91 6.44-6.43 6.44h-50.56c-3.53 0-6.44-2.91-6.44-6.44v-42.06c0-3.54 2.9-6.44 6.44-6.44z"/></svg>`;
 const UpdatedIcon = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 506.49"><path fill-rule="nonzero" d="m371.06 415.61-43.25 11.52 6.23-46.41 37.02 34.89zm6.76-177.5c36.98 0 70.56 15.04 94.83 39.35C496.96 301.7 512 335.25 512 372.31c0 37.02-15.02 70.61-39.3 94.88l-.68.64c-24.23 23.88-57.5 38.66-94.2 38.66-37.06 0-70.61-15.04-94.88-39.31l-.64-.69c-23.9-24.24-38.68-57.53-38.68-94.18 0-37.06 15.04-70.61 39.32-94.89 24.27-24.27 57.85-39.31 94.88-39.31zm78.74 55.41c-20.09-20.11-47.96-32.58-78.74-32.58-30.75 0-58.61 12.47-78.75 32.62-20.15 20.14-32.62 48-32.62 78.75 0 30.5 12.25 58.14 32.02 78.19l.6.55c20.14 20.14 48 32.61 78.75 32.61 30.48 0 58.12-12.25 78.21-32.02l.54-.58c20.15-20.15 32.61-48 32.61-78.75s-12.48-58.61-32.62-78.79zM294.24 17.11C294.24 7.69 303.52 0 315.1 0c11.57 0 20.87 7.64 20.87 17.11v74.85c0 9.42-9.3 17.11-20.87 17.11-11.58 0-20.86-7.65-20.86-17.11V17.11zM56.8 242.28c-1.17 0-2.23-5.2-2.23-11.57 0-6.38.92-11.53 2.23-11.53h56.94c1.18 0 2.24 5.2 2.24 11.53 0 6.39-.92 11.57-2.24 11.57H56.8zm90.77 0c-1.17 0-2.23-5.2-2.23-11.57 0-6.38.92-11.53 2.23-11.53h56.94c1.18 0 2.24 5.2 2.24 11.53 0 6.39-.92 11.57-2.24 11.57h-56.94zm90.77 0c-1.16 0-2.22-5.2-2.22-11.57 0-6.38.92-11.53 2.22-11.53h56.94c1.19 0 2.25 5.15 2.25 11.49-5.7 3.55-11.2 7.44-16.43 11.61h-42.76zm-181.4 66.24c-1.18 0-2.24-5.2-2.24-11.57 0-6.38.93-11.58 2.24-11.58h56.94c1.18 0 2.22 5.2 2.22 11.58 0 6.37-.91 11.57-2.22 11.57H56.94zm90.77 0c-1.18 0-2.24-5.2-2.24-11.57 0-6.38.93-11.58 2.24-11.58h56.94c1.18 0 2.23 5.2 2.23 11.58 0 6.37-.92 11.57-2.23 11.57h-56.94zM57.06 374.8c-1.18 0-2.24-5.2-2.24-11.59 0-6.36.94-11.56 2.24-11.56H114c1.19 0 2.24 5.2 2.24 11.56 0 6.39-.93 11.59-2.24 11.59H57.06zm90.78 0c-1.19 0-2.25-5.2-2.25-11.59 0-6.36.94-11.56 2.25-11.56h56.94c1.18 0 2.24 5.2 2.24 11.56 0 6.39-.94 11.59-2.24 11.59h-56.94zM106.83 17.11C106.83 7.69 116.1 0 127.69 0c11.57 0 20.86 7.64 20.86 17.11v74.85c0 9.42-9.34 17.11-20.86 17.11-11.59 0-20.86-7.65-20.86-17.11V17.11zM22.97 163.64h397.39V77.46c0-2.94-1.19-5.53-3.09-7.43-1.9-1.9-4.59-3.08-7.42-3.08h-38.1c-6.39 0-11.59-5.2-11.59-11.57 0-6.38 5.2-11.58 11.59-11.58h38.1c9.32 0 17.7 3.77 23.82 9.88 6.12 6.14 9.88 14.5 9.88 23.83v136.81c-7.61-2.62-15.41-4.73-23.44-6.29v-21.38h.25H22.97v223.17c0 2.94 1.18 5.52 3.08 7.42 1.91 1.9 4.61 3.08 7.44 3.08h188.85c2.16 8.02 4.86 15.84 8.11 23.36H33.71c-9.3 0-17.7-3.75-23.84-9.89C3.75 427.72 0 419.36 0 410.02V77.55c0-9.29 3.75-17.7 9.87-23.82 6.14-6.13 14.5-9.89 23.84-9.89h40.67c6.38 0 11.57 5.2 11.57 11.57C85.95 61.8 80.76 67 74.38 67H33.71c-2.96 0-5.54 1.18-7.44 3.08-1.9 1.9-3.09 4.59-3.09 7.43v86.16h-.21v-.03zm158.95-96.69c-6.39 0-11.57-5.2-11.57-11.57 0-6.38 5.18-11.58 11.57-11.58h77.55c6.39 0 11.57 5.2 11.57 11.58 0 6.37-5.18 11.57-11.57 11.57h-77.55zm161.66 303.24 45.37-51.33c.72-.84 1.78-1.34 2.85-1.36.69-.01 1.37.13 1.98.45l32.94 29.96c.66.59 1.05 1.46 1.06 2.35.02 1-.39 1.98-1.16 2.66l-46.15 52.16-36.95-34.89h.06z"/></svg>`;
 const SharingFilters = [
-  { value: 'all', label: 'All' },
-  { value: 'personal', label: 'Personal' },
-  { value: 'shared', label: 'Shared' },
-  { value: 'public', label: 'Public' },
+    { value: 'all', label: 'All' },
+    { value: 'personal', label: 'Personal' },
+    { value: 'shared', label: 'Shared' },
+    { value: 'public', label: 'Public' },
 ];
 const StarredFilters = [
-  { value: 'all', label: 'All' },
-  { value: 'starred', label: 'Starred' },
-  { value: 'unstarred', label: 'Not Starred' },
+    { value: 'all', label: 'All' },
+    { value: 'starred', label: 'Starred' },
+    { value: 'unstarred', label: 'Not Starred' },
 ];
 const SortOptions = [
-  { value: 'name', label: 'Name' },
-  { value: 'created_at', label: 'Created' },
-  { value: 'updated_at', label: 'Last Updated' },
-  { value: 'last_used_at', label: 'Last Used' },
-  { value: 'counter', label: 'Most Used' },
-  { value: 'star_counter', label: 'Most Starred' },
+    { value: 'name', label: 'Name' },
+    { value: 'created_at', label: 'Created' },
+    { value: 'updated_at', label: 'Last Updated' },
+    { value: 'last_used_at', label: 'Last Used' },
+    { value: 'counter', label: 'Most Used' },
+    { value: 'star_counter', label: 'Most Starred' },
 ];
 /**
  * Displays a list of envelopes matching specified conditions.
  */
 export class VerdocsTemplatesList {
-  constructor() {
-    this.handleOptionSelected = (option, template) => {
-      var _a, _b, _c, _d;
-      if (option === 'send') {
-        (_a = this.viewTemplate) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, template: template });
-        // } else if (option === 'createlink') {
-        //   VerdocsToast('This feature is coming soon!');
-      }
-      else if (option === 'signnow') {
-        (_b = this.signNow) === null || _b === void 0 ? void 0 : _b.emit({ endpoint: this.endpoint, template: template });
-      }
-      else if (option === 'submitted') {
-        (_c = this.submittedData) === null || _c === void 0 ? void 0 : _c.emit({ endpoint: this.endpoint, template: template });
-        // } else if (option === 'link') {
-        //   VerdocsToast('This feature is coming soon!');
-      }
-      else if (option === 'edit') {
-        (_d = this.editTemplate) === null || _d === void 0 ? void 0 : _d.emit({ endpoint: this.endpoint, template: template });
-      }
-      else if (option === 'delete') {
-        this.confirmDelete = template;
-      }
-    };
-    this.endpoint = VerdocsEndpoint.getDefault();
-    this.sharing = 'all';
-    this.starred = 'all';
-    this.sort = 'updated_at';
-    this.name = '';
-    this.allowedActions = ['send', 'submitted', 'link', 'edit', 'delete'];
-    this.showPagination = true;
-    this.rowsPerPage = 10;
-    this.selectedPage = 0;
-    this.count = 0;
-    this.initiallyLoaded = false;
-    this.loading = true;
-    this.confirmDelete = null;
-    this.templates = [];
-    this.localNameFilter = '';
-  }
-  handleSharingUpdated() {
-    return this.queryTemplates();
-  }
-  handleStarredUpdated() {
-    return this.queryTemplates();
-  }
-  handleSortUpdated() {
-    return this.queryTemplates();
-  }
-  handleNameUpdated() {
-    return this.queryTemplates();
-  }
-  handlePageUpdated() {
-    return this.queryTemplates();
-  }
-  componentWillLoad() {
-    this.endpoint.loadSession();
-    if (!this.endpoint.session) {
-      console.log('[TEMPLATES] Must be authenticated');
-      return;
+    constructor() {
+        this.handleOptionSelected = (option, template) => {
+            var _a, _b, _c, _d;
+            if (option === 'send') {
+                (_a = this.viewTemplate) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, template: template });
+                // } else if (option === 'createlink') {
+                //   VerdocsToast('This feature is coming soon!');
+            }
+            else if (option === 'signnow') {
+                (_b = this.signNow) === null || _b === void 0 ? void 0 : _b.emit({ endpoint: this.endpoint, template: template });
+            }
+            else if (option === 'submitted') {
+                (_c = this.submittedData) === null || _c === void 0 ? void 0 : _c.emit({ endpoint: this.endpoint, template: template });
+                // } else if (option === 'link') {
+                //   VerdocsToast('This feature is coming soon!');
+            }
+            else if (option === 'edit') {
+                (_d = this.editTemplate) === null || _d === void 0 ? void 0 : _d.emit({ endpoint: this.endpoint, template: template });
+            }
+            else if (option === 'delete') {
+                this.confirmDelete = template;
+            }
+        };
+        this.endpoint = VerdocsEndpoint.getDefault();
+        this.sharing = 'all';
+        this.starred = 'all';
+        this.sort = 'updated_at';
+        this.name = '';
+        this.allowedActions = ['send', 'submitted', 'link', 'edit', 'delete'];
+        this.showPagination = true;
+        this.rowsPerPage = 10;
+        this.selectedPage = 0;
+        this.count = 0;
+        this.initiallyLoaded = false;
+        this.loading = true;
+        this.confirmDelete = null;
+        this.templates = [];
+        this.localNameFilter = '';
+    }
+    handleSharingUpdated() {
+        return this.queryTemplates();
+    }
+    handleStarredUpdated() {
+        return this.queryTemplates();
+    }
+    handleSortUpdated() {
+        return this.queryTemplates();
+    }
+    handleNameUpdated() {
+        return this.queryTemplates();
+    }
+    handlePageUpdated() {
+        return this.queryTemplates();
     }
-  }
-  async componentDidLoad() {
-    await this.queryTemplates();
-    this.initiallyLoaded = true;
-  }
-  async queryTemplates() {
-    var _a, _b, _c;
-    console.log('[TEMPLATES] Querying templates');
-    this.loading = true;
-    try {
-      let queryParams = {
-        // sharing: this.sharing,
-        // starred: this.starred,
-        page: this.selectedPage,
-        // sort: this.sort,
-        rows: this.rowsPerPage,
-        // ascending: this.sort === 'name' || this.sort === 'star_counter',
-      };
-      if (this.name.trim() !== '') {
-        queryParams.q = this.name.trim();
-      }
-      const response = await Templates.listTemplates(this.endpoint, queryParams);
-      this.templates = response.templates;
-      this.count = response.total;
-      this.loading = false;
+    componentWillLoad() {
+        this.endpoint.loadSession();
+        if (!this.endpoint.session) {
+            console.log('[TEMPLATES] Must be authenticated');
+            return;
+        }
     }
-    catch (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));
+    async componentDidLoad() {
+        await this.queryTemplates();
+        this.initiallyLoaded = true;
     }
-  }
-  deleteTemplate(template) {
-    this.confirmDelete = null;
-    Templates.deleteTemplate(this.endpoint, template.id)
-      .then(() => {
-      var _a;
-      console.log('[TEMPLATES] Deleted template', template);
-      (_a = this.templateDeleted) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, template: template });
-      return this.queryTemplates();
-    })
-      .catch(e => {
-      var _a, _b, _c;
-      console.log('[TEMPLATES] Error deleting template', template);
-      (_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));
-    });
-  }
-  render() {
-    // 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.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;
-        this.sharing = e.detail.value;
-        (_a = this.changeSharing) === null || _a === void 0 ? void 0 : _a.emit(this.sharing);
-      } }), h("verdocs-quick-filter", { label: "Starred", value: this.starred, options: StarredFilters, onOptionSelected: e => {
-        var _a;
-        this.starred = e.detail.value;
-        (_a = this.changeStarred) === null || _a === void 0 ? void 0 : _a.emit(this.starred);
-      } }), h("verdocs-quick-filter", { label: "Sort By", value: this.sort, options: SortOptions, onOptionSelected: e => {
-        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' } })), 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 = [];
-      const allowed_operations = [];
-      // serverless/src/functions/getTemplates.ts:        allowed_operations: [] as string[],
-      // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'create_personal', record) && record.allowed_operations.push('create_personal');
-      // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'create_org', record) && record.allowed_operations.push('create_org');
-      // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'create_public', record) && record.allowed_operations.push('create_public');
-      // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'read', record) && record.allowed_operations.push('read');
-      // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'write', record) && record.allowed_operations.push('write');
-      // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'delete', record) && record.allowed_operations.push('delete');
-      // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'change_visibility_personal', record) && record.allowed_operations.push('change_visibility_personal');
-      // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'change_visibility_org', record) && record.allowed_operations.push('change_visibility_org');
-      // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'change_visibility_public', record) && record.allowed_operations.push('change_visibility_public');
-      if (this.allowedActions.includes('send')) {
-        MENU_OPTIONS.push({ label: 'Preview / Send', id: 'send', disabled: !canPerformTemplateAction(this.endpoint.session, 'read', template) });
-      }
-      // if (this.allowedActions.includes('createlink')) {
-      //   MENU_OPTIONS.push({label: 'Create Link', id: 'createlink', disabled: true});
-      // }
-      if (this.allowedActions.includes('signnow')) {
-        MENU_OPTIONS.push({ label: 'Sign Now', id: 'signnow', disabled: true });
-      }
-      if (this.allowedActions.includes('submitted')) {
-        MENU_OPTIONS.push({ label: '' });
-        MENU_OPTIONS.push({ label: 'Submissions', id: 'submitted', disabled: !canPerformTemplateAction(this.endpoint.session, 'read', template) });
-      }
-      if (this.allowedActions.includes('link') || this.allowedActions.includes('edit') || this.allowedActions.includes('delete')) {
-        MENU_OPTIONS.push({ label: '' });
-        // TODO: The preview link used to be just an internal route in the main Web application, but
-        // that's not suitable for embeddding. Disabling until this gets re-requested as a feature,
-        // in which case we'll want to move this to an API-driven function.
-        // if (this.allowedActions.includes('link') || this.allowedActions.includes('edit') || this.allowedActions.includes('delete')) {
-        //   MENU_OPTIONS.push({label: 'Get Preview Link', id: 'link', disabled: !this.canPreview(template)});
-        // }
-        if (this.allowedActions.includes('link') || this.allowedActions.includes('edit') || this.allowedActions.includes('delete')) {
-          MENU_OPTIONS.push({ label: 'Edit', id: 'edit', disabled: !allowed_operations.includes(TemplateActions.WRITE) });
+    async queryTemplates() {
+        var _a, _b, _c;
+        console.log('[TEMPLATES] Querying templates');
+        this.loading = true;
+        try {
+            let queryParams = {
+                // sharing: this.sharing,
+                // starred: this.starred,
+                page: this.selectedPage,
+                // sort: this.sort,
+                rows: this.rowsPerPage,
+                // ascending: this.sort === 'name' || this.sort === 'star_counter',
+            };
+            if (this.name.trim() !== '') {
+                queryParams.q = this.name.trim();
+            }
+            const response = await listTemplates(this.endpoint, queryParams);
+            this.templates = response.templates;
+            this.count = response.total;
+            this.loading = false;
         }
-        if (this.allowedActions.includes('link') || this.allowedActions.includes('edit') || this.allowedActions.includes('delete')) {
-          MENU_OPTIONS.push({ label: 'Delete', id: 'delete', disabled: !allowed_operations.includes(TemplateActions.DELETE) });
+        catch (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));
         }
-      }
-      return (h("div", { class: "template", onClick: () => {
-          var _a;
-          (_a = this.viewTemplate) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, template });
-        } }, 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;
-      } }))) : (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 is() { return "verdocs-templates-list"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["verdocs-templates-list.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["verdocs-templates-list.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "endpoint": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "VerdocsEndpoint",
-          "resolved": "VerdocsEndpoint",
-          "references": {
-            "VerdocsEndpoint": {
-              "location": "import",
-              "path": "@verdocs/js-sdk"
+    }
+    deleteTemplate(template) {
+        this.confirmDelete = null;
+        deleteTemplate(this.endpoint, template.id)
+            .then(() => {
+            var _a;
+            console.log('[TEMPLATES] Deleted template', template);
+            (_a = this.templateDeleted) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, template: template });
+            return this.queryTemplates();
+        })
+            .catch(e => {
+            var _a, _b, _c;
+            console.log('[TEMPLATES] Error deleting template', template);
+            (_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));
+        });
+    }
+    render() {
+        // 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, { key: 'bebf191a117bcaa2fdf9c04f0ad11b1bb51bfe0a' }, h("div", { key: '4f965488f88b32ba4372135a8c69e1c54334681d', class: "header" }, h("div", { key: '81d9da459a3694104a59c99c4fc12f1b5de65f12', class: "filter" }, h("verdocs-text-input", { key: '1f48c9fcea48ca89bd3129b5c99b284274d0368c', 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.trim();
+                this.localNameFilter = e.target.value.trim();
+                (_a = this.changeName) === null || _a === void 0 ? void 0 : _a.emit(this.name);
+            } })), h("verdocs-quick-filter", { key: '000233a7fc8793d9ace12fc11dbda636fd71028e', label: "Sharing", value: this.sharing, options: SharingFilters, onOptionSelected: e => {
+                var _a;
+                this.sharing = e.detail.value;
+                (_a = this.changeSharing) === null || _a === void 0 ? void 0 : _a.emit(this.sharing);
+            } }), h("verdocs-quick-filter", { key: 'e0d6f6ff8d7d6add7352859c9ab3ed38082645c9', label: "Starred", value: this.starred, options: StarredFilters, onOptionSelected: e => {
+                var _a;
+                this.starred = e.detail.value;
+                (_a = this.changeStarred) === null || _a === void 0 ? void 0 : _a.emit(this.starred);
+            } }), h("verdocs-quick-filter", { key: 'bc4125163612f3e9e06867052f5e3f644a616dee', label: "Sort By", value: this.sort, options: SortOptions, onOptionSelected: e => {
+                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", { key: '4d13c53ac70efcfa24e2e3e1c360cc44717771f1', mode: "dark", size: 24 }), h("div", { key: 'f921d5d44e2bda13b52e0d7095225f357f8fa9d5', 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 = [];
+            const allowed_operations = [];
+            // serverless/src/functions/getTemplates.ts:        allowed_operations: [] as string[],
+            // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'create_personal', record) && record.allowed_operations.push('create_personal');
+            // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'create_org', record) && record.allowed_operations.push('create_org');
+            // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'create_public', record) && record.allowed_operations.push('create_public');
+            // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'read', record) && record.allowed_operations.push('read');
+            // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'write', record) && record.allowed_operations.push('write');
+            // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'delete', record) && record.allowed_operations.push('delete');
+            // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'change_visibility_personal', record) && record.allowed_operations.push('change_visibility_personal');
+            // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'change_visibility_org', record) && record.allowed_operations.push('change_visibility_org');
+            // serverless/src/functions/getTemplates.ts:      canPerformTemplateAction(request.session, 'change_visibility_public', record) && record.allowed_operations.push('change_visibility_public');
+            if (this.allowedActions.includes('send')) {
+                MENU_OPTIONS.push({ label: 'Preview / Send', id: 'send', disabled: !canPerformTemplateAction(this.endpoint.session, 'read', template) });
             }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used."
-        },
-        "defaultValue": "VerdocsEndpoint.getDefault()"
-      },
-      "sharing": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "'all' | 'personal' | 'shared' | 'public'",
-          "resolved": "\"all\" | \"personal\" | \"public\" | \"shared\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "The sharing settings to filter by."
-        },
-        "attribute": "sharing",
-        "reflect": true,
-        "defaultValue": "'all'"
-      },
-      "starred": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "'all' | 'starred' | 'unstarred'",
-          "resolved": "\"all\" | \"starred\" | \"unstarred\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The starred settings to filter by."
-        },
-        "attribute": "starred",
-        "reflect": true,
-        "defaultValue": "'all'"
-      },
-      "sort": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "IGetTemplateSummarySortBy",
-          "resolved": "\"counter\" | \"created_at\" | \"last_used_at\" | \"name\" | \"star_counter\" | \"updated_at\"",
-          "references": {
-            "IGetTemplateSummarySortBy": {
-              "location": "import",
-              "path": "@verdocs/js-sdk/Templates/Templates"
+            // if (this.allowedActions.includes('createlink')) {
+            //   MENU_OPTIONS.push({label: 'Create Link', id: 'createlink', disabled: true});
+            // }
+            if (this.allowedActions.includes('signnow')) {
+                MENU_OPTIONS.push({ label: 'Sign Now', id: 'signnow', disabled: true });
             }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The sort order to display."
-        },
-        "attribute": "sort",
-        "reflect": true,
-        "defaultValue": "'updated_at'"
-      },
-      "name": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "If set, filter templates by the specified name."
-        },
-        "attribute": "name",
-        "reflect": true,
-        "defaultValue": "''"
-      },
-      "allowedActions": {
-        "type": "unknown",
-        "mutable": true,
-        "complexType": {
-          "original": "TAllowedTemplateAction[]",
-          "resolved": "TAllowedTemplateAction[]",
-          "references": {
-            "TAllowedTemplateAction": {
-              "location": "local"
+            if (this.allowedActions.includes('submitted')) {
+                MENU_OPTIONS.push({ label: '' });
+                MENU_OPTIONS.push({ label: 'Submissions', id: 'submitted', disabled: !canPerformTemplateAction(this.endpoint.session, 'read', template) });
             }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Override the If set, filter templates by the specified name."
-        },
-        "defaultValue": "['send', 'submitted', 'link', 'edit', 'delete']"
-      },
-      "showPagination": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Whether or not pagination should be enabled."
-        },
-        "attribute": "show-pagination",
-        "reflect": false,
-        "defaultValue": "true"
-      },
-      "rowsPerPage": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The number of rows to display per page."
-        },
-        "attribute": "rows-per-page",
-        "reflect": false,
-        "defaultValue": "10"
-      },
-      "selectedPage": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The initial page number to select. Pagination is internally controlled but may be overriden by the\nhost applicaiton."
-        },
-        "attribute": "selected-page",
-        "reflect": false,
-        "defaultValue": "0"
-      }
-    };
-  }
-  static get states() {
-    return {
-      "count": {},
-      "initiallyLoaded": {},
-      "loading": {},
-      "confirmDelete": {},
-      "templates": {},
-      "localNameFilter": {}
-    };
-  }
-  static get events() {
-    return [{
-        "method": "sdkError",
-        "name": "sdkError",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event fired if an error occurs. The event details will contain information about the error. Most errors will\nterminate the process, and the calling application should correct the condition and re-render the component."
-        },
-        "complexType": {
-          "original": "SDKError",
-          "resolved": "SDKError",
-          "references": {
-            "SDKError": {
-              "location": "import",
-              "path": "../../../utils/errors"
+            if (this.allowedActions.includes('link') || this.allowedActions.includes('edit') || this.allowedActions.includes('delete')) {
+                MENU_OPTIONS.push({ label: '' });
+                // TODO: The preview link used to be just an internal route in the main Web application, but
+                // that's not suitable for embeddding. Disabling until this gets re-requested as a feature,
+                // in which case we'll want to move this to an API-driven function.
+                // if (this.allowedActions.includes('link') || this.allowedActions.includes('edit') || this.allowedActions.includes('delete')) {
+                //   MENU_OPTIONS.push({label: 'Get Preview Link', id: 'link', disabled: !this.canPreview(template)});
+                // }
+                if (this.allowedActions.includes('link') || this.allowedActions.includes('edit') || this.allowedActions.includes('delete')) {
+                    MENU_OPTIONS.push({ label: 'Edit', id: 'edit', disabled: !allowed_operations.includes('write') });
+                }
+                if (this.allowedActions.includes('link') || this.allowedActions.includes('edit') || this.allowedActions.includes('delete')) {
+                    MENU_OPTIONS.push({ label: 'Delete', id: 'delete', disabled: !allowed_operations.includes('delete') });
+                }
             }
-          }
-        }
-      }, {
-        "method": "viewTemplate",
-        "name": "viewTemplate",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event fired when the user clicks a template to view it. Typically the host application will use this to navigate\nto the template preview. This is also fired when the user selects \"Preview/Send\" fropm the dropdown menu."
-        },
-        "complexType": {
-          "original": "{endpoint: VerdocsEndpoint; template: ITemplate}",
-          "resolved": "{ endpoint: VerdocsEndpoint; template: ITemplate; }",
-          "references": {
-            "VerdocsEndpoint": {
-              "location": "import",
-              "path": "@verdocs/js-sdk"
+            return (h("div", { class: "template", onClick: () => {
+                    var _a;
+                    (_a = this.viewTemplate) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, template });
+                } }, 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", { key: '46a1bff9ddae80881dd897e052b223e141afb358' }, integerSequence(0, this.rowsPerPage).map(() => (h("div", { class: "template-placeholder" }))))), this.initiallyLoaded && !this.templates.length && h("div", { key: 'a9d8f7f6602a0e2c8a447bb0868f097b9d7cb094', 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;
+            } }))) : (h("div", null)), this.confirmDelete && (h("verdocs-ok-dialog", { key: 'a94528dd94af77c49c1b8c168c2c82d91003ba31', heading: "Delete this Template?", message: "This operation cannot be undone.", onNext: () => this.deleteTemplate(this.confirmDelete), onExit: () => (this.confirmDelete = null), showCancel: true }))));
+    }
+    static get is() { return "verdocs-templates-list"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["verdocs-templates-list.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["verdocs-templates-list.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "endpoint": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "VerdocsEndpoint",
+                    "resolved": "VerdocsEndpoint",
+                    "references": {
+                        "VerdocsEndpoint": {
+                            "location": "import",
+                            "path": "@verdocs/js-sdk",
+                            "id": ""
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used."
+                },
+                "defaultValue": "VerdocsEndpoint.getDefault()"
             },
-            "ITemplate": {
-              "location": "import",
-              "path": "@verdocs/js-sdk/Templates/Types"
-            }
-          }
-        }
-      }, {
-        "method": "signNow",
-        "name": "signNow",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event fired when the user clicks to sign a template now."
-        },
-        "complexType": {
-          "original": "{endpoint: VerdocsEndpoint; template: ITemplate}",
-          "resolved": "{ endpoint: VerdocsEndpoint; template: ITemplate; }",
-          "references": {
-            "VerdocsEndpoint": {
-              "location": "import",
-              "path": "@verdocs/js-sdk"
+            "sharing": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "'all' | 'personal' | 'shared' | 'public'",
+                    "resolved": "\"all\" | \"personal\" | \"public\" | \"shared\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The sharing settings to filter by."
+                },
+                "attribute": "sharing",
+                "reflect": true,
+                "defaultValue": "'all'"
             },
-            "ITemplate": {
-              "location": "import",
-              "path": "@verdocs/js-sdk/Templates/Types"
-            }
-          }
-        }
-      }, {
-        "method": "submittedData",
-        "name": "submittedData",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event fired when the user clicks to sign a template now."
-        },
-        "complexType": {
-          "original": "{endpoint: VerdocsEndpoint; template: ITemplate}",
-          "resolved": "{ endpoint: VerdocsEndpoint; template: ITemplate; }",
-          "references": {
-            "VerdocsEndpoint": {
-              "location": "import",
-              "path": "@verdocs/js-sdk"
+            "starred": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "'all' | 'starred' | 'unstarred'",
+                    "resolved": "\"all\" | \"starred\" | \"unstarred\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The starred settings to filter by."
+                },
+                "attribute": "starred",
+                "reflect": true,
+                "defaultValue": "'all'"
             },
-            "ITemplate": {
-              "location": "import",
-              "path": "@verdocs/js-sdk/Templates/Types"
-            }
-          }
-        }
-      }, {
-        "method": "editTemplate",
-        "name": "editTemplate",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event fired when the user chooses the Edit option from the dropdown menu."
-        },
-        "complexType": {
-          "original": "{endpoint: VerdocsEndpoint; template: ITemplate}",
-          "resolved": "{ endpoint: VerdocsEndpoint; template: ITemplate; }",
-          "references": {
-            "VerdocsEndpoint": {
-              "location": "import",
-              "path": "@verdocs/js-sdk"
+            "sort": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "IGetTemplateSummarySortBy",
+                    "resolved": "\"counter\" | \"created_at\" | \"last_used_at\" | \"name\" | \"star_counter\" | \"updated_at\"",
+                    "references": {
+                        "IGetTemplateSummarySortBy": {
+                            "location": "import",
+                            "path": "@verdocs/js-sdk",
+                            "id": ""
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The sort order to display."
+                },
+                "attribute": "sort",
+                "reflect": true,
+                "defaultValue": "'updated_at'"
             },
-            "ITemplate": {
-              "location": "import",
-              "path": "@verdocs/js-sdk/Templates/Types"
-            }
-          }
-        }
-      }, {
-        "method": "templateDeleted",
-        "name": "templateDeleted",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event fired when the user chooses the Delete option from the dropdown menu. When this is fired, the template\nwill already have been deleted. The host application should remove it from the list or refresh the list."
-        },
-        "complexType": {
-          "original": "{endpoint: VerdocsEndpoint; template: ITemplate}",
-          "resolved": "{ endpoint: VerdocsEndpoint; template: ITemplate; }",
-          "references": {
-            "VerdocsEndpoint": {
-              "location": "import",
-              "path": "@verdocs/js-sdk"
+            "name": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "If set, filter templates by the specified name."
+                },
+                "attribute": "name",
+                "reflect": true,
+                "defaultValue": "''"
             },
-            "ITemplate": {
-              "location": "import",
-              "path": "@verdocs/js-sdk/Templates/Types"
-            }
-          }
-        }
-      }, {
-        "method": "changeSort",
-        "name": "changeSort",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event fired when the user changes their sort order. Host applications can use this to save the user's preferences."
-        },
-        "complexType": {
-          "original": "IGetTemplateSummarySortBy",
-          "resolved": "\"counter\" | \"created_at\" | \"last_used_at\" | \"name\" | \"star_counter\" | \"updated_at\"",
-          "references": {
-            "IGetTemplateSummarySortBy": {
-              "location": "import",
-              "path": "@verdocs/js-sdk/Templates/Templates"
+            "allowedActions": {
+                "type": "unknown",
+                "mutable": true,
+                "complexType": {
+                    "original": "TAllowedTemplateAction[]",
+                    "resolved": "TAllowedTemplateAction[]",
+                    "references": {
+                        "TAllowedTemplateAction": {
+                            "location": "local",
+                            "path": "/Users/chad/projects/verdocs/web-sdk/verdocs-web-sdk/src/components/templates/verdocs-templates-list/verdocs-templates-list.tsx",
+                            "id": "src/components/templates/verdocs-templates-list/verdocs-templates-list.tsx::TAllowedTemplateAction"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Override the If set, filter templates by the specified name."
+                },
+                "defaultValue": "['send', 'submitted', 'link', 'edit', 'delete']"
+            },
+            "showPagination": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether or not pagination should be enabled."
+                },
+                "attribute": "show-pagination",
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "rowsPerPage": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The number of rows to display per page."
+                },
+                "attribute": "rows-per-page",
+                "reflect": false,
+                "defaultValue": "10"
+            },
+            "selectedPage": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The initial page number to select. Pagination is internally controlled but may be overriden by the\nhost applicaiton."
+                },
+                "attribute": "selected-page",
+                "reflect": false,
+                "defaultValue": "0"
             }
-          }
-        }
-      }, {
-        "method": "changeSharing",
-        "name": "changeSharing",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event fired when the user changes their sort order. Host applications can use this to save the user's preferences."
-        },
-        "complexType": {
-          "original": "'all' | 'personal' | 'shared' | 'public'",
-          "resolved": "\"all\" | \"personal\" | \"public\" | \"shared\"",
-          "references": {}
-        }
-      }, {
-        "method": "changeStarred",
-        "name": "changeStarred",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event fired when the user changes their sort order. Host applications can use this to save the user's preferences."
-        },
-        "complexType": {
-          "original": "'all' | 'starred' | 'unstarred'",
-          "resolved": "\"all\" | \"starred\" | \"unstarred\"",
-          "references": {}
-        }
-      }, {
-        "method": "changeName",
-        "name": "changeName",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event fired when the user changes the name filter. This is fired for every inputChange event (every character\ntyped). This event is provided for balance with the other events, but host applications should generally not\nsave this value. Users might appreciate applications remembering their sorting or filtering preferences, but\nprobably not their search terms."
-        },
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        }
-      }];
-  }
-  static get watchers() {
-    return [{
-        "propName": "sharing",
-        "methodName": "handleSharingUpdated"
-      }, {
-        "propName": "starred",
-        "methodName": "handleStarredUpdated"
-      }, {
-        "propName": "sort",
-        "methodName": "handleSortUpdated"
-      }, {
-        "propName": "name",
-        "methodName": "handleNameUpdated"
-      }, {
-        "propName": "selectedPage",
-        "methodName": "handlePageUpdated"
-      }];
-  }
+        };
+    }
+    static get states() {
+        return {
+            "count": {},
+            "initiallyLoaded": {},
+            "loading": {},
+            "confirmDelete": {},
+            "templates": {},
+            "localNameFilter": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "sdkError",
+                "name": "sdkError",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event fired if an error occurs. The event details will contain information about the error. Most errors will\nterminate the process, and the calling application should correct the condition and re-render the component."
+                },
+                "complexType": {
+                    "original": "SDKError",
+                    "resolved": "SDKError",
+                    "references": {
+                        "SDKError": {
+                            "location": "import",
+                            "path": "../../../utils/errors",
+                            "id": "src/utils/errors.ts::SDKError"
+                        }
+                    }
+                }
+            }, {
+                "method": "viewTemplate",
+                "name": "viewTemplate",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event fired when the user clicks a template to view it. Typically the host application will use this to navigate\nto the template preview. This is also fired when the user selects \"Preview/Send\" fropm the dropdown menu."
+                },
+                "complexType": {
+                    "original": "{endpoint: VerdocsEndpoint; template: ITemplate}",
+                    "resolved": "{ endpoint: VerdocsEndpoint; template: ITemplate; }",
+                    "references": {
+                        "VerdocsEndpoint": {
+                            "location": "import",
+                            "path": "@verdocs/js-sdk",
+                            "id": ""
+                        },
+                        "ITemplate": {
+                            "location": "import",
+                            "path": "@verdocs/js-sdk",
+                            "id": ""
+                        }
+                    }
+                }
+            }, {
+                "method": "signNow",
+                "name": "signNow",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event fired when the user clicks to sign a template now."
+                },
+                "complexType": {
+                    "original": "{endpoint: VerdocsEndpoint; template: ITemplate}",
+                    "resolved": "{ endpoint: VerdocsEndpoint; template: ITemplate; }",
+                    "references": {
+                        "VerdocsEndpoint": {
+                            "location": "import",
+                            "path": "@verdocs/js-sdk",
+                            "id": ""
+                        },
+                        "ITemplate": {
+                            "location": "import",
+                            "path": "@verdocs/js-sdk",
+                            "id": ""
+                        }
+                    }
+                }
+            }, {
+                "method": "submittedData",
+                "name": "submittedData",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event fired when the user clicks to sign a template now."
+                },
+                "complexType": {
+                    "original": "{endpoint: VerdocsEndpoint; template: ITemplate}",
+                    "resolved": "{ endpoint: VerdocsEndpoint; template: ITemplate; }",
+                    "references": {
+                        "VerdocsEndpoint": {
+                            "location": "import",
+                            "path": "@verdocs/js-sdk",
+                            "id": ""
+                        },
+                        "ITemplate": {
+                            "location": "import",
+                            "path": "@verdocs/js-sdk",
+                            "id": ""
+                        }
+                    }
+                }
+            }, {
+                "method": "editTemplate",
+                "name": "editTemplate",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event fired when the user chooses the Edit option from the dropdown menu."
+                },
+                "complexType": {
+                    "original": "{endpoint: VerdocsEndpoint; template: ITemplate}",
+                    "resolved": "{ endpoint: VerdocsEndpoint; template: ITemplate; }",
+                    "references": {
+                        "VerdocsEndpoint": {
+                            "location": "import",
+                            "path": "@verdocs/js-sdk",
+                            "id": ""
+                        },
+                        "ITemplate": {
+                            "location": "import",
+                            "path": "@verdocs/js-sdk",
+                            "id": ""
+                        }
+                    }
+                }
+            }, {
+                "method": "templateDeleted",
+                "name": "templateDeleted",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event fired when the user chooses the Delete option from the dropdown menu. When this is fired, the template\nwill already have been deleted. The host application should remove it from the list or refresh the list."
+                },
+                "complexType": {
+                    "original": "{endpoint: VerdocsEndpoint; template: ITemplate}",
+                    "resolved": "{ endpoint: VerdocsEndpoint; template: ITemplate; }",
+                    "references": {
+                        "VerdocsEndpoint": {
+                            "location": "import",
+                            "path": "@verdocs/js-sdk",
+                            "id": ""
+                        },
+                        "ITemplate": {
+                            "location": "import",
+                            "path": "@verdocs/js-sdk",
+                            "id": ""
+                        }
+                    }
+                }
+            }, {
+                "method": "changeSort",
+                "name": "changeSort",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event fired when the user changes their sort order. Host applications can use this to save the user's preferences."
+                },
+                "complexType": {
+                    "original": "IGetTemplateSummarySortBy",
+                    "resolved": "\"counter\" | \"created_at\" | \"last_used_at\" | \"name\" | \"star_counter\" | \"updated_at\"",
+                    "references": {
+                        "IGetTemplateSummarySortBy": {
+                            "location": "import",
+                            "path": "@verdocs/js-sdk",
+                            "id": ""
+                        }
+                    }
+                }
+            }, {
+                "method": "changeSharing",
+                "name": "changeSharing",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event fired when the user changes their sort order. Host applications can use this to save the user's preferences."
+                },
+                "complexType": {
+                    "original": "'all' | 'personal' | 'shared' | 'public'",
+                    "resolved": "\"all\" | \"personal\" | \"public\" | \"shared\"",
+                    "references": {}
+                }
+            }, {
+                "method": "changeStarred",
+                "name": "changeStarred",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event fired when the user changes their sort order. Host applications can use this to save the user's preferences."
+                },
+                "complexType": {
+                    "original": "'all' | 'starred' | 'unstarred'",
+                    "resolved": "\"all\" | \"starred\" | \"unstarred\"",
+                    "references": {}
+                }
+            }, {
+                "method": "changeName",
+                "name": "changeName",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event fired when the user changes the name filter. This is fired for every inputChange event (every character\ntyped). This event is provided for balance with the other events, but host applications should generally not\nsave this value. Users might appreciate applications remembering their sorting or filtering preferences, but\nprobably not their search terms."
+                },
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                }
+            }];
+    }
+    static get watchers() {
+        return [{
+                "propName": "sharing",
+                "methodName": "handleSharingUpdated"
+            }, {
+                "propName": "starred",
+                "methodName": "handleStarredUpdated"
+            }, {
+                "propName": "sort",
+                "methodName": "handleSortUpdated"
+            }, {
+                "propName": "name",
+                "methodName": "handleNameUpdated"
+            }, {
+                "propName": "selectedPage",
+                "methodName": "handlePageUpdated"
+            }];
+    }
 }