@verdocs/web-sdk 1.9.6 → 1.9.10

package/dist/cjs/verdocs-template-create_4.cjs.entry.js

@@ -3,49 +3,26 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-1329d89c.js');
-const Pages = require('./Pages-1baca663.js');
 const Templates = require('./Templates-eb100ab3.js');
+const TemplateDocuments = require('./TemplateDocuments-01c6e570.js');
 const Types = require('./Types-da57ce69.js');
-const VerdocsEndpoint = require('./VerdocsEndpoint-0dcde19d.js');
+const VerdocsEndpoint = require('./VerdocsEndpoint-db38e942.js');
 const errors = require('./errors-0396da3d.js');
 const Colors = require('./Colors-e809dcc9.js');
 const utils = require('./utils-84236321.js');
 const templateStore = require('./templateStore-92828c3c.js');
-const Templates$1 = require('./Templates-038bcae4.js');
-
-/**
- * A TemplateDocument represents a PDF or other attachment in a Template.
- *
- * @module
- */
-/**
- * Create a Document for a particular Template.
- *
- * ```typescript
- * import {TemplateDocument} from '@verdocs/js-sdk/Templates';
- *
- * await TemplateDocument.createDocument((VerdocsEndpoint.getDefault(), templateID, params);
- * ```
- */
-var createTemplateDocument = function (endpoint, templateId, file, onUploadProgress) {
-    var formData = new FormData();
-    formData.append('document', file, file.name);
-    return endpoint.api //
-        .post("/templates/".concat(templateId, "/documents"), formData, {
-        timeout: 10000,
-        onUploadProgress: function (event) { return onUploadProgress === null || onUploadProgress === void 0 ? void 0 : onUploadProgress(Math.floor((event.loaded * 100) / event.total), event.loaded, event.total); },
-    })
-        .then(function (r) { return r.data; });
-};
+const Templates$1 = require('./Templates-399073ea.js');
 
 const verdocsTemplateCreateCss = "verdocs-template-create{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-template-create form{background-color:#ffffff;padding:12px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}verdocs-template-create form .upload-box{max-width:320px;text-align:center;padding:44px 18px 66px;border:2px dashed #979797;color:rgba(0, 0, 0, 0.54)}verdocs-template-create form .upload-box svg{width:64px;fill:#5c6575}verdocs-template-create .buttons{display:-ms-flexbox;display:flex;-webkit-column-gap:8px;-moz-column-gap:8px;column-gap:8px;margin-top:16px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end}verdocs-template-create .buttons .flex-fill{-ms-flex:1;flex:1}verdocs-template-create ::-webkit-input-placeholder{color:#aaaaaa}verdocs-template-create ::-moz-placeholder{color:#aaaaaa}verdocs-template-create :-ms-input-placeholder{color:#aaaaaa}verdocs-template-create ::-ms-input-placeholder{color:#aaaaaa}verdocs-template-create ::placeholder{color:#aaaaaa}";
 
+// import {ITemplate, ITemplateDocument} from '@verdocs/js-sdk/Templates/Types';
+// import {createPage} from '@verdocs/js-sdk/Templates/Pages';
 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 VerdocsTemplateCreate = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.cancel = index.createEvent(this, "cancel", 7);
-    this.templateCreated = index.createEvent(this, "templateCreated", 7);
+    this.next = index.createEvent(this, "next", 7);
     this.sdkError = index.createEvent(this, "sdkError", 7);
     this.endpoint = VerdocsEndpoint.VerdocsEndpoint.getDefault();
     this.file = undefined;
@@ -78,15 +55,16 @@ const VerdocsTemplateCreate = class {
     try {
       const template = await Templates.createTemplate(this.endpoint, { name: this.file.name });
       console.log('created template', template);
-      const template_document = await createTemplateDocument(this.endpoint, template.id, this.file);
+      const template_document = await TemplateDocuments.createTemplateDocument(this.endpoint, template.id, this.file);
       console.log('created document', template_document);
-      for await (let pageNumber of Array.from(Array(template_document.page_numbers).keys(), n => n + 1)) {
-        console.log('Updating page', pageNumber);
-        const page = await Pages.createPage(this.endpoint, template.id, { sequence: pageNumber, page_number: pageNumber, document_id: template_document.id });
-        console.log('Created page', page);
-      }
-      (_a = this.templateCreated) === null || _a === void 0 ? void 0 : _a.emit({ template, template_document });
-      // this.fileUploaded?.emit({filePath: this.filePath});
+      const finalTemplate = await Templates.getTemplate(this.endpoint, template.id);
+      console.log('[CREATE] Created template', finalTemplate);
+      // for await (let pageNumber of Array.from(Array(template_document.page_numbers).keys(), n => n + 1)) {
+      //   console.log('Updating page', pageNumber);
+      //   const page = await createPage(this.endpoint, template.id, {sequence: pageNumber, page_number: pageNumber, document_id: template_document.id});
+      //   console.log('Created page', page);
+      // }
+      (_a = this.next) === null || _a === void 0 ? void 0 : _a.emit(finalTemplate);
     }
     catch (e) {
       console.log('[TEMPLATE-CREATE] Error creating template', e);
@@ -94,7 +72,7 @@ const VerdocsTemplateCreate = class {
     }
   }
   render() {
-    return (index.h("form", { onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, index.h("input", { type: "file", id: "verdocs-template-create-file", multiple: true, accept: "application/pdf", style: { display: 'none' }, onChange: e => this.handleFileChanged(e) }), index.h("div", { class: "upload-box" }, index.h("div", null, index.h("span", { innerHTML: FileIcon })), index.h("div", { style: { marginTop: '20px', fontSize: '20px', fontWeight: 'bold' } }, "Drag a file here"), index.h("div", { style: { marginTop: '20px', marginBottom: '20px', fontSize: '16px' } }, "Or, if you prefer..."), index.h("verdocs-button", { label: "Select a file from your computer", size: "small", onPress: e => this.handleUpload(e) })), index.h("div", { class: "buttons" }, index.h("verdocs-button", { variant: "outline", label: "Cancel", size: "small", onPress: e => this.handleCancel(e) }), index.h("verdocs-button", { label: "Next", size: "small", onPress: e => this.handleSubmit(e), disabled: !this.file }))));
+    return (index.h("form", { onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, index.h("input", { type: "file", id: "verdocs-template-create-file", multiple: true, accept: "application/pdf", style: { display: 'none' }, onChange: e => this.handleFileChanged(e) }), index.h("div", { class: "upload-box" }, index.h("div", null, index.h("span", { innerHTML: FileIcon })), index.h("div", { style: { marginTop: '20px', fontSize: '20px', fontWeight: 'bold' } }, "Drag a file here"), index.h("div", { style: { marginTop: '20px', marginBottom: '20px', fontSize: '16px' } }, "Or, if you prefer..."), index.h("verdocs-button", { label: "Select a file from your computer", size: "small", onClick: e => this.handleUpload(e) })), index.h("div", { class: "buttons" }, index.h("verdocs-button", { variant: "outline", label: "Cancel", size: "small", onClick: e => this.handleCancel(e) }), index.h("verdocs-button", { label: "Next", size: "small", onClick: e => this.handleSubmit(e), disabled: !this.file }))));
   }
 };
 VerdocsTemplateCreate.style = verdocsTemplateCreateCss;
@@ -156,7 +134,7 @@ const iconInitial = '<svg xmlns="http://www.w3.org/2000/svg" height="24" width="
 const VerdocsTemplateFields = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    this.settingsUpdated = index.createEvent(this, "settingsUpdated", 7);
+    this.next = index.createEvent(this, "next", 7);
     this.cancel = index.createEvent(this, "cancel", 7);
     this.sdkError = index.createEvent(this, "sdkError", 7);
     this.endpoint = VerdocsEndpoint.VerdocsEndpoint.getDefault();
@@ -180,7 +158,7 @@ const VerdocsTemplateFields = class {
       }
     }
     catch (e) {
-      console.log('[PREVIEW] Error with preview session', e);
+      console.log('[FIELDS] Error with preview session', e);
       (_d = this.sdkError) === null || _d === void 0 ? void 0 : _d.emit(new errors.SDKError(e.message, (_e = e.response) === null || _e === void 0 ? void 0 : _e.status, (_f = e.response) === null || _f === void 0 ? void 0 : _f.data));
     }
   }
@@ -192,19 +170,18 @@ const VerdocsTemplateFields = class {
     this.toolbarEl.style.width = `${this.page0El.clientWidth}px`;
   }
   async handleFieldChange(field, e, optionId) {
-    console.log('[PREVIEW] handleFieldChange', field, e, optionId);
+    console.log('[FIELDS] handleFieldChange', field, e, optionId);
   }
   handlePageRendered(e) {
     const pageInfo = e.detail;
-    console.log('[PREVIEW] Page rendered', pageInfo);
+    console.log('[FIELDS] Page rendered', pageInfo);
     const fields = templateStore.state.fields.filter(field => field.page_sequence === pageInfo.renderedPage.pageNumber);
     // const fields = this.fields.filter(field => field.page_sequence === pageInfo.renderedPage.pageNumber);
-    console.log('[PREVIEW] Fields on page', fields);
+    console.log('[FIELDS] Fields on page', fields);
     fields.forEach(field => {
       const el = utils.renderDocumentField(field, pageInfo.renderedPage, utils.getRoleIndex(templateStore.state.roleNames, field.role_name), this.handleFieldChange, true, true, true);
       // const el = renderDocumentField(field, pageInfo.renderedPage, getRoleIndex(this.roles, field.role_name), this.handleFieldChange, true, true, true);
       if (!el) {
-        console.log('Skipping partially rendered field', field);
         return;
       }
       el.addEventListener('recipientChanged', e => {
@@ -216,10 +193,9 @@ const VerdocsTemplateFields = class {
       interact(el).draggable({
         listeners: {
           start(event) {
-            console.log('drag started', event.type, event.target);
+            console.log('[FIELDS] Drag started', event.type, event.target);
           },
           move(event) {
-            console.log('moved');
             const oldX = +(event.target.getAttribute('posX') || 0);
             const oldY = +(event.target.getAttribute('posY') || 0);
             const xScale = +(event.target.getAttribute('xScale') || 1);
@@ -231,7 +207,7 @@ const VerdocsTemplateFields = class {
             updateCssTransform(event.target, 'translate', `${newX}px, ${newY}px`);
           },
           end(event) {
-            console.log('ended', event);
+            console.log('[FIELDS] Drag ended', event);
             // event.target.setAttribute('posX', 0);
             // event.target.setAttribute('posy', 0);
             // updateCssTransform(event.target, 'translate', `${0}px, ${0}px`);
@@ -256,7 +232,7 @@ const VerdocsTemplateFields = class {
     if (templateStore.state.loading) {
       return (index.h(index.Host, null, index.h("verdocs-loader", null)));
     }
-    return (index.h(index.Host, null, templateStore.state.template ? (index.h(index.Fragment, null, index.h("div", { class: "fields-bar", ref: el => (this.toolbarEl = el) }, index.h("div", { class: "label" }, "Add Field:"), index.h("verdocs-toolbar-icon", { icon: iconSingleline, text: "Single-line Text Box", onPress: () => console.log('single press') }), index.h("verdocs-toolbar-icon", { icon: iconMultiline, text: "Multi-line Text Box", onPress: () => console.log('multi press') }), index.h("verdocs-toolbar-icon", { icon: iconCheck, text: "Checkbox", onPress: () => console.log('check press') }), index.h("verdocs-toolbar-icon", { icon: iconRadio, text: "Radio Button", onPress: () => console.log('radio press') }), index.h("verdocs-toolbar-icon", { icon: iconDatepicker, text: "Date Picker", onPress: () => console.log('date press') }), index.h("verdocs-toolbar-icon", { icon: iconSignature, text: "Signature", onPress: () => console.log('signature press') }), index.h("verdocs-toolbar-icon", { icon: iconInitial, text: "Initials", onPress: () => console.log('initial press') }), index.h("div", { style: { flex: '1' } }), index.h("button", { onClick: () => console.log('save'), disabled: true, class: "operation" }, "Save"), index.h("button", { onClick: () => console.log('close'), class: "operation" }, "Close")), index.h("div", { class: "page-0", ref: el => (this.page0El = el) }, index.h("div", { class: "user-placed-fields" }, index.h("div", { class: "title" }, "User-Placed Fields"), index.h("verdocs-field-signature", { field: testField, style: { width: '82px', height: '41px', left: '20px', top: '40px', transform: 'scale(1,1)', backgroundColor: Colors.getRGBA(0) }, moveable: true, editable: true }))), index.h("verdocs-view", { templateId: this.templateId, endpoint: this.endpoint, onPageRendered: e => this.handlePageRendered(e), pageLayers: [
+    return (index.h(index.Host, null, templateStore.state.template ? (index.h(index.Fragment, null, index.h("div", { class: "fields-bar", ref: el => (this.toolbarEl = el) }, index.h("div", { class: "label" }, "Add Field:"), index.h("verdocs-toolbar-icon", { icon: iconSingleline, text: "Single-line Text Box", onClick: () => console.log('single press') }), index.h("verdocs-toolbar-icon", { icon: iconMultiline, text: "Multi-line Text Box", onClick: () => console.log('multi press') }), index.h("verdocs-toolbar-icon", { icon: iconCheck, text: "Checkbox", onClick: () => console.log('check press') }), index.h("verdocs-toolbar-icon", { icon: iconRadio, text: "Radio Button", onClick: () => console.log('radio press') }), index.h("verdocs-toolbar-icon", { icon: iconDatepicker, text: "Date Picker", onClick: () => console.log('date press') }), index.h("verdocs-toolbar-icon", { icon: iconSignature, text: "Signature", onClick: () => console.log('signature press') }), index.h("verdocs-toolbar-icon", { icon: iconInitial, text: "Initials", onClick: () => console.log('initial press') }), index.h("div", { style: { flex: '1' } }), index.h("button", { onClick: () => { var _a; return (_a = this.next) === null || _a === void 0 ? void 0 : _a.emit(templateStore.state.template); }, disabled: true, class: "operation" }, "Save"), index.h("button", { onClick: () => { var _a; return (_a = this.cancel) === null || _a === void 0 ? void 0 : _a.emit(); }, class: "operation" }, "Close")), index.h("div", { class: "page-0", ref: el => (this.page0El = el) }, index.h("div", { class: "user-placed-fields" }, index.h("div", { class: "title" }, "User-Placed Fields"), index.h("verdocs-field-signature", { field: testField, style: { width: '82px', height: '41px', left: '20px', top: '40px', transform: 'scale(1,1)', backgroundColor: Colors.getRGBA(0) }, moveable: true, editable: true }))), index.h("verdocs-view", { templateId: this.templateId, endpoint: this.endpoint, onPageRendered: e => this.handlePageRendered(e), pageLayers: [
         { name: 'page', type: 'canvas' },
         { name: 'controls', type: 'div' },
       ] }))) : (index.h("div", null, "Error loading Template. Please try again later."))));
@@ -270,12 +246,13 @@ const VerdocsTemplateProperties = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.cancel = index.createEvent(this, "cancel", 7);
-    this.settingsUpdated = index.createEvent(this, "settingsUpdated", 7);
+    this.next = index.createEvent(this, "next", 7);
     this.sdkError = index.createEvent(this, "sdkError", 7);
     this.endpoint = VerdocsEndpoint.VerdocsEndpoint.getDefault();
     this.templateId = '';
     this.template = null;
     this.name = '';
+    this.visibility = '';
     this.sendReminders = false;
     this.firstReminderDays = '1';
     this.reminderDays = '1';
@@ -301,10 +278,6 @@ const VerdocsTemplateProperties = class {
       (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(new errors.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));
     }
   }
-  handleMessageChange(e) {
-    console.log(e);
-    // this.message = e.target.value;
-  }
   handleCancel(e) {
     var _a;
     e.stopPropagation();
@@ -313,20 +286,15 @@ const VerdocsTemplateProperties = class {
   handleSubmit(e) {
     var _a;
     e.stopPropagation();
-    (_a = this.settingsUpdated) === null || _a === void 0 ? void 0 : _a.emit();
-    // this.contactSelected?.emit({
-    //   delegator: this.delegator,
-    // });
+    (_a = this.next) === null || _a === void 0 ? void 0 : _a.emit({
+      name: this.name,
+      firstReminderDays: +this.firstReminderDays,
+      reminderDays: +this.reminderDays,
+      sendReminders: this.sendReminders,
+    });
   }
   render() {
-    console.log('vals', { firstReminderDays: this.firstReminderDays, reminderDays: this.reminderDays, name: this.name });
-    return (index.h("form", { onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, index.h("h5", null, "Template Name"), index.h("fieldset", null, index.h("verdocs-text-input", { value: this.name, autocomplete: "off", onInput: (e) => {
-        this.name = e.target.value;
-      } })), index.h("h5", null, "Reminders"), index.h("fieldset", null, index.h("div", { class: "input-row" }, index.h("label", null, "Send Automatic Reminders"), index.h("verdocs-checkbox", { name: "automatic-reminders", checked: this.sendReminders, value: "on", onSelected: e => (this.sendReminders = e.detail.value === 'on') })), index.h("div", { class: "input-row" }, index.h("label", null, "Days Before First Reminder"), index.h("verdocs-text-input", { value: this.firstReminderDays, onInput: (e) => {
-        this.firstReminderDays = e.target.value;
-      } })), index.h("div", { class: "input-row" }, index.h("label", null, "Days Between Reminders"), index.h("verdocs-text-input", { value: this.reminderDays, onInput: (e) => {
-        this.firstReminderDays = e.target.value;
-      } }))), index.h("h5", null, "Template Visibility"), index.h("fieldset", null, index.h("div", { class: "radio-row" }, index.h("verdocs-radio-button", { name: "visibility", checked: true, value: "private" }), index.h("label", { htmlFor: "verdocs-radio-button-visibility-private" }, index.h("div", { class: "title" }, "Private"), index.h("div", { class: "description" }, "Only you can share and use this template"))), index.h("div", { class: "radio-row" }, index.h("verdocs-radio-button", { name: "visibility", checked: true, value: "shared" }), index.h("label", { htmlFor: "verdocs-radio-button-visibility-shared" }, index.h("div", { class: "title" }, "Shared to your organization"), index.h("div", { class: "description" }, "Give access to your organization to share and use this template"))), index.h("div", { class: "radio-row" }, index.h("verdocs-radio-button", { name: "visibility", checked: true, value: "shared_public" }), index.h("label", { htmlFor: "verdocs-radio-button-visibility-shared_public" }, index.h("div", { class: "title" }, "Shared to your organization and Public"), index.h("div", { class: "description" }, "Give access to your organization to share this template, and anyone on the Web can find and use this template"))), index.h("div", { class: "radio-row" }, index.h("verdocs-radio-button", { name: "visibility", checked: true, value: "public" }), index.h("label", { htmlFor: "verdocs-radio-button-visibility-public" }, index.h("div", { class: "title" }, "Public"), index.h("div", { class: "description" }, "Anyone on the Web can find and use this template")))), index.h("div", { class: "buttons" }, index.h("div", { class: "flex-fill" }), index.h("verdocs-button", { variant: "outline", label: "Cancel", size: "small", onPress: e => this.handleCancel(e) }), index.h("verdocs-button", { label: "OK", size: "small", onPress: e => this.handleSubmit(e) }))));
+    return (index.h("form", { onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, index.h("h5", null, "Template Name"), index.h("fieldset", null, index.h("verdocs-text-input", { value: this.name, autocomplete: "off", onInput: (e) => (this.name = e.target.value) })), index.h("h5", null, "Reminders"), index.h("fieldset", null, index.h("div", { class: "input-row" }, index.h("label", null, "Send Automatic Reminders"), index.h("verdocs-checkbox", { name: "automatic-reminders", checked: this.sendReminders, value: "on", onInput: (e) => (this.sendReminders = e.target.checked) })), index.h("div", { class: "input-row" }, index.h("label", null, "Days Before First Reminder"), index.h("verdocs-text-input", { value: this.firstReminderDays, onInput: (e) => (this.firstReminderDays = e.target.value) })), index.h("div", { class: "input-row" }, index.h("label", null, "Days Between Reminders"), index.h("verdocs-text-input", { value: this.reminderDays, onInput: (e) => (this.reminderDays = e.target.value) }))), index.h("h5", null, "Template Visibility"), index.h("fieldset", null, index.h("div", { class: "radio-row" }, index.h("verdocs-radio-button", { name: "visibility", checked: true, value: "private", onChange: () => (this.visibility = 'private') }), index.h("label", { htmlFor: "verdocs-radio-button-visibility-private" }, index.h("div", { class: "title" }, "Private"), index.h("div", { class: "description" }, "Only you can share and use this template"))), index.h("div", { class: "radio-row" }, index.h("verdocs-radio-button", { name: "visibility", checked: true, value: "shared", onChange: () => (this.visibility = 'shared') }), index.h("label", { htmlFor: "verdocs-radio-button-visibility-shared" }, index.h("div", { class: "title" }, "Shared to your organization"), index.h("div", { class: "description" }, "Give access to your organization to share and use this template"))), index.h("div", { class: "radio-row" }, index.h("verdocs-radio-button", { name: "visibility", checked: true, value: "shared_public", onChange: () => (this.visibility = 'shared_public') }), index.h("label", { htmlFor: "verdocs-radio-button-visibility-shared_public" }, index.h("div", { class: "title" }, "Shared to your organization and Public"), index.h("div", { class: "description" }, "Give access to your organization to share this template, and anyone on the Web can find and use this template"))), index.h("div", { class: "radio-row" }, index.h("verdocs-radio-button", { name: "visibility", checked: this.visibility === 'public', value: "public", onChange: () => (this.visibility = 'public') }), index.h("label", { htmlFor: "verdocs-radio-button-visibility-public" }, index.h("div", { class: "title" }, "Public"), index.h("div", { class: "description" }, "Anyone on the Web can find and use this template")))), index.h("div", { class: "buttons" }, index.h("div", { class: "flex-fill" }), index.h("verdocs-button", { variant: "outline", label: "Cancel", size: "small", onClick: e => this.handleCancel(e) }), index.h("verdocs-button", { label: "OK", size: "small", onClick: e => this.handleSubmit(e) }))));
   }
 };
 VerdocsTemplateProperties.style = verdocsTemplatePropertiesCss;
@@ -354,8 +322,7 @@ const VerdocsTemplateRecipients = class {
     index.registerInstance(this, hostRef);
     this.searchContacts = index.createEvent(this, "searchContacts", 7);
     this.cancel = index.createEvent(this, "cancel", 7);
-    this.settingsUpdated = index.createEvent(this, "settingsUpdated", 7);
-    this.contactSelected = index.createEvent(this, "contactSelected", 7);
+    this.next = index.createEvent(this, "next", 7);
     this.sequences = [];
     this.rolesAtSequence = {};
     this.endpoint = VerdocsEndpoint.VerdocsEndpoint.getDefault();
@@ -516,17 +483,16 @@ const VerdocsTemplateRecipients = class {
     (_a = this.cancel) === null || _a === void 0 ? void 0 : _a.emit();
   }
   handleSubmit(e) {
-    var _a, _b;
+    var _a;
     e.stopPropagation();
     this.showSuggestions = false;
-    (_a = this.contactSelected) === null || _a === void 0 ? void 0 : _a.emit({
+    (_a = this.next) === null || _a === void 0 ? void 0 : _a.emit({
       full_name: this.name,
       email: this.email,
       phone: this.phone,
       message: this.message,
       delegator: this.delegator,
     });
-    (_b = this.settingsUpdated) === null || _b === void 0 ? void 0 : _b.emit({});
   }
   render() {
     console.log('ordered roles', JSON.parse(JSON.stringify(this.orderedRoles)));
@@ -535,9 +501,9 @@ const VerdocsTemplateRecipients = class {
     return (index.h("form", { onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, index.h("h5", null, "Participant Order"), index.h("div", { class: "participants" }, index.h("div", { class: "left-line" }), index.h("div", { class: "row" }, index.h("div", { class: "icon", innerHTML: startIcon }), index.h("div", { class: "sender" }, index.h("span", { class: "label" }, "Sender:"), " ", senderLabels[this.sender], ' ', index.h("div", { class: "settings-button", innerHTML: settingsIcon, onClick: () => (this.showingSenderDialog = true), "aria-role": "button" }))), this.sequences.map(sequence => (index.h("div", { class: "row" }, index.h("div", { class: "icon", innerHTML: stepIcon }), index.h("div", { class: "dropzone", "data-order": beforeOrder, "data-sequence": sequence }), this.rolesAtSequence[sequence].map(role => {
       beforeOrder = role.order;
       return (index.h(index.Fragment, null, index.h("div", { class: "recipient", style: { backgroundColor: Colors.getRGBA(utils.getRoleIndex(roleNames, role.name)) }, "data-rolename": role.name }, role.name, " ", index.h("div", { class: "settings-button", innerHTML: settingsIcon, onClick: () => (this.showingSenderDialog = true), "aria-role": "button" })), index.h("div", { class: "dropzone", "data-order": beforeOrder, "data-sequence": sequence })));
-    })))), index.h("div", { class: "row" }, index.h("div", { class: "icon", innerHTML: doneIcon }), index.h("div", { class: "complete" }, "Document Complete"))), index.h("div", { class: "buttons" }, index.h("div", { class: "flex-fill" }), index.h("verdocs-button", { variant: "outline", label: "Cancel", size: "small", onPress: e => this.handleCancel(e) }), index.h("verdocs-button", { label: "OK", size: "small", onPress: e => this.handleSubmit(e) })), this.showingSenderDialog && (index.h("verdocs-template-sender-dialog", { open: true, value: this.sender, onCancel: () => (this.showingSenderDialog = false), onDone: e => {
+    })))), index.h("div", { class: "row" }, index.h("div", { class: "icon", innerHTML: doneIcon }), index.h("div", { class: "complete" }, "Document Complete"))), index.h("div", { class: "buttons" }, index.h("div", { class: "flex-fill" }), index.h("verdocs-button", { variant: "outline", label: "Cancel", size: "small", onClick: e => this.handleCancel(e) }), index.h("verdocs-button", { label: "OK", size: "small", onClick: e => this.handleSubmit(e) })), this.showingSenderDialog && (index.h("verdocs-template-sender-dialog", { value: this.sender, onCancel: () => (this.showingSenderDialog = false), onNext: e => {
         this.showingSenderDialog = false;
-        this.sender = e.detail.sender;
+        this.sender = e.detail;
       } }))));
   }
 };