@verdocs/web-sdk 1.9.41 → 1.10.0

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

@@ -1,11 +1,11 @@
 import { r as registerInstance, h, H as Host } from './index-f78d163d.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-188fa107.js';
+import { g as getFieldSettings } from './utils-3d95c588.js';
 import './Envelopes-130fd6ea.js';
 import './Token-54690789.js';
 import './Files-70a192df.js';
 
-const verdocsFieldRadioButtonCss = "verdocs-field-radio-button{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;width:14px;height:14px;display:block;font-size:11px;position:relative;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left;border-radius:100%}verdocs-field-radio-button svg{margin-top:4px}verdocs-field-radio-button.disabled{opacity:0.5}verdocs-field-radio-button.disabled.done{opacity:1}verdocs-field-radio-button.done input[type=radio]{margin:0;padding:0;width:10px;height:10px}verdocs-field-radio-button:not(.done) input[type=radio]{position:absolute;opacity:0}verdocs-field-radio-button:not(.done) input[type=radio]+label:before{content:\"\";border-radius:100%;border:1px solid rgba(0, 0, 0, 0.6);display:inline-block;width:10px;height:10px;position:absolute;left:1px;top:1px;cursor:pointer;text-align:center;-webkit-transition:all 250ms ease;transition:all 250ms ease}verdocs-field-radio-button:not(.done) input[type=radio]:checked+label:before{background-color:#55bc81;-webkit-box-shadow:inset 0 0 0 2px #f5f5fa;box-shadow:inset 0 0 0 2px #f5f5fa}verdocs-field-radio-button:not(.done) input[type=radio]:focus+label:before{outline:none;border-color:#55bc81}verdocs-field-radio-button:not(.done) input[type=radio]:disabled+label:before{-webkit-box-shadow:inset 0 0 0 4px #f5f5fa;box-shadow:inset 0 0 0 4px #f5f5fa;border-color:#a0a0d0;background:#a0a0d0}verdocs-field-radio-button:not(.done) input[type=radio]+label:empty:before{margin-right:0}verdocs-field-radio-button.required input[type=radio]+label:before{border:1px solid #cc0000}verdocs-field-radio-button.hide{display:none}verdocs-field-radio-button.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}";
+const verdocsFieldRadioButtonCss = "verdocs-field-radio-button{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;width:12px;height:12px;display:block;font-size:11px;position:relative;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left;border-radius:100%}verdocs-field-radio-button svg{margin-top:4px}verdocs-field-radio-button.disabled{opacity:0.5}verdocs-field-radio-button.disabled.done{opacity:1}verdocs-field-radio-button.done input[type=radio]{margin:0;padding:0;width:10px;height:10px}verdocs-field-radio-button:not(.done) input[type=radio]{position:absolute;opacity:0}verdocs-field-radio-button:not(.done) input[type=radio]+label:before{content:\"\";border-radius:100%;border:1px solid rgba(0, 0, 0, 0.6);display:inline-block;width:10px;height:10px;position:absolute;left:1px;top:1px;cursor:pointer;text-align:center;-webkit-transition:all 250ms ease;transition:all 250ms ease}verdocs-field-radio-button:not(.done) input[type=radio]:checked+label:before{background-color:#55bc81;-webkit-box-shadow:inset 0 0 0 2px #f5f5fa;box-shadow:inset 0 0 0 2px #f5f5fa}verdocs-field-radio-button:not(.done) input[type=radio]:focus+label:before{outline:none;border-color:#55bc81}verdocs-field-radio-button:not(.done) input[type=radio]:disabled+label:before{-webkit-box-shadow:inset 0 0 0 4px #f5f5fa;box-shadow:inset 0 0 0 4px #f5f5fa;border-color:#a0a0d0;background:#a0a0d0}verdocs-field-radio-button:not(.done) input[type=radio]+label:empty:before{margin-right:0}verdocs-field-radio-button.required input[type=radio]+label:before{border:1px solid #cc0000}verdocs-field-radio-button.hide{display:none}verdocs-field-radio-button.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}";
 
 const RadioIconUnselected = `<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"></path></svg>`;
 const RadioIconSelected = `<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24"><path d="M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"></path></svg>`;

package/dist/{components/verdocs-field-signature2.js → esm/verdocs-field-signature.entry.js}

@@ -1,19 +1,16 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { g as getRGBA } from './Colors.js';
-import { g as getFieldSettings } from './utils.js';
-import { d as defineCustomElement$5 } from './verdocs-button2.js';
-import { d as defineCustomElement$4 } from './verdocs-button-panel2.js';
-import { d as defineCustomElement$3 } from './verdocs-select-input2.js';
-import { d as defineCustomElement$2 } from './verdocs-signature-dialog2.js';
-import { d as defineCustomElement$1 } from './verdocs-text-input2.js';
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
+import { g as getRGBA } from './Colors-1b298092.js';
+import { g as getFieldSettings } from './utils-3d95c588.js';
+import './Envelopes-130fd6ea.js';
+import './Token-54690789.js';
+import './Files-70a192df.js';
 
 const verdocsFieldSignatureCss = "verdocs-field-signature{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;width:83px;height:36px;display:block;font-size:11px;position:relative;letter-spacing:0.3px;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left;border:1px solid rgba(0, 0, 0, 0.2)}verdocs-field-signature.disabled{opacity:0.5}verdocs-field-signature.done{border:none;opacity:1}verdocs-field-signature img{display:block;max-width:100%;max-height:100%}verdocs-field-signature button{-webkit-box-sizing:border-box;box-sizing:border-box;border:none;color:rgba(0, 0, 0, 0.87);font-weight:500;-webkit-transform-origin:0 0;transform-origin:0 0;height:100%;width:100%;background:none;font-size:11px}verdocs-field-signature button.hide{display:none}verdocs-field-signature.required{border:1px solid #cc0000}verdocs-field-signature.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}verdocs-field-signature verdocs-button-panel{top:-3px;left:-2px;opacity:0.5;z-index:1000;cursor:pointer;position:absolute;-webkit-transform:scale(0.6);transform:scale(0.6)}verdocs-field-signature verdocs-button-panel[data-active],verdocs-field-signature verdocs-button-panel:hover{opacity:1}verdocs-field-signature verdocs-button-panel .icon svg{fill:#333333}verdocs-field-signature verdocs-button-panel .icon:hover svg{fill:#000000}";
 
 const settingsIcon = '<svg xmlns="http://www.w3.org/2000/svg" height="20" width="20"><path d="m7.5 18.5-.312-2.667q-.188-.125-.396-.25-.209-.125-.396-.229l-2.479 1.063-2.521-4.334 2.125-1.625q.021-.104.021-.229v-.458q0-.125-.021-.229L1.396 7.917l2.521-4.313 2.5 1.042q.166-.104.375-.229.208-.125.396-.229L7.5 1.5h5l.312 2.688q.188.104.396.229.209.125.396.229l2.479-1.042 2.521 4.313-2.125 1.625v.916l2.125 1.625-2.521 4.334-2.5-1.063q-.166.104-.375.229-.208.125-.396.25L12.5 18.5Zm2.479-5.521q1.229 0 2.104-.875T12.958 10q0-1.229-.875-2.104t-2.104-.875q-1.208 0-2.094.875Q7 8.771 7 10t.885 2.104q.886.875 2.094.875Zm0-1.75q-.5 0-.864-.364Q8.75 10.5 8.75 10t.365-.865q.364-.364.864-.364t.865.364q.364.365.364.865t-.364.865q-.365.364-.865.364ZM10.021 10Zm-.792 6.521h1.542l.25-2.146q.625-.167 1.198-.51.573-.344 1.031-.823l2.021.854.771-1.271-1.771-1.354q.104-.292.156-.615.052-.323.052-.656 0-.292-.052-.604-.052-.313-.135-.646l1.77-1.375-.77-1.271-2.021.875q-.479-.5-1.042-.833-.562-.334-1.187-.5l-.271-2.167H9.208l-.25 2.167q-.625.166-1.187.5-.563.333-1.042.812l-2-.854-.771 1.271 1.73 1.354q-.084.333-.136.656Q5.5 9.708 5.5 10t.052.604q.052.313.136.667l-1.73 1.354.771 1.271 2-.834q.479.459 1.042.792.562.334 1.187.5Z"/></svg>';
-const VerdocsFieldSignature = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
+const VerdocsFieldSignature = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
     this.fieldChange = createEvent(this, "fieldChange", 7);
     this.settingsPress = createEvent(this, "settingsPress", 7);
     this.field = null;
@@ -63,56 +60,7 @@ const VerdocsFieldSignature = /*@__PURE__*/ proxyCustomElement(class extends HTM
         { label: 'Seller', value: 'Seller' },
       ] }), h("verdocs-text-input", { label: "Field Name", value: "", placeholder: "Stored field name...", onInput: e => console.log('ipt', e) }), h("verdocs-text-input", { label: "Placeholder", value: "", placeholder: "Placeholder text...", onInput: e => console.log('ipt', e) }))))));
   }
-  static get style() { return verdocsFieldSignatureCss; }
-}, [0, "verdocs-field-signature", {
-    "field": [16],
-    "name": [1],
-    "disabled": [4],
-    "editable": [4],
-    "moveable": [4],
-    "done": [4],
-    "roleindex": [2],
-    "tempSignature": [32],
-    "focusField": [64]
-  }]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["verdocs-field-signature", "verdocs-button", "verdocs-button-panel", "verdocs-select-input", "verdocs-signature-dialog", "verdocs-text-input"];
-  components.forEach(tagName => { switch (tagName) {
-    case "verdocs-field-signature":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, VerdocsFieldSignature);
-      }
-      break;
-    case "verdocs-button":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$5();
-      }
-      break;
-    case "verdocs-button-panel":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$4();
-      }
-      break;
-    case "verdocs-select-input":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$3();
-      }
-      break;
-    case "verdocs-signature-dialog":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$2();
-      }
-      break;
-    case "verdocs-text-input":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$1();
-      }
-      break;
-  } });
-}
-defineCustomElement();
+};
+VerdocsFieldSignature.style = verdocsFieldSignatureCss;
 
-export { VerdocsFieldSignature as V, defineCustomElement as d };
+export { VerdocsFieldSignature as verdocs_field_signature };

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

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host } from './index-f78d163d.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-188fa107.js';
+import { g as getFieldSettings } from './utils-3d95c588.js';
 import './Envelopes-130fd6ea.js';
 import './Token-54690789.js';
 import './Files-70a192df.js';

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

@@ -1,14 +1,14 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
 import { g as getRGBA } from './Colors-1b298092.js';
 import { s as state } from './templateStore-7b50460b.js';
-import { g as getFieldSettings } from './utils-188fa107.js';
+import { g as getFieldSettings } from './utils-3d95c588.js';
 import './index-fd7b8a34.js';
 import './Primitives-054bc6e5.js';
 import './Envelopes-130fd6ea.js';
 import './Token-54690789.js';
 import './Files-70a192df.js';
 
-const verdocsFieldTextboxCss = "verdocs-field-textbox{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;width:150px;height:15px;display:block;font-size:11px;position:relative;letter-spacing:-0.2px;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left}verdocs-field-textbox.disabled{opacity:0.5}verdocs-field-textbox input{width:100%;height:100%;font-size:11px;background:none;font-weight:500;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-box-sizing:border-box;box-sizing:border-box;color:rgba(0, 0, 0, 0.87);border:1px solid rgba(0, 0, 0, 0.2)}verdocs-field-textbox input:focus{outline:none}verdocs-field-textbox input.hide{display:none}verdocs-field-textbox.required{border:1px solid #cc0000}verdocs-field-textbox.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}verdocs-field-textbox verdocs-button-panel{top:-3px;left:-2px;opacity:0.5;z-index:1000;cursor:pointer;position:absolute;-webkit-transform:scale(0.6);transform:scale(0.6)}verdocs-field-textbox verdocs-button-panel[data-active],verdocs-field-textbox verdocs-button-panel:hover{opacity:1}verdocs-field-textbox verdocs-button-panel .icon svg{fill:#333333}verdocs-field-textbox verdocs-button-panel .icon:hover svg{fill:#000000}verdocs-field-textbox [data-lastpass-icon-root]{display:none !important}";
+const verdocsFieldTextboxCss = "verdocs-field-textbox{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;width:150px;height:15px;display:block;font-size:11px;position:relative;letter-spacing:-0.2px;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left;border:1px solid rgba(0, 0, 0, 0.2)}verdocs-field-textbox.disabled{opacity:0.5}verdocs-field-textbox input{width:100%;height:100%;font-size:11px;background:none;font-weight:500;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-box-sizing:border-box;box-sizing:border-box;color:rgba(0, 0, 0, 0.87);border:none;outline:none}verdocs-field-textbox input.hide{display:none}verdocs-field-textbox.required{border:1px solid #cc0000}verdocs-field-textbox.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}verdocs-field-textbox verdocs-button-panel{top:-3px;left:-2px;opacity:0.5;z-index:1000;cursor:pointer;position:absolute;-webkit-transform:scale(0.6);transform:scale(0.6)}verdocs-field-textbox verdocs-button-panel[data-active],verdocs-field-textbox verdocs-button-panel:hover{opacity:1}verdocs-field-textbox verdocs-button-panel .icon svg{fill:#333333}verdocs-field-textbox verdocs-button-panel .icon:hover svg{fill:#000000}verdocs-field-textbox [data-lastpass-icon-root]{display:none !important}";
 
 const settingsIcon = '<svg xmlns="http://www.w3.org/2000/svg" height="20" width="20"><path d="m7.5 18.5-.312-2.667q-.188-.125-.396-.25-.209-.125-.396-.229l-2.479 1.063-2.521-4.334 2.125-1.625q.021-.104.021-.229v-.458q0-.125-.021-.229L1.396 7.917l2.521-4.313 2.5 1.042q.166-.104.375-.229.208-.125.396-.229L7.5 1.5h5l.312 2.688q.188.104.396.229.209.125.396.229l2.479-1.042 2.521 4.313-2.125 1.625v.916l2.125 1.625-2.521 4.334-2.5-1.063q-.166.104-.375.229-.208.125-.396.25L12.5 18.5Zm2.479-5.521q1.229 0 2.104-.875T12.958 10q0-1.229-.875-2.104t-2.104-.875q-1.208 0-2.094.875Q7 8.771 7 10t.885 2.104q.886.875 2.094.875Zm0-1.75q-.5 0-.864-.364Q8.75 10.5 8.75 10t.365-.865q.364-.364.864-.364t.865.364q.364.365.364.865t-.364.865q-.365.364-.865.364ZM10.021 10Zm-.792 6.521h1.542l.25-2.146q.625-.167 1.198-.51.573-.344 1.031-.823l2.021.854.771-1.271-1.771-1.354q.104-.292.156-.615.052-.323.052-.656 0-.292-.052-.604-.052-.313-.135-.646l1.77-1.375-.77-1.271-2.021.875q-.479-.5-1.042-.833-.562-.334-1.187-.5l-.271-2.167H9.208l-.25 2.167q-.625.166-1.187.5-.563.333-1.042.812l-2-.854-.771 1.271 1.73 1.354q-.084.333-.136.656Q5.5 9.708 5.5 10t.052.604q.052.313.136.667l-1.73 1.354.771 1.271 2-.834q.479.459 1.042.792.562.334 1.187.5Z"/></svg>';
 const VerdocsFieldTextbox = class {

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

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host } from './index-f78d163d.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-188fa107.js';
+import { g as getFieldSettings } from './utils-3d95c588.js';
 import { f as format } from './index-d264c496.js';
 import './Envelopes-130fd6ea.js';
 import './Token-54690789.js';

package/dist/esm/verdocs-floating-menu_2.entry.js

@@ -0,0 +1,146 @@
+import { r as registerInstance, c as createEvent, h, a as getElement, H as Host } from './index-f78d163d.js';
+import { c as createPopper } from './popper-f860750c.js';
+
+const verdocsFloatingMenuCss = "verdocs-floating-menu{display:none}#verdocs-floating-menu{position:absolute;width:56px;height:56px;display:-ms-flexbox;display:flex;-ms-flex:0 0 fit-content;flex:0 0 fit-content}#verdocs-floating-menu:not(.force-closed):hover{height:500px}#verdocs-floating-menu:not(.force-closed):hover .trigger{-webkit-box-shadow:0 10px 25px #4c56cb;box-shadow:0 10px 25px #4c56cb;-webkit-transform:translatey(2px);transform:translatey(2px);-webkit-transition:all 0.3s;transition:all 0.3s}#verdocs-floating-menu:not(.force-closed):hover .options{display:-ms-flexbox;display:flex}#verdocs-floating-menu:not(.force-closed):hover .options .option{-webkit-animation:vfm-appear 0.1s forwards 0.2s;animation:vfm-appear 0.1s forwards 0.2s}#verdocs-floating-menu .trigger{position:absolute;width:56px;height:56px;background:#654dcb;bottom:0;border-radius:50%;left:0;right:0;margin:auto;color:white;line-height:52px;text-align:center;font-size:44px;z-index:100;-webkit-box-shadow:0 10px 25px -5px #4c56cb;box-shadow:0 10px 25px -5px #4c56cb;cursor:pointer;-webkit-transition:all 0.3s;transition:all 0.3s}#verdocs-floating-menu .options{width:56px;-ms-flex-direction:column;flex-direction:column;-ms-flex:0 0 fit-content;flex:0 0 fit-content;position:absolute;bottom:70px;display:none}#verdocs-floating-menu .option{background:#654dcb;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border-radius:50%;width:36px;height:36px;margin:5px auto;color:white;font-weight:500;text-align:center;line-height:36px;opacity:0}#verdocs-floating-menu verdocs-toolbar-icon .icon{display:-ms-flexbox;display:flex}#verdocs-floating-menu verdocs-toolbar-icon .icon svg{fill:#ffffff}@-webkit-keyframes vfm-appear{0%{opacity:0}30%{-webkit-transform:scale(0.4);transform:scale(0.4);opacity:0.3}70%{-webkit-transform:scale(1.2);transform:scale(1.2);opacity:0.6}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes vfm-appear{0%{opacity:0}30%{-webkit-transform:scale(0.4);transform:scale(0.4);opacity:0.3}70%{-webkit-transform:scale(1.2);transform:scale(1.2);opacity:0.6}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}";
+
+// @see https://stackoverflow.com/a/49186677/1812436
+const getScrollParent = node => {
+  const regex = /(auto|scroll)/;
+  const parents = (_node, ps) => {
+    if (_node.parentNode === null) {
+      return ps;
+    }
+    return parents(_node.parentNode, ps.concat([_node]));
+  };
+  const style = (_node, prop) => getComputedStyle(_node, null).getPropertyValue(prop);
+  const overflow = _node => style(_node, 'overflow') + style(_node, 'overflow-y') + style(_node, 'overflow-x');
+  const scroll = _node => regex.test(overflow(_node));
+  const scrollParent = _node => {
+    if (!(_node instanceof HTMLElement || _node instanceof SVGElement)) {
+      return;
+    }
+    const ps = parents(_node.parentNode, []);
+    for (let i = 0; i < ps.length; i += 1) {
+      if (scroll(ps[i])) {
+        return ps[i];
+      }
+    }
+    return document.scrollingElement || document.documentElement;
+  };
+  return scrollParent(node);
+};
+const VerdocsFloatingMenu = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.optionSelected = createEvent(this, "optionSelected", 7);
+    this.menuContainer = null;
+    this.scrollParent = null;
+    this.scrollParentParent = null;
+    this.options = [];
+  }
+  componentDidLoad() {
+    this.menuContainer = document.createElement('div');
+    this.menuContainer.id = 'verdocs-floating-menu';
+    let el = document.createElement('div');
+    el.className = 'trigger';
+    el.innerText = '+';
+    this.menuContainer.append(el);
+    el = document.createElement('div');
+    el.className = 'options';
+    this.menuContainer.append(el);
+    const localhandleSelect = this.handleSelect.bind(this);
+    this.options.forEach(option => {
+      const childEl = document.createElement('div');
+      childEl.className = 'option';
+      childEl.addEventListener('click', () => localhandleSelect(option));
+      el.append(childEl);
+      const iconEl = document.createElement('verdocs-toolbar-icon');
+      iconEl.setAttribute('icon', option.icon);
+      iconEl.setAttribute('text', option.tooltip);
+      iconEl.setAttribute('placement', 'left');
+      childEl.append(iconEl);
+    });
+    document.body.append(this.menuContainer);
+    this.scrollParent = getScrollParent(this.el);
+    if (this.scrollParent) {
+      this.scrollParentParent = this.scrollParent.parentElement;
+      this.repositionTrigger(this.scrollParent);
+    }
+  }
+  disconnectedCallback() {
+    var _a;
+    (_a = this.menuContainer) === null || _a === void 0 ? void 0 : _a.remove();
+  }
+  handleSelect(option) {
+    var _a;
+    (_a = this.optionSelected) === null || _a === void 0 ? void 0 : _a.emit(option);
+    const el = document.getElementById('verdocs-floating-menu');
+    if (el) {
+      el.className = 'force-closed';
+      setTimeout(() => {
+        el.className = '';
+      }, 100);
+    }
+  }
+  repositionTrigger(scrollParent) {
+    const scrollParentParent = scrollParent.parentElement;
+    if (scrollParentParent) {
+      const bounds = scrollParentParent.getBoundingClientRect();
+      const menu = document.getElementById('verdocs-floating-menu');
+      if (menu) {
+        menu.style.bottom = `${document.documentElement.clientHeight - (document.documentElement.scrollTop + bounds.bottom) + 10}px`;
+        menu.style.left = `${bounds.right - 80}px`;
+      }
+    }
+  }
+  render() {
+    return h(Host, null);
+  }
+  get el() { return getElement(this); }
+};
+VerdocsFloatingMenu.style = verdocsFloatingMenuCss;
+
+const verdocsToolbarIconCss = "verdocs-toolbar-icon{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;display:inline-block}verdocs-toolbar-icon .icon{display:inline-block;cursor:pointer}verdocs-toolbar-icon .icon svg{fill:#5c6575}verdocs-toolbar-icon .tooltip{display:none;-webkit-box-shadow:0 0 10px 1px #999999;box-shadow:0 0 10px 1px #999999;background:#ffffff;color:#33364b;max-width:240px;font-weight:bold;padding:5px 10px;font-size:13px;position:relative;border-radius:4px;z-index:20000;white-space:nowrap}verdocs-toolbar-icon .tooltip .arrow,verdocs-toolbar-icon .tooltip .arrow::before{position:absolute;width:8px;height:8px;background:inherit}verdocs-toolbar-icon .tooltip .arrow{visibility:hidden;top:-4px}verdocs-toolbar-icon .tooltip .arrow::before{visibility:visible;content:\"\";-webkit-transform:rotate(45deg);transform:rotate(45deg)}verdocs-toolbar-icon .tooltip[data-show]{display:block}verdocs-toolbar-icon .tooltip[data-popper-placement^=top]>.arrow{bottom:-4px}verdocs-toolbar-icon .tooltip[data-popper-placement^=bottom]>.arrow{top:-4px}verdocs-toolbar-icon .tooltip[data-popper-placement^=left]>.arrow{right:-4px}verdocs-toolbar-icon .tooltip[data-popper-placement^=right]>.arrow{left:-4px}verdocs-toolbar-icon .tooltip[data-popper-placement^=left]{padding:3px 10px}verdocs-toolbar-icon .tooltip[data-popper-placement^=left]>.arrow{right:-1px}";
+
+const VerdocsToolbarIcon = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.text = '';
+    this.icon = '';
+    this.placement = 'bottom';
+    this.containerId = `verdocs-toolbar-icon-${Math.random().toString(36).substring(2, 11)}`;
+  }
+  componentDidLoad() {
+    this.popperInstance = createPopper(this.iconEl, this.tooltip, {
+      placement: this.placement,
+      modifiers: this.placement === 'left' ? [{ name: 'offset', options: { offset: [0, 20] } }] : [],
+    });
+    // placement: 'top-end',
+    // modifiers: [{name: 'offset', options: {offset: [0, 10]}}],
+    // });
+  }
+  disconnectedCallback() {
+    if (this.popperInstance) {
+      this.popperInstance.destroy();
+      this.popperInstance = null;
+    }
+  }
+  show() {
+    var _a, _b;
+    (_a = this.tooltip) === null || _a === void 0 ? void 0 : _a.setAttribute('data-show', '');
+    (_b = this.popperInstance) === null || _b === void 0 ? void 0 : _b.update().catch(() => { });
+  }
+  hide() {
+    var _a;
+    (_a = this.tooltip) === null || _a === void 0 ? void 0 : _a.removeAttribute('data-show');
+  }
+  // handlePress() {
+  //   this.press?.emit();
+  // }
+  render() {
+    return (h(Host, { class: {} }, h("div", { "aria-describedby": this.containerId, class: "icon", innerHTML: this.icon, onMouseEnter: () => this.show(), onFocus: () => this.show(), onMouseLeave: () => this.hide(), onBlur: () => this.hide(), ref: el => (this.iconEl = el) }), h("div", { id: this.containerId, role: "tooltip", class: "tooltip", "data-popper-placement": this.placement, ref: el => (this.tooltip = el) }, this.text, h("div", { "data-popper-arrow": "true", class: "arrow" }))));
+  }
+};
+VerdocsToolbarIcon.style = verdocsToolbarIconCss;
+
+export { VerdocsFloatingMenu as verdocs_floating_menu, VerdocsToolbarIcon as verdocs_toolbar_icon };

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

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
 import './Types-ab9f6af8.js';
-import { V as VerdocsEndpoint } from './VerdocsEndpoint-cf4392fb.js';
-import { r as renderDocumentField, a as getRoleIndex } from './utils-188fa107.js';
+import { V as VerdocsEndpoint } from './VerdocsEndpoint-6df32d3a.js';
+import { r as renderDocumentField, a as getRoleIndex } from './utils-3d95c588.js';
 import { s as state } from './templateStore-7b50460b.js';
 import { l as loadTemplate } from './Templates-ad0e1ebe.js';
 import { S as SDKError } from './errors-9b5498c8.js';

package/dist/esm/verdocs-quick-functions_3.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h } from './index-f78d163d.js';
 import './Types-ab9f6af8.js';
-import { V as VerdocsEndpoint } from './VerdocsEndpoint-cf4392fb.js';
+import { V as VerdocsEndpoint } from './VerdocsEndpoint-6df32d3a.js';
 import { a as getTemplates } from './Templates-0638b1e4.js';
 import './Token-54690789.js';
 

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

@@ -1,6 +1,6 @@
 import { r as registerInstance, h } from './index-f78d163d.js';
 import './Types-ab9f6af8.js';
-import { V as VerdocsEndpoint } from './VerdocsEndpoint-cf4392fb.js';
+import { V as VerdocsEndpoint } from './VerdocsEndpoint-6df32d3a.js';
 import './Token-54690789.js';
 
 const verdocsSearchCss = "verdocs-search{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;display:-ms-flexbox;display:flex;background-color:#1e2031}verdocs-search search-box{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:20px 10px}verdocs-search .boxes{-ms-flex-wrap:wrap;flex-wrap:wrap;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;margin:20px 0}verdocs-search search-recent,verdocs-search search-saved,verdocs-search search-quick-functions,verdocs-search search-starred{display:-ms-flexbox;display:flex;margin:0 20px 20px 0}";

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

@@ -3,8 +3,8 @@ import { g as getTemplate } from './Templates-0638b1e4.js';
 import './Types-ab9f6af8.js';
 import { i as isValidEmail, a as isValidPhone } from './Validators-f110bae2.js';
 import { g as getRGBA } from './Colors-1b298092.js';
-import { V as VerdocsEndpoint } from './VerdocsEndpoint-cf4392fb.js';
-import { a as getRoleIndex } from './utils-188fa107.js';
+import { V as VerdocsEndpoint } from './VerdocsEndpoint-6df32d3a.js';
+import { a as getRoleIndex } from './utils-3d95c588.js';
 import './Token-54690789.js';
 import './Envelopes-130fd6ea.js';
 import './Files-70a192df.js';

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

@@ -3,8 +3,8 @@ import { b as getSigningSession, u as updateEnvelopeField, c as updateEnvelopeFi
 import './Types-ab9f6af8.js';
 import { a as isValidPhone, i as isValidEmail } from './Validators-f110bae2.js';
 import { f as fullNameToInitials } from './Primitives-054bc6e5.js';
-import { V as VerdocsEndpoint } from './VerdocsEndpoint-cf4392fb.js';
-import { s as savePDF, u as updateDocumentFieldValue, a as getRoleIndex, r as renderDocumentField, b as getFieldId } from './utils-188fa107.js';
+import { V as VerdocsEndpoint } from './VerdocsEndpoint-6df32d3a.js';
+import { s as savePDF, u as updateDocumentFieldValue, a as getRoleIndex, r as renderDocumentField, b as getFieldId } from './utils-3d95c588.js';
 import { g as getEnvelopeById, s as state } from './Envelopes-6982dfc6.js';
 import { S as SDKError } from './errors-9b5498c8.js';
 import './Token-54690789.js';

package/dist/esm/{verdocs-field-signature_3.entry.js → verdocs-signature-dialog.entry.js}

@@ -1,68 +1,4 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-f78d163d.js';
-import { g as getRGBA } from './Colors-1b298092.js';
-import { g as getFieldSettings } from './utils-188fa107.js';
-import { c as createPopper } from './popper-f860750c.js';
-import './Envelopes-130fd6ea.js';
-import './Token-54690789.js';
-import './Files-70a192df.js';
-
-const verdocsFieldSignatureCss = "verdocs-field-signature{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;width:83px;height:36px;display:block;font-size:11px;position:relative;letter-spacing:0.3px;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left;border:1px solid rgba(0, 0, 0, 0.2)}verdocs-field-signature.disabled{opacity:0.5}verdocs-field-signature.done{border:none;opacity:1}verdocs-field-signature img{display:block;max-width:100%;max-height:100%}verdocs-field-signature button{-webkit-box-sizing:border-box;box-sizing:border-box;border:none;color:rgba(0, 0, 0, 0.87);font-weight:500;-webkit-transform-origin:0 0;transform-origin:0 0;height:100%;width:100%;background:none;font-size:11px}verdocs-field-signature button.hide{display:none}verdocs-field-signature.required{border:1px solid #cc0000}verdocs-field-signature.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}verdocs-field-signature verdocs-button-panel{top:-3px;left:-2px;opacity:0.5;z-index:1000;cursor:pointer;position:absolute;-webkit-transform:scale(0.6);transform:scale(0.6)}verdocs-field-signature verdocs-button-panel[data-active],verdocs-field-signature verdocs-button-panel:hover{opacity:1}verdocs-field-signature verdocs-button-panel .icon svg{fill:#333333}verdocs-field-signature verdocs-button-panel .icon:hover svg{fill:#000000}";
-
-const settingsIcon = '<svg xmlns="http://www.w3.org/2000/svg" height="20" width="20"><path d="m7.5 18.5-.312-2.667q-.188-.125-.396-.25-.209-.125-.396-.229l-2.479 1.063-2.521-4.334 2.125-1.625q.021-.104.021-.229v-.458q0-.125-.021-.229L1.396 7.917l2.521-4.313 2.5 1.042q.166-.104.375-.229.208-.125.396-.229L7.5 1.5h5l.312 2.688q.188.104.396.229.209.125.396.229l2.479-1.042 2.521 4.313-2.125 1.625v.916l2.125 1.625-2.521 4.334-2.5-1.063q-.166.104-.375.229-.208.125-.396.25L12.5 18.5Zm2.479-5.521q1.229 0 2.104-.875T12.958 10q0-1.229-.875-2.104t-2.104-.875q-1.208 0-2.094.875Q7 8.771 7 10t.885 2.104q.886.875 2.094.875Zm0-1.75q-.5 0-.864-.364Q8.75 10.5 8.75 10t.365-.865q.364-.364.864-.364t.865.364q.364.365.364.865t-.364.865q-.365.364-.865.364ZM10.021 10Zm-.792 6.521h1.542l.25-2.146q.625-.167 1.198-.51.573-.344 1.031-.823l2.021.854.771-1.271-1.771-1.354q.104-.292.156-.615.052-.323.052-.656 0-.292-.052-.604-.052-.313-.135-.646l1.77-1.375-.77-1.271-2.021.875q-.479-.5-1.042-.833-.562-.334-1.187-.5l-.271-2.167H9.208l-.25 2.167q-.625.166-1.187.5-.563.333-1.042.812l-2-.854-.771 1.271 1.73 1.354q-.084.333-.136.656Q5.5 9.708 5.5 10t.052.604q.052.313.136.667l-1.73 1.354.771 1.271 2-.834q.479.459 1.042.792.562.334 1.187.5Z"/></svg>';
-const VerdocsFieldSignature = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.fieldChange = createEvent(this, "fieldChange", 7);
-    this.settingsPress = createEvent(this, "settingsPress", 7);
-    this.field = null;
-    this.name = '';
-    this.disabled = false;
-    this.editable = false;
-    this.moveable = false;
-    this.done = false;
-    this.roleindex = 0;
-    this.tempSignature = '';
-  }
-  async focusField() {
-    this.handleShow();
-    console.log('focused', this);
-  }
-  hideDialog() {
-    var _a;
-    (_a = this.dialog) === null || _a === void 0 ? void 0 : _a.remove();
-    this.dialog = null;
-  }
-  handleAdopt(e) {
-    var _a;
-    console.log('[SIGNATURE] Adopted signature');
-    this.tempSignature = e.detail;
-    (_a = this.fieldChange) === null || _a === void 0 ? void 0 : _a.emit(this.tempSignature);
-    this.hideDialog();
-  }
-  handleShow() {
-    this.dialog = document.createElement('verdocs-signature-dialog');
-    this.dialog.setAttribute('name', this.name);
-    this.dialog.setAttribute('roleindex', this.roleindex);
-    this.dialog.addEventListener('cancel', () => this.hideDialog());
-    this.dialog.addEventListener('next', e => this.handleAdopt(e));
-    document.body.append(this.dialog);
-  }
-  render() {
-    var _a, _b, _c;
-    const settings = getFieldSettings(this.field);
-    const value = settings.base64 || this.tempSignature;
-    const disabled = (_b = (_a = this.disabled) !== null && _a !== void 0 ? _a : settings.disabled) !== null && _b !== void 0 ? _b : false;
-    const backgroundColor = this.field['rgba'] || getRGBA(this.roleindex);
-    if (this.done) {
-      return h(Host, { class: { done: this.done } }, value && h("img", { src: value, alt: "Signature" }));
-    }
-    return (h(Host, { class: { required: (_c = this.field) === null || _c === void 0 ? void 0 : _c.required, disabled }, style: { backgroundColor } }, value ? h("img", { src: value, alt: "Signature" }) : h("button", { onClick: () => !disabled && this.handleShow() }, "Signature"), this.editable && (h("verdocs-button-panel", { icon: settingsIcon }, h("h6", null, "Field Settings"), h("form", null, h("verdocs-select-input", { label: "Recipient", options: [
-        { label: 'Buyer', value: 'Buyer' },
-        { label: 'Seller', value: 'Seller' },
-      ] }), h("verdocs-text-input", { label: "Field Name", value: "", placeholder: "Stored field name...", onInput: e => console.log('ipt', e) }), h("verdocs-text-input", { label: "Placeholder", value: "", placeholder: "Placeholder text...", onInput: e => console.log('ipt', e) }))))));
-  }
-};
-VerdocsFieldSignature.style = verdocsFieldSignatureCss;
 
 const verdocsSignatureDialogCss = "verdocs-signature-dialog{font-family:\"Barlow\", sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box;position:fixed;z-index:10000;top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background:#0000007f}verdocs-signature-dialog .dialog{width:100%;max-width:340px;border-radius:4px;overflow:hidden;-webkit-box-shadow:3px 3px 5px 1px rgba(40, 40, 40, 0.4);box-shadow:3px 3px 5px 1px rgba(40, 40, 40, 0.4);background:#f9f9f9}verdocs-signature-dialog .heading{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;padding:20px 20px 0 20px;line-height:28px;font-size:20px;font-weight:500}verdocs-signature-dialog .content{font-size:14px;padding:20px}verdocs-signature-dialog .buttons{display:-ms-flexbox;display:flex;margin:20px 0 0 0;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end;-ms-flex-align:center;align-items:center}verdocs-signature-dialog .buttons verdocs-button{margin-left:16px}verdocs-signature-dialog canvas{background:#ffffff;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0 auto;width:300px;height:79px;max-width:100%;-webkit-box-shadow:0 0 6px 0 #0000001f;box-shadow:0 0 6px 0 #0000001f}verdocs-signature-dialog .disclaimer{text-align:justify;padding:8px 0;font-size:11px;line-height:14px;color:rgba(0, 0, 0, 0.54)}verdocs-signature-dialog .as-shown{font-size:11px;margin:4px 0 20px 4px;color:rgba(0, 0, 0, 0.54)}verdocs-signature-dialog .tabs{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}verdocs-signature-dialog .tabs .tab{padding:8px 15px;cursor:pointer}verdocs-signature-dialog .tabs .tab.active{border-bottom:2px solid #cccccc}verdocs-signature-dialog .tabs .tab:hover{color:#55bc81}";
 
@@ -284,43 +220,4 @@ const VerdocsSignatureDialog = class {
 };
 VerdocsSignatureDialog.style = verdocsSignatureDialogCss;
 
-const verdocsToolbarIconCss = "verdocs-toolbar-icon{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;display:inline-block}verdocs-toolbar-icon .icon{display:inline-block;cursor:pointer}verdocs-toolbar-icon .icon svg{fill:#5c6575}verdocs-toolbar-icon .tooltip{display:none;-webkit-box-shadow:0 0 10px 1px #999999;box-shadow:0 0 10px 1px #999999;background:#ffffff;color:#33364b;max-width:240px;font-weight:bold;padding:5px 10px;font-size:13px;position:relative;border-radius:4px;z-index:10000}verdocs-toolbar-icon .tooltip .arrow,verdocs-toolbar-icon .tooltip .arrow::before{position:absolute;width:8px;height:8px;background:inherit}verdocs-toolbar-icon .tooltip .arrow{visibility:hidden;top:-4px}verdocs-toolbar-icon .tooltip .arrow::before{visibility:visible;content:\"\";-webkit-transform:rotate(45deg);transform:rotate(45deg)}verdocs-toolbar-icon .tooltip[data-show]{display:block}verdocs-toolbar-icon .tooltip[data-popper-placement^=top]>.arrow{bottom:-4px}verdocs-toolbar-icon .tooltip[data-popper-placement^=bottom]>.arrow{top:-4px}verdocs-toolbar-icon .tooltip[data-popper-placement^=left]>.arrow{right:-4px}verdocs-toolbar-icon .tooltip[data-popper-placement^=right]>.arrow{left:-4px}";
-
-const VerdocsToolbarIcon = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.text = '';
-    this.icon = '';
-    this.containerId = `verdocs-toolbar-icon-${Math.random().toString(36).substring(2, 11)}`;
-  }
-  componentDidLoad() {
-    this.popperInstance = createPopper(this.iconEl, this.tooltip, {
-    // placement: 'top-end',
-    // modifiers: [{name: 'offset', options: {offset: [0, 10]}}],
-    });
-  }
-  disconnectedCallback() {
-    if (this.popperInstance) {
-      this.popperInstance.destroy();
-      this.popperInstance = null;
-    }
-  }
-  show() {
-    var _a, _b;
-    (_a = this.tooltip) === null || _a === void 0 ? void 0 : _a.setAttribute('data-show', '');
-    (_b = this.popperInstance) === null || _b === void 0 ? void 0 : _b.update().catch(() => { });
-  }
-  hide() {
-    var _a;
-    (_a = this.tooltip) === null || _a === void 0 ? void 0 : _a.removeAttribute('data-show');
-  }
-  // handlePress() {
-  //   this.press?.emit();
-  // }
-  render() {
-    return (h(Host, { class: {} }, h("div", { "aria-describedby": this.containerId, class: "icon", innerHTML: this.icon, onMouseEnter: () => this.show(), onFocus: () => this.show(), onMouseLeave: () => this.hide(), onBlur: () => this.hide(), ref: el => (this.iconEl = el) }), h("div", { id: this.containerId, role: "tooltip", class: "tooltip", "data-popper-placement": "bottom", ref: el => (this.tooltip = el) }, this.text, h("div", { "data-popper-arrow": "true", class: "arrow" }))));
-  }
-};
-VerdocsToolbarIcon.style = verdocsToolbarIconCss;
-
-export { VerdocsFieldSignature as verdocs_field_signature, VerdocsSignatureDialog as verdocs_signature_dialog, VerdocsToolbarIcon as verdocs_toolbar_icon };
+export { VerdocsSignatureDialog as verdocs_signature_dialog };