@verdocs/web-sdk 4.2.107 → 4.2.108

package/dist/components/verdocs-search-tabs.js

@@ -10,7 +10,7 @@ const VerdocsSearchTabs$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSearch
         this.selected = 'all';
     }
     render() {
-        return h("div", { key: 'a67ed4b54a0613731357bfc6f88ecad363dce069' }, "\u00A0");
+        return h("div", { key: '1f3dba2661771f24f6a9a416b040b84d48f0356b' }, "\u00A0");
     }
     static get style() { return VerdocsSearchTabsStyle0; }
 }, [0, "verdocs-search-tabs", {

package/dist/components/verdocs-select-input2.js

@@ -13,7 +13,7 @@ const VerdocsSelectInput = /*@__PURE__*/ proxyCustomElement(class VerdocsSelectI
         this.disabled = false;
     }
     render() {
-        return (h(Host, { key: '0739fe617ba9018dc152d058231a1e0a327fa5b0', class: "input-field" }, h("label", { key: 'c99adc97fb2d65386dac00da03548131bd4ff4b5' }, this.label ? h("div", { class: "input-label" }, this.label + ':') : h("div", null), h("select", { key: 'd50a298b4f6d338b0f666f2976d4f8e0f2fb89a1', class: "input-element", disabled: this.disabled }, this.options.map(option => (h("option", { value: option.value, selected: option.value === this.value }, option.label)))))));
+        return (h(Host, { key: '190e18d69d6e891867c4c02d0e9053607b372b1f', class: "input-field" }, h("label", { key: '32a613ab516b76a45ecf5cdd61874a079fb05f07' }, this.label ? h("div", { class: "input-label" }, this.label + ':') : h("div", null), h("select", { key: 'd5347e5bca7dd01d0a9b71817028b0303753cf97', class: "input-element", disabled: this.disabled }, this.options.map(option => (h("option", { value: option.value, selected: option.value === this.value }, option.label)))))));
     }
     static get style() { return VerdocsSelectInputStyle0; }
 }, [0, "verdocs-select-input", {

package/dist/components/verdocs-sign.js

@@ -4,12 +4,13 @@ import { a as saveAttachment, u as updateDocumentFieldValue, r as renderDocument
 import { c as createTemplateFieldStoreFromEnvelope } from './TemplateFieldStore.js';
 import { V as VerdocsToast } from './Toast.js';
 import { S as SDKError } from './errors.js';
-import { d as defineCustomElement$8 } from './verdocs-button2.js';
-import { d as defineCustomElement$7 } from './verdocs-checkbox2.js';
-import { d as defineCustomElement$6 } from './verdocs-dropdown2.js';
-import { d as defineCustomElement$5 } from './verdocs-envelope-document-page2.js';
-import { d as defineCustomElement$4 } from './verdocs-loader2.js';
-import { d as defineCustomElement$3 } from './verdocs-ok-dialog2.js';
+import { d as defineCustomElement$9 } from './verdocs-button2.js';
+import { d as defineCustomElement$8 } from './verdocs-checkbox2.js';
+import { d as defineCustomElement$7 } from './verdocs-dropdown2.js';
+import { d as defineCustomElement$6 } from './verdocs-envelope-document-page2.js';
+import { d as defineCustomElement$5 } from './verdocs-loader2.js';
+import { d as defineCustomElement$4 } from './verdocs-ok-dialog2.js';
+import { d as defineCustomElement$3 } from './verdocs-portal2.js';
 import { d as defineCustomElement$2 } from './verdocs-view2.js';
 
 const verdocsSignCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-sign{display:-ms-flexbox;display:flex;overflow:hidden;position:relative;min-height:600px;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-sign div{display:block;-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-sign input{vertical-align:top}verdocs-sign>.document{-ms-flex:1;flex:1;width:100%;height:100%;-ms-flex-item-align:center;align-self:center;display:-ms-flexbox;display:flex;padding:15px;row-gap:15px;max-width:1200px;min-height:200px;position:relative;overflow-y:scroll;-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-direction:column;flex-direction:column}verdocs-sign>.document .inner{width:100%;max-width:1028px}verdocs-sign .cover{top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;z-index:5000;position:absolute;padding-top:100px;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;background:rgba(0, 0, 0, 0.5)}verdocs-sign .agree{-ms-flex:0;flex:0;width:600px;display:-ms-flexbox;display:flex;max-width:90%;padding:30px 15px;-ms-flex-direction:column;flex-direction:column;background-color:#ffffff}verdocs-sign .agree .header{-ms-flex:0 0 56px;flex:0 0 56px}verdocs-sign .agree li{margin:0.5em 0}verdocs-sign verdocs-ok-dialog .background-overlay{-ms-flex-align:start;align-items:flex-start;padding-top:100px}verdocs-sign .loading-indicator{top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;z-index:10000;position:fixed;background-color:rgba(0, 0, 0, 0.7)}@media print{verdocs-sign .header{display:none}}#verdocs-sign-header{color:#fff;width:100%;display:-ms-flexbox;display:flex;z-index:1000;-ms-flex:0 0 56px;flex:0 0 56px;font-size:12px;-webkit-column-gap:15px;-moz-column-gap:15px;column-gap:15px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;-webkit-transition:all 0.25s;transition:all 0.25s;background-color:#33354c;-webkit-box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.24), 0 0 4px 0 rgba(0, 0, 0, 0.12);box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.24), 0 0 4px 0 rgba(0, 0, 0, 0.12)}#verdocs-sign-header .inner{width:100%;display:-ms-flexbox;display:flex;margin:0 auto;padding:0 20px;max-width:1200px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}#verdocs-sign-header .logo{width:80px;display:none;margin:-6px 0 0 0}#verdocs-sign-header .title{font-size:18px;font-weight:500;overflow:hidden;white-space:nowrap;padding:0 10px 0 0;text-overflow:ellipsis}";
@@ -49,6 +50,9 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         this.errorMessage = '';
         this.focusedField = '';
         this.submitting = false;
+        this.submitted = false;
+        this.canceled = false;
+        this.declined = false;
         this.isDone = false;
         this.showDone = false;
         this.showLoadError = false;
@@ -83,14 +87,6 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
             console.log(`[SIGN] Loaded signing session`, envelope, recipient);
             this.recipient = recipient;
             this.envelope = envelope;
-            getKbaStep(this.endpoint, this.envelopeId, this.roleId)
-                .then(r => {
-                console.log('KBA Step', r);
-            })
-                .catch(e => console.log('Error getting KBA step', e));
-            if (this.agreed) {
-                this.nextButtonLabel = 'Next';
-            }
             createTemplateFieldStoreFromEnvelope(this.envelope);
             this.sortedRecipients = [...this.envelope.recipients];
             this.sortedRecipients.sort((a, b) => {
@@ -108,9 +104,22 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
             else {
                 console.warn('[SIGN] Could not find our recipient record', this.roleId, this.sortedRecipients);
             }
-            this.isDone = ['submitted', 'canceled', 'declined'].includes(this.recipient.status);
+            this.submitted = this.recipient.status === 'submitted';
+            this.declined = this.recipient.status === 'declined';
+            this.canceled = this.envelope.status === 'canceled';
+            this.isDone = this.submitted || this.declined || this.canceled;
+            if (this.agreed) {
+                this.nextButtonLabel = 'Next';
+            }
             this.checkRecipientFields();
             (_d = this.envelopeLoaded) === null || _d === void 0 ? void 0 : _d.emit({ endpoint: this.endpoint, envelope: this.envelope });
+            if (!this.isDone) {
+                getKbaStep(this.endpoint, this.envelopeId, this.roleId)
+                    .then(r => {
+                    console.log('[SIGN] KBA Step', r);
+                })
+                    .catch(e => console.log('Error getting KBA step', e));
+            }
         }
         catch (e) {
             console.log('[SIGN] Error with signing session', e);
@@ -165,6 +174,7 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
                     (_c = this.envelopeUpdated) === null || _c === void 0 ? void 0 : _c.emit({ endpoint: this.endpoint, envelope: this.envelope, event: 'declined' });
                     this.submitting = false;
                     this.isDone = true;
+                    this.declined = true;
                 }
                 break;
             case 'print':
@@ -513,7 +523,7 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
             return (h(Host, null, h("verdocs-loader", null)));
         }
         if (this.isDone) {
-            return (h(Host, { class: { agreed: this.agreed } }, h("verdocs-view", { endpoint: this.endpoint, envelopeId: this.envelopeId, onSdkError: e => { var _a; return (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } }), this.errorMessage && h("verdocs-ok-dialog", { heading: "Network Error", message: this.errorMessage, onNext: () => (this.errorMessage = '') }), this.showDone && (h("verdocs-ok-dialog", { heading: "You're Done!", message: `You can access the ${this.documentsSingularPlural} at any time by clicking on the link from the invitation email.<br /><br />After all recipients have completed their actions, you will receive an email with the document and envelope certificate attached.`, onNext: () => {
+            return (h(Host, { class: { agreed: this.agreed } }, h("verdocs-view", { endpoint: this.endpoint, envelopeId: this.envelopeId, envelope: this.envelope, onSdkError: e => { var _a; return (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } }), this.errorMessage && h("verdocs-ok-dialog", { heading: "Network Error", message: this.errorMessage, onNext: () => (this.errorMessage = '') }), this.showDone && (h("verdocs-ok-dialog", { heading: "You're Done!", message: `You can access the ${this.documentsSingularPlural} at any time by clicking on the link from the invitation email.<br /><br />After all recipients have completed their actions, you will receive an email with the document and envelope certificate attached.`, onNext: () => {
                     this.showDone = false;
                     this.isDone = true;
                 } })), this.submitting && (h("div", { class: "loading-indicator" }, h("verdocs-loader", null)))));
@@ -556,6 +566,9 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         "errorMessage": [32],
         "focusedField": [32],
         "submitting": [32],
+        "submitted": [32],
+        "canceled": [32],
+        "declined": [32],
         "isDone": [32],
         "showDone": [32],
         "showLoadError": [32],
@@ -568,7 +581,7 @@ function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["verdocs-sign", "verdocs-button", "verdocs-checkbox", "verdocs-dropdown", "verdocs-envelope-document-page", "verdocs-loader", "verdocs-ok-dialog", "verdocs-view"];
+    const components = ["verdocs-sign", "verdocs-button", "verdocs-checkbox", "verdocs-dropdown", "verdocs-envelope-document-page", "verdocs-loader", "verdocs-ok-dialog", "verdocs-portal", "verdocs-view"];
     components.forEach(tagName => { switch (tagName) {
         case "verdocs-sign":
             if (!customElements.get(tagName)) {
@@ -577,30 +590,35 @@ function defineCustomElement$1() {
             break;
         case "verdocs-button":
             if (!customElements.get(tagName)) {
-                defineCustomElement$8();
+                defineCustomElement$9();
             }
             break;
         case "verdocs-checkbox":
             if (!customElements.get(tagName)) {
-                defineCustomElement$7();
+                defineCustomElement$8();
             }
             break;
         case "verdocs-dropdown":
             if (!customElements.get(tagName)) {
-                defineCustomElement$6();
+                defineCustomElement$7();
             }
             break;
         case "verdocs-envelope-document-page":
             if (!customElements.get(tagName)) {
-                defineCustomElement$5();
+                defineCustomElement$6();
             }
             break;
         case "verdocs-loader":
             if (!customElements.get(tagName)) {
-                defineCustomElement$4();
+                defineCustomElement$5();
             }
             break;
         case "verdocs-ok-dialog":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "verdocs-portal":
             if (!customElements.get(tagName)) {
                 defineCustomElement$3();
             }

package/dist/components/verdocs-signature-dialog2.js

@@ -220,7 +220,7 @@ const VerdocsSignatureDialog = /*@__PURE__*/ proxyCustomElement(class VerdocsSig
     }
      */
     render() {
-        return (h(Host, { key: '53849e64803bef6eb9d350c0b74c31f85ae1d85d', onClick: e => this.handleCancel(e) }, h("div", { key: 'bbf1ac4498157388d44cc41c27dc2183eebaf990', class: "dialog" }, h("div", { key: '0b56bb436a6431af0b61effdffb31133437c12df', class: "heading" }, "Create Your Signature"), h("div", { key: 'a39e8a59f6744ba89ef321ba33dbabd1911fd225', class: "content" }, h("verdocs-text-input", { key: 'bc8d46fece7c7507fc506bd9dcc739eb848f54ea', placeholder: "Full Name...", label: "Full Name", value: this.enteredName, onInput: e => this.handleNameChange(e), onClick: e => e.stopPropagation() }), h("div", { key: '021334bb046539364e2c2c4d8797519a2e38dcb4', class: "as-shown" }, "As shown on driver's license or govt. ID card."), this.fontLoaded ? h("canvas", { ref: el => (this.canvasElement = el) }) : h("div", { style: { display: 'none' } }), h("div", { key: '455dcd5d4a651af7d5cb7375996c063a30ab5f89', class: "disclaimer" }, "By clicking Adopt, I agree that the signature will be the electronic representation of my signature for all purposes when I (or my agent) use them on documents, including legally binding contracts \u2014 just the same as a pen-and-paper signature or initial."), h("div", { key: '78c53b3d62310ce14ee4782f3ebb5bdc17b31fbb', class: "buttons" }, h("verdocs-button", { key: 'be2adff2be29e9fd4f22d2a5665d56330bbcbe09', label: "CANCEL", size: "normal", variant: "outline", onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: 'e7eb8cbd63184fb567c86f6e2cb11e1afa6df036', label: "Adopt & Sign", size: "normal", onClick: e => this.handleAdopt(e) }))))));
+        return (h(Host, { key: '1c8be76f76ad6c6c6bb455ea94af5aaefe48d8dc', onClick: e => this.handleCancel(e) }, h("div", { key: '179622d724573e78c3a23b81902c5380dfd3b6b4', class: "dialog" }, h("div", { key: 'a149f5453e75339e07fa6fa93c69099e5857b6c6', class: "heading" }, "Create Your Signature"), h("div", { key: 'b55b63fc5fd3050b164ff1952dc0b206265c6c06', class: "content" }, h("verdocs-text-input", { key: '2e9edfb8b7cf22819a72c2a7e831b8245134c710', placeholder: "Full Name...", label: "Full Name", value: this.enteredName, onInput: e => this.handleNameChange(e), onClick: e => e.stopPropagation() }), h("div", { key: 'a4e3a34686a783b9b16ea84b93331847ba42052f', class: "as-shown" }, "As shown on driver's license or govt. ID card."), this.fontLoaded ? h("canvas", { ref: el => (this.canvasElement = el) }) : h("div", { style: { display: 'none' } }), h("div", { key: 'a5d433881194fb0beadeb357710f45c63c5a7d5a', class: "disclaimer" }, "By clicking Adopt, I agree that the signature will be the electronic representation of my signature for all purposes when I (or my agent) use them on documents, including legally binding contracts \u2014 just the same as a pen-and-paper signature or initial."), h("div", { key: 'c0af3589e89e786f5ef67ff28786514942441bd3', class: "buttons" }, h("verdocs-button", { key: 'd7fd63314a28a0ffa430d8136718c6c4af846a5b', label: "CANCEL", size: "normal", variant: "outline", onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: '7811cf9c0c33c2f739458dec0aae9fab09ab291e', label: "Adopt & Sign", size: "normal", onClick: e => this.handleAdopt(e) }))))));
     }
     static get style() { return VerdocsSignatureDialogStyle0; }
 }, [0, "verdocs-signature-dialog", {

package/dist/components/verdocs-spinner2.js

@@ -13,7 +13,7 @@ const VerdocsQuickFilter = /*@__PURE__*/ proxyCustomElement(class VerdocsQuickFi
         this.mode = 'light';
     }
     render() {
-        return (h(Host, { key: '3f0d44897ca6b5f704f8566da9cb17cf3d18ebbb', style: {
+        return (h(Host, { key: '33e182037ce0a988e30b7a2ee1f31591f8ac1b08', style: {
                 width: `${this.size}px`, //
                 height: `${this.size}px`,
                 flex: `0 0 ${this.size}px`,

package/dist/components/verdocs-status-indicator2.js

@@ -7190,11 +7190,11 @@ const VerdocsStatusIndicator = /*@__PURE__*/ proxyCustomElement(class VerdocsSta
         }
         const icon = this.getStatusIcon(status);
         const statusMessage = this.getStatusMessage(status);
-        return (h(Host, { key: '25fadd6d77be693e57cb2fb5a09a31eb63646570', ref: el => (this.summaryComponent = el), class: `${this.theme} ${this.size} ${this.envelope ? 'has-document' : ''}`, "aria-label": "Click to View Details", onClick: e => {
+        return (h(Host, { key: '59e5538e41c29b74d4f8d53c8674fb2d0d159ab9', ref: el => (this.summaryComponent = el), class: `${this.theme} ${this.size} ${this.envelope ? 'has-document' : ''}`, "aria-label": "Click to View Details", onClick: e => {
                 e.stopPropagation();
                 e.preventDefault();
                 this.envelope && this.toggleDropdown();
-            }, onBlur: e => this.envelope && this.handleHideDropdown(e) }, h("span", { key: 'aa78dca223dc4db4a1f89cf7978064553d7abea3', class: "icon", innerHTML: icon }), h("span", { key: '84f93dbd4c9cbff90abdc1dfeaef46cb592151b5', class: "content" }, statusMessage), h("div", { key: 'dccc1698ae3548ee0aa1a8e01a2fa0bfdabe3737', class: "detail-panel", ref: el => (this.detailPanel = el) }, h("div", { key: '129b157b29e1a7b610244b4ec02f7af59221ec8f', id: `${this.containerId}` }), this.recipientStatusIcons.map(icon => (h("span", { innerHTML: icon.icon, style: { position: 'absolute', top: `${icon.y}px`, left: `${icon.x}px` } }))))));
+            }, onBlur: e => this.envelope && this.handleHideDropdown(e) }, h("span", { key: 'c3fda712b9cbede053c1ed89914d85b3eb8c8d96', class: "icon", innerHTML: icon }), h("span", { key: 'da87a24aef046a682a479580f7157f22778c1344', class: "content" }, statusMessage), h("div", { key: '37ca0dc5c864927f40b6bacaff2aed3a8b9b892b', class: "detail-panel", ref: el => (this.detailPanel = el) }, h("div", { key: 'cd4ebea386ae4abd6c95720c7f8c3cf640e33c3d', id: `${this.containerId}` }), this.recipientStatusIcons.map(icon => (h("span", { innerHTML: icon.icon, style: { position: 'absolute', top: `${icon.y}px`, left: `${icon.x}px` } }))))));
     }
     static get style() { return VerdocsStatusIndicatorStyle0; }
 }, [0, "verdocs-status-indicator", {

package/dist/components/verdocs-switch2.js

@@ -13,13 +13,13 @@ const VerdocsSwitch = /*@__PURE__*/ proxyCustomElement(class VerdocsSwitch exten
         this.disabled = false;
     }
     render() {
-        return (h("button", { key: '34e83b914cb01d1d1b52c7091b68324808f7f8f3', value: "on", type: "button", role: "switch", class: `switch ${this.theme} ${this.disabled ? 'disabled' : ''}`, "data-state": this.checked ? 'checked' : 'unchecked', "aria-checked": this.checked ? 'checked' : 'unchecked', onClick: () => {
+        return (h("button", { key: '6cc3b6ceec83890cafd71abb8c6def5501bed6a7', value: "on", type: "button", role: "switch", class: `switch ${this.theme} ${this.disabled ? 'disabled' : ''}`, "data-state": this.checked ? 'checked' : 'unchecked', "aria-checked": this.checked ? 'checked' : 'unchecked', onClick: () => {
                 var _a;
                 if (!this.disabled) {
                     this.checked = !this.checked;
                     (_a = this.checkedChange) === null || _a === void 0 ? void 0 : _a.emit(this.checked);
                 }
-            } }, h("span", { key: 'bfe8fe82ec75ec1a703e900e2eed9b56590e1a6d', "data-state": this.checked ? 'checked' : 'unchecked', class: "slider" })));
+            } }, h("span", { key: 'f6867dea9d0ebb119f401d0892149b1959a1b801', "data-state": this.checked ? 'checked' : 'unchecked', class: "slider" })));
     }
     static get style() { return VerdocsSwitchStyle0; }
 }, [0, "verdocs-switch", {

package/dist/components/verdocs-table.js

@@ -13,9 +13,9 @@ const VerdocsTable$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsTable exten
         this.data = [];
     }
     render() {
-        return (h(Host, { key: '4ffe8d38c873db9420325df769676a4411f5aa28', class: "table-wrapper" }, h("table", { key: 'a51dbc58bc7eb6504ca054f94e4795238e42e0aa', class: "table" }, h("thead", { key: '18e488f81ae20486bd281d79340c4b5e5611550f' }, h("tr", { key: '9ea7794a55a2669aae8144db8ecfb16fdaad281a', class: "row header-row" }, this.columns.map((col, i) => {
+        return (h(Host, { key: '0f5ccb1d3bf8296157a3b4988a158a0277405127', class: "table-wrapper" }, h("table", { key: '0994c41fb599962358081f0849dd3d3399780397', class: "table" }, h("thead", { key: 'ebee5297f9bae8d5527e8ea2ad84c44278aed243' }, h("tr", { key: 'ee44689ef6c78e4debb206e6d554f9df848e1868', class: "row header-row" }, this.columns.map((col, i) => {
             return (h("th", { class: `col header-col col-${i} col-${col.id}`, onClick: () => { var _a; return (_a = this.colHeaderClick) === null || _a === void 0 ? void 0 : _a.emit({ col }); }, innerHTML: col.renderHeader ? col.renderHeader(col) : col.header || col.id }));
-        }))), h("tbody", { key: 'fede948c8464f5e41376569b995dcf080ea8729a' }, this.data.map(row => (h("tr", { class: "row data-row", onClick: () => { var _a; return (_a = this.rowClick) === null || _a === void 0 ? void 0 : _a.emit({ row }); } }, this.columns.map((col, i) => {
+        }))), h("tbody", { key: '9cbccc8987ca66498dbd006c2599bc6f2c85c8d6' }, this.data.map(row => (h("tr", { class: "row data-row", onClick: () => { var _a; return (_a = this.rowClick) === null || _a === void 0 ? void 0 : _a.emit({ row }); } }, this.columns.map((col, i) => {
             return col.renderCell ? (h("td", { class: `col data-col col-${i} col-${col.id}`, innerHTML: col.renderCell(col, row) })) : (h("td", { class: `col data-col col-${i} col-${col.id}` }, row[col.id]));
         }))))))));
     }

package/dist/components/verdocs-tabs2.js

@@ -16,7 +16,7 @@ const VerdocsTabs = /*@__PURE__*/ proxyCustomElement(class VerdocsTabs extends H
         (_a = this.selectTab) === null || _a === void 0 ? void 0 : _a.emit({ tab: this.tabs[index], index });
     }
     render() {
-        return (h(Host, { key: 'bbbb38d60e005c8a80bc1db7f8ef12f79f05e3fc' }, this.tabs.map((tab, index) => (h("div", { class: `tab ${index === this.selectedTab ? 'active' : ''} ${tab.disabled ? 'disabled' : ''}`, onClick: tab.disabled ? () => { } : () => this.handleSelectTab(index) }, tab.label))), h("div", { key: 'f0ced79f6ed6110e5a9d41144adca56fac15ac3d', class: "flex flex-1" }), h("slot", { key: '8233a33dba15599e7d2e084c4c77a9cc229c980e' }, h("div", { key: 'dc3d1aad930fdc5ae56b299213f6251f5e35c240' }))));
+        return (h(Host, { key: '8ab00805038e36168788192e547553eab63a9899' }, this.tabs.map((tab, index) => (h("div", { class: `tab ${index === this.selectedTab ? 'active' : ''} ${tab.disabled ? 'disabled' : ''}`, onClick: tab.disabled ? () => { } : () => this.handleSelectTab(index) }, tab.label))), h("div", { key: '9ef21a7184419e182329af6d0e84b687044d8dac', class: "flex flex-1" }), h("slot", { key: '2f3b464631b875a5b2c82c0bac8cf66ffe57f92f' }, h("div", { key: 'adde9132bfcd592f65b1a1bd8a30f528e5aa3090' }))));
     }
     static get style() { return VerdocsTabsStyle0; }
 }, [4, "verdocs-tabs", {

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

@@ -15,7 +15,7 @@ const VerdocsTemplateCard$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsTemp
     }
     render() {
         var _a, _b, _c, _d;
-        return (h(Host, { key: '2414caafbeb66be4f7418b22ab9766aaea18de4e' }, h("span", { key: '8b571bc3f50445e4a4413821ee4ade2c75940600', class: "name" }, this.template.name), h("span", { key: '77d3c36194959ca19928cb880dd2144c30079f5e', class: "org-name" }, ((_a = this.template.organization) === null || _a === void 0 ? void 0 : _a.name) || 'Public'), h("hr", { key: '5fa18b953a61dce4cc7d256552f5fbeace9b2fc2' }), h("div", { key: 'cd10884524860b3843b2bc308a1f5cd98e3521e6', class: "controls" }, h("div", { key: '1f9ea0ae36c3e9a285eb2124174a4096408f2833', class: "control" }, h("span", { key: '19249d5fdd259422591022aaad3b87626242b23b', class: "icon", innerHTML: StarIcon }), h("span", { key: '73c17da734ce561ed2a34792e7e49d3c5ef5ac88', class: "value" }, this.template.star_counter)), h("div", { key: '16c77cae206032ce4874aa8e3d94abdf56894563', class: "control secondary" }, h("span", { key: 'df2e55e5eb12dbc13d9fc566bf9c225da612a23e', class: "icon", innerHTML: PagesIcon }), h("span", { key: '0ff2120849aa15da404ad9f057b70fc47d8be414', class: "value" }, ((_d = (_c = (_b = this.template) === null || _b === void 0 ? void 0 : _b.documents) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.pages) || 1)), h("div", { key: '8d5b816f15260673af8b53d7473f58f18fd82f46', class: "control secondary" }, h("span", { key: '161b8b7532fd4ee0a294dd8fed77fd82f90e78ad', class: "icon", innerHTML: EmailIcon }), h("span", { key: 'f80ca578f61f52ecebd13faf1c6a28a4b2efb431', class: "value" }, this.template.counter)), h("span", { key: '4ca0becd38dfd69172a5fb9f898b65dd03a330f3', class: "additional-controls", innerHTML: ActionsIcon }))));
+        return (h(Host, { key: '764d4b13847b9248b54f75b415d7aa9bd47f1a0e' }, h("span", { key: '63e24c019fa23f00dd40b251fe89cdf720df9994', class: "name" }, this.template.name), h("span", { key: 'a709d0cf41957ba84ccbd5b58c63ecaec41272d5', class: "org-name" }, ((_a = this.template.organization) === null || _a === void 0 ? void 0 : _a.name) || 'Public'), h("hr", { key: '33a685839d160dc1f8cea2ede8784878a34cca13' }), h("div", { key: '0e08647c71b9245cfd1cb372c4dbe44805cb98db', class: "controls" }, h("div", { key: '42763e333948034dbf73e186dfdc4ba82068d399', class: "control" }, h("span", { key: '3ffcc3c8c3c766fa2d8a4a617373223bffab5768', class: "icon", innerHTML: StarIcon }), h("span", { key: 'e1bdfa83c6764f1522e87011d19d65dee70492b8', class: "value" }, this.template.star_counter)), h("div", { key: '05f132e36844a277a4bf619248d4f1405f5175a6', class: "control secondary" }, h("span", { key: '88615f3a8413a68132098961898ceed4d369d9b1', class: "icon", innerHTML: PagesIcon }), h("span", { key: 'd35c7465d76f88a8fd29045d4ea18b9dd6031667', class: "value" }, ((_d = (_c = (_b = this.template) === null || _b === void 0 ? void 0 : _b.documents) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.pages) || 1)), h("div", { key: '179a4acabb579ea1c52793c4681f0dec2947800f', class: "control secondary" }, h("span", { key: '3d5de3e3d320eb3209aa5b8809d06613fe24da7c', class: "icon", innerHTML: EmailIcon }), h("span", { key: 'f2386b02c0562d8dc02bd2508c5a56059616d2c7', class: "value" }, this.template.counter)), h("span", { key: 'd98e1df83d33b1aa258f4bb92361dd4dc119269f', class: "additional-controls", innerHTML: ActionsIcon }))));
     }
     static get style() { return VerdocsTemplateCardStyle0; }
 }, [0, "verdocs-template-card", {

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

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

package/dist/components/verdocs-template-role-properties2.js

@@ -127,34 +127,34 @@ const VerdocsTemplateRoleProperties = /*@__PURE__*/ proxyCustomElement(class Ver
     }
     render() {
         const hasFields = this.fieldStore.get('fields').some(field => field.role_name === this.roleName);
-        return (h(Host, { key: '730f06520de9e020296cacf991aa025606d7dbfb' }, h("div", { key: '5ac072dbe9f312b468d9a1b8d699694185c03e22', class: "background-overlay", onClick: e => this.handleCancel(e) }, h("div", { key: 'b303190355d969808ee3554b85c26e3f6da52536', class: "dialog" }, h("form", { key: '21a0ef6e184c52d92b47fc48f6210170a9a06697', onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("verdocs-text-input", { key: 'bd81053ec77721af0b116a0060fa5d7cf2b82b03', id: "verdocs-role-name", label: "Role Name", value: this.name, autocomplete: "off", disabled: hasFields, helpText: hasFields
+        return (h(Host, { key: 'a1e71e2e85110fc84f4639a249a869effa03059c' }, h("div", { key: 'e5d573e2e8782ac53a34caa8a861e31e5011a8e0', class: "background-overlay", onClick: e => this.handleCancel(e) }, h("div", { key: 'e185f3b840b6ac8922672f5cdafbd2a0215e820f', class: "dialog" }, h("form", { key: '8d98eae65f1672e89db98aed339533f5723d544b', onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("verdocs-text-input", { key: 'e5659b7b89e51cf6a7e1015ff962730009888113', id: "verdocs-role-name", label: "Role Name", value: this.name, autocomplete: "off", disabled: hasFields, helpText: hasFields
                 ? 'This role has fields assigned and can no longer be renamed.'
                 : 'A unique name to identify the role in the workflow. Submitted data will also be tagged with this value.', placeholder: "Role Name...", onInput: (e) => {
                 this.name = e.target.value;
                 this.dirty = true;
-            } }), h("div", { key: '52b3feb14fb51e426db734624db563de1d1b2e24', class: "row" }, h("div", { key: '91ec0ebe42974aa36c5144d5815ac1d138862d95', class: "input-label" }, "Type:"), h("verdocs-select-input", { key: 'dc06b63a7efe16b244bf667d6eb1e7b4ba27d951', value: this.type, options: [
+            } }), h("div", { key: 'b891fcf91ddb5dda364c2906c24d3d8a133ba959', class: "row" }, h("div", { key: 'e7c4510014a59a4c77cc178b535082d8a4048365', class: "input-label" }, "Type:"), h("verdocs-select-input", { key: '1cc4b4a1e3edbb40ba60ef5d35b4becde48d5a17', value: this.type, options: [
                 { label: 'Signer', value: 'signer' },
                 { label: 'CC', value: 'cc' },
                 { label: 'Approver', value: 'approver' },
             ], onInput: (e) => {
                 this.type = e.target.value;
                 this.dirty = true;
-            } }), h("verdocs-help-icon", { key: 'cd2117c7265b9b14bd30d46a78bf931a3d431495', text: "Most participants are Signers. CC roles are notified when documents are signed, but have no other actions. Approvers get notified when signing is completed to perform a final review." })), h("verdocs-text-input", { key: 'e1cc994258b539ab40e4e7fabc2544b1c7d82ade', id: "verdocs-recipient-first", label: "First Name", value: this.first_name, autocomplete: "off", helpText: "The recipient's first name, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "First Name...", onInput: (e) => {
+            } }), h("verdocs-help-icon", { key: '69b3ffb497857debafc245aeb263d3e1cdbcac11', text: "Most participants are Signers. CC roles are notified when documents are signed, but have no other actions. Approvers get notified when signing is completed to perform a final review." })), h("verdocs-text-input", { key: '15ef892258e97a4397ce6b05d13e999937112cce', id: "verdocs-recipient-first", label: "First Name", value: this.first_name, autocomplete: "off", helpText: "The recipient's first name, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "First Name...", onInput: (e) => {
                 this.first_name = e.target.value;
                 this.dirty = true;
-            } }), h("verdocs-text-input", { key: '1a9ce3573fbf3a9a4495862cc780b6321169bef7', id: "verdocs-recipient-first", label: "Last Name", value: this.last_name, autocomplete: "off", helpText: "The recipient's last name, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Last Name...", onInput: (e) => {
+            } }), h("verdocs-text-input", { key: '0319a7fe5f3bd910ac32cb327ba764e209c08a6c', id: "verdocs-recipient-first", label: "Last Name", value: this.last_name, autocomplete: "off", helpText: "The recipient's last name, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Last Name...", onInput: (e) => {
                 this.last_name = e.target.value;
                 this.dirty = true;
-            } }), h("verdocs-text-input", { key: 'ef313cdd9da5f9ce299513a0f74a0010978a04f0', id: "verdocs-recipient-email", label: "Email", value: this.email, autocomplete: "off", helpText: "The recipient's email address, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Email Address...", onInput: (e) => {
+            } }), h("verdocs-text-input", { key: '2848ae472e3c0b2bf634a235cb72e89bd2d409b0', id: "verdocs-recipient-email", label: "Email", value: this.email, autocomplete: "off", helpText: "The recipient's email address, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Email Address...", onInput: (e) => {
                 this.email = e.target.value;
                 this.dirty = true;
-            } }), h("verdocs-text-input", { key: '017395decc39091207de4152283e401931254f10', id: "verdocs-recipient-phone", label: "Phone", value: this.phone, autocomplete: "off", helpText: "The recipient's phone number, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Phone Number...", onInput: (e) => {
+            } }), h("verdocs-text-input", { key: 'd25f31ed90028ca4cd4f7b1660a0988be3ecf112', id: "verdocs-recipient-phone", label: "Phone", value: this.phone, autocomplete: "off", helpText: "The recipient's phone number, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Phone Number...", onInput: (e) => {
                 this.phone = e.target.value;
                 this.dirty = true;
-            } }), h("div", { key: '68434c73d7fdcb24141cdf13ff9c076d477480c7', class: "row" }, h("div", { key: 'c5afca6f072a5a76646f5575b871bf55a075cc1b', class: "input-label" }, "May Delegate:"), h("div", { key: '55bfc7a17dcadf265d5ca6a7bbef12c1261392c2', class: "checkbox-wrapper" }, h("verdocs-checkbox", { key: 'd25aab079a596000a710a31cad269698d131f1b1', checked: this.delegator, onInput: (e) => {
+            } }), h("div", { key: '1c569da3207a3d46bb3a0f417cf1488d4c4ebfa6', class: "row" }, h("div", { key: 'daa2968dcba6cba37b84d57fd682f60a1dd5adbc', class: "input-label" }, "May Delegate:"), h("div", { key: '15b44b67d4b554bb1f6546746b0d60b78b67a3ee', class: "checkbox-wrapper" }, h("verdocs-checkbox", { key: '6f6046bd9791923328c234f7394ecacd674a1926', checked: this.delegator, onInput: (e) => {
                 this.delegator = e.target.checked;
                 this.dirty = true;
-            } })), h("verdocs-help-icon", { key: 'c95eeeb21f1c237ea5c3b0b92c14d5d62fc1617a', text: "If enabled, this recipient may delegate their actions to another individual." })), h("div", { key: 'f563be7c352b2fd1ea04936796a942ae6353ae90', class: "buttons" }, h("button", { key: '107f332bc0650e9b1c2ac3666bebb6b7b0ec4c7c', class: "delete-button", disabled: this.dirty, onClick: e => this.handleDelete(e), innerHTML: TrashIcon }), h("div", { key: 'f462302d0a04d178303ea8831eeaccdc18410265', style: { flex: '1' } }), h("verdocs-button", { key: 'ea1eabf74981acaa1674e94a9134fb6270b3b8d8', size: "small", variant: "outline", label: "Cancel", disabled: !this.dirty, onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: '1ff52f0f25400416414477d2d7bf271bce5c310e', size: "small", label: "Save", disabled: !this.dirty, onClick: e => this.handleSave(e) })))))));
+            } })), h("verdocs-help-icon", { key: 'ad0ffedf4341761786cd3764f6b9794a97211dc9', text: "If enabled, this recipient may delegate their actions to another individual." })), h("div", { key: '496ee13c6b658687975d58978a000f9eb555a9c3', class: "buttons" }, h("button", { key: 'fa00b8f96af35ba7603ef660dd596cee1c7d3e21', class: "delete-button", disabled: this.dirty, onClick: e => this.handleDelete(e), innerHTML: TrashIcon }), h("div", { key: '7866c12a9e3d073aaef509324de7c02788d117a9', style: { flex: '1' } }), h("verdocs-button", { key: '699bda4fd7cad7cd02affd6e76fdf00f360e940b', size: "small", variant: "outline", label: "Cancel", disabled: !this.dirty, onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: 'df0476c8601ec5a0bd84ab7166ea03a323ff68f5', size: "small", label: "Save", disabled: !this.dirty, onClick: e => this.handleSave(e) })))))));
     }
     static get style() { return VerdocsTemplateRolePropertiesStyle0; }
 }, [0, "verdocs-template-role-properties", {

package/dist/components/verdocs-template-sender2.js

@@ -69,7 +69,7 @@ const VerdocsTemplateSender = /*@__PURE__*/ proxyCustomElement(class VerdocsTemp
         });
     }
     render() {
-        return (h(Host, { key: '849ebcae79fea1e7e810ea49c6d97fb26ef71601' }, h("div", { key: 'c4beb47af9820bbf7fdbb13386a381a1ec0ef3eb', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '6f1b23281f27a3e340602e73c6fc476d5a7d1a7b', class: "dialog" }, h("div", { key: '04aed5aff479eb6f1af4343dd838dfe57c7d9f3a', class: "options" }, h("div", { key: '484b72a2b7bd73ae9143219d539a6aa120a9cc5c', class: "option" }, h("verdocs-radio-button", { key: '2473798c37783ce1fc531d888120ef0187c28cb8', name: "template-sender", value: 'everyone', checked: this.sender === 'everyone', onInput: () => this.handleSelectSetting('everyone') }), h("div", { key: 'ba79bcdb09dfe1fdbd9adbb9f8fc5f593cc1a4db', class: "description" }, h("div", { key: '0bc8cac502ddac20468fa2e1c88e71940f17b069', class: "name" }, "Anyone on the Web"), h("verdocs-help-icon", { key: '153fc6f5e4371d3896f8886ae442a4caf8d1170d', text: "Anyone can use this template. (Make its visibility is set to to 'Public' or 'Shared'.)" }))), h("div", { key: '16e66ac18576da8b0080896c9457d8ad7fd86ed9', class: "option" }, h("verdocs-radio-button", { key: '45af40b3e65d78b61f84c7ebe0c8eda2766ea461', name: "template-sender", value: 'everyone_as_creator', checked: this.sender === 'everyone_as_creator', onInput: () => this.handleSelectSetting('everyone_as_creator') }), h("div", { key: '864183ff6d21343e1e2ac3ec878feb5cb464df51', class: "description" }, h("div", { key: 'fc0c1004ebddbbbfa7409a05aa1111640a8327ad', class: "name" }, "Anyone on the Web as me"), h("verdocs-help-icon", { key: 'a7527d745ea6cb3cc6b5eb0b67bc1e658a1834f9', text: "Anyone can use this template on my behalf. (Make sure its visibility is set to 'Public' or 'Shared'.)" }))), h("div", { key: '5324d01a5a9b4c6776e42c24fa605c6e7e1ba02b', class: "option" }, h("verdocs-radio-button", { key: '06fb10ac6f84d0eeffec279038bc4a55e3812466', name: "template-sender", value: 'organization_member', checked: this.sender === 'organization_member', onInput: () => this.handleSelectSetting('organization_member') }), h("div", { key: 'c29edc2f40ec7b8d4346d828341afc1722b0043b', class: "description" }, h("div", { key: '016a3f3625d3ae00aa58cb2ad035a657c862d7e0', class: "name" }, "Anyone in my organization"), h("verdocs-help-icon", { key: 'd3eefcb15e9d6ee005077161ce674d82e21433e4', text: "Anyone in my organization can use this template. (Make sure its visibility is set to 'Shared')" }))), h("div", { key: '931602e92a61ff86332e420a02edd37cc002e186', class: "option" }, h("verdocs-radio-button", { key: '37c44e49f533700c8c2bb97adb394642b14b8fb5', name: "template-sender", value: 'organization_member_as_creator', checked: this.sender === 'organization_member_as_creator', onInput: () => this.handleSelectSetting('organization_member_as_creator') }), h("div", { key: '3f403de6f7c9548c13d744ce3fefae28ab4dce5d', class: "description" }, h("div", { key: 'f1cd1809ff04d543a2edc539504c894e19883879', class: "name" }, "Anyone in my organization as me"), h("verdocs-help-icon", { key: '1bba4cf3258bf6c7b686a09e0e9b778154a926e2', text: "Anyone in my organization can use this template on my behalf. (Make sure its visibility is set to to 'Shared'.)" }))), h("div", { key: 'e7a9e1f669cee3f845de44f928226b0e08c1db39', class: "option" }, h("verdocs-radio-button", { key: 'be8748e7ad1f623354d6889645f6b8191c68859c', name: "template-sender", value: 'creator', checked: this.sender === 'creator', onInput: () => this.handleSelectSetting('creator') }), h("div", { key: 'e5a4d884bfd01e176a568683310d23a1dcdaf042', class: "description" }, h("div", { key: '2166ceda9313a02750213bedf3c5170e7993c239', class: "name" }, "Me"), h("verdocs-help-icon", { key: 'f28de55873d3382d31c1734d393300b183c077ba', text: "Only I can use this template." })))), h("div", { key: 'cb36edb7d23d07ff5101e568f17d7b79a288a72b', class: "buttons" }, h("verdocs-button", { key: '63d7d2a227d4f39bc0eeaa7c7c935d95350921b4', label: "Close", onClick: () => this.handleClose() }))))));
+        return (h(Host, { key: 'e51de4bd58287341b8b1f5679c03ea8f388aeaed' }, h("div", { key: 'a93c06f123a78217478fe16299fa4345863d8b53', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '78a9f18025bbad871be472a12ec3f27665700be4', class: "dialog" }, h("div", { key: '4227eb9c4f23342c0d7b40b4c4cc77878f48f3ba', class: "options" }, h("div", { key: '041a7ec81a81653c650924323a6ad6597d2c46f5', class: "option" }, h("verdocs-radio-button", { key: 'e98602966885fd7a5119d4c5acb3d3fecaf752ad', name: "template-sender", value: 'everyone', checked: this.sender === 'everyone', onInput: () => this.handleSelectSetting('everyone') }), h("div", { key: '3f7fb8069d798329020eca837db6431bd1d80ba2', class: "description" }, h("div", { key: 'cb1da501fd3cce4f0bdecdb7992d1889caded1a7', class: "name" }, "Anyone on the Web"), h("verdocs-help-icon", { key: '837bfdb94c53c951fd2669bceb25947a0cec0f98', text: "Anyone can use this template. (Make its visibility is set to to 'Public' or 'Shared'.)" }))), h("div", { key: '05a5a34875d6103fbec3ac0a9c41d001abcf73cb', class: "option" }, h("verdocs-radio-button", { key: '15a5daa447b6697c3ccc6621802451b10ab18cb7', name: "template-sender", value: 'everyone_as_creator', checked: this.sender === 'everyone_as_creator', onInput: () => this.handleSelectSetting('everyone_as_creator') }), h("div", { key: 'a4c8e2fce754de4f4fb65a983dcd6a73b3c4cf90', class: "description" }, h("div", { key: '60bc31ca29d6c9554c4b20202a848e0eb742914e', class: "name" }, "Anyone on the Web as me"), h("verdocs-help-icon", { key: 'c0cf14c6ba072ed36b039facf59b749b25fa80ed', text: "Anyone can use this template on my behalf. (Make sure its visibility is set to 'Public' or 'Shared'.)" }))), h("div", { key: 'd3aa2900be1c02c82859c46e62554b0ea3bd0382', class: "option" }, h("verdocs-radio-button", { key: 'edab1a25a81388f237ab187cad4ebfecbfd8f5b7', name: "template-sender", value: 'organization_member', checked: this.sender === 'organization_member', onInput: () => this.handleSelectSetting('organization_member') }), h("div", { key: '05006c432b108586048d8e3a63f3b506f184dab3', class: "description" }, h("div", { key: '46d929d03d0ac453bf75e5bb7785373f741f2b47', class: "name" }, "Anyone in my organization"), h("verdocs-help-icon", { key: 'e02f6a03e7e5c46141ecdf9aa50b4047eced450e', text: "Anyone in my organization can use this template. (Make sure its visibility is set to 'Shared')" }))), h("div", { key: 'd6a67519982feab0e5ef3131349ca53a4312597f', class: "option" }, h("verdocs-radio-button", { key: '9eef88a57e5e2653a0a6e06c8d7d30d6a56ff9ec', name: "template-sender", value: 'organization_member_as_creator', checked: this.sender === 'organization_member_as_creator', onInput: () => this.handleSelectSetting('organization_member_as_creator') }), h("div", { key: '725275a9b3a1d702328aed52f831eaf28827d399', class: "description" }, h("div", { key: '85ee3e891b241048cf2bcc05812fc221faf21b28', class: "name" }, "Anyone in my organization as me"), h("verdocs-help-icon", { key: '960eb5345948e8a4adef466138d0cc62b49b9406', text: "Anyone in my organization can use this template on my behalf. (Make sure its visibility is set to to 'Shared'.)" }))), h("div", { key: 'd7b71dbd2019e20d2a734c737a21f9097b9dcf60', class: "option" }, h("verdocs-radio-button", { key: 'f99c206e998ed717754b2ee7d51ba614f7774d4d', name: "template-sender", value: 'creator', checked: this.sender === 'creator', onInput: () => this.handleSelectSetting('creator') }), h("div", { key: 'aca94259df3bf9904cbc51a3996699df3aeba58c', class: "description" }, h("div", { key: '123b4a4d607575fb116912f74318a74e593c9da8', class: "name" }, "Me"), h("verdocs-help-icon", { key: 'ef96de2bf38213c4ade608b8ef26576a86fbb8b9', text: "Only I can use this template." })))), h("div", { key: '44945452b32f23b58c4941ecd8b91284f5c85040', class: "buttons" }, h("verdocs-button", { key: 'e128593df73e4b1733ec15ebb70dcb6726319496', label: "Close", onClick: () => this.handleClose() }))))));
     }
     static get style() { return VerdocsTemplateSenderStyle0; }
 }, [0, "verdocs-template-sender", {

package/dist/components/verdocs-template-star2.js

@@ -43,7 +43,7 @@ const VerdocsTemplateStar = /*@__PURE__*/ proxyCustomElement(class VerdocsTempla
         });
     }
     render() {
-        return (h(Host, { key: '0fc342a217265e0a104fd3f611e99b57d4978be4' }, h("div", { key: 'ac7375a1a86846ec27d550356781426d19a4aec5', class: `star ${this.updating ? 'updating' : ''}`, innerHTML: this.template.star_counter ? SolidStarIcon : OutlineStarIcon, onClick: e => this.toggle(e) }), h("div", { key: '68c5329f639c404fb377accedce7a36b28d77d76', class: "count" }, this.template.star_counter || '--')));
+        return (h(Host, { key: '40bad1fc57171bcdffe69ff8f1c876813ff6cc78' }, h("div", { key: '656891e6efc6645d9d3638a9be48728529a078ad', class: `star ${this.updating ? 'updating' : ''}`, innerHTML: this.template.star_counter ? SolidStarIcon : OutlineStarIcon, onClick: e => this.toggle(e) }), h("div", { key: '486526042ff5d20a37e7b8207c959d6ee2eede0a', class: "count" }, this.template.star_counter || '--')));
     }
     static get style() { return VerdocsTemplateStarStyle0; }
 }, [0, "verdocs-template-star", {

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

@@ -11,7 +11,7 @@ const VerdocsTemplateTags$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsTemp
     }
     render() {
         var _a;
-        return (h(Host, { key: '8668a671bd4a1898582579efc2e330921f2b6b2d' }, (_a = this.tags) === null || _a === void 0 ? void 0 : _a.map(tag => (h("span", null, tag)))));
+        return (h(Host, { key: 'b1adfd5844f2d5302e2fda6355d868a845005345' }, (_a = this.tags) === null || _a === void 0 ? void 0 : _a.map(tag => (h("span", null, tag)))));
     }
     static get style() { return VerdocsTemplateTagsStyle0; }
 }, [0, "verdocs-template-tags", {

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

@@ -1,11 +1,12 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { VerdocsEndpoint, getTemplates, deleteTemplate, canPerformTemplateAction, integerSequence } from '@verdocs/js-sdk';
 import { S as SDKError } from './errors.js';
-import { d as defineCustomElement$a } from './verdocs-button2.js';
-import { d as defineCustomElement$9 } from './verdocs-dropdown2.js';
-import { d as defineCustomElement$8 } from './verdocs-help-icon2.js';
-import { d as defineCustomElement$7 } from './verdocs-ok-dialog2.js';
-import { d as defineCustomElement$6 } from './verdocs-pagination2.js';
+import { d as defineCustomElement$b } from './verdocs-button2.js';
+import { d as defineCustomElement$a } from './verdocs-dropdown2.js';
+import { d as defineCustomElement$9 } from './verdocs-help-icon2.js';
+import { d as defineCustomElement$8 } from './verdocs-ok-dialog2.js';
+import { d as defineCustomElement$7 } from './verdocs-pagination2.js';
+import { d as defineCustomElement$6 } from './verdocs-portal2.js';
 import { d as defineCustomElement$5 } from './verdocs-quick-filter2.js';
 import { d as defineCustomElement$4 } from './verdocs-spinner2.js';
 import { d as defineCustomElement$3 } from './verdocs-template-star2.js';
@@ -165,24 +166,24 @@ const VerdocsTemplatesList$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsTem
         // 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: '9910d30f954550fe89b6e0b5851ff5cfbdec5aff' }, h("div", { key: '6b77158a586a26163c38ab6d4af3836eef486de4', class: "header" }, h("div", { key: '9caad42bc2e305f401cb065a2045fc971197940f', class: "filter" }, h("verdocs-text-input", { key: 'dc9f1d30422255f5fd6da7a3a3d31b9f2ad4b36b', 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) => {
+        return (h(Host, { key: '7dc672029a1ec88a20c7ea019bdd80bd98b4e54d' }, h("div", { key: 'feb106c393aa87d7e4207679a3823fb5ceb0f8d0', class: "header" }, h("div", { key: 'c53a7346d4c485fda35c4ebe960e1e76c8a58d81', class: "filter" }, h("verdocs-text-input", { key: 'ba16ba49cce33494d5379751378061a2ed838762', 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: '194519821282ccf01b029c442ebc30f7102eaf2e', label: "Sharing", value: this.sharing, options: SharingFilters, onOptionSelected: e => {
+            } })), h("verdocs-quick-filter", { key: '2854a34cb955ed1e330234eac3303c1dbf90dff0', 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: '5d814eedb83e97ce973a9205a29d7815b3fbf0fd', label: "Starred", value: this.starred, options: StarredFilters, onOptionSelected: e => {
+            } }), h("verdocs-quick-filter", { key: 'db872856578e8961bfce82e6ee3a8161100fff51', 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: '7bb139d40d9ec00dd2011248a5737f999e8765dd', label: "Sort By", value: this.sort, options: SortOptions, onOptionSelected: e => {
+            } }), h("verdocs-quick-filter", { key: '7ff37f6760a422c30426247434f75f61c1403773', 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: 'eaa9aa626d7e9193400c45d065fad04133963f59', mode: "dark", size: 24 }), h("div", { key: '7387c1960def6cebdb2758a5f4cdcb9475b60d1e', style: { display: 'flex', flex: '1' } })), locallyFilteredTemplates.map(template => {
+            } }), this.loading && h("verdocs-spinner", { key: '5f957818a90efacab9f67e0a672bde9da0cc5fba', mode: "dark", size: 24 }), h("div", { key: '8c2cf92c197f2c76e9a2586eda4377042d851537', 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 = [];
@@ -229,9 +230,9 @@ const VerdocsTemplatesList$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsTem
                     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 ? dateFns.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: 'aa47ab45c993fce4229534b04ffc51b0ea7d9e0e' }, integerSequence(0, this.rowsPerPage).map(() => (h("div", { class: "template-placeholder" }))))), this.initiallyLoaded && !this.templates.length && h("div", { key: 'e5e953daa661123cf5658e5de97e7af35fb414fc', 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.initiallyLoaded && (h("div", { key: '47313a9255707d50181d0211425c60085fa5583a' }, integerSequence(0, this.rowsPerPage).map(() => (h("div", { class: "template-placeholder" }))))), this.initiallyLoaded && !this.templates.length && h("div", { key: '9bb8a3dd1a35a0c742284b8bb9c8bd4f03b19680', 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: 'b5787c3b6c29784c0d1de6d98fdd190581ec9557', heading: "Delete this Template?", message: "This operation cannot be undone.", onNext: () => this.deleteTemplate(this.confirmDelete), onExit: () => (this.confirmDelete = null), showCancel: true }))));
+            } }))) : (h("div", null)), this.confirmDelete && (h("verdocs-ok-dialog", { key: 'dc67ae619c47deca58789f3495813b78d6c90070', 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"],
@@ -268,7 +269,7 @@ function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["verdocs-templates-list", "verdocs-button", "verdocs-dropdown", "verdocs-help-icon", "verdocs-ok-dialog", "verdocs-pagination", "verdocs-quick-filter", "verdocs-spinner", "verdocs-template-star", "verdocs-text-input"];
+    const components = ["verdocs-templates-list", "verdocs-button", "verdocs-dropdown", "verdocs-help-icon", "verdocs-ok-dialog", "verdocs-pagination", "verdocs-portal", "verdocs-quick-filter", "verdocs-spinner", "verdocs-template-star", "verdocs-text-input"];
     components.forEach(tagName => { switch (tagName) {
         case "verdocs-templates-list":
             if (!customElements.get(tagName)) {
@@ -277,25 +278,30 @@ function defineCustomElement$1() {
             break;
         case "verdocs-button":
             if (!customElements.get(tagName)) {
-                defineCustomElement$a();
+                defineCustomElement$b();
             }
             break;
         case "verdocs-dropdown":
             if (!customElements.get(tagName)) {
-                defineCustomElement$9();
+                defineCustomElement$a();
             }
             break;
         case "verdocs-help-icon":
             if (!customElements.get(tagName)) {
-                defineCustomElement$8();
+                defineCustomElement$9();
             }
             break;
         case "verdocs-ok-dialog":
             if (!customElements.get(tagName)) {
-                defineCustomElement$7();
+                defineCustomElement$8();
             }
             break;
         case "verdocs-pagination":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$7();
+            }
+            break;
+        case "verdocs-portal":
             if (!customElements.get(tagName)) {
                 defineCustomElement$6();
             }

package/dist/components/verdocs-text-input2.js

@@ -34,7 +34,7 @@ const VerdocsTextInput = /*@__PURE__*/ proxyCustomElement(class VerdocsTextInput
             .catch(e => console.log('Error copying to clipboard', e));
     }
     render() {
-        return (h(Host, { key: 'a6f4cbf0e0b53caa2f471b943cf61327d47f10fe', class: `input-field ${this.clearable ? 'clearable' : ''} ${this.copyable ? 'copyable' : ''}` }, h("label", { key: 'f0005d82081079e1fbb0c4e0dac810a5051e1271' }, this.label && (h("div", { key: '862931caecb6d33c6a216a582935806a964ad2e8', class: "input-label" }, this.label + ':', this.required && h("span", { key: '58347a8111e1f88d6e38ee5fbf55036aeec28935', class: "required" }, "*"))), h("div", { key: '298a97a55d866e1ab14608d5d33a918b98f45092', class: "input-container" }, h("input", { key: 'b813c15cd2822af0b994f5414c60d704ab07b2ac', type: this.type === 'password' && this.showingPw ? 'text' : this.type, value: this.value, required: this.required, class: "input-element", "data-lpignore": "true", disabled: this.disabled, placeholder: this.placeholder, autoComplete: this.autocomplete, onBlur: (e) => { var _a; return (_a = this.blur) === null || _a === void 0 ? void 0 : _a.emit(e.target.value); }, ref: el => (this.inputEl = el), onInput: (e) => (this.value = e.target.value) }), this.clearable && this.value && (h("span", { key: '0dd0323f08f8a7c173c78f6eac16450295f6ecd5', innerHTML: ClearIcon, class: "clear", onClick: () => {
+        return (h(Host, { key: '3a276504339a2e0da65c20120c41c4afef0dfa05', class: `input-field ${this.clearable ? 'clearable' : ''} ${this.copyable ? 'copyable' : ''}` }, h("label", { key: '43db529393440cbcb59ff727946c554e52282d23' }, this.label && (h("div", { key: '55b4195abcf9d6c8b4323e80ee11fc3f3cb4c7b6', class: "input-label" }, this.label + ':', this.required && h("span", { key: '9a128487bcc23e3e9a86655bfc0509dcc694df3e', class: "required" }, "*"))), h("div", { key: '34debc3ed54dce6005fd78b026bef12f0f8ccce4', class: "input-container" }, h("input", { key: '60efa6b837e370f2d07f8c52f3c34a9531dd24b4', type: this.type === 'password' && this.showingPw ? 'text' : this.type, value: this.value, required: this.required, class: "input-element", "data-lpignore": "true", disabled: this.disabled, placeholder: this.placeholder, autoComplete: this.autocomplete, onBlur: (e) => { var _a; return (_a = this.blur) === null || _a === void 0 ? void 0 : _a.emit(e.target.value); }, ref: el => (this.inputEl = el), onInput: (e) => (this.value = e.target.value) }), this.clearable && this.value && (h("span", { key: 'ddfcade72223da28804f705e4a15cfc7f0f05ad0', innerHTML: ClearIcon, class: "clear", onClick: () => {
                 // We need to allow the onInput event to fire first in case
                 // the user was focused on this field before clicking clear.
                 setTimeout(() => {
@@ -48,9 +48,9 @@ const VerdocsTextInput = /*@__PURE__*/ proxyCustomElement(class VerdocsTextInput
                         (_b = this.inputEl) === null || _b === void 0 ? void 0 : _b.blur();
                     }, 50);
                 }, 50);
-            } })), this.type === 'password' && (h("span", { key: '91e1427c7b7179ebc843d820e146d23b07ae7ba3', innerHTML: this.showingPw ? EyeIcon : EyeSlashIcon, class: "toggle-pw", onClick: () => {
+            } })), this.type === 'password' && (h("span", { key: 'd4d3a346790fcdf20ee1d57217c6e6c33e8d6c9e', innerHTML: this.showingPw ? EyeIcon : EyeSlashIcon, class: "toggle-pw", onClick: () => {
                 this.showingPw = !this.showingPw;
-            } })), !this.clearable && this.copyable && this.value && h("span", { key: 'b785191a6f5681c8831fb3c75fa86d3d977aee30', innerHTML: CopyIcon, class: "copy", onClick: () => this.copyToClipboard() })), this.helpText && h("verdocs-help-icon", { key: '3676128c06aaa7f7bd5cf4bd800a88604317041a', text: this.helpText }))));
+            } })), !this.clearable && this.copyable && this.value && h("span", { key: '18139b4b20fd49f9c195ff2767e9c52cd31c09de', innerHTML: CopyIcon, class: "copy", onClick: () => this.copyToClipboard() })), this.helpText && h("verdocs-help-icon", { key: '1308f2fb287747e3bd627060f31b3a45812be070', text: this.helpText }))));
     }
     get hostEl() { return this; }
     static get style() { return VerdocsTextInputStyle0; }

package/dist/components/verdocs-toggle-button2.js

@@ -25,7 +25,7 @@ const VerdocsToggleButton = /*@__PURE__*/ proxyCustomElement(class VerdocsToggle
         (_a = this.toggle) === null || _a === void 0 ? void 0 : _a.emit({ active: newState });
     }
     render() {
-        return (h(Host, { key: '32eb5cccbb9687200cf1b57266ceb09143d4a478', class: `size-${this.size}` }, this.icon ? (h("button", { innerHTML: this.icon, class: { active: this._active }, onClick: e => this.handleToggle(e) })) : (h("button", { class: { active: this._active }, onClick: e => this.handleToggle(e) }, this.label))));
+        return (h(Host, { key: '4633ea6f8281ab53c77cc1544e0c252ecbcb3e8e', class: `size-${this.size}` }, this.icon ? (h("button", { innerHTML: this.icon, class: { active: this._active }, onClick: e => this.handleToggle(e) })) : (h("button", { class: { active: this._active }, onClick: e => this.handleToggle(e) }, this.label))));
     }
     static get style() { return VerdocsToggleButtonStyle0; }
 }, [0, "verdocs-toggle-button", {

package/dist/components/verdocs-toggle.js

@@ -16,7 +16,7 @@ const VerdocsToggle$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsToggle ext
         this.selectedOption = ((_a = this.options) === null || _a === void 0 ? void 0 : _a.defaultSelection) || 0;
     }
     render() {
-        return (h("div", { key: '3fce957152f13b188837bcf6cf40603d9618689e', class: "container" }, h("span", { key: '9d4c488975c9daa125ecf906f641e2bc74654a96', class: "label" }, `${this.options.label}:`), h("div", { key: '28a2d8a82b05fcb3cfc9bea409ad37633fb0d860', class: "buttons" }, this.options.buttons.map((button, index) => (h("button", { id: button.id, key: button.id, innerHTML: button.icon, class: index === this.selectedOption ? 'selected' : '', onClick: () => {
+        return (h("div", { key: 'ce82d507e5ec506aa85dca4c21b3ee78c751a7ea', class: "container" }, h("span", { key: 'b099fdab13ec8c866be39c1f0d8f81e5fe8360ef', class: "label" }, `${this.options.label}:`), h("div", { key: 'bbd49091a1c7c4cd0c1088bf0efb76a4476895f5', class: "buttons" }, this.options.buttons.map((button, index) => (h("button", { id: button.id, key: button.id, innerHTML: button.icon, class: index === this.selectedOption ? 'selected' : '', onClick: () => {
                 console.log('clicked', index);
                 this.selectedOption = index;
             } }))))));

package/dist/components/verdocs-toolbar-icon2.js

@@ -41,7 +41,7 @@ const VerdocsToolbarIcon = /*@__PURE__*/ proxyCustomElement(class VerdocsToolbar
     //   this.press?.emit();
     // }
     render() {
-        return (h(Host, { key: '4674a6debb2b1097facb31672444e0f1eb397d41', class: {} }, h("div", { key: '81948d50d0b55ba9e85862e37c1e16402d8851da', "aria-describedby": this.containerId, class: "icon", innerHTML: this.icon, onMouseEnter: () => this.show(), onFocus: () => this.show(), onMouseLeave: () => this.hide(), onBlur: () => this.hide(), ref: el => (this.iconEl = el) }), h("div", { key: '716d04df7702b2068ec15b55f744646ea26aeac7', id: this.containerId, role: "tooltip", class: "tooltip", "data-popper-placement": this.placement, ref: el => (this.tooltip = el) }, this.text, h("div", { key: '8511e8a6cbe059d525a4ee770a479c932dab9625', "data-popper-arrow": "true", class: "arrow" }))));
+        return (h(Host, { key: 'de2235124c7fbeb0a24950b67617a2acb55cdd69', class: {} }, h("div", { key: '35fe164dc6dd850c31d7fa50e91312b14a213da1', "aria-describedby": this.containerId, class: "icon", innerHTML: this.icon, onMouseEnter: () => this.show(), onFocus: () => this.show(), onMouseLeave: () => this.hide(), onBlur: () => this.hide(), ref: el => (this.iconEl = el) }), h("div", { key: '1b4e2acd66ce940c36736bb5cff35a89f6d3142b', id: this.containerId, role: "tooltip", class: "tooltip", "data-popper-placement": this.placement, ref: el => (this.tooltip = el) }, this.text, h("div", { key: 'df3ad06add46d573dbcdbbf9f675d1b0949d1892', "data-popper-arrow": "true", class: "arrow" }))));
     }
     static get style() { return VerdocsToolbarIconStyle0; }
 }, [0, "verdocs-toolbar-icon", {