@verdocs/web-sdk 1.10.1 → 1.10.4

package/dist/components/verdocs-field-textarea.js

@@ -1,8 +1,14 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+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$4 } from './verdocs-button-panel2.js';
-import { d as defineCustomElement$3 } from './verdocs-select-input2.js';
+import { s as state } from './templateStore.js';
+import { d as defineCustomElement$9 } from './verdocs-button2.js';
+import { d as defineCustomElement$8 } from './verdocs-button-panel2.js';
+import { d as defineCustomElement$7 } from './verdocs-checkbox2.js';
+import { d as defineCustomElement$6 } from './verdocs-component-error2.js';
+import { d as defineCustomElement$5 } from './verdocs-help-icon2.js';
+import { d as defineCustomElement$4 } from './verdocs-select-input2.js';
+import { d as defineCustomElement$3 } from './verdocs-template-field-properties2.js';
 import { d as defineCustomElement$2 } from './verdocs-text-input2.js';
 
 const verdocsFieldTextareaCss = "verdocs-field-textarea{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;width:150px;height:15px;display:block;font-size:11px;position:relative;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left}verdocs-field-textarea.disabled{opacity:0.5}verdocs-field-textarea textarea{-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%;background:none;font-size:11px;border:1px solid rgba(0, 0, 0, 0.2)}verdocs-field-textarea textarea.hide{display:none}verdocs-field-textarea.required{border:1px solid #cc0000}verdocs-field-textarea.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}";
@@ -12,6 +18,7 @@ const VerdocsFieldTextarea$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
   constructor() {
     super();
     this.__registerHost();
+    this.settingsChanged = createEvent(this, "settingsChanged", 7);
     this.field = null;
     this.disabled = false;
     this.editable = false;
@@ -22,6 +29,19 @@ const VerdocsFieldTextarea$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
   async focusField() {
     this.el.focus();
   }
+  async showSettingsPanel() {
+    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.field.name}`);
+    if (settingsPanel && settingsPanel.showPanel) {
+      settingsPanel.showPanel();
+    }
+  }
+  async hideSettingsPanel() {
+    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.field.name}`);
+    if (settingsPanel && settingsPanel.hidePanel) {
+      settingsPanel.hidePanel();
+    }
+    state.updateCount++;
+  }
   render() {
     var _a, _b;
     const settings = getFieldSettings(this.field);
@@ -30,12 +50,11 @@ const VerdocsFieldTextarea$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
     if (this.done) {
       return h(Host, { class: { done: this.done } }, settings.value);
     }
-    return (h(Host, { class: { required: settings.required, disabled }, style: { backgroundColor } }, h("textarea", { placeholder: settings.placeholder || '', tabIndex: settings.order, value: settings.value, disabled: disabled, required: settings.required, ref: el => (this.el = el) }), 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' },
-      ], onChange: e => {
-        console.log('select changed', e);
-      } }), 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) }))))));
+    return (h(Host, { class: { required: settings.required, disabled }, style: { backgroundColor } }, h("textarea", { placeholder: settings.placeholder || '', tabIndex: settings.order, value: settings.value, disabled: disabled, required: settings.required, ref: el => (this.el = el) }), this.editable && (h("verdocs-button-panel", { icon: settingsIcon, id: `verdocs-settings-panel-${this.field.name}` }, h("h6", null, "Field Settings"), h("verdocs-template-field-properties", { templateId: state.templateId, fieldName: this.field.name, onClose: () => this.hideSettingsPanel(), onSettingsChanged: e => {
+        var _a;
+        (_a = this.settingsChanged) === null || _a === void 0 ? void 0 : _a.emit(e.detail);
+        return this.hideSettingsPanel();
+      } })))));
   }
   static get style() { return verdocsFieldTextareaCss; }
 }, [0, "verdocs-field-textarea", {
@@ -45,25 +64,52 @@ const VerdocsFieldTextarea$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
     "moveable": [4],
     "done": [4],
     "roleindex": [2],
-    "focusField": [64]
+    "focusField": [64],
+    "showSettingsPanel": [64],
+    "hideSettingsPanel": [64]
   }]);
 function defineCustomElement$1() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["verdocs-field-textarea", "verdocs-button-panel", "verdocs-select-input", "verdocs-text-input"];
+  const components = ["verdocs-field-textarea", "verdocs-button", "verdocs-button-panel", "verdocs-checkbox", "verdocs-component-error", "verdocs-help-icon", "verdocs-select-input", "verdocs-template-field-properties", "verdocs-text-input"];
   components.forEach(tagName => { switch (tagName) {
     case "verdocs-field-textarea":
       if (!customElements.get(tagName)) {
         customElements.define(tagName, VerdocsFieldTextarea$1);
       }
       break;
+    case "verdocs-button":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$9();
+      }
+      break;
     case "verdocs-button-panel":
       if (!customElements.get(tagName)) {
-        defineCustomElement$4();
+        defineCustomElement$8();
+      }
+      break;
+    case "verdocs-checkbox":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$7();
+      }
+      break;
+    case "verdocs-component-error":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$6();
+      }
+      break;
+    case "verdocs-help-icon":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$5();
       }
       break;
     case "verdocs-select-input":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$4();
+      }
+      break;
+    case "verdocs-template-field-properties":
       if (!customElements.get(tagName)) {
         defineCustomElement$3();
       }

package/dist/components/verdocs-field-textbox.js

@@ -2,8 +2,13 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/
 import { g as getRGBA } from './Colors.js';
 import { s as state } from './templateStore.js';
 import { g as getFieldSettings } from './utils.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$9 } from './verdocs-button2.js';
+import { d as defineCustomElement$8 } from './verdocs-button-panel2.js';
+import { d as defineCustomElement$7 } from './verdocs-checkbox2.js';
+import { d as defineCustomElement$6 } from './verdocs-component-error2.js';
+import { d as defineCustomElement$5 } from './verdocs-help-icon2.js';
+import { d as defineCustomElement$4 } from './verdocs-select-input2.js';
+import { d as defineCustomElement$3 } from './verdocs-template-field-properties2.js';
 import { d as defineCustomElement$2 } from './verdocs-text-input2.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;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}";
@@ -13,7 +18,7 @@ const VerdocsFieldTextbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTM
   constructor() {
     super();
     this.__registerHost();
-    this.recipientChanged = createEvent(this, "recipientChanged", 7);
+    this.settingsChanged = createEvent(this, "settingsChanged", 7);
     this.field = null;
     this.disabled = false;
     this.editable = false;
@@ -24,9 +29,18 @@ const VerdocsFieldTextbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTM
   async focusField() {
     this.el.focus();
   }
-  handleChangeRecipient(e) {
-    var _a;
-    (_a = this.recipientChanged) === null || _a === void 0 ? void 0 : _a.emit(e.detail);
+  async showSettingsPanel() {
+    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.field.name}`);
+    if (settingsPanel && settingsPanel.showPanel) {
+      settingsPanel.showPanel();
+    }
+  }
+  async hideSettingsPanel() {
+    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.field.name}`);
+    if (settingsPanel && settingsPanel.hidePanel) {
+      settingsPanel.hidePanel();
+    }
+    state.updateCount++;
   }
   render() {
     var _a, _b, _c, _d;
@@ -37,13 +51,11 @@ const VerdocsFieldTextbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTM
     if (this.done) {
       return h(Host, { class: { done: this.done } }, value);
     }
-    return (h(Host, { class: { required: (_c = this.field) === null || _c === void 0 ? void 0 : _c.required, disabled, done: this.done }, style: { backgroundColor } }, h("input", { type: "text", placeholder: settings === null || settings === void 0 ? void 0 : settings.placeholder, tabIndex: settings === null || settings === void 0 ? void 0 : settings.order, value: value, disabled: disabled, required: (_d = this.field) === null || _d === void 0 ? void 0 : _d.required, ref: el => (this.el = el) }), this.editable && (h("verdocs-button-panel", { icon: settingsIcon }, h("h6", null, "Field Settings"), h("form", null, h("verdocs-select-input", { label: "Recipient", value: state.roleNames[this.roleindex], options: state.roleNames.map(role => ({ label: role, value: role })), onChange: e => this.handleChangeRecipient(e) }), h("verdocs-text-input", { label: "Field Name", value: "", placeholder: "Stored field name...", onInput: e => {
-        e.stopPropagation();
-        console.log('ipt', e);
-      } }), h("verdocs-text-input", { label: "Placeholder", value: "", placeholder: "Placeholder text...", onInput: e => {
-        e.stopPropagation();
-        console.log('ipt', e);
-      } }))))));
+    return (h(Host, { class: { required: (_c = this.field) === null || _c === void 0 ? void 0 : _c.required, disabled, done: this.done }, style: { backgroundColor } }, h("input", { type: "text", placeholder: settings === null || settings === void 0 ? void 0 : settings.placeholder, tabIndex: settings === null || settings === void 0 ? void 0 : settings.order, value: value, disabled: disabled, required: (_d = this.field) === null || _d === void 0 ? void 0 : _d.required, ref: el => (this.el = el) }), this.editable && (h("verdocs-button-panel", { icon: settingsIcon, id: `verdocs-settings-panel-${this.field.name}` }, h("h6", null, "Field Settings"), h("verdocs-template-field-properties", { templateId: state.templateId, fieldName: this.field.name, onClose: () => this.hideSettingsPanel(), onSettingsChanged: e => {
+        var _a;
+        (_a = this.settingsChanged) === null || _a === void 0 ? void 0 : _a.emit(e.detail);
+        return this.hideSettingsPanel();
+      } })))));
   }
   static get style() { return verdocsFieldTextboxCss; }
 }, [0, "verdocs-field-textbox", {
@@ -53,25 +65,52 @@ const VerdocsFieldTextbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTM
     "moveable": [4],
     "done": [4],
     "roleindex": [2],
-    "focusField": [64]
+    "focusField": [64],
+    "showSettingsPanel": [64],
+    "hideSettingsPanel": [64]
   }]);
 function defineCustomElement$1() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["verdocs-field-textbox", "verdocs-button-panel", "verdocs-select-input", "verdocs-text-input"];
+  const components = ["verdocs-field-textbox", "verdocs-button", "verdocs-button-panel", "verdocs-checkbox", "verdocs-component-error", "verdocs-help-icon", "verdocs-select-input", "verdocs-template-field-properties", "verdocs-text-input"];
   components.forEach(tagName => { switch (tagName) {
     case "verdocs-field-textbox":
       if (!customElements.get(tagName)) {
         customElements.define(tagName, VerdocsFieldTextbox$1);
       }
       break;
+    case "verdocs-button":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$9();
+      }
+      break;
     case "verdocs-button-panel":
       if (!customElements.get(tagName)) {
-        defineCustomElement$4();
+        defineCustomElement$8();
+      }
+      break;
+    case "verdocs-checkbox":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$7();
+      }
+      break;
+    case "verdocs-component-error":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$6();
+      }
+      break;
+    case "verdocs-help-icon":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$5();
       }
       break;
     case "verdocs-select-input":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$4();
+      }
+      break;
+    case "verdocs-template-field-properties":
       if (!customElements.get(tagName)) {
         defineCustomElement$3();
       }

package/dist/components/verdocs-field-timestamp.js

@@ -1,8 +1,14 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+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$4 } from './verdocs-button-panel2.js';
-import { d as defineCustomElement$3 } from './verdocs-select-input2.js';
+import { s as state } from './templateStore.js';
+import { d as defineCustomElement$9 } from './verdocs-button2.js';
+import { d as defineCustomElement$8 } from './verdocs-button-panel2.js';
+import { d as defineCustomElement$7 } from './verdocs-checkbox2.js';
+import { d as defineCustomElement$6 } from './verdocs-component-error2.js';
+import { d as defineCustomElement$5 } from './verdocs-help-icon2.js';
+import { d as defineCustomElement$4 } from './verdocs-select-input2.js';
+import { d as defineCustomElement$3 } from './verdocs-template-field-properties2.js';
 import { d as defineCustomElement$2 } from './verdocs-text-input2.js';
 import { f as format } from './index2.js';
 
@@ -13,6 +19,7 @@ const VerdocsFieldTimestamp$1 = /*@__PURE__*/ proxyCustomElement(class extends H
   constructor() {
     super();
     this.__registerHost();
+    this.settingsChanged = createEvent(this, "settingsChanged", 7);
     this.field = null;
     this.disabled = false;
     this.editable = false;
@@ -23,6 +30,19 @@ const VerdocsFieldTimestamp$1 = /*@__PURE__*/ proxyCustomElement(class extends H
   async focusField() {
     this.el.focus();
   }
+  async showSettingsPanel() {
+    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.field.name}`);
+    if (settingsPanel && settingsPanel.showPanel) {
+      settingsPanel.showPanel();
+    }
+  }
+  async hideSettingsPanel() {
+    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.field.name}`);
+    if (settingsPanel && settingsPanel.hidePanel) {
+      settingsPanel.hidePanel();
+    }
+    state.updateCount++;
+  }
   render() {
     var _a, _b, _c;
     const settings = getFieldSettings(this.field);
@@ -37,10 +57,11 @@ const VerdocsFieldTimestamp$1 = /*@__PURE__*/ proxyCustomElement(class extends H
     return (h(Host, { class: { required: (_c = this.field) === null || _c === void 0 ? void 0 : _c.required, disabled }, style: { backgroundColor } }, h("input", { type: "text", placeholder: settings === null || settings === void 0 ? void 0 : settings.placeholder, tabIndex: settings === null || settings === void 0 ? void 0 : settings.order,
       // TODO: It would really make more sense to show the date and time but the default width of 64px for this field
       // is encoded in a ton of existing entries in the database and is hard to change.
-      value: formatted, disabled: true, ref: el => (this.el = el) }), 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) }))))));
+      value: formatted, disabled: true, ref: el => (this.el = el) }), this.editable && (h("verdocs-button-panel", { icon: settingsIcon, id: `verdocs-settings-panel-${this.field.name}` }, h("h6", null, "Field Settings"), h("verdocs-template-field-properties", { templateId: state.templateId, fieldName: this.field.name, onClose: () => this.hideSettingsPanel(), onSettingsChanged: e => {
+        var _a;
+        (_a = this.settingsChanged) === null || _a === void 0 ? void 0 : _a.emit(e.detail);
+        return this.hideSettingsPanel();
+      } })))));
   }
   static get style() { return verdocsFieldTimestampCss; }
 }, [0, "verdocs-field-timestamp", {
@@ -50,25 +71,52 @@ const VerdocsFieldTimestamp$1 = /*@__PURE__*/ proxyCustomElement(class extends H
     "moveable": [4],
     "done": [4],
     "roleindex": [2],
-    "focusField": [64]
+    "focusField": [64],
+    "showSettingsPanel": [64],
+    "hideSettingsPanel": [64]
   }]);
 function defineCustomElement$1() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["verdocs-field-timestamp", "verdocs-button-panel", "verdocs-select-input", "verdocs-text-input"];
+  const components = ["verdocs-field-timestamp", "verdocs-button", "verdocs-button-panel", "verdocs-checkbox", "verdocs-component-error", "verdocs-help-icon", "verdocs-select-input", "verdocs-template-field-properties", "verdocs-text-input"];
   components.forEach(tagName => { switch (tagName) {
     case "verdocs-field-timestamp":
       if (!customElements.get(tagName)) {
         customElements.define(tagName, VerdocsFieldTimestamp$1);
       }
       break;
+    case "verdocs-button":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$9();
+      }
+      break;
     case "verdocs-button-panel":
       if (!customElements.get(tagName)) {
-        defineCustomElement$4();
+        defineCustomElement$8();
+      }
+      break;
+    case "verdocs-checkbox":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$7();
+      }
+      break;
+    case "verdocs-component-error":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$6();
+      }
+      break;
+    case "verdocs-help-icon":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$5();
       }
       break;
     case "verdocs-select-input":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$4();
+      }
+      break;
+    case "verdocs-template-field-properties":
       if (!customElements.get(tagName)) {
         defineCustomElement$3();
       }

package/dist/components/verdocs-help-icon2.js

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { c as createPopper } from './popper.js';
 
-const verdocsHelpIconCss = "verdocs-help-icon{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;display:inline-block}verdocs-help-icon .icon{display:inline-block}verdocs-help-icon .icon svg{fill:#5c6575}verdocs-help-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;position:relative;padding:5px 10px;font-size:13px;border-radius:4px;z-index:10000}verdocs-help-icon .tooltip .arrow,verdocs-help-icon .tooltip .arrow::before{position:absolute;width:8px;height:8px;background:inherit}verdocs-help-icon .tooltip .arrow{visibility:hidden;top:-4px}verdocs-help-icon .tooltip .arrow::before{visibility:visible;content:\"\";-webkit-transform:rotate(45deg);transform:rotate(45deg)}verdocs-help-icon .tooltip[data-show]{display:block}verdocs-help-icon .tooltip[data-popper-placement^=top]>.arrow{bottom:-4px}verdocs-help-icon .tooltip[data-popper-placement^=bottom]>.arrow{top:-4px}verdocs-help-icon .tooltip[data-popper-placement^=left]>.arrow{right:-4px}verdocs-help-icon .tooltip[data-popper-placement^=right]>.arrow{left:-4px}";
+const verdocsHelpIconCss = "verdocs-help-icon{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;display:inline-block;opacity:0.3}verdocs-help-icon:hover{opacity:1}verdocs-help-icon .icon{display:inline-block}verdocs-help-icon .icon svg{fill:#5c6575}verdocs-help-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;position:relative;padding:5px 10px;font-size:13px;border-radius:4px;z-index:10000}verdocs-help-icon .tooltip .arrow,verdocs-help-icon .tooltip .arrow::before{position:absolute;width:8px;height:8px;background:inherit}verdocs-help-icon .tooltip .arrow{visibility:hidden;top:-4px}verdocs-help-icon .tooltip .arrow::before{visibility:visible;content:\"\";-webkit-transform:rotate(45deg);transform:rotate(45deg)}verdocs-help-icon .tooltip[data-show]{display:block}verdocs-help-icon .tooltip[data-popper-placement^=top]>.arrow{bottom:-4px}verdocs-help-icon .tooltip[data-popper-placement^=bottom]>.arrow{top:-4px}verdocs-help-icon .tooltip[data-popper-placement^=left]>.arrow{right:-4px}verdocs-help-icon .tooltip[data-popper-placement^=right]>.arrow{left:-4px}";
 
 const helpIcon = '<svg xmlns="http://www.w3.org/2000/svg" height="24" width="24"><path d="M11.925 18q.55 0 .938-.387.387-.388.387-.938 0-.55-.387-.925-.388-.375-.938-.375-.55 0-.925.375t-.375.925q0 .55.375.938.375.387.925.387Zm-.95-3.85h1.95q0-.8.2-1.287.2-.488 1.025-1.288.65-.625 1.025-1.213.375-.587.375-1.437 0-1.425-1.025-2.175Q13.5 6 12.1 6q-1.425 0-2.35.775t-1.275 1.85l1.775.7q.125-.45.55-.975.425-.525 1.275-.525.725 0 1.1.412.375.413.375.888 0 .475-.287.9-.288.425-.713.775-1.075.95-1.325 1.475-.25.525-.25 1.875ZM12 22.2q-2.125 0-3.988-.8-1.862-.8-3.237-2.175Q3.4 17.85 2.6 15.988 1.8 14.125 1.8 12t.8-3.988q.8-1.862 2.175-3.237Q6.15 3.4 8.012 2.6 9.875 1.8 12 1.8t3.988.8q1.862.8 3.237 2.175Q20.6 6.15 21.4 8.012q.8 1.863.8 3.988t-.8 3.988q-.8 1.862-2.175 3.237Q17.85 20.6 15.988 21.4q-1.863.8-3.988.8Zm0-2.275q3.325 0 5.625-2.3t2.3-5.625q0-3.325-2.3-5.625T12 4.075q-3.325 0-5.625 2.3T4.075 12q0 3.325 2.3 5.625t5.625 2.3ZM12 12Z"/></svg>';
 const VerdocsHelpIcon = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {

package/dist/components/verdocs-initial-dialog2.js

@@ -1,5 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { d as defineCustomElement$2 } from './verdocs-button2.js';
+import { d as defineCustomElement$3 } from './verdocs-button2.js';
+import { d as defineCustomElement$2 } from './verdocs-help-icon2.js';
 import { d as defineCustomElement$1 } from './verdocs-text-input2.js';
 
 const verdocsInitialDialogCss = "verdocs-initial-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-initial-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-initial-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-initial-dialog .content{font-size:14px;padding:20px}verdocs-initial-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-initial-dialog .buttons verdocs-button{margin-left:16px}verdocs-initial-dialog canvas{background:#fff;-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-initial-dialog .disclaimer{text-align:justify;padding:8px 0;font-size:11px;line-height:14px;color:rgba(0, 0, 0, 0.54)}verdocs-initial-dialog .as-shown{font-size:11px;margin:4px 0 20px 4px;color:rgba(0, 0, 0, 0.54)}verdocs-initial-dialog .tabs{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}verdocs-initial-dialog .tabs .tab{padding:8px 15px;cursor:pointer}verdocs-initial-dialog .tabs .tab.active{border-bottom:2px solid #cccccc}verdocs-initial-dialog .tabs .tab:hover{color:#55bc81}";
@@ -231,7 +232,7 @@ function defineCustomElement() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["verdocs-initial-dialog", "verdocs-button", "verdocs-text-input"];
+  const components = ["verdocs-initial-dialog", "verdocs-button", "verdocs-help-icon", "verdocs-text-input"];
   components.forEach(tagName => { switch (tagName) {
     case "verdocs-initial-dialog":
       if (!customElements.get(tagName)) {
@@ -239,6 +240,11 @@ function defineCustomElement() {
       }
       break;
     case "verdocs-button":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$3();
+      }
+      break;
+    case "verdocs-help-icon":
       if (!customElements.get(tagName)) {
         defineCustomElement$2();
       }

package/dist/components/verdocs-preview.js

@@ -1,5 +1,4 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import './Types.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint.js';
 import { r as renderDocumentField, a as getRoleIndex } from './utils.js';
 import { s as state } from './templateStore.js';

package/dist/components/verdocs-quick-functions2.js

@@ -1,5 +1,4 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import './Types.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint.js';
 
 const verdocsQuickFunctionsCss = "verdocs-quick-functions{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-quick-functions .container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap;width:240px;background-color:#1e2031;text-transform:uppercase;padding:10px 10px 20px 10px;font-family:sans-serif;color:#ffffff}verdocs-quick-functions .title{font-size:22px;font-weight:700;line-height:30px;margin:1em 0 40px 0}verdocs-quick-functions button{width:140px;height:40px;border:none;display:-ms-flexbox;display:flex;color:#ffffff;cursor:pointer;font-size:14px;font-weight:700;line-height:25px;-ms-flex-align:center;align-items:center;margin-bottom:20px;border-radius:5px;text-transform:uppercase;-ms-flex-pack:space-evenly;justify-content:space-evenly;background-color:#55bc81}verdocs-quick-functions button svg{fill:#ffffff}";

package/dist/components/verdocs-search-activity2.js

@@ -1,6 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
 import { a as getTemplates } from './Templates2.js';
-import './Types.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint.js';
 
 /**

package/dist/components/verdocs-search-box2.js

@@ -1,5 +1,4 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import './Types.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint.js';
 
 const verdocsSearchBoxCss = "verdocs-search-box{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-search-box form{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;height:45px;-webkit-box-sizing:border-box;box-sizing:border-box;margin:5px 0 0;border-radius:5px;-ms-flex-align:center;align-items:center;background-color:#fff;padding:0 8px;border-width:1px;border-style:solid;border-color:#707ae5}verdocs-search-box form input{-webkit-box-sizing:border-box;box-sizing:border-box;height:43px;width:100%;font-size:18px;border:none}verdocs-search-box form input:focus{outline:none}verdocs-search-box form button.search{cursor:pointer;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:4px;border:none;width:100px;height:28px;font-weight:700;font-size:10px;letter-spacing:1px;background-color:#55bc81;text-transform:uppercase;color:#fff}verdocs-search-box form .type{background-color:#707ae5;height:30px;display:-ms-inline-flexbox;display:inline-flex;padding:1px 0 2px 10px;font-size:13px;line-height:16px;border-radius:4px;-ms-flex-pack:center;justify-content:center;text-transform:uppercase;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;color:#fff;margin-right:10px}verdocs-search-box form .type button{border:none;color:#fff;margin:5px 0 0 8px;background:transparent}verdocs-search-box form svg{width:12px;height:12px;margin-right:6px}verdocs-search-box ::-webkit-input-placeholder{color:#aeb4bf}verdocs-search-box ::-moz-placeholder{color:#aeb4bf}verdocs-search-box :-ms-input-placeholder{color:#aeb4bf}verdocs-search-box ::-ms-input-placeholder{color:#aeb4bf}verdocs-search-box ::placeholder{color:#aeb4bf}";

package/dist/components/verdocs-search.js

@@ -1,5 +1,4 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import './Types.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint.js';
 import { d as defineCustomElement$4 } from './verdocs-quick-functions2.js';
 import { d as defineCustomElement$3 } from './verdocs-search-activity2.js';

package/dist/components/verdocs-select-input2.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 
-const verdocsSelectInputCss = "verdocs-select-input{font-family:\"Barlow\", sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0 0 10px 0;display:block}verdocs-select-input .input-element{-webkit-box-sizing:border-box;box-sizing:border-box;border:1px solid #707ae5;border-radius:4px;background:#ffffff;color:#000;width:100%;font-size:16px;height:28px;padding:4px 12px}verdocs-select-input .input-element::-webkit-input-placeholder{color:#aaaaaa;opacity:1}verdocs-select-input .input-element::-moz-placeholder{color:#aaaaaa;opacity:1}verdocs-select-input .input-element:-ms-input-placeholder{color:#aaaaaa;opacity:1}verdocs-select-input .input-element::-ms-input-placeholder{color:#aaaaaa;opacity:1}verdocs-select-input .input-element::placeholder{color:#aaaaaa;opacity:1}verdocs-select-input .input-element:focus{border:1px solid #7d88ff}verdocs-select-input .input-label{display:block;color:#555570;font-weight:700;font-size:14px;margin:0 0 4px 0}";
+const verdocsSelectInputCss = "verdocs-select-input{font-family:\"Barlow\", sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0 0 10px 0;display:block}verdocs-select-input .input-element{-webkit-box-sizing:border-box;box-sizing:border-box;border:1px solid #707ae5;border-radius:4px;background:#ffffff;color:#000;width:100%;font-size:16px;height:28px;padding:4px 8px}verdocs-select-input .input-element::-webkit-input-placeholder{color:#aaaaaa;opacity:1}verdocs-select-input .input-element::-moz-placeholder{color:#aaaaaa;opacity:1}verdocs-select-input .input-element:-ms-input-placeholder{color:#aaaaaa;opacity:1}verdocs-select-input .input-element::-ms-input-placeholder{color:#aaaaaa;opacity:1}verdocs-select-input .input-element::placeholder{color:#aaaaaa;opacity:1}verdocs-select-input .input-element:focus{border:1px solid #7d88ff}verdocs-select-input .input-label{display:block;color:#555570;font-weight:700;font-size:14px;margin:0 0 4px 0}";
 
 const VerdocsSelectInput = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {

package/dist/components/verdocs-send.js

@@ -1,9 +1,8 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { g as getTemplate } from './Templates2.js';
-import './Types.js';
+import { V as VerdocsEndpoint } from './VerdocsEndpoint.js';
 import { i as isValidEmail, a as isValidPhone } from './Validators.js';
 import { g as getRGBA } from './Colors.js';
-import { V as VerdocsEndpoint } from './VerdocsEndpoint.js';
 import { a as getRoleIndex } from './utils.js';
 import { d as defineCustomElement$4 } from './verdocs-button2.js';
 import { d as defineCustomElement$3 } from './verdocs-contact-picker2.js';
@@ -114,10 +113,10 @@ const VerdocsSend$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
       return isValidEmail(recipient.email) || isValidPhone(recipient.phone);
     }).length >= ((_c = this.template) === null || _c === void 0 ? void 0 : _c.roles.length);
     console.log('assigned', allRecipientsAssigned);
-    return (h(Host, { class: {} }, h("div", { class: "recipients" }, h("div", { class: "left-line" }), h("div", { class: `level level-start` }, this.getLevelIcon(-1), h("div", { class: "complete" }, "Send Document")), this.levels.map(level => (h("div", { class: `level level-${level}` }, this.getLevelIcon(level), this.rolesAtLevel[level].map(role => {
+    return (h(Host, { class: {} }, h("div", { class: "recipients" }, h("div", { class: "left-line" }), h("div", { class: `level level-start` }, this.getLevelIcon(-1), h("div", { class: "complete" }, "Send Envelope")), this.levels.map(level => (h("div", { class: `level level-${level}` }, this.getLevelIcon(level), this.rolesAtLevel[level].map(role => {
       var _a, _b, _c;
       return (h("div", { class: "recipient", style: { backgroundColor: getRGBA(getRoleIndex(roleNames, role.name)) }, onClick: e => this.handleClickRole(e, role) }, (_b = (_a = this.recipientsAssigned[role.id]) === null || _a === void 0 ? void 0 : _a.full_name) !== null && _b !== void 0 ? _b : role.name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-contact-picker", { onCancel: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: (_c = this.recipientsAssigned[role.id]) !== null && _c !== void 0 ? _c : role, onSearchContacts: e => console.log('Search', e.detail) }))));
-    })))), h("div", { class: `level level-done` }, this.getLevelIcon(this.levels.length), h("div", { class: "complete" }, "Document Complete"))), h("div", { class: "buttons" }, h("verdocs-button", { label: "Cancel", size: "small", variant: "outline", onClick: e => this.handleCancel(e) }), h("verdocs-button", { label: "Send", size: "small", disabled: !allRecipientsAssigned, onClick: e => this.handleSend(e) }))));
+    })))), h("div", { class: `level level-done` }, this.getLevelIcon(this.levels.length), h("div", { class: "complete" }, "Signing Complete"))), h("div", { class: "buttons" }, h("verdocs-button", { label: "Cancel", size: "small", variant: "outline", onClick: e => this.handleCancel(e) }), h("verdocs-button", { label: "Send", size: "small", disabled: !allRecipientsAssigned, onClick: e => this.handleSend(e) }))));
   }
   static get style() { return verdocsSendCss; }
 }, [0, "verdocs-send", {

package/dist/components/verdocs-sign.js

@@ -1,9 +1,8 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host, Fragment } from '@stencil/core/internal/client';
 import { g as getSigningSession, u as updateEnvelopeField, a as updateEnvelopeFieldSignature, b as updateEnvelopeFieldInitials } from './Envelopes2.js';
-import './Types.js';
+import { V as VerdocsEndpoint } from './VerdocsEndpoint.js';
 import { a as isValidPhone, i as isValidEmail } from './Validators.js';
 import { f as fullNameToInitials } from './Primitives.js';
-import { V as VerdocsEndpoint } from './VerdocsEndpoint.js';
 import { s as savePDF, u as updateDocumentFieldValue, a as getRoleIndex, r as renderDocumentField, b as getFieldId } from './utils.js';
 import { g as getEnvelopeById, s as state } from './Envelopes.js';
 import { S as SDKError } from './errors.js';

package/dist/components/verdocs-signature-dialog2.js

@@ -1,5 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { d as defineCustomElement$2 } from './verdocs-button2.js';
+import { d as defineCustomElement$3 } from './verdocs-button2.js';
+import { d as defineCustomElement$2 } from './verdocs-help-icon2.js';
 import { d as defineCustomElement$1 } from './verdocs-text-input2.js';
 
 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}";
@@ -231,7 +232,7 @@ function defineCustomElement() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["verdocs-signature-dialog", "verdocs-button", "verdocs-text-input"];
+  const components = ["verdocs-signature-dialog", "verdocs-button", "verdocs-help-icon", "verdocs-text-input"];
   components.forEach(tagName => { switch (tagName) {
     case "verdocs-signature-dialog":
       if (!customElements.get(tagName)) {
@@ -239,6 +240,11 @@ function defineCustomElement() {
       }
       break;
     case "verdocs-button":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$3();
+      }
+      break;
+    case "verdocs-help-icon":
       if (!customElements.get(tagName)) {
         defineCustomElement$2();
       }

package/dist/components/verdocs-template-attachments.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface VerdocsTemplateAttachments extends Components.VerdocsTemplateAttachments, HTMLElement {}
+export const VerdocsTemplateAttachments: {
+  prototype: VerdocsTemplateAttachments;
+  new (): VerdocsTemplateAttachments;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

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

@@ -0,0 +1,73 @@
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { V as VerdocsEndpoint } from './VerdocsEndpoint.js';
+import { s as state } from './templateStore.js';
+import { l as loadTemplate } from './Templates.js';
+import { S as SDKError } from './errors.js';
+import { d as defineCustomElement$2 } from './verdocs-loader2.js';
+
+const verdocsTemplateAttachmentsCss = "verdocs-template-attachments{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-template-attachments h5{font-size:16px;font-weight:bold;margin:0 0 10px 0;color:#4c56cb}verdocs-template-attachments .attachment{display:-ms-flexbox;display:flex;padding:5px 10px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;color:#33364b;border:1px solid #cccccc}verdocs-template-attachments svg{width:24px;height:24px;fill:#5c6575;margin:2px 10px 0 0}";
+
+const FileIcon = '<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24"><path d="M6 2c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6H6zm7 7V3.5L18.5 9H13z"></path></svg>';
+const VerdocsTemplateAttachments$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.close = createEvent(this, "close", 7);
+    this.sdkError = createEvent(this, "sdkError", 7);
+    this.endpoint = VerdocsEndpoint.getDefault();
+    this.templateId = '';
+    this.loading = true;
+  }
+  async componentWillLoad() {
+    var _a, _b, _c;
+    try {
+      this.endpoint.loadSession();
+      await loadTemplate(this.endpoint, this.templateId);
+      this.loading = false;
+    }
+    catch (e) {
+      console.log('[TEMPLATE NAME] Error loading template', e);
+      this.loading = false;
+      (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(new SDKError(e.message, (_b = e.response) === null || _b === void 0 ? void 0 : _b.status, (_c = e.response) === null || _c === void 0 ? void 0 : _c.data));
+    }
+  }
+  render() {
+    if (this.loading) {
+      return (h(Host, { class: "loading" }, h("verdocs-loader", null)));
+    }
+    // This is meant to be a companion for larger visual experiences so we just go blank on errors for now.
+    if (!this.endpoint.session || !state.template) {
+      return h(Host, { class: "empty" });
+    }
+    return (h(Host, null, h("h5", null, "Attachments"), state.template.template_documents.map(document => (h("div", { class: "attachment" }, h("span", { innerHTML: FileIcon }), document.name, " (", document.page_numbers, " page", document.page_numbers > 1 ? 's' : '', ")")))));
+  }
+  static get style() { return verdocsTemplateAttachmentsCss; }
+}, [0, "verdocs-template-attachments", {
+    "endpoint": [16],
+    "templateId": [1, "template-id"],
+    "loading": [32]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["verdocs-template-attachments", "verdocs-loader"];
+  components.forEach(tagName => { switch (tagName) {
+    case "verdocs-template-attachments":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, VerdocsTemplateAttachments$1);
+      }
+      break;
+    case "verdocs-loader":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const VerdocsTemplateAttachments = VerdocsTemplateAttachments$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { VerdocsTemplateAttachments, defineCustomElement };

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

@@ -1,6 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { c as createTemplate, g as getTemplate } from './Templates2.js';
-import './Types.js';
 import { V as VerdocsEndpoint } from './VerdocsEndpoint.js';
 import { S as SDKError } from './errors.js';
 import { d as defineCustomElement$2 } from './verdocs-button2.js';