@verdocs/web-sdk 2.3.73 → 2.3.75

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, d as defineCustomElement$4 } from './verdocs-template-field-properties2.js';
 import { i as integerSequence } from './Primitives.js';
 import { g as getTemplateFieldStore, u as updateStoreField } from './TemplateFieldStore.js';
-import { r as renderDocumentField, h as updateCssTransform, i as removeCssTransform, b as getFieldId, j as defaultWidth, k as defaultHeight } from './utils.js';
+import { h as updateCssTransform, i as removeCssTransform, b as getFieldId, f as getFieldOptionId, j as defaultWidth, k 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';
@@ -98,11 +98,9 @@ const VerdocsTemplateFields = /*@__PURE__*/ proxyCustomElement(class extends HTM
         .then(ts => {
         var _a, _b;
         this.templateStore = ts;
-        console.log('[PREVIEW] Loaded Template Store', ts.state);
         this.fieldStore = getTemplateFieldStore(this.templateId);
         this.roleStore = getTemplateRoleStore(this.templateId);
         this.selectedRoleName = ((_b = (_a = this.roleStore.get('roles')) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.name) || '';
-        console.log('[PREVIEW] Loaded template', this.templateStore.state, this.roleStore.get('roles'), this.fieldStore.get('fields'));
         this.loading = false;
         this.fieldStore.onChange('fields', fields => {
           var _a;
@@ -169,7 +167,7 @@ const VerdocsTemplateFields = /*@__PURE__*/ proxyCustomElement(class extends HTM
   }
   handlePageRendered(e) {
     const pageInfo = e.detail;
-    console.log('[FIELDS] Page rendered', pageInfo.pageNumber, pageInfo.xScale, pageInfo.yScale);
+    // console.log('[FIELDS] Page rendered', pageInfo.pageNumber, pageInfo.xScale, pageInfo.yScale);
     this.cachedPageInfo[pageInfo.pageNumber] = pageInfo;
     this.pageHeights[pageInfo.pageNumber] = pageInfo.naturalHeight;
     this.fieldStore
@@ -177,33 +175,31 @@ const VerdocsTemplateFields = /*@__PURE__*/ proxyCustomElement(class extends HTM
       .filter(field => field && field.page_sequence === pageInfo.pageNumber)
       .forEach(field => {
       // TODO: Why isn't the attr already on the element carrying through?
-      const id = getFieldId(field);
-      const el = document.getElementById(id);
-      if (el) {
-        el.setAttribute('fieldname', field.name);
-        el.setAttribute('pagenumber', String(field.page_sequence));
-        this.makeDraggable(el);
+      switch (field.type) {
+        case 'checkbox_group':
+        case 'radio_button_group':
+          (field.settings || field.setting || {}).options.map((_, index) => {
+            const id = getFieldOptionId(field, index);
+            const el = document.getElementById(id);
+            if (el) {
+              el.setAttribute('fieldname', field.name);
+              el.setAttribute('pagenumber', String(field.page_sequence));
+              this.makeDraggable(el);
+            }
+          });
+          break;
+        default:
+          const id = getFieldId(field);
+          const el = document.getElementById(id);
+          if (el) {
+            el.setAttribute('fieldname', field.name);
+            el.setAttribute('pagenumber', String(field.page_sequence));
+            this.makeDraggable(el);
+          }
+          break;
       }
     });
   }
-  reRenderField(field, pageNumber) {
-    const pageInfo = this.cachedPageInfo[pageNumber];
-    // const roleIndex = getRoleIndex(getRoleNames(this.roleStore), field.role_name);
-    const el = renderDocumentField(field, pageInfo, { disabled: true, editable: true, draggable: true });
-    if (!el) {
-      return;
-    }
-    if (Array.isArray(el)) {
-      el.forEach(childEl => {
-        this.attachFieldAttributes(pageInfo, field, childEl);
-        this.makeDraggable(childEl);
-      });
-    }
-    else {
-      this.attachFieldAttributes(pageInfo, field, el);
-      this.makeDraggable(el);
-    }
-  }
   makeDraggable(el) {
     interact_min(el).draggable({
       listeners: {
@@ -273,10 +269,7 @@ 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);
-    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' });
   }
   generateFieldName(type, pageNumber) {
@@ -418,7 +411,7 @@ const VerdocsTemplateFields = /*@__PURE__*/ proxyCustomElement(class extends HTM
         }
       } })))), h("div", { class: "pages" }, (((_c = (_b = this.templateStore) === null || _b === void 0 ? void 0 : _b.state) === null || _c === void 0 ? void 0 : _c.template_documents) || []).map(document => {
       const pageNumbers = integerSequence(1, document.page_numbers);
-      return pageNumbers.map(page => (h("verdocs-template-document-page", { templateId: this.templateId, documentId: document.id, pageNumber: page, virtualWidth: 612, virtualHeight: 792, editable: true, done: false, onClick: (e) => this.handleClickPage(e, page), onPageRendered: e => this.handlePageRendered(e), layers: [
+      return pageNumbers.map(page => (h("verdocs-template-document-page", { templateId: this.templateId, documentId: document.id, pageNumber: page, virtualWidth: 612, virtualHeight: 792, disabled: true, editable: true, done: false, onClick: (e) => this.handleClickPage(e, page), onPageRendered: e => this.handlePageRendered(e), layers: [
           { name: 'page', type: 'canvas' },
           { name: 'controls', type: 'div' },
         ] })));