@verdocs/web-sdk 2.3.86 → 2.3.88

package/dist/docs.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2024-05-24T14:51:05",
+  "timestamp": "2024-05-29T13:51:49",
   "compiler": {
     "name": "@stencil/core",
     "version": "2.20.0",

package/dist/esm/{utils-a56ee5e9.js → utils-f35325fe.js}

@@ -179,11 +179,9 @@ const updateDocumentFieldValue = (field) => {
     existingField.setAttribute('disabled', false); // We need this to trigger a re-render
   }
 };
-const renderDocumentField = (field, docPage, fieldOptions) => {
+const renderDocumentField = (field, docPage, fieldOptions, tabIndex = 1) => {
   var _a, _b;
-  // console.log('rdf', field);
   const { disabled = false, editable = false, draggable = false, done = false } = fieldOptions;
-  // console.log('[renderDocumentField]', field, docPage, roleIndex, fieldOptions);
   const controlsDiv = document.getElementById(docPage.containerId + '-controls');
   if (!controlsDiv) {
     console.log('[renderDocumentField] No controls DIV found', docPage.containerId + '-controls', docPage);
@@ -221,7 +219,7 @@ const renderDocumentField = (field, docPage, fieldOptions) => {
         el.setAttribute('disabled', true);
       }
       else {
-        el.setAttribute('tabIndex', 1);
+        el.setAttribute('tabIndex', tabIndex);
       }
       if (editable) {
         el.setAttribute('editable', true);

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

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-172625c5.js';
 import './Types-5f31149e.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-8196ff47.js';
-import { c as convertToE164 } from './utils-a56ee5e9.js';
+import { c as convertToE164 } from './utils-f35325fe.js';
 import './_commonjsHelpers-5ec8f9b7.js';
 import './Envelopes-627c5239.js';
 import './Types-086facf7.js';

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

@@ -2,7 +2,7 @@ import { r as registerInstance, c as createEvent, h, H as Host, a as getElement
 import { m as getEnvelopeDocumentPageDisplayUri } from './Envelopes-627c5239.js';
 import './Types-5f31149e.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-8196ff47.js';
-import { t as throttle } from './utils-a56ee5e9.js';
+import { t as throttle } from './utils-f35325fe.js';
 import './_commonjsHelpers-5ec8f9b7.js';
 import './Types-086facf7.js';
 import './index-914ed6f7.js';

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

@@ -4,7 +4,7 @@ import { g as getRecipientsWithActions, a as userCanAct, b as userCanCancelEnvel
 import './Types-5f31149e.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-8196ff47.js';
 import { i as integerSequence } from './Primitives-8fe93caf.js';
-import { s as saveEnvelopesAsZip } from './utils-a56ee5e9.js';
+import { s as saveEnvelopesAsZip } from './utils-f35325fe.js';
 import { V as VerdocsToast } from './Toast-f3b8fd46.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import './_commonjsHelpers-5ec8f9b7.js';

package/dist/esm/verdocs-field-attachment_15.entry.js

@@ -2,7 +2,7 @@ import { r as registerInstance, c as createEvent, h, F as Fragment, H as Host, a
 import { g as getRGBA } from './Colors-1b298092.js';
 import { g as getTemplateRoleStore, a as getRoleIndex } from './TemplateRoleStore-33229997.js';
 import { g as getTemplateFieldStore, u as updateStoreField } from './TemplateFieldStore-6e67e86b.js';
-import { g as getFieldSettings, t as throttle, k as getControlStyles, b as getFieldId, h as getFieldOptionId, l as fileToDataUrl } from './utils-a56ee5e9.js';
+import { g as getFieldSettings, t as throttle, k as getControlStyles, b as getFieldId, h as getFieldOptionId, l as fileToDataUrl } from './utils-f35325fe.js';
 import { S as SettingsIcon } from './Icons-ddea87bf.js';
 import { c as createCommonjsModule, a as commonjsGlobal, g as getDefaultExportFromCjs } from './_commonjsHelpers-5ec8f9b7.js';
 import { a as FORMAT_DATE, F as FORMAT_TIMESTAMP } from './Types-086facf7.js';

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

@@ -2,7 +2,7 @@ import { r as registerInstance, c as createEvent, h, H as Host, F as Fragment }
 import { g as getRGBA } from './Colors-1b298092.js';
 import { g as getTemplateRoleStore, a as getRoleIndex } from './TemplateRoleStore-33229997.js';
 import { g as getTemplateFieldStore } from './TemplateFieldStore-6e67e86b.js';
-import { g as getFieldSettings } from './utils-a56ee5e9.js';
+import { g as getFieldSettings } from './utils-f35325fe.js';
 import './index-4439b0d1.js';
 import './_commonjsHelpers-5ec8f9b7.js';
 import './Envelopes-627c5239.js';

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

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-172625c5.js';
 import { i as integerSequence } from './Primitives-8fe93caf.js';
-import { d as renderedTextWidth } from './utils-a56ee5e9.js';
+import { d as renderedTextWidth } from './utils-f35325fe.js';
 import { c as createPopper } from './popper-15e448b4.js';
 import './_commonjsHelpers-5ec8f9b7.js';
 import './Envelopes-627c5239.js';

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

@@ -4,7 +4,7 @@ import { V as VerdocsEndpoint, b as createTemplatev2, u as updateTemplate } from
 import { g as getTemplateFieldStore } from './TemplateFieldStore-6e67e86b.js';
 import { g as getTemplateRoleStore, b as getRoleNames, a as getRoleIndex } from './TemplateRoleStore-33229997.js';
 import { g as getTemplateStore } from './TemplateStore-940da116.js';
-import { r as renderDocumentField } from './utils-a56ee5e9.js';
+import { r as renderDocumentField } from './utils-f35325fe.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import { j as createEnvelope } from './Envelopes-627c5239.js';
 import { a as isValidEmail, i as isValidPhone } from './Validators-16a2a43b.js';

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

@@ -6,7 +6,7 @@ import { V as VerdocsToast } from './Toast-f3b8fd46.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import { g as getRoles, a as getCurrentProfile, u as updateProfile } from './Profiles-d4df4d1c.js';
 import { f as format } from './index-914ed6f7.js';
-import { c as convertToE164 } from './utils-a56ee5e9.js';
+import { c as convertToE164 } from './utils-f35325fe.js';
 import './_commonjsHelpers-5ec8f9b7.js';
 import './Envelopes-627c5239.js';
 import './Types-086facf7.js';

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

@@ -5,7 +5,7 @@ import { e as envelopeRecipientAgree, a as envelopeRecipientDecline, b as envelo
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-8196ff47.js';
 import { i as isValidPhone, a as isValidEmail } from './Validators-16a2a43b.js';
 import { f as fullNameToInitials, i as integerSequence } from './Primitives-8fe93caf.js';
-import { a as saveAttachment, u as updateDocumentFieldValue, r as renderDocumentField, b as getFieldId } from './utils-a56ee5e9.js';
+import { a as saveAttachment, u as updateDocumentFieldValue, r as renderDocumentField, b as getFieldId } from './utils-f35325fe.js';
 import { a as createTemplateFieldStoreFromEnvelope } from './TemplateFieldStore-6e67e86b.js';
 import { V as VerdocsToast } from './Toast-f3b8fd46.js';
 import { S as SDKError } from './errors-9b5498c8.js';
@@ -296,9 +296,8 @@ const VerdocsSign = class {
         break;
     }
   }
-  isFieldValid(field) {
+  isFieldFilled(field) {
     var _a, _b, _c, _d, _e, _f, _g;
-    const { required = false } = field;
     const { result = '', value = '', base64 = '' } = field.settings || {};
     switch (field.type) {
       case 'textbox':
@@ -308,25 +307,25 @@ const VerdocsSign = class {
           case 'phone':
             return isValidPhone(result);
           default:
-            return !required || result !== '';
+            return result !== '';
         }
       case 'signature':
       case 'initial':
-        return !required || base64 !== '';
+        return base64 !== '';
       // Timestamp fields get automatically filled when the envelope is submitted.
       case 'timestamp':
         return true;
       case 'textarea':
       case 'date':
       case 'attachment':
-        return !required || result !== '';
+        return result !== '';
       case 'dropdown':
-        return !required || value !== '';
+        return value !== '';
       case 'checkbox_group':
         const checkedCount = (((_c = (_b = field.settings) === null || _b === void 0 ? void 0 : _b.options) === null || _c === void 0 ? void 0 : _c.filter(option => option.checked)) || []).length;
-        return !required || (checkedCount >= (((_d = field.settings) === null || _d === void 0 ? void 0 : _d.minimum_checked) || 0) && checkedCount <= (((_e = field.settings) === null || _e === void 0 ? void 0 : _e.maximum_checked) || 999));
+        return checkedCount >= (((_d = field.settings) === null || _d === void 0 ? void 0 : _d.minimum_checked) || 0) && checkedCount <= (((_e = field.settings) === null || _e === void 0 ? void 0 : _e.maximum_checked) || 999);
       case 'radio_button_group':
-        return !required || (((_g = (_f = field.settings) === null || _f === void 0 ? void 0 : _f.options) === null || _g === void 0 ? void 0 : _g.filter(option => option.selected)) || []).length > 0;
+        return (((_g = (_f = field.settings) === null || _f === void 0 ? void 0 : _f.options) === null || _g === void 0 ? void 0 : _g.filter(option => option.selected)) || []).length > 0;
       // TODO
       // case 'checkbox':
       //   return <verdocs-field-checkbox style={style} value={result || ''} id={id} />;
@@ -336,6 +335,28 @@ const VerdocsSign = class {
         return false;
     }
   }
+  isFieldValid(field) {
+    const { required = false } = field;
+    return !required || this.isFieldFilled(field);
+  }
+  getSortedFillableFields() {
+    const recipientFields = this.getRecipientFields().filter(field => field.type !== 'timestamp');
+    recipientFields.sort((a, b) => {
+      var _a, _b, _c, _d;
+      const aX = ((_a = a.settings) === null || _a === void 0 ? void 0 : _a.x) || 0;
+      const aY = ((_b = a.settings) === null || _b === void 0 ? void 0 : _b.y) || 0;
+      const bX = ((_c = b.settings) === null || _c === void 0 ? void 0 : _c.x) || 0;
+      const bY = ((_d = b.settings) === null || _d === void 0 ? void 0 : _d.y) || 0;
+      // NOTE: Logic looks a little strange X vs Y. It's because we go top down,
+      // left to right. But Y coordinates are inverted in PDFs. The reason for
+      // the division is because no human makes perfect templates and frequently
+      // two fields on the "same line" will be slightly offset vertically.
+      const divaY = Math.floor(aY / 5);
+      const divbY = Math.floor(bY / 5);
+      return divbY !== divaY ? divbY - divaY : aX - bX;
+    });
+    return recipientFields;
+  }
   async handleNext() {
     var _a, _b;
     if (this.nextSubmits) {
@@ -361,35 +382,39 @@ const VerdocsSign = class {
       this.submitting = false;
       return;
     }
-    // Find and focus the next incomplete required field (that is fillable)
-    const requiredFields = this.getRecipientFields()
-      .filter(field => field.required)
-      .filter(field => field.type !== 'timestamp');
-    requiredFields.sort((a, b) => {
+    // Find and focus the next incomplete` field (that is fillable)
+    const emptyFields = this.getSortedFillableFields().filter(field => !this.isFieldFilled(field));
+    emptyFields.sort((a, b) => {
       var _a, _b, _c, _d;
       const aX = ((_a = a.settings) === null || _a === void 0 ? void 0 : _a.x) || 0;
       const aY = ((_b = a.settings) === null || _b === void 0 ? void 0 : _b.y) || 0;
       const bX = ((_c = b.settings) === null || _c === void 0 ? void 0 : _c.x) || 0;
       const bY = ((_d = b.settings) === null || _d === void 0 ? void 0 : _d.y) || 0;
-      return bY !== aY ? bY - aY : bX - aX;
+      // NOTE: Logic looks a little strange X vs Y. It's because we go top down,
+      // left to right. But Y coordinates are inverted in PDFs. The reason for
+      // the division is because no human makes perfect templates and frequently
+      // two fields on the "same line" will be slightly offset vertically.
+      const divaY = Math.floor(aY / 5);
+      const divbY = Math.floor(bY / 5);
+      return divbY !== divaY ? divbY - divaY : aX - bX;
     });
-    const focusedIndex = requiredFields.findIndex(field => field.name === this.focusedField);
+    const focusedIndex = emptyFields.findIndex(field => field.name === this.focusedField);
     let nextFocusedIndex = focusedIndex + 1;
-    if (nextFocusedIndex >= requiredFields.length) {
+    if (nextFocusedIndex >= emptyFields.length) {
       nextFocusedIndex = 0;
     }
-    let nextRequiredField = requiredFields[nextFocusedIndex];
+    let nextRequiredField = emptyFields[nextFocusedIndex];
     // Skip signature and initial fields that are already filled in. We have to count our "skips" just in case, to avoid infinite loops.
     let skips = 0;
-    if (skips < requiredFields.length && ['signature', 'initial'].includes(nextRequiredField.type) && ((_b = nextRequiredField.settings) === null || _b === void 0 ? void 0 : _b.result) === 'signed') {
+    if (skips < emptyFields.length && ['signature', 'initial'].includes(nextRequiredField.type) && ((_b = nextRequiredField.settings) === null || _b === void 0 ? void 0 : _b.result) === 'signed') {
       skips++;
       nextFocusedIndex++;
-      if (nextFocusedIndex >= requiredFields.length) {
+      if (nextFocusedIndex >= emptyFields.length) {
         nextFocusedIndex = 0;
       }
-      nextRequiredField = requiredFields[nextFocusedIndex];
+      nextRequiredField = emptyFields[nextFocusedIndex];
     }
-    if (skips >= requiredFields.length) {
+    if (skips >= emptyFields.length) {
       nextRequiredField = null;
     }
     if (nextRequiredField) {
@@ -453,22 +478,19 @@ const VerdocsSign = class {
   }
   handlePageRendered(e) {
     const pageInfo = e.detail;
-    // const roleIndex = getRoleIndex(this.roleStore, this.recipient.role_name);
-    // console.log(
-    //   'hpr',
-    //   this.recipient,
-    //   this.envelope.fields.filter(field => field.recipient_role === this.recipient.role_name),
-    // );
-    const recipientFields = this.getRecipientFields().filter(field => field.page === pageInfo.pageNumber);
-    // console.log('[SIGN] Page rendered, updating fields', {pageInfo, roleIndex, recipientFields});
+    // NOTE: We don't filter on pageNumber here because we need the position in the
+    // entire list to set the tabIndex.
+    const recipientFields = this.getSortedFillableFields();
+    // this.getRecipientFields().filter(field => field.page === pageInfo.pageNumber);
     // First render the fields for the signer
     // Also show field placeholders for other signers who have yet to act
     // In template list in Beta, show second date being sorted on
     // Sign top to bottom left to right
-    recipientFields
-      .filter(field => field.page === pageInfo.pageNumber)
-      .forEach(field => {
-      const el = renderDocumentField(field, pageInfo, { disabled: false, editable: false, draggable: false, done: this.isDone });
+    recipientFields.forEach((field, tabIndex) => {
+      if (field.page !== pageInfo.pageNumber) {
+        return;
+      }
+      const el = renderDocumentField(field, pageInfo, { disabled: false, editable: false, draggable: false, done: this.isDone }, tabIndex);
       if (!el) {
         return;
       }

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

@@ -5,7 +5,7 @@ import { V as VerdocsEndpoint, T as TemplateSenderTypes, u as updateTemplate } f
 import { u as updateField, c as createField } from './Fields-c82e6df3.js';
 import { i as integerSequence } from './Primitives-8fe93caf.js';
 import { g as getTemplateFieldStore, u as updateStoreField } from './TemplateFieldStore-6e67e86b.js';
-import { e as updateCssTransform, f as removeCssTransform, b as getFieldId, h as getFieldOptionId, i as defaultWidth, j as defaultHeight } from './utils-a56ee5e9.js';
+import { e as updateCssTransform, f as removeCssTransform, b as getFieldId, h as getFieldOptionId, i as defaultWidth, j as defaultHeight } from './utils-f35325fe.js';
 import { g as getTemplateRoleStore, u as updateStoreRole, d as deleteStoreRole, a as getRoleIndex } from './TemplateRoleStore-33229997.js';
 import { g as getTemplateStore } from './TemplateStore-940da116.js';
 import { S as SDKError } from './errors-9b5498c8.js';

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

@@ -4,7 +4,7 @@ import { b as userCanCancelEnvelope } from './Permissions-f2eb0421.js';
 import './Types-5f31149e.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint-8196ff47.js';
 import { i as integerSequence } from './Primitives-8fe93caf.js';
-import { s as saveEnvelopesAsZip } from './utils-a56ee5e9.js';
+import { s as saveEnvelopesAsZip } from './utils-f35325fe.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import './_commonjsHelpers-5ec8f9b7.js';
 import './Types-086facf7.js';