@verdocs/web-sdk 4.2.43 → 4.2.47

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

@@ -35,7 +35,7 @@ const VerdocsHelpIcon = /*@__PURE__*/ proxyCustomElement(class VerdocsHelpIcon e
         (_a = this.tooltipEl) === null || _a === void 0 ? void 0 : _a.removeAttribute('data-show');
     }
     render() {
-        return (h(Host, { key: '5a9b1c6fe8b5d180f14d2335950b23a7ff0d0c90', class: {} }, h("div", { key: '6e69978780529072f292c5a3d89c2cb7be0d6c8f', "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: '19316d99b359b9ec20c46c4ecbe72be3b231d498', id: this.containerId, role: "tooltip", class: "tooltip", "data-popper-placement": "bottom", ref: el => (this.tooltipEl = el) }, h("span", { key: 'ac871b0bfa55e880272c62b957495096103ef55e', innerHTML: this.text }), h("div", { key: 'b17216877657c25dd062d51d7a2c813d9d59972b', "data-popper-arrow": "true", class: "arrow" }))));
+        return (h(Host, { key: 'a3461401c9c39efe1d3d4a33797c9fdb4c243cd4', class: {} }, h("div", { key: 'bab136ac563622e50b68a624b0beca62b1ee43f8', "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: 'e23f6cb0bf8dfecd28ed92790eff519ea83707f3', id: this.containerId, role: "tooltip", class: "tooltip", "data-popper-placement": "bottom", ref: el => (this.tooltipEl = el) }, h("span", { key: '2c61ce450603afa8fa608c98003e0c97b5486df5', innerHTML: this.text }), h("div", { key: 'b57ad281d928ba3b4b2ea807bd6744f88f1519c3', "data-popper-arrow": "true", class: "arrow" }))));
     }
     static get style() { return VerdocsHelpIconStyle0; }
 }, [0, "verdocs-help-icon", {

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

@@ -223,7 +223,7 @@ const VerdocsInitialDialog = /*@__PURE__*/ proxyCustomElement(class VerdocsIniti
     }
      */
     render() {
-        return (h(Host, { key: '9006cdf73a61c1d98c81bdebbdf18f4b556ddeb9', onClick: e => this.handleCancel(e) }, h("div", { key: 'cbd4bb1d98fd49e3874ddbd747c7cee69cb5c39e', class: "dialog" }, h("div", { key: 'c751dcfa414370fd1eb9adc8eb8e9b22af8383ae', class: "heading" }, "Create Your Initial"), h("div", { key: '3bf621f90c954b626c90925b50b65a08b2a5bf37', class: "content" }, h("verdocs-text-input", { key: 'f66fa605b16228d389231908825483594e3872bf', placeholder: "Initials...", label: "Initials", value: this.enteredInitials, onInput: e => this.handleNameChange(e) }), h("div", { key: '42b8206f41b9acf5220d3b132fc1ab8f038a1522', 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: '64c1da383cc7f6fc6d34af5bcced3caa623eae02', 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: '0c8621ee304a5819607612ceeae0276a8a3f84dd', class: "buttons" }, h("verdocs-button", { key: '84b4ea8e03a58be3719d6e5c54227db2538a1753', label: "CANCEL", variant: "outline", onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: '64a5480d9b29fbb1d17c5735259f486693dc6cea', label: "Adopt & Sign", onClick: e => this.handleAdopt(e) }))))));
+        return (h(Host, { key: '98f8bc6b29579e346c77c0d95f411856d1ac9574', onClick: e => this.handleCancel(e) }, h("div", { key: 'f5523f0097065f6bb98ae3dafa5597c9c838bdb1', class: "dialog" }, h("div", { key: 'd02d5974a2e4cd5c4a902eb50ffc3eb266d8581a', class: "heading" }, "Create Your Initial"), h("div", { key: 'bcc0f0c0576e2d04368b343ffe2ab068adbccad7', class: "content" }, h("verdocs-text-input", { key: '59d99f2d65a80f0b026e2b7437124ee451646ce9', placeholder: "Initials...", label: "Initials", value: this.enteredInitials, onInput: e => this.handleNameChange(e) }), h("div", { key: '74bea0970b5a0cb3e8ba0b1161831ca2ee5c4df5', 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: '1964a8a425a78881257c7c649e86b55d2d4d1f44', 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: '8032dbe137f00c09ac4416901dbe9fef27cfb961', class: "buttons" }, h("verdocs-button", { key: 'f6151fbecf531ee7c1d0d257bf9e72a24f00deca', label: "CANCEL", variant: "outline", onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: '2ab798869462bd942a37c34bbbe7c35a27927044', label: "Adopt & Sign", onClick: e => this.handleAdopt(e) }))))));
     }
     static get style() { return VerdocsInitialDialogStyle0; }
 }, [0, "verdocs-initial-dialog", {

package/dist/components/verdocs-kba-dialog.js

@@ -35,9 +35,9 @@ const VerdocsKbaDialog$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsKbaDial
         this.next.emit(this.response);
     }
     render() {
-        return (h(Host, { key: 'c82a5d8b5257732255861a67a51ed6a0b2675b77' }, h("div", { key: 'c102ab713567ed43cef7c344df8a0936274b6f6e', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: 'e932de4a3ca2402a965744ab02f9d6c3b8f86645', class: "dialog" }, h("div", { key: '569f5420ada83b65ecc93147aed387086f659b34', class: "heading" }, "Confirm Your Identity", this.steps > 1 ? (h("span", { class: "step" }, "(", this.step, "/", this.steps, ")")) : (h(Fragment, null))), h("div", { key: '2ffd440933f4e7c44a72eab3fdfd36f8e8a630c8', class: "help-box" }, h("div", { key: '79b7cba2e72d7fd7e576b1f965014e67759727e5', class: "help-icon", innerHTML: QuestionIcon }), h("div", { key: '5ccf156e49de25f88804641ab4b67536838f2876', class: "help-details" }, h("div", { key: '857feb344fd1ba7fdabda6c090e64b03ea1150bb', class: "help-title" }, this.helptitle), h("div", { key: 'b0f0bde18492545dcb767a6a73b70fbebb497ecb', class: "help-text" }, this.helptext))), this.mode === 'choice' ? (h("div", { class: "choices" }, this.choices.map(choice => (h("div", { class: `choice ${choice === this.response ? 'selected' : ''}`, onClick: () => {
+        return (h(Host, { key: 'da8054400603e7418a3d242a9748bf7ffef16d3d' }, h("div", { key: '792bf0a4b01debcd3d9c7bb463e231e2eb484bcd', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: 'e45a0b6afa03b2f0accf8e6482d17b46030e126d', class: "dialog" }, h("div", { key: 'e847058eaa84b95a5e4280cd97d7dc836ee0d440', class: "heading" }, "Confirm Your Identity", this.steps > 1 ? (h("span", { class: "step" }, "(", this.step, "/", this.steps, ")")) : (h(Fragment, null))), h("div", { key: 'e5c56390905ddb76306c61e0c6b0d1bdef2711c4', class: "help-box" }, h("div", { key: '09884fd5082b7c8f486cbdfb77600c0880fd27e4', class: "help-icon", innerHTML: QuestionIcon }), h("div", { key: '7a616300c3f63eab801e50058a0e7af05b78a480', class: "help-details" }, h("div", { key: 'cfd964d86c1a9613514c3aa287aa9054628e52f5', class: "help-title" }, this.helptitle), h("div", { key: 'bbbc656fbde278951af5dc9a584f87f9ebc8c774', class: "help-text" }, this.helptext))), this.mode === 'choice' ? (h("div", { class: "choices" }, this.choices.map(choice => (h("div", { class: `choice ${choice === this.response ? 'selected' : ''}`, onClick: () => {
                 this.response = choice;
-            } }, choice))))) : (h("div", { class: "input" }, h("label", { htmlFor: "verdocs-kba-input" }, this.label), h("input", { type: "text", id: "verdocs-kba-input", name: "verdocs-kba-input", placeholder: this.placeholder }))), h("div", { key: 'b76320da31947aa982e3d93c766e395b4133d15f', class: "buttons" }, h("verdocs-button", { key: 'bc7c181fc05366341cc4c4e2e2f00749b5ac377e', label: "Cancel", variant: "outline", onClick: () => this.handleCancel() }), h("verdocs-button", { key: 'dbd938075496f58916586ae1ab89290ab73d129a', label: "Done", onClick: () => this.handleDone(), disabled: !this.response }))))));
+            } }, choice))))) : (h("div", { class: "input" }, h("label", { htmlFor: "verdocs-kba-input" }, this.label), h("input", { type: "text", id: "verdocs-kba-input", name: "verdocs-kba-input", placeholder: this.placeholder }))), h("div", { key: '292ba4aeeb659c074ca6bf7cf140509eef3bae72', class: "buttons" }, h("verdocs-button", { key: '66d145fd7aa347f7fadb14a4242626a85961bb11', label: "Cancel", variant: "outline", onClick: () => this.handleCancel() }), h("verdocs-button", { key: 'e27794562d12fb066509df1c28836b2292e85e4e', label: "Done", onClick: () => this.handleDone(), disabled: !this.response }))))));
     }
     static get style() { return VerdocsKbaDialogStyle0; }
 }, [0, "verdocs-kba-dialog", {

package/dist/components/verdocs-loader2.js

@@ -9,7 +9,7 @@ const VerdocsLoader = /*@__PURE__*/ proxyCustomElement(class VerdocsLoader exten
         this.__registerHost();
     }
     render() {
-        return h(Host, { key: 'ed5515379a667ba9187a662d42ec3d96148f4536' });
+        return h(Host, { key: 'e62911490bdee24308a18ef52651393469dd6e5b' });
     }
     static get style() { return VerdocsLoaderStyle0; }
 }, [0, "verdocs-loader"]);

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

@@ -31,7 +31,7 @@ const VerdocsOkDialog = /*@__PURE__*/ proxyCustomElement(class VerdocsOkDialog e
         }
     }
     render() {
-        return (h(Host, { key: 'c1505d930741a4a0e1eb9a9832de8e55d09b207c', class: this.closed ? 'closed' : '' }, h("div", { key: 'f4c1ce92701f56a3b839bc49a0beb38665a65556', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '0fe99745209ca40287512f114122d1a0f0c4e597', class: "dialog" }, h("div", { key: '93deffa53c92913b65109f3c9826e61561f91c68', class: "heading" }, this.heading), h("div", { key: 'b0a64c6f2072655ce439d5008ecfe55651d48d8f', class: "content" }, h("div", { key: '3f89fd4b54dfa1c8437c2aa7dd21310827516004', class: "message", innerHTML: this.message }), h("div", { key: 'a86843d9915f72bcc00810c87f3311c77cf3b566', class: "buttons" }, this.showCancel ? h("verdocs-button", { label: "CANCEL", variant: "outline", onClick: () => this.handleCancel() }) : h("div", { style: { display: 'none' } }), h("verdocs-button", { key: 'd160170c8a58dde135ba4c5ae4dac35ac79c24a1', label: this.buttonLabel, onClick: () => this.handleOk() })))))));
+        return (h(Host, { key: 'd1e3ae19b392dc0b6d72d7f556dcd7e3563bfdf0', class: this.closed ? 'closed' : '' }, h("div", { key: '7ebf997fa041a6dc46db786a907892f2e453dae0', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '5b1942996241c78ba43d69d3cfc524122fb61a34', class: "dialog" }, h("div", { key: 'f2f4a909de8fffe96deb3b8e5dd40c33eabb8f7b', class: "heading" }, this.heading), h("div", { key: 'be340ff6b4505a2e4860dedaf45ee96a8a163fb4', class: "content" }, h("div", { key: '96ca69ddc741ba55a29084d5acb06297b92542e3', class: "message", innerHTML: this.message }), h("div", { key: '380641fb9acafc35508a8099a4aca16849b24631', class: "buttons" }, this.showCancel ? h("verdocs-button", { label: "CANCEL", variant: "outline", onClick: () => this.handleCancel() }) : h("div", { style: { display: 'none' } }), h("verdocs-button", { key: '783c61e0ef96346d18923a4961988efa762c360f', label: this.buttonLabel, onClick: () => this.handleOk() })))))));
     }
     static get style() { return VerdocsOkDialogStyle0; }
 }, [0, "verdocs-ok-dialog", {

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

@@ -5,15 +5,14 @@ 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';
-import { d as defineCustomElement$l } from './verdocs-component-error2.js';
-import { d as defineCustomElement$k } from './verdocs-field-attachment2.js';
-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$m } from './verdocs-button2.js';
+import { d as defineCustomElement$l } from './verdocs-checkbox2.js';
+import { d as defineCustomElement$k } from './verdocs-component-error2.js';
+import { d as defineCustomElement$j } from './verdocs-field-attachment2.js';
+import { d as defineCustomElement$i } from './verdocs-field-checkbox2.js';
+import { d as defineCustomElement$h } from './verdocs-field-date2.js';
+import { d as defineCustomElement$g } from './verdocs-field-dropdown2.js';
+import { d as defineCustomElement$f } from './verdocs-field-initial2.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';
@@ -118,7 +117,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-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)) {
@@ -126,46 +125,41 @@ function defineCustomElement() {
             }
             break;
         case "verdocs-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$n();
-            }
-            break;
-        case "verdocs-checkbox":
             if (!customElements.get(tagName)) {
                 defineCustomElement$m();
             }
             break;
-        case "verdocs-component-error":
+        case "verdocs-checkbox":
             if (!customElements.get(tagName)) {
                 defineCustomElement$l();
             }
             break;
-        case "verdocs-field-attachment":
+        case "verdocs-component-error":
             if (!customElements.get(tagName)) {
                 defineCustomElement$k();
             }
             break;
-        case "verdocs-field-checkbox":
+        case "verdocs-field-attachment":
             if (!customElements.get(tagName)) {
                 defineCustomElement$j();
             }
             break;
-        case "verdocs-field-date":
+        case "verdocs-field-checkbox":
             if (!customElements.get(tagName)) {
                 defineCustomElement$i();
             }
             break;
-        case "verdocs-field-dropdown":
+        case "verdocs-field-date":
             if (!customElements.get(tagName)) {
                 defineCustomElement$h();
             }
             break;
-        case "verdocs-field-initial":
+        case "verdocs-field-dropdown":
             if (!customElements.get(tagName)) {
                 defineCustomElement$g();
             }
             break;
-        case "verdocs-field-radio-button":
+        case "verdocs-field-initial":
             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

@@ -104,9 +104,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 +125,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 +167,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 +207,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]));
         }))))))));
     }