@verdocs/web-sdk 4.2.121 → 4.2.122

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

@@ -10,7 +10,7 @@ const VerdocsSearchTabs$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSearch
         this.selected = 'all';
     }
     render() {
-        return h("div", { key: 'afc8ae06fa51a4aa236c12b7ed057e16112ce8a8' }, "\u00A0");
+        return h("div", { key: '476b2a3baba29b498e5d91a9866f8e1f5070b8c3' }, "\u00A0");
     }
     static get style() { return VerdocsSearchTabsStyle0; }
 }, [0, "verdocs-search-tabs", {

package/dist/components/verdocs-sign.js

@@ -15,7 +15,7 @@ import { d as defineCustomElement$4 } from './verdocs-portal2.js';
 import { d as defineCustomElement$3 } from './verdocs-spinner2.js';
 import { d as defineCustomElement$2 } from './verdocs-view2.js';
 
-const verdocsSignCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-sign{display:-ms-flexbox;display:flex;overflow:hidden;position:relative;min-height:600px;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-sign div{display:block;-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-sign input{vertical-align:top}verdocs-sign>.document{-ms-flex:1;flex:1;width:100%;height:100%;-ms-flex-item-align:center;align-self:center;display:-ms-flexbox;display:flex;padding:15px;row-gap:15px;max-width:1200px;min-height:200px;position:relative;overflow-y:scroll;-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-direction:column;flex-direction:column}verdocs-sign>.document .inner{width:100%;max-width:1028px}verdocs-sign .cover{top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;z-index:5000;position:absolute;padding-top:100px;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;background:rgba(0, 0, 0, 0.5)}verdocs-sign .agree{-ms-flex:0;flex:0;width:600px;display:-ms-flexbox;display:flex;max-width:90%;padding:30px 15px;-ms-flex-direction:column;flex-direction:column;background-color:#ffffff}verdocs-sign .agree .header{-ms-flex:0 0 56px;flex:0 0 56px}verdocs-sign .agree li{margin:0.5em 0}verdocs-sign verdocs-ok-dialog .background-overlay{-ms-flex-align:start;align-items:flex-start;padding-top:100px}verdocs-sign .loading-indicator{top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;z-index:10000;position:fixed;background-color:rgba(0, 0, 0, 0.7)}@media print{verdocs-sign .header{display:none}}#verdocs-sign-header{color:#fff;width:100%;display:-ms-flexbox;display:flex;z-index:1000;-ms-flex:0 0 56px;flex:0 0 56px;font-size:12px;-webkit-column-gap:15px;-moz-column-gap:15px;column-gap:15px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;-webkit-transition:all 0.25s;transition:all 0.25s;background-color:#33354c;-webkit-box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.24), 0 0 4px 0 rgba(0, 0, 0, 0.12);box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.24), 0 0 4px 0 rgba(0, 0, 0, 0.12)}#verdocs-sign-header .inner{width:100%;display:-ms-flexbox;display:flex;margin:0 auto;padding:0 20px;max-width:1200px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}#verdocs-sign-header .logo{width:80px;display:none;margin:-6px 0 0 0}#verdocs-sign-header .title{font-size:18px;font-weight:500;overflow:hidden;white-space:nowrap;padding:0 10px 0 0;text-overflow:ellipsis}#verdocs-sign-header .spinner-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:1000;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;background:rgba(0, 0, 0, 0.4980392157);-ms-flex-pack:center;justify-content:center}";
+const verdocsSignCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-sign{display:-ms-flexbox;display:flex;overflow:hidden;position:relative;min-height:600px;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-sign div{display:block;-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-sign input{vertical-align:top}verdocs-sign>.document{-ms-flex:1;flex:1;width:100%;height:100%;-ms-flex-item-align:center;align-self:center;display:-ms-flexbox;display:flex;padding:15px;row-gap:15px;max-width:1200px;min-height:200px;position:relative;overflow-y:scroll;-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-direction:column;flex-direction:column}verdocs-sign>.document .inner{width:100%;max-width:1028px}verdocs-sign .cover{top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;z-index:5000;position:absolute;padding-top:100px;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;background:rgba(0, 0, 0, 0.5)}verdocs-sign .agree{-ms-flex:0;flex:0;width:600px;display:-ms-flexbox;display:flex;max-width:90%;padding:30px 15px;-ms-flex-direction:column;flex-direction:column;background-color:#ffffff}verdocs-sign .agree .header{-ms-flex:0 0 56px;flex:0 0 56px}verdocs-sign .agree li{margin:0.5em 0}verdocs-sign verdocs-ok-dialog .background-overlay{-ms-flex-align:start;align-items:flex-start;padding-top:100px}verdocs-sign .loading-indicator{top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;z-index:10000;position:fixed;background-color:rgba(0, 0, 0, 0.7)}@media print{verdocs-sign .header{display:none}}#verdocs-sign-header{color:#fff;width:100%;display:-ms-flexbox;display:flex;z-index:1000;-ms-flex:0 0 46px;flex:0 0 46px;font-size:12px;-webkit-column-gap:15px;-moz-column-gap:15px;column-gap:15px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;-webkit-transition:all 0.25s;transition:all 0.25s;background-color:#33354c;-webkit-box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.24), 0 0 4px 0 rgba(0, 0, 0, 0.12);box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.24), 0 0 4px 0 rgba(0, 0, 0, 0.12)}#verdocs-sign-header .inner{width:100%;display:-ms-flexbox;display:flex;margin:0 auto;padding:0 12px;max-width:1200px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}#verdocs-sign-header .logo{width:80px;display:none;margin:-6px 0 0 0}#verdocs-sign-header .title{font-size:18px;font-weight:500;overflow:hidden;white-space:nowrap;padding:0 10px 0 0;text-overflow:ellipsis}.spinner-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:1000;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;background:rgba(0, 0, 0, 0.4980392157);-ms-flex-pack:center;justify-content:center}";
 const VerdocsSignStyle0 = verdocsSignCss;
 
 const inProgressMenuOptions = [
@@ -63,7 +63,7 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         this.agreed = false;
         this.documentsSingularPlural = 'document';
         this.kbaStep = '';
-        this.showSpinner = true;
+        this.showSpinner = false;
     }
     componentWillLoad() {
         if (!this.endpoint) {
@@ -421,12 +421,20 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         }
     }
     attachFieldAttributes(pageInfo, field, el) {
-        // console.log('attach', field.name);
+        // We can get called multiple times as rendering completes and it's hard to avoid that
+        // because it's a ton of work for the callers to know it's been done already. But we
+        // don't want to attach multiple event listeners or we get dupe event handling, like
+        // calling the server twice on every field update. Since JS has no removeAllEventListeners()
+        // option, using removeEventListener() isn't reliable the way Stencil binds local function
+        // contexts, and cloneNode messes up the rest of the rendering, we just track it with a flag.
+        if (el.getAttribute('attached') === '1') {
+            return;
+        }
+        el.setAttribute('attached', '1');
         el.addEventListener('input', (e) => {
             // console.log('[SIGN] onfieldInput', e.detail, e.target.value);
             // These field types don't emit fieldChange. Should we standardize on that? We don't tap "input" for fields like
             // text boxes because we'd be updating the field on every keystroke. We do those on blur which fires fieldChange.
-            console.log('onInput', e.target.type, e.target.name);
             if (e.target.type === 'radio' || e.target.type === 'checkbox') {
                 // if (e.target.type === 'radio' || e.target.name.includes('date') || e.target.name.includes('checkbox')) {
                 this.handleFieldChange(field, e).finally(() => this.checkRecipientFields());
@@ -440,10 +448,11 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
             console.log('[SIGN] onAttached', e.detail, e.target.value);
             this.showSpinner = true;
             try {
-                const r = await uploadEnvelopeFieldAttachment(this.endpoint, this.envelopeId, field.name, e.detail);
-                console.log('upload result', r);
-                // this.updateRecipientFieldValue(fieldName, updateResult)
+                const updateResult = await uploadEnvelopeFieldAttachment(this.endpoint, this.envelopeId, field.name, e.detail);
+                this.updateRecipientFieldValue(field.name, updateResult);
                 this.checkRecipientFields();
+                const newEl = renderDocumentField(field, pageInfo, { disabled: false, editable: false, draggable: false, done: this.isDone });
+                this.attachFieldAttributes(pageInfo, field, newEl);
                 this.showSpinner = false;
             }
             catch (e) {
@@ -452,14 +461,23 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
                 this.showSpinner = false;
             }
         });
-        el.addEventListener('remove', (e) => {
-            console.log('[SIGN] onRemoved', e.detail, e.target.value);
-            deleteEnvelopeFieldAttachment(this.endpoint, this.envelopeId, field.name)
-                .then(r => {
-                console.log('[SIGN] Deleted attachment', r);
-                // this.updateRecipientFieldValue(fieldName, updateResult)
-            })
-                .catch(e => console.log('[SIGN] Error deleting attachment', e));
+        el.addEventListener('deleted', async (e) => {
+            console.log('[SIGN] onDeleted', e.detail, e.target.value);
+            this.showSpinner = true;
+            try {
+                const updateResult = await deleteEnvelopeFieldAttachment(this.endpoint, this.envelopeId, field.name);
+                console.log('[SIGN] Deleted attachment', updateResult);
+                this.updateRecipientFieldValue(field.name, updateResult);
+                this.checkRecipientFields();
+                const newEl = renderDocumentField(field, pageInfo, { disabled: false, editable: false, draggable: false, done: this.isDone });
+                this.attachFieldAttributes(pageInfo, field, newEl);
+                this.showSpinner = false;
+            }
+            catch (e) {
+                console.log('Error uploading attachment', e);
+                VerdocsToast('Unable to upload attachment, please try again later', { style: 'error' });
+                this.showSpinner = false;
+            }
         });
         el.addEventListener('focusout', e => {
             // These field types trigger focusout as they're used, even without a value change
@@ -489,6 +507,7 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
             if (field.page !== pageInfo.pageNumber) {
                 return;
             }
+            // TODO: Review possible workflow/race conditions vs rendering in -document-page.
             const el = renderDocumentField(field, pageInfo, { disabled: false, editable: false, draggable: false, done: this.isDone }, tabIndex);
             if (!el) {
                 return;
@@ -555,7 +574,7 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
                     });
                 } })))));
         }
-        return (h(Host, null, h("div", { id: "verdocs-sign-header" }, h("div", { class: "inner" }, h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), h("div", { class: "title" }, this.envelope.name), h("div", { style: { flex: '1' } }), !this.finishLater && h("verdocs-button", { size: "small", label: this.nextButtonLabel, disabled: !this.agreed, onClick: () => this.handleNext() }), h("div", { style: { marginLeft: '10px' } }), h("verdocs-dropdown", { options: !this.isDone && !this.finishLater ? inProgressMenuOptions : doneMenuOptions, onOptionSelected: e => this.handleOptionSelected(e) }))), h("div", { class: "document", style: { paddingTop: '15px' } }, (this.envelope.documents || []).map(envelopeDocument => {
+        return (h(Host, null, h("div", { id: "verdocs-sign-header" }, h("div", { class: "inner" }, h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), h("div", { class: "title" }, this.envelope.name), h("div", { style: { flex: '1' } }), !this.finishLater && h("verdocs-button", { size: "xsmall", label: this.nextButtonLabel, disabled: !this.agreed, onClick: () => this.handleNext() }), h("div", { style: { marginLeft: '10px' } }), h("verdocs-dropdown", { options: !this.isDone && !this.finishLater ? inProgressMenuOptions : doneMenuOptions, onOptionSelected: e => this.handleOptionSelected(e) }))), h("div", { class: "document", style: { paddingTop: '15px' } }, (this.envelope.documents || []).map(envelopeDocument => {
             const pageNumbers = integerSequence(1, envelopeDocument.pages);
             return (h(Fragment, null, pageNumbers.map(pageNumber => {
                 // In signing mode we show the original template page with all the recipient fields so we can show source formatting and

package/dist/components/verdocs-status-indicator2.js

@@ -7190,11 +7190,11 @@ const VerdocsStatusIndicator = /*@__PURE__*/ proxyCustomElement(class VerdocsSta
         }
         const icon = this.getStatusIcon(status);
         const statusMessage = this.getStatusMessage(status);
-        return (h(Host, { key: 'a579d2ed18289b75beaaaf5fef322db25d0a4e93', ref: el => (this.summaryComponent = el), class: `${this.theme} ${this.size} ${this.envelope ? 'has-document' : ''}`, "aria-label": "Click to View Details", onClick: e => {
+        return (h(Host, { key: '3111e544a8f287a2b5a501cae08fc88752186477', ref: el => (this.summaryComponent = el), class: `${this.theme} ${this.size} ${this.envelope ? 'has-document' : ''}`, "aria-label": "Click to View Details", onClick: e => {
                 e.stopPropagation();
                 e.preventDefault();
                 this.envelope && this.toggleDropdown();
-            }, onBlur: e => this.envelope && this.handleHideDropdown(e) }, h("span", { key: 'c59f8b21dce6f4fe2cd7bdc1124c6af339e70de7', class: "icon", innerHTML: icon }), h("span", { key: '1c96b95b111836c791a14e22c28defc43db1cc48', class: "content" }, statusMessage), h("div", { key: 'd673852a5e1a03656cb15d39d7f469a6e43f45a9', class: "detail-panel", ref: el => (this.detailPanel = el) }, h("div", { key: '0d1597689117ca7419f556fc38ff55711644f55f', id: `${this.containerId}` }), this.recipientStatusIcons.map(icon => (h("span", { innerHTML: icon.icon, style: { position: 'absolute', top: `${icon.y}px`, left: `${icon.x}px` } }))))));
+            }, onBlur: e => this.envelope && this.handleHideDropdown(e) }, h("span", { key: '2dd4397db22358d7dd8e495f601c3f31687e400e', class: "icon", innerHTML: icon }), h("span", { key: 'fb37993d036b1a1552f19fc2bc57565bf3026a44', class: "content" }, statusMessage), h("div", { key: '5bc4ea53d9eec94c0dfd34662437bf90aaf76d60', class: "detail-panel", ref: el => (this.detailPanel = el) }, h("div", { key: 'e073e793dc4f0bef2d9826fb5b70f62f2495fa45', id: `${this.containerId}` }), this.recipientStatusIcons.map(icon => (h("span", { innerHTML: icon.icon, style: { position: 'absolute', top: `${icon.y}px`, left: `${icon.x}px` } }))))));
     }
     static get style() { return VerdocsStatusIndicatorStyle0; }
 }, [0, "verdocs-status-indicator", {

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

@@ -15,7 +15,7 @@ const VerdocsTemplateCard$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsTemp
     }
     render() {
         var _a, _b, _c, _d;
-        return (h(Host, { key: '3e5011cab3a4e78b92e9c2565f40d304ad334ed6' }, h("span", { key: '65ae319e5f2c07d6ad30dc7e1ef797d7d1f45e34', class: "name" }, this.template.name), h("span", { key: '81078cc46080d7417f3a2aa2a87f62787867ab7d', class: "org-name" }, ((_a = this.template.organization) === null || _a === void 0 ? void 0 : _a.name) || 'Public'), h("hr", { key: 'e35365811650f21862ebc87e89015c1c044f65cc' }), h("div", { key: '9d7e0b7a9e09be59890df0b8655f1ad74b8aadc9', class: "controls" }, h("div", { key: '24e402c45e499969b3f039010a730b7e22e5eb82', class: "control" }, h("span", { key: '06891917e493b9902f141acf3c906d9f2dfb98fc', class: "icon", innerHTML: StarIcon }), h("span", { key: '6599c695f7f5e1798254a16e1e209afe1768cd9d', class: "value" }, this.template.star_counter)), h("div", { key: '868b45b247a1e613caa0ca20270435ecfc52032d', class: "control secondary" }, h("span", { key: 'c0c308c9762ed5ada2456d69697dc5b0295f257c', class: "icon", innerHTML: PagesIcon }), h("span", { key: 'f851ea648cd5115798937af1d9d12671410e3f5b', class: "value" }, ((_d = (_c = (_b = this.template) === null || _b === void 0 ? void 0 : _b.documents) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.pages) || 1)), h("div", { key: '3c24408d7b9cd968d721cd5360a87f7d66d0f02a', class: "control secondary" }, h("span", { key: '12a94b8fc7850db8ab535161abd7003ddb8f5eca', class: "icon", innerHTML: EmailIcon }), h("span", { key: '544d6b2ba82c971ba46649fa45d044293a89ca07', class: "value" }, this.template.counter)), h("span", { key: '62c64a478015d8edd079272405a366fc117dafea', class: "additional-controls", innerHTML: ActionsIcon }))));
+        return (h(Host, { key: '34dbb55f6c6b8afe8e2a27142d1edd560aa8123e' }, h("span", { key: '83a70355f7d740968113d4b7c70223b8b1728199', class: "name" }, this.template.name), h("span", { key: 'daba1bec48afa7914db6812c092ecc9006f0c0fa', class: "org-name" }, ((_a = this.template.organization) === null || _a === void 0 ? void 0 : _a.name) || 'Public'), h("hr", { key: 'f33a1caa30b0e73e490c353aeda95f03ccc8cdc9' }), h("div", { key: '132457e5862298418311e5630cf91ee4c388eb53', class: "controls" }, h("div", { key: '4d6a907defae65e3e71468227ff01bf378349325', class: "control" }, h("span", { key: '859bf9965d4d4d666b191410269c8e4733abdc3b', class: "icon", innerHTML: StarIcon }), h("span", { key: 'bb2aa5c6f908aad15c3ffaec48786bf32e4afafe', class: "value" }, this.template.star_counter)), h("div", { key: 'f908946f9052972407ec26065774aeffe86fd370', class: "control secondary" }, h("span", { key: '8703c428b3154521c3156b32a95267fcda3a73ab', class: "icon", innerHTML: PagesIcon }), h("span", { key: '811320f402296ac578418a0ae4a6b0403455fadc', class: "value" }, ((_d = (_c = (_b = this.template) === null || _b === void 0 ? void 0 : _b.documents) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.pages) || 1)), h("div", { key: '3fdbd916fd49d41b9c8254d78bce60eff644d008', class: "control secondary" }, h("span", { key: '5ca32fdaa0f2fb7ea7a093169d2abc4a531462e3', class: "icon", innerHTML: EmailIcon }), h("span", { key: '0e37528844b8097102ecd8c5a48fa59efe8a6705', class: "value" }, this.template.counter)), h("span", { key: '8877d1faf766e75f1198a5842cf97ec6be28fb6b', class: "additional-controls", innerHTML: ActionsIcon }))));
     }
     static get style() { return VerdocsTemplateCardStyle0; }
 }, [0, "verdocs-template-card", {

package/dist/components/verdocs-template-document-page2.js

@@ -2,21 +2,22 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host, Fragment } from
 import { VerdocsEndpoint, getTemplateDocumentPageDisplayUri } from '@verdocs/js-sdk';
 import { g as getTemplateFieldStore } from './TemplateFieldStore.js';
 import { t as throttle, d as getControlStyles, g as getFieldId } from './utils.js';
-import { d as defineCustomElement$l } from './verdocs-button2.js';
-import { d as defineCustomElement$k } from './verdocs-checkbox2.js';
-import { d as defineCustomElement$j } from './verdocs-component-error2.js';
-import { d as defineCustomElement$i } from './verdocs-field-attachment2.js';
-import { d as defineCustomElement$h } from './verdocs-field-checkbox2.js';
-import { d as defineCustomElement$g } from './verdocs-field-date2.js';
-import { d as defineCustomElement$f } from './verdocs-field-dropdown2.js';
-import { d as defineCustomElement$e } from './verdocs-field-initial2.js';
-import { d as defineCustomElement$d } from './verdocs-field-radio2.js';
-import { d as defineCustomElement$c } from './verdocs-field-signature2.js';
-import { d as defineCustomElement$b } from './verdocs-field-textarea2.js';
-import { d as defineCustomElement$a } from './verdocs-field-textbox2.js';
-import { d as defineCustomElement$9 } from './verdocs-field-timestamp2.js';
-import { d as defineCustomElement$8 } from './verdocs-help-icon2.js';
-import { d as defineCustomElement$7 } from './verdocs-initial-dialog2.js';
+import { d as defineCustomElement$m } from './verdocs-button2.js';
+import { d as defineCustomElement$l } from './verdocs-checkbox2.js';
+import { d as defineCustomElement$k } from './verdocs-component-error2.js';
+import { d as defineCustomElement$j } from './verdocs-field-attachment2.js';
+import { d as defineCustomElement$i } from './verdocs-field-checkbox2.js';
+import { d as defineCustomElement$h } from './verdocs-field-date2.js';
+import { d as defineCustomElement$g } from './verdocs-field-dropdown2.js';
+import { d as defineCustomElement$f } from './verdocs-field-initial2.js';
+import { d as defineCustomElement$e } from './verdocs-field-radio2.js';
+import { d as defineCustomElement$d } from './verdocs-field-signature2.js';
+import { d as defineCustomElement$c } from './verdocs-field-textarea2.js';
+import { d as defineCustomElement$b } from './verdocs-field-textbox2.js';
+import { d as defineCustomElement$a } from './verdocs-field-timestamp2.js';
+import { d as defineCustomElement$9 } from './verdocs-help-icon2.js';
+import { d as defineCustomElement$8 } from './verdocs-initial-dialog2.js';
+import { d as defineCustomElement$7 } from './verdocs-ok-dialog2.js';
 import { d as defineCustomElement$6 } from './verdocs-portal2.js';
 import { d as defineCustomElement$5 } from './verdocs-select-input2.js';
 import { d as defineCustomElement$4 } from './verdocs-signature-dialog2.js';
@@ -115,7 +116,7 @@ const VerdocsTemplateDocumentPage = /*@__PURE__*/ proxyCustomElement(class Verdo
     }
     render() {
         const height = `${this.renderedHeight}px`;
-        return (h(Host, { key: '4c35b1d1d350e3c16813170b0421d888aaf76a4d', id: `${this.containerId}`, style: { height, flex: `0 0 ${height}` } }, this.layers.map(layer => layer.type === 'div' ? (h("div", { class: "verdocs-template-document-page-layer", id: `${this.containerId}-${layer.name}`, style: { height } }, layer.name === 'controls' &&
+        return (h(Host, { key: '2c5cc60056b48fbcb7de1e1abffdbb3753b38e10', id: `${this.containerId}`, style: { height, flex: `0 0 ${height}` } }, this.layers.map(layer => layer.type === 'div' ? (h("div", { class: "verdocs-template-document-page-layer", id: `${this.containerId}-${layer.name}`, style: { height } }, layer.name === 'controls' &&
             this.fieldStore
                 .get('fields')
                 .filter(field => field && field.page === this.pageNumber)
@@ -195,7 +196,7 @@ function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["verdocs-template-document-page", "verdocs-button", "verdocs-checkbox", "verdocs-component-error", "verdocs-field-attachment", "verdocs-field-checkbox", "verdocs-field-date", "verdocs-field-dropdown", "verdocs-field-initial", "verdocs-field-radio", "verdocs-field-signature", "verdocs-field-textarea", "verdocs-field-textbox", "verdocs-field-timestamp", "verdocs-help-icon", "verdocs-initial-dialog", "verdocs-portal", "verdocs-select-input", "verdocs-signature-dialog", "verdocs-template-field-properties", "verdocs-text-input", "verdocs-upload-dialog"];
+    const components = ["verdocs-template-document-page", "verdocs-button", "verdocs-checkbox", "verdocs-component-error", "verdocs-field-attachment", "verdocs-field-checkbox", "verdocs-field-date", "verdocs-field-dropdown", "verdocs-field-initial", "verdocs-field-radio", "verdocs-field-signature", "verdocs-field-textarea", "verdocs-field-textbox", "verdocs-field-timestamp", "verdocs-help-icon", "verdocs-initial-dialog", "verdocs-ok-dialog", "verdocs-portal", "verdocs-select-input", "verdocs-signature-dialog", "verdocs-template-field-properties", "verdocs-text-input", "verdocs-upload-dialog"];
     components.forEach(tagName => { switch (tagName) {
         case "verdocs-template-document-page":
             if (!customElements.get(tagName)) {
@@ -204,75 +205,80 @@ function defineCustomElement() {
             break;
         case "verdocs-button":
             if (!customElements.get(tagName)) {
-                defineCustomElement$l();
+                defineCustomElement$m();
             }
             break;
         case "verdocs-checkbox":
             if (!customElements.get(tagName)) {
-                defineCustomElement$k();
+                defineCustomElement$l();
             }
             break;
         case "verdocs-component-error":
             if (!customElements.get(tagName)) {
-                defineCustomElement$j();
+                defineCustomElement$k();
             }
             break;
         case "verdocs-field-attachment":
             if (!customElements.get(tagName)) {
-                defineCustomElement$i();
+                defineCustomElement$j();
             }
             break;
         case "verdocs-field-checkbox":
             if (!customElements.get(tagName)) {
-                defineCustomElement$h();
+                defineCustomElement$i();
             }
             break;
         case "verdocs-field-date":
             if (!customElements.get(tagName)) {
-                defineCustomElement$g();
+                defineCustomElement$h();
             }
             break;
         case "verdocs-field-dropdown":
             if (!customElements.get(tagName)) {
-                defineCustomElement$f();
+                defineCustomElement$g();
             }
             break;
         case "verdocs-field-initial":
             if (!customElements.get(tagName)) {
-                defineCustomElement$e();
+                defineCustomElement$f();
             }
             break;
         case "verdocs-field-radio":
             if (!customElements.get(tagName)) {
-                defineCustomElement$d();
+                defineCustomElement$e();
             }
             break;
         case "verdocs-field-signature":
             if (!customElements.get(tagName)) {
-                defineCustomElement$c();
+                defineCustomElement$d();
             }
             break;
         case "verdocs-field-textarea":
             if (!customElements.get(tagName)) {
-                defineCustomElement$b();
+                defineCustomElement$c();
             }
             break;
         case "verdocs-field-textbox":
             if (!customElements.get(tagName)) {
-                defineCustomElement$a();
+                defineCustomElement$b();
             }
             break;
         case "verdocs-field-timestamp":
             if (!customElements.get(tagName)) {
-                defineCustomElement$9();
+                defineCustomElement$a();
             }
             break;
         case "verdocs-help-icon":
             if (!customElements.get(tagName)) {
-                defineCustomElement$8();
+                defineCustomElement$9();
             }
             break;
         case "verdocs-initial-dialog":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$8();
+            }
+            break;
+        case "verdocs-ok-dialog":
             if (!customElements.get(tagName)) {
                 defineCustomElement$7();
             }

package/dist/components/verdocs-template-role-properties2.js

@@ -127,34 +127,34 @@ const VerdocsTemplateRoleProperties = /*@__PURE__*/ proxyCustomElement(class Ver
     }
     render() {
         const hasFields = this.fieldStore.get('fields').some(field => field.role_name === this.roleName);
-        return (h(Host, { key: 'c54a0b5c84e2ca6eba28bccd0ed7dbaf61b9318e' }, h("div", { key: 'ed724b07e6bd402c2c8f593e4f0ae5eeb7af6f2a', class: "background-overlay", onClick: e => this.handleCancel(e) }, h("div", { key: '7372ec9e048dde505c4f59f30d4bf94c9d206e2c', class: "dialog" }, h("form", { key: '2fc19ec7adb1fafa2f501698a6e61025fdc31749', onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("verdocs-text-input", { key: 'd11fa702e1b5ae5ffb300b9d89c437ac6ba419c1', id: "verdocs-role-name", label: "Role Name", value: this.name, autocomplete: "off", disabled: hasFields, helpText: hasFields
+        return (h(Host, { key: 'e1713fef30610985e7b198413152ba998aa3d400' }, h("div", { key: '89ea386f74975c52b86fd6c78984edd49837b2de', class: "background-overlay", onClick: e => this.handleCancel(e) }, h("div", { key: '5676470ae1372df1418d7bb2bec1b6f7e25b7939', class: "dialog" }, h("form", { key: '33d2922247d3a510ae4425f028ac9a795efac654', onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("verdocs-text-input", { key: '768bc89e775f2d5214fa80b092e1eeee5b113432', id: "verdocs-role-name", label: "Role Name", value: this.name, autocomplete: "off", disabled: hasFields, helpText: hasFields
                 ? 'This role has fields assigned and can no longer be renamed.'
                 : 'A unique name to identify the role in the workflow. Submitted data will also be tagged with this value.', placeholder: "Role Name...", onInput: (e) => {
                 this.name = e.target.value;
                 this.dirty = true;
-            } }), h("div", { key: 'e9558475d3e2a193ac753402e4df7fd4c975bc9d', class: "row" }, h("div", { key: 'ecb28611e04310a9d802f597ef4bc3a4b7b53f4d', class: "input-label" }, "Type:"), h("verdocs-select-input", { key: 'a9dc9ae0fd6ac107ec9a79fc5a77b2b4f0286808', value: this.type, options: [
+            } }), h("div", { key: '776217b83bd5a63075c71659b866fc66dfa2e7c6', class: "row" }, h("div", { key: '4e279080306d686e92c8a8dc51eb81ee8791a01b', class: "input-label" }, "Type:"), h("verdocs-select-input", { key: '3fe5574371f47d33996e811902c44e4144acc134', value: this.type, options: [
                 { label: 'Signer', value: 'signer' },
                 { label: 'CC', value: 'cc' },
                 { label: 'Approver', value: 'approver' },
             ], onInput: (e) => {
                 this.type = e.target.value;
                 this.dirty = true;
-            } }), h("verdocs-help-icon", { key: '56b67267f62756e09f7b02d2ebbd5b3cc20e228f', text: "Most participants are Signers. CC roles are notified when documents are signed, but have no other actions. Approvers get notified when signing is completed to perform a final review." })), h("verdocs-text-input", { key: '29f2c4124c9fc9a126f73088f8f7f8056f4c4323', id: "verdocs-recipient-first", label: "First Name", value: this.first_name, autocomplete: "off", helpText: "The recipient's first name, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "First Name...", onInput: (e) => {
+            } }), h("verdocs-help-icon", { key: '53165bb74f7ee07445abb8c123c9b4111f16d48e', text: "Most participants are Signers. CC roles are notified when documents are signed, but have no other actions. Approvers get notified when signing is completed to perform a final review." })), h("verdocs-text-input", { key: '6b7b54ba54e6282f5de0bcaf3e55a6144ea02a1e', id: "verdocs-recipient-first", label: "First Name", value: this.first_name, autocomplete: "off", helpText: "The recipient's first name, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "First Name...", onInput: (e) => {
                 this.first_name = e.target.value;
                 this.dirty = true;
-            } }), h("verdocs-text-input", { key: '512457a0c6e9abf29b6f4e8403deef8ee833dec4', id: "verdocs-recipient-first", label: "Last Name", value: this.last_name, autocomplete: "off", helpText: "The recipient's last name, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Last Name...", onInput: (e) => {
+            } }), h("verdocs-text-input", { key: 'f950aa5ca8c6d60f099910b1e51a79bc12552112', id: "verdocs-recipient-first", label: "Last Name", value: this.last_name, autocomplete: "off", helpText: "The recipient's last name, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Last Name...", onInput: (e) => {
                 this.last_name = e.target.value;
                 this.dirty = true;
-            } }), h("verdocs-text-input", { key: 'b69cc6d65593ecd139748a6b39e33f13f38ed3be', id: "verdocs-recipient-email", label: "Email", value: this.email, autocomplete: "off", helpText: "The recipient's email address, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Email Address...", onInput: (e) => {
+            } }), h("verdocs-text-input", { key: '304ed1bf5528a7db9103e1cef62af2628cb09dab', id: "verdocs-recipient-email", label: "Email", value: this.email, autocomplete: "off", helpText: "The recipient's email address, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Email Address...", onInput: (e) => {
                 this.email = e.target.value;
                 this.dirty = true;
-            } }), h("verdocs-text-input", { key: '931910a385e6b54ae33897bde3c344a4643089f6', id: "verdocs-recipient-phone", label: "Phone", value: this.phone, autocomplete: "off", helpText: "The recipient's phone number, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Phone Number...", onInput: (e) => {
+            } }), h("verdocs-text-input", { key: '7d5fb7b56d99a09dc1f4e61744786f23a766a142', id: "verdocs-recipient-phone", label: "Phone", value: this.phone, autocomplete: "off", helpText: "The recipient's phone number, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Phone Number...", onInput: (e) => {
                 this.phone = e.target.value;
                 this.dirty = true;
-            } }), h("div", { key: '380809846d4cc9a93737e244c60f2455dc3c451b', class: "row" }, h("div", { key: 'f2f518c482eed372f261eb80c4678f839ec23c9c', class: "input-label" }, "May Delegate:"), h("div", { key: 'ee8816cd6b1268c8c62c793fcd500f45d676f1d6', class: "checkbox-wrapper" }, h("verdocs-checkbox", { key: '36958e4cdfbc38ea934fe19fb3509e3107aa015f', checked: this.delegator, onInput: (e) => {
+            } }), h("div", { key: 'fdcffc8bcdb934b850e691b9f133fb0f009546a6', class: "row" }, h("div", { key: '84e445026a799bad4ed33a6e1c7f470f9269249c', class: "input-label" }, "May Delegate:"), h("div", { key: 'ba99473e1b59b0c7977061f5e52a6dbeb017106b', class: "checkbox-wrapper" }, h("verdocs-checkbox", { key: 'b7041e784c399da331820a6b6eaecf98716c91a5', checked: this.delegator, onInput: (e) => {
                 this.delegator = e.target.checked;
                 this.dirty = true;
-            } })), h("verdocs-help-icon", { key: '44b92c48e4604fb543ff5028528bb761c348091e', text: "If enabled, this recipient may delegate their actions to another individual." })), h("div", { key: '855c97f472fe9ec7e230cb3687bbb43ad0f3d893', class: "buttons" }, h("button", { key: '09b8562821002359fa9c3d5e6281b58e2eea5ee5', class: "delete-button", disabled: this.dirty, onClick: e => this.handleDelete(e), innerHTML: TrashIcon }), h("div", { key: '65fdeeecbdc7a34bee5d1c72dcc9ab9630e6adfa', style: { flex: '1' } }), h("verdocs-button", { key: '1dcf66c59be34535f3af1e96cc15816ea097546b', size: "small", variant: "outline", label: "Cancel", disabled: !this.dirty, onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: '0eb80af6e8d388eeb6563db768bc5511a14cafb8', size: "small", label: "Save", disabled: !this.dirty, onClick: e => this.handleSave(e) })))))));
+            } })), h("verdocs-help-icon", { key: 'e814cd3a3f7cd8b2a3fbe1470b83f8546fbd794d', text: "If enabled, this recipient may delegate their actions to another individual." })), h("div", { key: 'e56e3368bcb7fa24e7b5ff826afbed91694ab377', class: "buttons" }, h("button", { key: '57973ea3a7326bd368d1e555575da5f0c6c083e2', class: "delete-button", disabled: this.dirty, onClick: e => this.handleDelete(e), innerHTML: TrashIcon }), h("div", { key: 'bf8ed30bc50bedc68a98cbcc338b06fdb912e430', style: { flex: '1' } }), h("verdocs-button", { key: 'bd09a8ad07eb043bccb32cee9d1ac5e5d90e1c6b', size: "small", variant: "outline", label: "Cancel", disabled: !this.dirty, onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: '68d8ff732f3190ef20225c1f50a4ab6425dcad6c', size: "small", label: "Save", disabled: !this.dirty, onClick: e => this.handleSave(e) })))))));
     }
     static get style() { return VerdocsTemplateRolePropertiesStyle0; }
 }, [0, "verdocs-template-role-properties", {

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

@@ -69,7 +69,7 @@ const VerdocsTemplateSender = /*@__PURE__*/ proxyCustomElement(class VerdocsTemp
         });
     }
     render() {
-        return (h(Host, { key: '67fca56fbc8af88952abcbf38e100924ef12450e' }, h("div", { key: '7aa3d03b7cf0a197c2c0b19f8095acff8f33b0c7', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '14ed1a78f60c2f9390f5b950bc367334bf3ba5ab', class: "dialog" }, h("div", { key: 'eadbe8d3794d0bbaef40c4cf66b2b4003470cff3', class: "options" }, h("div", { key: '4e55a553a7a543ba7d0d0f9b89cc079a29cbc23f', class: "option" }, h("verdocs-radio-button", { key: 'cd77756aff5201d3278a8bf8564842bfd77378b1', name: "template-sender", value: 'everyone', checked: this.sender === 'everyone', onInput: () => this.handleSelectSetting('everyone') }), h("div", { key: '65aa448d8011a4835762bda5350758353fb86554', class: "description" }, h("div", { key: '4811f42f5a2779834b8e0c0705b52bc4ea9071df', class: "name" }, "Anyone on the Web"), h("verdocs-help-icon", { key: '2738d5cbd942df36910ae33548dfda99b93114be', text: "Anyone can use this template. (Make its visibility is set to to 'Public' or 'Shared'.)" }))), h("div", { key: 'f316dd18967d795dc19973d46c0178d48b04cf3a', class: "option" }, h("verdocs-radio-button", { key: '06c9415f680dbe9eb06995ac46f3884ab341ca76', name: "template-sender", value: 'everyone_as_creator', checked: this.sender === 'everyone_as_creator', onInput: () => this.handleSelectSetting('everyone_as_creator') }), h("div", { key: '5f88f41c3eac901c01a996edeb21ef729d90dbf4', class: "description" }, h("div", { key: '4f6977dc538f073bf0eb24034ea9ec60e274169c', class: "name" }, "Anyone on the Web as me"), h("verdocs-help-icon", { key: 'a3d6246ae9288c701f50ecc73176c649962c3301', text: "Anyone can use this template on my behalf. (Make sure its visibility is set to 'Public' or 'Shared'.)" }))), h("div", { key: '00209bb46399d1e8630540a020db6a83acb80d70', class: "option" }, h("verdocs-radio-button", { key: 'b236c9613d1078151e4c0adea3767d095714276b', name: "template-sender", value: 'organization_member', checked: this.sender === 'organization_member', onInput: () => this.handleSelectSetting('organization_member') }), h("div", { key: '6335469dd6109b6b36eec21bfb344e2a94fa793e', class: "description" }, h("div", { key: '88cddc5dd229213d243e175c7bca422e67d84fc4', class: "name" }, "Anyone in my organization"), h("verdocs-help-icon", { key: 'e2f24e4d1c5af940e1c8860b7fd78eeb8a8367b4', text: "Anyone in my organization can use this template. (Make sure its visibility is set to 'Shared')" }))), h("div", { key: 'fcbfa21b9b5aad992a608b83cec6104bee2e410f', class: "option" }, h("verdocs-radio-button", { key: 'b31555051581c7eeedd012510053f29cee40b2d0', name: "template-sender", value: 'organization_member_as_creator', checked: this.sender === 'organization_member_as_creator', onInput: () => this.handleSelectSetting('organization_member_as_creator') }), h("div", { key: 'ca1941475808a7db037dafab17ff6c2fc6b40b1b', class: "description" }, h("div", { key: '6bca41574f92ce15eba532289db4ac2a5480c9f2', class: "name" }, "Anyone in my organization as me"), h("verdocs-help-icon", { key: '8e916441fcd37488e0061c49c0b91c88b9b7f467', text: "Anyone in my organization can use this template on my behalf. (Make sure its visibility is set to to 'Shared'.)" }))), h("div", { key: '2c32fb35cc221336e96cd07ff5e79971c26475c8', class: "option" }, h("verdocs-radio-button", { key: '2f86e27c50fb65632dd647e627621f163369ca2e', name: "template-sender", value: 'creator', checked: this.sender === 'creator', onInput: () => this.handleSelectSetting('creator') }), h("div", { key: '21cef2358038a2089c5a80f32f745530380cb5f0', class: "description" }, h("div", { key: 'ed173b10391c63d838d2a814de2d3c74a056a837', class: "name" }, "Me"), h("verdocs-help-icon", { key: 'c7f3204522f631e84d34f7f040bb73af50455196', text: "Only I can use this template." })))), h("div", { key: '4d26f9e23c3b3eed492a0782b324612ddd989325', class: "buttons" }, h("verdocs-button", { key: 'e65545f203f631214e5939946b95fbc14f37686a', label: "Close", onClick: () => this.handleClose() }))))));
+        return (h(Host, { key: '11d6c9e8b28b149150dc2c8247a9897af3c5be8f' }, h("div", { key: '3aa4135a95fada5ef5ae8dbd6e1f4d5103e331ab', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '82604c1d23b8da0e977f335cc5e91d3f50cf8b9e', class: "dialog" }, h("div", { key: 'f4e75b7ce50372317d39f36896ffb41a1ab62bc4', class: "options" }, h("div", { key: 'e6a53f521720750d9308c6f86b7ec1ce3da5d6f5', class: "option" }, h("verdocs-radio-button", { key: '71a5dee2cdd1714a24b693e43b09a09fb390127a', name: "template-sender", value: 'everyone', checked: this.sender === 'everyone', onInput: () => this.handleSelectSetting('everyone') }), h("div", { key: '96ec93e3673df83d059068a7e6b26c893344b0e1', class: "description" }, h("div", { key: 'f96bec057a8e3813eb5d995a2c3318831dc8833c', class: "name" }, "Anyone on the Web"), h("verdocs-help-icon", { key: '936f9fc0cf13fda75dcd8ba5b7be130a7d509feb', text: "Anyone can use this template. (Make its visibility is set to to 'Public' or 'Shared'.)" }))), h("div", { key: 'ffd734f9e6b150c8473c73c569f5344db01b33d1', class: "option" }, h("verdocs-radio-button", { key: '44c89ee4fd83268addc932681bac9cc5e4265b11', name: "template-sender", value: 'everyone_as_creator', checked: this.sender === 'everyone_as_creator', onInput: () => this.handleSelectSetting('everyone_as_creator') }), h("div", { key: 'ac2717cceef39304a7a9b3d5b6cdbd7bac459831', class: "description" }, h("div", { key: '95f4a2acb38164158e6de9d7920046a66c9b3edd', class: "name" }, "Anyone on the Web as me"), h("verdocs-help-icon", { key: '977e40893b6660ddbcd3c278e5ae54ca49d61a4d', text: "Anyone can use this template on my behalf. (Make sure its visibility is set to 'Public' or 'Shared'.)" }))), h("div", { key: '67362c118307c90e5fd40b10321b8875bd771040', class: "option" }, h("verdocs-radio-button", { key: 'd582a6659c8be50cd118690fc91fea18af8026d8', name: "template-sender", value: 'organization_member', checked: this.sender === 'organization_member', onInput: () => this.handleSelectSetting('organization_member') }), h("div", { key: 'e18b002f29dd3dfdcbe742599bfdbd0a20f43697', class: "description" }, h("div", { key: 'ed4ce6c890aa51883ee72e0aff5b296128da1fd9', class: "name" }, "Anyone in my organization"), h("verdocs-help-icon", { key: '82cc8a2ee2da32cda56555d4484bf94ce9e230ed', text: "Anyone in my organization can use this template. (Make sure its visibility is set to 'Shared')" }))), h("div", { key: 'c6ea6745540bea7d20196fc4d96590f334387333', class: "option" }, h("verdocs-radio-button", { key: '5d941faac5fd0ab09ed531141ab049248de97afd', name: "template-sender", value: 'organization_member_as_creator', checked: this.sender === 'organization_member_as_creator', onInput: () => this.handleSelectSetting('organization_member_as_creator') }), h("div", { key: 'a57cb28c9609a2d6d583b5fb7022866354b95bb2', class: "description" }, h("div", { key: '33561830437d8f604c7cda519617b687b1588e65', class: "name" }, "Anyone in my organization as me"), h("verdocs-help-icon", { key: '65557a2d57bc56c248f13d1b4d1d72305728fb8c', text: "Anyone in my organization can use this template on my behalf. (Make sure its visibility is set to to 'Shared'.)" }))), h("div", { key: 'f6e19ddf05d5468b226a2767e05bdd83efe66e06', class: "option" }, h("verdocs-radio-button", { key: '2d82a2104f9f5c209f560144b8fc6c28b3675889', name: "template-sender", value: 'creator', checked: this.sender === 'creator', onInput: () => this.handleSelectSetting('creator') }), h("div", { key: '8afe677cfca3535e2e372af8a227c91b880af4e4', class: "description" }, h("div", { key: 'd628e15e4223cae86a4152063b91a055b441328b', class: "name" }, "Me"), h("verdocs-help-icon", { key: 'd85b39030f38b05d2a8053950d64a00383a28ca6', text: "Only I can use this template." })))), h("div", { key: '575bdb57d53dac18f852f5f79c370cd186550402', class: "buttons" }, h("verdocs-button", { key: '44f30d116ebfd5618b818b1170881566fadd1e68', label: "Close", onClick: () => this.handleClose() }))))));
     }
     static get style() { return VerdocsTemplateSenderStyle0; }
 }, [0, "verdocs-template-sender", {

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

@@ -43,7 +43,7 @@ const VerdocsTemplateStar = /*@__PURE__*/ proxyCustomElement(class VerdocsTempla
         });
     }
     render() {
-        return (h(Host, { key: '9b776fbc0df8053116cf8c90abf92ca936e4aed3' }, h("div", { key: '4623b371e18334c1c88f8a2463c9cc48b308eedf', class: `star ${this.updating ? 'updating' : ''}`, innerHTML: this.template.star_counter ? SolidStarIcon : OutlineStarIcon, onClick: e => this.toggle(e) }), h("div", { key: 'd0f7d0d65266d1683a1fcd537cd4eda40e94b287', class: "count" }, this.template.star_counter || '--')));
+        return (h(Host, { key: '380d6e0aa5c8cda93b4d5ed1276da45dafc8c8b4' }, h("div", { key: '04dd0b86049e0dd2ca756c6f209ecce0cda2e22b', class: `star ${this.updating ? 'updating' : ''}`, innerHTML: this.template.star_counter ? SolidStarIcon : OutlineStarIcon, onClick: e => this.toggle(e) }), h("div", { key: 'e26658e05d76b6d72fbd434d8b938f61cde39b2a', class: "count" }, this.template.star_counter || '--')));
     }
     static get style() { return VerdocsTemplateStarStyle0; }
 }, [0, "verdocs-template-star", {

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

@@ -11,7 +11,7 @@ const VerdocsTemplateTags$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsTemp
     }
     render() {
         var _a;
-        return (h(Host, { key: 'bae2503fd50b94ad99bfbb24f2abe5e6d5629e2e' }, (_a = this.tags) === null || _a === void 0 ? void 0 : _a.map(tag => (h("span", null, tag)))));
+        return (h(Host, { key: '0935c5356bbfe973758193fb4901abb941827d5b' }, (_a = this.tags) === null || _a === void 0 ? void 0 : _a.map(tag => (h("span", null, tag)))));
     }
     static get style() { return VerdocsTemplateTagsStyle0; }
 }, [0, "verdocs-template-tags", {

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

@@ -1,7 +1,8 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host, Fragment } from '@stencil/core/internal/client';
-import { d as defineCustomElement$1 } from './verdocs-button2.js';
+import { d as defineCustomElement$2 } from './verdocs-button2.js';
+import { d as defineCustomElement$1 } from './verdocs-ok-dialog2.js';
 
-const verdocsUploadDialogCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-upload-dialog{position:fixed;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:\"Inter\", \"Barlow\", sans-serif}verdocs-upload-dialog div{-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-upload-dialog .background-overlay{top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;z-index:10000;position:fixed;-ms-flex-align:center;align-items:center;background:rgba(0, 0, 0, 0.4980392157);-ms-flex-pack:center;justify-content:center}verdocs-upload-dialog .dialog{width:320px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;border-radius:4px;overflow:hidden;background:#ffffff;padding:16px;-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)}verdocs-upload-dialog .heading{display:-ms-flexbox;display:flex;font-size:20px;font-weight:500;-ms-flex-direction:row;flex-direction:row}verdocs-upload-dialog .buttons{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end}verdocs-upload-dialog .buttons verdocs-button{margin-left:16px}verdocs-upload-dialog .current-label{margin:20px 0 5px 0}verdocs-upload-dialog .drop-target{opacity:1;width:100%;display:-ms-flexbox;display:flex;margin:20px 0;min-height:260px;padding:30px 15px;text-align:center;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;background-color:#f5f5f5;color:rgba(0, 0, 0, 0.54);border:2px dashed #979797}verdocs-upload-dialog .drop-target p{margin:12px 0}verdocs-upload-dialog .drop-target.dragging-over{border:5px solid #4c56cb}verdocs-upload-dialog .drop-target>verdocs-button{margin:12px 0;display:inline-block}verdocs-upload-dialog .attachments{height:56px;font-size:0;margin:20px 0;padding:0 16px;line-height:56px;white-space:normal;-webkit-box-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.12), 0 0 2px 0 rgba(0, 0, 0, 0.14);box-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.12), 0 0 2px 0 rgba(0, 0, 0, 0.14)}verdocs-upload-dialog .attachments .attachment{gap:10px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}verdocs-upload-dialog .attachments .attachment .icon{width:18px;height:18px;line-height:18px}verdocs-upload-dialog .attachments .attachment .icon.trash{cursor:pointer}verdocs-upload-dialog .attachments .attachment .name{-ms-flex:1;flex:1;font-size:14px;overflow:hidden;font-weight:400;white-space:nowrap;text-overflow:ellipsis}";
+const verdocsUploadDialogCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-upload-dialog{position:fixed;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:\"Inter\", \"Barlow\", sans-serif}verdocs-upload-dialog div{-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-upload-dialog .background-overlay{top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;z-index:10000;position:fixed;-ms-flex-align:center;align-items:center;background:rgba(0, 0, 0, 0.4980392157);-ms-flex-pack:center;justify-content:center}verdocs-upload-dialog .upload-dialog-content{width:320px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;border-radius:4px;overflow:hidden;background:#ffffff;padding:16px;-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)}verdocs-upload-dialog .heading{display:-ms-flexbox;display:flex;font-size:20px;font-weight:500;-ms-flex-direction:row;flex-direction:row}verdocs-upload-dialog .buttons{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end}verdocs-upload-dialog .buttons verdocs-button{margin-left:16px}verdocs-upload-dialog .current-label{margin:20px 0 5px 0}verdocs-upload-dialog .drop-target{opacity:1;width:100%;display:-ms-flexbox;display:flex;margin:20px 0;min-height:260px;padding:30px 15px;text-align:center;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;background-color:#f5f5f5;color:rgba(0, 0, 0, 0.54);border:2px dashed #979797}verdocs-upload-dialog .drop-target p{margin:12px 0}verdocs-upload-dialog .drop-target.dragging-over{border:5px solid #4c56cb}verdocs-upload-dialog .drop-target>verdocs-button{margin:12px 0;display:inline-block}verdocs-upload-dialog .attachments{height:56px;font-size:0;margin:20px 0;padding:0 16px;line-height:56px;white-space:normal;-webkit-box-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.12), 0 0 2px 0 rgba(0, 0, 0, 0.14);box-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.12), 0 0 2px 0 rgba(0, 0, 0, 0.14)}verdocs-upload-dialog .attachments .attachment{gap:10px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}verdocs-upload-dialog .attachments .attachment .icon{width:18px;height:18px;line-height:18px}verdocs-upload-dialog .attachments .attachment .icon.trash{cursor:pointer}verdocs-upload-dialog .attachments .attachment .name{-ms-flex:1;flex:1;font-size:14px;overflow:hidden;font-weight:400;white-space:nowrap;text-overflow:ellipsis}";
 const VerdocsUploadDialogStyle0 = verdocsUploadDialogCss;
 
 const TrashIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" /></svg>`;
@@ -15,6 +16,7 @@ const VerdocsUploadDialog = /*@__PURE__*/ proxyCustomElement(class VerdocsUpload
         this.remove = createEvent(this, "remove", 7);
         this.existingFile = undefined;
         this.draggingOver = false;
+        this.confirmDelete = false;
         this.selectedFiles = [];
     }
     handleCancel() {
@@ -48,11 +50,15 @@ const VerdocsUploadDialog = /*@__PURE__*/ proxyCustomElement(class VerdocsUpload
         newFiles.splice(index, 1);
         this.selectedFiles = newFiles;
     }
-    handleDeleteAttachment() {
+    handleDeleteAttachment(e) {
         var _a;
-        // TODO: Discuss how we want to delete up to the server
+        // Stop the parent from seeing "next" and thinking an upload was done.
+        // TODO: Rethink having so many commonalities in nested dialogs (next/exit).
+        e.preventDefault();
+        e.stopPropagation();
         (_a = this.remove) === null || _a === void 0 ? void 0 : _a.emit();
         this.existingFile = null;
+        this.confirmDelete = false;
     }
     handleSelectFile() {
         var _a;
@@ -63,19 +69,27 @@ const VerdocsUploadDialog = /*@__PURE__*/ proxyCustomElement(class VerdocsUpload
         this.selectedFiles = Array.from((_a = this.fileInput) === null || _a === void 0 ? void 0 : _a.files);
     }
     render() {
-        return (h(Host, { key: 'ea7aaec178e0708c73e6ad4f12253f4ff73b9310' }, h("div", { key: '7d769afe448df6edfb40800bc08237d60c924d95', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: 'cd32c34e98c48b1e48b1792bead1634ca70df871', class: "dialog" }, h("div", { key: 'eb7f1782c643b531c2ff6faf17e2248f803cde39', class: "heading" }, "Upload attachment"), this.selectedFiles.length < 1 && this.existingFile && (h(Fragment, { key: '2feac9b495828147f2be51e2368c7d03b039f64a' }, h("div", { key: '9ead90c769215c71bd952bb585a3cbde16c7e518', class: "current-label" }, "Current Attachment"), h("div", { key: '671e35179c26f14823ae504a1fc40f4506117e2e', class: "attachments", style: { marginTop: '0' } }, h("div", { key: '2ae16fe846ee84db2f0fdb2cfb39d1e0a30f85f2', class: "attachment" }, h("div", { key: '8db0145b16b3568d7fd5e1287a4a81b3a8822c3f', class: "icon", innerHTML: PaperclipIcon }), h("div", { key: '5c9c54ce036cec26e721fc32e4a9c8326735f221', class: "name" }, this.existingFile.name), h("div", { key: '99c17d1a88f6f8c07b346b37836969c60c1ee31d', class: "icon trash", innerHTML: TrashIcon, onClick: () => this.handleDeleteAttachment() }))))), this.selectedFiles.length < 1 && !this.existingFile && (h("div", { key: 'eec6e965857fca674db531ebad805c6931a2daf2', class: { 'drop-target': true, 'dragging-over': this.draggingOver }, onDragOver: e => this.handleDragOver(e), onDragLeave: e => this.handleDragLeave(e), onDrop: e => this.handleDrop(e) }, h("p", { key: '4dc240eacbd3724a54f6613113d98f5446c6c478' }, "Drag and drop a ", !!this.existingFile && 'replacement', " here..."), h("p", { key: 'af261cba2d009aa6733891e670029e4a2fec6a4d' }, "- or -"), h("verdocs-button", { key: 'f922efbffa39aa22b58b30b50697f17edcdd0f48', label: !!this.existingFile ? 'Replace file...' : 'Select a file...', onClick: () => this.handleSelectFile() }), h("input", { key: '504ae2231657a1ff6f27405b789c239f41f4fdce', type: "file", ref: el => (this.fileInput = el), style: { display: 'none' }, onChange: () => this.handleFileChange() }))), this.selectedFiles.length > 0 && (h("div", { key: 'e225969a1e6073a883e3e47fbeeec1bf88085f82', class: "attachments" }, this.selectedFiles.map((file, index) => (h("div", { class: "attachment" }, h("div", { class: "icon", innerHTML: PaperclipIcon }), h("div", { class: "name" }, file.name), h("div", { class: "icon trash", innerHTML: TrashIcon, onClick: () => this.handleRemoveAttachment(index) })))))), h("div", { key: 'b34ab1a0be4e5b7bfeb9f52b2e4820e8dce3a40a', class: "buttons" }, h("verdocs-button", { key: '9e35669d8a39a493b53434d680d66745610d4828', label: "Cancel", variant: "outline", onClick: () => this.handleCancel() }), h("verdocs-button", { key: '9b41014e538eecdec86221c637c09c8f00b9b3af', label: "Upload", onClick: () => this.handleDone(), disabled: this.selectedFiles.length < 1 }))))));
+        var _a;
+        const existingFile = ((_a = this.existingFile) === null || _a === void 0 ? void 0 : _a.name) ? this.existingFile : null;
+        return (h(Host, { key: '1659eb29f75e9bf3866a011a1ce39767f045e58c' }, h("div", { key: '764f802db78676a02d17fbf2ee93dd859c90494c', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: 'c28580308a52defdd648f197aa5d1e74a1ff366c', class: "upload-dialog-content" }, h("div", { key: '6de50a3f71d93a176b4db5a248a49da4cf8d404d', class: "heading" }, "Upload attachment"), this.selectedFiles.length < 1 && existingFile && (h(Fragment, { key: '0882e3e5cae1dae105645f6f4b5dd8986c336e1f' }, h("div", { key: 'a762a4dbf4f1be8a29d637e6bee196ab4b960c60', class: "current-label" }, "Current Attachment"), h("div", { key: 'ada0b184bb53583dc6012ab5393be2a36714eba4', class: "attachments", style: { marginTop: '0' } }, h("div", { key: '3d9555cf0f7876ba192e3efec76bf677eec137cf', class: "attachment" }, h("div", { key: 'cea6d0e30448b6ea003a32d838bd64d642a621f3', class: "icon", innerHTML: PaperclipIcon }), h("div", { key: '20b87ade4eb56de78db2e0c1a7fe5c1f88d9f2c7', class: "name" }, existingFile.name), h("div", { key: '6359ea1dffd674d708afcd6b1e4f5be38062b861', class: "icon trash", innerHTML: TrashIcon, onClick: () => (this.confirmDelete = true) }))))), this.selectedFiles.length < 1 && !existingFile && (h("div", { key: 'c554239826339af3008fd9b4ef235efe6b4bf138', class: { 'drop-target': true, 'dragging-over': this.draggingOver }, onDragOver: e => this.handleDragOver(e), onDragLeave: e => this.handleDragLeave(e), onDrop: e => this.handleDrop(e) }, h("p", { key: 'a2bcc388981e79a1c6c3325081546ea41d7fd96f' }, "Drag and drop a ", !!existingFile && 'replacement', " here..."), h("p", { key: '23c7c1e2c8c369a8b85d83fc9a7d2e03bd26f6d9' }, "- or -"), h("verdocs-button", { key: 'cba655d0b392f5f03776f769cd3ee626b432b846', label: !!existingFile ? 'Replace file...' : 'Select a file...', onClick: () => this.handleSelectFile() }), h("input", { key: 'cbaa00e587959f418709c89b531a173512f5b9fa', type: "file", ref: el => (this.fileInput = el), style: { display: 'none' }, onChange: () => this.handleFileChange() }))), this.selectedFiles.length > 0 && (h("div", { key: '35f7be5ad20ecab5947c2f90f4ac529775ec51ce', class: "attachments" }, this.selectedFiles.map((file, index) => (h("div", { class: "attachment" }, h("div", { class: "icon", innerHTML: PaperclipIcon }), h("div", { class: "name" }, file.name), h("div", { class: "icon trash", innerHTML: TrashIcon, onClick: () => this.handleRemoveAttachment(index) })))))), h("div", { key: 'ea437cefbfa71cd4853f4fd77d1d1a78b576e032', class: "buttons" }, h("verdocs-button", { key: '2be19df5ae677ee0d0893266fd2f72aeff609e95', label: "Cancel", variant: "outline", onClick: () => this.handleCancel() }), h("verdocs-button", { key: '2013efb5dba9d6b3236ad280dbc6883473eebabf', label: "Upload", onClick: () => this.handleDone(), disabled: this.selectedFiles.length < 1 })))), this.confirmDelete && (h("verdocs-ok-dialog", { key: 'd55cbad44c7d50d9c479a87917b14fc0ae488a2b', heading: "Delete Attachment?", message: "Are you sure you wish to delete this attachment? This action cannot be undone.", showCancel: true, onExit: e => {
+                // So we don't close the upload dialog
+                e.preventDefault();
+                e.stopPropagation();
+                this.confirmDelete = false;
+            }, onNext: e => this.handleDeleteAttachment(e) }))));
     }
     static get style() { return VerdocsUploadDialogStyle0; }
 }, [0, "verdocs-upload-dialog", {
         "existingFile": [1032, "existing-file"],
         "draggingOver": [32],
+        "confirmDelete": [32],
         "selectedFiles": [32]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["verdocs-upload-dialog", "verdocs-button"];
+    const components = ["verdocs-upload-dialog", "verdocs-button", "verdocs-ok-dialog"];
     components.forEach(tagName => { switch (tagName) {
         case "verdocs-upload-dialog":
             if (!customElements.get(tagName)) {
@@ -83,6 +97,11 @@ function defineCustomElement() {
             }
             break;
         case "verdocs-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "verdocs-ok-dialog":
             if (!customElements.get(tagName)) {
                 defineCustomElement$1();
             }

package/dist/esm/index-a68c7262.js

@@ -180,14 +180,14 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
                     return import(
                       /* webpackMode: "lazy" */
                       './verdocs-spinner.entry.js').then(processMod, consoleError);
-                case 'verdocs-ok-dialog':
-                    return import(
-                      /* webpackMode: "lazy" */
-                      './verdocs-ok-dialog.entry.js').then(processMod, consoleError);
                 case 'verdocs-loader':
                     return import(
                       /* webpackMode: "lazy" */
                       './verdocs-loader.entry.js').then(processMod, consoleError);
+                case 'verdocs-ok-dialog':
+                    return import(
+                      /* webpackMode: "lazy" */
+                      './verdocs-ok-dialog.entry.js').then(processMod, consoleError);
                 case 'verdocs-checkbox_4':
                     return import(
                       /* webpackMode: "lazy" */