@verdocs/web-sdk 4.2.137 → 4.2.138

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -305,10 +305,10 @@ const VerdocsSend = class {
305
305
  const allRolesAssigned = rolesAssigned.length >= roleNames.length;
306
306
  console.log('[SEND] Roles completed', this.rolesCompleted);
307
307
  return (index.h(index.Host, { class: { sendable: (_b = (_a = this.templateStore) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.is_sendable } }, index.h("div", { class: "recipients" }, index.h("div", { class: "left-line" }), index.h("div", { class: `level level-start` }, this.getLevelIcon(-1), index.h("div", { class: "complete" }, "Send Envelope")), levels.map(level => (index.h("div", { class: `level level-${level}` }, this.getLevelIcon(level), this.getRolesAtLevel(level).map(role => {
308
- var _a, _b, _c, _d, _e, _f;
308
+ var _a, _b, _c, _d;
309
309
  const unknown = !role.email;
310
310
  const elId = `verdocs-send-recipient-${role.role_name}`;
311
- return unknown ? (index.h("div", { class: "recipient", "data-ri": TemplateRoleStore.getRoleIndex(this.roleStore, role.role_name), "data-rn": role.role_name, style: { backgroundColor: jsSdk.getRGBA(TemplateRoleStore.getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, (_b = (_a = this.rolesCompleted[role.id]) === null || _a === void 0 ? void 0 : _a.first_name) !== null && _b !== void 0 ? _b : role.role_name, index.h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (index.h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, index.h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: (_c = this.rolesCompleted[role.id]) !== null && _c !== void 0 ? _c : role, onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } }))))) : (index.h("div", { class: "recipient", style: { borderColor: jsSdk.getRGBA(TemplateRoleStore.getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, (_e = (_d = this.rolesCompleted[role.id]) === null || _d === void 0 ? void 0 : _d.first_name) !== null && _e !== void 0 ? _e : role.first_name, index.h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (index.h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, index.h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: ((_f = this.rolesCompleted[role.id]) !== null && _f !== void 0 ? _f : role), onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } })))));
311
+ return unknown ? (index.h("div", { class: "recipient", "data-ri": TemplateRoleStore.getRoleIndex(this.roleStore, role.role_name), "data-rn": role.role_name, style: { backgroundColor: jsSdk.getRGBA(TemplateRoleStore.getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, ((_a = this.rolesCompleted[role.id]) === null || _a === void 0 ? void 0 : _a.first_name) ? jsSdk.formatFullName(this.rolesCompleted[role.id]) : role.role_name, index.h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (index.h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, index.h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: (_b = this.rolesCompleted[role.id]) !== null && _b !== void 0 ? _b : role, onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } }))))) : (index.h("div", { class: "recipient", style: { borderColor: jsSdk.getRGBA(TemplateRoleStore.getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, ((_c = this.rolesCompleted[role.id]) === null || _c === void 0 ? void 0 : _c.first_name) ? jsSdk.formatFullName(this.rolesCompleted[role.id]) : role.role_name, index.h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (index.h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, index.h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: ((_d = this.rolesCompleted[role.id]) !== null && _d !== void 0 ? _d : role), onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } })))));
312
312
  })))), index.h("div", { class: `level level-done` }, this.getLevelIcon(levels.length), index.h("div", { class: "complete" }, "Signing Complete"))), index.h("div", { class: "buttons" }, index.h("verdocs-button", { label: "Cancel", size: "small", variant: "outline", onClick: e => this.handleCancel(e), disabled: this.sending }), index.h("verdocs-button", { label: "Send", size: "small", disabled: !allRolesAssigned || this.sending, onClick: e => this.handleSend(e) }), this.sending && index.h("verdocs-spinner", null))));
313
313
  }
314
314
  static get watchers() { return {
@@ -1,5 +1,5 @@
1
1
  import { h, Host } from "@stencil/core";
2
- import { createEnvelope, getOrganizationContacts, getRGBA, isValidEmail, isValidPhone, VerdocsEndpoint, } from "@verdocs/js-sdk";
2
+ import { createEnvelope, formatFullName, getOrganizationContacts, getRGBA, isValidEmail, isValidPhone, VerdocsEndpoint, } from "@verdocs/js-sdk";
3
3
  import { getRoleIndex, getRoleNames, getTemplateRoleStore } from "../../../utils/TemplateRoleStore";
4
4
  import { getTemplateStore } from "../../../utils/TemplateStore";
5
5
  import { SDKError } from "../../../utils/errors";
@@ -218,10 +218,10 @@ export class VerdocsSend {
218
218
  const allRolesAssigned = rolesAssigned.length >= roleNames.length;
219
219
  console.log('[SEND] Roles completed', this.rolesCompleted);
220
220
  return (h(Host, { class: { sendable: (_b = (_a = this.templateStore) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.is_sendable } }, h("div", { class: "recipients" }, h("div", { class: "left-line" }), h("div", { class: `level level-start` }, this.getLevelIcon(-1), h("div", { class: "complete" }, "Send Envelope")), levels.map(level => (h("div", { class: `level level-${level}` }, this.getLevelIcon(level), this.getRolesAtLevel(level).map(role => {
221
- var _a, _b, _c, _d, _e, _f;
221
+ var _a, _b, _c, _d;
222
222
  const unknown = !role.email;
223
223
  const elId = `verdocs-send-recipient-${role.role_name}`;
224
- return unknown ? (h("div", { class: "recipient", "data-ri": getRoleIndex(this.roleStore, role.role_name), "data-rn": role.role_name, style: { backgroundColor: getRGBA(getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, (_b = (_a = this.rolesCompleted[role.id]) === null || _a === void 0 ? void 0 : _a.first_name) !== null && _b !== void 0 ? _b : role.role_name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: (_c = this.rolesCompleted[role.id]) !== null && _c !== void 0 ? _c : role, onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } }))))) : (h("div", { class: "recipient", style: { borderColor: getRGBA(getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, (_e = (_d = this.rolesCompleted[role.id]) === null || _d === void 0 ? void 0 : _d.first_name) !== null && _e !== void 0 ? _e : role.first_name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: ((_f = this.rolesCompleted[role.id]) !== null && _f !== void 0 ? _f : role), onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } })))));
224
+ return unknown ? (h("div", { class: "recipient", "data-ri": getRoleIndex(this.roleStore, role.role_name), "data-rn": role.role_name, style: { backgroundColor: getRGBA(getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, ((_a = this.rolesCompleted[role.id]) === null || _a === void 0 ? void 0 : _a.first_name) ? formatFullName(this.rolesCompleted[role.id]) : role.role_name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: (_b = this.rolesCompleted[role.id]) !== null && _b !== void 0 ? _b : role, onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } }))))) : (h("div", { class: "recipient", style: { borderColor: getRGBA(getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, ((_c = this.rolesCompleted[role.id]) === null || _c === void 0 ? void 0 : _c.first_name) ? formatFullName(this.rolesCompleted[role.id]) : role.role_name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: ((_d = this.rolesCompleted[role.id]) !== null && _d !== void 0 ? _d : role), onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } })))));
225
225
  })))), h("div", { class: `level level-done` }, this.getLevelIcon(levels.length), h("div", { class: "complete" }, "Signing Complete"))), h("div", { class: "buttons" }, h("verdocs-button", { label: "Cancel", size: "small", variant: "outline", onClick: e => this.handleCancel(e), disabled: this.sending }), h("verdocs-button", { label: "Send", size: "small", disabled: !allRolesAssigned || this.sending, onClick: e => this.handleSend(e) }), this.sending && h("verdocs-spinner", null))));
226
226
  }
227
227
  static get is() { return "verdocs-send"; }
@@ -1,5 +1,5 @@
1
1
  import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
2
- import { VerdocsEndpoint, getOrganizationContacts, createEnvelope, isValidEmail, isValidPhone, getRGBA } from '@verdocs/js-sdk';
2
+ import { VerdocsEndpoint, getOrganizationContacts, createEnvelope, isValidEmail, isValidPhone, getRGBA, formatFullName } from '@verdocs/js-sdk';
3
3
  import { g as getTemplateRoleStore, b as getRoleNames, a as getRoleIndex } from './TemplateRoleStore.js';
4
4
  import { g as getTemplateStore } from './TemplateStore.js';
5
5
  import { S as SDKError } from './errors.js';
@@ -220,10 +220,10 @@ const VerdocsSend = /*@__PURE__*/ proxyCustomElement(class VerdocsSend extends H
220
220
  const allRolesAssigned = rolesAssigned.length >= roleNames.length;
221
221
  console.log('[SEND] Roles completed', this.rolesCompleted);
222
222
  return (h(Host, { class: { sendable: (_b = (_a = this.templateStore) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.is_sendable } }, h("div", { class: "recipients" }, h("div", { class: "left-line" }), h("div", { class: `level level-start` }, this.getLevelIcon(-1), h("div", { class: "complete" }, "Send Envelope")), levels.map(level => (h("div", { class: `level level-${level}` }, this.getLevelIcon(level), this.getRolesAtLevel(level).map(role => {
223
- var _a, _b, _c, _d, _e, _f;
223
+ var _a, _b, _c, _d;
224
224
  const unknown = !role.email;
225
225
  const elId = `verdocs-send-recipient-${role.role_name}`;
226
- return unknown ? (h("div", { class: "recipient", "data-ri": getRoleIndex(this.roleStore, role.role_name), "data-rn": role.role_name, style: { backgroundColor: getRGBA(getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, (_b = (_a = this.rolesCompleted[role.id]) === null || _a === void 0 ? void 0 : _a.first_name) !== null && _b !== void 0 ? _b : role.role_name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: (_c = this.rolesCompleted[role.id]) !== null && _c !== void 0 ? _c : role, onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } }))))) : (h("div", { class: "recipient", style: { borderColor: getRGBA(getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, (_e = (_d = this.rolesCompleted[role.id]) === null || _d === void 0 ? void 0 : _d.first_name) !== null && _e !== void 0 ? _e : role.first_name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: ((_f = this.rolesCompleted[role.id]) !== null && _f !== void 0 ? _f : role), onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } })))));
226
+ return unknown ? (h("div", { class: "recipient", "data-ri": getRoleIndex(this.roleStore, role.role_name), "data-rn": role.role_name, style: { backgroundColor: getRGBA(getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, ((_a = this.rolesCompleted[role.id]) === null || _a === void 0 ? void 0 : _a.first_name) ? formatFullName(this.rolesCompleted[role.id]) : role.role_name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: (_b = this.rolesCompleted[role.id]) !== null && _b !== void 0 ? _b : role, onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } }))))) : (h("div", { class: "recipient", style: { borderColor: getRGBA(getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, ((_c = this.rolesCompleted[role.id]) === null || _c === void 0 ? void 0 : _c.first_name) ? formatFullName(this.rolesCompleted[role.id]) : role.role_name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: ((_d = this.rolesCompleted[role.id]) !== null && _d !== void 0 ? _d : role), onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } })))));
227
227
  })))), h("div", { class: `level level-done` }, this.getLevelIcon(levels.length), h("div", { class: "complete" }, "Signing Complete"))), h("div", { class: "buttons" }, h("verdocs-button", { label: "Cancel", size: "small", variant: "outline", onClick: e => this.handleCancel(e), disabled: this.sending }), h("verdocs-button", { label: "Send", size: "small", disabled: !allRolesAssigned || this.sending, onClick: e => this.handleSend(e) }), this.sending && h("verdocs-spinner", null))));
228
228
  }
229
229
  static get watchers() { return {
@@ -1,5 +1,5 @@
1
1
  import { r as registerInstance, c as createEvent, h, H as Host, F as Fragment, g as getElement } from './index-a68c7262.js';
2
- import { VerdocsEndpoint, integerSequence, getOrganizationContacts, createEnvelope, isValidEmail, isValidPhone, getRGBA, createTemplateDocument, deleteTemplateDocument, createTemplate, updateField, createField, updateTemplate, updateTemplateRole, createTemplateRole, formatFullName } from '@verdocs/js-sdk';
2
+ import { VerdocsEndpoint, integerSequence, getOrganizationContacts, createEnvelope, isValidEmail, isValidPhone, getRGBA, formatFullName, createTemplateDocument, deleteTemplateDocument, createTemplate, updateField, createField, updateTemplate, updateTemplateRole, createTemplateRole } from '@verdocs/js-sdk';
3
3
  import { g as getTemplateFieldStore, u as updateStoreField } from './TemplateFieldStore-68bf6acd.js';
4
4
  import { g as getTemplateRoleStore, b as getRoleNames, a as getRoleIndex, u as updateStoreRole } from './TemplateRoleStore-6d1bec83.js';
5
5
  import { g as getTemplateStore } from './TemplateStore-8151aa18.js';
@@ -301,10 +301,10 @@ const VerdocsSend = class {
301
301
  const allRolesAssigned = rolesAssigned.length >= roleNames.length;
302
302
  console.log('[SEND] Roles completed', this.rolesCompleted);
303
303
  return (h(Host, { class: { sendable: (_b = (_a = this.templateStore) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.is_sendable } }, h("div", { class: "recipients" }, h("div", { class: "left-line" }), h("div", { class: `level level-start` }, this.getLevelIcon(-1), h("div", { class: "complete" }, "Send Envelope")), levels.map(level => (h("div", { class: `level level-${level}` }, this.getLevelIcon(level), this.getRolesAtLevel(level).map(role => {
304
- var _a, _b, _c, _d, _e, _f;
304
+ var _a, _b, _c, _d;
305
305
  const unknown = !role.email;
306
306
  const elId = `verdocs-send-recipient-${role.role_name}`;
307
- return unknown ? (h("div", { class: "recipient", "data-ri": getRoleIndex(this.roleStore, role.role_name), "data-rn": role.role_name, style: { backgroundColor: getRGBA(getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, (_b = (_a = this.rolesCompleted[role.id]) === null || _a === void 0 ? void 0 : _a.first_name) !== null && _b !== void 0 ? _b : role.role_name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: (_c = this.rolesCompleted[role.id]) !== null && _c !== void 0 ? _c : role, onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } }))))) : (h("div", { class: "recipient", style: { borderColor: getRGBA(getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, (_e = (_d = this.rolesCompleted[role.id]) === null || _d === void 0 ? void 0 : _d.first_name) !== null && _e !== void 0 ? _e : role.first_name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: ((_f = this.rolesCompleted[role.id]) !== null && _f !== void 0 ? _f : role), onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } })))));
307
+ return unknown ? (h("div", { class: "recipient", "data-ri": getRoleIndex(this.roleStore, role.role_name), "data-rn": role.role_name, style: { backgroundColor: getRGBA(getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, ((_a = this.rolesCompleted[role.id]) === null || _a === void 0 ? void 0 : _a.first_name) ? formatFullName(this.rolesCompleted[role.id]) : role.role_name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: (_b = this.rolesCompleted[role.id]) !== null && _b !== void 0 ? _b : role, onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } }))))) : (h("div", { class: "recipient", style: { borderColor: getRGBA(getRoleIndex(this.roleStore, role.role_name)) }, onClick: e => this.handleClickRole(e, role), id: elId }, ((_c = this.rolesCompleted[role.id]) === null || _c === void 0 ? void 0 : _c.first_name) ? formatFullName(this.rolesCompleted[role.id]) : role.role_name, h("div", { class: "icon", innerHTML: editIcon }), this.showPickerForId === role.id && (h("verdocs-portal", { anchor: elId, onClickAway: () => (this.showPickerForId = '') }, h("verdocs-contact-picker", { onExit: () => (this.showPickerForId = ''), onNext: e => this.handleSelectContact(e, role), contactSuggestions: this.sessionContacts, templateRole: ((_d = this.rolesCompleted[role.id]) !== null && _d !== void 0 ? _d : role), onSearchContacts: e => { var _a; return (_a = this.searchContacts) === null || _a === void 0 ? void 0 : _a.emit(e.detail); } })))));
308
308
  })))), h("div", { class: `level level-done` }, this.getLevelIcon(levels.length), h("div", { class: "complete" }, "Signing Complete"))), h("div", { class: "buttons" }, h("verdocs-button", { label: "Cancel", size: "small", variant: "outline", onClick: e => this.handleCancel(e), disabled: this.sending }), h("verdocs-button", { label: "Send", size: "small", disabled: !allRolesAssigned || this.sending, onClick: e => this.handleSend(e) }), this.sending && h("verdocs-spinner", null))));
309
309
  }
310
310
  static get watchers() { return {