@verdocs/web-sdk 4.2.43 → 4.2.47

package/dist/components/verdocs-button2.js

@@ -16,7 +16,7 @@ const VerdocsButton = /*@__PURE__*/ proxyCustomElement(class VerdocsButton exten
         this.disabled = false;
     }
     render() {
-        return (h("button", { key: '5c9a79a82b7dab63acc557febfd7c9b143cafb2d', disabled: this.disabled, type: this.type, class: `${this.variant} ${this.size} ${this.type}` }, this.startIcon ? h("span", { class: "icon start", innerHTML: this.startIcon }) : null, h("span", { key: 'e57d793fad07ccccf2e15d3f1f01edaab971691c', class: "button-label" }, this.label), this.endIcon ? h("span", { class: "icon end", innerHTML: this.endIcon }) : null));
+        return (h("button", { key: '1b0a149ab51af95445b47bb17207bc3b44516be3', disabled: this.disabled, type: this.type, class: `${this.variant} ${this.size} ${this.type}` }, this.startIcon ? h("span", { class: "icon start", innerHTML: this.startIcon }) : null, h("span", { key: '4a868a010e47d300cc9b7dd31c7665f58c3f1986', class: "button-label" }, this.label), this.endIcon ? h("span", { class: "icon end", innerHTML: this.endIcon }) : null));
     }
     static get style() { return VerdocsButtonStyle0; }
 }, [0, "verdocs-button", {

package/dist/components/verdocs-checkbox2.js

@@ -15,7 +15,7 @@ const VerdocsCheckbox = /*@__PURE__*/ proxyCustomElement(class VerdocsCheckbox e
         this.disabled = false;
     }
     render() {
-        return (h(Host, { key: '02a992ff0c9365a18637ccd7b0acc34a16c95b0e', class: { disabled: this.disabled, [this.theme]: true } }, h("label", { key: '897f8d9d3f3365087a00ab0bb12b741c944a66a3' }, h("input", { key: '1e82031b5febc2cea4920e2c374a5f3cbff07889', type: "checkbox", value: this.value, name: this.name, checked: this.checked, disabled: this.disabled }), h("span", { key: 'a5b8a8518301ce6866228d7a66029abdc802e092' }, this.label))));
+        return (h(Host, { key: '134ddfacbf313ed3d8aaaae104e7ceefaf8f260f', class: { disabled: this.disabled, [this.theme]: true } }, h("label", { key: 'f4c5ad61ffc32acf46e42a22c9cfdb27b44d21c9' }, h("input", { key: 'edc72dbc12bb2f93daa6bf90fe8baddeee003a0f', type: "checkbox", value: this.value, name: this.name, checked: this.checked, disabled: this.disabled }), h("span", { key: '0d3a00d372dc0a0b2de109c1ee8c484153b789a7' }, this.label))));
     }
     static get style() { return VerdocsCheckboxStyle0; }
 }, [0, "verdocs-checkbox", {

package/dist/components/verdocs-component-error2.js

@@ -10,7 +10,7 @@ const VerdocsComponentError = /*@__PURE__*/ proxyCustomElement(class VerdocsComp
         this.message = '';
     }
     render() {
-        return (h(Host, { key: '572b854146e540ecb3fecdab0abe7a89bdc5f6e5' }, h("div", { key: 'b531eabc052b083f9a99b20d57df4dc0992a1ef0', class: "inner" }, this.message)));
+        return (h(Host, { key: '5fd53e1053d599dc955c727344dfbc48ddf13622' }, h("div", { key: 'bd877d18be032147ed72b999896f0cec3b021c95', class: "inner" }, this.message)));
     }
     static get style() { return VerdocsComponentErrorStyle0; }
 }, [0, "verdocs-component-error", {

package/dist/components/verdocs-contact-picker2.js

@@ -25,6 +25,8 @@ const VerdocsContactPicker = /*@__PURE__*/ proxyCustomElement(class VerdocsConta
         this.templateRole = null;
         this.contactSuggestions = [];
         this.name = undefined;
+        this.first_name = undefined;
+        this.last_name = undefined;
         this.email = undefined;
         this.phone = undefined;
         this.message = undefined;
@@ -35,12 +37,19 @@ const VerdocsContactPicker = /*@__PURE__*/ proxyCustomElement(class VerdocsConta
         this.kbaMethod = '';
         this.pinCode = '';
         this.nameFieldId = `verdocs-contact-picker-name-${Math.random().toString(36).substring(2, 11)}`;
+        this.firstNameFieldId = `verdocs-contact-picker-firstname-${Math.random().toString(36).substring(2, 11)}`;
+        this.lastNameFieldId = `verdocs-contact-picker-lastname-${Math.random().toString(36).substring(2, 11)}`;
         this.emailFieldId = `verdocs-contact-picker-email-${Math.random().toString(36).substring(2, 11)}`;
         this.phoneFieldId = `verdocs-contact-picker-phone-${Math.random().toString(36).substring(2, 11)}`;
     }
     componentWillLoad() {
         if (this.templateRole) {
+            const nameComponents = (this.templateRole.full_name || '').split(' ');
+            const firstName = nameComponents.shift() || '';
+            const lastName = nameComponents.join(' ');
             this.name = this.templateRole.full_name || '';
+            this.first_name = firstName;
+            this.last_name = lastName;
             this.email = this.templateRole.email || '';
             this.phone = this.templateRole.phone || '';
             this.delegator = this.templateRole.delegator || false;
@@ -78,6 +87,8 @@ const VerdocsContactPicker = /*@__PURE__*/ proxyCustomElement(class VerdocsConta
         this.showSuggestions = false;
         (_a = this.next) === null || _a === void 0 ? void 0 : _a.emit({
             full_name: this.name,
+            first_name: this.first_name,
+            last_name: this.last_name,
             email: this.email,
             phone: this.phone,
             message: this.message,
@@ -87,6 +98,8 @@ const VerdocsContactPicker = /*@__PURE__*/ proxyCustomElement(class VerdocsConta
     handleSelectSuggestion(e, suggestion) {
         e.stopPropagation();
         this.name = suggestion.name;
+        this.first_name = suggestion.first_name;
+        this.last_name = suggestion.last_name;
         this.email = suggestion.email;
         this.phone = suggestion.phone;
         this.showSuggestions = false;
@@ -94,26 +107,24 @@ const VerdocsContactPicker = /*@__PURE__*/ proxyCustomElement(class VerdocsConta
     // 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: 'd5f351153f58ec275d6bc7225db6aee53a5c54e6', onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("div", { key: '960ec06a72d7b14c6ad4609ccba90639b746e93e', class: "row" }, h("label", { key: '0ab66bf6689aa26132718cf673d7275708945ae4', htmlFor: this.nameFieldId }, "Name:"), h("input", { key: '25e2406d5b1ad78ada9c999fdefd3c16bccb60eb', id: this.nameFieldId, name: this.nameFieldId, type: "text", "data-lpignore": "true", autocomplete: "blocked", value: this.name, placeholder: "Recipient Name...", onFocus: () => { var _a; return (this.showSuggestions = ((_a = this.contactSuggestions) === null || _a === void 0 ? void 0 : _a.length) > 0); },
-            // onBlur={() => (this.showSuggestions = false)}
-            onInput: e => this.handleNameChange(e) }), this.showSuggestions && (h("div", { key: 'ec9dfb86c52a462005b00d857f2f945b6a5861a8', class: "dropdown" }, this.contactSuggestions.map(suggestion => {
+        return (h("form", { key: 'd4a74d3f95d9c13bf7b4afdc0391aafdc504b053', onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("div", { key: '329611e08994741cc94d01d62ab563ad182243ba', class: "row" }, h("label", { key: 'fd235b92d011939bbc20cf4efbe6428d953c454d', htmlFor: this.nameFieldId }, "Name:"), h("div", { key: 'e3531ddf8308a1be0a3fd43205fde1e99bca5dbc', style: { display: 'flex', flexDirection: 'row', gap: '8px;' } }, h("input", { key: 'b8bf71e3f6ce8e5aad6ee9cb03d1119935206f0c', 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.handleNameChange(e) }), h("input", { key: '9d53c8d43ed0ca4d3f17d39b6d90bece9afd68a7', id: this.lastNameFieldId, name: this.lastNameFieldId, type: "text", "data-lpignore": "true", autocomplete: "blocked", value: this.last_name, placeholder: "Last Name...", onFocus: () => { var _a; return (this.showSuggestions = ((_a = this.contactSuggestions) === null || _a === void 0 ? void 0 : _a.length) > 0); }, onInput: e => this.handleNameChange(e) })), this.showSuggestions && (h("div", { key: 'f53fc8a9ec12e31401afc4d22c98269ba96d0048', class: "dropdown" }, this.contactSuggestions.map(suggestion => {
             var _a;
             return (h("div", { key: (_a = suggestion.id) !== null && _a !== void 0 ? _a : suggestion.name, class: "suggestion", onClick: e => this.handleSelectSuggestion(e, suggestion) }, suggestion.avatar ? h("img", { alt: "Avatar", class: "avatar", src: suggestion.avatar }) : h("div", { class: "avatar", innerHTML: placeholderIcon }), h("div", { class: "details" }, h("div", { class: "name" }, suggestion.name), suggestion.email && h("div", { class: "destination" }, suggestion.email), suggestion.phone && h("div", { class: "destination" }, suggestion.phone))));
-        })))), h("div", { key: 'e8f2ee3647ffc37a31cb4f1d8a043183ce608268', class: "row" }, h("label", { key: '99840da172556066187691124358fd64c19c466d', htmlFor: this.emailFieldId }, "Email:"), h("input", { key: 'bba477caa2c14def36cf90f66bc164d58ccae999', 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: 'a3e045ec2fe78e1662c389c2fdb742165e67cbfd', class: "row" }, h("label", { key: '19257fb97c8b0163c7d3882130bb298388c57901', htmlFor: this.phoneFieldId }, "Phone:"), h("input", { key: 'ae3bbc51bed7039b716153675e3036abdf161382', 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: 'b05e51e9e9f1abb359113bea8cbc1c61c2979dbc', class: "row" }, h("div", { key: 'a905229b77e8b7941586834d4f942530d0b3d254', class: "label-with-icon" }, h("label", { key: 'b438b090c40ef5cd4c6550cd3cd57c676ab49061' }, "KBA:"), h("verdocs-help-icon", { key: '72fd391e008444b1f55c99833cc6f6e13670f199', 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: '8af56bf9b367faaec0777d4f0d555f9a0f1f4145', value: this.kbaMethod, onInput: (e) => (this.kbaMethod = e.target.value), options: [
+        })))), h("div", { key: '29211a4aeccb45c1f6ce4581ce89eef56fd0efa0', class: "row" }, h("label", { key: '32fb4eaa0599ea08364af828e93dd182ee36b42b', htmlFor: this.emailFieldId }, "Email:"), h("input", { key: '9a75b49d558dab786d4cec8e74e1d4970da63467', 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: 'd5e07b3b8b24283acb158a8b44a981b1281c0964', class: "row" }, h("label", { key: '0d76a478038a18d4b16f73c14fe8ec53a014ca37', htmlFor: this.phoneFieldId }, "Phone:"), h("input", { key: '7c957fa5584d100e08bcb4ef808ec21ef507df32', 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: '3d48f1e8c4941700ecbc07a57fa3a8e22e866c26', class: "row" }, h("div", { key: '94f76f6449c8939dbd989507d03f8c7323b0487d', class: "label-with-icon" }, h("label", { key: '516dd082ac4cd08e881bffc1ab22d14ed3cc4c52' }, "KBA:"), h("verdocs-help-icon", { key: 'e12ca24140bbcfb1645c14c2bfcf3e7326d3033a', 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: 'eadc53ce819c1ff21a9a3c51e4771a8dd7076eee', 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: '504c018a9c8ad9087ddd6b253b794c493bb16686', 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: '0506d342d5fcbdc812498ffbf19bcd9bd2d1abca', class: "row" }, h("label", { key: 'e62684bc9178188fed71eb77954b186511a0c29d', htmlFor: "verdocs-contact-picker-message" }, "Message:"), h("input", { key: 'b9638d6435b7d0dc8815f20e42c2b5498ab308a0', 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: 'efc4e30feb9b3c58cc39e85725a6b780d424ca6e', class: "buttons" }, h("verdocs-toggle-button", { key: '6146346933119b33a1cd494e21e0d1a0195378cc', icon: kbaIcon, size: "small", active: this.showKba, onToggle: e => {
+            ] }), this.kbaMethod === 'pin' && (h("input", { key: 'db7162ba5935448fdf6b335b57c2ac91283563b6', 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: '2ff18d49d7bd4181ba6fbf1ecacb64ba458b66d2', class: "row" }, h("label", { key: '2c22e7f0c17c5e86e4c920399ba3d4b0500a495e', htmlFor: "verdocs-contact-picker-message" }, "Message:"), h("input", { key: 'ff3a0a753f1cb6418e02cb0f4abffbe540fd4213', 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: 'cec56a872a810a5cedc49e57f3afe1ecf3c3ade6', class: "buttons" }, h("verdocs-toggle-button", { key: '6f9e177a3e8d077144b5d4382a18a95b44616d12', 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: 'ba3139369cb582ec7ca246f4ad08a58998eca1eb', icon: messageIcon, size: "small", active: this.showMessage, onToggle: e => {
+            } }), h("verdocs-toggle-button", { key: '8d7468bdc795eff356f4636bff62b9536c0a2d59', icon: messageIcon, size: "small", active: this.showMessage, onToggle: e => {
                 this.showMessage = e.detail.active;
                 this.showSuggestions = false;
-            } }), h("div", { key: '52ab10bc5857dc55244d064c20a2d59eb67bca82', class: "flex-fill" }), h("verdocs-button", { key: '4eedb7f847d8004567c24f25c7efa2ae9d6da61b', variant: "outline", label: "Cancel", size: "small", onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: '4b4b461f150eaf575e4b22760388ecea92f7da54', label: "OK", size: "small", onClick: e => this.handleSubmit(e) }))));
+            } }), h("div", { key: 'a902c45f33e944655d42f758b67c082fa57c93ca', class: "flex-fill" }), h("verdocs-button", { key: 'b24bce7779c3049c5f578cc55b2dec550258c57a', variant: "outline", label: "Cancel", size: "small", onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: '6445645ad05e49aa28c149bed65ee95ce6889e2a', label: "OK", size: "small", onClick: e => this.handleSubmit(e) }))));
     }
     static get style() { return VerdocsContactPickerStyle0; }
 }, [0, "verdocs-contact-picker", {
@@ -121,6 +132,8 @@ const VerdocsContactPicker = /*@__PURE__*/ proxyCustomElement(class VerdocsConta
         "templateRole": [16],
         "contactSuggestions": [16],
         "name": [32],
+        "first_name": [32],
+        "last_name": [32],
         "email": [32],
         "phone": [32],
         "message": [32],
@@ -131,6 +144,8 @@ const VerdocsContactPicker = /*@__PURE__*/ proxyCustomElement(class VerdocsConta
         "kbaMethod": [32],
         "pinCode": [32],
         "nameFieldId": [32],
+        "firstNameFieldId": [32],
+        "lastNameFieldId": [32],
         "emailFieldId": [32],
         "phoneFieldId": [32]
     }]);

package/dist/components/verdocs-dialog.js

@@ -18,7 +18,7 @@ const VerdocsDialog$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsDialog ext
         }
     }
     render() {
-        return (h(Host, { key: '952c27946d1eb8552949ac29d9ffaa05222baaba' }, h("div", { key: '4721082da97c31ddb4e29b05922749b42ab38845', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '80e01d2ee87fd7ffbdd789068587d11ab4323644', class: "dialog" }, h("slot", { key: 'f55b17d75983192918a7c8b5b7df87ca22259b7b', name: "title" }, h("div", { key: '0ebb27bff2de5a06232e419cf9eeff67abddbb3a', class: "heading" }, "Please Confirm")), h("div", { key: 'c93aa214cf8f4c034611f1638dff493a9b2066e2', class: "content" }, h("slot", { key: '7473721bf10ed5dfe388e3d17aec8ee67a5e193f' }))))));
+        return (h(Host, { key: '6248990033ba71022795432afa8679841450431e' }, h("div", { key: 'bdea70156c5d1776977bf7947e326ed118367f82', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '5c8cec9a24b0a892aeb2325a87a6d238ad211992', class: "dialog" }, h("slot", { key: '001678f28acc1ca78772dfa2d2f9cb56c6e1074d', name: "title" }, h("div", { key: 'b5c86535f40180659a6e21b31193c6d0cdd0c706', class: "heading" }, "Please Confirm")), h("div", { key: 'e6c8eddfe1c541d34ac2380f78564bc80b736564', class: "content" }, h("slot", { key: '6d22d23df835be6339b7629a21fe3a3a802eb9b9' }))))));
     }
     static get style() { return VerdocsDialogStyle0; }
 }, [4, "verdocs-dialog"]);

package/dist/components/verdocs-dropdown2.js

@@ -88,7 +88,7 @@ const VerdocsDropdown = /*@__PURE__*/ proxyCustomElement(class VerdocsDropdown e
         (_a = document.getElementById(MENU_ID)) === null || _a === void 0 ? void 0 : _a.remove();
     }
     render() {
-        return (h(Host, { key: '3a0ecbe96fffea8c916de9a657afd891dc95fa01' }, h("button", { key: 'bf194fdde69ec6a4e9edfa897eefe57daaa847d2', class: "arrow", innerHTML: DropdownArrow, "aria-label": "Open Menu", onClick: e => this.toggle(e),
+        return (h(Host, { key: '006ffc94bd4cdc84424e001b2ff146f44fa268be' }, h("button", { key: '77c15671bb969bd79ed476d647642fdc70909f5f', class: "arrow", innerHTML: DropdownArrow, "aria-label": "Open Menu", onClick: e => this.toggle(e),
             // onBlur={() => this.hide()}
             ref: el => (this.dropdownButton = el) })));
     }

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

@@ -76,7 +76,7 @@ const VerdocsEnvelopeDocumentPage = /*@__PURE__*/ proxyCustomElement(class Verdo
     }
     render() {
         const height = `${this.renderedHeight}px`;
-        return (h(Host, { key: '1626cbea713462254f8d518479181a39156fd599', 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: 'f4ffa325b8eb3f8047dbe704cfc89aeeee1aad26', 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/components/verdocs-envelope-sidebar.js

@@ -11,7 +11,7 @@ import { d as defineCustomElement$3 } from './verdocs-envelope-recipient-summary
 import { d as defineCustomElement$2 } from './verdocs-ok-dialog2.js';
 import { d as dateFns } from './index2.js';
 
-const verdocsEnvelopeSidebarCss = "@-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-envelope-sidebar{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;-ms-flex-direction:row;flex-direction:row;display:-ms-flexbox;display:flex;-ms-flex:0 0 56px;flex:0 0 56px;width:56px;min-height:400px;height:100%;background:#41435e;-webkit-transition:0.5s cubic-bezier(0.35, 0, 0.25, 1);transition:0.5s cubic-bezier(0.35, 0, 0.25, 1)}verdocs-envelope-sidebar.open{-ms-flex:0 0 400px;flex:0 0 400px;max-width:100%;width:400px}@media screen and (max-width: 500px){verdocs-envelope-sidebar.open{-ms-flex:0 0 300px;flex:0 0 300px;width:300px}}verdocs-envelope-sidebar .side-buttons{-ms-flex-direction:column;flex-direction:column;-ms-flex:0 0 56px;flex:0 0 56px;display:-ms-flexbox;display:flex}verdocs-envelope-sidebar .side-buttons button{height:50px;outline:none;border:none;border-left:2px solid transparent;background:none;width:100%}verdocs-envelope-sidebar .side-buttons button.active{border-left:2px solid #50bd80}verdocs-envelope-sidebar .side-buttons button svg{color:white;width:24px;height:24px}verdocs-envelope-sidebar .content{-ms-flex:1;flex:1;display:none;color:white;-ms-flex-direction:column;flex-direction:column;padding:12px 16px 16px}verdocs-envelope-sidebar.open .content{display:-ms-flexbox;display:flex;overflow-y:scroll}verdocs-envelope-sidebar verdocs-ok-dialog .content{color:black}verdocs-envelope-sidebar .title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:12px;font-size:16px;line-height:24px;font-weight:400}verdocs-envelope-sidebar .label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;line-height:16px;color:rgba(255, 255, 255, 0.54)}verdocs-envelope-sidebar .value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:14px;font-size:14px;font-weight:500;line-height:16px;color:#fff}verdocs-envelope-sidebar .manage-recipients-button{-ms-flex-item-align:center;align-self:center;white-space:nowrap;width:100%;margin:0 0 10px 0}verdocs-envelope-sidebar .manage-recipients-button .label{color:#ffffff;font-size:14px}verdocs-envelope-sidebar .manage-recipients-button button{width:100%}verdocs-envelope-sidebar .recipient-detail{-ms-flex:0;flex:0;padding:8px;position:relative;-ms-flex-direction:column;flex-direction:column;border:solid 1px #979797;margin-bottom:16px}verdocs-envelope-sidebar .recipient-header{-ms-flex-direction:row;flex-direction:row;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;place-content:center space-between;-ms-flex-align:center;align-items:center;margin-bottom:4px}verdocs-envelope-sidebar .recipient-number{width:24px;height:24px;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;border-radius:24px;font-size:14px;font-weight:500;margin-right:10px;border:solid 1px #979797}verdocs-envelope-sidebar .recipient-type{-ms-flex:1 1 88px;flex:1 1 88px;-webkit-box-sizing:border-box;box-sizing:border-box;max-width:88px;min-width:88px;text-transform:capitalize}verdocs-envelope-sidebar .recipient-status{-ms-flex:1 1 100px;flex:1 1 100px;border-radius:5px;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box;max-width:100px;min-width:100px;background-color:#616161;text-transform:capitalize;font-size:14px;padding:3px 0}verdocs-envelope-sidebar .recipient-status.invited{background-color:#ff8f00}verdocs-envelope-sidebar .recipient-status.opened{background-color:#616161}verdocs-envelope-sidebar .recipient-status.signed,verdocs-envelope-sidebar .recipient-status.submitted{background-color:#2e7d32}verdocs-envelope-sidebar .recipient-status.pending{background-color:#0277bd}verdocs-envelope-sidebar .recipient-status.canceled,verdocs-envelope-sidebar .recipient-status.declined{background-color:#c62828}@media screen and (max-width: 500px){verdocs-envelope-sidebar .recipient-status{-ms-flex:1 1 60px;flex:1 1 60px;max-width:60px;min-width:60px}}verdocs-envelope-sidebar .recipient-content{-ms-flex-direction:column;flex-direction:column}verdocs-envelope-sidebar .recipient-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}verdocs-envelope-sidebar .history-entry{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;padding:8px 0 0;margin:8px 0 0;border-top:1px solid #dddddd}verdocs-envelope-sidebar .history-entry .activity-icon{margin-right:14px}verdocs-envelope-sidebar .history-entry .activity-icon svg{width:24px;height:24px;fill:#ffffff}verdocs-envelope-sidebar .history-entry .activity-text{font-size:14px;line-height:16px;margin-bottom:4px}verdocs-envelope-sidebar .history-entry .activity-date{font-size:12px;line-height:16px;color:rgba(255, 255, 255, 0.54)}verdocs-envelope-sidebar .content .history-entry:first-of-type{border-top:none}";
+const verdocsEnvelopeSidebarCss = "@-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-envelope-sidebar{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;-ms-flex-direction:row;flex-direction:row;display:-ms-flexbox;display:flex;-ms-flex:0 0 56px;flex:0 0 56px;width:56px;min-height:400px;height:100%;background:#41435e;-webkit-transition:0.5s cubic-bezier(0.35, 0, 0.25, 1);transition:0.5s cubic-bezier(0.35, 0, 0.25, 1)}verdocs-envelope-sidebar.open{-ms-flex:0 0 400px;flex:0 0 400px;max-width:100%;width:400px}@media screen and (max-width: 500px){verdocs-envelope-sidebar.open{-ms-flex:0 0 300px;flex:0 0 300px;width:300px}}verdocs-envelope-sidebar .side-buttons{-ms-flex-direction:column;flex-direction:column;-ms-flex:0 0 56px;flex:0 0 56px;display:-ms-flexbox;display:flex}verdocs-envelope-sidebar .side-buttons button{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;height:50px;outline:none;border:none;border-left:2px solid transparent;background:none;width:100%}verdocs-envelope-sidebar .side-buttons button.active{border-left:2px solid #50bd80}verdocs-envelope-sidebar .side-buttons button svg{color:white;width:24px;height:24px}verdocs-envelope-sidebar .content{-ms-flex:1;flex:1;display:none;color:white;-ms-flex-direction:column;flex-direction:column;padding:12px 16px 16px}verdocs-envelope-sidebar.open .content{display:-ms-flexbox;display:flex;overflow-y:scroll}verdocs-envelope-sidebar verdocs-ok-dialog .content{color:black}verdocs-envelope-sidebar .title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:12px;font-size:16px;line-height:24px;font-weight:400}verdocs-envelope-sidebar .label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;line-height:16px;color:rgba(255, 255, 255, 0.54)}verdocs-envelope-sidebar .value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:14px;font-size:14px;font-weight:500;line-height:16px;color:#fff}verdocs-envelope-sidebar .manage-recipients-button{-ms-flex-item-align:center;align-self:center;white-space:nowrap;width:100%;margin:0 0 10px 0}verdocs-envelope-sidebar .manage-recipients-button .label{color:#ffffff;font-size:14px}verdocs-envelope-sidebar .manage-recipients-button button{width:100%}verdocs-envelope-sidebar .recipient-detail{-ms-flex:0;flex:0;padding:8px;position:relative;-ms-flex-direction:column;flex-direction:column;border:solid 1px #979797;margin-bottom:16px}verdocs-envelope-sidebar .recipient-header{-ms-flex-direction:row;flex-direction:row;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;place-content:center space-between;-ms-flex-align:center;align-items:center;margin-bottom:4px}verdocs-envelope-sidebar .recipient-number{width:24px;height:24px;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;border-radius:24px;font-size:14px;font-weight:500;margin-right:10px;border:solid 1px #979797}verdocs-envelope-sidebar .recipient-type{-ms-flex:1 1 88px;flex:1 1 88px;-webkit-box-sizing:border-box;box-sizing:border-box;max-width:88px;min-width:88px;text-transform:capitalize}verdocs-envelope-sidebar .recipient-status{-ms-flex:1 1 100px;flex:1 1 100px;border-radius:5px;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box;max-width:100px;min-width:100px;background-color:#616161;text-transform:capitalize;font-size:14px;padding:3px 0}verdocs-envelope-sidebar .recipient-status.invited{background-color:#ff8f00}verdocs-envelope-sidebar .recipient-status.opened{background-color:#616161}verdocs-envelope-sidebar .recipient-status.signed,verdocs-envelope-sidebar .recipient-status.submitted{background-color:#2e7d32}verdocs-envelope-sidebar .recipient-status.pending{background-color:#0277bd}verdocs-envelope-sidebar .recipient-status.canceled,verdocs-envelope-sidebar .recipient-status.declined{background-color:#c62828}@media screen and (max-width: 500px){verdocs-envelope-sidebar .recipient-status{-ms-flex:1 1 60px;flex:1 1 60px;max-width:60px;min-width:60px}}verdocs-envelope-sidebar .recipient-content{-ms-flex-direction:column;flex-direction:column}verdocs-envelope-sidebar .recipient-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}verdocs-envelope-sidebar .history-entry{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;padding:8px 0 0;margin:8px 0 0;border-top:1px solid #dddddd}verdocs-envelope-sidebar .history-entry .activity-icon{margin-right:14px}verdocs-envelope-sidebar .history-entry .activity-icon svg{width:24px;height:24px;fill:#ffffff}verdocs-envelope-sidebar .history-entry .activity-text{font-size:14px;line-height:16px;margin-bottom:4px}verdocs-envelope-sidebar .history-entry .activity-date{font-size:12px;line-height:16px;color:rgba(255, 255, 255, 0.54)}verdocs-envelope-sidebar .content .history-entry:first-of-type{border-top:none}";
 const VerdocsEnvelopeSidebarStyle0 = verdocsEnvelopeSidebarCss;
 
 const InformationCircle = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#ffffff"><path stroke-linecap="round" stroke-linejoin="round" d="M11.25 11.25l.041-.02a.75.75 0 011.063.852l-.708 2.836a.75.75 0 001.063.853l.041-.021M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9-3.75h.008v.008H12V8.25z" /></svg>`;

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

@@ -203,18 +203,18 @@ const VerdocsEnvelopesList$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsEnv
         });
     }
     render() {
-        return (h(Host, { key: 'c97d8d4415fb171c1335d3fbef9a885329740613' }, h("div", { key: 'dc0117f6476648985fdad07525e3c10c0a4542d3', class: "header" }, h("div", { key: 'ebd6521d3e9afd5ff9883829c7f66c55f31e7659', class: "filter" }, h("verdocs-text-input", { key: 'a5c15206146898551ac7ec9e22385335d1215d0a', id: "verdocs-filter-name", value: this.match, clearable: true, autocomplete: "off", placeholder: "Filter by Name, Recipient, or Field...", onFocusout: (e) => {
+        return (h(Host, { key: 'f2d9959d6f173c5f43075cd8e983bfaa204b4d74' }, h("div", { key: '13d4ba423c58911e560b3f0fcd005aefaac9bf85', class: "header" }, h("div", { key: '856651a72ebaa3402985a07adf898c1248ab90fc', class: "filter" }, h("verdocs-text-input", { key: '36e95337804ee01a54c2a2cb09770ceae1a3be12', 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: '497b419b0789a338264523b52e6c2f15de6d02fe', label: "View", value: this.view, options: ViewFilters, onOptionSelected: e => {
+            } })), h("verdocs-quick-filter", { key: 'f3a65dcdbfa5eeae30d0b5c97b936197d48a0c6f', label: "View", value: this.view, options: ViewFilters, onOptionSelected: e => {
                 this.view = e.detail.value;
-            } }), this.view === 'all' && (h("verdocs-quick-filter", { key: 'ca4c1472e25cf458699a5b3cbd7bd55156938a59', label: "Status", value: this.status, options: StatusFilters, onOptionSelected: e => {
+            } }), this.view === 'all' && (h("verdocs-quick-filter", { key: '4eea6c7923251c0d9758cf7eb1fd1e13f62d3e77', label: "Status", value: this.status, options: StatusFilters, onOptionSelected: e => {
                 this.status = e.detail.value;
-            } })), this.view === 'all' && (h("verdocs-quick-filter", { key: '232cacdc7d067961da8d1c9482d07c6e76b84d38', label: "Sort By", value: this.sort, options: SortFilters, onOptionSelected: e => {
+            } })), this.view === 'all' && (h("verdocs-quick-filter", { key: '6b5495e7e03b06f4b0dd0cbccada866a04f0efe8', label: "Sort By", value: this.sort, options: SortFilters, onOptionSelected: e => {
                 this.sort = e.detail.value;
-            } })), this.loading && h("verdocs-spinner", { key: '44c39036f7ac8358a9c8b658e533c393413dc4db', mode: "dark", size: 24 }), h("div", { key: 'f5b8246bf8cdfa9737b8675b59e44fc45df3cc06', style: { display: 'flex', flex: '1' } }), this.selectedEnvelopes.length > 0 && h("verdocs-button", { key: '9c6f32a107c15af7173ae4fd2ac16265bcc8be6f', label: `Download (${this.selectedEnvelopes.length})`, onClick: () => this.handleDownload() })), this.envelopes.map(envelope => {
+            } })), this.loading && h("verdocs-spinner", { key: 'c37a510b39de9bd7ddb8617cc3af592eb88a260d', mode: "dark", size: 24 }), h("div", { key: '04db9eca9b23e3dceb163d8cb6bcf766cfb28fa2', style: { display: 'flex', flex: '1' } }), this.selectedEnvelopes.length > 0 && h("verdocs-button", { key: '0fd88565bbc87bf75c164715a8cc69099c39ba01', 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);
@@ -255,7 +255,7 @@ const VerdocsEnvelopesList$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsEnv
                             break;
                     }
                 } }))));
-        }), !this.initiallyLoaded && (h("div", { key: '3008dcd8a557d2f47041455cf9fa554bbcc0b229', style: { width: '100%' } }, integerSequence(0, this.rowsPerPage).map(() => (h("div", { class: "envelope-placeholder" }))))), this.initiallyLoaded && !this.envelopes.length && h("div", { key: 'f1e6ffe23cd5c2d9cf18bafadbf0b61e70984f4d', 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: '61a9e69c17606600ecce9926286a019a4bd3f6e2', style: { width: '100%' } }, integerSequence(0, this.rowsPerPage).map(() => (h("div", { class: "envelope-placeholder" }))))), this.initiallyLoaded && !this.envelopes.length && h("div", { key: '8b351e5c629ef3d4610a56b26f0eb264f7b4e6ff', 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/components/verdocs-field-attachment2.js

@@ -1,9 +1,8 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host, Fragment } from '@stencil/core/internal/client';
 import { i as interact } from './interact.min.js';
 import { VerdocsEndpoint, updateField, getRGBA } from '@verdocs/js-sdk';
-import { g as getTemplateRoleStore, a as getRoleIndex } from './TemplateRoleStore.js';
 import { g as getTemplateFieldStore, u as updateStoreField } from './TemplateFieldStore.js';
-import { g as getFieldSettings } from './utils.js';
+import { g as getTemplateRoleStore, a as getRoleIndex } from './TemplateRoleStore.js';
 import { S as SettingsIcon } from './Icons.js';
 import { d as defineCustomElement$9 } from './verdocs-button2.js';
 import { d as defineCustomElement$8 } from './verdocs-checkbox2.js';
@@ -94,15 +93,13 @@ const VerdocsFieldAttachment = /*@__PURE__*/ proxyCustomElement(class VerdocsFie
         Object.assign(e.target.dataset, { x, y, h });
     }
     handleResizeEnd(e) {
-        const field = this.fieldStore.get('fields').find(field => field.name === this.fieldname);
-        const newSettings = { ...getFieldSettings(field) };
-        newSettings.width = Math.round(parseFloat(e.target.style.width));
-        newSettings.height = Math.round(parseFloat(e.target.style.height));
-        updateField(this.endpoint, this.templateid, this.fieldname, { settings: newSettings })
+        const width = Math.round(parseFloat(e.target.style.width));
+        const height = Math.round(parseFloat(e.target.style.height));
+        updateField(this.endpoint, this.templateid, this.fieldname, { width, height })
             .then(field => {
             var _a;
             updateStoreField(this.fieldStore, this.fieldname, field);
-            (_a = this.settingsChanged) === null || _a === void 0 ? void 0 : _a.emit({ fieldName: field.name, settings: newSettings, field });
+            (_a = this.settingsChanged) === null || _a === void 0 ? void 0 : _a.emit({ fieldName: field.name, field });
             Object.assign(e.target.dataset, { x: 0, y: 0, h: 0 });
         })
             .catch(e => console.log('Field update failed', e));
@@ -122,10 +119,9 @@ const VerdocsFieldAttachment = /*@__PURE__*/ proxyCustomElement(class VerdocsFie
     render() {
         const { templateid, fieldname = '', editable = false, done = false, disabled = false, xscale = 1, yscale = 1 } = this;
         const field = this.fieldStore.get('fields').find(field => field.name === fieldname);
-        const { required = false, role_name = '' } = field || {};
-        const { result: url = '' } = getFieldSettings(field);
+        const { required = false, role_name = '', value = '' } = field || {};
         const backgroundColor = getRGBA(getRoleIndex(this.roleStore, role_name));
-        const hasFile = url || !!this.selectedFile;
+        const hasFile = value || !!this.selectedFile;
         if (done) {
             return (h(Host, { class: { done } }, h("span", { innerHTML: hasFile ? AttachedIcon : PaperclipIcon })));
         }

package/dist/components/verdocs-field-checkbox2.js

@@ -2,7 +2,6 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host, Fragment } from
 import { getRGBA } from '@verdocs/js-sdk';
 import { g as getTemplateRoleStore, a as getRoleIndex } from './TemplateRoleStore.js';
 import { g as getTemplateFieldStore } from './TemplateFieldStore.js';
-import { g as getFieldSettings } from './utils.js';
 import { S as SettingsIcon } from './Icons.js';
 import { d as defineCustomElement$8 } from './verdocs-button2.js';
 import { d as defineCustomElement$7 } from './verdocs-checkbox2.js';
@@ -26,7 +25,6 @@ const VerdocsFieldCheckbox = /*@__PURE__*/ proxyCustomElement(class VerdocsField
         this.roleStore = null;
         this.templateid = '';
         this.fieldname = '';
-        this.option = 0;
         this.disabled = false;
         this.done = false;
         this.editable = false;
@@ -53,12 +51,13 @@ const VerdocsFieldCheckbox = /*@__PURE__*/ proxyCustomElement(class VerdocsField
         this.roleStore = getTemplateRoleStore(this.templateid);
     }
     render() {
-        const { templateid, fieldname = '', option, editable = false, done = false, disabled = false, xscale = 1, yscale = 1 } = this;
+        const { templateid, fieldname = '', editable = false, done = false, disabled = false, xscale = 1, yscale = 1 } = this;
         const field = this.fieldStore.get('fields').find(field => field.name === fieldname);
         const { required = false, role_name = '' } = field || {};
-        const { options = [] } = getFieldSettings(field);
         const backgroundColor = getRGBA(getRoleIndex(this.roleStore, role_name));
-        const { id = 'option1', checked = false } = options[option] || {};
+        // TODO
+        const { id = 'option1', checked = false } = {};
+        // const {id = 'option1', checked = false} = options[option] || {};
         const fieldId = `${fieldname}-${id}`;
         if (done) {
             return h(Host, { class: { done } }, checked ? '✓' : '☐');
@@ -80,7 +79,6 @@ const VerdocsFieldCheckbox = /*@__PURE__*/ proxyCustomElement(class VerdocsField
 }, [0, "verdocs-field-checkbox", {
         "templateid": [513],
         "fieldname": [513],
-        "option": [514],
         "disabled": [516],
         "done": [516],
         "editable": [516],

package/dist/components/verdocs-field-date2.js

@@ -5,7 +5,6 @@ import { getRGBA } from '@verdocs/js-sdk';
 import { c as commonjsGlobal } from './_commonjsHelpers.js';
 import { g as getTemplateRoleStore, a as getRoleIndex } from './TemplateRoleStore.js';
 import { g as getTemplateFieldStore } from './TemplateFieldStore.js';
-import { g as getFieldSettings } from './utils.js';
 import { S as SettingsIcon } from './Icons.js';
 import { a as FORMAT_DATE } from './Types.js';
 import { d as defineCustomElement$8 } from './verdocs-button2.js';
@@ -16171,8 +16170,7 @@ const VerdocsFieldDate = /*@__PURE__*/ proxyCustomElement(class VerdocsFieldDate
     render() {
         const { templateid, fieldname = '', containerId = '', editable = false, focused, done = false, disabled = false, xscale = 1, yscale = 1 } = this;
         const field = this.fieldStore.get('fields').find(field => field.name === fieldname);
-        const { required = false, role_name = '', placeholder = 'Date...' } = field || {};
-        const { result: value = '' } = getFieldSettings(field);
+        const { required = false, role_name = '', placeholder = 'Date...', value = '' } = field || {};
         const backgroundColor = getRGBA(getRoleIndex(this.roleStore, role_name));
         const formattedValue = value ? dateFns.format(new Date(value), FORMAT_DATE) : '';
         if (this.done) {

package/dist/components/verdocs-field-dropdown2.js

@@ -2,7 +2,6 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host, Fragment } from
 import { getRGBA } from '@verdocs/js-sdk';
 import { g as getTemplateRoleStore, a as getRoleIndex } from './TemplateRoleStore.js';
 import { g as getTemplateFieldStore } from './TemplateFieldStore.js';
-import { g as getFieldSettings } from './utils.js';
 import { S as SettingsIcon } from './Icons.js';
 import { d as defineCustomElement$8 } from './verdocs-button2.js';
 import { d as defineCustomElement$7 } from './verdocs-checkbox2.js';
@@ -61,8 +60,9 @@ const VerdocsFieldDropdown = /*@__PURE__*/ proxyCustomElement(class VerdocsField
     render() {
         const { templateid, fieldname = '', editable = false, done = false, disabled = false, xscale = 1, yscale = 1 } = this;
         const field = this.fieldStore.get('fields').find(field => field.name === fieldname);
-        const { required = false, role_name = '' } = field || {};
-        const { result: value = '', options = [] } = getFieldSettings(field);
+        const { required = false, role_name = '', value = '' } = field || {};
+        // TODO:
+        const options = [];
         const backgroundColor = getRGBA(getRoleIndex(this.roleStore, role_name));
         if (done) {
             return h(Host, { class: { done } }, value);

package/dist/components/verdocs-field-initial2.js

@@ -2,7 +2,6 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host, Fragment } from
 import { getRGBA } from '@verdocs/js-sdk';
 import { g as getTemplateRoleStore, a as getRoleIndex } from './TemplateRoleStore.js';
 import { g as getTemplateFieldStore } from './TemplateFieldStore.js';
-import { g as getFieldSettings } from './utils.js';
 import { S as SettingsIcon } from './Icons.js';
 import { d as defineCustomElement$9 } from './verdocs-button2.js';
 import { d as defineCustomElement$8 } from './verdocs-checkbox2.js';
@@ -68,7 +67,7 @@ const VerdocsFieldInitial = /*@__PURE__*/ proxyCustomElement(class VerdocsFieldI
         this.dialog.setAttribute('initials', this.initials);
         // this.dialog.setAttribute('roleindex', this.roleindex);
         this.dialog.addEventListener('exit', () => this.hideDialog());
-        this.dialog.addEventListener('next', e => this.handleAdopt(e));
+        this.dialog.addEventListener('next', (e) => this.handleAdopt(e));
         document.body.append(this.dialog);
         this.focused = true;
     }
@@ -87,8 +86,7 @@ const VerdocsFieldInitial = /*@__PURE__*/ proxyCustomElement(class VerdocsFieldI
     render() {
         const { templateid, fieldname = '', editable = false, focused, done = false, disabled = false, xscale = 1, yscale = 1 } = this;
         const field = this.fieldStore.get('fields').find(field => field.name === fieldname);
-        const { required = false, role_name = '' } = field || {};
-        const { result: value = '' } = getFieldSettings(field);
+        const { required = false, role_name = '', value = '' } = field || {};
         const backgroundColor = getRGBA(getRoleIndex(this.roleStore, role_name));
         if (done) {
             return h(Host, { class: { done } }, value && h("img", { src: value, alt: "Initial" }));

package/dist/components/verdocs-field-payment.js

@@ -47,7 +47,7 @@ const VerdocsFieldPayment$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsFiel
         // Load fields
         // Get role names
         if (this.recipients && this.recipients.length > 0) {
-            const preparer = this.recipients.find(r => r.type === 'preparer');
+            const preparer = this.recipients.find((r) => r.type === 'preparer');
             console.log('Found preparer', preparer);
             if (preparer) {
                 this.preparedMessage = `Prepared by ${preparer['full_name']}`;

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

@@ -2,7 +2,6 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host, Fragment } from
 import { getRGBA } from '@verdocs/js-sdk';
 import { g as getTemplateRoleStore, a as getRoleIndex } from './TemplateRoleStore.js';
 import { g as getTemplateFieldStore } from './TemplateFieldStore.js';
-import { g as getFieldSettings } from './utils.js';
 import { S as SettingsIcon } from './Icons.js';
 import { d as defineCustomElement$9 } from './verdocs-button2.js';
 import { d as defineCustomElement$8 } from './verdocs-checkbox2.js';
@@ -28,7 +27,6 @@ const VerdocsFieldRadio$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsFieldR
         this.roleStore = null;
         this.templateid = '';
         this.fieldname = '';
-        this.option = 0;
         this.disabled = false;
         this.done = false;
         this.editable = false;
@@ -55,12 +53,13 @@ const VerdocsFieldRadio$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsFieldR
         this.roleStore = getTemplateRoleStore(this.templateid);
     }
     render() {
-        const { templateid, fieldname = '', option, editable = false, done = false, disabled = false, xscale = 1, yscale = 1 } = this;
+        const { templateid, fieldname = '', editable = false, done = false, disabled = false, xscale = 1, yscale = 1 } = this;
         const field = this.fieldStore.get('fields').find(field => field.name === fieldname);
         const { required = false, role_name = '' } = field || {};
-        const { options = [] } = getFieldSettings(field);
         const backgroundColor = getRGBA(getRoleIndex(this.roleStore, role_name));
-        const { id = 'option1', selected = false } = options[option] || {};
+        // TODO
+        const { id = 'option1', selected = false } = {};
+        // const {id = 'option1', selected = false} = options[option] || {};
         const fieldId = `${fieldname}-${id}`;
         if (done) {
             return (h(Host, { class: { done }, style: { maxWidth: '10px' } }, h("span", { innerHTML: selected ? RadioIconSelected : RadioIconUnselected })));
@@ -82,7 +81,6 @@ const VerdocsFieldRadio$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsFieldR
 }, [0, "verdocs-field-radio", {
         "templateid": [513],
         "fieldname": [513],
-        "option": [514],
         "disabled": [516],
         "done": [516],
         "editable": [516],

package/dist/components/verdocs-field-signature2.js

@@ -2,7 +2,6 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host, Fragment } from
 import { getRGBA } from '@verdocs/js-sdk';
 import { g as getTemplateRoleStore, a as getRoleIndex } from './TemplateRoleStore.js';
 import { g as getTemplateFieldStore } from './TemplateFieldStore.js';
-import { g as getFieldSettings } from './utils.js';
 import { S as SettingsIcon } from './Icons.js';
 import { d as defineCustomElement$9 } from './verdocs-button2.js';
 import { d as defineCustomElement$8 } from './verdocs-checkbox2.js';
@@ -62,7 +61,7 @@ const VerdocsFieldSignature = /*@__PURE__*/ proxyCustomElement(class VerdocsFiel
         this.dialog.setAttribute('name', this.name);
         // this.dialog.setAttribute('roleindex', this.roleindex);
         this.dialog.addEventListener('exit', () => this.hideDialog());
-        this.dialog.addEventListener('next', e => this.handleAdopt(e));
+        this.dialog.addEventListener('next', (e) => this.handleAdopt(e));
         document.body.append(this.dialog);
         this.focused = true;
     }
@@ -85,8 +84,7 @@ const VerdocsFieldSignature = /*@__PURE__*/ proxyCustomElement(class VerdocsFiel
     render() {
         const { templateid, fieldname = '', editable = false, focused, done = false, disabled = false, xscale = 1, yscale = 1 } = this;
         const field = this.fieldStore.get('fields').find(field => field.name === fieldname);
-        const { required = false, role_name = '' } = field || {};
-        const { result: value = '' } = getFieldSettings(field);
+        const { required = false, role_name = '', value = '' } = field || {};
         const backgroundColor = getRGBA(getRoleIndex(this.roleStore, role_name));
         if (done) {
             return h(Host, { class: { done } }, value && h("img", { src: value, alt: "Signature" }));

package/dist/components/verdocs-field-textarea2.js

@@ -3,7 +3,6 @@ import { i as interact } from './interact.min.js';
 import { VerdocsEndpoint, updateField, getRGBA } from '@verdocs/js-sdk';
 import { g as getTemplateRoleStore, a as getRoleIndex } from './TemplateRoleStore.js';
 import { g as getTemplateFieldStore } from './TemplateFieldStore.js';
-import { g as getFieldSettings } from './utils.js';
 import { S as SettingsIcon } from './Icons.js';
 import { d as defineCustomElement$8 } from './verdocs-button2.js';
 import { d as defineCustomElement$7 } from './verdocs-checkbox2.js';
@@ -92,16 +91,15 @@ const VerdocsFieldTextarea = /*@__PURE__*/ proxyCustomElement(class VerdocsField
         if (!field) {
             return h(Fragment, null);
         }
-        const newSettings = { ...getFieldSettings(field) };
         const [translateX, translateY] = e.target.style.transform.split('(')[1].split(')')[0].split(',').map(parseFloat);
-        newSettings.width = Math.round(parseFloat(e.target.style.width) / this.xscale);
-        newSettings.height = Math.round(parseFloat(e.target.style.height) / this.yscale);
-        newSettings.x = Math.round(newSettings.x + translateX / this.xscale);
-        newSettings.y = Math.round(newSettings.y - translateY / this.yscale);
-        updateField(this.endpoint, this.templateid, this.fieldname, { settings: newSettings })
+        const width = Math.round(parseFloat(e.target.style.width) / this.xscale);
+        const height = Math.round(parseFloat(e.target.style.height) / this.yscale);
+        const x = Math.round(field.x + translateX / this.xscale);
+        const y = Math.round(field.y - translateY / this.yscale);
+        updateField(this.endpoint, this.templateid, this.fieldname, { x, y, width, height })
             .then(field => {
             var _a;
-            (_a = this.settingsChanged) === null || _a === void 0 ? void 0 : _a.emit({ fieldName: this.fieldname, settings: newSettings, field });
+            (_a = this.settingsChanged) === null || _a === void 0 ? void 0 : _a.emit({ fieldName: this.fieldname, field });
             Object.assign(e.target.dataset, { x: 0, y: 0, h: 0 });
         })
             .catch(e => console.log('Field update failed', e));
@@ -109,8 +107,7 @@ const VerdocsFieldTextarea = /*@__PURE__*/ proxyCustomElement(class VerdocsField
     render() {
         const { templateid, fieldname = '', editable = false, focused, done = false, disabled = false, xscale = 1, yscale = 1 } = this;
         const field = this.fieldStore.get('fields').find(field => field.name === fieldname);
-        const { required = false, role_name = '', placeholder = '' } = field || {};
-        const { result: value = '' } = getFieldSettings(field);
+        const { required = false, role_name = '', placeholder = '', value = '' } = field || {};
         const backgroundColor = getRGBA(getRoleIndex(this.roleStore, role_name));
         if (done) {
             return h(Host, { class: { done } }, value);

package/dist/components/verdocs-field-textbox2.js

@@ -3,7 +3,6 @@ import { i as interact } from './interact.min.js';
 import { VerdocsEndpoint, updateField, getRGBA } from '@verdocs/js-sdk';
 import { g as getTemplateFieldStore, u as updateStoreField } from './TemplateFieldStore.js';
 import { g as getTemplateRoleStore, a as getRoleIndex } from './TemplateRoleStore.js';
-import { g as getFieldSettings } from './utils.js';
 import { S as SettingsIcon } from './Icons.js';
 import { d as defineCustomElement$8 } from './verdocs-button2.js';
 import { d as defineCustomElement$7 } from './verdocs-checkbox2.js';
@@ -92,15 +91,13 @@ const VerdocsFieldTextbox = /*@__PURE__*/ proxyCustomElement(class VerdocsFieldT
     }
     handleResizeEnd(e) {
         const { fieldname = '' } = this;
-        const field = this.fieldStore.get('fields').find(field => field.name === fieldname);
-        const newSettings = { ...getFieldSettings(field) };
-        newSettings.width = Math.round(parseFloat(e.target.style.width));
-        newSettings.height = Math.round(parseFloat(e.target.style.height));
-        updateField(this.endpoint, this.templateid, this.fieldname, { settings: newSettings })
+        const width = Math.round(parseFloat(e.target.style.width));
+        const height = Math.round(parseFloat(e.target.style.height));
+        updateField(this.endpoint, this.templateid, this.fieldname, { width, height })
             .then(field => {
             var _a;
             updateStoreField(this.fieldStore, this.fieldname, field);
-            (_a = this.settingsChanged) === null || _a === void 0 ? void 0 : _a.emit({ fieldName: fieldname, settings: newSettings, field });
+            (_a = this.settingsChanged) === null || _a === void 0 ? void 0 : _a.emit({ fieldName: fieldname, field });
             Object.assign(e.target.dataset, { x: 0, y: 0, h: 0 });
         })
             .catch(e => console.log('Field update failed', e));

package/dist/components/verdocs-field-timestamp2.js

@@ -3,7 +3,6 @@ import { n as format } from './format.js';
 import { getRGBA } from '@verdocs/js-sdk';
 import { g as getTemplateRoleStore, a as getRoleIndex } from './TemplateRoleStore.js';
 import { g as getTemplateFieldStore } from './TemplateFieldStore.js';
-import { g as getFieldSettings } from './utils.js';
 import { F as FORMAT_TIMESTAMP } from './Types.js';
 import { S as SettingsIcon } from './Icons.js';
 import { d as defineCustomElement$8 } from './verdocs-button2.js';
@@ -59,8 +58,7 @@ const VerdocsFieldTimestamp = /*@__PURE__*/ proxyCustomElement(class VerdocsFiel
     render() {
         const { templateid, fieldname = '', editable = false, done = false, disabled = false, xscale = 1, yscale = 1 } = this;
         const field = this.fieldStore.get('fields').find(field => field.name === fieldname);
-        const { required = false, role_name = '', placeholder = '' } = field || {};
-        const { value = '' } = getFieldSettings(field);
+        const { required = false, role_name = '', placeholder = '', value = '' } = field || {};
         const backgroundColor = getRGBA(getRoleIndex(this.roleStore, role_name));
         const formatted = format.format(new Date(value || new Date().toISOString()), FORMAT_TIMESTAMP);
         if (done) {

package/dist/components/verdocs-file-chooser2.js

@@ -29,7 +29,7 @@ const VerdocsFileChooser = /*@__PURE__*/ proxyCustomElement(class VerdocsFileCho
     }
     render() {
         const buttonlabel = this.file ? 'Select a different file' : 'Select a file from your computer';
-        return (h(Host, { key: 'c5a0f7286477e1abb1e9211fa44317b1e10fbad7' }, h("input", { key: '26a1aec574872d2dd3406c54c434503c3b81ff6a', type: "file", multiple: true, id: "verdocs-file-chooser", accept: "application/pdf,.pdf,.doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document", style: { display: 'none' }, onChange: e => this.handleFileChanged(e) }), h("div", { key: 'e470dcabda5905509ee5c14a57c2a91585f0ce90', class: "upload-box" }, h("div", { key: 'faf9f0babd52c256126a9a49a0a7c3ad3b293257', class: "selected-filename" }, this.file ? this.file.name : 'Drag a file here'), h("div", { key: '8c4d46193b78c39e1ebdf82e4d9748991d87f415', class: "or-prefer" }, this.file ? unicodeNBSP : 'Or, if you prefer...'), h("verdocs-button", { key: 'e9616e665a5b3c9e4d04055993e1bbcae66d8322', label: buttonlabel, size: "small", onClick: e => this.handleSelectFile(e) }))));
+        return (h(Host, { key: '3c8755723e41e7878c0b11e8667ba7f3af70dc57' }, h("input", { key: 'a93020ee87c7bc31114899bc163f31d24da9f990', type: "file", multiple: true, id: "verdocs-file-chooser", accept: "application/pdf,.pdf,.doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document", style: { display: 'none' }, onChange: e => this.handleFileChanged(e) }), h("div", { key: '22ad1f874ee4d785bbc96d9124a8e569d795a66b', class: "upload-box" }, h("div", { key: '6e8d2fbf0e69381ca89b9cfa81fc160b2f7857d3', class: "selected-filename" }, this.file ? this.file.name : 'Drag a file here'), h("div", { key: '76712ca0fbb5ca76d923931c638991e89ced755e', class: "or-prefer" }, this.file ? unicodeNBSP : 'Or, if you prefer...'), h("verdocs-button", { key: 'f1c93ee91e36bc312c01ad9b8561948a642ba10f', label: buttonlabel, size: "small", onClick: e => this.handleSelectFile(e) }))));
     }
     static get style() { return VerdocsFileChooserStyle0; }
 }, [0, "verdocs-file-chooser", {