@verdocs/web-sdk 4.2.43 → 4.2.48

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

@@ -26,7 +26,7 @@ const VerdocsOrganizationCard$1 = /*@__PURE__*/ proxyCustomElement(class Verdocs
         console.log('Rendering org card', this.organization.thumbnail_url, this.organization);
         const fallbackIcon = BusinessIcon;
         const portalId = `verdocs-org-card-${this.organization.id}`;
-        return (h(Host, { key: '984cc4f5ae5a5bd8be25812d23e2137b86b8cb53', id: portalId }, this.organization.thumbnail_url ? h("img", { class: "icon", src: this.organization.thumbnail_url, alt: "Logo" }) : h("span", { class: "icon", innerHTML: fallbackIcon }), h("span", { key: 'ef2b5647ef244a490b453ab4cfea637c817b6250', class: "content" }, (_a = this.organization) === null || _a === void 0 ? void 0 : _a.name), h("verdocs-portal", { key: 'be131ea49f16eda6400b7fae51c137b6c765ba1f', anchor: portalId }, h("div", { key: 'cf1f7f9c1bb9a9f2725ee610c5ad7d338e102948', class: "verdocs-org-card-popup", style: { display: this.hovered ? 'block' : 'none' } }, this.organization.full_logo_url ? (h("div", { class: "popup-header-with-logo" }, h("img", { src: this.organization.full_logo_url, alt: "Logo" }), h("div", { class: "title" }, (_b = this.organization) === null || _b === void 0 ? void 0 : _b.name))) : (h("div", { class: "popup-header" }, h("span", { class: "status" }, h("span", { class: "icon", innerHTML: fallbackIcon })), h("span", { class: "title" }, (_c = this.organization) === null || _c === void 0 ? void 0 : _c.name))), h("div", { key: '1757748b560ed3ce222ff2ebff898c70898cc0e2', class: "popup-body" }, h("div", { key: '49fb111697b12303c2aa261dba15f68a316cc6e3', class: "field" }, h("strong", { key: 'e75239eec42a1bd06332f41ad4273c9f5cc33879' }, "Joined"), dateFns.format(new Date(((_d = this.organization) === null || _d === void 0 ? void 0 : _d.created_at) || undefined), 'LLL d, Y')), this.organization.url && (h("div", { key: '6f2445fe7b9b283e9d13b77e5c45da8dfaeff54b', class: "field" }, h("strong", { key: '2742ec20318bbb3f2ba0d71aea75d3778aa82d6f' }, "Website"), h("a", { key: 'dac897696dabd8c46c26294846b08f64026150fc', href: (_e = this.organization) === null || _e === void 0 ? void 0 : _e.url, target: "_blank", rel: "nofollow" }, (_f = this.organization) === null || _f === void 0 ? void 0 : _f.url))))))));
+        return (h(Host, { key: '2d1a8c0b8be06ec11e8d3f54b94e9c5f45ecbdf2', id: portalId }, this.organization.thumbnail_url ? h("img", { class: "icon", src: this.organization.thumbnail_url, alt: "Logo" }) : h("span", { class: "icon", innerHTML: fallbackIcon }), h("span", { key: '7a5984b3e888d5f5f31d557276aa88ddd0578d9d', class: "content" }, (_a = this.organization) === null || _a === void 0 ? void 0 : _a.name), h("verdocs-portal", { key: '4edbb7c0add1ef329c3892bfe0457b74137c5249', anchor: portalId }, h("div", { key: 'ea1356877ef8e4be7ecd405c882131d6a85373a4', class: "verdocs-org-card-popup", style: { display: this.hovered ? 'block' : 'none' } }, this.organization.full_logo_url ? (h("div", { class: "popup-header-with-logo" }, h("img", { src: this.organization.full_logo_url, alt: "Logo" }), h("div", { class: "title" }, (_b = this.organization) === null || _b === void 0 ? void 0 : _b.name))) : (h("div", { class: "popup-header" }, h("span", { class: "status" }, h("span", { class: "icon", innerHTML: fallbackIcon })), h("span", { class: "title" }, (_c = this.organization) === null || _c === void 0 ? void 0 : _c.name))), h("div", { key: '9b5d314f138922acb826652f41b384c2b29f0df1', class: "popup-body" }, h("div", { key: '625520444f54f9433e882a14a58932eb4a78676f', class: "field" }, h("strong", { key: '5a5d0fa10a4d843997e0555d57b165aeec7495aa' }, "Joined"), dateFns.format(new Date(((_d = this.organization) === null || _d === void 0 ? void 0 : _d.created_at) || undefined), 'LLL d, Y')), this.organization.url && (h("div", { key: '3f5e5d5e5fd863743fc3ac20ef855ccbea8be63d', class: "field" }, h("strong", { key: 'ab2e95fd59304dda6ac5190ea9421c6429e46814' }, "Website"), h("a", { key: 'd06cff21c159e9c1b7d051e762f2687ae2a94b7b', href: (_e = this.organization) === null || _e === void 0 ? void 0 : _e.url, target: "_blank", rel: "nofollow" }, (_f = this.organization) === null || _f === void 0 ? void 0 : _f.url))))))));
     }
     static get style() { return VerdocsOrganizationCardStyle0; }
 }, [0, "verdocs-organization-card", {

package/dist/components/verdocs-pagination2.js

@@ -38,7 +38,7 @@ const VerdocsQuickFilter = /*@__PURE__*/ proxyCustomElement(class VerdocsQuickFi
         const firstPage = Math.max(0, this.selectedPage - 2);
         const numPages = this.itemCount > 0 ? Math.ceil(this.itemCount / this.perPage) : 0;
         const pagesToDisplay = integerSequence(0, Math.ceil(this.itemCount / this.perPage)).slice(firstPage, firstPage + VISIBLE_PAGES);
-        return (h(Host, { key: 'da7fa58179d4dfab9131ab65bfd801e3e8e4c4c8' }, this.selectedPage > 0 && h(PageButton, { key: 'ce00b9a669d7db36a2b788ff9d3a438eaae4d9e0', page: 'first', selected: this.selectedPage, onClick: () => this.handleSelectPage(0) }), firstPage > 0 && h("div", { key: 'b72cbbc77a95104828e7a2d5439b1f73a8370316', class: "ellipsis" }, "..."), pagesToDisplay.map(pageNumber => (h(PageButton, { page: pageNumber, selected: this.selectedPage, onClick: page => this.handleSelectPage(+page) }))), this.selectedPage < numPages - 1 && h("div", { key: 'a6fdc04b9a307c8240edf80b14a96c6b892055b1', class: "ellipsis" }, "..."), this.selectedPage < numPages - 1 && h(PageButton, { key: '843dcb794dfbb81a0909bea199591f64a6b0ff91', page: 'last', selected: this.selectedPage, onClick: () => this.handleSelectPage(numPages - 1) })));
+        return (h(Host, { key: '7f48438c1719d818a477d05970c83b71d1bfb46b' }, this.selectedPage > 0 && h(PageButton, { key: '04d4a5306146aa3e1e15a429f91030a423d74620', page: 'first', selected: this.selectedPage, onClick: () => this.handleSelectPage(0) }), firstPage > 0 && h("div", { key: '4cd4b28c503989aa2ae9af13c1cec3a5819cd19c', class: "ellipsis" }, "..."), pagesToDisplay.map(pageNumber => (h(PageButton, { page: pageNumber, selected: this.selectedPage, onClick: page => this.handleSelectPage(+page) }))), this.selectedPage < numPages - 1 && h("div", { key: '7aeadf3f795bb8d22911de8a897687a7d75b43d3', class: "ellipsis" }, "..."), this.selectedPage < numPages - 1 && h(PageButton, { key: '5c886e32ea166539d84c24f33446337afc462ee6', page: 'last', selected: this.selectedPage, onClick: () => this.handleSelectPage(numPages - 1) })));
     }
     get el() { return this; }
     static get style() { return VerdocsPaginationStyle0; }

package/dist/components/verdocs-portal2.js

@@ -68,7 +68,7 @@ const VerdocsPortal = /*@__PURE__*/ proxyCustomElement(class VerdocsPortal exten
         this.moved ? this.portal.remove() : (this.moved = true);
     }
     render() {
-        return (h(Host, { key: 'd92c3751ccd809986670dd9a7f47a5e6bbcec022', ref: el => (this.element = el) }, h("slot", { key: '50c70872a6bd88ea41d987b14c80731e0bb23e76' })));
+        return (h(Host, { key: '6ca1f82e243b2f1892595a9e0f7127a9c5c0e018', ref: el => (this.element = el) }, h("slot", { key: 'e16bdeda7ac210db095242e94e0128f4bab8010f' })));
     }
     static get style() { return VerdocsPortalStyle0; }
 }, [4, "verdocs-portal", {

package/dist/components/verdocs-preview2.js

@@ -3,7 +3,6 @@ import { VerdocsEndpoint, integerSequence } from '@verdocs/js-sdk';
 import { g as getTemplateFieldStore } from './TemplateFieldStore.js';
 import { g as getTemplateRoleStore } from './TemplateRoleStore.js';
 import { g as getTemplateStore } from './TemplateStore.js';
-import { r as renderDocumentField } from './utils.js';
 import { S as SDKError } from './errors.js';
 import { d as defineCustomElement$n } from './verdocs-button2.js';
 import { d as defineCustomElement$m } from './verdocs-checkbox2.js';
@@ -13,7 +12,7 @@ import { d as defineCustomElement$j } from './verdocs-field-checkbox2.js';
 import { d as defineCustomElement$i } from './verdocs-field-date2.js';
 import { d as defineCustomElement$h } from './verdocs-field-dropdown2.js';
 import { d as defineCustomElement$g } from './verdocs-field-initial2.js';
-import { d as defineCustomElement$f } from './verdocs-field-radio-button2.js';
+import { d as defineCustomElement$f } from './verdocs-field-radio2.js';
 import { d as defineCustomElement$e } from './verdocs-field-signature2.js';
 import { d as defineCustomElement$d } from './verdocs-field-textarea2.js';
 import { d as defineCustomElement$c } from './verdocs-field-textbox2.js';
@@ -83,12 +82,11 @@ const VerdocsPreview = /*@__PURE__*/ proxyCustomElement(class VerdocsPreview ext
             });
         }
     }
-    handlePageRendered(e) {
-        var _a, _b;
-        const pageInfo = e.detail;
-        const fields = (_b = (_a = this.templateStore) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.fields.filter(field => field.page === pageInfo.pageNumber);
+    handlePageRendered(_e) {
+        // const pageInfo = e.detail as IDocumentPageInfo;
+        // const fields = this.templateStore?.state?.fields.filter(field => field.page === pageInfo.pageNumber);
         // console.log('[PREVIEW] Page rendered', pageInfo, fields);
-        fields.forEach(field => renderDocumentField(field, pageInfo, { disabled: true, editable: false, draggable: false }));
+        // fields.forEach(field => renderDocumentField(field, pageInfo, {disabled: true, editable: false, draggable: false}));
     }
     render() {
         var _a, _b;
@@ -118,7 +116,7 @@ function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["verdocs-preview", "verdocs-button", "verdocs-checkbox", "verdocs-component-error", "verdocs-field-attachment", "verdocs-field-checkbox", "verdocs-field-date", "verdocs-field-dropdown", "verdocs-field-initial", "verdocs-field-radio-button", "verdocs-field-signature", "verdocs-field-textarea", "verdocs-field-textbox", "verdocs-field-timestamp", "verdocs-help-icon", "verdocs-initial-dialog", "verdocs-loader", "verdocs-portal", "verdocs-select-input", "verdocs-signature-dialog", "verdocs-template-document-page", "verdocs-template-field-properties", "verdocs-text-input", "verdocs-upload-dialog"];
+    const components = ["verdocs-preview", "verdocs-button", "verdocs-checkbox", "verdocs-component-error", "verdocs-field-attachment", "verdocs-field-checkbox", "verdocs-field-date", "verdocs-field-dropdown", "verdocs-field-initial", "verdocs-field-radio", "verdocs-field-signature", "verdocs-field-textarea", "verdocs-field-textbox", "verdocs-field-timestamp", "verdocs-help-icon", "verdocs-initial-dialog", "verdocs-loader", "verdocs-portal", "verdocs-select-input", "verdocs-signature-dialog", "verdocs-template-document-page", "verdocs-template-field-properties", "verdocs-text-input", "verdocs-upload-dialog"];
     components.forEach(tagName => { switch (tagName) {
         case "verdocs-preview":
             if (!customElements.get(tagName)) {
@@ -165,7 +163,7 @@ function defineCustomElement() {
                 defineCustomElement$g();
             }
             break;
-        case "verdocs-field-radio-button":
+        case "verdocs-field-radio":
             if (!customElements.get(tagName)) {
                 defineCustomElement$f();
             }

package/dist/components/verdocs-progress-bar2.js

@@ -14,7 +14,7 @@ const VerdocsProgressBar = /*@__PURE__*/ proxyCustomElement(class VerdocsProgres
     render() {
         const widthPercent = Math.ceil((100 * Math.min(this.percent, 100)) / 100);
         console.log('Rendering progress bar', { widthPercent, label: this.label, showPercent: this.showPercent, percent: this.percent });
-        return (h(Host, { key: '8b1b66e6fea674c6dbd31ae8de842ad07a411118' }, h("div", { key: '384af4301fbe9f8668688551f60da9ea5175f5a9', class: "labels" }, this.label && h("div", { key: 'af1578e6c2e5c9993613b43a24416bfd62f7da3d', class: "label" }, this.label), this.showPercent && h("div", { key: '174b1e878eec204af82dba5f60bab3699e3ba435', class: "label" }, this.percent, "%")), h("div", { key: 'c9c0a875d37ec0de10184143e4239ede8d7d208c', class: "bar" }, h("div", { key: '9e2f3c25d5cb38b5eedf77010b05a393c74fd07e', class: "slider", style: { width: `${widthPercent}%` } }))));
+        return (h(Host, { key: '26db36f7031e869a43d70fd159c7acd9872ae379' }, h("div", { key: '2fdb0235a24303c15edc3adb620c0c7ebc8d1291', class: "labels" }, this.label && h("div", { key: '6e9ae22da5da7bfa5daf25d310c3ec0f64d994ff', class: "label" }, this.label), this.showPercent && h("div", { key: 'f7d2a00f352199cd78d51e6003897bb000fbfeb5', class: "label" }, this.percent, "%")), h("div", { key: 'de9ef450a7dfc69b88c47491e07463804fa419b4', class: "bar" }, h("div", { key: '7adc0673eba1bbd7dd4f2227c5f508e3a8b87e4d', class: "slider", style: { width: `${widthPercent}%` } }))));
     }
     static get style() { return VerdocsProgressBarStyle0; }
 }, [0, "verdocs-progress-bar", {

package/dist/components/verdocs-quick-filter2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { d as renderedTextWidth } from './utils.js';
+import { b as renderedTextWidth } from './utils.js';
 import { c as createPopper } from './popper.js';
 
 const verdocsQuickFilterCss = "@-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-quick-filter{position:relative;font-family:\"Inter\", \"Barlow\", sans-serif}verdocs-quick-filter .control{outline:0;height:34px;display:-ms-flexbox;display:flex;cursor:pointer;border-radius:4px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;-webkit-box-sizing:border-box;box-sizing:border-box;background:#ffffff;-webkit-transition:all 100ms ease 0s;transition:all 100ms ease 0s;border:1px solid #cccccc}verdocs-quick-filter .title{padding:0 8px;font-size:14px;max-width:100%;overflow:hidden;color:#33364b;white-space:nowrap;-webkit-box-sizing:border-box;box-sizing:border-box;text-overflow:ellipsis}verdocs-quick-filter .title .prefix{display:inline;font-weight:700;margin:0 7px 0 0;color:#4c56cb}verdocs-quick-filter .arrow{width:32px;height:32px;border:none;outline:none;cursor:pointer;-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;background:#ffffff;-webkit-transition:color 150ms ease 0s;transition:color 150ms ease 0s}verdocs-quick-filter .arrow svg{-webkit-transition:0.3s;transition:0.3s;fill:#cccccc}verdocs-quick-filter .separator{width:1px;display:block;margin-top:8px;margin-bottom:8px;-ms-flex-item-align:stretch;align-self:stretch;-webkit-box-sizing:border-box;box-sizing:border-box;background-color:#cccccc}verdocs-quick-filter .items{display:none;z-index:10000;position:absolute;border-radius:4px;background:#ffffff;-webkit-box-shadow:rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(0, 0, 0, 0.1) 0 4px 11px;box-shadow:rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(0, 0, 0, 0.1) 0 4px 11px}verdocs-quick-filter .items[data-show]{display:block}verdocs-quick-filter .option{width:100%;border:none;display:block;font-size:14px;text-align:left;background:none;padding:10px 20px;color:#1e2031}verdocs-quick-filter .option:hover{cursor:pointer;background:rgba(76, 86, 203, 0.2470588235)}verdocs-quick-filter .option[disabled]{color:#aaaaaa}verdocs-quick-filter .option[disabled]:hover{cursor:inherit;background:transparent;color:#aaaaaa}verdocs-quick-filter.open .items{display:block}verdocs-quick-filter.open .arrow svg{-webkit-transform:scaleY(-1);transform:scaleY(-1)}";
@@ -85,7 +85,7 @@ const VerdocsQuickFilter = /*@__PURE__*/ proxyCustomElement(class VerdocsQuickFi
         const longestLabelWidth = renderedTextWidth((longestOption === null || longestOption === void 0 ? void 0 : longestOption.label) || 'FILLER', '14px Inter, Barlow, sans-serif');
         const prefixWidth = renderedTextWidth(this.label, '14px Inter, Barlow, sans-serif');
         const minWidth = `${longestLabelWidth + prefixWidth + 40}px`;
-        return (h(Host, { key: '8fbd487bc5f44471f7fc1ba41b3e9590294791a1', class: { open: !!this.open }, style: { minWidth, display: 'inline-block' } }, h("div", { key: '63cd83e83fdf8ef46d50b5950461ff2a0fde19ea', class: "control", onClick: e => this.toggleDropdown(e), onBlur: e => this.handleHideDropdown(e) }, h("div", { key: '2f660abf210127da67b76266bb5454f0267712cd', class: "title", ref: el => (this.dropdownButton = el) }, h("span", { key: '3cafd0d1edebc9449b3c9d2f0d60cb873ca4231c', class: "prefix" }, this.label, ":"), selectedOption ? selectedOption.label : this.placeholder), h("div", { key: 'ee4828fb55b904e1eaceb832db83706edd2b78da', style: { flex: '1' } }), h("div", { key: '79ec0e1054f8db50a7058e5169c503bd34ab8f45', class: "separator" }), h("div", { key: 'ce09c9523f6e1678b967edfba7e876e0d4fa4ec3', class: "arrow", innerHTML: DropdownArrow, "aria-label": "Open Menu" })), h("div", { key: '3bf62283431384863acc497fb18a9f74dd12a044', class: "items", "aria-hidden": !this.open, ref: el => (this.dropdownMenu = el), style: { minWidth } }, (_c = this.options) === null || _c === void 0 ? void 0 : _c.map(option => option.label ? (h("button", { onClick: e => this.handleSelectOption(e, option), class: `option ${option.value === this.value ? 'selected' : ''}`, disabled: option.disabled }, option.label)) : (h("div", { class: "separator" }))))));
+        return (h(Host, { key: 'b77a669e01ef8634d3fb5600146e95bcd58a5bf6', class: { open: !!this.open }, style: { minWidth, display: 'inline-block' } }, h("div", { key: 'e0eeab46c9f243ef7a189c7fdef267d8f3980625', class: "control", onClick: e => this.toggleDropdown(e), onBlur: e => this.handleHideDropdown(e) }, h("div", { key: '7494c30a6c5120d2617b239fb5114ddd6d338704', class: "title", ref: el => (this.dropdownButton = el) }, h("span", { key: '4861fef690eb5cd981a895337b81cd715cd8af1b', class: "prefix" }, this.label, ":"), selectedOption ? selectedOption.label : this.placeholder), h("div", { key: 'a4d2d8b76735232cde5ba1c659b83be452f919f3', style: { flex: '1' } }), h("div", { key: '9f8933c5343f8e188ec25447f9b19d3cb8b781ae', class: "separator" }), h("div", { key: 'e66a6fd2dd00cebb3f91e6e8269a68b1f21b5719', class: "arrow", innerHTML: DropdownArrow, "aria-label": "Open Menu" })), h("div", { key: '84ebf56cc3ddb543dd43e818c9571230353cc313', class: "items", "aria-hidden": !this.open, ref: el => (this.dropdownMenu = el), style: { minWidth } }, (_c = this.options) === null || _c === void 0 ? void 0 : _c.map(option => option.label ? (h("button", { onClick: e => this.handleSelectOption(e, option), class: `option ${option.value === this.value ? 'selected' : ''}`, disabled: option.disabled }, option.label)) : (h("div", { class: "separator" }))))));
     }
     get el() { return this; }
     static get style() { return VerdocsQuickFilterStyle0; }

package/dist/components/verdocs-quick-functions2.js

@@ -21,7 +21,7 @@ const VerdocsQuickFunctions = /*@__PURE__*/ proxyCustomElement(class VerdocsQuic
         this.createDocument.emit();
     }
     render() {
-        return (h("div", { key: '8732c14ba59bc441cdc1b164832ef66b5c7842bb', class: "container" }, h("p", { key: 'f6909de1cfed09c6514bd0d6530a380ad62aff85', class: "title" }, "Quick Create"), h("button", { key: 'e95f2fc551ad5342a4ceef8995c11b5b56a0e12a', onClick: () => this.handleCreateTemplate(), innerHTML: TemplateIcon }, "Template"), h("button", { key: '6707f329d007c1027d159c5b928a124fb41b6f73', onClick: () => this.handleCreateDocument(), innerHTML: DocumentIcon }, "Document")));
+        return (h("div", { key: '0977445aaeb18033ee53e208d9b3f60469ddb756', class: "container" }, h("p", { key: 'f3d8fe0ae4d9b09a7070ef4448326be32aeb7fd4', class: "title" }, "Quick Create"), h("button", { key: '7347890de8556714585fc579490503724ebfa01c', onClick: () => this.handleCreateTemplate(), innerHTML: TemplateIcon }, "Template"), h("button", { key: 'a056bb9b946edb68ce2f4364fe408c4a59d13b7f', onClick: () => this.handleCreateDocument(), innerHTML: DocumentIcon }, "Document")));
     }
     static get style() { return VerdocsQuickFunctionsStyle0; }
 }, [0, "verdocs-quick-functions", {

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

@@ -13,7 +13,7 @@ const VerdocsRadioButton = /*@__PURE__*/ proxyCustomElement(class VerdocsRadioBu
         this.disabled = false;
     }
     render() {
-        return (h(Host, { key: '635ebb3b00a1ba9596addcc8722c0897c67ccefc', class: { disabled: this.disabled } }, h("input", { key: 'c3ec421823ccb3e8f587b535ba8e23f7069f4a61', type: "radio", value: this.value, name: this.name, id: `verdocs-radio-button-${this.name}-${this.value}`, checked: this.checked, disabled: this.disabled }), h("label", { key: '80b453e62ed979c5f7ee73303d5dc43464b21289', htmlFor: `verdocs-radio-button-${this.name}-${this.value}` })));
+        return (h(Host, { key: '5801bf76825c1860f057081f9d109ce7303e259f', class: { disabled: this.disabled } }, h("input", { key: 'd802308dd23acad10d1cb3811d3b7cea4ea6cf78', type: "radio", value: this.value, name: this.name, id: `verdocs-radio-button-${this.name}-${this.value}`, checked: this.checked, disabled: this.disabled }), h("label", { key: '020374b5c732d1d7f6e4ccaaa04397869468f297', htmlFor: `verdocs-radio-button-${this.name}-${this.value}` })));
     }
     static get style() { return VerdocsRadioButtonStyle0; }
 }, [0, "verdocs-radio-button", {

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

@@ -44,7 +44,7 @@ const VerdocsSearchBox = /*@__PURE__*/ proxyCustomElement(class VerdocsSearchBox
         }
     }
     render() {
-        return (h("form", { key: '632837f92d720bf160fd20a04b82343e93d1d535', onSubmit: e => this.handleSearch(e) }, this.type !== undefined && this.type !== 'all' && (h("span", { key: '82639ecf1fa2cf2a79f0145ee29146f57cf1518d', class: "type" }, this.type, "s ", h("button", { key: 'c1bda4db74c55a9980b095168dfb620e16fcc309', class: "remove", innerHTML: CloseIcon, onClick: () => this.handleClearFilter() }))), h("input", { key: 'f68cf4dd09a3661c381c7eeb7490572eb852b60b', type: "text", value: this.query, placeholder: this.placeholder, onInput: e => this.handleChange(e), onKeyUp: e => this.handleKeyUp(e), ref: el => (this.inputEl = el) }), h("button", { key: '5357059a1e9f5ab91afde4fc956f7b1e3aa96bf0', onClick: e => this.handleSearch(e), class: "search" }, h("span", { key: '86c38d52006057822f770da628b317c1f791d71e', innerHTML: SearchIcon }), "Search")));
+        return (h("form", { key: 'f78c158c8170ca848870ed6d9ce67d6591fe06b7', onSubmit: e => this.handleSearch(e) }, this.type !== undefined && this.type !== 'all' && (h("span", { key: '61c0eb576b8467ab9c547e2899fbf39f5d5ea293', class: "type" }, this.type, "s ", h("button", { key: '9c6c8aaa5fac58a7d29f4b2f76de0f6f168d3552', class: "remove", innerHTML: CloseIcon, onClick: () => this.handleClearFilter() }))), h("input", { key: 'a08cc6991fb19ebf87a84c1392dc9646dbdcba64', type: "text", value: this.query, placeholder: this.placeholder, onInput: e => this.handleChange(e), onKeyUp: e => this.handleKeyUp(e), ref: el => (this.inputEl = el) }), h("button", { key: 'c3034c33f599f3b8b7e4363685a87a2f3b3d7c33', onClick: e => this.handleSearch(e), class: "search" }, h("span", { key: 'fc2bd86eff10b5f8e467919df9a2a11f48d546b1', innerHTML: SearchIcon }), "Search")));
     }
     static get style() { return VerdocsSearchBoxStyle0; }
 }, [0, "verdocs-search-box", {

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: '16e93641cee94ed98e3c8de50222fb41f5dbfb90' }, "\u00A0");
+        return h("div", { key: 'ee4e4ba5ced071f71a9f11751da60c4a863ca018' }, "\u00A0");
     }
     static get style() { return VerdocsSearchTabsStyle0; }
 }, [0, "verdocs-search-tabs", {

package/dist/components/verdocs-search.js

@@ -13,7 +13,7 @@ const VerdocsSearch$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSearch ext
         this.endpoint = VerdocsEndpoint.getDefault();
     }
     render() {
-        return (h("div", { key: '200d955b8750bfb853a491a39d2614f65c3dae2e', class: "container" }, h("verdocs-search-box", { key: '55db0748ab0102d71235903b1c668587e45ad527', endpoint: this.endpoint }), h("div", { key: '88ca9f594578f71b8abfb1fcbd1e31d455bcfb46', class: "boxes" }, h("verdocs-search-activity", { key: '7d95bd072f011865207fc0365e18d82b7875fd6a', type: "recent", endpoint: this.endpoint }), h("verdocs-search-activity", { key: 'f2f364ddb7347b7479aa5fd54d2519f7f96628ac', type: "saved", endpoint: this.endpoint }), h("verdocs-search-activity", { key: 'd504730b955a6c14cdf5d77eba96d3bb35eaf876', type: "starred", endpoint: this.endpoint }), h("verdocs-quick-functions", { key: 'dd543a416a6aab58e7566e320a20ea73f0313bce', endpoint: this.endpoint }))));
+        return (h("div", { key: 'cb527ea442ddf52bf239d1a568f31219fa8916aa', class: "container" }, h("verdocs-search-box", { key: '3d3bb9b8bdbef97064e3aaad2c4028641d63c41e', endpoint: this.endpoint }), h("div", { key: '4177cb8df774284ef82d3a01371117bbae17f369', class: "boxes" }, h("verdocs-search-activity", { key: '834f9311deeba7f39e310116348b272f7ba87bad', type: "recent", endpoint: this.endpoint }), h("verdocs-search-activity", { key: '46e7c3c7c6a1c7747f055b0d991ca9f1ebb8f755', type: "saved", endpoint: this.endpoint }), h("verdocs-search-activity", { key: '1d02fdc5770f40a49fd1085253bf44448a7c5b63', type: "starred", endpoint: this.endpoint }), h("verdocs-quick-functions", { key: 'b132866c02319036f40b54ce6ed43cdf5dd1c4f7', endpoint: this.endpoint }))));
     }
     static get style() { return VerdocsSearchStyle0; }
 }, [0, "verdocs-search", {

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: '49b233e1dcda5c8ffd51453654fa88bdec73bd82', class: "input-field" }, h("label", { key: '53ec0b8c1823a9e992c04e554bb33752ed676ad3' }, this.label ? h("div", { class: "input-label" }, this.label + ':') : h("div", null), h("select", { key: 'e7e0ef4dc4ab8aae9cc81d39010cfa335d37b291', 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: '4f49d2d10cf951c150b168563bcdb1d69e2385f2', class: "input-field" }, h("label", { key: 'a7329800f45797aac347e20231cc790e7ed4a91f' }, this.label ? h("div", { class: "input-label" }, this.label + ':') : h("div", null), h("select", { key: '1f66b8907f5ba4c9ecece9444ee4afc1be6a4459', 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-send2.js

@@ -51,7 +51,6 @@ const VerdocsSend = /*@__PURE__*/ proxyCustomElement(class VerdocsSend extends H
         try {
             this.endpoint.onSessionChanged((_endpoint, _session, profile) => {
                 if (profile) {
-                    console.log('setting sc', profile);
                     this.sessionContacts = [];
                     this.sessionContacts.push({
                         id: profile.id,
@@ -104,9 +103,9 @@ const VerdocsSend = /*@__PURE__*/ proxyCustomElement(class VerdocsSend extends H
             const level = role.sequence - 1;
             rolesAtLevel[level] || (rolesAtLevel[level] = []);
             const id = `r-${level}-${rolesAtLevel[level].length}`;
-            rolesAtLevel[level].push({ ...role, id });
+            rolesAtLevel[level].push({ ...role, id, role_name: role.name, first_name: '', last_name: '' });
             if (role.full_name && (role.email || role.phone)) {
-                this.rolesCompleted[id] = { ...role, id };
+                this.rolesCompleted[id] = { ...role, id, role_name: role.name, first_name: '', last_name: '' };
             }
         });
     }
@@ -125,6 +124,9 @@ const VerdocsSend = /*@__PURE__*/ proxyCustomElement(class VerdocsSend extends H
             .map((role, index) => ({
             ...role,
             id: `r-${level}-${index}`,
+            role_name: role.name,
+            first_name: '',
+            last_name: '',
         }));
         return rolesAtLevel;
     }
@@ -164,9 +166,9 @@ const VerdocsSend = /*@__PURE__*/ proxyCustomElement(class VerdocsSend extends H
             template_id: this.templateId,
             name: (_c = (_b = this.templateStore) === null || _b === void 0 ? void 0 : _b.state) === null || _c === void 0 ? void 0 : _c.name,
             environment: this.environment,
-            roles: Object.values(this.rolesCompleted),
+            recipients: Object.values(this.rolesCompleted),
             // TODO
-            prepared_fields: [],
+            fields: [],
         };
         console.log('[SEND] Creating envelope', details);
         createEnvelope(this.endpoint, details)
@@ -204,8 +206,8 @@ const VerdocsSend = /*@__PURE__*/ proxyCustomElement(class VerdocsSend extends H
         return (h(Host, { class: { sendable: (_b = (_a = this.templateStore) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.is_sendable } }, h("div", { class: "recipients" }, h("div", { class: "left-line" }), h("div", { class: `level level-start` }, this.getLevelIcon(-1), h("div", { class: "complete" }, "Send Envelope")), levels.map(level => (h("div", { class: `level level-${level}` }, this.getLevelIcon(level), this.getRolesAtLevel(level).map(role => {
             var _a, _b, _c, _d, _e, _f;
             const unknown = !role.email;
-            const elId = `verdocs-send-recipient-${role.name}`;
-            return unknown ? (h("div", { class: "recipient", "data-ri": getRoleIndex(this.roleStore, role.name), "data-rn": role.name, style: { backgroundColor: getRGBA(getRoleIndex(this.roleStore, role.name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, (_b = (_a = this.rolesCompleted[role.id]) === null || _a === void 0 ? void 0 : _a.full_name) !== null && _b !== void 0 ? _b : role.name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: (_c = this.rolesCompleted[role.id]) !== null && _c !== void 0 ? _c : role, onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } }))))) : (h("div", { class: "recipient", style: { borderColor: getRGBA(getRoleIndex(this.roleStore, role.name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, (_e = (_d = this.rolesCompleted[role.id]) === null || _d === void 0 ? void 0 : _d.full_name) !== null && _e !== void 0 ? _e : role.full_name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: (_f = this.rolesCompleted[role.id]) !== null && _f !== void 0 ? _f : role, onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } })))));
+            const elId = `verdocs-send-recipient-${role.role_name}`;
+            return unknown ? (h("div", { class: "recipient", "data-ri": getRoleIndex(this.roleStore, role.role_name), "data-rn": role.role_name, style: { backgroundColor: getRGBA(getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, (_b = (_a = this.rolesCompleted[role.id]) === null || _a === void 0 ? void 0 : _a.full_name) !== null && _b !== void 0 ? _b : role.role_name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: (_c = this.rolesCompleted[role.id]) !== null && _c !== void 0 ? _c : role, onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } }))))) : (h("div", { class: "recipient", style: { borderColor: getRGBA(getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, (_e = (_d = this.rolesCompleted[role.id]) === null || _d === void 0 ? void 0 : _d.full_name) !== null && _e !== void 0 ? _e : role.full_name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: ((_f = this.rolesCompleted[role.id]) !== null && _f !== void 0 ? _f : role), onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } })))));
         })))), h("div", { class: `level level-done` }, this.getLevelIcon(levels.length), h("div", { class: "complete" }, "Signing Complete"))), h("div", { class: "buttons" }, h("verdocs-button", { label: "Cancel", size: "small", variant: "outline", onClick: e => this.handleCancel(e), disabled: this.sending }), h("verdocs-button", { label: "Send", size: "small", disabled: !allRolesAssigned || this.sending, onClick: e => this.handleSend(e) }), this.sending && h("verdocs-spinner", null))));
     }
     static get watchers() { return {

package/dist/components/verdocs-sign.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host, Fragment } from '@stencil/core/internal/client';
 import { VerdocsEndpoint, getSigningSession, getEnvelope, envelopeRecipientAgree, envelopeRecipientDecline, updateEnvelopeField, createSignature, updateEnvelopeFieldSignature, createInitials, updateEnvelopeFieldInitials, isValidPhone, isValidEmail, envelopeRecipientSubmit, uploadEnvelopeFieldAttachment, fullNameToInitials, integerSequence } from '@verdocs/js-sdk';
-import { a as saveAttachment, u as updateDocumentFieldValue, r as renderDocumentField, b as getFieldId } from './utils.js';
+import { a as saveAttachment, u as updateDocumentFieldValue, r as renderDocumentField, g as getFieldId } from './utils.js';
 import { c as createTemplateFieldStoreFromEnvelope } from './TemplateFieldStore.js';
 import { V as VerdocsToast } from './Toast.js';
 import { S as SDKError } from './errors.js';
@@ -76,7 +76,8 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         }
         try {
             console.log(`[SIGN] Processing invite code for ${this.envelopeId} / ${this.roleId}`);
-            const { envelope, recipient, access_token } = await getSigningSession(this.endpoint, this.envelopeId, this.roleId, this.inviteCode);
+            const { envelope, access_token } = await getSigningSession(this.endpoint, this.envelopeId, this.roleId, this.inviteCode);
+            const recipient = envelope.recipients.find(r => r.role_name === this.roleId);
             console.log(`[SIGN] Loaded signing session`, envelope, recipient, access_token);
             this.recipient = recipient;
             console.log('[SIGN] We are recipient', this.recipient);
@@ -183,8 +184,7 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         console.log('[SIGN] updateRecipientFieldValue', fieldName);
         this.getRecipientFields().forEach(oldField => {
             if (oldField.name === fieldName) {
-                oldField.settings = updateResult.settings;
-                // TODO: When we break out other fields like value, update them here too
+                oldField.value = updateResult.value;
                 updateDocumentFieldValue(oldField);
                 this.checkRecipientFields();
             }
@@ -212,15 +212,11 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         switch (field.type) {
             case 'textbox':
                 return this.saveFieldChange(field.name, { prepared: false, value });
-            case 'checkbox':
-            case 'checkbox_group': {
-                const options = field.settings.options.map(option => ({ id: option.id, checked: e.target.checked }));
-                return this.saveFieldChange(field.name, { prepared: false, value: { options } });
+            case 'checkbox': {
+                return this.saveFieldChange(field.name, { prepared: false, value: e.target.checked });
             }
-            case 'radio':
-            case 'radio_button_group': {
-                const options = field.settings.options.map(option => ({ id: option.id, selected: e.target.value === option.id }));
-                return this.saveFieldChange(field.name, { prepared: false, value: { options } });
+            case 'radio': {
+                return this.saveFieldChange(field.name, { prepared: false, value: e.target.value === e.target.checked });
             }
             case 'dropdown':
                 return this.saveFieldChange(field.name, { prepared: false, value: e.detail });
@@ -270,42 +266,33 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         }
     }
     isFieldFilled(field) {
-        var _a, _b, _c, _d, _e, _f;
-        const { result = '', value = '', base64 = '' } = field.settings || {};
+        const { value = '' } = field;
         switch (field.type) {
             case 'textbox':
                 switch (field.validator || '') {
                     case 'email':
-                        return isValidEmail(result);
+                        return isValidEmail(value);
                     case 'phone':
-                        return isValidPhone(result);
+                        return isValidPhone(value);
                     default:
-                        return result !== '';
+                        return value !== '';
                 }
             case 'signature':
             case 'initial':
-                return base64 !== '';
+                return value !== '';
             // Timestamp fields get automatically filled when the envelope is submitted.
             case 'timestamp':
                 return true;
             case 'textarea':
             case 'date':
             case 'attachment':
-                return result !== '';
+                return value !== '';
             case 'dropdown':
                 return value !== '';
             case 'checkbox':
-            case 'checkbox_group':
-                const checkedCount = (((_b = (_a = field.settings) === null || _a === void 0 ? void 0 : _a.options) === null || _b === void 0 ? void 0 : _b.filter(option => option.checked)) || []).length;
-                return checkedCount >= (((_c = field.settings) === null || _c === void 0 ? void 0 : _c.minimum_checked) || 0) && checkedCount <= (((_d = field.settings) === null || _d === void 0 ? void 0 : _d.maximum_checked) || 999);
+                return !!value;
             case 'radio':
-            case 'radio_button_group':
-                return (((_f = (_e = field.settings) === null || _e === void 0 ? void 0 : _e.options) === null || _f === void 0 ? void 0 : _f.filter(option => option.selected)) || []).length > 0;
-            // TODO
-            // case 'checkbox':
-            //   return <verdocs-field-checkbox style={style} value={result || ''} id={id} />;
-            // case 'payment':
-            //   return <verdocs-field-payment style={style} field={field} id={id} />;
+                return !!value;
             default:
                 return false;
         }
@@ -317,11 +304,10 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
     getSortedFillableFields() {
         const recipientFields = this.getRecipientFields().filter(field => field.type !== 'timestamp');
         recipientFields.sort((a, b) => {
-            var _a, _b, _c, _d;
-            const aX = ((_a = a.settings) === null || _a === void 0 ? void 0 : _a.x) || 0;
-            const aY = ((_b = a.settings) === null || _b === void 0 ? void 0 : _b.y) || 0;
-            const bX = ((_c = b.settings) === null || _c === void 0 ? void 0 : _c.x) || 0;
-            const bY = ((_d = b.settings) === null || _d === void 0 ? void 0 : _d.y) || 0;
+            const aX = a.x || 0;
+            const aY = a.y || 0;
+            const bX = b.x || 0;
+            const bY = b.y || 0;
             // NOTE: Logic looks a little strange X vs Y. It's because we go top down,
             // left to right. But Y coordinates are inverted in PDFs. The reason for
             // the division is because no human makes perfect templates and frequently
@@ -360,11 +346,10 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         // Find and focus the next incomplete` field (that is fillable)
         const emptyFields = this.getSortedFillableFields().filter(field => !this.isFieldFilled(field));
         emptyFields.sort((a, b) => {
-            var _a, _b, _c, _d;
-            const aX = ((_a = a.settings) === null || _a === void 0 ? void 0 : _a.x) || 0;
-            const aY = ((_b = a.settings) === null || _b === void 0 ? void 0 : _b.y) || 0;
-            const bX = ((_c = b.settings) === null || _c === void 0 ? void 0 : _c.x) || 0;
-            const bY = ((_d = b.settings) === null || _d === void 0 ? void 0 : _d.y) || 0;
+            const aX = a.x || 0;
+            const aY = a.y || 0;
+            const bX = b.x || 0;
+            const bY = b.y || 0;
             // NOTE: Logic looks a little strange X vs Y. It's because we go top down,
             // left to right. But Y coordinates are inverted in PDFs. The reason for
             // the division is because no human makes perfect templates and frequently
@@ -402,7 +387,7 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         }
     }
     getRecipientFields() {
-        return this.envelope.fields.filter(field => field.recipient_role === this.recipient.role_name);
+        return this.envelope.fields.filter(field => field.role_name === this.recipient.role_name);
     }
     // See if everything that "needs to be" filled in is, and all "fillable fields" are valid
     checkRecipientFields() {
@@ -425,7 +410,7 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
             // console.log('[SIGN] onfieldInput', e.detail, e.target.value);
             // These field types don't emit fieldChange. Should we standardize on that? We don't tap "input" for fields like
             // text boxes because we'd be updating the field on every keystroke. We do those on blur which fires fieldChange.
-            if (e.target.name.includes('date') || e.target.name.includes('checkbox_group') || e.target.name.includes('radio_button_group')) {
+            if (e.target.name.includes('date') || e.target.name.includes('checkbox') || e.target.name.includes('radio')) {
                 this.handleFieldChange(field, e).finally(() => this.checkRecipientFields());
             }
             else {

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

@@ -220,7 +220,7 @@ const VerdocsSignatureDialog = /*@__PURE__*/ proxyCustomElement(class VerdocsSig
     }
      */
     render() {
-        return (h(Host, { key: '88ef514634fef3e3773f13efeeb2b22cbaf9ff0a', onClick: e => this.handleCancel(e) }, h("div", { key: '31369669f68670330cb2f54ec9be44ff6100ac83', class: "dialog" }, h("div", { key: 'd161b9a0e0945cda909eabbd0404448a03e29198', class: "heading" }, "Create Your Signature"), h("div", { key: '9777dd4289072f0be511bb1ec828ed540011e6be', class: "content" }, h("verdocs-text-input", { key: 'afed3547dd47d4883ac84d83d4d05eca9a30d5a2', placeholder: "Full Name...", label: "Full Name", value: this.enteredName, onInput: e => this.handleNameChange(e), onClick: e => e.stopPropagation() }), h("div", { key: '728f24c1a88a395f940df350169ed6ba628d2685', 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: 'abafa624e941b6f6e758fbd75ddd7e0044a377dc', 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: 'fbcc0705c21b7ed206222a9b7382a5562ee7f83d', class: "buttons" }, h("verdocs-button", { key: '5f921b4dfc7df16867071b117a9b055a8aeee8da', label: "CANCEL", size: "normal", variant: "outline", onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: 'dbf88043b9deedb378181bf48d7a04428a32e653', label: "Adopt & Sign", size: "normal", onClick: e => this.handleAdopt(e) }))))));
+        return (h(Host, { key: '473acd8e7140c4f43b62a621a593fc20005ebe4e', onClick: e => this.handleCancel(e) }, h("div", { key: 'b9a66a9135857b2bbcc6afaaa9beaaae4eb64256', class: "dialog" }, h("div", { key: 'f89321f14c13eebde00ffa94c0d22d965000b8fe', class: "heading" }, "Create Your Signature"), h("div", { key: 'ca4ca07c5edcbd64cf2ade7b00e2ad73ca27099e', class: "content" }, h("verdocs-text-input", { key: 'c58ef162f417e8641928e501e1049155a2281537', placeholder: "Full Name...", label: "Full Name", value: this.enteredName, onInput: e => this.handleNameChange(e), onClick: e => e.stopPropagation() }), h("div", { key: 'ad45ecc444bebd5148a2ba83fcff151173dcba49', 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: '49cf09bf30308ad8f2f6d532d79663e22d02b0d7', 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: '322a98f49bfef63474ec02ee04c3655310d730e8', class: "buttons" }, h("verdocs-button", { key: 'fd32bb8d435469f40e7ac371e0b0e5e67138f2e5', label: "CANCEL", size: "normal", variant: "outline", onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: 'b7c57d29e5392e90bd5374b3078abf4d78ffbfb4', 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: '674c605f794bcad37a3ccf1ef7b2c6893a36011a', style: {
+        return (h(Host, { key: 'c17bdf4d7316e71a4ccd6bcf0e814808f0f605bf', 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: '2f8dd56b30f867568973f33f2459fe8492fe046c', 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: '16612687bb40047d888f35071a017956c670dfa7', 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: '19a3fe86138e330435d14d4c8ca9db6021bb7bdc', class: "icon", innerHTML: icon }), h("span", { key: 'f7599f2ac78da17f85348dd67330abb3c6bd071c', class: "content" }, statusMessage), h("div", { key: '57be3fce89a8345d37f4599439e7641cbad6dd07', class: "detail-panel", ref: el => (this.detailPanel = el) }, h("div", { key: 'f1962e7251f027ddf9905516ba4136543d382197', 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: 'b2d8a3e8916a42773129dfe1e751fec203a8e87e', class: "icon", innerHTML: icon }), h("span", { key: 'c8312f756bfc95da805faf269f583e2b840c6e56', class: "content" }, statusMessage), h("div", { key: '0517fb3aeba6908cf05f517c64fd8e8878c2d0ec', class: "detail-panel", ref: el => (this.detailPanel = el) }, h("div", { key: '2de4e11a3b809b549a96f78e393ef9c95f3a3021', 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-table.js

@@ -13,9 +13,9 @@ const VerdocsTable$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsTable exten
         this.data = [];
     }
     render() {
-        return (h(Host, { key: '30dc31671a4fe5fe698e16ff2dd4ea9929c7659b', class: "table-wrapper" }, h("table", { key: '584e1b863ccf37c17b0e36ac3dd5178d3e591473', class: "table" }, h("thead", { key: 'e54fccb7ad63ff09d32719b2b9ce2beceae33d4a' }, h("tr", { key: '1b435a6772c21795c5c7bd0dddb5a8225add0e55', class: "row header-row" }, this.columns.map((col, i) => {
+        return (h(Host, { key: '55c0e4647639ccb4ecf1b70765ed12d21fda73b2', class: "table-wrapper" }, h("table", { key: 'b66ad58e6be95e5a1aa297a191142db098d95151', class: "table" }, h("thead", { key: 'da78f06f41395e44b42aefe9b452ad5c29278e1a' }, h("tr", { key: '1231558af753ec6445ba2cf245121bdde5536d74', 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: '75dd1db03c8ea79b186939b5dab16a800371c3db' }, 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: '0282efc552d51d876688b5405d3679f632ec4ec0' }, 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: '40357821a495d7b0c94b205ed90e5fd83b4a5146' }, 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: 'dd9e2a621082bd61f62b161830c6fd1138f0e8c1', class: "flex flex-1" }), h("slot", { key: '4e64f7e7221fd9d5613f83db4067f71f2c4c1f12' }, h("div", { key: '4926afa57bb87a838b66807837f3b71c436a4586' }))));
+        return (h(Host, { key: '2fedcaa89e194d52552c9c1295451889f15873bd' }, 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: 'd1020c064e91e7b2f08f096266de33533055afc4', class: "flex flex-1" }), h("slot", { key: '454f2a0fab01099f8ec6bdf73d4eaacd3471bc69' }, h("div", { key: 'b7a6f1c170591c2664e88b611cb9162f800d01c4' }))));
     }
     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: '92db1527b29db1accce1236ad170c1d071bd9af9' }, h("span", { key: '6df84f4e3f47f2a3bde4de1aaeb55cfdaaf24cec', class: "name" }, this.template.name), h("span", { key: '6be1cd61a1496fa579f25ff06fcd5295149aada1', class: "org-name" }, ((_a = this.template.organization) === null || _a === void 0 ? void 0 : _a.name) || 'Public'), h("hr", { key: '8f95b065445cf18ec71b2976c5c75d7335857f1a' }), h("div", { key: 'cce4e78b58f924de6b68bcf947af20dbed74ae15', class: "controls" }, h("div", { key: '124cf87ac1ab5f25d505004ebba55c0ad00d3b34', class: "control" }, h("span", { key: 'b39885d89f97c7f29077f5a0e8e943c2fd74e8a0', class: "icon", innerHTML: StarIcon }), h("span", { key: '7fa8e32525ed221d9907e658ca6f982fed16dba6', class: "value" }, this.template.star_counter)), h("div", { key: '37fb74c5e9302e8c310e2052b725183bac587c3d', class: "control secondary" }, h("span", { key: 'bef0ebc42c5f9062bf67d86a097dd0d4a8e03e11', class: "icon", innerHTML: PagesIcon }), h("span", { key: '3763e7ec4ac4e73ce712c460101223d6f8663b2a', 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: 'e4f9d35db361036a46297e82ecf1528058e214bc', class: "control secondary" }, h("span", { key: '985da1d76dfeecb4e57e440fbf788c18453696a1', class: "icon", innerHTML: EmailIcon }), h("span", { key: 'f098866929e19bf47e30a660aba05a3e508561ed', class: "value" }, this.template.counter)), h("span", { key: 'c742e5c6e1087a9b0f1a8b037476759274838c42', class: "additional-controls", innerHTML: ActionsIcon }))));
+        return (h(Host, { key: '11be2283e6610b875b835e2d736d19ceba3b9358' }, h("span", { key: 'a41398c67dde9d240c13f73cc836917f23960ec3', class: "name" }, this.template.name), h("span", { key: '34b1cb0d87aae893f8e185d165023afdc62c5809', class: "org-name" }, ((_a = this.template.organization) === null || _a === void 0 ? void 0 : _a.name) || 'Public'), h("hr", { key: 'c4f2a830092009e425f12b3b9aecbfe3fa301486' }), h("div", { key: '5ed90379ab7ce3c102a1aba5a29a4e2cc574481e', class: "controls" }, h("div", { key: '3f2d20d7b8d34e6cfb999497b1f7041c2c543aa7', class: "control" }, h("span", { key: '6c3384e755b454f5faac3fce12855924e46be22d', class: "icon", innerHTML: StarIcon }), h("span", { key: '16d1cc0346dfc181d4233f7536ad9277fcca926e', class: "value" }, this.template.star_counter)), h("div", { key: 'c21690a71bc4c3f4c61b0baef7615afd74fe63e5', class: "control secondary" }, h("span", { key: '96871df90393b8be8323781f6e5f4f7ff09461ee', class: "icon", innerHTML: PagesIcon }), h("span", { key: 'f8eacea9e45b1324549b27554274c4cfe1d9fcbf', 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: 'a1eac1e81ef20bca46effe92ada3814e1c67d1af', class: "control secondary" }, h("span", { key: '5878dc1bc0131b8a601c5927504e3699e2fae2a9', class: "icon", innerHTML: EmailIcon }), h("span", { key: 'ecc8da9b6565faf39b0627daa45f738ab15c42f0', class: "value" }, this.template.counter)), h("span", { key: '9c3351987febfa1df0e338c6e63d99d562b2e7da', class: "additional-controls", innerHTML: ActionsIcon }))));
     }
     static get style() { return VerdocsTemplateCardStyle0; }
 }, [0, "verdocs-template-card", {