@verdocs/web-sdk 4.2.118 → 4.2.121

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

@@ -31,7 +31,7 @@ const VerdocsOkDialog = /*@__PURE__*/ proxyCustomElement(class VerdocsOkDialog e
         }
     }
     render() {
-        return (h(Host, { key: '044bc26a34fbb0d47866a4bba1fcd9afa00fce3c', class: this.closed ? 'closed' : '' }, h("div", { key: '7770fe5bf587af5795850f62c245fbd3895c56d1', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '638b1cd3f3803afa9c5013d8ff1106068c526e6a', class: "dialog" }, h("div", { key: 'cf5ebe2ed18b46b942a91d8eb4ab5c90c5246cbc', class: "heading" }, this.heading), h("div", { key: 'fa3b50e724b16a7d3acd6d86b7fdb8e8c04581c4', class: "content" }, h("div", { key: 'fd3fcf42eca89e5cc06f00b8beb0533851b00e1b', class: "message", innerHTML: this.message }), h("div", { key: 'f4dc2ecfa87b38e8f40e751ed905c51e77007509', class: "buttons" }, this.showCancel ? h("verdocs-button", { label: "CANCEL", variant: "outline", onClick: () => this.handleCancel() }) : h("div", { style: { display: 'none' } }), h("verdocs-button", { key: '17d5bf13abb90801117361480bddfd577b58d480', label: this.buttonLabel, onClick: () => this.handleOk() })))))));
+        return (h(Host, { key: '81c2af49ae8f00d0e456b175641147f9d2b96aaf', class: this.closed ? 'closed' : '' }, h("div", { key: 'ac0ff33839038f193ab487621d561f9b96c9be6b', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: 'b3b969cf178225d3ec402861318fbc7584dd61c3', class: "dialog" }, h("div", { key: '23cca98ef846bf05d64a504c1508540043752a27', class: "heading" }, this.heading), h("div", { key: 'c0d5d5a675240a440601d7a187d474eeb56af0a7', class: "content" }, h("div", { key: 'f489fef52afb980af5f2cbb254db155cda8daa07', class: "message", innerHTML: this.message }), h("div", { key: '80e62bc6698b058097ff0eb3dfd545d024d3e824', class: "buttons" }, this.showCancel ? h("verdocs-button", { label: "CANCEL", variant: "outline", onClick: () => this.handleCancel() }) : h("div", { style: { display: 'none' } }), h("verdocs-button", { key: '79966195a0d8f519ba1e94e3c233170be44536e5', 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: 'edcb6b648eb703e234ce904970ebb6b9723bf6aa', 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: 'd65260bd7cfa424e2a8330a8ad5937cbcae99284', class: "content" }, (_a = this.organization) === null || _a === void 0 ? void 0 : _a.name), h("verdocs-portal", { key: 'a3f9e0a6d165485782ae1be397c27dc2e385c48d', anchor: portalId }, h("div", { key: '75d61fc62badff566ba55fb6a8761cc4f8fb2220', 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: '73ca0dec9baa6e86a8cdf8e6c0cec8acbbe167cf', class: "popup-body" }, h("div", { key: '60f5cf8c4b8a0cce6db8e1f098c700910244ca71', class: "field" }, h("strong", { key: '039e40d1a4584e17f87d18efb607a341eb47d564' }, "Joined"), 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: 'fa6f6ba48c7ab7da9a6291a132cec83b104fbf93', class: "field" }, h("strong", { key: 'd7f81707a67bc98efa25e6587027782bba74c6cd' }, "Website"), h("a", { key: 'c81679b5b296bacd5a52ed1beb9b7420b6bf81c7', 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: 'd366f75b205860112b068c20138dd1398797db30', 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: '0bdcd5947dd2ea3a969d7e36adce0a757519b82a', class: "content" }, (_a = this.organization) === null || _a === void 0 ? void 0 : _a.name), h("verdocs-portal", { key: '2138d13531cc55e7834d78a8f5a64f4abb093f37', anchor: portalId }, h("div", { key: 'd1171e97a522bdb06795fe5cf8c584cbc02361de', 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: '71a81a3cc44431b1cfe34e217377b99c124fad9b', class: "popup-body" }, h("div", { key: 'f0241c76ef662fabe3128ef61e0825f663e946d6', class: "field" }, h("strong", { key: '9149ee03df0d5b32076d4a35c3a5cf7dc33ee346' }, "Joined"), 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: 'b80ea924d300b7fbd4a3ecbb0de03479d61f45ea', class: "field" }, h("strong", { key: '54f3ba9096ddf95e7da288ae7d2457e43247ae8e' }, "Website"), h("a", { key: '864b75852ce0989fdf18da9e2472abde5127e15d', 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: 'e8281a2f8d40512479595b6f10355d65d4ece855' }, this.selectedPage > 0 && h(PageButton, { key: '0ced00072d3046ef74ecc2f9c80e1deddaa6182d', page: 'first', selected: this.selectedPage, onClick: () => this.handleSelectPage(0) }), firstPage > 0 && h("div", { key: 'e6eeb99d7c42081bc0b1e010fa6c015c6ea58b3e', class: "ellipsis" }, "..."), pagesToDisplay.map(pageNumber => (h(PageButton, { page: pageNumber, selected: this.selectedPage, onClick: page => this.handleSelectPage(+page) }))), this.selectedPage < numPages - 1 && h("div", { key: '0ce4734579ec250c1d9d7a6f8171a94f8a1c2088', class: "ellipsis" }, "..."), this.selectedPage < numPages - 1 && h(PageButton, { key: '542ad8c6646d22fa1f5e399918202b173323fa6d', page: 'last', selected: this.selectedPage, onClick: () => this.handleSelectPage(numPages - 1) })));
+        return (h(Host, { key: 'aac02fe95f890afd2cb8816bc7828a9cca0c2551' }, this.selectedPage > 0 && h(PageButton, { key: '405eb090dfd96ed30bb931977d0c610ac8e7be5d', page: 'first', selected: this.selectedPage, onClick: () => this.handleSelectPage(0) }), firstPage > 0 && h("div", { key: '257ffecd81fcce987a667ee28c9ad66fbb709191', class: "ellipsis" }, "..."), pagesToDisplay.map(pageNumber => (h(PageButton, { page: pageNumber, selected: this.selectedPage, onClick: page => this.handleSelectPage(+page) }))), this.selectedPage < numPages - 1 && h("div", { key: '2bd4fa5128abaa3a48487e0eb3c0c15d24e66d68', class: "ellipsis" }, "..."), this.selectedPage < numPages - 1 && h(PageButton, { key: '645d68ee31f06f23780f71be067e0c8203738cca', 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

@@ -75,7 +75,7 @@ const VerdocsPortal = /*@__PURE__*/ proxyCustomElement(class VerdocsPortal exten
         this.moved ? this.portal.remove() : (this.moved = true);
     }
     render() {
-        return (h(Host, { key: '2640e3cd863ace891444caf6f7c323397eaba1a4', ref: el => (this.element = el) }, h("slot", { key: 'c6f903125d37b41d1b85b1bdb973c3b61905ac73' })));
+        return (h(Host, { key: 'b3949996fc3c9d9dba64dfde83cbd79a58e0b676', ref: el => (this.element = el) }, h("slot", { key: '25446c5cc9ebac9c172a47a96f518d72dc988216' })));
     }
     static get style() { return VerdocsPortalStyle0; }
 }, [4, "verdocs-portal", {

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: '1452640352e75d2857c138b4a02c8c76cc636dab' }, h("div", { key: '284a8c45e266f91b07a4450836b395597fc8d18a', class: "labels" }, this.label && h("div", { key: '182a5e200ceab601f86e68b3fbb09fcbc6d499b9', class: "label" }, this.label), this.showPercent && h("div", { key: 'cd624e4f7678435e57beb51ff27a3339ae7475d4', class: "label" }, this.percent, "%")), h("div", { key: '4d734b86bb51c14a0e99c4b3a7461c1c41f87d36', class: "bar" }, h("div", { key: '012cc09cdcdcf310eeb0723dcb57eff2e783c8e6', class: "slider", style: { width: `${widthPercent}%` } }))));
+        return (h(Host, { key: '135985ba37b13fcb4c73a7aae5f14dadc7ad24a8' }, h("div", { key: 'b2aebc7328629a31bb51f132a768995ca090ea01', class: "labels" }, this.label && h("div", { key: '1b7e6b5efedd8dd4746d40b5b7e28036dcb84232', class: "label" }, this.label), this.showPercent && h("div", { key: 'bebb2c912fa133193dacd82592216a543c7ffea1', class: "label" }, this.percent, "%")), h("div", { key: '031ffe4a12a9a457e184a59e2bbcbfbd629a66e3', class: "bar" }, h("div", { key: 'e2f158199e66fedb05e7b968422cde1dce3b1130', class: "slider", style: { width: `${widthPercent}%` } }))));
     }
     static get style() { return VerdocsProgressBarStyle0; }
 }, [0, "verdocs-progress-bar", {

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

@@ -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: '003157b49ca0a97cf1d7741862b343f7032bf37e', class: { open: !!this.open }, style: { minWidth, display: 'inline-block' } }, h("div", { key: 'e3a45fb1a5e8962c732159f145b398e7fb1f0c7d', class: "control", onClick: e => this.toggleDropdown(e), onBlur: e => this.handleHideDropdown(e) }, h("div", { key: '79b1d5d2b9dc52d4e364a3e8c56a175280d493d5', class: "title", ref: el => (this.dropdownButton = el) }, h("span", { key: '760645cc99eb63f9b90afa75b8cb787ec80ace05', class: "prefix" }, this.label, ":"), selectedOption ? selectedOption.label : this.placeholder), h("div", { key: 'dec25f104674e82f91781e53edcedb6112741f86', style: { flex: '1' } }), h("div", { key: '47f17166fad9fd3f6eba46b8589cfb935cd20222', class: "separator" }), h("div", { key: 'd6deb3811ad209885a7f973ace22fbeb7784cd0f', class: "arrow", innerHTML: DropdownArrow, "aria-label": "Open Menu" })), h("div", { key: 'be8116461c9edcc6f9ee25ff1941eda3c9f2387d', 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: '532cacd9e30591fc8f40f7b2fb0b57fc0e48466c', class: { open: !!this.open }, style: { minWidth, display: 'inline-block' } }, h("div", { key: 'eda6d4179e9c2d9f153838be61b877d7835a5fde', class: "control", onClick: e => this.toggleDropdown(e), onBlur: e => this.handleHideDropdown(e) }, h("div", { key: 'ab8a9eb3822dc97258c31a59d5a996ebb3e9845f', class: "title", ref: el => (this.dropdownButton = el) }, h("span", { key: '6e0511271a127baec11000264080cb5d9420216b', class: "prefix" }, this.label, ":"), selectedOption ? selectedOption.label : this.placeholder), h("div", { key: '80945d7311b0ce4a77aa8d7de9ad9fb492cff5da', style: { flex: '1' } }), h("div", { key: 'bc0cf152d1c2b76f870f571455a2c9da516a63fe', class: "separator" }), h("div", { key: '6bc5c491c2d65892e9c7a371bcecb9e034a9487c', class: "arrow", innerHTML: DropdownArrow, "aria-label": "Open Menu" })), h("div", { key: '1ceac8d3bc13cec6135985e62f028f7c3583f0dc', 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-functions.js

@@ -21,7 +21,7 @@ const VerdocsQuickFunctions$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsQu
         this.createDocument.emit();
     }
     render() {
-        return (h("div", { key: 'e0edb4e04bbf4ee92ba26f50f3c56beec434e375', class: "container" }, h("p", { key: '58e823308edc32e234587cd6232c5014460a7a8a', class: "title" }, "Quick Create"), h("button", { key: '5ef91f83933d1d716c6627ab393cb171e977aa81', onClick: () => this.handleCreateTemplate(), innerHTML: TemplateIcon }, "Template"), h("button", { key: '773b5d9e6f4288f288cee92d4c7884cdce8a3374', onClick: () => this.handleCreateDocument(), innerHTML: DocumentIcon }, "Document")));
+        return (h("div", { key: 'ab46c28e7f1420c3d38537fa3f1df68e3a4552bd', class: "container" }, h("p", { key: '1fedfcb6362e8c94e20c5ab0b8dae925f0a50542', class: "title" }, "Quick Create"), h("button", { key: 'eb7816bba752b3a2b531166413b8004f239db36d', onClick: () => this.handleCreateTemplate(), innerHTML: TemplateIcon }, "Template"), h("button", { key: 'c551132ca96ce060bf0fcd18f017b20b9a27cfda', 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: '8bb79695c8aab74877a368290a467078500c049b', class: { disabled: this.disabled } }, h("input", { key: '6cddceb3e5ec00f1aced019b49cbd162c58fc05f', 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: 'c6dc8308fe34376bd2cb9561dc328570db52d340', htmlFor: `verdocs-radio-button-${this.name}-${this.value}` })));
+        return (h(Host, { key: 'b8dc5d8e34deeaf6d67f8b38bcf485a66e6fe8c8', class: { disabled: this.disabled } }, h("input", { key: '5e03859b9d3082add93aeba0eb626d8f41988f1c', 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: '4caa876b9138003b5ff7d576fdc32fcf62858bca', htmlFor: `verdocs-radio-button-${this.name}-${this.value}` })));
     }
     static get style() { return VerdocsRadioButtonStyle0; }
 }, [0, "verdocs-radio-button", {

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

@@ -44,7 +44,7 @@ const VerdocsSearchBox$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSearchB
         }
     }
     render() {
-        return (h("form", { key: 'c7e0698afde279984bfa46382443f40d5110c023', onSubmit: e => this.handleSearch(e) }, this.type !== undefined && this.type !== 'all' && (h("span", { key: '07cbbb7bee52f85bbb22a0254b1f1a109b70d408', class: "type" }, this.type, "s ", h("button", { key: '7c7522a957cd4f80d98abb680d7164ac6db1f377', class: "remove", innerHTML: CloseIcon, onClick: () => this.handleClearFilter() }))), h("input", { key: '362af3bf09cf9c781c287f5193e7dad31bd85d87', 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: '7d4c890a308373d0b8a38548f2ad6995980ab7d7', onClick: e => this.handleSearch(e), class: "search" }, h("span", { key: 'a403419fe53c5a8f1271826f35c2061ca6a88328', innerHTML: SearchIcon }), "Search")));
+        return (h("form", { key: '5244d8a4276ead04d75be718eff4cbfd6203c8c3', onSubmit: e => this.handleSearch(e) }, this.type !== undefined && this.type !== 'all' && (h("span", { key: '740ef6719f4e2ac16daedfb539311ee252c37b0e', class: "type" }, this.type, "s ", h("button", { key: 'c101d22f53a80d18c5c155ce930688ccb72228f9', class: "remove", innerHTML: CloseIcon, onClick: () => this.handleClearFilter() }))), h("input", { key: 'b30a27a9c7dd82bdf2df7d4941356245ca4e0302', 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: 'd1cd5ea8fbde2c5f138d44c9bc289dd34de520cb', onClick: e => this.handleSearch(e), class: "search" }, h("span", { key: 'f1afef424ebd455cf68c22298a65594a29b57c85', 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: '1f3dba2661771f24f6a9a416b040b84d48f0356b' }, "\u00A0");
+        return h("div", { key: 'afc8ae06fa51a4aa236c12b7ed057e16112ce8a8' }, "\u00A0");
     }
     static get style() { return VerdocsSearchTabsStyle0; }
 }, [0, "verdocs-search-tabs", {

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

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

package/dist/components/verdocs-sign.js

@@ -4,17 +4,18 @@ import { a as saveAttachment, u as updateDocumentFieldValue, r as renderDocument
 import { c as createTemplateFieldStoreFromEnvelope } from './TemplateFieldStore.js';
 import { V as VerdocsToast } from './Toast.js';
 import { S as SDKError } from './errors.js';
-import { d as defineCustomElement$a } from './verdocs-button2.js';
-import { d as defineCustomElement$9 } from './verdocs-checkbox2.js';
-import { d as defineCustomElement$8 } from './verdocs-dropdown2.js';
-import { d as defineCustomElement$7 } from './verdocs-envelope-document-page2.js';
-import { d as defineCustomElement$6 } from './verdocs-kba-dialog2.js';
-import { d as defineCustomElement$5 } from './verdocs-loader2.js';
-import { d as defineCustomElement$4 } from './verdocs-ok-dialog2.js';
-import { d as defineCustomElement$3 } from './verdocs-portal2.js';
+import { d as defineCustomElement$b } from './verdocs-button2.js';
+import { d as defineCustomElement$a } from './verdocs-checkbox2.js';
+import { d as defineCustomElement$9 } from './verdocs-dropdown2.js';
+import { d as defineCustomElement$8 } from './verdocs-envelope-document-page2.js';
+import { d as defineCustomElement$7 } from './verdocs-kba-dialog2.js';
+import { d as defineCustomElement$6 } from './verdocs-loader2.js';
+import { d as defineCustomElement$5 } from './verdocs-ok-dialog2.js';
+import { d as defineCustomElement$4 } from './verdocs-portal2.js';
+import { d as defineCustomElement$3 } from './verdocs-spinner2.js';
 import { d as defineCustomElement$2 } from './verdocs-view2.js';
 
-const verdocsSignCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-sign{display:-ms-flexbox;display:flex;overflow:hidden;position:relative;min-height:600px;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-sign div{display:block;-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-sign input{vertical-align:top}verdocs-sign>.document{-ms-flex:1;flex:1;width:100%;height:100%;-ms-flex-item-align:center;align-self:center;display:-ms-flexbox;display:flex;padding:15px;row-gap:15px;max-width:1200px;min-height:200px;position:relative;overflow-y:scroll;-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-direction:column;flex-direction:column}verdocs-sign>.document .inner{width:100%;max-width:1028px}verdocs-sign .cover{top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;z-index:5000;position:absolute;padding-top:100px;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;background:rgba(0, 0, 0, 0.5)}verdocs-sign .agree{-ms-flex:0;flex:0;width:600px;display:-ms-flexbox;display:flex;max-width:90%;padding:30px 15px;-ms-flex-direction:column;flex-direction:column;background-color:#ffffff}verdocs-sign .agree .header{-ms-flex:0 0 56px;flex:0 0 56px}verdocs-sign .agree li{margin:0.5em 0}verdocs-sign verdocs-ok-dialog .background-overlay{-ms-flex-align:start;align-items:flex-start;padding-top:100px}verdocs-sign .loading-indicator{top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;z-index:10000;position:fixed;background-color:rgba(0, 0, 0, 0.7)}@media print{verdocs-sign .header{display:none}}#verdocs-sign-header{color:#fff;width:100%;display:-ms-flexbox;display:flex;z-index:1000;-ms-flex:0 0 56px;flex:0 0 56px;font-size:12px;-webkit-column-gap:15px;-moz-column-gap:15px;column-gap:15px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;-webkit-transition:all 0.25s;transition:all 0.25s;background-color:#33354c;-webkit-box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.24), 0 0 4px 0 rgba(0, 0, 0, 0.12);box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.24), 0 0 4px 0 rgba(0, 0, 0, 0.12)}#verdocs-sign-header .inner{width:100%;display:-ms-flexbox;display:flex;margin:0 auto;padding:0 20px;max-width:1200px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}#verdocs-sign-header .logo{width:80px;display:none;margin:-6px 0 0 0}#verdocs-sign-header .title{font-size:18px;font-weight:500;overflow:hidden;white-space:nowrap;padding:0 10px 0 0;text-overflow:ellipsis}";
+const verdocsSignCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-sign{display:-ms-flexbox;display:flex;overflow:hidden;position:relative;min-height:600px;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-sign div{display:block;-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-sign input{vertical-align:top}verdocs-sign>.document{-ms-flex:1;flex:1;width:100%;height:100%;-ms-flex-item-align:center;align-self:center;display:-ms-flexbox;display:flex;padding:15px;row-gap:15px;max-width:1200px;min-height:200px;position:relative;overflow-y:scroll;-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-direction:column;flex-direction:column}verdocs-sign>.document .inner{width:100%;max-width:1028px}verdocs-sign .cover{top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;z-index:5000;position:absolute;padding-top:100px;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;background:rgba(0, 0, 0, 0.5)}verdocs-sign .agree{-ms-flex:0;flex:0;width:600px;display:-ms-flexbox;display:flex;max-width:90%;padding:30px 15px;-ms-flex-direction:column;flex-direction:column;background-color:#ffffff}verdocs-sign .agree .header{-ms-flex:0 0 56px;flex:0 0 56px}verdocs-sign .agree li{margin:0.5em 0}verdocs-sign verdocs-ok-dialog .background-overlay{-ms-flex-align:start;align-items:flex-start;padding-top:100px}verdocs-sign .loading-indicator{top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;z-index:10000;position:fixed;background-color:rgba(0, 0, 0, 0.7)}@media print{verdocs-sign .header{display:none}}#verdocs-sign-header{color:#fff;width:100%;display:-ms-flexbox;display:flex;z-index:1000;-ms-flex:0 0 56px;flex:0 0 56px;font-size:12px;-webkit-column-gap:15px;-moz-column-gap:15px;column-gap:15px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;-webkit-transition:all 0.25s;transition:all 0.25s;background-color:#33354c;-webkit-box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.24), 0 0 4px 0 rgba(0, 0, 0, 0.12);box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.24), 0 0 4px 0 rgba(0, 0, 0, 0.12)}#verdocs-sign-header .inner{width:100%;display:-ms-flexbox;display:flex;margin:0 auto;padding:0 20px;max-width:1200px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}#verdocs-sign-header .logo{width:80px;display:none;margin:-6px 0 0 0}#verdocs-sign-header .title{font-size:18px;font-weight:500;overflow:hidden;white-space:nowrap;padding:0 10px 0 0;text-overflow:ellipsis}#verdocs-sign-header .spinner-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:1000;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;background:rgba(0, 0, 0, 0.4980392157);-ms-flex-pack:center;justify-content:center}";
 const VerdocsSignStyle0 = verdocsSignCss;
 
 const inProgressMenuOptions = [
@@ -62,6 +63,7 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         this.agreed = false;
         this.documentsSingularPlural = 'document';
         this.kbaStep = '';
+        this.showSpinner = true;
     }
     componentWillLoad() {
         if (!this.endpoint) {
@@ -211,6 +213,7 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         this.getRecipientFields().forEach(oldField => {
             if (oldField.name === fieldName) {
                 oldField.value = updateResult.value;
+                // TODO: Keeping this while attachments still rely on it
                 oldField.settings = updateResult.settings;
                 updateDocumentFieldValue(oldField);
                 this.checkRecipientFields();
@@ -340,7 +343,7 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         return recipientFields;
     }
     async handleNext() {
-        var _a, _b;
+        var _a;
         if (this.nextSubmits) {
             try {
                 // Patches the date picker to be forcibly removed if still showing during submission
@@ -368,8 +371,8 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
             this.submitting = false;
             return;
         }
-        // Find and focus the next incomplete` field (that is fillable)
-        const emptyFields = this.getSortedFillableFields().filter(field => !this.isFieldFilled(field));
+        // Find and focus the next incomplete field (that is fillable)
+        const emptyFields = this.getSortedFillableFields().filter(field => field.required && !this.isFieldFilled(field));
         sortFields(emptyFields);
         const focusedIndex = emptyFields.findIndex(field => field.name === this.focusedField);
         let nextFocusedIndex = focusedIndex + 1;
@@ -377,9 +380,10 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
             nextFocusedIndex = 0;
         }
         let nextRequiredField = emptyFields[nextFocusedIndex];
+        console.log('Next field', nextRequiredField);
         // Skip signature and initial fields that are already filled in. We have to count our "skips" just in case, to avoid infinite loops.
         let skips = 0;
-        if (skips < emptyFields.length && ['signature', 'initial'].includes(nextRequiredField.type) && ((_b = nextRequiredField.settings) === null || _b === void 0 ? void 0 : _b.result) === 'signed') {
+        if (skips < emptyFields.length && ['signature', 'initial'].includes(nextRequiredField.type) && ['initialed', 'signed'].includes(nextRequiredField.value)) {
             skips++;
             nextFocusedIndex++;
             if (nextFocusedIndex >= emptyFields.length) {
@@ -417,6 +421,7 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         }
     }
     attachFieldAttributes(pageInfo, field, el) {
+        // console.log('attach', field.name);
         el.addEventListener('input', (e) => {
             // 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
@@ -433,10 +438,19 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         el.addEventListener('attached', async (e) => {
             // TODO: Show a spinner and/or progress bar
             console.log('[SIGN] onAttached', e.detail, e.target.value);
-            const r = await uploadEnvelopeFieldAttachment(this.endpoint, this.envelopeId, field.name, e.detail);
-            console.log('upload result', r);
-            // this.updateRecipientFieldValue(fieldName, updateResult)
-            this.checkRecipientFields();
+            this.showSpinner = true;
+            try {
+                const r = await uploadEnvelopeFieldAttachment(this.endpoint, this.envelopeId, field.name, e.detail);
+                console.log('upload result', r);
+                // this.updateRecipientFieldValue(fieldName, updateResult)
+                this.checkRecipientFields();
+                this.showSpinner = false;
+            }
+            catch (e) {
+                console.log('Error uploading attachment', e);
+                VerdocsToast('Unable to upload attachment, please try again later', { style: 'error' });
+                this.showSpinner = false;
+            }
         });
         el.addEventListener('remove', (e) => {
             console.log('[SIGN] onRemoved', e.detail, e.target.value);
@@ -448,7 +462,8 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
                 .catch(e => console.log('[SIGN] Error deleting attachment', e));
         });
         el.addEventListener('focusout', e => {
-            if (field.type !== 'dropdown') {
+            // These field types trigger focusout as they're used, even without a value change
+            if (field.type !== 'dropdown' && field.type !== 'attachment') {
                 this.handleFieldChange(field, e).finally(() => this.checkRecipientFields());
             }
         });
@@ -469,12 +484,7 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         // NOTE: We don't filter on pageNumber here because we need the position in the
         // entire list to set the tabIndex.
         const recipientFields = this.getSortedFillableFields();
-        console.log('Recipient fields', recipientFields);
-        // this.getRecipientFields().filter(field => field.page === pageInfo.pageNumber);
         // First render the fields for the signer
-        // Also show field placeholders for other signers who have yet to act
-        // In template list in Beta, show second date being sorted on
-        // Sign top to bottom left to right
         recipientFields.forEach((field, tabIndex) => {
             if (field.page !== pageInfo.pageNumber) {
                 return;
@@ -564,7 +574,7 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         })), this.showFinishLater && (h("verdocs-ok-dialog", { heading: "You've saved your document to finish later.", message: `To complete the ${this.documentsSingularPlural}, use the link in the original email notification inviting you to review and finish the document.`, onNext: () => (this.showFinishLater = false) })), this.errorMessage && h("verdocs-ok-dialog", { heading: "Network Error", message: this.errorMessage, onNext: () => (this.errorMessage = '') }), this.showDone && (h("verdocs-ok-dialog", { heading: "You're Done!", message: `You can access the ${this.documentsSingularPlural} at any time by clicking on the link from the invitation email.<br /><br />After all recipients have completed their actions, you will receive an email with the document and envelope certificate attached.`, onNext: () => {
                 this.showDone = false;
                 this.isDone = true;
-            } })), this.submitting && (h("div", { class: "loading-indicator" }, h("verdocs-loader", null)))));
+            } })), this.submitting && (h("div", { class: "loading-indicator" }, h("verdocs-loader", null))), this.showSpinner && (h("verdocs-portal", null, h("div", { class: "spinner-overlay" }, h("verdocs-spinner", null))))));
     }
     static get style() { return VerdocsSignStyle0; }
 }, [0, "verdocs-sign", {
@@ -593,13 +603,14 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         "showFinishLater": [32],
         "agreed": [32],
         "documentsSingularPlural": [32],
-        "kbaStep": [32]
+        "kbaStep": [32],
+        "showSpinner": [32]
     }]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["verdocs-sign", "verdocs-button", "verdocs-checkbox", "verdocs-dropdown", "verdocs-envelope-document-page", "verdocs-kba-dialog", "verdocs-loader", "verdocs-ok-dialog", "verdocs-portal", "verdocs-view"];
+    const components = ["verdocs-sign", "verdocs-button", "verdocs-checkbox", "verdocs-dropdown", "verdocs-envelope-document-page", "verdocs-kba-dialog", "verdocs-loader", "verdocs-ok-dialog", "verdocs-portal", "verdocs-spinner", "verdocs-view"];
     components.forEach(tagName => { switch (tagName) {
         case "verdocs-sign":
             if (!customElements.get(tagName)) {
@@ -608,40 +619,45 @@ function defineCustomElement$1() {
             break;
         case "verdocs-button":
             if (!customElements.get(tagName)) {
-                defineCustomElement$a();
+                defineCustomElement$b();
             }
             break;
         case "verdocs-checkbox":
             if (!customElements.get(tagName)) {
-                defineCustomElement$9();
+                defineCustomElement$a();
             }
             break;
         case "verdocs-dropdown":
             if (!customElements.get(tagName)) {
-                defineCustomElement$8();
+                defineCustomElement$9();
             }
             break;
         case "verdocs-envelope-document-page":
             if (!customElements.get(tagName)) {
-                defineCustomElement$7();
+                defineCustomElement$8();
             }
             break;
         case "verdocs-kba-dialog":
             if (!customElements.get(tagName)) {
-                defineCustomElement$6();
+                defineCustomElement$7();
             }
             break;
         case "verdocs-loader":
             if (!customElements.get(tagName)) {
-                defineCustomElement$5();
+                defineCustomElement$6();
             }
             break;
         case "verdocs-ok-dialog":
             if (!customElements.get(tagName)) {
-                defineCustomElement$4();
+                defineCustomElement$5();
             }
             break;
         case "verdocs-portal":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "verdocs-spinner":
             if (!customElements.get(tagName)) {
                 defineCustomElement$3();
             }

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

@@ -220,7 +220,7 @@ const VerdocsSignatureDialog = /*@__PURE__*/ proxyCustomElement(class VerdocsSig
     }
      */
     render() {
-        return (h(Host, { key: '1c8be76f76ad6c6c6bb455ea94af5aaefe48d8dc', onClick: e => this.handleCancel(e) }, h("div", { key: '179622d724573e78c3a23b81902c5380dfd3b6b4', class: "dialog" }, h("div", { key: 'a149f5453e75339e07fa6fa93c69099e5857b6c6', class: "heading" }, "Create Your Signature"), h("div", { key: 'b55b63fc5fd3050b164ff1952dc0b206265c6c06', class: "content" }, h("verdocs-text-input", { key: '2e9edfb8b7cf22819a72c2a7e831b8245134c710', placeholder: "Full Name...", label: "Full Name", value: this.enteredName, onInput: e => this.handleNameChange(e), onClick: e => e.stopPropagation() }), h("div", { key: 'a4e3a34686a783b9b16ea84b93331847ba42052f', class: "as-shown" }, "As shown on driver's license or govt. ID card."), this.fontLoaded ? h("canvas", { ref: el => (this.canvasElement = el) }) : h("div", { style: { display: 'none' } }), h("div", { key: 'a5d433881194fb0beadeb357710f45c63c5a7d5a', class: "disclaimer" }, "By clicking Adopt, I agree that the signature will be the electronic representation of my signature for all purposes when I (or my agent) use them on documents, including legally binding contracts \u2014 just the same as a pen-and-paper signature or initial."), h("div", { key: 'c0af3589e89e786f5ef67ff28786514942441bd3', class: "buttons" }, h("verdocs-button", { key: 'd7fd63314a28a0ffa430d8136718c6c4af846a5b', label: "CANCEL", size: "normal", variant: "outline", onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: '7811cf9c0c33c2f739458dec0aae9fab09ab291e', label: "Adopt & Sign", size: "normal", onClick: e => this.handleAdopt(e) }))))));
+        return (h(Host, { key: 'adb6930e8f646eb3d7f6a1856df1c5295a694d22', onClick: e => this.handleCancel(e) }, h("div", { key: '0ef6ab04bdfe76477b5b7a5a701148e9cca0dda4', class: "dialog" }, h("div", { key: '87b35a5421b7db879377edc8c3772052df0420d6', class: "heading" }, "Create Your Signature"), h("div", { key: '1be897a0946ff184a854596541db11bda193c49b', class: "content" }, h("verdocs-text-input", { key: '04cc32a60beec631e9858a5f4113a5381f781ae3', placeholder: "Full Name...", label: "Full Name", value: this.enteredName, onInput: e => this.handleNameChange(e), onClick: e => e.stopPropagation() }), h("div", { key: 'be59854a46ca29d00a19fbc08e6257387ecbd3d3', 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: '4fede3187e8a19fafca35bf8cb654ba61d282efa', 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: '643fff8b2fe9bd790b3d8e98ba735c5cd71846e2', class: "buttons" }, h("verdocs-button", { key: '02aebbf4ec70c787b6329e3084879922ba91f852', label: "CANCEL", size: "normal", variant: "outline", onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: 'b4d9ca247b76d496147a1eb3565eb53cf37f9ac3', 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: '33e182037ce0a988e30b7a2ee1f31591f8ac1b08', style: {
+        return (h(Host, { key: '87070faacac5435c529ef7f2104e4e8df403fce8', 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: '59e5538e41c29b74d4f8d53c8674fb2d0d159ab9', 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: 'a579d2ed18289b75beaaaf5fef322db25d0a4e93', 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: 'c3fda712b9cbede053c1ed89914d85b3eb8c8d96', class: "icon", innerHTML: icon }), h("span", { key: 'da87a24aef046a682a479580f7157f22778c1344', class: "content" }, statusMessage), h("div", { key: '37ca0dc5c864927f40b6bacaff2aed3a8b9b892b', class: "detail-panel", ref: el => (this.detailPanel = el) }, h("div", { key: 'cd4ebea386ae4abd6c95720c7f8c3cf640e33c3d', id: `${this.containerId}` }), this.recipientStatusIcons.map(icon => (h("span", { innerHTML: icon.icon, style: { position: 'absolute', top: `${icon.y}px`, left: `${icon.x}px` } }))))));
+            }, onBlur: e => this.envelope && this.handleHideDropdown(e) }, h("span", { key: 'c59f8b21dce6f4fe2cd7bdc1124c6af339e70de7', class: "icon", innerHTML: icon }), h("span", { key: '1c96b95b111836c791a14e22c28defc43db1cc48', class: "content" }, statusMessage), h("div", { key: 'd673852a5e1a03656cb15d39d7f469a6e43f45a9', class: "detail-panel", ref: el => (this.detailPanel = el) }, h("div", { key: '0d1597689117ca7419f556fc38ff55711644f55f', id: `${this.containerId}` }), this.recipientStatusIcons.map(icon => (h("span", { innerHTML: icon.icon, style: { position: 'absolute', top: `${icon.y}px`, left: `${icon.x}px` } }))))));
     }
     static get style() { return VerdocsStatusIndicatorStyle0; }
 }, [0, "verdocs-status-indicator", {

package/dist/components/verdocs-switch2.js

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

package/dist/components/verdocs-table.js

@@ -13,9 +13,9 @@ const VerdocsTable$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsTable exten
         this.data = [];
     }
     render() {
-        return (h(Host, { key: '0f5ccb1d3bf8296157a3b4988a158a0277405127', class: "table-wrapper" }, h("table", { key: '0994c41fb599962358081f0849dd3d3399780397', class: "table" }, h("thead", { key: 'ebee5297f9bae8d5527e8ea2ad84c44278aed243' }, h("tr", { key: 'ee44689ef6c78e4debb206e6d554f9df848e1868', class: "row header-row" }, this.columns.map((col, i) => {
+        return (h(Host, { key: 'd19cf6b46ea9a6cc982eb95a85b0cc390db42a51', class: "table-wrapper" }, h("table", { key: 'b47796f52ce057fe9bdc6e99f79b1cbf51d788d5', class: "table" }, h("thead", { key: '9cfe8d27d078f8909680a463acee75dba172f15d' }, h("tr", { key: 'cb17d88359a5e3282fbd101d1990deb1d5582898', 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: '9cbccc8987ca66498dbd006c2599bc6f2c85c8d6' }, this.data.map(row => (h("tr", { class: "row data-row", onClick: () => { var _a; return (_a = this.rowClick) === null || _a === void 0 ? void 0 : _a.emit({ row }); } }, this.columns.map((col, i) => {
+        }))), h("tbody", { key: '4590b2ecbb1ad3aac1b67fcd0fc06c2bb8754644' }, this.data.map(row => (h("tr", { class: "row data-row", onClick: () => { var _a; return (_a = this.rowClick) === null || _a === void 0 ? void 0 : _a.emit({ row }); } }, this.columns.map((col, i) => {
             return col.renderCell ? (h("td", { class: `col data-col col-${i} col-${col.id}`, innerHTML: col.renderCell(col, row) })) : (h("td", { class: `col data-col col-${i} col-${col.id}` }, row[col.id]));
         }))))))));
     }

package/dist/components/verdocs-tabs2.js

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

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

@@ -15,7 +15,7 @@ const VerdocsTemplateCard$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsTemp
     }
     render() {
         var _a, _b, _c, _d;
-        return (h(Host, { key: '764d4b13847b9248b54f75b415d7aa9bd47f1a0e' }, h("span", { key: '63e24c019fa23f00dd40b251fe89cdf720df9994', class: "name" }, this.template.name), h("span", { key: 'a709d0cf41957ba84ccbd5b58c63ecaec41272d5', class: "org-name" }, ((_a = this.template.organization) === null || _a === void 0 ? void 0 : _a.name) || 'Public'), h("hr", { key: '33a685839d160dc1f8cea2ede8784878a34cca13' }), h("div", { key: '0e08647c71b9245cfd1cb372c4dbe44805cb98db', class: "controls" }, h("div", { key: '42763e333948034dbf73e186dfdc4ba82068d399', class: "control" }, h("span", { key: '3ffcc3c8c3c766fa2d8a4a617373223bffab5768', class: "icon", innerHTML: StarIcon }), h("span", { key: 'e1bdfa83c6764f1522e87011d19d65dee70492b8', class: "value" }, this.template.star_counter)), h("div", { key: '05f132e36844a277a4bf619248d4f1405f5175a6', class: "control secondary" }, h("span", { key: '88615f3a8413a68132098961898ceed4d369d9b1', class: "icon", innerHTML: PagesIcon }), h("span", { key: 'd35c7465d76f88a8fd29045d4ea18b9dd6031667', class: "value" }, ((_d = (_c = (_b = this.template) === null || _b === void 0 ? void 0 : _b.documents) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.pages) || 1)), h("div", { key: '179a4acabb579ea1c52793c4681f0dec2947800f', class: "control secondary" }, h("span", { key: '3d5de3e3d320eb3209aa5b8809d06613fe24da7c', class: "icon", innerHTML: EmailIcon }), h("span", { key: 'f2386b02c0562d8dc02bd2508c5a56059616d2c7', class: "value" }, this.template.counter)), h("span", { key: 'd98e1df83d33b1aa258f4bb92361dd4dc119269f', class: "additional-controls", innerHTML: ActionsIcon }))));
+        return (h(Host, { key: '3e5011cab3a4e78b92e9c2565f40d304ad334ed6' }, h("span", { key: '65ae319e5f2c07d6ad30dc7e1ef797d7d1f45e34', class: "name" }, this.template.name), h("span", { key: '81078cc46080d7417f3a2aa2a87f62787867ab7d', class: "org-name" }, ((_a = this.template.organization) === null || _a === void 0 ? void 0 : _a.name) || 'Public'), h("hr", { key: 'e35365811650f21862ebc87e89015c1c044f65cc' }), h("div", { key: '9d7e0b7a9e09be59890df0b8655f1ad74b8aadc9', class: "controls" }, h("div", { key: '24e402c45e499969b3f039010a730b7e22e5eb82', class: "control" }, h("span", { key: '06891917e493b9902f141acf3c906d9f2dfb98fc', class: "icon", innerHTML: StarIcon }), h("span", { key: '6599c695f7f5e1798254a16e1e209afe1768cd9d', class: "value" }, this.template.star_counter)), h("div", { key: '868b45b247a1e613caa0ca20270435ecfc52032d', class: "control secondary" }, h("span", { key: 'c0c308c9762ed5ada2456d69697dc5b0295f257c', class: "icon", innerHTML: PagesIcon }), h("span", { key: 'f851ea648cd5115798937af1d9d12671410e3f5b', 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: '3c24408d7b9cd968d721cd5360a87f7d66d0f02a', class: "control secondary" }, h("span", { key: '12a94b8fc7850db8ab535161abd7003ddb8f5eca', class: "icon", innerHTML: EmailIcon }), h("span", { key: '544d6b2ba82c971ba46649fa45d044293a89ca07', class: "value" }, this.template.counter)), h("span", { key: '62c64a478015d8edd079272405a366fc117dafea', class: "additional-controls", innerHTML: ActionsIcon }))));
     }
     static get style() { return VerdocsTemplateCardStyle0; }
 }, [0, "verdocs-template-card", {

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

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

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

@@ -141,19 +141,17 @@ const VerdocsTemplateFields = /*@__PURE__*/ proxyCustomElement(class VerdocsTemp
             this.placing = null;
         }
     }
-    async handleFieldChange(field, e, optionId) {
-        console.log('[FIELDS] handleFieldChange', field, e, optionId);
-    }
+    // async handleFieldChange(field: ITemplateField, e: any, optionId?: string) {
+    //   console.log('[FIELDS] handleFieldChange', field, e, optionId);
+    // }
     attachFieldAttributes(pageInfo, field, el) {
-        el.addEventListener('input', e => this.handleFieldChange(field, e));
-        el.addEventListener('settingsChanged', (e) => {
+        // el.addEventListener('input', e => this.handleFieldChange(field, e));
+        el.addEventListener('settingsChanged', () => {
             var _a, _b;
-            console.log('Settings changed', e.detail);
             (_a = this.templateUpdated) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, template: (_b = this.templateStore) === null || _b === void 0 ? void 0 : _b.state, event: 'added-field' });
         });
         el.addEventListener('deleted', () => {
             var _a, _b;
-            console.log('[FIELDS] Deleted', this, field);
             el.remove();
             (_a = this.templateUpdated) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, template: (_b = this.templateStore) === null || _b === void 0 ? void 0 : _b.state, event: 'updated-field' });
         });
@@ -202,7 +200,7 @@ const VerdocsTemplateFields = /*@__PURE__*/ proxyCustomElement(class VerdocsTemp
         updateCssTransform(event.target, 'translate', `${newX}px, ${newY}px`);
     }
     async handleMoveEnd(event) {
-        var _a, _b, _c, _d, _e;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
         const name = event.target.getAttribute('fieldname');
         const option = +(event.target.getAttribute('option') || '0');
         const field = this.fieldStore.get('fields').find(field => field.name === name);
@@ -211,19 +209,33 @@ const VerdocsTemplateFields = /*@__PURE__*/ proxyCustomElement(class VerdocsTemp
             return;
         }
         const pageNumber = event.target.getAttribute('pagenumber');
-        const { naturalWidth = 612, naturalHeight = 792, renderedHeight = 792 } = this.cachedPageInfo[pageNumber];
+        let { naturalWidth = 612, naturalHeight = 792, renderedHeight = 792 } = this.cachedPageInfo[pageNumber];
         const clientRect = event.target.getBoundingClientRect();
         const parent = event.target.parentElement;
         const parentRect = parent.getBoundingClientRect();
         const width = field.width || defaultWidth(field.type);
         const height = field.height || defaultHeight(field.type);
-        // These two being backwards is not a mistake. Left measures "over" from the left (positive displacement) while bottom measures
-        // "up" from the bottom (negative displacement).
+        // These two being backwards is not a mistake. Left measures "over" from the left
+        // (positive displacement) while bottom measures "up" from the bottom (negative displacement).
         const newX = Math.max(clientRect.left - parentRect.left, 0);
-        const newY = Math.max(renderedHeight - (parentRect.bottom - clientRect.bottom), 0);
+        let newY = Math.max(renderedHeight - (parentRect.bottom - clientRect.bottom), 0);
+        console.log('drop', { pageNumber, newX, newY });
+        let newPageNumber = parseInt(pageNumber);
+        if (newY > renderedHeight) {
+            newPageNumber = Math.min(newPageNumber + 1, ((_d = (_c = (_b = (_a = this.templateStore) === null || _a === void 0 ? void 0 : _a.state) === 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);
+            newY -= renderedHeight;
+            renderedHeight = this.cachedPageInfo[newPageNumber].renderedHeight;
+            console.log('Next page', { newPageNumber, newY, renderedHeight });
+        }
+        else if (newY < 0) {
+            newPageNumber = Math.max(newPageNumber - 1, 1);
+            renderedHeight = this.cachedPageInfo[newPageNumber].renderedHeight;
+            newY += renderedHeight;
+            console.log('Next page', { newPageNumber, newY, renderedHeight });
+        }
         const { x, y } = this.viewCoordinatesToPageCoordinates(newX, newY, pageNumber, naturalWidth - width, naturalHeight - height);
         try {
-            const params = { x, y };
+            const params = { x, y, page: newPageNumber };
             console.log('[FIELDS] Will update', name, y, option, params);
             const newFieldData = await updateField(this.endpoint, this.templateId, name, params);
             console.log('[FIELDS] Updated', newFieldData);
@@ -231,12 +243,12 @@ const VerdocsTemplateFields = /*@__PURE__*/ proxyCustomElement(class VerdocsTemp
             event.target.removeAttribute('posX');
             event.target.removeAttribute('posY');
             removeCssTransform(event.target);
-            (_a = this.templateUpdated) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, template: (_b = this.templateStore) === null || _b === void 0 ? void 0 : _b.state, event: 'updated-field' });
+            (_e = this.templateUpdated) === null || _e === void 0 ? void 0 : _e.emit({ endpoint: this.endpoint, template: (_f = this.templateStore) === null || _f === void 0 ? void 0 : _f.state, event: 'updated-field' });
         }
         catch (e) {
             VerdocsToast('Error updating field, please try again later', { style: 'error' });
             console.log('[FIELDS] Error updating field', e);
-            (_c = this.sdkError) === null || _c === void 0 ? void 0 : _c.emit(new SDKError(e.message, (_d = e.response) === null || _d === void 0 ? void 0 : _d.status, (_e = e.response) === null || _e === void 0 ? void 0 : _e.data));
+            (_g = this.sdkError) === null || _g === void 0 ? void 0 : _g.emit(new SDKError(e.message, (_h = e.response) === null || _h === void 0 ? void 0 : _h.status, (_j = e.response) === null || _j === void 0 ? void 0 : _j.data));
             event.target.removeAttribute('posX');
             event.target.removeAttribute('posY');
             removeCssTransform(event.target);