@verdocs/web-sdk 2.3.12 → 2.3.13

package/dist/cjs/verdocs-template-fields_4.cjs.entry.js

@@ -9,7 +9,8 @@ const VerdocsEndpoint = require('./VerdocsEndpoint-8f298664.js');
 const Fields = require('./Fields-705a2168.js');
 const Primitives = require('./Primitives-a59870a2.js');
 const utils = require('./utils-0916d10f.js');
-const TemplateStore = require('./TemplateStore-17b9fdfe.js');
+const TemplateFieldStore = require('./TemplateFieldStore-7449e5ff.js');
+const TemplateStore = require('./TemplateStore-0074c71d.js');
 const errors = require('./errors-0396da3d.js');
 const Colors = require('./Colors-e809dcc9.js');
 require('./_commonjsHelpers-1fbbf0eb.js');
@@ -76,7 +77,8 @@ const VerdocsTemplateFields = class {
     this.sdkError = index.createEvent(this, "sdkError", 7);
     this.templateUpdated = index.createEvent(this, "templateUpdated", 7);
     this.pageHeights = {};
-    this.store = null;
+    this.templateStore = null;
+    this.fieldStore = null;
     this.cachedPageInfo = {};
     this.endpoint = VerdocsEndpoint.VerdocsEndpoint.getDefault();
     this.templateId = null;
@@ -98,9 +100,10 @@ const VerdocsTemplateFields = class {
         console.log('[FIELDS] Unable to start builder session, must be authenticated');
         return;
       }
-      this.store = await TemplateStore.getTemplateStore(this.endpoint, this.templateId, true);
-      console.log(`[FIELDS] Loaded template ${this.templateId}`, this.store.state);
-      this.selectedRoleName = ((_d = (_c = (_b = (_a = this.store) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.roles) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.name) || '';
+      this.templateStore = await TemplateStore.getTemplateStore(this.endpoint, this.templateId, true);
+      this.fieldStore = TemplateFieldStore.createTemplateFieldStore(this.templateStore.state);
+      console.log(`[FIELDS] Loaded template ${this.templateId}`, this.templateStore.state, this.fieldStore);
+      this.selectedRoleName = ((_d = (_c = (_b = (_a = this.templateStore) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.roles) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.name) || '';
       console.log('[FIELDS] Starting with role', this.selectedRoleName);
     }
     catch (e) {
@@ -121,8 +124,8 @@ const VerdocsTemplateFields = class {
   componentWillUpdate() {
     var _a, _b, _c, _d, _e, _f;
     // If a new role was added and there were none yet so far, or the "selected" role was deleted, reset our selection
-    if (!this.selectedRoleName || !(((_b = (_a = this.store) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.roles) || []).find(role => role.name === this.selectedRoleName)) {
-      this.selectedRoleName = ((_f = (_e = (_d = (_c = this.store) === null || _c === void 0 ? void 0 : _c.state) === null || _d === void 0 ? void 0 : _d.roles) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.name) || '';
+    if (!this.selectedRoleName || !(((_b = (_a = this.templateStore) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.roles) || []).find(role => role.name === this.selectedRoleName)) {
+      this.selectedRoleName = ((_f = (_e = (_d = (_c = this.templateStore) === null || _c === void 0 ? void 0 : _c.state) === null || _d === void 0 ? void 0 : _d.roles) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.name) || '';
       console.log('[FIELDS] Selected new role', this.selectedRoleName);
     }
   }
@@ -136,35 +139,39 @@ const VerdocsTemplateFields = class {
     console.log('[FIELDS] handleFieldChange', field, e, optionId);
     this.rerender++;
   }
-  handleFieldSettingsChange(pageInfo, field, roleIndex, el, newFieldData) {
-    var _a, _b, _c, _d;
+  handleFieldSettingsChange(pageInfo, field, el, newFieldData) {
+    var _a, _b;
+    // handleFieldSettingsChange(pageInfo: any, field: any, roleIndex: number, el: any, newFieldData: any) {
     console.log('[FIELDS] Field settings changed', field.name, newFieldData);
     Object.assign(field, newFieldData);
     el.field = newFieldData;
     this.selectedRoleName = field.role_name;
-    el.setAttribute('roleindex', utils.getRoleIndex(TemplateStore.getRoleNames(this.store), field.role_name));
-    el.field = (_b = (_a = this.store) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.fields.find(f => f.name === field.name);
+    el.setAttribute('roleindex', utils.getRoleIndex(TemplateStore.getRoleNames(this.templateStore), field.role_name));
+    el.field = this.fieldStore.get(field.name);
     this.rerender++;
     el.setAttribute('rerender', this.rerender);
-    (_c = this.templateUpdated) === null || _c === void 0 ? void 0 : _c.emit({ endpoint: this.endpoint, template: (_d = this.store) === null || _d === void 0 ? void 0 : _d.state, event: 'updated-field' });
+    (_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' });
     console.log('[FIELDS] Re-rendering field', field.name, pageInfo.pageNumber);
-    this.reRenderField(field, pageInfo.pageNumber);
-    const newEl = utils.renderDocumentField(field, pageInfo, roleIndex, { disabled: true, editable: true, draggable: true });
-    if (!newEl) {
-      return;
-    }
+    this.fieldStore.set(field.name, field);
+    // this.reRenderField(field, pageInfo.pageNumber);
+    // const newEl = renderDocumentField(field, pageInfo, roleIndex, {disabled: true, editable: true, draggable: true});
+    // if (!newEl) {
+    //   return;
+    // }
   }
   attachFieldAttributes(pageInfo, field, roleIndex, el) {
     el.addEventListener('input', e => this.handleFieldChange(field, e));
-    el.addEventListener('settingsChanged', e => this.handleFieldSettingsChange(pageInfo, field, roleIndex, el, e.detail.field));
+    el.addEventListener('settingsChanged', e => this.handleFieldSettingsChange(pageInfo, field, el, e.detail.field));
+    // el.addEventListener('settingsChanged', e => this.handleFieldSettingsChange(pageInfo, field, roleIndex, el, e.detail.field));
     el.addEventListener('deleted', () => {
       var _a, _b;
       console.log('[FIELDS] Deleted', this, field);
       el.remove();
       this.rerender++;
-      (_a = this.templateUpdated) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, template: (_b = this.store) === null || _b === void 0 ? void 0 : _b.state, event: 'updated-field' });
+      (_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' });
     });
     el.setAttribute('templateid', this.templateId);
+    el.setAttribute('fieldname', field.name);
     el.setAttribute('roleindex', roleIndex);
     el.setAttribute('pageNumber', pageInfo.pageNumber);
     el.setAttribute('xScale', pageInfo.xScale);
@@ -172,17 +179,16 @@ const VerdocsTemplateFields = class {
     el.setAttribute('name', field.name);
   }
   handlePageRendered(e) {
-    var _a;
     const pageInfo = e.detail;
     console.log('[FIELDS] Page rendered', pageInfo.pageNumber, pageInfo);
     this.cachedPageInfo[pageInfo.pageNumber] = pageInfo;
     this.pageHeights[pageInfo.pageNumber] = pageInfo.naturalHeight;
-    const fields = (_a = this.store) === null || _a === void 0 ? void 0 : _a.state.fields.filter(field => field.page_sequence === pageInfo.pageNumber);
+    const fields = Object.values(this.fieldStore.state).filter(field => field.page_sequence === pageInfo.pageNumber);
     fields.forEach(field => this.reRenderField(field, pageInfo.pageNumber));
   }
   reRenderField(field, pageNumber) {
     const pageInfo = this.cachedPageInfo[pageNumber];
-    const roleIndex = utils.getRoleIndex(TemplateStore.getRoleNames(this.store), field.role_name);
+    const roleIndex = utils.getRoleIndex(TemplateStore.getRoleNames(this.templateStore), field.role_name);
     const el = utils.renderDocumentField(field, pageInfo, roleIndex, { disabled: true, editable: true, draggable: true });
     if (!el) {
       return;
@@ -218,10 +224,9 @@ const VerdocsTemplateFields = class {
     utils.updateCssTransform(event.target, 'translate', `${newX}px, ${newY}px`);
   }
   async handleMoveEnd(event) {
-    var _a;
     const name = event.target.getAttribute('name');
     const option = +(event.target.getAttribute('option') || '0');
-    const field = (_a = this.store) === null || _a === void 0 ? void 0 : _a.state.fields.find(field => field.name === name);
+    const field = this.fieldStore.get(name);
     console.log('Dropped field', name, field);
     if (!field) {
       console.log('[FIELDS] Unable to find field', name);
@@ -268,19 +273,19 @@ const VerdocsTemplateFields = class {
     console.log('[FIELDS] Will update', name, option, field);
     const newFieldData = await Fields.updateField(this.endpoint, this.templateId, name, field);
     const pageInfo = this.cachedPageInfo[pageNumber];
-    const roleIndex = utils.getRoleIndex(TemplateStore.getRoleNames(this.store), field.role_name);
-    this.handleFieldSettingsChange(pageInfo, field, roleIndex, event.target, newFieldData);
+    // const roleIndex = getRoleIndex(getRoleNames(this.templateStore), field.role_name);
+    this.handleFieldSettingsChange(pageInfo, field, event.target, newFieldData);
+    // this.handleFieldSettingsChange(pageInfo, field, roleIndex, event.target, newFieldData);
     event.target.removeAttribute('posX');
     event.target.removeAttribute('posY');
   }
   generateFieldName(type, pageNumber) {
-    var _a;
     let i = 1;
     let fieldName;
     do {
       fieldName = `${type}P${pageNumber}-${i}`;
       i++;
-    } while ((_a = this.store) === null || _a === void 0 ? void 0 : _a.state.fields.some(field => field.name === fieldName));
+    } while (Object.values(this.fieldStore.state).some(field => field.name === fieldName));
     return fieldName;
   }
   // Scale the X,Y clicks to the virtual page dimensions. Also ensure the field doesn't go off the page.
@@ -292,7 +297,7 @@ const VerdocsTemplateFields = class {
     return { x, y };
   }
   async handleClickPage(e, pageNumber) {
-    var _a, _b, _c;
+    var _a, _b;
     if (this.placing) {
       const clickedX = e.offsetX;
       const clickedY = e.offsetY;
@@ -319,6 +324,7 @@ const VerdocsTemplateFields = class {
         width,
         height,
       };
+      console.log('[FIELDS] Will save new field', field);
       // TODO: Fix how the server validates all this. It uses a JSON schema and is very particular about shapes for each field type.
       //  That makes it harder for third party developers to create fields via API calls. It would be better to always set X/Y and
       //  let the server normalize the rest, discarding properties that are invalid and back-filling defaults as needed.
@@ -385,11 +391,9 @@ const VerdocsTemplateFields = class {
       }
       const saved = await Fields.createField(this.endpoint, this.templateId, field);
       console.log('Saved field', saved);
-      if (this.store.state) {
-        this.store.state.fields = [...(_a = this.store) === null || _a === void 0 ? void 0 : _a.state.fields, saved];
-      }
+      this.fieldStore.set(saved.name, saved);
       this.placing = null;
-      (_b = this.templateUpdated) === null || _b === void 0 ? void 0 : _b.emit({ endpoint: this.endpoint, template: (_c = this.store) === null || _c === void 0 ? void 0 : _c.state, event: 'added-field' });
+      (_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' });
       this.handlePageRendered({ detail: this.cachedPageInfo[pageNumber] });
     }
   }
@@ -400,10 +404,10 @@ const VerdocsTemplateFields = class {
       return (index.h(index.Host, null, index.h("verdocs-component-error", { message: "You must be authenticated to use this module." })));
     }
     // TODO: Render a better error
-    if (!((_a = this.store) === null || _a === void 0 ? void 0 : _a.state.isLoaded)) {
+    if (!((_a = this.templateStore) === null || _a === void 0 ? void 0 : _a.state.isLoaded)) {
       return (index.h(index.Host, null, index.h("verdocs-loader", null)));
     }
-    const selectableRoles = (_c = (_b = this.store) === null || _b === void 0 ? void 0 : _b.state) === null || _c === void 0 ? void 0 : _c.roles.map(role => ({ value: role.name, label: role.name }));
+    const selectableRoles = (_c = (_b = this.templateStore) === null || _b === void 0 ? void 0 : _b.state) === null || _c === void 0 ? void 0 : _c.roles.map(role => ({ value: role.name, label: role.name }));
     return (index.h(index.Host, { class: this.placing ? { [`placing-${this.placing}`]: true } : {}, "data-r": this.rerender, onSubmit: () => {
         console.log('onSubmit');
       } }, index.h("div", { id: "verdocs-template-fields-toolbar" }, index.h("div", { class: "add-for" }, "Add field:"), index.h("verdocs-select-input", { value: this.selectedRoleName, options: selectableRoles, onInput: (e) => (this.selectedRoleName = e.target.value) }), menuOptions.map(option => (index.h("verdocs-toolbar-icon", { text: option.tooltip, icon: option.icon, onClick: () => {
@@ -417,13 +421,13 @@ const VerdocsTemplateFields = class {
             this.showMustSelectRole = true;
           }
         }
-      } })))), index.h("div", { class: "pages" }, (((_e = (_d = this.store) === null || _d === void 0 ? void 0 : _d.state) === null || _e === void 0 ? void 0 : _e.template_documents) || []).map(document => {
+      } })))), index.h("div", { class: "pages" }, (((_e = (_d = this.templateStore) === null || _d === void 0 ? void 0 : _d.state) === null || _e === void 0 ? void 0 : _e.template_documents) || []).map(document => {
       const pageNumbers = Primitives.integerSequence(1, document.page_numbers);
       return pageNumbers.map(page => (index.h("verdocs-template-document-page", { templateId: this.templateId, documentId: document.id, pageNumber: page, virtualWidth: 612, virtualHeight: 792, onClick: (e) => this.handleClickPage(e, page), onPageRendered: e => this.handlePageRendered(e), layers: [
           { name: 'page', type: 'canvas' },
           { name: 'controls', type: 'div' },
         ] })));
-    })), this.showMustSelectRole && (index.h("verdocs-ok-dialog", { heading: "Unable to add field", message: ((_h = (_g = (_f = this.store) === null || _f === void 0 ? void 0 : _f.state) === null || _g === void 0 ? void 0 : _g.roles) === null || _h === void 0 ? void 0 : _h.length) > 0 ? 'Please select a role before adding fields.' : 'Please add at least one role before adding fields.', onNext: () => (this.showMustSelectRole = false) }))));
+    })), this.showMustSelectRole && (index.h("verdocs-ok-dialog", { heading: "Unable to add field", message: ((_h = (_g = (_f = this.templateStore) === null || _f === void 0 ? void 0 : _f.state) === null || _g === void 0 ? void 0 : _g.roles) === null || _h === void 0 ? void 0 : _h.length) > 0 ? 'Please select a role before adding fields.' : 'Please add at least one role before adding fields.', onNext: () => (this.showMustSelectRole = false) }))));
   }
 };
 VerdocsTemplateFields.style = verdocsTemplateFieldsCss;

package/dist/cjs/verdocs-web-sdk.cjs.js

@@ -15,5 +15,5 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return index.bootstrapLazy(JSON.parse("[[\"verdocs-build.cjs\",[[0,\"verdocs-build\",{\"endpoint\":[16],\"templateId\":[1537,\"template-id\"],\"step\":[1537],\"store\":[32]}]]],[\"ipc-test.cjs\",[[0,\"ipc-test\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"]}]]],[\"verdocs-settings.cjs\",[[0,\"verdocs-settings\",{\"endpoint\":[16],\"tab\":[32]}]]],[\"verdocs-envelopes-list.cjs\",[[0,\"verdocs-envelopes-list\",{\"endpoint\":[16],\"view\":[1537],\"status\":[1537],\"sort\":[1537],\"match\":[1537],\"showPagination\":[4,\"show-pagination\"],\"rowsPerPage\":[2,\"rows-per-page\"],\"selectedPage\":[2,\"selected-page\"],\"count\":[32],\"initiallyLoaded\":[32],\"loading\":[32],\"selectedEnvelopes\":[32],\"envelopes\":[32]}]]],[\"verdocs-field-attachment.cjs\",[[0,\"verdocs-field-attachment\",{\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"xscale\":[2],\"yscale\":[2],\"rerender\":[2],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-initial.cjs\",[[0,\"verdocs-field-initial\",{\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"initials\":[1],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"rerender\":[2],\"tempInitials\":[32],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-signature.cjs\",[[0,\"verdocs-field-signature\",{\"templateid\":[1],\"field\":[16],\"name\":[1],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"rerender\":[2],\"tempSignature\":[32],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-templates-list.cjs\",[[0,\"verdocs-templates-list\",{\"endpoint\":[16],\"sharing\":[1537],\"starred\":[1537],\"sort\":[1537],\"name\":[1537],\"allowedActions\":[1040],\"showPagination\":[4,\"show-pagination\"],\"rowsPerPage\":[2,\"rows-per-page\"],\"selectedPage\":[2,\"selected-page\"],\"count\":[32],\"initiallyLoaded\":[32],\"loading\":[32],\"confirmDelete\":[32],\"templates\":[32],\"localNameFilter\":[32]}]]],[\"verdocs-field-checkbox.cjs\",[[0,\"verdocs-field-checkbox\",{\"templateid\":[1],\"field\":[16],\"option\":[2],\"disabled\":[4],\"done\":[4],\"roleindex\":[2],\"editable\":[4],\"moveable\":[4],\"rerender\":[2],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-date.cjs\",[[0,\"verdocs-field-date\",{\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"rerender\":[2],\"containerId\":[32],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-dropdown.cjs\",[[0,\"verdocs-field-dropdown\",{\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"rerender\":[2],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-radio-button.cjs\",[[0,\"verdocs-field-radio-button\",{\"templateid\":[1],\"field\":[16],\"option\":[2],\"disabled\":[4],\"done\":[4],\"roleindex\":[2],\"editable\":[4],\"moveable\":[4],\"rerender\":[2],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-textarea.cjs\",[[0,\"verdocs-field-textarea\",{\"endpoint\":[16],\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"xscale\":[2],\"yscale\":[2],\"rerender\":[2],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-textbox.cjs\",[[0,\"verdocs-field-textbox\",{\"endpoint\":[16],\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"xscale\":[2],\"yscale\":[2],\"rerender\":[2],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-timestamp.cjs\",[[0,\"verdocs-field-timestamp\",{\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"rerender\":[2],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-sign.cjs\",[[0,\"verdocs-sign\",{\"envelopeId\":[1,\"envelope-id\"],\"roleId\":[1,\"role-id\"],\"inviteCode\":[1,\"invite-code\"],\"headerTargetId\":[1,\"header-target-id\"],\"envelope\":[32],\"roleNames\":[32],\"sortedRecipients\":[32],\"recipient\":[32],\"signerToken\":[32],\"hasSignature\":[32],\"nextButtonLabel\":[32],\"nextSubmits\":[32],\"errorMessage\":[32],\"focusedField\":[32],\"submitting\":[32],\"isDone\":[32],\"showDone\":[32],\"showLoadError\":[32],\"finishLater\":[32],\"showFinishLater\":[32],\"agreed\":[32],\"documentsSingularPlural\":[32]}]]],[\"verdocs-envelope-sidebar.cjs\",[[0,\"verdocs-envelope-sidebar\",{\"endpoint\":[16],\"envelopeId\":[1,\"envelope-id\"],\"activeTab\":[32],\"panelOpen\":[32],\"showManageDialog\":[32],\"showRecipientDialog\":[32],\"showCancelDialog\":[32],\"loading\":[32]}]]],[\"verdocs-auth.cjs\",[[0,\"verdocs-auth\",{\"endpoint\":[16],\"visible\":[4],\"logo\":[1],\"isAuthenticated\":[32],\"displayMode\":[32],\"orgname\":[32],\"first\":[32],\"last\":[32],\"username\":[32],\"phone\":[32],\"password\":[32],\"submitting\":[32],\"activeSession\":[32],\"accountType\":[32],\"howHear\":[32],\"industry\":[32],\"companySize\":[32],\"reason\":[32],\"signupStep\":[32],\"resendDisabled\":[32],\"checkingOrg\":[32]}]]],[\"verdocs-search.cjs\",[[0,\"verdocs-search\",{\"endpoint\":[16]}]]],[\"verdocs-activity-box.cjs\",[[0,\"verdocs-activity-box\",{\"endpoint\":[16],\"items\":[2],\"view\":[1],\"header\":[1],\"title\":[32],\"count\":[32],\"loading\":[32],\"entries\":[32]}]]],[\"verdocs-floating-menu.cjs\",[[0,\"verdocs-floating-menu\",{\"options\":[16]}]]],[\"verdocs-kba-dialog.cjs\",[[0,\"verdocs-kba-dialog\",{\"step\":[2],\"steps\":[2],\"helptitle\":[1],\"helptext\":[1],\"mode\":[1],\"label\":[1],\"placeholder\":[1],\"choices\":[16],\"response\":[32]}]]],[\"verdocs-field-payment.cjs\",[[0,\"verdocs-field-payment\",{\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"fields\":[16],\"pageNum\":[2,\"page-num\"],\"roleName\":[1,\"role-name\"],\"fieldId\":[1,\"field-id\"],\"recipients\":[8],\"selectedRoleName\":[1,\"selected-role-name\"],\"pdfPages\":[16],\"currentSignature\":[1,\"current-signature\"],\"currentSignatureId\":[1,\"current-signature-id\"],\"currentInitial\":[1,\"current-initial\"],\"currentInitialId\":[1,\"current-initial-id\"],\"focused\":[4],\"signed\":[4],\"rerender\":[2],\"roleindex\":[2],\"preparedMessage\":[32],\"signatureUrl\":[32],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-organization-card.cjs\",[[0,\"verdocs-organization-card\",{\"organization\":[16]}]]],[\"verdocs-search-tabs.cjs\",[[0,\"verdocs-search-tabs\",{\"selected\":[32]}]]],[\"verdocs-template-card.cjs\",[[0,\"verdocs-template-card\",{\"template\":[16]}]]],[\"verdocs-template-tags.cjs\",[[0,\"verdocs-template-tags\",{\"tags\":[16]}]]],[\"verdocs-toggle.cjs\",[[0,\"verdocs-toggle\",{\"options\":[16],\"theme\":[1],\"selectedOption\":[32]}]]],[\"verdocs-view.cjs\",[[0,\"verdocs-view\",{\"endpoint\":[16],\"envelopeId\":[1,\"envelope-id\"],\"headerTargetId\":[1,\"header-target-id\"],\"canceling\":[32],\"envelope\":[32],\"roleNames\":[32],\"showCancelDone\":[32]}]]],[\"verdocs-initial-dialog.cjs\",[[0,\"verdocs-initial-dialog\",{\"initials\":[1],\"fontLoaded\":[32],\"enteredInitials\":[32],\"mode\":[32]}]]],[\"verdocs-signature-dialog.cjs\",[[0,\"verdocs-signature-dialog\",{\"name\":[1],\"fontLoaded\":[32],\"enteredName\":[32],\"mode\":[32]}]]],[\"verdocs-upload-dialog.cjs\",[[0,\"verdocs-upload-dialog\",{\"draggingOver\":[32],\"decodedFiles\":[32]}]]],[\"verdocs-status-indicator.cjs\",[[0,\"verdocs-status-indicator\",{\"size\":[1],\"theme\":[1],\"status\":[1],\"envelope\":[16],\"isOpen\":[32],\"containerId\":[32]}]]],[\"verdocs-template-star.cjs\",[[0,\"verdocs-template-star\",{\"endpoint\":[16],\"template\":[1040],\"updating\":[32]}]]],[\"verdocs-envelope-recipient-link_2.cjs\",[[0,\"verdocs-envelope-recipient-link\",{\"endpoint\":[16],\"envelopeId\":[1,\"envelope-id\"],\"roleName\":[1,\"role-name\"],\"isOpen\":[32],\"loading\":[32],\"gettingLink\":[32],\"link\":[32]}],[0,\"verdocs-envelope-recipient-summary\",{\"endpoint\":[16],\"envelopeId\":[1,\"envelope-id\"],\"canSendAnother\":[4,\"can-send-another\"],\"canView\":[4,\"can-view\"],\"canDone\":[4,\"can-done\"],\"isOpen\":[32],\"loading\":[32],\"recipientStatusIcons\":[32],\"containerId\":[32],\"gettingLinks\":[32],\"links\":[32]}]]],[\"verdocs-quick-functions_2.cjs\",[[0,\"verdocs-quick-functions\",{\"endpoint\":[16]}],[0,\"verdocs-search-box\",{\"endpoint\":[16],\"placeholder\":[1],\"type\":[1],\"query\":[1],\"grabsFocus\":[4,\"grabs-focus\"],\"focusField\":[64]}]]],[\"verdocs-envelope-document-page.cjs\",[[0,\"verdocs-envelope-document-page\",{\"endpoint\":[16],\"envelopeId\":[1,\"envelope-id\"],\"documentId\":[1,\"document-id\"],\"pageNumber\":[2,\"page-number\"],\"virtualWidth\":[2,\"virtual-width\"],\"virtualHeight\":[1026,\"virtual-height\"],\"layers\":[16],\"type\":[1],\"containerId\":[32],\"renderedWidth\":[32],\"renderedHeight\":[32],\"naturalWidth\":[32],\"naturalHeight\":[32],\"aspectRatio\":[32],\"skipFirstNotification\":[32],\"pageDisplayUri\":[32]}]]],[\"verdocs-settings-api-keys_4.cjs\",[[0,\"verdocs-settings-members\",{\"endpoint\":[16],\"members\":[32],\"invited\":[32],\"roles\":[32],\"selectedTab\":[32],\"invitingMember\":[32],\"newEmailAddress\":[32],\"newRoleId\":[32],\"submitting\":[32],\"deletingInvitation\":[32],\"resendingInvitation\":[32],\"deletingMember\":[32]}],[0,\"verdocs-settings-api-keys\",{\"endpoint\":[16],\"keys\":[32],\"creatingKey\":[32],\"createdKey\":[32],\"deletingKey\":[32],\"rotatingKey\":[32],\"newApiKeyName\":[32],\"newApiKeyProfileId\":[32],\"members\":[32]}],[0,\"verdocs-settings-organization\",{\"endpoint\":[16],\"valid\":[32],\"dirty\":[32],\"submitting\":[32],\"name\":[32],\"business_name\":[32],\"contact_email\":[32],\"phone\":[32],\"address\":[32],\"address2\":[32],\"timezone\":[32],\"url\":[32]}],[0,\"verdocs-settings-profile\",{\"endpoint\":[16],\"valid\":[32],\"dirty\":[32],\"submitting\":[32],\"first_name\":[32],\"last_name\":[32],\"email\":[32],\"phone\":[32]}]]],[\"verdocs-pagination_2.cjs\",[[0,\"verdocs-pagination\",{\"selectedPage\":[1538,\"selected-page\"],\"itemCount\":[2,\"item-count\"],\"perPage\":[2,\"per-page\"]}],[0,\"verdocs-quick-filter\",{\"options\":[16],\"label\":[1],\"value\":[1537],\"placeholder\":[1],\"open\":[32]}]]],[\"verdocs-radio-button.cjs\",[[0,\"verdocs-radio-button\",{\"checked\":[4],\"name\":[1],\"value\":[1],\"disabled\":[4]}]]],[\"verdocs-spinner.cjs\",[[0,\"verdocs-spinner\",{\"size\":[2],\"mode\":[1]}]]],[\"verdocs-tabs.cjs\",[[4,\"verdocs-tabs\",{\"tabs\":[16],\"selectedTab\":[2,\"selected-tab\"]}]]],[\"verdocs-file-chooser_2.cjs\",[[0,\"verdocs-file-chooser\",{\"endpoint\":[16],\"file\":[32]}],[0,\"verdocs-progress-bar\",{\"label\":[1],\"showPercent\":[4,\"show-percent\"],\"percent\":[2]}]]],[\"verdocs-dropdown.cjs\",[[0,\"verdocs-dropdown\",{\"options\":[16]},[[9,\"resize\",\"handleResize\"]]]]],[\"verdocs-dialog_2.cjs\",[[4,\"verdocs-dialog\"],[0,\"verdocs-table\",{\"columns\":[16],\"data\":[16]}]]],[\"verdocs-contact-picker_3.cjs\",[[0,\"verdocs-contact-picker\",{\"endpoint\":[16],\"templateRole\":[16],\"contactSuggestions\":[16],\"name\":[32],\"email\":[32],\"phone\":[32],\"message\":[32],\"showSuggestions\":[32],\"showMessage\":[32],\"delegator\":[32],\"nameFieldId\":[32],\"emailFieldId\":[32],\"phoneFieldId\":[32]}],[4,\"verdocs-portal\",{\"anchor\":[1],\"voffset\":[2],\"align\":[1]},[[11,\"scroll\",\"handleScroll\"],[11,\"resize\",\"handleResize\"],[10,\"click\",\"handleClick\"]]],[0,\"verdocs-toggle-button\",{\"active\":[4],\"icon\":[1],\"label\":[1],\"size\":[1],\"_active\":[32]}]]],[\"verdocs-template-document-page_2.cjs\",[[0,\"verdocs-template-document-page\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"documentId\":[1,\"document-id\"],\"pageNumber\":[2,\"page-number\"],\"virtualWidth\":[2,\"virtual-width\"],\"virtualHeight\":[1026,\"virtual-height\"],\"layers\":[16],\"containerId\":[32],\"renderedWidth\":[32],\"renderedHeight\":[32],\"naturalWidth\":[32],\"naturalHeight\":[32],\"aspectRatio\":[32],\"skipFirstNotification\":[32],\"pageDisplayUri\":[32]}],[0,\"verdocs-toolbar-icon\",{\"text\":[1],\"icon\":[1],\"placement\":[1],\"containerId\":[32]}]]],[\"verdocs-button_3.cjs\",[[0,\"verdocs-text-input\",{\"value\":[1537],\"label\":[1],\"placeholder\":[1],\"autocomplete\":[1],\"helpText\":[1,\"help-text\"],\"clearable\":[4],\"copyable\":[4],\"type\":[1],\"disabled\":[4],\"required\":[4]}],[0,\"verdocs-help-icon\",{\"text\":[1],\"icon\":[1],\"containerId\":[32]}],[0,\"verdocs-button\",{\"label\":[1],\"startIcon\":[1,\"start-icon\"],\"endIcon\":[1,\"end-icon\"],\"size\":[1],\"type\":[1],\"variant\":[1],\"disabled\":[4]}]]],[\"verdocs-ok-dialog.cjs\",[[0,\"verdocs-ok-dialog\",{\"heading\":[1],\"message\":[1],\"buttonLabel\":[1,\"button-label\"],\"showCancel\":[4,\"show-cancel\"],\"closed\":[32]}]]],[\"verdocs-loader.cjs\",[[0,\"verdocs-loader\"]]],[\"verdocs-checkbox_3.cjs\",[[0,\"verdocs-checkbox\",{\"checked\":[4],\"name\":[1],\"label\":[1],\"value\":[1],\"theme\":[1],\"disabled\":[4]}],[0,\"verdocs-component-error\",{\"message\":[1]}],[0,\"verdocs-select-input\",{\"value\":[1],\"label\":[1],\"options\":[16],\"disabled\":[4]}]]],[\"verdocs-preview_8.cjs\",[[0,\"verdocs-template-attachments\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"uploading\":[32],\"progressLabel\":[32],\"progressPercent\":[32],\"showDeleteError\":[32],\"confirmDeleteDocument\":[32],\"store\":[32]}],[0,\"verdocs-template-reminders\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"showPlanBlocker\":[32],\"sendReminders\":[32],\"firstReminderDays\":[32],\"reminderDays\":[32],\"dirty\":[32]}],[0,\"verdocs-send\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"environment\":[1],\"containerId\":[32],\"rolesAtLevel\":[32],\"showPickerForId\":[32],\"sessionContacts\":[32],\"sending\":[32],\"rolesCompleted\":[32],\"reset\":[64]}],[0,\"verdocs-template-name\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"name\":[32],\"dirty\":[32]}],[0,\"verdocs-template-create\",{\"endpoint\":[16],\"file\":[32],\"creating\":[32],\"progressLabel\":[32],\"progressPercent\":[32]}],[0,\"verdocs-template-visibility\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"dirty\":[32],\"personal\":[32],\"public\":[32]}],[0,\"verdocs-preview\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"]}],[0,\"verdocs-template-build-tabs\",{\"endpoint\":[16],\"templateId\":[1537,\"template-id\"],\"step\":[1537],\"store\":[32]}]]],[\"verdocs-template-fields_4.cjs\",[[0,\"verdocs-template-roles\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"showingRoleDialog\":[32],\"showingSenderDialog\":[32],\"sender\":[32]}],[0,\"verdocs-template-fields\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"toolbarTargetId\":[1,\"toolbar-target-id\"],\"placing\":[32],\"showMustSelectRole\":[32],\"selectedRoleName\":[32],\"rerender\":[32]},[[4,\"keydown\",\"handleKeyDown\"]]],[0,\"verdocs-template-role-properties\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"roleName\":[1,\"role-name\"],\"sender\":[1],\"dirty\":[32],\"saving\":[32],\"name\":[32],\"type\":[32],\"fullName\":[32],\"email\":[32],\"phone\":[32],\"allowDelegation\":[32]}],[0,\"verdocs-template-sender\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"sender\":[1],\"saving\":[32]}]]],[\"verdocs-button-panel_2.cjs\",[[0,\"verdocs-template-field-properties\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"fieldName\":[1,\"field-name\"],\"helpText\":[1,\"help-text\"],\"dirty\":[32],\"loading\":[32],\"type\":[32],\"setting\":[32],\"label\":[32],\"name\":[32],\"roleName\":[32],\"group\":[32],\"fieldType\":[32],\"required\":[32],\"options\":[32],\"placeholder\":[32],\"value\":[32],\"leading\":[32],\"showingHelp\":[32]}],[4,\"verdocs-button-panel\",{\"icon\":[1],\"showPanel\":[64],\"hidePanel\":[64],\"toggle\":[64]}]]]]"), options);
+  return index.bootstrapLazy(JSON.parse("[[\"verdocs-build.cjs\",[[0,\"verdocs-build\",{\"endpoint\":[16],\"templateId\":[1537,\"template-id\"],\"step\":[1537],\"store\":[32]}]]],[\"ipc-test.cjs\",[[0,\"ipc-test\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"]}]]],[\"verdocs-settings.cjs\",[[0,\"verdocs-settings\",{\"endpoint\":[16],\"tab\":[32]}]]],[\"verdocs-envelopes-list.cjs\",[[0,\"verdocs-envelopes-list\",{\"endpoint\":[16],\"view\":[1537],\"status\":[1537],\"sort\":[1537],\"match\":[1537],\"showPagination\":[4,\"show-pagination\"],\"rowsPerPage\":[2,\"rows-per-page\"],\"selectedPage\":[2,\"selected-page\"],\"count\":[32],\"initiallyLoaded\":[32],\"loading\":[32],\"selectedEnvelopes\":[32],\"envelopes\":[32]}]]],[\"verdocs-field-attachment.cjs\",[[0,\"verdocs-field-attachment\",{\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"xscale\":[2],\"yscale\":[2],\"rerender\":[2],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-initial.cjs\",[[0,\"verdocs-field-initial\",{\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"initials\":[1],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"rerender\":[2],\"tempInitials\":[32],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-signature.cjs\",[[0,\"verdocs-field-signature\",{\"templateid\":[1],\"field\":[16],\"name\":[1],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"rerender\":[2],\"tempSignature\":[32],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-templates-list.cjs\",[[0,\"verdocs-templates-list\",{\"endpoint\":[16],\"sharing\":[1537],\"starred\":[1537],\"sort\":[1537],\"name\":[1537],\"allowedActions\":[1040],\"showPagination\":[4,\"show-pagination\"],\"rowsPerPage\":[2,\"rows-per-page\"],\"selectedPage\":[2,\"selected-page\"],\"count\":[32],\"initiallyLoaded\":[32],\"loading\":[32],\"confirmDelete\":[32],\"templates\":[32],\"localNameFilter\":[32]}]]],[\"verdocs-field-checkbox.cjs\",[[0,\"verdocs-field-checkbox\",{\"templateid\":[1],\"field\":[16],\"option\":[2],\"disabled\":[4],\"done\":[4],\"roleindex\":[2],\"editable\":[4],\"moveable\":[4],\"rerender\":[2],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-date.cjs\",[[0,\"verdocs-field-date\",{\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"rerender\":[2],\"containerId\":[32],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-dropdown.cjs\",[[0,\"verdocs-field-dropdown\",{\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"rerender\":[2],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-radio-button.cjs\",[[0,\"verdocs-field-radio-button\",{\"templateid\":[1],\"field\":[16],\"option\":[2],\"disabled\":[4],\"done\":[4],\"roleindex\":[2],\"editable\":[4],\"moveable\":[4],\"rerender\":[2],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-textarea.cjs\",[[0,\"verdocs-field-textarea\",{\"endpoint\":[16],\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"xscale\":[2],\"yscale\":[2],\"rerender\":[2],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-textbox.cjs\",[[0,\"verdocs-field-textbox\",{\"endpoint\":[16],\"templateid\":[1],\"field\":[16],\"fieldname\":[1],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"xscale\":[2],\"yscale\":[2],\"rerender\":[2],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-timestamp.cjs\",[[0,\"verdocs-field-timestamp\",{\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"rerender\":[2],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-sign.cjs\",[[0,\"verdocs-sign\",{\"envelopeId\":[1,\"envelope-id\"],\"roleId\":[1,\"role-id\"],\"inviteCode\":[1,\"invite-code\"],\"headerTargetId\":[1,\"header-target-id\"],\"envelope\":[32],\"roleNames\":[32],\"sortedRecipients\":[32],\"recipient\":[32],\"signerToken\":[32],\"hasSignature\":[32],\"nextButtonLabel\":[32],\"nextSubmits\":[32],\"errorMessage\":[32],\"focusedField\":[32],\"submitting\":[32],\"isDone\":[32],\"showDone\":[32],\"showLoadError\":[32],\"finishLater\":[32],\"showFinishLater\":[32],\"agreed\":[32],\"documentsSingularPlural\":[32]}]]],[\"verdocs-envelope-sidebar.cjs\",[[0,\"verdocs-envelope-sidebar\",{\"endpoint\":[16],\"envelopeId\":[1,\"envelope-id\"],\"activeTab\":[32],\"panelOpen\":[32],\"showManageDialog\":[32],\"showRecipientDialog\":[32],\"showCancelDialog\":[32],\"loading\":[32]}]]],[\"verdocs-auth.cjs\",[[0,\"verdocs-auth\",{\"endpoint\":[16],\"visible\":[4],\"logo\":[1],\"isAuthenticated\":[32],\"displayMode\":[32],\"orgname\":[32],\"first\":[32],\"last\":[32],\"username\":[32],\"phone\":[32],\"password\":[32],\"submitting\":[32],\"activeSession\":[32],\"accountType\":[32],\"howHear\":[32],\"industry\":[32],\"companySize\":[32],\"reason\":[32],\"signupStep\":[32],\"resendDisabled\":[32],\"checkingOrg\":[32]}]]],[\"verdocs-search.cjs\",[[0,\"verdocs-search\",{\"endpoint\":[16]}]]],[\"verdocs-activity-box.cjs\",[[0,\"verdocs-activity-box\",{\"endpoint\":[16],\"items\":[2],\"view\":[1],\"header\":[1],\"title\":[32],\"count\":[32],\"loading\":[32],\"entries\":[32]}]]],[\"verdocs-floating-menu.cjs\",[[0,\"verdocs-floating-menu\",{\"options\":[16]}]]],[\"verdocs-kba-dialog.cjs\",[[0,\"verdocs-kba-dialog\",{\"step\":[2],\"steps\":[2],\"helptitle\":[1],\"helptext\":[1],\"mode\":[1],\"label\":[1],\"placeholder\":[1],\"choices\":[16],\"response\":[32]}]]],[\"verdocs-field-payment.cjs\",[[0,\"verdocs-field-payment\",{\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"fields\":[16],\"pageNum\":[2,\"page-num\"],\"roleName\":[1,\"role-name\"],\"fieldId\":[1,\"field-id\"],\"recipients\":[8],\"selectedRoleName\":[1,\"selected-role-name\"],\"pdfPages\":[16],\"currentSignature\":[1,\"current-signature\"],\"currentSignatureId\":[1,\"current-signature-id\"],\"currentInitial\":[1,\"current-initial\"],\"currentInitialId\":[1,\"current-initial-id\"],\"focused\":[4],\"signed\":[4],\"rerender\":[2],\"roleindex\":[2],\"preparedMessage\":[32],\"signatureUrl\":[32],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-organization-card.cjs\",[[0,\"verdocs-organization-card\",{\"organization\":[16]}]]],[\"verdocs-search-tabs.cjs\",[[0,\"verdocs-search-tabs\",{\"selected\":[32]}]]],[\"verdocs-template-card.cjs\",[[0,\"verdocs-template-card\",{\"template\":[16]}]]],[\"verdocs-template-tags.cjs\",[[0,\"verdocs-template-tags\",{\"tags\":[16]}]]],[\"verdocs-toggle.cjs\",[[0,\"verdocs-toggle\",{\"options\":[16],\"theme\":[1],\"selectedOption\":[32]}]]],[\"verdocs-view.cjs\",[[0,\"verdocs-view\",{\"endpoint\":[16],\"envelopeId\":[1,\"envelope-id\"],\"headerTargetId\":[1,\"header-target-id\"],\"canceling\":[32],\"envelope\":[32],\"roleNames\":[32],\"showCancelDone\":[32]}]]],[\"verdocs-initial-dialog.cjs\",[[0,\"verdocs-initial-dialog\",{\"initials\":[1],\"fontLoaded\":[32],\"enteredInitials\":[32],\"mode\":[32]}]]],[\"verdocs-signature-dialog.cjs\",[[0,\"verdocs-signature-dialog\",{\"name\":[1],\"fontLoaded\":[32],\"enteredName\":[32],\"mode\":[32]}]]],[\"verdocs-upload-dialog.cjs\",[[0,\"verdocs-upload-dialog\",{\"draggingOver\":[32],\"decodedFiles\":[32]}]]],[\"verdocs-status-indicator.cjs\",[[0,\"verdocs-status-indicator\",{\"size\":[1],\"theme\":[1],\"status\":[1],\"envelope\":[16],\"isOpen\":[32],\"containerId\":[32]}]]],[\"verdocs-template-star.cjs\",[[0,\"verdocs-template-star\",{\"endpoint\":[16],\"template\":[1040],\"updating\":[32]}]]],[\"verdocs-envelope-recipient-link_2.cjs\",[[0,\"verdocs-envelope-recipient-link\",{\"endpoint\":[16],\"envelopeId\":[1,\"envelope-id\"],\"roleName\":[1,\"role-name\"],\"isOpen\":[32],\"loading\":[32],\"gettingLink\":[32],\"link\":[32]}],[0,\"verdocs-envelope-recipient-summary\",{\"endpoint\":[16],\"envelopeId\":[1,\"envelope-id\"],\"canSendAnother\":[4,\"can-send-another\"],\"canView\":[4,\"can-view\"],\"canDone\":[4,\"can-done\"],\"isOpen\":[32],\"loading\":[32],\"recipientStatusIcons\":[32],\"containerId\":[32],\"gettingLinks\":[32],\"links\":[32]}]]],[\"verdocs-quick-functions_2.cjs\",[[0,\"verdocs-quick-functions\",{\"endpoint\":[16]}],[0,\"verdocs-search-box\",{\"endpoint\":[16],\"placeholder\":[1],\"type\":[1],\"query\":[1],\"grabsFocus\":[4,\"grabs-focus\"],\"focusField\":[64]}]]],[\"verdocs-envelope-document-page.cjs\",[[0,\"verdocs-envelope-document-page\",{\"endpoint\":[16],\"envelopeId\":[1,\"envelope-id\"],\"documentId\":[1,\"document-id\"],\"pageNumber\":[2,\"page-number\"],\"virtualWidth\":[2,\"virtual-width\"],\"virtualHeight\":[1026,\"virtual-height\"],\"layers\":[16],\"type\":[1],\"containerId\":[32],\"renderedWidth\":[32],\"renderedHeight\":[32],\"naturalWidth\":[32],\"naturalHeight\":[32],\"aspectRatio\":[32],\"skipFirstNotification\":[32],\"pageDisplayUri\":[32]}]]],[\"verdocs-settings-api-keys_4.cjs\",[[0,\"verdocs-settings-members\",{\"endpoint\":[16],\"members\":[32],\"invited\":[32],\"roles\":[32],\"selectedTab\":[32],\"invitingMember\":[32],\"newEmailAddress\":[32],\"newRoleId\":[32],\"submitting\":[32],\"deletingInvitation\":[32],\"resendingInvitation\":[32],\"deletingMember\":[32]}],[0,\"verdocs-settings-api-keys\",{\"endpoint\":[16],\"keys\":[32],\"creatingKey\":[32],\"createdKey\":[32],\"deletingKey\":[32],\"rotatingKey\":[32],\"newApiKeyName\":[32],\"newApiKeyProfileId\":[32],\"members\":[32]}],[0,\"verdocs-settings-organization\",{\"endpoint\":[16],\"valid\":[32],\"dirty\":[32],\"submitting\":[32],\"name\":[32],\"business_name\":[32],\"contact_email\":[32],\"phone\":[32],\"address\":[32],\"address2\":[32],\"timezone\":[32],\"url\":[32]}],[0,\"verdocs-settings-profile\",{\"endpoint\":[16],\"valid\":[32],\"dirty\":[32],\"submitting\":[32],\"first_name\":[32],\"last_name\":[32],\"email\":[32],\"phone\":[32]}]]],[\"verdocs-pagination_2.cjs\",[[0,\"verdocs-pagination\",{\"selectedPage\":[1538,\"selected-page\"],\"itemCount\":[2,\"item-count\"],\"perPage\":[2,\"per-page\"]}],[0,\"verdocs-quick-filter\",{\"options\":[16],\"label\":[1],\"value\":[1537],\"placeholder\":[1],\"open\":[32]}]]],[\"verdocs-radio-button.cjs\",[[0,\"verdocs-radio-button\",{\"checked\":[4],\"name\":[1],\"value\":[1],\"disabled\":[4]}]]],[\"verdocs-spinner.cjs\",[[0,\"verdocs-spinner\",{\"size\":[2],\"mode\":[1]}]]],[\"verdocs-tabs.cjs\",[[4,\"verdocs-tabs\",{\"tabs\":[16],\"selectedTab\":[2,\"selected-tab\"]}]]],[\"verdocs-file-chooser_2.cjs\",[[0,\"verdocs-file-chooser\",{\"endpoint\":[16],\"file\":[32]}],[0,\"verdocs-progress-bar\",{\"label\":[1],\"showPercent\":[4,\"show-percent\"],\"percent\":[2]}]]],[\"verdocs-dropdown.cjs\",[[0,\"verdocs-dropdown\",{\"options\":[16]},[[9,\"resize\",\"handleResize\"]]]]],[\"verdocs-dialog_2.cjs\",[[4,\"verdocs-dialog\"],[0,\"verdocs-table\",{\"columns\":[16],\"data\":[16]}]]],[\"verdocs-contact-picker_3.cjs\",[[0,\"verdocs-contact-picker\",{\"endpoint\":[16],\"templateRole\":[16],\"contactSuggestions\":[16],\"name\":[32],\"email\":[32],\"phone\":[32],\"message\":[32],\"showSuggestions\":[32],\"showMessage\":[32],\"delegator\":[32],\"nameFieldId\":[32],\"emailFieldId\":[32],\"phoneFieldId\":[32]}],[4,\"verdocs-portal\",{\"anchor\":[1],\"voffset\":[2],\"align\":[1]},[[11,\"scroll\",\"handleScroll\"],[11,\"resize\",\"handleResize\"],[10,\"click\",\"handleClick\"]]],[0,\"verdocs-toggle-button\",{\"active\":[4],\"icon\":[1],\"label\":[1],\"size\":[1],\"_active\":[32]}]]],[\"verdocs-template-document-page_2.cjs\",[[0,\"verdocs-template-document-page\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"documentId\":[1,\"document-id\"],\"pageNumber\":[2,\"page-number\"],\"virtualWidth\":[2,\"virtual-width\"],\"virtualHeight\":[1026,\"virtual-height\"],\"layers\":[16],\"containerId\":[32],\"renderedWidth\":[32],\"renderedHeight\":[32],\"naturalWidth\":[32],\"naturalHeight\":[32],\"aspectRatio\":[32],\"skipFirstNotification\":[32],\"pageDisplayUri\":[32]}],[0,\"verdocs-toolbar-icon\",{\"text\":[1],\"icon\":[1],\"placement\":[1],\"containerId\":[32]}]]],[\"verdocs-button_3.cjs\",[[0,\"verdocs-text-input\",{\"value\":[1537],\"label\":[1],\"placeholder\":[1],\"autocomplete\":[1],\"helpText\":[1,\"help-text\"],\"clearable\":[4],\"copyable\":[4],\"type\":[1],\"disabled\":[4],\"required\":[4]}],[0,\"verdocs-help-icon\",{\"text\":[1],\"icon\":[1],\"containerId\":[32]}],[0,\"verdocs-button\",{\"label\":[1],\"startIcon\":[1,\"start-icon\"],\"endIcon\":[1,\"end-icon\"],\"size\":[1],\"type\":[1],\"variant\":[1],\"disabled\":[4]}]]],[\"verdocs-ok-dialog.cjs\",[[0,\"verdocs-ok-dialog\",{\"heading\":[1],\"message\":[1],\"buttonLabel\":[1,\"button-label\"],\"showCancel\":[4,\"show-cancel\"],\"closed\":[32]}]]],[\"verdocs-loader.cjs\",[[0,\"verdocs-loader\"]]],[\"verdocs-checkbox_3.cjs\",[[0,\"verdocs-checkbox\",{\"checked\":[4],\"name\":[1],\"label\":[1],\"value\":[1],\"theme\":[1],\"disabled\":[4]}],[0,\"verdocs-component-error\",{\"message\":[1]}],[0,\"verdocs-select-input\",{\"value\":[1],\"label\":[1],\"options\":[16],\"disabled\":[4]}]]],[\"verdocs-preview_8.cjs\",[[0,\"verdocs-template-attachments\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"uploading\":[32],\"progressLabel\":[32],\"progressPercent\":[32],\"showDeleteError\":[32],\"confirmDeleteDocument\":[32],\"store\":[32]}],[0,\"verdocs-template-reminders\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"showPlanBlocker\":[32],\"sendReminders\":[32],\"firstReminderDays\":[32],\"reminderDays\":[32],\"dirty\":[32]}],[0,\"verdocs-send\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"environment\":[1],\"containerId\":[32],\"rolesAtLevel\":[32],\"showPickerForId\":[32],\"sessionContacts\":[32],\"sending\":[32],\"rolesCompleted\":[32],\"reset\":[64]}],[0,\"verdocs-template-name\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"name\":[32],\"dirty\":[32]}],[0,\"verdocs-template-create\",{\"endpoint\":[16],\"file\":[32],\"creating\":[32],\"progressLabel\":[32],\"progressPercent\":[32]}],[0,\"verdocs-template-visibility\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"dirty\":[32],\"personal\":[32],\"public\":[32]}],[0,\"verdocs-preview\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"]}],[0,\"verdocs-template-build-tabs\",{\"endpoint\":[16],\"templateId\":[1537,\"template-id\"],\"step\":[1537],\"store\":[32]}]]],[\"verdocs-template-fields_4.cjs\",[[0,\"verdocs-template-roles\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"showingRoleDialog\":[32],\"showingSenderDialog\":[32],\"sender\":[32]}],[0,\"verdocs-template-fields\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"toolbarTargetId\":[1,\"toolbar-target-id\"],\"placing\":[32],\"showMustSelectRole\":[32],\"selectedRoleName\":[32],\"rerender\":[32]},[[4,\"keydown\",\"handleKeyDown\"]]],[0,\"verdocs-template-role-properties\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"roleName\":[1,\"role-name\"],\"sender\":[1],\"dirty\":[32],\"saving\":[32],\"name\":[32],\"type\":[32],\"fullName\":[32],\"email\":[32],\"phone\":[32],\"allowDelegation\":[32]}],[0,\"verdocs-template-sender\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"sender\":[1],\"saving\":[32]}]]],[\"verdocs-button-panel_2.cjs\",[[0,\"verdocs-template-field-properties\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"fieldName\":[1,\"field-name\"],\"helpText\":[1,\"help-text\"],\"dirty\":[32],\"loading\":[32],\"setting\":[32],\"label\":[32],\"type\":[32],\"name\":[32],\"required\":[32],\"roleName\":[32],\"group\":[32],\"fieldType\":[32],\"options\":[32],\"placeholder\":[32],\"value\":[32],\"leading\":[32],\"showingHelp\":[32]}],[4,\"verdocs-button-panel\",{\"icon\":[1],\"showPanel\":[64],\"hidePanel\":[64],\"toggle\":[64]}]]]]"), options);
 });

package/dist/collection/components/fields/verdocs-field-textbox/verdocs-field-textbox.js

@@ -4,15 +4,18 @@ import { getRGBA } from '@verdocs/js-sdk/Utils/Colors';
 import { updateField } from '@verdocs/js-sdk/Templates/Fields';
 import { h, Host } from '@stencil/core';
 import { getFieldSettings } from '../../../utils/utils';
+import { getTemplateFieldStore } from '../../../utils/TemplateFieldStore';
 const settingsIcon = '<svg xmlns="http://www.w3.org/2000/svg" height="20" width="20"><path d="m7.5 18.5-.312-2.667q-.188-.125-.396-.25-.209-.125-.396-.229l-2.479 1.063-2.521-4.334 2.125-1.625q.021-.104.021-.229v-.458q0-.125-.021-.229L1.396 7.917l2.521-4.313 2.5 1.042q.166-.104.375-.229.208-.125.396-.229L7.5 1.5h5l.312 2.688q.188.104.396.229.209.125.396.229l2.479-1.042 2.521 4.313-2.125 1.625v.916l2.125 1.625-2.521 4.334-2.5-1.063q-.166.104-.375.229-.208.125-.396.25L12.5 18.5Zm2.479-5.521q1.229 0 2.104-.875T12.958 10q0-1.229-.875-2.104t-2.104-.875q-1.208 0-2.094.875Q7 8.771 7 10t.885 2.104q.886.875 2.094.875Zm0-1.75q-.5 0-.864-.364Q8.75 10.5 8.75 10t.365-.865q.364-.364.864-.364t.865.364q.364.365.364.865t-.364.865q-.365.364-.865.364ZM10.021 10Zm-.792 6.521h1.542l.25-2.146q.625-.167 1.198-.51.573-.344 1.031-.823l2.021.854.771-1.271-1.771-1.354q.104-.292.156-.615.052-.323.052-.656 0-.292-.052-.604-.052-.313-.135-.646l1.77-1.375-.77-1.271-2.021.875q-.479-.5-1.042-.833-.562-.334-1.187-.5l-.271-2.167H9.208l-.25 2.167q-.625.166-1.187.5-.563.333-1.042.812l-2-.854-.771 1.271 1.73 1.354q-.084.333-.136.656Q5.5 9.708 5.5 10t.052.604q.052.313.136.667l-1.73 1.354.771 1.271 2-.834q.479.459 1.042.792.562.334 1.187.5Z"/></svg>';
 /**
  * Display a text input field.
  */
 export class VerdocsFieldTextbox {
   constructor() {
+    this.fieldStore = null;
     this.endpoint = VerdocsEndpoint.getDefault();
     this.templateid = '';
     this.field = null;
+    this.fieldname = '';
     this.disabled = false;
     this.editable = false;
     this.moveable = false;
@@ -37,6 +40,10 @@ export class VerdocsFieldTextbox {
       settingsPanel.hidePanel();
     }
   }
+  async componentWillLoad() {
+    console.log('Loading field', this.field);
+    this.fieldStore = getTemplateFieldStore(this.templateid);
+  }
   componentDidRender() {
     interact.dynamicDrop(true);
     if (this.editable) {
@@ -85,6 +92,8 @@ export class VerdocsFieldTextbox {
   }
   render() {
     var _a, _b, _c, _d;
+    const f = this.fieldStore.get(this.fieldname);
+    console.log('rendering field', f);
     const settings = getFieldSettings(this.field);
     let disabled = (_b = (_a = this.disabled) !== null && _a !== void 0 ? _a : settings.disabled) !== null && _b !== void 0 ? _b : false;
     const backgroundColor = this.field['rgba'] || getRGBA(this.roleindex);
@@ -101,7 +110,6 @@ export class VerdocsFieldTextbox {
         return this.hideSettingsPanel();
       }, onSettingsChanged: e => {
         var _a;
-        console.log('here');
         (_a = this.settingsChanged) === null || _a === void 0 ? void 0 : _a.emit(e.detail);
         return this.hideSettingsPanel();
       }, helpText: 'Text boxes may be used to capture simple text input. Participant-entered values will be stored for later retrieval via the "name" field.<br /><br />If marked required, the participant must complete the field before proceeding.' })))));
@@ -183,6 +191,24 @@ export class VerdocsFieldTextbox {
         },
         "defaultValue": "null"
       },
+      "fieldname": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The name of the field to display."
+        },
+        "attribute": "fieldname",
+        "reflect": false,
+        "defaultValue": "''"
+      },
       "disabled": {
         "type": "boolean",
         "mutable": false,

package/dist/collection/components/templates/verdocs-template-field-properties/verdocs-template-field-properties.js

@@ -2,6 +2,7 @@ import uuidv4 from 'uuid-browser';
 import { VerdocsEndpoint } from '@verdocs/js-sdk';
 import { deleteField, updateField } from '@verdocs/js-sdk/Templates/Fields';
 import { h, Host } from '@stencil/core';
+import { createTemplateFieldStore } from '../../../utils/TemplateFieldStore';
 import { getTemplateStore } from '../../../utils/TemplateStore';
 import { SDKError } from '../../../utils/errors';
 const capitalize = (str) => str.charAt(0).toUpperCase() + str.slice(1);
@@ -12,21 +13,23 @@ const HelpIcon = '<svg xmlns="http://www.w3.org/2000/svg" height="24" width="24"
  */
 export class VerdocsTemplateFieldProperties {
   constructor() {
-    this.store = null;
+    this.templateStore = null;
+    this.fieldStore = null;
+    this.watcher = null;
     this.endpoint = VerdocsEndpoint.getDefault();
     this.templateId = '';
     this.fieldName = '';
     this.helpText = '';
     this.dirty = false;
     this.loading = true;
-    this.type = 'signature';
     this.setting = null;
     this.label = '';
+    this.type = 'textbox';
     this.name = '';
+    this.required = false;
     this.roleName = '';
     this.group = '';
     this.fieldType = '';
-    this.required = false;
     this.options = [];
     this.placeholder = '';
     this.value = '';
@@ -34,7 +37,7 @@ export class VerdocsTemplateFieldProperties {
     this.showingHelp = false;
   }
   async componentWillLoad() {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    var _a, _b, _c, _d, _e, _f, _g;
     try {
       this.endpoint.loadSession();
       if (!this.templateId) {
@@ -49,11 +52,36 @@ export class VerdocsTemplateFieldProperties {
         console.log('[FIELD PROPERTIES] Unable to start builder session, must be authenticated');
         return;
       }
-      this.store = await getTemplateStore(this.endpoint, this.templateId, false);
-      const field = (_b = (_a = this.store) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.fields.find(field => field.name === this.fieldName);
+      this.templateStore = await getTemplateStore(this.endpoint, this.templateId);
+      this.fieldStore = await createTemplateFieldStore(this.templateStore.state);
+      const field = this.fieldStore.get(this.fieldName);
       if (!field) {
-        console.log(`[FIELD PROPERTIES] Unable to find field "${this.fieldName}" in template`);
+        console.log(`[FIELD PROPERTIES] Unable to find field "${this.fieldName}" in fields`);
+      }
+      else {
+        console.log('props', field);
       }
+      createTemplateFieldStore(this.templateStore.state);
+      this.watcher = this.fieldStore.onChange(this.fieldName, field => {
+        var _a, _b, _c, _d;
+        console.log('Field changed', field);
+        this.type = field.type;
+        this.name = field.name;
+        this.label = field.label;
+        this.group = field.name;
+        this.roleName = field.role_name;
+        this.required = field.required;
+        this.fieldType = field.type;
+        // TODO: Talk about how we want to handle labels/placeholders
+        this.placeholder = ((_a = field.setting) === null || _a === void 0 ? void 0 : _a.placeholder) || '';
+        this.value = ((_b = field.setting) === null || _b === void 0 ? void 0 : _b.result) || '';
+        this.leading = ((_c = field.setting) === null || _c === void 0 ? void 0 : _c.leading) || 0;
+        this.setting = field.setting || {};
+        this.options = ((_d = field.setting) === null || _d === void 0 ? void 0 : _d.options) || [];
+        this.dirty = false;
+        this.loading = false;
+      });
+      console.log('watcher', this.watcher);
       this.type = field.type;
       this.name = field.name;
       this.label = field.label;
@@ -62,36 +90,37 @@ export class VerdocsTemplateFieldProperties {
       this.required = field.required;
       this.fieldType = field.type;
       // TODO: Talk about how we want to handle labels/placeholders
-      this.placeholder = ((_c = field.setting) === null || _c === void 0 ? void 0 : _c.placeholder) || '';
-      this.value = ((_d = field.setting) === null || _d === void 0 ? void 0 : _d.result) || '';
-      this.leading = ((_e = field.setting) === null || _e === void 0 ? void 0 : _e.leading) || 0;
+      this.placeholder = ((_a = field.setting) === null || _a === void 0 ? void 0 : _a.placeholder) || '';
+      this.value = ((_b = field.setting) === null || _b === void 0 ? void 0 : _b.result) || '';
+      this.leading = ((_c = field.setting) === null || _c === void 0 ? void 0 : _c.leading) || 0;
       this.setting = field.setting || {};
-      this.options = ((_f = field.setting) === null || _f === void 0 ? void 0 : _f.options) || [];
+      this.options = ((_d = field.setting) === null || _d === void 0 ? void 0 : _d.options) || [];
       this.dirty = false;
       this.loading = false;
+      console.log('Displaying settings for', this.setting);
     }
     catch (e) {
       console.log('[FIELD PROPERTIES] Error loading template', e);
       this.loading = false;
-      (_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));
+      (_e = this.sdkError) === null || _e === void 0 ? void 0 : _e.emit(new SDKError(e.message, (_f = e.response) === null || _f === void 0 ? void 0 : _f.status, (_g = e.response) === null || _g === void 0 ? void 0 : _g.data));
     }
   }
   handleCancel(e) {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b, _c, _d;
     e.stopPropagation();
-    const field = (_b = (_a = this.store) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.fields.find(field => field.name === this.fieldName);
+    const field = this.fieldStore.get(this.fieldName);
     if (field) {
       this.name = field.name;
       this.label = field.label;
       this.roleName = field.role_name;
       this.required = field.required;
       // TODO: Talk about how we want to handle labels/placeholders
-      this.placeholder = ((_c = field.setting) === null || _c === void 0 ? void 0 : _c.placeholder) || '';
-      this.value = ((_d = field.setting) === null || _d === void 0 ? void 0 : _d.result) || '';
-      this.leading = ((_e = field.setting) === null || _e === void 0 ? void 0 : _e.leading) || 0;
+      this.placeholder = ((_a = field.setting) === null || _a === void 0 ? void 0 : _a.placeholder) || '';
+      this.value = ((_b = field.setting) === null || _b === void 0 ? void 0 : _b.result) || '';
+      this.leading = ((_c = field.setting) === null || _c === void 0 ? void 0 : _c.leading) || 0;
     }
     this.dirty = false;
-    (_f = this.close) === null || _f === void 0 ? void 0 : _f.emit();
+    (_d = this.close) === null || _d === void 0 ? void 0 : _d.emit();
   }
   handleSave(e) {
     e.stopPropagation();
@@ -117,6 +146,7 @@ export class VerdocsTemplateFieldProperties {
         options: this.options,
       };
     }
+    console.log('FP: Will update', newProperties);
     updateField(this.endpoint, this.templateId, this.fieldName, newProperties)
       .then(field => {
       var _a, _b;
@@ -168,33 +198,19 @@ export class VerdocsTemplateFieldProperties {
     });
   }
   updateField(newField) {
-    const newFields = [...this.store.state.fields];
-    newFields.forEach(field => {
-      if (field.name === this.fieldName) {
-        Object.assign(field, newField);
-        // field.name = this.name;
-        // field.role_name = this.roleName;
-        // field.required = this.required;
-        // field.label = this.placeholder;
-        // field.setting.result = this.defaultValue;
-        // if (field.setting.options) {
-        //   field.setting.options = this.options;
-        // }
-      }
-    });
-    this.store.state.fields = newFields;
+    const oldField = this.fieldStore.get(this.fieldName) || {};
+    console.log('Updating field', newField, oldField);
+    Object.assign(oldField, newField);
+    this.fieldStore.set(this.fieldName, newField);
   }
   async handleDelete(e) {
     e.stopPropagation();
     if (window.confirm('Are you sure you wish to remove this field? This action cannot be undone.')) {
       deleteField(this.endpoint, this.templateId, this.fieldName)
         .then(() => {
-        var _a, _b, _c, _d, _e;
-        this.store.state.fields = [...(_b = (_a = this.store) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.fields.filter(field => field.name !== this.fieldName)];
-        (_d = (_c = this.store) === null || _c === void 0 ? void 0 : _c.state) === null || _d === void 0 ? void 0 : _d.roles.forEach(role => {
-          role.fields = [...role.fields.filter(field => field.name !== this.fieldName)];
-        });
-        (_e = this.delete) === null || _e === void 0 ? void 0 : _e.emit({ templateId: this.templateId, roleName: this.roleName });
+        var _a;
+        this.fieldStore.set(this.fieldName, undefined);
+        (_a = this.delete) === null || _a === void 0 ? void 0 : _a.emit({ templateId: this.templateId, roleName: this.roleName });
       })
         .catch(e => {
         console.log('[FIELD PROPERTIES] Deletion error', e);
@@ -202,12 +218,13 @@ export class VerdocsTemplateFieldProperties {
     }
   }
   render() {
-    var _a, _b, _c, _d;
+    var _a;
+    // console.log('Rendering field properties', this.fieldStore.get(this.fieldName));
     if (!this.endpoint.session) {
       return (h(Host, null, h("verdocs-component-error", { message: "You must be authenticated to use this module." })));
     }
     // This is meant to be a companion for larger visual experiences so we just go blank on errors for now.
-    if (!this.endpoint.session || !((_b = (_a = this.store) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.isLoaded)) {
+    if (!this.endpoint.session || !this.fieldStore.get(this.fieldName)) {
       return h(Host, { class: "empty" });
     }
     if (this.helpText && this.showingHelp) {
@@ -223,7 +240,7 @@ export class VerdocsTemplateFieldProperties {
       placeholder: "Optional Label...", onInput: (e) => {
         this.label = e.target.value;
         this.dirty = true;
-      } })), h("div", { class: "row" }, h("div", { class: "input-label" }, "Role:"), h("verdocs-select-input", { value: this.roleName, options: (_d = (_c = this.store) === null || _c === void 0 ? void 0 : _c.state) === null || _d === void 0 ? void 0 : _d.roles.map(role => ({ label: role.name, value: role.name })), onInput: (e) => {
+      } })), h("div", { class: "row" }, h("div", { class: "input-label" }, "Role:"), h("verdocs-select-input", { value: this.roleName, options: (_a = this.templateStore.state) === null || _a === void 0 ? void 0 : _a.roles.map(role => ({ label: role.name, value: role.name })), onInput: (e) => {
         this.roleName = e.target.value;
         this.dirty = true;
       } })), ['textbox', 'textarea'].includes(this.type) && (h("div", { class: "row", style: { marginTop: '10px', marginBottom: '10px' } }, h("verdocs-text-input", { id: "verdocs-field-value", label: "Value", value: this.value, autocomplete: "off", placeholder: "Pre-defined value...", onInput: (e) => {
@@ -355,14 +372,14 @@ export class VerdocsTemplateFieldProperties {
     return {
       "dirty": {},
       "loading": {},
-      "type": {},
       "setting": {},
       "label": {},
+      "type": {},
       "name": {},
+      "required": {},
       "roleName": {},
       "group": {},
       "fieldType": {},
-      "required": {},
       "options": {},
       "placeholder": {},
       "value": {},