@verdocs/web-sdk 1.12.44 → 1.13.0

package/dist/cjs/{templateStore-1862f03c.js → TemplateStore-01ff3237.js}

@@ -1,7 +1,8 @@
 'use strict';
 
 const index = require('./index-67233b76.js');
-const Primitives = require('./Primitives-be5088cb.js');
+const Templates = require('./Templates-e258cbd5.js');
+const VerdocsEndpoint = require('./VerdocsEndpoint-3e95f87f.js');
 
 const appendToMap = (map, propName, value) => {
     const items = map.get(propName);
@@ -194,47 +195,80 @@ const createStore = (defaultState, shouldUpdate) => {
     return map;
 };
 
-// NOTE: Do not attempt to convert this to a named-export module. It triggers compilation issues in Rollup that I spent days trying to
-const { state, onChange } = createStore({
-  templateId: '',
-  template: null,
-  loadProgress: 0,
-  loading: false,
-  // This can be used as a data field on components that need to force re-rendering when the underlying data has changed. Stencil stores
-  // are handy but not very sophisticated. They don't re-render on "deep" changes.
-  updateCount: 1,
-  pageNumbers: [],
-  pageUris: {},
-  roleNames: [],
-  fields: [],
-  dirty: false,
-});
-onChange('template', async (newTemplate) => {
-  if (!newTemplate) {
-    console.log('[TEMPLATESTORE] Clearing template');
-    state.fields = [];
-    state.roleNames = [];
-    state.pageNumbers = [];
-    state.dirty = false;
-    state.loading = false;
-    state.loadProgress = 0;
-    return;
-  }
-  console.log('[TEMPLATESTORE] Template loaded', newTemplate);
-  state.roleNames = newTemplate.roles.map(role => role.name);
-  console.log('[TEMPLATESTORE] Loaded roles', state.roleNames);
-  state.fields = [];
-  newTemplate.roles.forEach(role => {
-    state.fields.push(...role.fields);
+const createTemplateStore = (templateId) => {
+  const now = new Date().toISOString();
+  return createStore({
+    isLoading: true,
+    isLoaded: false,
+    isError: false,
+    error: null,
+    updateCount: 0,
+    roleNames: [],
+    id: templateId,
+    name: '',
+    description: '',
+    sender: VerdocsEndpoint.TemplateSenderTypes.CREATOR,
+    profile_id: '',
+    organization_id: '',
+    counter: 0,
+    star_counter: 0,
+    is_sendable: false,
+    is_personal: true,
+    is_public: false,
+    created_at: now,
+    updated_at: now,
+    last_used_at: now,
+    token: '',
+    reminder_id: '',
+    reminder: undefined,
+    processed: false,
+    organization: undefined,
+    roles: [],
+    pages: [],
+    template_document: undefined,
+    template_documents: [],
   });
-  console.log('[TEMPLATESTORE] Loaded fields', state.fields);
-  state.pageNumbers = Primitives.integerSequence(1, newTemplate.pages.length);
-  state.updateCount++;
-});
-// TODO: Do not rely on this, it doesn't appear to be working
-onChange('fields', newField => {
-  console.log('[TEMPLATESTORE] Field changed', newField);
-  state.dirty = true;
-});
+};
+const templateStores = {};
+const getTemplateStore = async (endpoint, templateId, forceReload = false) => {
+  let created = false;
+  if (!templateStores[templateId]) {
+    console.log('[TEMPLATES] No template store found for ID, creating', templateId);
+    templateStores[templateId] = createTemplateStore(templateId);
+    created = true;
+  }
+  const store = templateStores[templateId];
+  // TODO: This can create a race condition if two components call this at the same time.
+  //  For now we can probably defer doing something smart here because it's only a
+  //  double-load issue.
+  if (created || forceReload) {
+    console.log('[TEMPLATES] Reloading template', { templateId, created, forceReload });
+    store.state.isLoading = true;
+    store.state.isLoaded = false;
+    store.state.isError = false;
+    store.state.error = undefined;
+    try {
+      const template = await Templates.getTemplate(endpoint, templateId);
+      console.log('[TEMPLATES] Got template', template);
+      Object.assign(store.state, template);
+      // Object.keys(template).forEach(key => store.set(key as keyof TTemplateStore, template[key]));
+      store.state.isLoaded = true;
+      store.state.isError = false;
+      store.state.error = undefined;
+    }
+    catch (e) {
+      console.error('[TEMPLATES] Error loading template', e);
+      store.state.isLoaded = false;
+      store.state.isError = true;
+      store.state.error = e;
+      throw e;
+    }
+    store.state.isLoading = false;
+    store.state.updateCount++;
+  }
+  return store;
+};
+const getRoleNames = (store) => { var _a; return (((_a = store === null || store === void 0 ? void 0 : store.state) === null || _a === void 0 ? void 0 : _a.roles) || []).map(role => role.name); };
 
-exports.state = state;
+exports.getRoleNames = getRoleNames;
+exports.getTemplateStore = getTemplateStore;

package/dist/cjs/loader.cjs.js

@@ -14,7 +14,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return index.bootstrapLazy(JSON.parse("[[\"verdocs-checkbox_4.cjs\",[[0,\"verdocs-checkbox\",{\"checked\":[4],\"name\":[1],\"label\":[1],\"value\":[1],\"theme\":[1],\"disabled\":[4]}],[0,\"verdocs-text-input\",{\"value\":[1],\"label\":[1],\"placeholder\":[1],\"autocomplete\":[1],\"helpText\":[1,\"help-text\"],\"type\":[1],\"disabled\":[4]}],[0,\"verdocs-component-error\",{\"message\":[1]}],[0,\"verdocs-help-icon\",{\"text\":[1],\"containerId\":[32]}]]],[\"verdocs-build.cjs\",[[0,\"verdocs-build\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"step\":[32],\"pdfUrl\":[32],\"template\":[32]}]]],[\"verdocs-field-initial.cjs\",[[0,\"verdocs-field-initial\",{\"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\",{\"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-field-checkbox.cjs\",[[0,\"verdocs-field-checkbox\",{\"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\",{\"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\",{\"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\",{\"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\",{\"field\":[16],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"rerender\":[2],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-textbox.cjs\",[[0,\"verdocs-field-textbox\",{\"field\":[16],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"rerender\":[2],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-timestamp.cjs\",[[0,\"verdocs-field-timestamp\",{\"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],\"recipient\":[32],\"signerToken\":[32],\"hasSignature\":[32],\"nextButtonLabel\":[32],\"nextSubmits\":[32],\"errorMessage\":[32],\"focusedField\":[32],\"submitting\":[32],\"isDone\":[32],\"showDone\":[32],\"finishLater\":[32],\"showFinishLater\":[32],\"agreed\":[32],\"documentsSingularPlural\":[32]}]]],[\"verdocs-template-properties.cjs\",[[0,\"verdocs-template-properties\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"template\":[32],\"name\":[32],\"visibility\":[32],\"sendReminders\":[32],\"firstReminderDays\":[32],\"reminderDays\":[32]}]]],[\"verdocs-template-reminders.cjs\",[[0,\"verdocs-template-reminders\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"showPlanBlocker\":[32],\"sendReminders\":[32],\"firstReminderDays\":[32],\"reminderDays\":[32],\"dirty\":[32],\"loading\":[32]}]]],[\"verdocs-template-name.cjs\",[[0,\"verdocs-template-name\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"name\":[32],\"dirty\":[32],\"loading\":[32]}]]],[\"verdocs-auth.cjs\",[[0,\"verdocs-auth\",{\"endpoint\":[16],\"visible\":[4],\"logo\":[1],\"isAuthenticated\":[32],\"displayMode\":[32],\"username\":[32],\"password\":[32],\"loggingIn\":[32],\"activeSession\":[32],\"loginError\":[32]}]]],[\"verdocs-search.cjs\",[[0,\"verdocs-search\",{\"endpoint\":[16]}]]],[\"verdocs-send.cjs\",[[0,\"verdocs-send\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"containerId\":[32],\"rolesAtLevel\":[32],\"showPickerForId\":[32],\"sessionContacts\":[32],\"rolesCompleted\":[32],\"reset\":[64]}]]],[\"verdocs-template-visibility.cjs\",[[0,\"verdocs-template-visibility\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"dirty\":[32],\"loading\":[32],\"personal\":[32],\"public\":[32]}]]],[\"verdocs-view.cjs\",[[0,\"verdocs-view\",{\"endpoint\":[16],\"envelopeId\":[1,\"envelope-id\"],\"headerTargetId\":[1,\"header-target-id\"],\"isProcessing\":[32],\"envelope\":[32],\"roleNames\":[32],\"showCancelDone\":[32]}]]],[\"verdocs-upload-dialog.cjs\",[[0,\"verdocs-upload-dialog\",{\"draggingOver\":[32],\"decodedFiles\":[32]}]]],[\"verdocs-field-attachment.cjs\",[[0,\"verdocs-field-attachment\",{\"field\":[16],\"disabled\":[4],\"roleIndex\":[2,\"role-index\"],\"rerender\":[2],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-template-document-page.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]}]]],[\"verdocs-loader.cjs\",[[0,\"verdocs-loader\"]]],[\"verdocs-preview.cjs\",[[0,\"verdocs-preview\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"]}]]],[\"verdocs-template-attachments.cjs\",[[0,\"verdocs-template-attachments\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"loading\":[32]}]]],[\"verdocs-envelope-sidebar.cjs\",[[0,\"verdocs-envelope-sidebar\",{\"endpoint\":[16],\"envelopeId\":[1,\"envelope-id\"],\"envelope\":[32],\"roleNames\":[32],\"activeTab\":[32],\"panelOpen\":[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\",{\"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-status-indicator.cjs\",[[0,\"verdocs-status-indicator\",{\"size\":[1],\"theme\":[1],\"status\":[1],\"envelope\":[16],\"isOpen\":[32],\"recipientStatusIcons\":[32],\"containerId\":[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-button.cjs\",[[0,\"verdocs-button\",{\"label\":[1],\"startIcon\":[1,\"start-icon\"],\"endIcon\":[1,\"end-icon\"],\"size\":[1],\"type\":[1],\"variant\":[1],\"disabled\":[4]}]]],[\"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-contact-picker.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]}]]],[\"verdocs-progress-bar.cjs\",[[0,\"verdocs-progress-bar\",{\"label\":[1],\"showPercent\":[4,\"show-percent\"],\"percent\":[2]}]]],[\"verdocs-toggle-button.cjs\",[[0,\"verdocs-toggle-button\",{\"active\":[4],\"icon\":[1],\"label\":[1],\"size\":[1],\"_active\":[32]}]]],[\"verdocs-template-create_3.cjs\",[[0,\"verdocs-template-roles\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"showingRoleDialog\":[32],\"showingSenderDialog\":[32],\"sender\":[32],\"forceRerender\":[32]}],[0,\"verdocs-template-create\",{\"endpoint\":[16],\"file\":[32],\"creating\":[32],\"progressLabel\":[32],\"progressPercent\":[32]}],[0,\"verdocs-template-fields\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"toolbarTargetId\":[1,\"toolbar-target-id\"],\"placing\":[32],\"selectedRoleName\":[32],\"rerender\":[32]},[[4,\"keydown\",\"handleKeyDown\"]]]]],[\"verdocs-quick-functions_3.cjs\",[[0,\"verdocs-quick-functions\",{\"endpoint\":[16]}],[0,\"verdocs-search-activity\",{\"endpoint\":[16],\"type\":[1],\"options\":[8],\"emptyMessage\":[32],\"authFailure\":[32],\"title\":[32],\"recent\":[32],\"saved\":[32],\"starred\":[32]}],[0,\"verdocs-search-box\",{\"endpoint\":[16],\"placeholder\":[1],\"type\":[1],\"query\":[1],\"grabsFocus\":[4,\"grabs-focus\"],\"focusField\":[64]}]]],[\"verdocs-toolbar-icon.cjs\",[[0,\"verdocs-toolbar-icon\",{\"text\":[1],\"icon\":[1],\"placement\":[1],\"containerId\":[32]}]]],[\"verdocs-template-role-properties_2.cjs\",[[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-ok-dialog.cjs\",[[0,\"verdocs-ok-dialog\",{\"heading\":[1],\"message\":[1],\"showCancel\":[4,\"show-cancel\"],\"closed\":[32]}]]],[\"verdocs-radio-button.cjs\",[[0,\"verdocs-radio-button\",{\"checked\":[4],\"name\":[1],\"value\":[1],\"disabled\":[4]}]]],[\"verdocs-dropdown_2.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]}],[0,\"verdocs-dropdown\",{\"options\":[16],\"open\":[32]}]]],[\"verdocs-button-panel_3.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],\"name\":[32],\"roleName\":[32],\"group\":[32],\"fieldType\":[32],\"required\":[32],\"options\":[32],\"placeholder\":[32],\"defaultValue\":[32],\"showingHelp\":[32]}],[4,\"verdocs-button-panel\",{\"icon\":[1],\"showPanel\":[64],\"hidePanel\":[64],\"toggle\":[64]}],[0,\"verdocs-select-input\",{\"value\":[1],\"label\":[1],\"options\":[16],\"disabled\":[4]}]]]]"), options);
+  return index.bootstrapLazy(JSON.parse("[[\"verdocs-checkbox_4.cjs\",[[0,\"verdocs-checkbox\",{\"checked\":[4],\"name\":[1],\"label\":[1],\"value\":[1],\"theme\":[1],\"disabled\":[4]}],[0,\"verdocs-text-input\",{\"value\":[1],\"label\":[1],\"placeholder\":[1],\"autocomplete\":[1],\"helpText\":[1,\"help-text\"],\"type\":[1],\"disabled\":[4]}],[0,\"verdocs-component-error\",{\"message\":[1]}],[0,\"verdocs-help-icon\",{\"text\":[1],\"containerId\":[32]}]]],[\"verdocs-build.cjs\",[[0,\"verdocs-build\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"step\":[32],\"pdfUrl\":[32],\"template\":[32]}]]],[\"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-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,\"template-id\"],\"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\",{\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[2],\"rerender\":[2],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-field-textbox.cjs\",[[0,\"verdocs-field-textbox\",{\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"editable\":[4],\"moveable\":[4],\"done\":[4],\"roleindex\":[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],\"recipient\":[32],\"signerToken\":[32],\"hasSignature\":[32],\"nextButtonLabel\":[32],\"nextSubmits\":[32],\"errorMessage\":[32],\"focusedField\":[32],\"submitting\":[32],\"isDone\":[32],\"showDone\":[32],\"finishLater\":[32],\"showFinishLater\":[32],\"agreed\":[32],\"documentsSingularPlural\":[32]}]]],[\"verdocs-template-properties.cjs\",[[0,\"verdocs-template-properties\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"name\":[32],\"visibility\":[32],\"sendReminders\":[32],\"firstReminderDays\":[32],\"reminderDays\":[32]}]]],[\"verdocs-template-reminders.cjs\",[[0,\"verdocs-template-reminders\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"showPlanBlocker\":[32],\"sendReminders\":[32],\"firstReminderDays\":[32],\"reminderDays\":[32],\"dirty\":[32]}]]],[\"verdocs-template-name.cjs\",[[0,\"verdocs-template-name\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"name\":[32],\"dirty\":[32]}]]],[\"verdocs-auth.cjs\",[[0,\"verdocs-auth\",{\"endpoint\":[16],\"visible\":[4],\"logo\":[1],\"isAuthenticated\":[32],\"displayMode\":[32],\"username\":[32],\"password\":[32],\"loggingIn\":[32],\"activeSession\":[32],\"loginError\":[32]}]]],[\"verdocs-search.cjs\",[[0,\"verdocs-search\",{\"endpoint\":[16]}]]],[\"verdocs-send.cjs\",[[0,\"verdocs-send\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"containerId\":[32],\"rolesAtLevel\":[32],\"showPickerForId\":[32],\"sessionContacts\":[32],\"rolesCompleted\":[32],\"reset\":[64]}]]],[\"verdocs-template-visibility.cjs\",[[0,\"verdocs-template-visibility\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"dirty\":[32],\"personal\":[32],\"public\":[32]}]]],[\"verdocs-view.cjs\",[[0,\"verdocs-view\",{\"endpoint\":[16],\"envelopeId\":[1,\"envelope-id\"],\"headerTargetId\":[1,\"header-target-id\"],\"isProcessing\":[32],\"envelope\":[32],\"roleNames\":[32],\"showCancelDone\":[32]}]]],[\"verdocs-upload-dialog.cjs\",[[0,\"verdocs-upload-dialog\",{\"draggingOver\":[32],\"decodedFiles\":[32]}]]],[\"verdocs-field-attachment.cjs\",[[0,\"verdocs-field-attachment\",{\"templateid\":[1],\"field\":[16],\"disabled\":[4],\"roleIndex\":[2,\"role-index\"],\"rerender\":[2],\"focusField\":[64],\"showSettingsPanel\":[64],\"hideSettingsPanel\":[64]}]]],[\"verdocs-template-document-page.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]}]]],[\"verdocs-loader.cjs\",[[0,\"verdocs-loader\"]]],[\"verdocs-preview.cjs\",[[0,\"verdocs-preview\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"]}]]],[\"verdocs-template-attachments.cjs\",[[0,\"verdocs-template-attachments\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"]}]]],[\"verdocs-envelope-sidebar.cjs\",[[0,\"verdocs-envelope-sidebar\",{\"endpoint\":[16],\"envelopeId\":[1,\"envelope-id\"],\"envelope\":[32],\"roleNames\":[32],\"activeTab\":[32],\"panelOpen\":[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-status-indicator.cjs\",[[0,\"verdocs-status-indicator\",{\"size\":[1],\"theme\":[1],\"status\":[1],\"envelope\":[16],\"isOpen\":[32],\"recipientStatusIcons\":[32],\"containerId\":[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-button.cjs\",[[0,\"verdocs-button\",{\"label\":[1],\"startIcon\":[1,\"start-icon\"],\"endIcon\":[1,\"end-icon\"],\"size\":[1],\"type\":[1],\"variant\":[1],\"disabled\":[4]}]]],[\"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-contact-picker.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]}]]],[\"verdocs-progress-bar.cjs\",[[0,\"verdocs-progress-bar\",{\"label\":[1],\"showPercent\":[4,\"show-percent\"],\"percent\":[2]}]]],[\"verdocs-toggle-button.cjs\",[[0,\"verdocs-toggle-button\",{\"active\":[4],\"icon\":[1],\"label\":[1],\"size\":[1],\"_active\":[32]}]]],[\"verdocs-template-create_3.cjs\",[[0,\"verdocs-template-roles\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"showingRoleDialog\":[32],\"showingSenderDialog\":[32],\"sender\":[32]}],[0,\"verdocs-template-create\",{\"endpoint\":[16],\"file\":[32],\"creating\":[32],\"progressLabel\":[32],\"progressPercent\":[32]}],[0,\"verdocs-template-fields\",{\"endpoint\":[16],\"templateId\":[1,\"template-id\"],\"toolbarTargetId\":[1,\"toolbar-target-id\"],\"placing\":[32],\"selectedRoleName\":[32],\"rerender\":[32]},[[4,\"keydown\",\"handleKeyDown\"]]]]],[\"verdocs-quick-functions_3.cjs\",[[0,\"verdocs-quick-functions\",{\"endpoint\":[16]}],[0,\"verdocs-search-activity\",{\"endpoint\":[16],\"type\":[1],\"options\":[8],\"emptyMessage\":[32],\"authFailure\":[32],\"title\":[32],\"recent\":[32],\"saved\":[32],\"starred\":[32]}],[0,\"verdocs-search-box\",{\"endpoint\":[16],\"placeholder\":[1],\"type\":[1],\"query\":[1],\"grabsFocus\":[4,\"grabs-focus\"],\"focusField\":[64]}]]],[\"verdocs-toolbar-icon.cjs\",[[0,\"verdocs-toolbar-icon\",{\"text\":[1],\"icon\":[1],\"placement\":[1],\"containerId\":[32]}]]],[\"verdocs-template-role-properties_2.cjs\",[[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-ok-dialog.cjs\",[[0,\"verdocs-ok-dialog\",{\"heading\":[1],\"message\":[1],\"showCancel\":[4,\"show-cancel\"],\"closed\":[32]}]]],[\"verdocs-radio-button.cjs\",[[0,\"verdocs-radio-button\",{\"checked\":[4],\"name\":[1],\"value\":[1],\"disabled\":[4]}]]],[\"verdocs-dropdown_2.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]}],[0,\"verdocs-dropdown\",{\"options\":[16],\"open\":[32]}]]],[\"verdocs-button-panel_3.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],\"name\":[32],\"roleName\":[32],\"group\":[32],\"fieldType\":[32],\"required\":[32],\"options\":[32],\"placeholder\":[32],\"defaultValue\":[32],\"showingHelp\":[32]}],[4,\"verdocs-button-panel\",{\"icon\":[1],\"showPanel\":[64],\"hidePanel\":[64],\"toggle\":[64]}],[0,\"verdocs-select-input\",{\"value\":[1],\"label\":[1],\"options\":[16],\"disabled\":[4]}]]]]"), options);
   });
 };
 

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

@@ -5,11 +5,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-67233b76.js');
 require('./Types-f89f9116.js');
 const VerdocsEndpoint = require('./VerdocsEndpoint-3e95f87f.js');
-const Templates = require('./Templates-f310df2f.js');
+const TemplateStore = require('./TemplateStore-01ff3237.js');
 const errors = require('./errors-0396da3d.js');
 require('./Templates-e258cbd5.js');
-require('./templateStore-1862f03c.js');
-require('./Primitives-be5088cb.js');
 
 const verdocsBuildCss = "verdocs-build{display:-ms-flexbox;display:flex;font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}";
 
@@ -19,6 +17,7 @@ const VerdocsBuild = class {
     this.sdkError = index.createEvent(this, "sdkError", 7);
     this.stepChanged = index.createEvent(this, "stepChanged", 7);
     this.fields = [];
+    this.store = null;
     this.endpoint = VerdocsEndpoint.VerdocsEndpoint.getDefault();
     this.templateId = null;
     this.step = 'create';
@@ -27,20 +26,18 @@ const VerdocsBuild = class {
   }
   async componentWillLoad() {
     var _a, _b, _c;
-    this.endpoint.loadSession();
-    if (!this.endpoint.session) {
-      console.log('[BUILD] Unable to start builder session, must be authenticated');
-      return;
-    }
-    if (!this.templateId) {
-      console.log(`[BUILD] No template ID specified, showing upload option`);
-      this.step = 'create';
-      return;
-    }
     try {
-      console.log(`[BUILD] Loading template ${this.templateId}`);
-      await Templates.loadTemplate(this.endpoint, this.templateId);
+      this.endpoint.loadSession();
+      if (!this.templateId) {
+        console.log(`[BUILD] Missing required template ID ${this.templateId}`);
+        return;
+      }
+      if (!this.endpoint.session) {
+        console.log('[BUILD] Unable to start builder session, must be authenticated');
+        return;
+      }
       this.step = 'roles';
+      this.store = await TemplateStore.getTemplateStore(this.endpoint, this.templateId, true);
     }
     catch (e) {
       console.log('[BUILD] Error loading template', e);

package/dist/cjs/verdocs-button-panel_3.cjs.entry.js

@@ -4,14 +4,12 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-67233b76.js');
 const popper = require('./popper-11d5f714.js');
+const _commonjsHelpers = require('./_commonjsHelpers-0c557e26.js');
 require('./Types-f89f9116.js');
 const Fields = require('./Fields-705a2168.js');
 const VerdocsEndpoint = require('./VerdocsEndpoint-3e95f87f.js');
-const _commonjsHelpers = require('./_commonjsHelpers-0c557e26.js');
-const templateStore = require('./templateStore-1862f03c.js');
-const Templates = require('./Templates-f310df2f.js');
+const TemplateStore = require('./TemplateStore-01ff3237.js');
 const errors = require('./errors-0396da3d.js');
-require('./Primitives-be5088cb.js');
 require('./Templates-e258cbd5.js');
 
 const verdocsButtonPanelCss = "verdocs-button-panel{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;display:inline-block}verdocs-button-panel .icon{display:inline-block;cursor:pointer;opacity:0.6}verdocs-button-panel .icon svg{fill:#707ae5}verdocs-button-panel .icon:hover{opacity:1}.verdocs-button-panel-content{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;-webkit-box-shadow:0 0 10px 1px #999999;box-shadow:0 0 10px 1px #999999;display:none;background:#ffffff;color:#33364b;width:320px;font-weight:bold;padding:15px;font-size:14px;position:relative;border-radius:4px;z-index:10000}.verdocs-button-panel-content .arrow,.verdocs-button-panel-content .arrow::before{position:absolute;width:8px;height:8px;background:inherit}.verdocs-button-panel-content .arrow{visibility:hidden;top:-4px}.verdocs-button-panel-content .arrow::before{visibility:visible;content:\"\";-webkit-transform:rotate(45deg);transform:rotate(45deg)}.verdocs-button-panel-content[data-show]{display:block}.verdocs-button-panel-content[data-popper-placement^=top]>.arrow{bottom:-4px}.verdocs-button-panel-content[data-popper-placement^=bottom]>.arrow{top:-4px}.verdocs-button-panel-content[data-popper-placement^=left]>.arrow{right:-4px}.verdocs-button-panel-content[data-popper-placement^=right]>.arrow{left:-4px}.verdocs-button-panel-content h6{font-size:16px;font-weight:bold;margin:0 0 16px 0;color:#092c4c;border-bottom:1px solid #cccccc}";
@@ -303,6 +301,7 @@ const VerdocsTemplateFieldProperties = class {
     this.delete = index.createEvent(this, "delete", 7);
     this.settingsChanged = index.createEvent(this, "settingsChanged", 7);
     this.sdkError = index.createEvent(this, "sdkError", 7);
+    this.store = null;
     this.endpoint = VerdocsEndpoint.VerdocsEndpoint.getDefault();
     this.templateId = '';
     this.fieldName = '';
@@ -322,11 +321,11 @@ const VerdocsTemplateFieldProperties = class {
     this.showingHelp = false;
   }
   async componentWillLoad() {
-    var _a, _b, _c, _d, _e;
+    var _a, _b, _c, _d, _e, _f, _g;
     try {
       this.endpoint.loadSession();
       if (!this.templateId) {
-        console.error(`[FIELD PROPERTIES] Missing required template ID`);
+        console.log(`[ROLES] Missing required template ID ${this.templateId}`);
         return;
       }
       if (!this.fieldName) {
@@ -334,11 +333,11 @@ const VerdocsTemplateFieldProperties = class {
         return;
       }
       if (!this.endpoint.session) {
-        console.error('[FIELD PROPERTIES] Unable to start builder session, must be authenticated');
+        console.log('[ROLES] Unable to start builder session, must be authenticated');
         return;
       }
-      await Templates.loadTemplate(this.endpoint, this.templateId);
-      const field = templateStore.state.fields.find(field => field.name === this.fieldName);
+      this.store = await TemplateStore.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);
       if (!field) {
         console.log(`[FIELD PROPERTIES] Unable to find field "${this.fieldName}" in template`);
       }
@@ -349,31 +348,31 @@ const VerdocsTemplateFieldProperties = class {
       this.required = field.required;
       this.fieldType = field.type;
       this.placeholder = field.label; // TODO: Talk about how we want to handle labels/placeholders
-      this.defaultValue = ((_a = field.setting) === null || _a === void 0 ? void 0 : _a.value) || '';
+      this.defaultValue = ((_c = field.setting) === null || _c === void 0 ? void 0 : _c.value) || '';
       this.setting = field.setting || {};
-      this.options = ((_b = field.setting) === null || _b === void 0 ? void 0 : _b.options) || [];
+      this.options = ((_d = field.setting) === null || _d === void 0 ? void 0 : _d.options) || [];
       this.dirty = false;
       this.loading = false;
     }
     catch (e) {
       console.log('[FIELD PROPERTIES] Error loading template', e);
       this.loading = false;
-      (_c = this.sdkError) === null || _c === void 0 ? void 0 : _c.emit(new errors.SDKError(e.message, (_d = e.response) === null || _d === void 0 ? void 0 : _d.status, (_e = e.response) === null || _e === void 0 ? void 0 : _e.data));
+      (_e = this.sdkError) === null || _e === void 0 ? void 0 : _e.emit(new errors.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;
+    var _a, _b, _c, _d;
     e.stopPropagation();
-    const field = templateStore.state.fields.find(field => field.name === this.fieldName);
+    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);
     if (field) {
       this.name = field.name;
       this.roleName = field.role_name;
       this.required = field.required;
       this.placeholder = field.label; // TODO: Talk about how we want to handle labels/placeholders
-      this.defaultValue = ((_a = field.setting) === null || _a === void 0 ? void 0 : _a.result) || '';
+      this.defaultValue = ((_c = field.setting) === null || _c === void 0 ? void 0 : _c.result) || '';
     }
     this.dirty = false;
-    (_b = this.close) === null || _b === void 0 ? void 0 : _b.emit();
+    (_d = this.close) === null || _d === void 0 ? void 0 : _d.emit();
   }
   handleSave(e) {
     e.stopPropagation();
@@ -396,9 +395,9 @@ const VerdocsTemplateFieldProperties = class {
     }
     Fields.updateField(this.endpoint, this.templateId, this.fieldName, newProperties)
       .then(() => {
-      var _a, _b;
+      var _a, _b, _c, _d;
       this.dirty = false;
-      const field = templateStore.state.fields.find(field => field.name === this.fieldName);
+      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);
       if (field) {
         field.name = this.name;
         field.role_name = this.roleName;
@@ -409,8 +408,8 @@ const VerdocsTemplateFieldProperties = class {
           field.setting.options = this.options;
         }
       }
-      (_a = this.settingsChanged) === null || _a === void 0 ? void 0 : _a.emit({ fieldName: this.fieldName });
-      (_b = this.close) === null || _b === void 0 ? void 0 : _b.emit();
+      (_c = this.settingsChanged) === null || _c === void 0 ? void 0 : _c.emit({ fieldName: this.fieldName });
+      (_d = this.close) === null || _d === void 0 ? void 0 : _d.emit();
     })
       .catch(() => {
       console.log('Field update failed', e);
@@ -443,9 +442,9 @@ const VerdocsTemplateFieldProperties = class {
     newProperties.setting.options = this.options;
     Fields.updateField(this.endpoint, this.templateId, this.fieldName, newProperties)
       .then(() => {
-      var _a, _b;
+      var _a, _b, _c, _d;
       this.dirty = false;
-      const field = templateStore.state.fields.find(field => field.name === this.fieldName);
+      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);
       if (field) {
         field.name = this.name;
         field.role_name = this.roleName;
@@ -453,9 +452,10 @@ const VerdocsTemplateFieldProperties = class {
         field.label = this.placeholder;
         field.setting.result = this.defaultValue;
       }
-      (_a = this.settingsChanged) === null || _a === void 0 ? void 0 : _a.emit({ fieldName: this.fieldName });
-      (_b = this.close) === null || _b === void 0 ? void 0 : _b.emit();
-      templateStore.state.updateCount++;
+      (_c = this.settingsChanged) === null || _c === void 0 ? void 0 : _c.emit({ fieldName: this.fieldName });
+      (_d = this.close) === null || _d === void 0 ? void 0 : _d.emit();
+      // TODO: Verify this
+      // TemplateStore.updateCount++;
     })
       .catch(() => {
       console.log('Field update failed', e);
@@ -466,13 +466,13 @@ const VerdocsTemplateFieldProperties = class {
     if (window.confirm('Are you sure you wish to remove this field? This action cannot be undone.')) {
       Fields.deleteField(this.endpoint, this.templateId, this.fieldName)
         .then(r => {
-        var _a;
+        var _a, _b, _c, _d, _e;
         console.log('Field deleted', r);
-        templateStore.state.fields = [...templateStore.state.fields.filter(field => field.name !== this.fieldName)];
-        templateStore.state.template.roles.forEach(role => {
+        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)];
         });
-        (_a = this.delete) === null || _a === void 0 ? void 0 : _a.emit({ templateId: this.templateId, roleName: this.roleName });
+        (_e = this.delete) === null || _e === void 0 ? void 0 : _e.emit({ templateId: this.templateId, roleName: this.roleName });
       })
         .catch(e => {
         console.log('Deletion error', e);
@@ -480,11 +480,12 @@ const VerdocsTemplateFieldProperties = class {
     }
   }
   render() {
+    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." })));
     }
     // This is meant to be a companion for larger visual experiences so we just go blank on errors for now.
-    if (!this.endpoint.session || !templateStore.state.template) {
+    if (!this.endpoint.session || !((_b = (_a = this.store) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.isLoaded)) {
       return index.h(index.Host, { class: "empty" });
     }
     if (this.helpText && this.showingHelp) {
@@ -495,7 +496,7 @@ const VerdocsTemplateFieldProperties = class {
       placeholder: "Field Name...", onInput: (e) => {
         this.name = e.target.value;
         this.dirty = true;
-      } })), index.h("div", { class: "row" }, index.h("div", { class: "input-label" }, "Role:"), index.h("verdocs-select-input", { value: this.roleName, options: templateStore.state.template.roles.map(role => ({ label: role.name, value: role.name })), onInput: (e) => {
+      } })), index.h("div", { class: "row" }, index.h("div", { class: "input-label" }, "Role:"), index.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) => {
         this.roleName = e.target.value;
         this.dirty = true;
       } })), ['textbox', 'textarea'].includes(this.type) && (index.h("verdocs-text-input", { id: "verdocs-field-placeholder", label: "Placeholder", value: this.name, autocomplete: "off",

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

@@ -4,8 +4,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-67233b76.js');
 const Colors = require('./Colors-e809dcc9.js');
-const templateStore = require('./templateStore-1862f03c.js');
-require('./Primitives-be5088cb.js');
 
 const verdocsFieldAttachmentCss = "verdocs-field-attachment{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;width:24px;height:24px;display:block;font-size:11px;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left}verdocs-field-attachment.disabled{opacity:0.5}verdocs-field-attachment.disabled span{cursor:inherit}verdocs-field-attachment span{width:20px;cursor:pointer}verdocs-field-attachment.required span{border:1px solid #cc0000}verdocs-field-attachment.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}";
 
@@ -14,6 +12,7 @@ const VerdocsFieldAttachment = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.settingsChanged = index.createEvent(this, "settingsChanged", 7);
+    this.templateid = '';
     this.field = null;
     this.disabled = false;
     this.roleIndex = 0;
@@ -40,7 +39,7 @@ const VerdocsFieldAttachment = class {
     if (settingsPanel && settingsPanel.hidePanel) {
       settingsPanel.hidePanel();
     }
-    templateStore.state.updateCount++;
+    // TemplateStore.updateCount++;
   }
   render() {
     var _a, _b, _c, _d;

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

@@ -5,13 +5,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-67233b76.js');
 const Colors = require('./Colors-e809dcc9.js');
 const utils = require('./utils-c218d9c7.js');
-const templateStore = require('./templateStore-1862f03c.js');
 require('./_commonjsHelpers-0c557e26.js');
 require('./Envelopes-699531b7.js');
 require('./Types-f89f9116.js');
 require('./Files-4bdc0c0f.js');
 require('./index-6528b430.js');
-require('./Primitives-be5088cb.js');
 
 const verdocsFieldCheckboxCss = "@charset \"UTF-8\";verdocs-field-checkbox{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;font-size:14px;position:relative;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left}verdocs-field-checkbox.disabled{opacity:0.5}verdocs-field-checkbox label>input[type=checkbox]{display:none}verdocs-field-checkbox label>input[type=checkbox]+*::before{content:\"\";position:absolute;display:block;top:1px;left:1px;width:10px;height:10px;border-radius:2px;border:1px solid rgba(0, 0, 0, 0.7)}verdocs-field-checkbox label>input[type=checkbox]:checked+*{color:#55bc81}verdocs-field-checkbox label>input[type=checkbox]:checked+*::before{content:\"✓\";color:white;text-align:center;background:#55bc81;border-color:#55bc81}verdocs-field-checkbox.required{border:1px solid #cc0000}verdocs-field-checkbox.hide{display:none}verdocs-field-checkbox.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}verdocs-field-checkbox verdocs-button-panel{margin-left:-20px;margin-top:-4px;-webkit-transform:scale(0.7);transform:scale(0.7)}";
 
@@ -21,6 +19,7 @@ const VerdocsFieldCheckbox = class {
     index.registerInstance(this, hostRef);
     this.settingsChanged = index.createEvent(this, "settingsChanged", 7);
     this.deleted = index.createEvent(this, "deleted", 7);
+    this.templateid = '';
     this.field = null;
     this.option = 0;
     this.disabled = false;
@@ -41,7 +40,7 @@ const VerdocsFieldCheckbox = class {
     if (settingsPanel && settingsPanel.hidePanel) {
       settingsPanel.hidePanel();
     }
-    templateStore.state.updateCount++;
+    // TemplateStore.updateCount++;
   }
   render() {
     var _a, _b, _c, _d;
@@ -52,7 +51,7 @@ const VerdocsFieldCheckbox = class {
     if (this.done) {
       return index.h(index.Host, { class: { done: this.done } }, option.checked ? '✓' : '☐');
     }
-    return (index.h(index.Host, { class: { required: settings.required, disabled }, style: { backgroundColor } }, index.h("label", null, index.h("input", { type: "checkbox", tabIndex: settings.order, checked: option.checked, disabled: disabled, required: settings.required, value: option.id }), index.h("span", null), this.editable && (index.h("verdocs-button-panel", { icon: settingsIcon, id: `verdocs-settings-panel-${this.field.name}` }, index.h("verdocs-template-field-properties", { templateId: templateStore.state.templateId, fieldName: this.field.name, onClose: () => this.hideSettingsPanel(), onDelete: () => {
+    return (index.h(index.Host, { class: { required: settings.required, disabled }, style: { backgroundColor } }, index.h("label", null, index.h("input", { type: "checkbox", tabIndex: settings.order, checked: option.checked, disabled: disabled, required: settings.required, value: option.id }), index.h("span", null), this.editable && (index.h("verdocs-button-panel", { icon: settingsIcon, id: `verdocs-settings-panel-${this.field.name}` }, index.h("verdocs-template-field-properties", { templateId: this.templateid, fieldName: this.field.name, onClose: () => this.hideSettingsPanel(), onDelete: () => {
         var _a;
         (_a = this.deleted) === null || _a === void 0 ? void 0 : _a.emit({ fieldName: this.field.name });
         return this.hideSettingsPanel();

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

@@ -5,13 +5,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-67233b76.js');
 const utils = require('./utils-c218d9c7.js');
 const Colors = require('./Colors-e809dcc9.js');
-const templateStore = require('./templateStore-1862f03c.js');
 const index$1 = require('./index-6528b430.js');
 require('./_commonjsHelpers-0c557e26.js');
 require('./Envelopes-699531b7.js');
 require('./Types-f89f9116.js');
 require('./Files-4bdc0c0f.js');
-require('./Primitives-be5088cb.js');
 
 var HOOKS = [
     "onChange",
@@ -2571,6 +2569,7 @@ const VerdocsFieldDate = class {
     this.settingsPress = index.createEvent(this, "settingsPress", 7);
     this.settingsChanged = index.createEvent(this, "settingsChanged", 7);
     this.deleted = index.createEvent(this, "deleted", 7);
+    this.templateId = '';
     this.field = null;
     this.disabled = false;
     this.editable = false;
@@ -2611,7 +2610,7 @@ const VerdocsFieldDate = class {
     if (settingsPanel && settingsPanel.hidePanel) {
       settingsPanel.hidePanel();
     }
-    templateStore.state.updateCount++;
+    // TemplateStore.updateCount++;
   }
   // NOTE: We don't use a "date" field here because browsers vary widely in their formatting of it.
   render() {
@@ -2623,7 +2622,7 @@ const VerdocsFieldDate = class {
       const formatted = (settings === null || settings === void 0 ? void 0 : settings.result) ? index$1.format(new Date(settings === null || settings === void 0 ? void 0 : settings.result), 'PP') : '';
       return index.h(index.Host, { class: { done: this.done } }, formatted);
     }
-    return (index.h(index.Host, { class: { required: (_c = this.field) === null || _c === void 0 ? void 0 : _c.required, disabled }, style: { backgroundColor } }, index.h("input", { type: "text", value: "", id: this.containerId, disabled: disabled, placeholder: settings.placeholder, ref: el => (this.el = el) }), this.editable && (index.h("verdocs-button-panel", { icon: settingsIcon, id: `verdocs-settings-panel-${this.field.name}` }, index.h("verdocs-template-field-properties", { templateId: templateStore.state.templateId, fieldName: this.field.name, onClose: () => this.hideSettingsPanel(), onDelete: () => {
+    return (index.h(index.Host, { class: { required: (_c = this.field) === null || _c === void 0 ? void 0 : _c.required, disabled }, style: { backgroundColor } }, index.h("input", { type: "text", value: "", id: this.containerId, disabled: disabled, placeholder: settings.placeholder, ref: el => (this.el = el) }), this.editable && (index.h("verdocs-button-panel", { icon: settingsIcon, id: `verdocs-settings-panel-${this.field.name}` }, index.h("verdocs-template-field-properties", { templateId: this.templateId, fieldName: this.field.name, onClose: () => this.hideSettingsPanel(), onDelete: () => {
         var _a;
         (_a = this.deleted) === null || _a === void 0 ? void 0 : _a.emit({ fieldName: this.field.name });
         return this.hideSettingsPanel();

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

@@ -5,13 +5,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-67233b76.js');
 const Colors = require('./Colors-e809dcc9.js');
 const utils = require('./utils-c218d9c7.js');
-const templateStore = require('./templateStore-1862f03c.js');
 require('./_commonjsHelpers-0c557e26.js');
 require('./Envelopes-699531b7.js');
 require('./Types-f89f9116.js');
 require('./Files-4bdc0c0f.js');
 require('./index-6528b430.js');
-require('./Primitives-be5088cb.js');
 
 const verdocsFieldDropdownCss = "verdocs-field-dropdown{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;width:85px;height:20px;display:block;font-size:11px;position:relative;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left}verdocs-field-dropdown.disabled{opacity:0.5}verdocs-field-dropdown select{position:absolute;background:linear-gradient(55deg, transparent 50%, #333 50%), linear-gradient(125deg, #333 50%, transparent 50%), linear-gradient(to right, transparent, transparent);background-position:calc(100% - 7px) 4px, calc(100% - 3px) 4px, 100% 0;background-size:5px 5px, 5px 5px, 2.5em 2.5em;background-repeat:no-repeat;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;color:rgba(0, 0, 0, 0.87);font-weight:500;-webkit-transform-origin:0 0;transform-origin:0 0;height:100%;width:100%;font-size:11px;border:1px solid rgba(0, 0, 0, 0.2)}verdocs-field-dropdown select:focus{outline:none}verdocs-field-dropdown select.hide{display:none}verdocs-field-dropdown.required select{border:1px solid #cc0000}verdocs-field-dropdown.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}verdocs-field-dropdown verdocs-button-panel{margin-left:-20px;margin-top:-4px;-webkit-transform:scale(0.7);transform:scale(0.7)}";
 
@@ -22,6 +20,7 @@ const VerdocsFieldDropdown = class {
     this.fieldChange = index.createEvent(this, "fieldChange", 7);
     this.settingsChanged = index.createEvent(this, "settingsChanged", 7);
     this.deleted = index.createEvent(this, "deleted", 7);
+    this.templateid = '';
     this.field = null;
     this.disabled = false;
     this.editable = false;
@@ -48,7 +47,7 @@ const VerdocsFieldDropdown = class {
     if (settingsPanel && settingsPanel.hidePanel) {
       settingsPanel.hidePanel();
     }
-    templateStore.state.updateCount++;
+    // TemplateStore.updateCount++;
   }
   render() {
     var _a, _b;
@@ -59,7 +58,7 @@ const VerdocsFieldDropdown = class {
     if (this.done) {
       return index.h(index.Host, { class: { done: this.done } }, value);
     }
-    return (index.h(index.Host, { class: { required: settings.required, disabled }, style: { backgroundColor } }, index.h("select", { tabIndex: settings.order, disabled: disabled, ref: el => (this.el = el), onChange: e => this.handleChange(e) }, index.h("option", { value: "" }, "Select..."), (settings.options || []).map(option => (index.h("option", { value: option.id, selected: option.value === value }, option.value)))), this.editable && (index.h("verdocs-button-panel", { icon: settingsIcon, id: `verdocs-settings-panel-${this.field.name}` }, index.h("verdocs-template-field-properties", { templateId: templateStore.state.templateId, fieldName: this.field.name, onClose: () => this.hideSettingsPanel(), onDelete: () => {
+    return (index.h(index.Host, { class: { required: settings.required, disabled }, style: { backgroundColor } }, index.h("select", { tabIndex: settings.order, disabled: disabled, ref: el => (this.el = el), onChange: e => this.handleChange(e) }, index.h("option", { value: "" }, "Select..."), (settings.options || []).map(option => (index.h("option", { value: option.id, selected: option.value === value }, option.value)))), this.editable && (index.h("verdocs-button-panel", { icon: settingsIcon, id: `verdocs-settings-panel-${this.field.name}` }, index.h("verdocs-template-field-properties", { templateId: this.templateid, fieldName: this.field.name, onClose: () => this.hideSettingsPanel(), onDelete: () => {
         var _a;
         (_a = this.deleted) === null || _a === void 0 ? void 0 : _a.emit({ fieldName: this.field.name });
         return this.hideSettingsPanel();