@verdocs/web-sdk 4.2.100 → 4.2.102

package/dist/collection/components/controls/verdocs-text-input/verdocs-text-input.js

@@ -35,7 +35,7 @@ export class VerdocsTextInput {
             .catch(e => console.log('Error copying to clipboard', e));
     }
     render() {
-        return (h(Host, { key: '6d4b7c85dd7698f795f11e1bb235406fdedd8a96', class: `input-field ${this.clearable ? 'clearable' : ''} ${this.copyable ? 'copyable' : ''}` }, h("label", { key: '48e3419a7c9187444a1fdcfad1cea862a6945ee3' }, this.label && (h("div", { key: 'ebf6b58a21bafab4fbe411b5f0f3cb5bb29157f8', class: "input-label" }, this.label + ':', this.required && h("span", { key: '84b895a4fc3686991a0966a3442fc87c610628d6', class: "required" }, "*"))), h("div", { key: '86887c310beeb76920c574d268fa9508d0d331b4', class: "input-container" }, h("input", { key: '14c9e36708fb955fd6b3bf5cac37aae2b64f820b', type: this.type === 'password' && this.showingPw ? 'text' : this.type, value: this.value, required: this.required, class: "input-element", "data-lpignore": "true", disabled: this.disabled, placeholder: this.placeholder, autoComplete: this.autocomplete, onBlur: (e) => { var _a; return (_a = this.blur) === null || _a === void 0 ? void 0 : _a.emit(e.target.value); }, ref: el => (this.inputEl = el), onInput: (e) => (this.value = e.target.value) }), this.clearable && this.value && (h("span", { key: '333a08eaf763d01d603cb8750b4328d9d2e6f97e', innerHTML: ClearIcon, class: "clear", onClick: () => {
+        return (h(Host, { key: 'a6f4cbf0e0b53caa2f471b943cf61327d47f10fe', class: `input-field ${this.clearable ? 'clearable' : ''} ${this.copyable ? 'copyable' : ''}` }, h("label", { key: 'f0005d82081079e1fbb0c4e0dac810a5051e1271' }, this.label && (h("div", { key: '862931caecb6d33c6a216a582935806a964ad2e8', class: "input-label" }, this.label + ':', this.required && h("span", { key: '58347a8111e1f88d6e38ee5fbf55036aeec28935', class: "required" }, "*"))), h("div", { key: '298a97a55d866e1ab14608d5d33a918b98f45092', class: "input-container" }, h("input", { key: 'b813c15cd2822af0b994f5414c60d704ab07b2ac', type: this.type === 'password' && this.showingPw ? 'text' : this.type, value: this.value, required: this.required, class: "input-element", "data-lpignore": "true", disabled: this.disabled, placeholder: this.placeholder, autoComplete: this.autocomplete, onBlur: (e) => { var _a; return (_a = this.blur) === null || _a === void 0 ? void 0 : _a.emit(e.target.value); }, ref: el => (this.inputEl = el), onInput: (e) => (this.value = e.target.value) }), this.clearable && this.value && (h("span", { key: '0dd0323f08f8a7c173c78f6eac16450295f6ecd5', innerHTML: ClearIcon, class: "clear", onClick: () => {
                 // We need to allow the onInput event to fire first in case
                 // the user was focused on this field before clicking clear.
                 setTimeout(() => {
@@ -49,9 +49,9 @@ export class VerdocsTextInput {
                         (_b = this.inputEl) === null || _b === void 0 ? void 0 : _b.blur();
                     }, 50);
                 }, 50);
-            } })), this.type === 'password' && (h("span", { key: 'b62dc779e128bb5f541884cae7f27f53baf4c62a', innerHTML: this.showingPw ? EyeIcon : EyeSlashIcon, class: "toggle-pw", onClick: () => {
+            } })), this.type === 'password' && (h("span", { key: '91e1427c7b7179ebc843d820e146d23b07ae7ba3', innerHTML: this.showingPw ? EyeIcon : EyeSlashIcon, class: "toggle-pw", onClick: () => {
                 this.showingPw = !this.showingPw;
-            } })), !this.clearable && this.copyable && this.value && h("span", { key: 'acd2baea4821146254849942ebba6f2f1af5511d', innerHTML: CopyIcon, class: "copy", onClick: () => this.copyToClipboard() })), this.helpText && h("verdocs-help-icon", { key: '1c3e7b58bd3c62770b88d585bc52149780016dd5', text: this.helpText }))));
+            } })), !this.clearable && this.copyable && this.value && h("span", { key: 'b785191a6f5681c8831fb3c75fa86d3d977aee30', innerHTML: CopyIcon, class: "copy", onClick: () => this.copyToClipboard() })), this.helpText && h("verdocs-help-icon", { key: '3676128c06aaa7f7bd5cf4bd800a88604317041a', text: this.helpText }))));
     }
     static get is() { return "verdocs-text-input"; }
     static get originalStyleUrls() {

package/dist/collection/components/controls/verdocs-toggle/verdocs-toggle.js

@@ -17,7 +17,7 @@ export class VerdocsToggle {
         this.selectedOption = ((_a = this.options) === null || _a === void 0 ? void 0 : _a.defaultSelection) || 0;
     }
     render() {
-        return (h("div", { key: '9f256803ea1b003623aec738a492dff08b5f90ac', class: "container" }, h("span", { key: '61fd34e585a9d7994bda0d73aa30b229407119ef', class: "label" }, `${this.options.label}:`), h("div", { key: '8e80a85a72c40cc3c87885f43dc379225a2dfe3b', class: "buttons" }, this.options.buttons.map((button, index) => (h("button", { id: button.id, key: button.id, innerHTML: button.icon, class: index === this.selectedOption ? 'selected' : '', onClick: () => {
+        return (h("div", { key: '3fce957152f13b188837bcf6cf40603d9618689e', class: "container" }, h("span", { key: '9d4c488975c9daa125ecf906f641e2bc74654a96', class: "label" }, `${this.options.label}:`), h("div", { key: '28a2d8a82b05fcb3cfc9bea409ad37633fb0d860', class: "buttons" }, this.options.buttons.map((button, index) => (h("button", { id: button.id, key: button.id, innerHTML: button.icon, class: index === this.selectedOption ? 'selected' : '', onClick: () => {
                 console.log('clicked', index);
                 this.selectedOption = index;
             } }))))));

package/dist/collection/components/controls/verdocs-toggle-button/verdocs-toggle-button.js

@@ -25,7 +25,7 @@ export class VerdocsToggleButton {
         (_a = this.toggle) === null || _a === void 0 ? void 0 : _a.emit({ active: newState });
     }
     render() {
-        return (h(Host, { key: '95a678bbbbc6d63aff1239b6fb296e98e093ceb8', class: `size-${this.size}` }, this.icon ? (h("button", { innerHTML: this.icon, class: { active: this._active }, onClick: e => this.handleToggle(e) })) : (h("button", { class: { active: this._active }, onClick: e => this.handleToggle(e) }, this.label))));
+        return (h(Host, { key: '32eb5cccbb9687200cf1b57266ceb09143d4a478', class: `size-${this.size}` }, this.icon ? (h("button", { innerHTML: this.icon, class: { active: this._active }, onClick: e => this.handleToggle(e) })) : (h("button", { class: { active: this._active }, onClick: e => this.handleToggle(e) }, this.label))));
     }
     static get is() { return "verdocs-toggle-button"; }
     static get originalStyleUrls() {

package/dist/collection/components/controls/verdocs-toolbar-icon/verdocs-toolbar-icon.js

@@ -43,7 +43,7 @@ export class VerdocsToolbarIcon {
     //   this.press?.emit();
     // }
     render() {
-        return (h(Host, { key: 'ea93725233dd213179a2c804bf7f4ab8cf7ab8bd', class: {} }, h("div", { key: '84c85bb763e237e06cce0a6df7852c1f8550ad9c', "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: 'e5d7e7765580c8c797f8cf73f0fc82adf6a6509d', id: this.containerId, role: "tooltip", class: "tooltip", "data-popper-placement": this.placement, ref: el => (this.tooltip = el) }, this.text, h("div", { key: '0502203740b302633cd730d220f2a184cbbb88de', "data-popper-arrow": "true", class: "arrow" }))));
+        return (h(Host, { key: '4674a6debb2b1097facb31672444e0f1eb397d41', class: {} }, h("div", { key: '81948d50d0b55ba9e85862e37c1e16402d8851da', "aria-describedby": this.containerId, class: "icon", innerHTML: this.icon, onMouseEnter: () => this.show(), onFocus: () => this.show(), onMouseLeave: () => this.hide(), onBlur: () => this.hide(), ref: el => (this.iconEl = el) }), h("div", { key: '716d04df7702b2068ec15b55f744646ea26aeac7', id: this.containerId, role: "tooltip", class: "tooltip", "data-popper-placement": this.placement, ref: el => (this.tooltip = el) }, this.text, h("div", { key: '8511e8a6cbe059d525a4ee770a479c932dab9625', "data-popper-arrow": "true", class: "arrow" }))));
     }
     static get is() { return "verdocs-toolbar-icon"; }
     static get originalStyleUrls() {

package/dist/collection/components/dialogs/verdocs-dialog/verdocs-dialog.js

@@ -12,7 +12,7 @@ export class VerdocsDialog {
         }
     }
     render() {
-        return (h(Host, { key: '81c8ede6508a1ce80ce002b0b94b91604e7a2e73' }, h("div", { key: '2e05c3999a88c0d6e16615953054a4658c6f25d7', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '45e7c3d08b5a2cf830a06a0a938c3e43febb79ca', class: "dialog" }, h("slot", { key: '6c4c0e21c52a0a272df32976288734d09183251a', name: "title" }, h("div", { key: 'd3f30f469242351f95d2e20d58adf4e0ff86881e', class: "heading" }, "Please Confirm")), h("div", { key: '4800a431f9c5b5d65da612fd753533fd8469e9e5', class: "content" }, h("slot", { key: '40dcf76ccc8b799262aaba30435ae2692af53cb7' }))))));
+        return (h(Host, { key: 'ee194cde3ac800e6e9f33d02adc229c928a47472' }, h("div", { key: '23b03c631d3b9f35b35118e97b8a07fadcd060dd', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '21c99c448b050697f4cecf7e7ff02ae4eb0d14b1', class: "dialog" }, h("slot", { key: '8d11918bfe16a6bec51cf1f4a3fb3fe85ea1bf7e', name: "title" }, h("div", { key: '289c5627bd2605d8029163a81a8d7e827b6b6742', class: "heading" }, "Please Confirm")), h("div", { key: 'e29ebee3cde9efa5c41d95ece644bcf7eb5c24b0', class: "content" }, h("slot", { key: '4d9ef52291c370dc13d799292d70fb96ed611852' }))))));
     }
     static get is() { return "verdocs-dialog"; }
     static get originalStyleUrls() {

package/dist/collection/components/dialogs/verdocs-initial-dialog/verdocs-initial-dialog.js

@@ -216,7 +216,7 @@ export class VerdocsInitialDialog {
     }
      */
     render() {
-        return (h(Host, { key: '8d0116cf97848213877b5250d2b49e8da73f9d7a', onClick: e => this.handleCancel(e) }, h("div", { key: '81a12261f5eef48b00309756c685fae9993f613a', class: "dialog" }, h("div", { key: '91364e9ac8d4bbdd50dc201a323c9b34a1d5ddfc', class: "heading" }, "Create Your Initial"), h("div", { key: 'dea07efcc51b6b8530e2615f05bcd8024e6d2029', class: "content" }, h("verdocs-text-input", { key: '04ad40f6f734556849afa551ef9eb665d3b28c48', placeholder: "Initials...", label: "Initials", value: this.enteredInitials, onInput: e => this.handleNameChange(e) }), h("div", { key: 'c038a30e6355e58d428c5b0190868a536236dfb3', 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: '22a8f81443052b8e0523f19161a9cf8671fe9f45', 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: 'd6c53a1846c6d109d38d1977a452dcfbea1b7aeb', class: "buttons" }, h("verdocs-button", { key: '0c12b1bfd70a923564e77a7970472cc5cdcdf0e9', label: "CANCEL", variant: "outline", onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: '88ef91ffa75db664b822758f38143d5535b6803c', label: "Adopt & Sign", onClick: e => this.handleAdopt(e) }))))));
+        return (h(Host, { key: 'b4b3d0cbe08bb7525e48c728b50f071d6c764c1b', onClick: e => this.handleCancel(e) }, h("div", { key: 'bfe9ca476892ec9e4d0826f02108d17ccdc7e52c', class: "dialog" }, h("div", { key: '0fe9deeafd7d0a1a23600b6ce78ecb0a2db68478', class: "heading" }, "Create Your Initial"), h("div", { key: '93ab94da31dce21b97bab3e3cd49d765626fca55', class: "content" }, h("verdocs-text-input", { key: '90f1c69e6b624aafeb734ab922971c261fd95099', placeholder: "Initials...", label: "Initials", value: this.enteredInitials, onInput: e => this.handleNameChange(e) }), h("div", { key: 'ea0d3a80d34a1259d7e5a28537b6c2532b446915', 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: '018cc438201111ce05ccad82d7b6a5ecde225cd5', 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: 'f6abe4ff08732e499e172a11e7bd0cb4411f80f9', class: "buttons" }, h("verdocs-button", { key: '090929f2e43bc9b1d779b5a2c5bc8f22fee9c8b5', label: "CANCEL", variant: "outline", onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: '0a7c7c576f63525ed268a6e8f11b7ab0ad7f7d5f', label: "Adopt & Sign", onClick: e => this.handleAdopt(e) }))))));
     }
     static get is() { return "verdocs-initial-dialog"; }
     static get originalStyleUrls() {

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

@@ -29,7 +29,7 @@ export class VerdocsKbaDialog {
         this.next.emit(this.response);
     }
     render() {
-        return (h(Host, { key: '9b857660b91b89f928049d3f85a66bc1e585105e' }, h("div", { key: '36ff0ab3351dff215a5abf4a1ff7356346747650', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '26003d02099b3f64660091ee1dc02b81e7b9ca13', class: "dialog" }, h("div", { key: '4fb9daa61b801da6eb5f096149b09d4e0b89f676', class: "heading" }, "Confirm Your Identity", this.steps > 1 ? (h("span", { class: "step" }, "(", this.step, "/", this.steps, ")")) : (h(Fragment, null))), !!this.helptitle && (h("div", { key: 'bfac2a1a7bb294e1b24eb17664bcdd65ce7c4a17', class: "help-box" }, h("div", { key: '434dd57cdcd743f612985866d0e16e6f1fd2b1e1', class: "help-icon", innerHTML: QuestionIcon }), h("div", { key: '661bfcc2e80d66dceae242251e0734af45e83185', class: "help-details" }, h("div", { key: '786b81135e2080d7881016221fe99d3a1ecff095', class: "help-title" }, this.helptitle), h("div", { key: '0b31cb58496e9665389399e6f426dc4266837af0', 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, value: this.response, onInput: (e) => (this.response = e.target.value) }))), h("div", { key: 'a6752c1cbeb1a83cf1adbb2f634cc8bdf79ebb0a', class: "buttons" }, h("verdocs-button", { key: '1a2d7c28c34f7f6bfbc554b116b096617aa0b40e', label: "Cancel", variant: "outline", onClick: () => this.handleCancel() }), h("verdocs-button", { key: 'fb1c40e5895a0644c904fac36b860aaf62eb7e95', label: "Done", onClick: () => this.handleDone(), disabled: !this.response }))))));
+        return (h(Host, { key: '97c855bc7ff5c4205ccc64d859d9b1787e0048a6' }, h("div", { key: 'f4dd12baf199d9c50e6ebbb02b7e26e6204a9669', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '051764b9306bc6f3d21221e3aa6d4e6cf104d0e1', class: "dialog" }, h("div", { key: '0f0ecc082f97975c92d7418a96e3689fea0a192b', class: "heading" }, "Confirm Your Identity", this.steps > 1 ? (h("span", { class: "step" }, "(", this.step, "/", this.steps, ")")) : (h(Fragment, null))), !!this.helptitle && (h("div", { key: 'f6d4e4db03fad13638f3980839210f8df886bd2c', class: "help-box" }, h("div", { key: 'c18a7aab25144f438da8cbacca4465e009ab6a02', class: "help-icon", innerHTML: QuestionIcon }), h("div", { key: '02e1dba0b4536b39a61fffea636a6e9c58fd40a8', class: "help-details" }, h("div", { key: '740bc221c448afc393b1007a4141ce4db2cf8008', class: "help-title" }, this.helptitle), h("div", { key: '767d5d0141c73e0621cfbe795fecb50637dc38cb', 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, value: this.response, onInput: (e) => (this.response = e.target.value) }))), h("div", { key: 'f6e90196e71c9931613622d0879eeb4bc4877792', class: "buttons" }, h("verdocs-button", { key: '269ea8b9020ab81d9234c0d1b8151a459d84f37d', label: "Cancel", variant: "outline", onClick: () => this.handleCancel() }), h("verdocs-button", { key: '8b8c437cc11e3f5fcdbb5f0b5faa1c60daee21cb', label: "Done", onClick: () => this.handleDone(), disabled: !this.response }))))));
     }
     static get is() { return "verdocs-kba-dialog"; }
     static get originalStyleUrls() {

package/dist/collection/components/dialogs/verdocs-ok-dialog/verdocs-ok-dialog.js

@@ -27,7 +27,7 @@ export class VerdocsOkDialog {
         }
     }
     render() {
-        return (h(Host, { key: '1077eb562a8fd6bb9b1771d00e3d6bf37682dc68', class: this.closed ? 'closed' : '' }, h("div", { key: '370c8176f1be6c1b7ff44c9ac6d30c162f2c5b10', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: 'e502d4a7fc18fd0bee04ff9679ed345bc5aa93da', class: "dialog" }, h("div", { key: '826089d49b624246e909ff4437bf3d5bd8d8e5d8', class: "heading" }, this.heading), h("div", { key: '8aae0a35156334f6e052d0119d8398c64a627869', class: "content" }, h("div", { key: 'e4740cd967c231c03ffcf37b3c94c474b2760c97', class: "message", innerHTML: this.message }), h("div", { key: 'e0c1419acf0367f2342f8cf7325a5cde7922ac7e', class: "buttons" }, this.showCancel ? h("verdocs-button", { label: "CANCEL", variant: "outline", onClick: () => this.handleCancel() }) : h("div", { style: { display: 'none' } }), h("verdocs-button", { key: '0aaa059fe1071f45f2497963c820e8ab0d74fddd', label: this.buttonLabel, onClick: () => this.handleOk() })))))));
+        return (h(Host, { key: '16757775ee3a09054e3653fb7d12873fc0758e7a', class: this.closed ? 'closed' : '' }, h("div", { key: 'd3f240bbccce82dd4f3e769100ca17612637a0d5', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: 'ec4348a8efc1c95d3df2915ce6e6f4e72c3a6824', class: "dialog" }, h("div", { key: '82b2c477f4eb03c847744f4b1be829909fb286a0', class: "heading" }, this.heading), h("div", { key: 'bdf0962a46f2f9e1b0b8e3d3ec433f1cdc532dff', class: "content" }, h("div", { key: '2adfa55833f384622d4e98496d91786fa9c934e1', class: "message", innerHTML: this.message }), h("div", { key: '89619686b2eefbbb465fa6a86a9da9e360034a9e', class: "buttons" }, this.showCancel ? h("verdocs-button", { label: "CANCEL", variant: "outline", onClick: () => this.handleCancel() }) : h("div", { style: { display: 'none' } }), h("verdocs-button", { key: 'dc298822a062b5687a22cc56adea8b3b202758ad', label: this.buttonLabel, onClick: () => this.handleOk() })))))));
     }
     static get is() { return "verdocs-ok-dialog"; }
     static get originalStyleUrls() {

package/dist/collection/components/dialogs/verdocs-signature-dialog/verdocs-signature-dialog.js

@@ -213,7 +213,7 @@ export class VerdocsSignatureDialog {
     }
      */
     render() {
-        return (h(Host, { key: 'f034c340293126cce5febf238cbcbf69a5134253', onClick: e => this.handleCancel(e) }, h("div", { key: '800bc098a14e777918b3a35292d58d249fe646f9', class: "dialog" }, h("div", { key: 'b50d5c57b8c9ef980f9b146376cd32a68f8e302d', class: "heading" }, "Create Your Signature"), h("div", { key: '82ad4da15b63875bdb376a2e546c06d5fef1eb44', class: "content" }, h("verdocs-text-input", { key: '6df6805d9f761819b190e62a871e3580acce50e7', placeholder: "Full Name...", label: "Full Name", value: this.enteredName, onInput: e => this.handleNameChange(e), onClick: e => e.stopPropagation() }), h("div", { key: 'e471f1b5f703bcfc77326dbcb2ba2bc5499d27a6', 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: 'eaeede6b4d7fa6087fbd49e79a427c36606acb8b', 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: 'f20d4607c71a2a25589cf660aa9882b83b99baa8', class: "buttons" }, h("verdocs-button", { key: '59673617176d5a00809ee27d0015eb2c26b22ced', label: "CANCEL", size: "normal", variant: "outline", onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: 'a27c2f2f68b4aa5291330bcbb5601da22c947e9a', label: "Adopt & Sign", size: "normal", onClick: e => this.handleAdopt(e) }))))));
+        return (h(Host, { key: '53849e64803bef6eb9d350c0b74c31f85ae1d85d', onClick: e => this.handleCancel(e) }, h("div", { key: 'bbf1ac4498157388d44cc41c27dc2183eebaf990', class: "dialog" }, h("div", { key: '0b56bb436a6431af0b61effdffb31133437c12df', class: "heading" }, "Create Your Signature"), h("div", { key: 'a39e8a59f6744ba89ef321ba33dbabd1911fd225', class: "content" }, h("verdocs-text-input", { key: 'bc8d46fece7c7507fc506bd9dcc739eb848f54ea', placeholder: "Full Name...", label: "Full Name", value: this.enteredName, onInput: e => this.handleNameChange(e), onClick: e => e.stopPropagation() }), h("div", { key: '021334bb046539364e2c2c4d8797519a2e38dcb4', class: "as-shown" }, "As shown on driver's license or govt. ID card."), this.fontLoaded ? h("canvas", { ref: el => (this.canvasElement = el) }) : h("div", { style: { display: 'none' } }), h("div", { key: '455dcd5d4a651af7d5cb7375996c063a30ab5f89', class: "disclaimer" }, "By clicking Adopt, I agree that the signature will be the electronic representation of my signature for all purposes when I (or my agent) use them on documents, including legally binding contracts \u2014 just the same as a pen-and-paper signature or initial."), h("div", { key: '78c53b3d62310ce14ee4782f3ebb5bdc17b31fbb', class: "buttons" }, h("verdocs-button", { key: 'be2adff2be29e9fd4f22d2a5665d56330bbcbe09', label: "CANCEL", size: "normal", variant: "outline", onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: 'e7eb8cbd63184fb567c86f6e2cb11e1afa6df036', label: "Adopt & Sign", size: "normal", onClick: e => this.handleAdopt(e) }))))));
     }
     static get is() { return "verdocs-signature-dialog"; }
     static get originalStyleUrls() {

package/dist/collection/components/dialogs/verdocs-upload-dialog/verdocs-upload-dialog.js

@@ -60,7 +60,7 @@ export class VerdocsUploadDialog {
         }
     }
     render() {
-        return (h(Host, { key: '107df7d3d61af8fffdeeb2a5cd9664a283cf8176' }, h("div", { key: 'b44a837d42428a5c8b553ea57fdadb6ee62e9927', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: 'd13b0188f60e71d8ca32a5c5031753a9717f119d', class: "dialog" }, h("div", { key: '7dd24568bfdeed7241ef09f4cc539461564048af', class: "heading" }, "Upload attachment"), this.selectedFiles.length < 1 && this.existingFile && (h(Fragment, { key: '6b7197060ecf23a561518dfa1fe3087c11c7d596' }, h("div", { key: 'f2b801fea0cab95fc5ffd3d5cab5b6788dca7e3b', class: "current-label" }, "Current Attachment"), h("div", { key: '24db98920285515ff2d31e606440abeef1277600', class: "attachments", style: { marginTop: '0' } }, h("div", { key: 'a1432d1e8e914c4e2e251c258f97f20c457292d9', class: "attachment" }, h("div", { key: 'e13b9edaf726666e0ea466ad926e066747728bd9', class: "icon", innerHTML: PaperclipIcon }), h("div", { key: '4ad783ea0df4f711536a02d75d5bb4686e86ac06', class: "name" }, this.existingFile.name), h("div", { key: '555fd7f1e13b4dea753d6235c5acd3886912e19a', class: "icon trash", innerHTML: TrashIcon, onClick: () => this.handleDeleteAttachment() }))))), this.selectedFiles.length < 1 && (h("div", { key: 'ca6ee048c121ab6f1b2ac1348b60ebae299ab41a', class: { 'drop-target': true, 'dragging-over': this.draggingOver }, onDragOver: e => this.handleDragOver(e), onDragLeave: e => this.handleDragLeave(e), onDrop: e => this.handleDrop(e) }, h("p", { key: '77e92f537f2a984d3ec8a784d35ac08c2cf2274a' }, "Drag and drop a ", !!this.existingFile && 'replacement', " here..."), h("p", { key: '72500781ecae42d1249d9b380edec7866f84426f' }, "- or -"), h("verdocs-button", { key: '460e2e6f1629eca3d6f8c395dc33f1a01fb94fcb', label: !!this.existingFile ? 'Replace file...' : 'Select a file...', onClick: () => this.handleSelectFile() }), h("input", { key: 'e4b6ec3c30f11e448f05e21510a29dc52a217f9e', type: "file", ref: el => (this.fileInput = el), style: { display: 'none' }, onChange: () => this.handleFileChange() }))), this.selectedFiles.length > 0 && (h("div", { key: 'beddc71ea828d26528d185447a2ccf1d9111f14c', class: "attachments" }, this.selectedFiles.map((file, index) => (h("div", { class: "attachment" }, h("div", { class: "icon", innerHTML: PaperclipIcon }), h("div", { class: "name" }, file.name), h("div", { class: "icon trash", innerHTML: TrashIcon, onClick: () => this.handleRemoveAttachment(index) })))))), h("div", { key: '16be83d7135c299d3ab35b523611188a0f97edc2', class: "buttons" }, h("verdocs-button", { key: '8b72c9191865278d5f90ad6d61c0bb355ccbc441', label: "Cancel", variant: "outline", onClick: () => this.handleCancel() }), h("verdocs-button", { key: 'f083700863c7839e521eaa8c36940e230e47b9d0', label: "Upload", onClick: () => this.handleDone(), disabled: this.selectedFiles.length < 1 }))))));
+        return (h(Host, { key: '89846e6c89cb8fa7188545e455b98a5b2c99bec3' }, h("div", { key: 'd89b52c26561640dac6ff52ed37db33cdd26e6f9', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: 'd9a6d91ba3c4b0bc87a52ac57c5ff0131ecaba65', class: "dialog" }, h("div", { key: '2b781fd9b65028d14a38bdb88254840340cc7dfb', class: "heading" }, "Upload attachment"), this.selectedFiles.length < 1 && this.existingFile && (h(Fragment, { key: 'fc7b56c80302592ba276c6085ea1a44b09b80c98' }, h("div", { key: '7c31da25b44046d86df74e0caa4c377c7f91521c', class: "current-label" }, "Current Attachment"), h("div", { key: '993a194185ac803c0f55409d0942455656c48288', class: "attachments", style: { marginTop: '0' } }, h("div", { key: 'f73da1c66602b14150afef80c89a32d9061b22c5', class: "attachment" }, h("div", { key: '2715cf8bf9c31b51708d5165b5f4655ca7231540', class: "icon", innerHTML: PaperclipIcon }), h("div", { key: '1a14d15b1bd9dcfbb13f6189b13616ba141ba643', class: "name" }, this.existingFile.name), h("div", { key: '89f95545e497da2bb5f67b5318c61540f3fd2627', class: "icon trash", innerHTML: TrashIcon, onClick: () => this.handleDeleteAttachment() }))))), this.selectedFiles.length < 1 && (h("div", { key: 'cc59dcebfd0ebd6614f11bc4d40f36448f19eef6', class: { 'drop-target': true, 'dragging-over': this.draggingOver }, onDragOver: e => this.handleDragOver(e), onDragLeave: e => this.handleDragLeave(e), onDrop: e => this.handleDrop(e) }, h("p", { key: 'b615d9846d8b785e9e7e9ed93adc97a75ddfe381' }, "Drag and drop a ", !!this.existingFile && 'replacement', " here..."), h("p", { key: '228776a6174a936cbec81be7863586007a8b846a' }, "- or -"), h("verdocs-button", { key: 'a7142011ba18f6b004f1fd8b18afc044ea9d90fe', label: !!this.existingFile ? 'Replace file...' : 'Select a file...', onClick: () => this.handleSelectFile() }), h("input", { key: '82b8661d15cf281c38b2ea5d8e374786fb52c27b', type: "file", ref: el => (this.fileInput = el), style: { display: 'none' }, onChange: () => this.handleFileChange() }))), this.selectedFiles.length > 0 && (h("div", { key: 'b3f8495ed0faef35324745634b07bae41159bb24', class: "attachments" }, this.selectedFiles.map((file, index) => (h("div", { class: "attachment" }, h("div", { class: "icon", innerHTML: PaperclipIcon }), h("div", { class: "name" }, file.name), h("div", { class: "icon trash", innerHTML: TrashIcon, onClick: () => this.handleRemoveAttachment(index) })))))), h("div", { key: '404bd66083a86f2c964e8d6392ef01eab3854e91', class: "buttons" }, h("verdocs-button", { key: '97a0b6b4c4ae1cfa873b2d5f4addbb3676aba99b', label: "Cancel", variant: "outline", onClick: () => this.handleCancel() }), h("verdocs-button", { key: '07dfd4a41d5d1be909baaf5678e231062fe70fc6', label: "Upload", onClick: () => this.handleDone(), disabled: this.selectedFiles.length < 1 }))))));
     }
     static get is() { return "verdocs-upload-dialog"; }
     static get originalStyleUrls() {

package/dist/collection/components/elements/verdocs-quick-functions/verdocs-quick-functions.js

@@ -19,7 +19,7 @@ export class VerdocsQuickFunctions {
         this.createDocument.emit();
     }
     render() {
-        return (h("div", { key: '427a4bfc1c41a292ed25c46ea29f770b6207fecf', class: "container" }, h("p", { key: 'e2e0e046e25b1cc9ee2c9920d33f52a37a703c8b', class: "title" }, "Quick Create"), h("button", { key: '4fd375e82e13f7aeac71d046c065297089805db6', onClick: () => this.handleCreateTemplate(), innerHTML: TemplateIcon }, "Template"), h("button", { key: '4f725f16085dc64adb11ec1efb45433984927b84', onClick: () => this.handleCreateDocument(), innerHTML: DocumentIcon }, "Document")));
+        return (h("div", { key: '7b09da81f9fb67b87e43b00d58230a34ebb95338', class: "container" }, h("p", { key: 'ebb90f14c24ca9764e537931e37b6274019294a4', class: "title" }, "Quick Create"), h("button", { key: '4dc154c1704c20671a0f2ffc1edb5690505ce67f', onClick: () => this.handleCreateTemplate(), innerHTML: TemplateIcon }, "Template"), h("button", { key: '10f9d0350822800a7ed6c1f2bb76c364f9d83110', onClick: () => this.handleCreateDocument(), innerHTML: DocumentIcon }, "Document")));
     }
     static get is() { return "verdocs-quick-functions"; }
     static get originalStyleUrls() {

package/dist/collection/components/elements/verdocs-search-box/verdocs-search-box.js

@@ -41,7 +41,7 @@ export class VerdocsSearchBox {
         }
     }
     render() {
-        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")));
+        return (h("form", { key: '92c3a19d8e2f2d807d028c6bbee7ee1bcb50f51d', onSubmit: e => this.handleSearch(e) }, this.type !== undefined && this.type !== 'all' && (h("span", { key: '3a952a6b3a34a8e1f7c5e8390ed28f7494a932cb', class: "type" }, this.type, "s ", h("button", { key: '4455aa5e73cfd5fbed64954d9cea613a3944b68a', class: "remove", innerHTML: CloseIcon, onClick: () => this.handleClearFilter() }))), h("input", { key: 'ca27055080f3aa6241d3cb6d6572da9015c8690a', 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: '312f07b2c842544e48ac562a1bec9589d569055a', onClick: e => this.handleSearch(e), class: "search" }, h("span", { key: '6e46ec1cd2683027a4c939d35d2741c86d6e70cb', innerHTML: SearchIcon }), "Search")));
     }
     static get is() { return "verdocs-search-box"; }
     static get originalStyleUrls() {

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

@@ -4,7 +4,7 @@ export class VerdocsSearchTabs {
         this.selected = 'all';
     }
     render() {
-        return h("div", { key: '3389871fb01d199ede32a18f3de3f778f2b57ae9' }, "\u00A0");
+        return h("div", { key: 'a67ed4b54a0613731357bfc6f88ecad363dce069' }, "\u00A0");
     }
     static get is() { return "verdocs-search-tabs"; }
     static get originalStyleUrls() {

package/dist/collection/components/envelopes/verdocs-contact-picker/verdocs-contact-picker.css

@@ -17,44 +17,63 @@ verdocs-contact-picker {
   box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.1);
 }
 verdocs-contact-picker form {
-  background-color: #f5f5fa;
+  display: flex;
+  gap: 14px;
+  width: 300px;
   padding: 12px;
   display: flex;
   flex-direction: column;
+  background-color: #f5f5fa;
 }
 verdocs-contact-picker form .row {
+  gap: 8px;
   width: 300px;
   display: flex;
   position: relative;
-  margin: 0 0 20px 0;
+  flex-direction: row;
+  align-items: center;
+}
+verdocs-contact-picker form .row.message {
   flex-direction: column;
+  align-items: flex-start;
 }
 verdocs-contact-picker form .names-row {
+  gap: 8px;
   display: flex;
   flex-direction: row;
-  gap: 8px;
 }
 verdocs-contact-picker form .names-row > input {
-  min-width: 0;
+  width: 110px;
+}
+verdocs-contact-picker form .kba-row {
+  gap: 8px;
+  display: flex;
+  align-items: center;
+  flex-direction: row;
+}
+verdocs-contact-picker form .kba-row > input {
+  width: 110px;
+}
+verdocs-contact-picker form .kba-row verdocs-select-input {
+  margin: 0;
 }
 verdocs-contact-picker form label {
-  display: block;
+  display: flex;
+  flex: 0 0 50px;
   font-size: 14px;
   font-weight: 500;
-  margin: 0 0 4px 0;
   color: #5c6575;
 }
-verdocs-contact-picker form .label-with-icon {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
+verdocs-contact-picker form .row.message label {
+  flex: 0;
 }
-verdocs-contact-picker form .label-with-icon verdocs-help-icon svg {
-  transform: scale(0.8);
+verdocs-contact-picker form .row.message input {
+  width: 100%;
 }
 verdocs-contact-picker form input {
+  flex: 1;
   border: none;
-  font-size: 18px;
+  font-size: 16px;
   padding: 3px 6px 3px 0;
   background: transparent;
   border-bottom: 1px solid #33364b;

package/dist/collection/components/envelopes/verdocs-contact-picker/verdocs-contact-picker.js

@@ -1,5 +1,5 @@
 import { formatFullName, VerdocsEndpoint } from "@verdocs/js-sdk";
-import { h } from "@stencil/core";
+import { h, Fragment } from "@stencil/core";
 import { convertToE164 } from "../../../utils/utils";
 const messageIcon = '<svg focusable="false" viewBox="0 0 24 24"><path d="M20 2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-2 12H6v-2h12v2zm0-3H6V9h12v2zm0-3H6V6h12v2z"></path></svg>';
 // const delegateIcon =
@@ -7,10 +7,10 @@ const messageIcon = '<svg focusable="false" viewBox="0 0 24 24"><path d="M20 2H4
 const kbaIcon = '<svg focusable="false" viewBox="0 0 24 24"><path fill-rule="evenodd" d="M4.5 3.75a3 3 0 0 0-3 3v10.5a3 3 0 0 0 3 3h15a3 3 0 0 0 3-3V6.75a3 3 0 0 0-3-3h-15Zm4.125 3a2.25 2.25 0 1 0 0 4.5 2.25 2.25 0 0 0 0-4.5Zm-3.873 8.703a4.126 4.126 0 0 1 7.746 0 .75.75 0 0 1-.351.92 7.47 7.47 0 0 1-3.522.877 7.47 7.47 0 0 1-3.522-.877.75.75 0 0 1-.351-.92ZM15 8.25a.75.75 0 0 0 0 1.5h3.75a.75.75 0 0 0 0-1.5H15ZM14.25 12a.75.75 0 0 1 .75-.75h3.75a.75.75 0 0 1 0 1.5H15a.75.75 0 0 1-.75-.75Zm.75 2.25a.75.75 0 0 0 0 1.5h3.75a.75.75 0 0 0 0-1.5H15Z" clip-rule="evenodd" /></svg>';
 const addrBookIcon = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-book-user"><path d="M15 13a3 3 0 1 0-6 0"/><path d="M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20"/><circle cx="12" cy="8" r="2"/></svg>`;
 /**
- * Displays a contact picker suitable for filling out Recipient objects when sending Documents.
+ * Display a contact picker suitable for filling out Recipient objects when sending Envelopes.
  *
  * This picker can also be integrated with a backend to provide contact list / suggestion / address-book style behavior. As the
- * user interacts with the component, the text entered in the name field is sent back to the parent via the `searchContacts` event.
+ * user interacts with the component, the text entered in the name fields is sent back to the parent via the `searchContacts` event.
  * The parent can use that text as a query string to call a backend to obtain appropriate contacts to show. This list may also be
  * hard-coded ahead of time to provide the user with smart suggestions on initial display, such as "Recently Used" contacts, or
  * to always display the user's own contact record.
@@ -67,15 +67,6 @@ export class VerdocsContactPicker {
         this.last_name = e.target.value;
         (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit({ query: this.last_name });
     }
-    handleEmailChange(e) {
-        this.email = e.target.value;
-    }
-    handlePhoneChange(e) {
-        this.phone = convertToE164(e.target.value);
-    }
-    handleMessageChange(e) {
-        this.message = e.target.value;
-    }
     handleCancel(e) {
         var _a;
         e.stopPropagation();
@@ -106,26 +97,26 @@ export class VerdocsContactPicker {
     // The reason for the random names/IDs is to disable browser autocomplete. We set the autocomplete tags but many browsers ignore them
     // and show a duplicate autocomplete picker on top of our own.
     render() {
-        return (h("form", { key: 'dd02e23758d334495edb642f0f1513889eca5bbe', onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("div", { key: 'f8594524ea492993227b07e0e8d5a71c847f1b64', class: "row" }, h("label", { key: 'fbbef02b5e11880c7c104b96de3a17537bc7ff8c', htmlFor: this.nameFieldId }, "Name:"), h("div", { key: '50d4ff03c47eb77865de05ffd247e7684e2cdbcf', class: "names-row" }, h("input", { key: 'dc52d17011643cbb25f9e5129aadacd1104365a9', id: this.firstNameFieldId, name: this.firstNameFieldId, type: "text", "data-lpignore": "true", autocomplete: "blocked", value: this.first_name, placeholder: "First Name...", onFocus: () => { var _a; return (this.showSuggestions = ((_a = this.contactSuggestions) === null || _a === void 0 ? void 0 : _a.length) > 0); }, onInput: e => this.handleFirstNameChange(e) }), h("input", { key: 'f46f41f7eb915569ce6e202667873a0309d98d16', id: this.lastNameFieldId, name: this.lastNameFieldId, type: "text", "data-lpignore": "true", autocomplete: "blocked", value: this.last_name, placeholder: "Last Name...", onFocus: () => (this.showSuggestions = false), onInput: e => this.handleLastNameChange(e) })), this.showSuggestions && (h("div", { key: 'b82ecccbf9fa1172af45f33595337a73589ac482', class: "dropdown" }, this.contactSuggestions
+        return (h("form", { key: '8c7cb46336302d309187ca68d7e38ebb3d001468', onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("div", { key: '8bc7c876bb89ee84dc14978560c6198d31983261', class: "row" }, h("label", { key: 'b57ac6d694661a48397afc6ab37fbf5cbca8cbc6', htmlFor: this.nameFieldId }, "Name:"), h("div", { key: '197fbb1e998f52d0df3fe9040fd5d9d640b0237a', class: "names-row" }, h("input", { key: '343aa3e3c8bb31edfc43c4bd51bed1928ea29d49', id: this.firstNameFieldId, name: this.firstNameFieldId, type: "text", "data-lpignore": "true", autocomplete: "blocked", value: this.first_name, placeholder: "First...", onFocus: () => { var _a; return (this.showSuggestions = ((_a = this.contactSuggestions) === null || _a === void 0 ? void 0 : _a.length) > 0); }, onInput: e => this.handleFirstNameChange(e) }), h("input", { key: '78e830e80650f52d72e5c35523fa111df228c86b', id: this.lastNameFieldId, name: this.lastNameFieldId, type: "text", "data-lpignore": "true", autocomplete: "blocked", value: this.last_name, placeholder: "Last...", onFocus: () => (this.showSuggestions = false), onInput: e => this.handleLastNameChange(e) })), this.showSuggestions && (h("div", { key: '9b35e34eba14d6ff17c29b7bb334e5a5d8080595', class: "dropdown" }, this.contactSuggestions
             .filter(suggestion => !this.first_name || suggestion.first_name.toLowerCase().includes(this.first_name.toLowerCase()))
             .map(suggestion => {
             var _a;
             return (h("div", { key: (_a = suggestion.id) !== null && _a !== void 0 ? _a : suggestion.email, class: "suggestion", onClick: e => this.handleSelectSuggestion(e, suggestion) }, suggestion.picture ? h("img", { alt: "Avatar", class: "avatar", src: suggestion.picture }) : h("div", { class: "avatar", innerHTML: addrBookIcon }), h("div", { class: "details" }, h("div", { class: "name" }, formatFullName(suggestion)), suggestion.email && h("div", { class: "destination" }, suggestion.email), suggestion.phone && h("div", { class: "destination" }, suggestion.phone))));
-        })))), h("div", { key: '7a3fc3c98c19a4a1bb07a6914f35eba61132294d', class: "row" }, h("label", { key: 'b2a589aae874fe69b8ae50569e14c6005344d8f3', htmlFor: this.emailFieldId }, "Email:"), h("input", { key: '39ee39af447b65d543492ebac6d199985aada563', id: this.emailFieldId, name: this.emailFieldId, type: "text", "data-lpignore": "true", autoComplete: "blocked", value: this.email, placeholder: "Email Address...", onFocus: () => (this.showSuggestions = false), onInput: e => this.handleEmailChange(e) })), h("div", { key: 'c7420ac25ad40fb99a40212266efa3b564058b1d', class: "row" }, h("label", { key: 'bd4b4eaf87be10f5a34186b27fd4ee8239cfacc9', htmlFor: this.phoneFieldId }, "Phone:"), h("input", { key: 'abfa297fa18f57ef20313b1ac9e9cc866f0e37e9', id: this.phoneFieldId, name: this.phoneFieldId, type: "text", "data-lpignore": "true", autoComplete: "blocked", value: this.phone, placeholder: "Phone Number...", onFocus: () => (this.showSuggestions = false), onInput: e => this.handlePhoneChange(e) })), this.showKba && (h("div", { key: 'bea4383cd29e9c43b883c29b55f0e6cacf89c63f', class: "row" }, h("div", { key: '8ebacef0e2786a5a141ebc338fcaa062a25c5090', class: "label-with-icon" }, h("label", { key: '74c32c83aac8d0400726f4ef5d95c60b3eb12c99' }, "KBA:"), h("verdocs-help-icon", { key: 'be3777686a2a9d51ff91205f49e68b17d6fee18c', text: "Knowledge-Based Authentication adds additional authentication for this user either via a simple PIN code or full address validation. NOTE: There may be a fee for using this feature." })), h("verdocs-select-input", { key: '35a7918e94a09d78c5c5a43992bea92e19fd406b', value: this.kbaMethod, onInput: (e) => (this.kbaMethod = e.target.value), options: [
+        })))), h("div", { key: '4e37f340b40e14e1469742856b9d9f2ea79add97', class: "row" }, h("label", { key: '0778e1b56c175a1a5077726fbba30280e5052773', htmlFor: this.emailFieldId }, "Email:"), h("input", { key: '9f6806efb77821579c5eee7bf020e0219212761a', id: this.emailFieldId, name: this.emailFieldId, type: "text", "data-lpignore": "true", autoComplete: "blocked", value: this.email, placeholder: "Email address...", onFocus: () => (this.showSuggestions = false), onInput: (e) => (this.email = e.target.value) })), h("div", { key: '6e99f4b3a76f5696f39d721784be7ca0350a42bb', class: "row" }, h("label", { key: 'cdbfcb45cb531b203d4417f21daffe82a2b4974a', htmlFor: this.phoneFieldId }, "Phone:"), h("input", { key: '384b2d948efacbdbb44bad6e8da4174035a63ad3', id: this.phoneFieldId, name: this.phoneFieldId, type: "text", "data-lpignore": "true", autoComplete: "blocked", value: this.phone, placeholder: "Phone (SMS)...", onFocus: () => (this.showSuggestions = false), onInput: (e) => convertToE164(e.target.value) })), this.showKba && (h(Fragment, { key: '3824ab85ac446ee579279c034d44c9c7d9f80f44' }, h("div", { key: '253b5ce372f405f20dda62f889eb791dbc958d8c', class: "kba-row" }, h("label", { key: '6714f992e2f7710d1fe93ed34596f99c54d8e9b0' }, "KBA:"), h("verdocs-select-input", { key: '06107cc54709178c007a5416d0c8dcf9c206a1ca', value: this.kbaMethod, onInput: (e) => (this.kbaMethod = e.target.value), options: [
                 { label: 'None', value: '' },
                 { label: 'PIN Code', value: 'pin' },
                 { label: 'Full Verification', value: 'kba' },
-            ] }), this.kbaMethod === 'pin' && (h("input", { key: 'aeefe336a8461aa1ac41d3be0494f51b858b3810', id: "verdocs-pin-code", name: "verdocs-pin-code", type: "text", "data-lpignore": "true", autocomplete: "blocked", value: this.pinCode, placeholder: "KBA PIN Code...", onFocus: () => (this.showSuggestions = false), onInput: e => this.handleMessageChange(e) })))), this.showMessage && (h("div", { key: '1c55a0f11426dbcf82ced0fe5291fcb14a70bb2f', class: "row" }, h("label", { key: 'c2c7f9dd66ed8fd9dae52175cba6e9b575aa64b5', htmlFor: "verdocs-contact-picker-message" }, "Message:"), h("input", { key: 'c63897c136a04b3feba02b6dde46d7f74c97f330', id: "verdocs-contact-picker-message", name: "verdocs-contact-picker-message", type: "text", "data-lpignore": "true", autocomplete: "blocked", value: this.message, placeholder: "Invitation Message...", onFocus: () => (this.showSuggestions = false), onInput: e => this.handleMessageChange(e) }))), h("div", { key: '7e0d6e9b519a51988711cfca0f1392b39ae4eec1', class: "buttons" }, h("verdocs-toggle-button", { key: '3cae0b84394a5c8516599af788e2cb0568235582', icon: kbaIcon, size: "small", active: this.showKba, onToggle: e => {
+            ] }), h("div", { key: '2d898124db289daada4f174e3fe4b557716ef563', style: { flex: '1' } }), h("verdocs-help-icon", { key: '17c58ed5bedaffa1a0bc1f72f7830076dd46502e', text: "Knowledge-Based Authentication adds additional authentication for this user either via a simple PIN code or full address validation. NOTE: There may be a fee for using this feature." })), this.kbaMethod === 'pin' && (h("div", { key: 'caf64fae166a136aebfcce7ed96bfe015a3cdeb4', class: "row pin-code" }, h("input", { key: '545918a43fbb7464dcf5f1aa19a7654899071017', id: "verdocs-pin-code", name: "verdocs-pin-code", type: "text", "data-lpignore": "true", autocomplete: "blocked", value: this.pinCode, placeholder: "KBA PIN Code...", onFocus: () => (this.showSuggestions = false), onInput: (e) => (this.pinCode = e.target.value) }))))), this.showMessage && (h("div", { key: 'a747e2260ae8224b5b871ddbf1e8423d0da5e0be', class: "row message" }, h("label", { key: '2ff918a32677e81887639120cc5ab09be09e27f3', htmlFor: "verdocs-contact-picker-message" }, "Message:"), h("input", { key: '9c4c90117ca81c97f359e4b66dfde17d77506b98', id: "verdocs-contact-picker-message", name: "verdocs-contact-picker-message", type: "text", "data-lpignore": "true", autocomplete: "blocked", value: this.message, placeholder: "Message shown in invitation...", onFocus: () => (this.showSuggestions = false), onInput: (e) => (this.message = e.target.value) }))), h("div", { key: '3c043c21f0fd8e202de82782ed5d9beec1fa9f2f', class: "buttons" }, h("verdocs-toggle-button", { key: 'e4e7261482091d4ba73ca11ee0f5b1f738562339', icon: kbaIcon, size: "small", active: this.showKba, onToggle: e => {
                 this.showKba = e.detail.active;
                 if (!e.detail.active) {
                     this.pinCode = '';
                     this.kbaMethod = '';
                 }
                 this.showSuggestions = false;
-            } }), h("verdocs-toggle-button", { key: '045544245ba967bd6ee43cb25a5fb8f2c9013da9', icon: messageIcon, size: "small", active: this.showMessage, onToggle: e => {
+            } }), h("verdocs-toggle-button", { key: 'd4fb36d6031a641bf056ee8ef022665bd1655e27', icon: messageIcon, size: "small", active: this.showMessage, onToggle: e => {
                 this.showMessage = e.detail.active;
                 this.showSuggestions = false;
-            } }), h("div", { key: '1363f8353900490ac9a98ccd1da36831b9c06469', class: "flex-fill" }), h("verdocs-button", { key: '5cf40a9d890ff67a96dff5913b76eb603e4e1702', variant: "outline", label: "Cancel", size: "small", onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: 'bfe86cdc15de884189f1ae342bef1be2f7887221', label: "OK", size: "small", onClick: e => this.handleSubmit(e) }))));
+            } }), h("div", { key: '954cbf03867afb74ba9589f0c817541e410dd20c', class: "flex-fill" }), h("verdocs-button", { key: '1b02d3280ab090332a31cd200eed4f2d76d3df4e', variant: "outline", label: "Cancel", size: "small", onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: '6213ec5d1b337771d53ab8daee0818662666df9f', label: "OK", size: "small", onClick: e => this.handleSubmit(e) }))));
     }
     static get is() { return "verdocs-contact-picker"; }
     static get originalStyleUrls() {

package/dist/collection/components/envelopes/verdocs-envelope-document-page/verdocs-envelope-document-page.js

@@ -75,7 +75,7 @@ export class VerdocsEnvelopeDocumentPage {
     }
     render() {
         const height = `${this.renderedHeight}px`;
-        return (h(Host, { key: 'c047ed0efbc74b5981dbb631999f33af262559f7', id: `${this.containerId}`, style: { height, flex: `0 0 ${height}` } }, this.layers.map(layer => layer.type === 'div' ? (h("div", { class: "verdocs-envelope-document-page-layer", id: `${this.containerId}-${layer.name}`, style: { height } })) : this.pageDisplayUri ? (h("img", { class: "verdocs-envelope-document-page-layer img", id: `${this.containerId}-${layer.name}`, src: this.pageDisplayUri, alt: `Page ${this.pageNumber}`, "aria-hidden": true, loading: "lazy", onLoad: (e) => {
+        return (h(Host, { key: 'db47c26f1d1ad9d72d4a18238b0ab244e68f2f76', id: `${this.containerId}`, style: { height, flex: `0 0 ${height}` } }, this.layers.map(layer => layer.type === 'div' ? (h("div", { class: "verdocs-envelope-document-page-layer", id: `${this.containerId}-${layer.name}`, style: { height } })) : this.pageDisplayUri ? (h("img", { class: "verdocs-envelope-document-page-layer img", id: `${this.containerId}-${layer.name}`, src: this.pageDisplayUri, alt: `Page ${this.pageNumber}`, "aria-hidden": true, loading: "lazy", onLoad: (e) => {
                 // Note that all we really care about is the aspect ratio. We track the natural Width and Height but they aren't really that
                 // useful as individual values. The image will already have been scaled down to fit a DIV for display (100%, auto height).
                 // Builder places fields offset into the rendered display area, not the original document's dimensions. So its X/Y values

package/dist/collection/components/envelopes/verdocs-envelope-sidebar/verdocs-envelope-sidebar.js

@@ -128,6 +128,7 @@ export class VerdocsEnvelopeSidebar {
             this.store = await getEnvelopeStore(this.endpoint, this.envelopeId, true);
             this.sortEnvelopeRecipients();
             this.loading = false;
+            this.panelOpen = false;
             (_a = this.envelopeUpdated) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, envelope: (_b = this.store) === null || _b === void 0 ? void 0 : _b.state, event: 'canceled' });
         })
             .catch(e => {
@@ -281,11 +282,10 @@ export class VerdocsEnvelopeSidebar {
         this.updatingReminders = true;
         updateEnvelope(this.endpoint, this.envelopeId, { initial_reminder, followup_reminders })
             .then(envelope => {
-            var _a, _b, _c, _d;
             console.log('Updated', envelope);
             updateStoreEnvelope(this.store, envelope);
-            this.initialReminder = (_b = (_a = this.store) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.initial_reminder;
-            this.followupReminders = (_d = (_c = this.store) === null || _c === void 0 ? void 0 : _c.state) === null || _d === void 0 ? void 0 : _d.followup_reminders;
+            this.initialReminder = envelope.initial_reminder;
+            this.followupReminders = envelope.followup_reminders;
             this.remindersEnabled = !!envelope.initial_reminder;
             this.updatingReminders = false;
         })
@@ -307,7 +307,6 @@ export class VerdocsEnvelopeSidebar {
         const isEnvelopeOwner = userIsEnvelopeOwner(this.endpoint.profile, this.store.state);
         const historyEntries = this.prepareHistoryEntries();
         const functionsDisabled = ((_b = (_a = this.store) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.status) !== 'pending' && ((_d = (_c = this.store) === null || _c === void 0 ? void 0 : _c.state) === null || _d === void 0 ? void 0 : _d.status) !== 'in progress';
-        console.log('re', this.remindersEnabled);
         return (h(Host, { class: this.panelOpen ? 'open' : '' }, h("div", { class: "side-buttons" }, h("button", { class: this.activeTab === 1 ? 'active' : '', onClick: () => this.setTab(1), innerHTML: InformationCircle }), h("button", { class: this.activeTab === 2 ? 'active' : '', onClick: () => this.setTab(2), innerHTML: Users }), h("button", { class: this.activeTab === 3 ? 'active' : '', onClick: () => this.setTab(3), innerHTML: ClipboardDocuments })), this.activeTab === 1 && (h("div", { class: "content" }, h("div", { class: "title" }, "Details"), h("div", { class: "label" }, "Envelope ID"), h("div", { class: "value" }, (_f = (_e = this.store) === null || _e === void 0 ? void 0 : _e.state) === null || _f === void 0 ? void 0 : _f.id), h("div", { class: "label" }, "Date Created"), h("div", { class: "value" }, format(new Date((_h = (_g = this.store) === null || _g === void 0 ? void 0 : _g.state) === null || _h === void 0 ? void 0 : _h.created_at), FORMAT_TIMESTAMP)), h("div", { class: "label" }, "Last Modified"), h("div", { class: "value" }, format(new Date((_k = (_j = this.store) === null || _j === void 0 ? void 0 : _j.state) === null || _k === void 0 ? void 0 : _k.updated_at), FORMAT_TIMESTAMP)), h("div", { class: "label" }, "Status"), h("div", { class: "value" }, capitalize((_m = (_l = this.store) === null || _l === void 0 ? void 0 : _l.state) === null || _m === void 0 ? void 0 : _m.status)), h("div", { class: "label" }, "Owner ID"), h("div", { class: "value" }, (_p = (_o = this.store) === null || _o === void 0 ? void 0 : _o.state) === null || _p === void 0 ? void 0 : _p.profile_id), h("div", { class: "label" }, "Owner Name"), h("div", { class: "value" }, formatFullName((_r = (_q = this.store) === null || _q === void 0 ? void 0 : _q.state) === null || _r === void 0 ? void 0 : _r.profile)), h("div", { class: "label" }, "Owner Email"), h("div", { class: "value" }, (_u = (_t = (_s = this.store) === null || _s === void 0 ? void 0 : _s.state) === null || _t === void 0 ? void 0 : _t.profile) === null || _u === void 0 ? void 0 : _u.email))), this.activeTab === 2 && (h("div", { class: "content" }, h("div", { class: "title" }, "Recipients"), (_w = (_v = this.store) === null || _v === void 0 ? void 0 : _v.state) === null || _w === void 0 ? void 0 :
             _w.recipients.map((recipient, index) => {
                 const canGetInPersonLink = recipient.status !== 'submitted' && recipient.status !== 'canceled' && recipient.status !== 'declined';
@@ -320,10 +319,10 @@ export class VerdocsEnvelopeSidebar {
                         // TODO: Details dialog
                         // {id:'details',label: 'View Details'},
                     ] }))), h("dic", { class: "recipient-content" }, h("div", { class: "recipient-name" }, fullName), h("div", { class: "recipient-name" }, recipient.email), h("div", { class: "recipient-name" }, recipient.phone))));
-            }), isEnvelopeOwner && (h("div", { class: "reminders" }, h("div", { class: "form-row" }, h("div", { class: "reminders-label" }, "Reminders"), h("verdocs-switch", { disabled: this.updatingReminders, checked: this.remindersEnabled, onCheckedChange: () => this.handleToggleReminders() })), this.remindersEnabled && (h(Fragment, null, h("div", { class: "form-row" }, h("div", { class: "form-label" }, "Initial Reminder:"), h("verdocs-text-input", { placeholder: "In hours...", disabled: this.updatingReminders, value: String(Math.floor(this.initialReminder / MS_PER_HOUR)), onBlur: (e) => {
+            }), isEnvelopeOwner && (h("div", { class: "reminders" }, h("div", { class: "form-row" }, h("div", { class: "reminders-label" }, "Reminders"), h("verdocs-switch", { disabled: functionsDisabled || this.updatingReminders, checked: this.remindersEnabled, onCheckedChange: () => this.handleToggleReminders() })), this.remindersEnabled && (h(Fragment, null, h("div", { class: "form-row" }, h("div", { class: "form-label" }, "Initial Reminder:"), h("verdocs-text-input", { placeholder: "In hours...", disabled: functionsDisabled || this.updatingReminders, value: String(Math.floor(this.initialReminder / MS_PER_HOUR)), onBlur: (e) => {
                 this.initialReminder = Number(e.target.value) * MS_PER_HOUR;
                 this.handleSetReminders(this.initialReminder, this.followupReminders);
-            } })), h("div", { class: "form-row" }, h("div", { class: "form-label" }, "Follow-up Reminders:"), h("verdocs-text-input", { placeholder: "In hours...", disabled: this.updatingReminders, value: String(Math.floor(this.followupReminders / MS_PER_HOUR)), onBlur: (e) => {
+            } })), h("div", { class: "form-row" }, h("div", { class: "form-label" }, "Follow-up Reminders:"), h("verdocs-text-input", { placeholder: "In hours...", disabled: functionsDisabled || this.updatingReminders, value: String(Math.floor(this.followupReminders / MS_PER_HOUR)), onBlur: (e) => {
                 this.followupReminders = Number(e.target.value) * MS_PER_HOUR;
                 this.handleSetReminders(this.initialReminder, this.followupReminders);
             } })), h("div", { class: "form-row" }, h("div", { class: "form-label" }, "Next Reminder:"), h("div", { style: { color: '#dddddd' } }, format(new Date((_y = (_x = this.store) === null || _x === void 0 ? void 0 : _x.state) === null || _y === void 0 ? void 0 : _y.next_reminder), 'P p'))))))), isEnvelopeOwner && (h("verdocs-button", { class: "manage-recipients-button", variant: "standard", label: "Cancel Envelope", onClick: () => (this.showCancelDialog = !functionsDisabled), disabled: functionsDisabled })))), this.activeTab === 3 && (h("div", { class: "content" }, h("div", { class: "title" }, "History"), historyEntries.map(entry => (h("div", { class: "history-entry" }, h("div", { class: "activity-icon", innerHTML: ActivityIcons[entry.icon] || entry.icon }), h("div", { class: "activity-details" }, h("div", { class: "activity-text" }, entry.message), h("div", { class: "activity-date" }, format(entry.date, FORMAT_TIMESTAMP)))))))), this.showRecipientDialog && (h("verdocs-envelope-recipient-link", { envelopeId: this.envelopeId, roleName: this.showRecipientDialog, onNext: () => (this.showRecipientDialog = '') })), this.showCancelDialog && (h("verdocs-ok-dialog", { heading: "Cancel Envelope?", message: 'Are you sure you want to cancel this Envelope? This action cannot be undone.', onNext: () => {

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

@@ -191,18 +191,18 @@ export class VerdocsEnvelopesList {
         });
     }
     render() {
-        return (h(Host, { key: '7a00f20ae5c31b9a633d88c21762c3562876fe78' }, h("div", { key: 'a5124808b0ddd25db268f062e41895306dc29aaf', class: "header" }, h("div", { key: '1139d8453c19f0e80a7dccf3be06caf14080709f', class: "filter" }, h("verdocs-text-input", { key: '765d08809106e75b9a65aaf1c2dd231613d954d2', id: "verdocs-filter-name", value: this.match, clearable: true, autocomplete: "off", placeholder: "Filter by Name, Recipient, or Field...", onFocusout: (e) => {
+        return (h(Host, { key: '9f93a9c82a5dd9cac5d1457b59f27ac2a64e33c4' }, h("div", { key: 'e279d53d83511a338250d6d57e431a4662a2ac2f', class: "header" }, h("div", { key: '6dec54707d214be5b81711b2ebb9a069aabea3aa', class: "filter" }, h("verdocs-text-input", { key: 'f0f7a991581818cf3ae936b1f82004df68a90762', id: "verdocs-filter-name", value: this.match, clearable: true, autocomplete: "off", placeholder: "Filter by Name, Recipient, or Field...", onFocusout: (e) => {
                 var _a;
                 // We don't locally filter envelopes because there are too many fields to match against efficiently.
                 this.match = e.target.value.trim();
                 (_a = this.changeMatch) === null || _a === void 0 ? void 0 : _a.emit(this.match);
-            } })), h("verdocs-quick-filter", { key: 'bd3ed994b57bfda8134ad9d98ceb92384c535074', label: "View", value: this.view, options: ViewFilters, onOptionSelected: e => {
+            } })), h("verdocs-quick-filter", { key: 'e05c6b326ae1ea63e642dd9c884fd1a10a294da5', label: "View", value: this.view, options: ViewFilters, onOptionSelected: e => {
                 this.view = e.detail.value;
-            } }), this.view === 'all' && (h("verdocs-quick-filter", { key: '472cc15ce0d48b0c71a280e150f854441e8c0548', label: "Status", value: this.status, options: StatusFilters, onOptionSelected: e => {
+            } }), this.view === 'all' && (h("verdocs-quick-filter", { key: '3caa255a74d88a9da45eca2f03522cf2b3c0e7ff', label: "Status", value: this.status, options: StatusFilters, onOptionSelected: e => {
                 this.status = e.detail.value;
-            } })), this.view === 'all' && (h("verdocs-quick-filter", { key: '8913c4ef0c4e5222d116e9baea54066d211e10c2', label: "Sort By", value: this.sort, options: SortFilters, onOptionSelected: e => {
+            } })), this.view === 'all' && (h("verdocs-quick-filter", { key: '3e36f81be8ad759c770e7261c41f5fdb0d3b371f', label: "Sort By", value: this.sort, options: SortFilters, onOptionSelected: e => {
                 this.sort = e.detail.value;
-            } })), this.loading && h("verdocs-spinner", { key: '191a574650de5061076f939b5ba0657d39dacda0', mode: "dark", size: 24 }), h("div", { key: 'dec432a7d53973a5a5152e1162af3d677af81e1a', style: { display: 'flex', flex: '1' } }), this.selectedEnvelopes.length > 0 && h("verdocs-button", { key: 'ae7f5be9813298b885b1aa0940c614e44af85d85', label: `Download (${this.selectedEnvelopes.length})`, onClick: () => this.handleDownload() })), this.envelopes.map(envelope => {
+            } })), this.loading && h("verdocs-spinner", { key: '441f2c0e3efeb105c61542c2e057c64720423082', mode: "dark", size: 24 }), h("div", { key: '80a6d1fad113d168bc68cabcf60d2e4517e6c2a1', style: { display: 'flex', flex: '1' } }), this.selectedEnvelopes.length > 0 && h("verdocs-button", { key: 'e02ed6005bbea2dc6c7687724e995c338df98d45', label: `Download (${this.selectedEnvelopes.length})`, onClick: () => this.handleDownload() })), this.envelopes.map(envelope => {
             var _a;
             const recipientsWithActions = getRecipientsWithActions(envelope);
             const userCanCancel = userCanCancelEnvelope(this.endpoint.profile, envelope);
@@ -243,7 +243,7 @@ export class VerdocsEnvelopesList {
                             break;
                     }
                 } }))));
-        }), !this.initiallyLoaded && (h("div", { key: 'c897aa3a14659ce023811609d4e230806c29c470', style: { width: '100%' } }, integerSequence(0, this.rowsPerPage).map(() => (h("div", { class: "envelope-placeholder" }))))), this.initiallyLoaded && !this.envelopes.length && h("div", { key: 'ff60d1d2346009b459fa2ada94e7fdffe9e027e5', class: "empty-text" }, "No matching envelopes found. Please adjust your filters and try again."), this.initiallyLoaded && this.envelopes.length && this.showPagination ? (h("div", { style: { marginTop: '20px' } }, h("verdocs-pagination", { selectedPage: this.selectedPage, perPage: this.rowsPerPage, itemCount: this.count, onSelectPage: e => {
+        }), !this.initiallyLoaded && (h("div", { key: 'f35a7cf0c691d395bd03fc16e6819d773f234eec', style: { width: '100%' } }, integerSequence(0, this.rowsPerPage).map(() => (h("div", { class: "envelope-placeholder" }))))), this.initiallyLoaded && !this.envelopes.length && h("div", { key: '6002b381ea34731dedff4c790c63005071732659', class: "empty-text" }, "No matching envelopes found. Please adjust your filters and try again."), this.initiallyLoaded && this.envelopes.length && this.showPagination ? (h("div", { style: { marginTop: '20px' } }, h("verdocs-pagination", { selectedPage: this.selectedPage, perPage: this.rowsPerPage, itemCount: this.count, onSelectPage: e => {
                 this.selectedPage = e.detail.selectedPage;
             } }))) : (h("div", null))));
     }

package/dist/collection/components/envelopes/verdocs-status-indicator/verdocs-status-indicator.js

@@ -238,11 +238,11 @@ export class VerdocsStatusIndicator {
         }
         const icon = this.getStatusIcon(status);
         const statusMessage = this.getStatusMessage(status);
-        return (h(Host, { key: '96ed56f80adc3b72cffac7ad61c987d61ecf97fb', 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: '25fadd6d77be693e57cb2fb5a09a31eb63646570', 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: '74fd0d79d0c321c186ba1a9fa5b1fe3798d7cac9', class: "icon", innerHTML: icon }), h("span", { key: 'a0a44d7acf6cb17ef1dbf210aaef25e79aaa7247', class: "content" }, statusMessage), h("div", { key: 'a367387674a47bd36568d557cd4c8f1d1defae1b', class: "detail-panel", ref: el => (this.detailPanel = el) }, h("div", { key: 'cfaef5f02fdb7c6a63535d537093a9e1b5e0219e', 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: 'aa78dca223dc4db4a1f89cf7978064553d7abea3', class: "icon", innerHTML: icon }), h("span", { key: '84f93dbd4c9cbff90abdc1dfeaef46cb592151b5', class: "content" }, statusMessage), h("div", { key: 'dccc1698ae3548ee0aa1a8e01a2fa0bfdabe3737', class: "detail-panel", ref: el => (this.detailPanel = el) }, h("div", { key: '129b157b29e1a7b610244b4ec02f7af59221ec8f', id: `${this.containerId}` }), this.recipientStatusIcons.map(icon => (h("span", { innerHTML: icon.icon, style: { position: 'absolute', top: `${icon.y}px`, left: `${icon.x}px` } }))))));
     }
     static get is() { return "verdocs-status-indicator"; }
     static get originalStyleUrls() {

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

@@ -12,7 +12,7 @@ export class VerdocsTemplateCard {
     }
     render() {
         var _a, _b, _c, _d;
-        return (h(Host, { key: '70fdd3656af0e09d195fe642617864f9e3f040d8' }, h("span", { key: '1f54e749222616d176cd423f46d41e5e0bf43f96', class: "name" }, this.template.name), h("span", { key: '9412db1396f31902d263223bd6eddec6a4c24566', class: "org-name" }, ((_a = this.template.organization) === null || _a === void 0 ? void 0 : _a.name) || 'Public'), h("hr", { key: '48db04497600cdc36a815aadb8880e43444984b9' }), h("div", { key: 'b2076c53a8490886e781fb518902189c0ab15ed4', class: "controls" }, h("div", { key: 'adf1aaeda56bdbbb9fadc781c586ecbd2f5ac668', class: "control" }, h("span", { key: '5489262deab391195f56d4a2291ca9ce4a42beb5', class: "icon", innerHTML: StarIcon }), h("span", { key: 'edc26b6674f6c007a37cbd0ea3274629ffec6bfc', class: "value" }, this.template.star_counter)), h("div", { key: '110575e5f51ce9b44de8bc2856b40949fda7b044', class: "control secondary" }, h("span", { key: 'af5e59792c2745fb13c4267fbab9753c9cc4793d', class: "icon", innerHTML: PagesIcon }), h("span", { key: '229253b847711aed2021f63f2d59b3a6f5de70a1', 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: 'ffbe166e6d627cb6404b8245829e3530b30b1ed1', class: "control secondary" }, h("span", { key: '70b5ec65e32b455494458844184bdd296d0a53d7', class: "icon", innerHTML: EmailIcon }), h("span", { key: '9148860c1252f2f307e9e018d583fbe745264c92', class: "value" }, this.template.counter)), h("span", { key: '62876a7d469ef34274efdff117aaf8b93e89d5f4', class: "additional-controls", innerHTML: ActionsIcon }))));
+        return (h(Host, { key: '2414caafbeb66be4f7418b22ab9766aaea18de4e' }, h("span", { key: '8b571bc3f50445e4a4413821ee4ade2c75940600', class: "name" }, this.template.name), h("span", { key: '77d3c36194959ca19928cb880dd2144c30079f5e', class: "org-name" }, ((_a = this.template.organization) === null || _a === void 0 ? void 0 : _a.name) || 'Public'), h("hr", { key: '5fa18b953a61dce4cc7d256552f5fbeace9b2fc2' }), h("div", { key: 'cd10884524860b3843b2bc308a1f5cd98e3521e6', class: "controls" }, h("div", { key: '1f9ea0ae36c3e9a285eb2124174a4096408f2833', class: "control" }, h("span", { key: '19249d5fdd259422591022aaad3b87626242b23b', class: "icon", innerHTML: StarIcon }), h("span", { key: '73c17da734ce561ed2a34792e7e49d3c5ef5ac88', class: "value" }, this.template.star_counter)), h("div", { key: '16c77cae206032ce4874aa8e3d94abdf56894563', class: "control secondary" }, h("span", { key: 'df2e55e5eb12dbc13d9fc566bf9c225da612a23e', class: "icon", innerHTML: PagesIcon }), h("span", { key: '0ff2120849aa15da404ad9f057b70fc47d8be414', class: "value" }, ((_d = (_c = (_b = this.template) === null || _b === void 0 ? void 0 : _b.documents) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.pages) || 1)), h("div", { key: '8d5b816f15260673af8b53d7473f58f18fd82f46', class: "control secondary" }, h("span", { key: '161b8b7532fd4ee0a294dd8fed77fd82f90e78ad', class: "icon", innerHTML: EmailIcon }), h("span", { key: 'f80ca578f61f52ecebd13faf1c6a28a4b2efb431', class: "value" }, this.template.counter)), h("span", { key: '4ca0becd38dfd69172a5fb9f898b65dd03a330f3', class: "additional-controls", innerHTML: ActionsIcon }))));
     }
     static get is() { return "verdocs-template-card"; }
     static get originalStyleUrls() {

package/dist/collection/components/templates/verdocs-template-document-page/verdocs-template-document-page.js

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