@verdocs/web-sdk 2.3.45 → 2.3.47

package/dist/cjs/{TemplateFieldStore-fbc03ef8.js → TemplateFieldStore-43a0b60d.js}

@@ -16,10 +16,6 @@ const createTemplateFieldStore = (template) => {
     store = index.createStore({ fields: [] });
     templateFieldStores[template.id] = store;
   }
-  else {
-    console.log('Resetting template field store for template', template);
-    store.reset();
-  }
   store.set('fields', [...template.fields]);
   return store;
 };

package/dist/cjs/{TemplateRoleStore-3b2ea92e.js → TemplateRoleStore-df60674d.js}

@@ -16,10 +16,6 @@ const createTemplateRoleStore = (template) => {
     store = index.createStore({ roles: [] });
     templateRoleStores[template.id] = store;
   }
-  else {
-    console.log('Resetting template role store for template', template);
-    store.reset();
-  }
   store.set('roles', [...template.roles]);
   return store;
 };

package/dist/cjs/{TemplateStore-42660916.js → TemplateStore-2432259f.js}

@@ -2,8 +2,8 @@
 
 const index = require('./index-f712049c.js');
 const VerdocsEndpoint = require('./VerdocsEndpoint-8f298664.js');
-const TemplateRoleStore = require('./TemplateRoleStore-3b2ea92e.js');
-const TemplateFieldStore = require('./TemplateFieldStore-fbc03ef8.js');
+const TemplateRoleStore = require('./TemplateRoleStore-df60674d.js');
+const TemplateFieldStore = require('./TemplateFieldStore-43a0b60d.js');
 
 const createTemplateStore = (templateId) => {
   const now = new Date().toISOString();

package/dist/cjs/ipc-test.cjs.entry.js

@@ -5,10 +5,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-5463795e.js');
 require('./Types-f89f9116.js');
 const VerdocsEndpoint = require('./VerdocsEndpoint-8f298664.js');
-const TemplateStore = require('./TemplateStore-42660916.js');
+const TemplateStore = require('./TemplateStore-2432259f.js');
 require('./index-f712049c.js');
-require('./TemplateRoleStore-3b2ea92e.js');
-require('./TemplateFieldStore-fbc03ef8.js');
+require('./TemplateRoleStore-df60674d.js');
+require('./TemplateFieldStore-43a0b60d.js');
 
 const ipcTestCss = "ipc-test{max-width:800px;display:block}";
 

package/dist/cjs/{utils-ac526133.js → utils-108da29c.js}

@@ -298,6 +298,10 @@ const updateCssTransform = (el, key, value) => {
     el.style.transform = currentTransform + ' ' + newValue;
   }
 };
+const removeCssTransform = (el, key) => {
+  const currentTransform = el.style.transform || '';
+  el.style.transform = currentTransform.replace(new RegExp(`${key}\\(.+?\\)`), '');
+};
 const saveAttachment = async (endpoint, envelope, documentId) => {
   // e.g. "Colorado-Motor-Vehicle-Bill-of-Sale.pdf"
   const date = index.format(new Date(envelope.updated_at), Types.FORMAT_DATE);
@@ -384,6 +388,7 @@ exports.defaultHeight = defaultHeight;
 exports.defaultWidth = defaultWidth;
 exports.getFieldId = getFieldId;
 exports.getFieldSettings = getFieldSettings;
+exports.removeCssTransform = removeCssTransform;
 exports.renderDocumentField = renderDocumentField;
 exports.renderedTextWidth = renderedTextWidth;
 exports.saveAttachment = saveAttachment;

package/dist/cjs/verdocs-build.cjs.entry.js

@@ -5,11 +5,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-5463795e.js');
 require('./Types-f89f9116.js');
 const VerdocsEndpoint = require('./VerdocsEndpoint-8f298664.js');
-const TemplateStore = require('./TemplateStore-42660916.js');
+const TemplateStore = require('./TemplateStore-2432259f.js');
 const errors = require('./errors-0396da3d.js');
 require('./index-f712049c.js');
-require('./TemplateRoleStore-3b2ea92e.js');
-require('./TemplateFieldStore-fbc03ef8.js');
+require('./TemplateRoleStore-df60674d.js');
+require('./TemplateFieldStore-43a0b60d.js');
 
 const verdocsBuildCss = "verdocs-build{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-build .content{-ms-flex:1;flex:1;gap:20px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column}verdocs-build verdocs-template-attachments,verdocs-build verdocs-template-roles{margin:20px}verdocs-build verdocs-template-fields{border-top:1px solid #777777}verdocs-build verdocs-template-attachments{padding:20px;background:#ffffff}verdocs-build verdocs-template-fields{width:100%}verdocs-build verdocs-preview{-ms-flex:1;flex:1}verdocs-build .preview-container{-ms-flex-direction:row;flex-direction:row;display:-ms-flexbox;display:flex;width:100%;background-color:#eeeeee;max-height:100%}@media all and (max-width: 450px){verdocs-build .preview-container{-ms-flex-direction:column;flex-direction:column}}verdocs-build .preview-send-wrapper{display:-ms-flexbox;display:flex;-ms-flex:0 0 300px;flex:0 0 300px;background-color:#ffffff;-webkit-box-shadow:1px 1px 6px -2px #0000007f;box-shadow:1px 1px 6px -2px #0000007f}@media all and (max-width: 450px){verdocs-build .preview-send-wrapper{-ms-flex:0;flex:0}}verdocs-build .preview-preview-wrapper{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-pack:center;justify-content:center;overflow-y:scroll}";
 

package/dist/cjs/verdocs-contact-picker_2.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-5463795e.js');
 require('./Types-f89f9116.js');
 const VerdocsEndpoint = require('./VerdocsEndpoint-8f298664.js');
-const utils = require('./utils-ac526133.js');
+const utils = require('./utils-108da29c.js');
 require('./_commonjsHelpers-1fbbf0eb.js');
 require('./Envelopes-0b9deb2c.js');
 require('./Files-4bdc0c0f.js');

package/dist/cjs/verdocs-envelope-document-page.cjs.entry.js

@@ -6,7 +6,7 @@ const index = require('./index-5463795e.js');
 const Envelopes = require('./Envelopes-0b9deb2c.js');
 require('./Types-f89f9116.js');
 const VerdocsEndpoint = require('./VerdocsEndpoint-8f298664.js');
-const utils = require('./utils-ac526133.js');
+const utils = require('./utils-108da29c.js');
 require('./_commonjsHelpers-1fbbf0eb.js');
 require('./Files-4bdc0c0f.js');
 require('./Types-fb95ed6b.js');

package/dist/cjs/verdocs-envelopes-list.cjs.entry.js

@@ -8,7 +8,7 @@ const Permissions = require('./Permissions-1436f847.js');
 require('./Types-f89f9116.js');
 const VerdocsEndpoint = require('./VerdocsEndpoint-8f298664.js');
 const Primitives = require('./Primitives-a59870a2.js');
-const utils = require('./utils-ac526133.js');
+const utils = require('./utils-108da29c.js');
 const Toast = require('./Toast-06880504.js');
 const errors = require('./errors-0396da3d.js');
 require('./_commonjsHelpers-1fbbf0eb.js');

package/dist/cjs/verdocs-field-attachment.cjs.entry.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5463795e.js');
 const Colors = require('./Colors-e809dcc9.js');
-const TemplateRoleStore = require('./TemplateRoleStore-3b2ea92e.js');
-const TemplateFieldStore = require('./TemplateFieldStore-fbc03ef8.js');
-const utils = require('./utils-ac526133.js');
+const TemplateRoleStore = require('./TemplateRoleStore-df60674d.js');
+const TemplateFieldStore = require('./TemplateFieldStore-43a0b60d.js');
+const utils = require('./utils-108da29c.js');
 const Icons = require('./Icons-3286d014.js');
 require('./index-f712049c.js');
 require('./_commonjsHelpers-1fbbf0eb.js');

package/dist/cjs/verdocs-field-checkbox.cjs.entry.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5463795e.js');
 const Colors = require('./Colors-e809dcc9.js');
-const TemplateRoleStore = require('./TemplateRoleStore-3b2ea92e.js');
-const TemplateFieldStore = require('./TemplateFieldStore-fbc03ef8.js');
-const utils = require('./utils-ac526133.js');
+const TemplateRoleStore = require('./TemplateRoleStore-df60674d.js');
+const TemplateFieldStore = require('./TemplateFieldStore-43a0b60d.js');
+const utils = require('./utils-108da29c.js');
 const Icons = require('./Icons-3286d014.js');
 require('./index-f712049c.js');
 require('./_commonjsHelpers-1fbbf0eb.js');

package/dist/cjs/verdocs-field-date.cjs.entry.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5463795e.js');
 const Colors = require('./Colors-e809dcc9.js');
-const TemplateRoleStore = require('./TemplateRoleStore-3b2ea92e.js');
-const TemplateFieldStore = require('./TemplateFieldStore-fbc03ef8.js');
-const utils = require('./utils-ac526133.js');
+const TemplateRoleStore = require('./TemplateRoleStore-df60674d.js');
+const TemplateFieldStore = require('./TemplateFieldStore-43a0b60d.js');
+const utils = require('./utils-108da29c.js');
 const Icons = require('./Icons-3286d014.js');
 const Types = require('./Types-fb95ed6b.js');
 const index$1 = require('./index-7c19ba1d.js');

package/dist/cjs/verdocs-field-dropdown.cjs.entry.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5463795e.js');
 const Colors = require('./Colors-e809dcc9.js');
-const TemplateRoleStore = require('./TemplateRoleStore-3b2ea92e.js');
-const TemplateFieldStore = require('./TemplateFieldStore-fbc03ef8.js');
-const utils = require('./utils-ac526133.js');
+const TemplateRoleStore = require('./TemplateRoleStore-df60674d.js');
+const TemplateFieldStore = require('./TemplateFieldStore-43a0b60d.js');
+const utils = require('./utils-108da29c.js');
 const Icons = require('./Icons-3286d014.js');
 require('./index-f712049c.js');
 require('./_commonjsHelpers-1fbbf0eb.js');

package/dist/cjs/verdocs-field-initial.cjs.entry.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5463795e.js');
 const Colors = require('./Colors-e809dcc9.js');
-const TemplateRoleStore = require('./TemplateRoleStore-3b2ea92e.js');
-const TemplateFieldStore = require('./TemplateFieldStore-fbc03ef8.js');
-const utils = require('./utils-ac526133.js');
+const TemplateRoleStore = require('./TemplateRoleStore-df60674d.js');
+const TemplateFieldStore = require('./TemplateFieldStore-43a0b60d.js');
+const utils = require('./utils-108da29c.js');
 const Icons = require('./Icons-3286d014.js');
 require('./index-f712049c.js');
 require('./_commonjsHelpers-1fbbf0eb.js');

package/dist/cjs/verdocs-field-payment.cjs.entry.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5463795e.js');
 const Colors = require('./Colors-e809dcc9.js');
-const TemplateRoleStore = require('./TemplateRoleStore-3b2ea92e.js');
-const TemplateFieldStore = require('./TemplateFieldStore-fbc03ef8.js');
-const utils = require('./utils-ac526133.js');
+const TemplateRoleStore = require('./TemplateRoleStore-df60674d.js');
+const TemplateFieldStore = require('./TemplateFieldStore-43a0b60d.js');
+const utils = require('./utils-108da29c.js');
 require('./index-f712049c.js');
 require('./_commonjsHelpers-1fbbf0eb.js');
 require('./Envelopes-0b9deb2c.js');

package/dist/cjs/verdocs-field-radio-button.cjs.entry.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5463795e.js');
 const Colors = require('./Colors-e809dcc9.js');
-const TemplateRoleStore = require('./TemplateRoleStore-3b2ea92e.js');
-const TemplateFieldStore = require('./TemplateFieldStore-fbc03ef8.js');
-const utils = require('./utils-ac526133.js');
+const TemplateRoleStore = require('./TemplateRoleStore-df60674d.js');
+const TemplateFieldStore = require('./TemplateFieldStore-43a0b60d.js');
+const utils = require('./utils-108da29c.js');
 const Icons = require('./Icons-3286d014.js');
 require('./index-f712049c.js');
 require('./_commonjsHelpers-1fbbf0eb.js');

package/dist/cjs/verdocs-field-signature.cjs.entry.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5463795e.js');
 const Colors = require('./Colors-e809dcc9.js');
-const TemplateRoleStore = require('./TemplateRoleStore-3b2ea92e.js');
-const TemplateFieldStore = require('./TemplateFieldStore-fbc03ef8.js');
-const utils = require('./utils-ac526133.js');
+const TemplateRoleStore = require('./TemplateRoleStore-df60674d.js');
+const TemplateFieldStore = require('./TemplateFieldStore-43a0b60d.js');
+const utils = require('./utils-108da29c.js');
 const Icons = require('./Icons-3286d014.js');
 require('./index-f712049c.js');
 require('./_commonjsHelpers-1fbbf0eb.js');

package/dist/cjs/verdocs-field-textarea.cjs.entry.js

@@ -8,9 +8,9 @@ require('./Types-f89f9116.js');
 const VerdocsEndpoint = require('./VerdocsEndpoint-8f298664.js');
 const Fields = require('./Fields-705a2168.js');
 const Colors = require('./Colors-e809dcc9.js');
-const TemplateFieldStore = require('./TemplateFieldStore-fbc03ef8.js');
-const TemplateRoleStore = require('./TemplateRoleStore-3b2ea92e.js');
-const utils = require('./utils-ac526133.js');
+const TemplateFieldStore = require('./TemplateFieldStore-43a0b60d.js');
+const TemplateRoleStore = require('./TemplateRoleStore-df60674d.js');
+const utils = require('./utils-108da29c.js');
 const Icons = require('./Icons-3286d014.js');
 require('./_commonjsHelpers-1fbbf0eb.js');
 require('./index-f712049c.js');

package/dist/cjs/verdocs-field-textbox.cjs.entry.js

@@ -8,9 +8,9 @@ require('./Types-f89f9116.js');
 const VerdocsEndpoint = require('./VerdocsEndpoint-8f298664.js');
 const Fields = require('./Fields-705a2168.js');
 const Colors = require('./Colors-e809dcc9.js');
-const TemplateRoleStore = require('./TemplateRoleStore-3b2ea92e.js');
-const TemplateFieldStore = require('./TemplateFieldStore-fbc03ef8.js');
-const utils = require('./utils-ac526133.js');
+const TemplateRoleStore = require('./TemplateRoleStore-df60674d.js');
+const TemplateFieldStore = require('./TemplateFieldStore-43a0b60d.js');
+const utils = require('./utils-108da29c.js');
 const Icons = require('./Icons-3286d014.js');
 require('./_commonjsHelpers-1fbbf0eb.js');
 require('./index-f712049c.js');

package/dist/cjs/verdocs-field-timestamp.cjs.entry.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5463795e.js');
 const Colors = require('./Colors-e809dcc9.js');
-const TemplateRoleStore = require('./TemplateRoleStore-3b2ea92e.js');
-const TemplateFieldStore = require('./TemplateFieldStore-fbc03ef8.js');
-const utils = require('./utils-ac526133.js');
+const TemplateRoleStore = require('./TemplateRoleStore-df60674d.js');
+const TemplateFieldStore = require('./TemplateFieldStore-43a0b60d.js');
+const utils = require('./utils-108da29c.js');
 const Types = require('./Types-fb95ed6b.js');
 const Icons = require('./Icons-3286d014.js');
 const index$1 = require('./index-7c19ba1d.js');

package/dist/cjs/verdocs-pagination_2.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5463795e.js');
 const Primitives = require('./Primitives-a59870a2.js');
-const utils = require('./utils-ac526133.js');
+const utils = require('./utils-108da29c.js');
 const popper = require('./popper-d7adcfc6.js');
 require('./_commonjsHelpers-1fbbf0eb.js');
 require('./Envelopes-0b9deb2c.js');

package/dist/cjs/verdocs-portal_2.cjs.entry.js

@@ -7,9 +7,9 @@ const _commonjsHelpers = require('./_commonjsHelpers-1fbbf0eb.js');
 require('./Types-f89f9116.js');
 const VerdocsEndpoint = require('./VerdocsEndpoint-8f298664.js');
 const Fields = require('./Fields-705a2168.js');
-const TemplateFieldStore = require('./TemplateFieldStore-fbc03ef8.js');
-const TemplateRoleStore = require('./TemplateRoleStore-3b2ea92e.js');
-const TemplateStore = require('./TemplateStore-42660916.js');
+const TemplateFieldStore = require('./TemplateFieldStore-43a0b60d.js');
+const TemplateRoleStore = require('./TemplateRoleStore-df60674d.js');
+const TemplateStore = require('./TemplateStore-2432259f.js');
 const errors = require('./errors-0396da3d.js');
 require('./index-f712049c.js');
 

package/dist/cjs/verdocs-preview_8.cjs.entry.js

@@ -5,10 +5,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-5463795e.js');
 require('./Types-f89f9116.js');
 const VerdocsEndpoint = require('./VerdocsEndpoint-8f298664.js');
-const TemplateFieldStore = require('./TemplateFieldStore-fbc03ef8.js');
-const TemplateRoleStore = require('./TemplateRoleStore-3b2ea92e.js');
-const TemplateStore = require('./TemplateStore-42660916.js');
-const utils = require('./utils-ac526133.js');
+const TemplateFieldStore = require('./TemplateFieldStore-43a0b60d.js');
+const TemplateRoleStore = require('./TemplateRoleStore-df60674d.js');
+const TemplateStore = require('./TemplateStore-2432259f.js');
+const utils = require('./utils-108da29c.js');
 const errors = require('./errors-0396da3d.js');
 const Envelopes = require('./Envelopes-0b9deb2c.js');
 const Validators = require('./Validators-16e6d7d1.js');

package/dist/cjs/verdocs-settings-api-keys_4.cjs.entry.js

@@ -10,7 +10,7 @@ const Toast = require('./Toast-06880504.js');
 const errors = require('./errors-0396da3d.js');
 const Profiles = require('./Profiles-1a26e4eb.js');
 const index$1 = require('./index-7c19ba1d.js');
-const utils = require('./utils-ac526133.js');
+const utils = require('./utils-108da29c.js');
 require('./_commonjsHelpers-1fbbf0eb.js');
 require('./Envelopes-0b9deb2c.js');
 require('./Files-4bdc0c0f.js');

package/dist/cjs/verdocs-sign.cjs.entry.js

@@ -9,8 +9,8 @@ const Recipients = require('./Recipients-f3d6cf10.js');
 const VerdocsEndpoint = require('./VerdocsEndpoint-8f298664.js');
 const Validators = require('./Validators-16e6d7d1.js');
 const Primitives = require('./Primitives-a59870a2.js');
-const utils = require('./utils-ac526133.js');
-const TemplateFieldStore = require('./TemplateFieldStore-fbc03ef8.js');
+const utils = require('./utils-108da29c.js');
+const TemplateFieldStore = require('./TemplateFieldStore-43a0b60d.js');
 const Types = require('./Types-fb95ed6b.js');
 const Toast = require('./Toast-06880504.js');
 const errors = require('./errors-0396da3d.js');

package/dist/cjs/verdocs-template-document-page_2.cjs.entry.js

@@ -6,7 +6,7 @@ const index = require('./index-5463795e.js');
 require('./Types-f89f9116.js');
 const VerdocsEndpoint = require('./VerdocsEndpoint-8f298664.js');
 const TemplateDocuments = require('./TemplateDocuments-e2e0e6b7.js');
-const utils = require('./utils-ac526133.js');
+const utils = require('./utils-108da29c.js');
 const popper = require('./popper-d7adcfc6.js');
 require('./_commonjsHelpers-1fbbf0eb.js');
 require('./Envelopes-0b9deb2c.js');

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

@@ -8,10 +8,10 @@ require('./Types-f89f9116.js');
 const VerdocsEndpoint = require('./VerdocsEndpoint-8f298664.js');
 const Fields = require('./Fields-705a2168.js');
 const Primitives = require('./Primitives-a59870a2.js');
-const TemplateFieldStore = require('./TemplateFieldStore-fbc03ef8.js');
-const utils = require('./utils-ac526133.js');
-const TemplateRoleStore = require('./TemplateRoleStore-3b2ea92e.js');
-const TemplateStore = require('./TemplateStore-42660916.js');
+const TemplateFieldStore = require('./TemplateFieldStore-43a0b60d.js');
+const utils = require('./utils-108da29c.js');
+const TemplateRoleStore = require('./TemplateRoleStore-df60674d.js');
+const TemplateStore = require('./TemplateStore-2432259f.js');
 const errors = require('./errors-0396da3d.js');
 const Colors = require('./Colors-e809dcc9.js');
 require('./_commonjsHelpers-1fbbf0eb.js');
@@ -274,7 +274,9 @@ const VerdocsTemplateFields = class {
     TemplateFieldStore.updateStoreField(this.fieldStore, name, newFieldData);
     event.target.removeAttribute('posX');
     event.target.removeAttribute('posY');
+    console.log('Will remove CSS transform', event.target.style.transform);
     // this.reRenderField(newFieldData, pageNumber);
+    utils.removeCssTransform(event.target, 'transform');
     console.log('[FIELDS] Updated', name, newFieldData);
     (_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' });
   }
@@ -617,11 +619,11 @@ const VerdocsTemplateRoles = class {
         this.templateStore = ts;
         this.roleStore = TemplateRoleStore.getTemplateRoleStore(this.templateId);
         console.log('RS', (_a = this.roleStore) === null || _a === void 0 ? void 0 : _a.state);
+        this.loading = false;
         this.roleStore.onChange('roles', roles => {
           var _a;
           console.log('[ROLES] Roles changed', { roles });
           (_a = this.rolesUpdated) === null || _a === void 0 ? void 0 : _a.emit({ event: 'updated', endpoint: this.endpoint, templateId: this.templateId, roles });
-          this.loading = false;
         });
       })
         .catch(e => {
@@ -794,18 +796,19 @@ const VerdocsTemplateRoles = class {
     this.callCreateRole(name, sequence, order);
   }
   render() {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     if (!this.endpoint.session) {
       return (index.h(index.Host, null, index.h("verdocs-component-error", { message: "You must be authenticated to use this module." })));
     }
     if (this.loading || !((_a = this.templateStore) === null || _a === void 0 ? void 0 : _a.state.isLoaded)) {
+      console.log('Loading', this.loading, (_b = this.templateStore) === null || _b === void 0 ? void 0 : _b.state.isLoaded);
       return (index.h(index.Host, { class: "loading" }, index.h("verdocs-loader", null)));
     }
     console.log('Rendering roles', this.roleStore.get('roles'));
     const roleNames = this.getRoleNames();
     const sequences = this.getSequenceNumbers();
     console.log('Rendering', roleNames, sequences);
-    return (index.h(index.Host, null, index.h("form", { onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, index.h("h5", null, "Roles and Workflow"), index.h("div", { class: "participants" }, index.h("div", { class: "left-line" }), index.h("div", { class: "row" }, index.h("div", { class: "icon", innerHTML: startIcon }), index.h("div", { class: "row-roles" }, index.h("div", { class: "sender" }, index.h("span", { class: "label" }, "Sender:"), " ", senderLabels[(_c = (_b = this.templateStore) === null || _b === void 0 ? void 0 : _b.state) === null || _c === void 0 ? void 0 : _c.sender], ' ', index.h("div", { class: "settings-button", innerHTML: settingsIcon, onClick: () => (this.showingSenderDialog = true), "aria-role": "button" })))), index.h("div", { class: "row add-sequence", "data-sequence": 0 }, index.h("div", { class: "icon", innerHTML: plusIcon }), index.h("div", { class: "row-roles" }, index.h("div", { class: "dropzone", "data-sequence": 0, "data-order": 1 }, "Add Step"))), sequences.map(sequence => (index.h(index.Fragment, null, index.h("div", { class: "row" }, index.h("div", { class: "icon", innerHTML: stepIcon }), index.h("div", { class: "row-roles" }, index.h("div", { class: "dropzone", "data-order": 0.5, "data-sequence": sequence }), this.getRolesAtSequence(sequence).map(role => {
+    return (index.h(index.Host, null, index.h("form", { onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, index.h("h5", null, "Roles and Workflow"), index.h("div", { class: "participants" }, index.h("div", { class: "left-line" }), index.h("div", { class: "row" }, index.h("div", { class: "icon", innerHTML: startIcon }), index.h("div", { class: "row-roles" }, index.h("div", { class: "sender" }, index.h("span", { class: "label" }, "Sender:"), " ", senderLabels[(_d = (_c = this.templateStore) === null || _c === void 0 ? void 0 : _c.state) === null || _d === void 0 ? void 0 : _d.sender], ' ', index.h("div", { class: "settings-button", innerHTML: settingsIcon, onClick: () => (this.showingSenderDialog = true), "aria-role": "button" })))), index.h("div", { class: "row add-sequence", "data-sequence": 0 }, index.h("div", { class: "icon", innerHTML: plusIcon }), index.h("div", { class: "row-roles" }, index.h("div", { class: "dropzone", "data-sequence": 0, "data-order": 1 }, "Add Step"))), sequences.map(sequence => (index.h(index.Fragment, null, index.h("div", { class: "row" }, index.h("div", { class: "icon", innerHTML: stepIcon }), index.h("div", { class: "row-roles" }, index.h("div", { class: "dropzone", "data-order": 0.5, "data-sequence": sequence }), this.getRolesAtSequence(sequence).map(role => {
       const unknown = !role.email;
       return unknown ? (index.h(index.Fragment, null, index.h("div", { class: "recipient", style: { backgroundColor: Colors.getRGBA(TemplateRoleStore.getRoleIndex(this.roleStore, role.name)) }, "data-rolename": role.name, "data-sequence": sequence, "data-order": role.order }, index.h("span", { class: "type-icon", innerHTML: role.type === 'signer' ? iconSigner : role.type === 'cc' ? iconCC : iconApprover }), role.name, " ", index.h("div", { class: "settings-button", innerHTML: settingsIcon, onClick: () => (this.showingRoleDialog = role.name), "aria-role": "button" })), index.h("div", { class: "dropzone", "data-order": role.order + 0.5, "data-sequence": sequence }))) : (index.h(index.Fragment, null, index.h("div", { class: "recipient", style: { borderColor: Colors.getRGBA(TemplateRoleStore.getRoleIndex(this.roleStore, role.name)) }, "data-rolename": role.name, "data-sequence": sequence, "data-order": role.order }, index.h("span", { class: "type-icon", innerHTML: role.type === 'signer' ? iconSigner : role.type === 'cc' ? iconCC : iconApprover }), role.full_name, " ", index.h("div", { class: "settings-button", innerHTML: settingsIcon, onClick: () => (this.showingRoleDialog = role.name), "aria-role": "button" })), index.h("div", { class: "dropzone", "data-order": role.order + 0.5, "data-sequence": sequence })));
     }), index.h("button", { class: "add-role", innerHTML: plusIcon, onClick: e => this.handleAddRole(e, sequence) }))), sequences.length > 0 && (index.h("div", { class: "row add-sequence", "data-sequence": sequence }, index.h("div", { class: "row-roles" }, index.h("div", { class: "icon", innerHTML: plusIcon }), index.h("div", { class: "dropzone", "data-sequence": sequence + 1, "data-order": 1 }, "Add Step"))))))), index.h("div", { class: "row", "data-sequence": sequences.length + 1 }, index.h("div", { class: "row-roles" }, index.h("div", { class: "icon", innerHTML: plusIcon }), index.h("button", { class: "add-step", innerHTML: plusIcon, onClick: e => this.handleAddStep(e, sequences.length + 1) }))), index.h("div", { class: "row" }, index.h("div", { class: "icon", innerHTML: doneIcon }), index.h("div", { class: "row-roles" }, index.h("div", { class: "complete" }, "Document Complete")))), roleNames.length < 1 && (index.h("div", { class: "empty" }, "You must add at least one Role before proceeding.", index.h("br", null), " Click the ", index.h("span", { innerHTML: plusIcon }), " Add button above to get started.")), index.h("div", { class: "buttons" }, index.h("div", { class: "flex-fill" }), index.h("verdocs-button", { variant: "outline", label: "Cancel", size: "small", onClick: () => this.handleCancel() }), index.h("verdocs-button", { label: "OK", size: "small", onClick: () => this.handleSubmit(), disabled: roleNames.length < 1 }))), this.showingRoleDialog && (index.h("verdocs-template-role-properties", { endpoint: this.endpoint, templateId: this.templateId, roleName: this.showingRoleDialog, onClose: () => {

package/dist/cjs/verdocs-view.cjs.entry.js

@@ -8,7 +8,7 @@ const Permissions = require('./Permissions-1436f847.js');
 require('./Types-f89f9116.js');
 const VerdocsEndpoint = require('./VerdocsEndpoint-8f298664.js');
 const Primitives = require('./Primitives-a59870a2.js');
-const utils = require('./utils-ac526133.js');
+const utils = require('./utils-108da29c.js');
 const errors = require('./errors-0396da3d.js');
 require('./_commonjsHelpers-1fbbf0eb.js');
 require('./Files-4bdc0c0f.js');

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

@@ -3,7 +3,7 @@ import { VerdocsEndpoint } from '@verdocs/js-sdk';
 import { integerSequence } from '@verdocs/js-sdk/Utils/Primitives';
 import { createField, updateField } from '@verdocs/js-sdk/Templates/Fields';
 import { getTemplateFieldStore, updateStoreField } from '../../../utils/TemplateFieldStore';
-import { defaultHeight, defaultWidth, renderDocumentField, updateCssTransform } from '../../../utils/utils';
+import { defaultHeight, defaultWidth, removeCssTransform, renderDocumentField, updateCssTransform } from '../../../utils/utils';
 import { h, Host } from '@stencil/core';
 import { getTemplateRoleStore } from '../../../utils/TemplateRoleStore';
 import { getTemplateStore } from '../../../utils/TemplateStore';
@@ -236,7 +236,9 @@ export class VerdocsTemplateFields {
     updateStoreField(this.fieldStore, name, newFieldData);
     event.target.removeAttribute('posX');
     event.target.removeAttribute('posY');
+    console.log('Will remove CSS transform', event.target.style.transform);
     // this.reRenderField(newFieldData, pageNumber);
+    removeCssTransform(event.target, 'transform');
     console.log('[FIELDS] Updated', name, newFieldData);
     (_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' });
   }

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

@@ -54,11 +54,11 @@ export class VerdocsTemplateRoles {
         this.templateStore = ts;
         this.roleStore = getTemplateRoleStore(this.templateId);
         console.log('RS', (_a = this.roleStore) === null || _a === void 0 ? void 0 : _a.state);
+        this.loading = false;
         this.roleStore.onChange('roles', roles => {
           var _a;
           console.log('[ROLES] Roles changed', { roles });
           (_a = this.rolesUpdated) === null || _a === void 0 ? void 0 : _a.emit({ event: 'updated', endpoint: this.endpoint, templateId: this.templateId, roles });
-          this.loading = false;
         });
       })
         .catch(e => {
@@ -231,18 +231,19 @@ export class VerdocsTemplateRoles {
     this.callCreateRole(name, sequence, order);
   }
   render() {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     if (!this.endpoint.session) {
       return (h(Host, null, h("verdocs-component-error", { message: "You must be authenticated to use this module." })));
     }
     if (this.loading || !((_a = this.templateStore) === null || _a === void 0 ? void 0 : _a.state.isLoaded)) {
+      console.log('Loading', this.loading, (_b = this.templateStore) === null || _b === void 0 ? void 0 : _b.state.isLoaded);
       return (h(Host, { class: "loading" }, h("verdocs-loader", null)));
     }
     console.log('Rendering roles', this.roleStore.get('roles'));
     const roleNames = this.getRoleNames();
     const sequences = this.getSequenceNumbers();
     console.log('Rendering', roleNames, sequences);
-    return (h(Host, null, h("form", { onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("h5", null, "Roles and Workflow"), h("div", { class: "participants" }, h("div", { class: "left-line" }), h("div", { class: "row" }, h("div", { class: "icon", innerHTML: startIcon }), h("div", { class: "row-roles" }, h("div", { class: "sender" }, h("span", { class: "label" }, "Sender:"), " ", senderLabels[(_c = (_b = this.templateStore) === null || _b === void 0 ? void 0 : _b.state) === null || _c === void 0 ? void 0 : _c.sender], ' ', h("div", { class: "settings-button", innerHTML: settingsIcon, onClick: () => (this.showingSenderDialog = true), "aria-role": "button" })))), h("div", { class: "row add-sequence", "data-sequence": 0 }, h("div", { class: "icon", innerHTML: plusIcon }), h("div", { class: "row-roles" }, h("div", { class: "dropzone", "data-sequence": 0, "data-order": 1 }, "Add Step"))), sequences.map(sequence => (h(Fragment, null, h("div", { class: "row" }, h("div", { class: "icon", innerHTML: stepIcon }), h("div", { class: "row-roles" }, h("div", { class: "dropzone", "data-order": 0.5, "data-sequence": sequence }), this.getRolesAtSequence(sequence).map(role => {
+    return (h(Host, null, h("form", { onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("h5", null, "Roles and Workflow"), h("div", { class: "participants" }, h("div", { class: "left-line" }), h("div", { class: "row" }, h("div", { class: "icon", innerHTML: startIcon }), h("div", { class: "row-roles" }, h("div", { class: "sender" }, h("span", { class: "label" }, "Sender:"), " ", senderLabels[(_d = (_c = this.templateStore) === null || _c === void 0 ? void 0 : _c.state) === null || _d === void 0 ? void 0 : _d.sender], ' ', h("div", { class: "settings-button", innerHTML: settingsIcon, onClick: () => (this.showingSenderDialog = true), "aria-role": "button" })))), h("div", { class: "row add-sequence", "data-sequence": 0 }, h("div", { class: "icon", innerHTML: plusIcon }), h("div", { class: "row-roles" }, h("div", { class: "dropzone", "data-sequence": 0, "data-order": 1 }, "Add Step"))), sequences.map(sequence => (h(Fragment, null, h("div", { class: "row" }, h("div", { class: "icon", innerHTML: stepIcon }), h("div", { class: "row-roles" }, h("div", { class: "dropzone", "data-order": 0.5, "data-sequence": sequence }), this.getRolesAtSequence(sequence).map(role => {
       const unknown = !role.email;
       return unknown ? (h(Fragment, null, h("div", { class: "recipient", style: { backgroundColor: getRGBA(getRoleIndex(this.roleStore, role.name)) }, "data-rolename": role.name, "data-sequence": sequence, "data-order": role.order }, h("span", { class: "type-icon", innerHTML: role.type === 'signer' ? iconSigner : role.type === 'cc' ? iconCC : iconApprover }), role.name, " ", h("div", { class: "settings-button", innerHTML: settingsIcon, onClick: () => (this.showingRoleDialog = role.name), "aria-role": "button" })), h("div", { class: "dropzone", "data-order": role.order + 0.5, "data-sequence": sequence }))) : (h(Fragment, null, h("div", { class: "recipient", style: { borderColor: getRGBA(getRoleIndex(this.roleStore, role.name)) }, "data-rolename": role.name, "data-sequence": sequence, "data-order": role.order }, h("span", { class: "type-icon", innerHTML: role.type === 'signer' ? iconSigner : role.type === 'cc' ? iconCC : iconApprover }), role.full_name, " ", h("div", { class: "settings-button", innerHTML: settingsIcon, onClick: () => (this.showingRoleDialog = role.name), "aria-role": "button" })), h("div", { class: "dropzone", "data-order": role.order + 0.5, "data-sequence": sequence })));
     }), h("button", { class: "add-role", innerHTML: plusIcon, onClick: e => this.handleAddRole(e, sequence) }))), sequences.length > 0 && (h("div", { class: "row add-sequence", "data-sequence": sequence }, h("div", { class: "row-roles" }, h("div", { class: "icon", innerHTML: plusIcon }), h("div", { class: "dropzone", "data-sequence": sequence + 1, "data-order": 1 }, "Add Step"))))))), h("div", { class: "row", "data-sequence": sequences.length + 1 }, h("div", { class: "row-roles" }, h("div", { class: "icon", innerHTML: plusIcon }), h("button", { class: "add-step", innerHTML: plusIcon, onClick: e => this.handleAddStep(e, sequences.length + 1) }))), h("div", { class: "row" }, h("div", { class: "icon", innerHTML: doneIcon }), h("div", { class: "row-roles" }, h("div", { class: "complete" }, "Document Complete")))), roleNames.length < 1 && (h("div", { class: "empty" }, "You must add at least one Role before proceeding.", h("br", null), " Click the ", h("span", { innerHTML: plusIcon }), " Add button above to get started.")), h("div", { class: "buttons" }, h("div", { class: "flex-fill" }), h("verdocs-button", { variant: "outline", label: "Cancel", size: "small", onClick: () => this.handleCancel() }), h("verdocs-button", { label: "OK", size: "small", onClick: () => this.handleSubmit(), disabled: roleNames.length < 1 }))), this.showingRoleDialog && (h("verdocs-template-role-properties", { endpoint: this.endpoint, templateId: this.templateId, roleName: this.showingRoleDialog, onClose: () => {

package/dist/collection/utils/TemplateFieldStore.js

@@ -13,10 +13,6 @@ export const createTemplateFieldStore = (template) => {
     store = createStore({ fields: [] });
     templateFieldStores[template.id] = store;
   }
-  else {
-    console.log('Resetting template field store for template', template);
-    store.reset();
-  }
   store.set('fields', [...template.fields]);
   return store;
 };

package/dist/collection/utils/TemplateRoleStore.js

@@ -13,10 +13,6 @@ export const createTemplateRoleStore = (template) => {
     store = createStore({ roles: [] });
     templateRoleStores[template.id] = store;
   }
-  else {
-    console.log('Resetting template role store for template', template);
-    store.reset();
-  }
   store.set('roles', [...template.roles]);
   return store;
 };

package/dist/collection/utils/utils.js

@@ -275,6 +275,10 @@ export const updateCssTransform = (el, key, value) => {
     el.style.transform = currentTransform + ' ' + newValue;
   }
 };
+export const removeCssTransform = (el, key) => {
+  const currentTransform = el.style.transform || '';
+  el.style.transform = currentTransform.replace(new RegExp(`${key}\\(.+?\\)`), '');
+};
 export const saveAttachment = async (endpoint, envelope, documentId) => {
   // e.g. "Colorado-Motor-Vehicle-Bill-of-Sale.pdf"
   const date = format(new Date(envelope.updated_at), FORMAT_DATE);

package/dist/components/TemplateFieldStore.js

@@ -14,10 +14,6 @@ const createTemplateFieldStore = (template) => {
     store = createStore({ fields: [] });
     templateFieldStores[template.id] = store;
   }
-  else {
-    console.log('Resetting template field store for template', template);
-    store.reset();
-  }
   store.set('fields', [...template.fields]);
   return store;
 };

package/dist/components/TemplateRoleStore.js

@@ -14,10 +14,6 @@ const createTemplateRoleStore = (template) => {
     store = createStore({ roles: [] });
     templateRoleStores[template.id] = store;
   }
-  else {
-    console.log('Resetting template role store for template', template);
-    store.reset();
-  }
   store.set('roles', [...template.roles]);
   return store;
 };

package/dist/components/utils.js

@@ -296,6 +296,10 @@ const updateCssTransform = (el, key, value) => {
     el.style.transform = currentTransform + ' ' + newValue;
   }
 };
+const removeCssTransform = (el, key) => {
+  const currentTransform = el.style.transform || '';
+  el.style.transform = currentTransform.replace(new RegExp(`${key}\\(.+?\\)`), '');
+};
 const saveAttachment = async (endpoint, envelope, documentId) => {
   // e.g. "Colorado-Motor-Vehicle-Bill-of-Sale.pdf"
   const date = format(new Date(envelope.updated_at), FORMAT_DATE);
@@ -377,4 +381,4 @@ const convertToE164 = (input) => {
   return `+1${temp}`;
 };
 
-export { saveAttachment as a, getFieldId as b, convertToE164 as c, renderedTextWidth as d, updateCssTransform as e, defaultWidth as f, getFieldSettings as g, defaultHeight as h, renderDocumentField as r, saveEnvelopesAsZip as s, throttle as t, updateDocumentFieldValue as u };
+export { saveAttachment as a, getFieldId as b, convertToE164 as c, renderedTextWidth as d, updateCssTransform as e, removeCssTransform as f, getFieldSettings as g, defaultWidth as h, defaultHeight as i, renderDocumentField as r, saveEnvelopesAsZip as s, throttle as t, updateDocumentFieldValue as u };

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

@@ -5,7 +5,7 @@ import { V as VerdocsEndpoint } from './VerdocsEndpoint.js';
 import { u as updateField, c as createField } from './Fields.js';
 import { i as integerSequence } from './Primitives.js';
 import { g as getTemplateFieldStore, u as updateStoreField } from './TemplateFieldStore.js';
-import { r as renderDocumentField, e as updateCssTransform, f as defaultWidth, h as defaultHeight } from './utils.js';
+import { r as renderDocumentField, e as updateCssTransform, f as removeCssTransform, h as defaultWidth, i as defaultHeight } from './utils.js';
 import { g as getTemplateRoleStore } from './TemplateRoleStore.js';
 import { g as getTemplateStore } from './TemplateStore.js';
 import { S as SDKError } from './errors.js';
@@ -248,7 +248,9 @@ const VerdocsTemplateFields = /*@__PURE__*/ proxyCustomElement(class extends HTM
     updateStoreField(this.fieldStore, name, newFieldData);
     event.target.removeAttribute('posX');
     event.target.removeAttribute('posY');
+    console.log('Will remove CSS transform', event.target.style.transform);
     // this.reRenderField(newFieldData, pageNumber);
+    removeCssTransform(event.target, 'transform');
     console.log('[FIELDS] Updated', name, newFieldData);
     (_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' });
   }