@verdocs/web-sdk 5.0.17 → 5.0.19

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.
Files changed (199) hide show
  1. package/dist/cjs/{Datastore-4448f6ef.js → Datastore-931fd77e.js} +7 -4
  2. package/dist/cjs/Datastore-931fd77e.js.map +1 -0
  3. package/dist/cjs/verdocs-build.cjs.entry.js +1 -1
  4. package/dist/cjs/verdocs-checkbox_6.cjs.entry.js +1 -1
  5. package/dist/cjs/verdocs-envelope-recipient-link_2.cjs.entry.js +1 -1
  6. package/dist/cjs/verdocs-envelope-recipient-summary.cjs.entry.js +1 -1
  7. package/dist/cjs/verdocs-envelope-sidebar.cjs.entry.js +1 -1
  8. package/dist/cjs/verdocs-field-attachment_13.cjs.entry.js +5 -6
  9. package/dist/cjs/verdocs-field-attachment_13.cjs.entry.js.map +1 -1
  10. package/dist/cjs/verdocs-field-payment.cjs.entry.js +1 -1
  11. package/dist/cjs/verdocs-kba-dialog_2.cjs.entry.js +1 -1
  12. package/dist/cjs/verdocs-menu-panel_2.cjs.entry.js +1 -1
  13. package/dist/cjs/verdocs-preview_6.cjs.entry.js +18 -15
  14. package/dist/cjs/verdocs-preview_6.cjs.entry.js.map +1 -1
  15. package/dist/cjs/verdocs-sign.cjs.entry.js +1 -1
  16. package/dist/cjs/verdocs-template-document-page_2.cjs.entry.js +1 -1
  17. package/dist/collection/components/fields/verdocs-field-date/verdocs-field-date.js +3 -1
  18. package/dist/collection/components/fields/verdocs-field-date/verdocs-field-date.js.map +1 -1
  19. package/dist/collection/components/fields/verdocs-field-signature/verdocs-field-signature.js +0 -1
  20. package/dist/collection/components/fields/verdocs-field-signature/verdocs-field-signature.js.map +1 -1
  21. package/dist/collection/components/fields/verdocs-field-textbox/verdocs-field-textbox.js +1 -3
  22. package/dist/collection/components/fields/verdocs-field-textbox/verdocs-field-textbox.js.map +1 -1
  23. package/dist/collection/components/templates/verdocs-template-roles/verdocs-template-roles.css +1 -1
  24. package/dist/collection/components/templates/verdocs-template-roles/verdocs-template-roles.js +16 -13
  25. package/dist/collection/components/templates/verdocs-template-roles/verdocs-template-roles.js.map +1 -1
  26. package/dist/components/{p-78043e4b.js → p-02ebfef0.js} +20 -17
  27. package/dist/components/p-02ebfef0.js.map +1 -0
  28. package/dist/components/{p-d9a2e920.js → p-1ab01232.js} +3 -3
  29. package/dist/components/{p-d9a2e920.js.map → p-1ab01232.js.map} +1 -1
  30. package/dist/components/{p-efa3b8ac.js → p-1ce18a42.js} +2 -2
  31. package/dist/components/{p-efa3b8ac.js.map → p-1ce18a42.js.map} +1 -1
  32. package/dist/components/{p-c662e5f4.js → p-1f0f5448.js} +2 -2
  33. package/dist/components/{p-c662e5f4.js.map → p-1f0f5448.js.map} +1 -1
  34. package/dist/components/{p-0ed0ac8b.js → p-28e3b2e3.js} +14 -14
  35. package/dist/components/{p-0ed0ac8b.js.map → p-28e3b2e3.js.map} +1 -1
  36. package/dist/components/{p-9bcf9620.js → p-2d8b46e5.js} +2 -2
  37. package/dist/components/{p-9bcf9620.js.map → p-2d8b46e5.js.map} +1 -1
  38. package/dist/components/{p-58d027d1.js → p-3828cb31.js} +7 -4
  39. package/dist/components/p-3828cb31.js.map +1 -0
  40. package/dist/components/{p-314d698d.js → p-53168eec.js} +2 -2
  41. package/dist/components/{p-314d698d.js.map → p-53168eec.js.map} +1 -1
  42. package/dist/components/{p-5e378f0e.js → p-681e7dd4.js} +3 -4
  43. package/dist/components/p-681e7dd4.js.map +1 -0
  44. package/dist/components/{p-14c80ae8.js → p-91d65fde.js} +3 -3
  45. package/dist/components/{p-14c80ae8.js.map → p-91d65fde.js.map} +1 -1
  46. package/dist/components/{p-d8340641.js → p-a415ce22.js} +3 -3
  47. package/dist/components/{p-d8340641.js.map → p-a415ce22.js.map} +1 -1
  48. package/dist/components/{p-022b87d3.js → p-b8885b5c.js} +2 -2
  49. package/dist/components/{p-022b87d3.js.map → p-b8885b5c.js.map} +1 -1
  50. package/dist/components/{p-5182136e.js → p-c4c9feda.js} +3 -3
  51. package/dist/components/{p-5182136e.js.map → p-c4c9feda.js.map} +1 -1
  52. package/dist/components/{p-2ddf4d5b.js → p-e4799d51.js} +3 -3
  53. package/dist/components/{p-2ddf4d5b.js.map → p-e4799d51.js.map} +1 -1
  54. package/dist/components/{p-261521bc.js → p-e4a97ad5.js} +3 -3
  55. package/dist/components/{p-261521bc.js.map → p-e4a97ad5.js.map} +1 -1
  56. package/dist/components/{p-176a07b2.js → p-e9528d9f.js} +6 -4
  57. package/dist/components/{p-176a07b2.js.map → p-e9528d9f.js.map} +1 -1
  58. package/dist/components/{p-a55f08ad.js → p-e95ded6b.js} +14 -14
  59. package/dist/components/{p-a55f08ad.js.map → p-e95ded6b.js.map} +1 -1
  60. package/dist/components/{p-7cd6c0ce.js → p-eb12a71c.js} +2 -2
  61. package/dist/components/{p-7cd6c0ce.js.map → p-eb12a71c.js.map} +1 -1
  62. package/dist/components/{p-6c4fe42c.js → p-eb2ad8d0.js} +2 -2
  63. package/dist/components/{p-6c4fe42c.js.map → p-eb2ad8d0.js.map} +1 -1
  64. package/dist/components/{p-c1159428.js → p-ecfc85ae.js} +4 -6
  65. package/dist/components/p-ecfc85ae.js.map +1 -0
  66. package/dist/components/{p-211fa3e2.js → p-f6156f7a.js} +3 -3
  67. package/dist/components/{p-211fa3e2.js.map → p-f6156f7a.js.map} +1 -1
  68. package/dist/components/{p-c76fab71.js → p-fcf13666.js} +13 -13
  69. package/dist/components/{p-c76fab71.js.map → p-fcf13666.js.map} +1 -1
  70. package/dist/components/verdocs-build.js +20 -20
  71. package/dist/components/verdocs-envelope-recipient-link.js +1 -1
  72. package/dist/components/verdocs-envelope-recipient-summary.js +1 -1
  73. package/dist/components/verdocs-envelope-sidebar.js +2 -2
  74. package/dist/components/verdocs-field-attachment.js +1 -1
  75. package/dist/components/verdocs-field-checkbox.js +1 -1
  76. package/dist/components/verdocs-field-date.js +1 -1
  77. package/dist/components/verdocs-field-dropdown.js +1 -1
  78. package/dist/components/verdocs-field-initial.js +1 -1
  79. package/dist/components/verdocs-field-payment.js +2 -2
  80. package/dist/components/verdocs-field-radio.js +1 -1
  81. package/dist/components/verdocs-field-signature.js +1 -1
  82. package/dist/components/verdocs-field-textarea.js +1 -1
  83. package/dist/components/verdocs-field-textbox.js +1 -1
  84. package/dist/components/verdocs-field-timestamp.js +1 -1
  85. package/dist/components/verdocs-preview.js +1 -1
  86. package/dist/components/verdocs-send.js +1 -1
  87. package/dist/components/verdocs-sign.js +2 -2
  88. package/dist/components/verdocs-template-attachments.js +1 -1
  89. package/dist/components/verdocs-template-build-tabs.js +1 -1
  90. package/dist/components/verdocs-template-document-page.js +1 -1
  91. package/dist/components/verdocs-template-field-properties.js +1 -1
  92. package/dist/components/verdocs-template-fields.js +1 -1
  93. package/dist/components/verdocs-template-role-properties.js +1 -1
  94. package/dist/components/verdocs-template-roles.js +1 -1
  95. package/dist/components/verdocs-view.js +1 -1
  96. package/dist/esm/{Datastore-b55570ff.js → Datastore-3f924d94.js} +7 -4
  97. package/dist/esm/Datastore-3f924d94.js.map +1 -0
  98. package/dist/esm/verdocs-build.entry.js +1 -1
  99. package/dist/esm/verdocs-checkbox_6.entry.js +1 -1
  100. package/dist/esm/verdocs-envelope-recipient-link_2.entry.js +1 -1
  101. package/dist/esm/verdocs-envelope-recipient-summary.entry.js +1 -1
  102. package/dist/esm/verdocs-envelope-sidebar.entry.js +1 -1
  103. package/dist/esm/verdocs-field-attachment_13.entry.js +5 -6
  104. package/dist/esm/verdocs-field-attachment_13.entry.js.map +1 -1
  105. package/dist/esm/verdocs-field-payment.entry.js +1 -1
  106. package/dist/esm/verdocs-kba-dialog_2.entry.js +1 -1
  107. package/dist/esm/verdocs-menu-panel_2.entry.js +1 -1
  108. package/dist/esm/verdocs-preview_6.entry.js +18 -15
  109. package/dist/esm/verdocs-preview_6.entry.js.map +1 -1
  110. package/dist/esm/verdocs-sign.entry.js +1 -1
  111. package/dist/esm/verdocs-template-document-page_2.entry.js +1 -1
  112. package/dist/esm-es5/{Datastore-b55570ff.js → Datastore-3f924d94.js} +2 -2
  113. package/dist/esm-es5/Datastore-3f924d94.js.map +1 -0
  114. package/dist/esm-es5/verdocs-build.entry.js +1 -1
  115. package/dist/esm-es5/verdocs-checkbox_6.entry.js +1 -1
  116. package/dist/esm-es5/verdocs-envelope-recipient-link_2.entry.js +1 -1
  117. package/dist/esm-es5/verdocs-envelope-recipient-summary.entry.js +1 -1
  118. package/dist/esm-es5/verdocs-envelope-sidebar.entry.js +1 -1
  119. package/dist/esm-es5/verdocs-field-attachment_13.entry.js +1 -1
  120. package/dist/esm-es5/verdocs-field-attachment_13.entry.js.map +1 -1
  121. package/dist/esm-es5/verdocs-field-payment.entry.js +1 -1
  122. package/dist/esm-es5/verdocs-kba-dialog_2.entry.js +1 -1
  123. package/dist/esm-es5/verdocs-menu-panel_2.entry.js +1 -1
  124. package/dist/esm-es5/verdocs-preview_6.entry.js +2 -2
  125. package/dist/esm-es5/verdocs-preview_6.entry.js.map +1 -1
  126. package/dist/esm-es5/verdocs-sign.entry.js +1 -1
  127. package/dist/esm-es5/verdocs-template-document-page_2.entry.js +1 -1
  128. package/dist/types/components/fields/verdocs-field-signature/verdocs-field-signature.d.ts +2 -2
  129. package/dist/types/components/templates/verdocs-template-roles/verdocs-template-roles.d.ts +3 -0
  130. package/dist/verdocs-web-sdk/{p-19462841.system.entry.js → p-086ee7f1.system.entry.js} +2 -2
  131. package/dist/verdocs-web-sdk/{p-fedcc413.entry.js → p-1902bf04.entry.js} +2 -2
  132. package/dist/verdocs-web-sdk/{p-fda9c437.system.entry.js → p-208a8b41.system.entry.js} +2 -2
  133. package/dist/verdocs-web-sdk/{p-00ed440b.system.entry.js → p-2175c81a.system.entry.js} +2 -2
  134. package/dist/verdocs-web-sdk/{p-3cc50f0b.system.entry.js → p-26106576.system.entry.js} +2 -2
  135. package/dist/verdocs-web-sdk/{p-eb3ceb39.system.entry.js → p-32cf09f0.system.entry.js} +2 -2
  136. package/dist/verdocs-web-sdk/{p-99d5305a.system.entry.js → p-3417143a.system.entry.js} +3 -3
  137. package/dist/verdocs-web-sdk/p-3417143a.system.entry.js.map +1 -0
  138. package/dist/verdocs-web-sdk/{p-9021fc7b.system.entry.js → p-34c2298e.system.entry.js} +2 -2
  139. package/dist/verdocs-web-sdk/{p-58d027d1.js → p-3828cb31.js} +2 -2
  140. package/dist/verdocs-web-sdk/p-3828cb31.js.map +1 -0
  141. package/dist/verdocs-web-sdk/{p-dced30fa.entry.js → p-471fd78e.entry.js} +2 -2
  142. package/dist/verdocs-web-sdk/{p-17f35bcb.entry.js → p-60da8e6b.entry.js} +2 -2
  143. package/dist/verdocs-web-sdk/{p-35dcb386.system.js → p-65be7617.system.js} +2 -2
  144. package/dist/verdocs-web-sdk/p-65be7617.system.js.map +1 -0
  145. package/dist/verdocs-web-sdk/{p-e3077c5e.system.entry.js → p-6b2fc4bd.system.entry.js} +2 -2
  146. package/dist/verdocs-web-sdk/{p-8bdd951b.system.entry.js → p-7975ec40.system.entry.js} +2 -2
  147. package/dist/verdocs-web-sdk/p-7975ec40.system.entry.js.map +1 -0
  148. package/dist/verdocs-web-sdk/{p-277a93d5.entry.js → p-7ffebea3.entry.js} +2 -2
  149. package/dist/verdocs-web-sdk/p-7ffebea3.entry.js.map +1 -0
  150. package/dist/verdocs-web-sdk/{p-bbf30adc.system.entry.js → p-90690dde.system.entry.js} +2 -2
  151. package/dist/verdocs-web-sdk/{p-03399c69.entry.js → p-a4d94e2e.entry.js} +2 -2
  152. package/dist/verdocs-web-sdk/{p-d8d279a8.entry.js → p-b0bf5256.entry.js} +3 -3
  153. package/dist/verdocs-web-sdk/p-b0bf5256.entry.js.map +1 -0
  154. package/dist/verdocs-web-sdk/{p-882aa754.entry.js → p-c59aa521.entry.js} +2 -2
  155. package/dist/verdocs-web-sdk/{p-f2b16ddf.entry.js → p-cc230abf.entry.js} +2 -2
  156. package/dist/verdocs-web-sdk/{p-c2bca18a.entry.js → p-d4aff253.entry.js} +2 -2
  157. package/dist/verdocs-web-sdk/p-db1faf41.entry.js +2 -0
  158. package/dist/verdocs-web-sdk/{p-d23b5949.entry.js.map → p-db1faf41.entry.js.map} +1 -1
  159. package/dist/verdocs-web-sdk/{p-ea078594.system.entry.js → p-dc5c275f.system.entry.js} +2 -2
  160. package/dist/verdocs-web-sdk/p-e2b70dfb.system.js +1 -1
  161. package/dist/verdocs-web-sdk/{p-88baf4d1.entry.js → p-e84cf41e.entry.js} +2 -2
  162. package/dist/verdocs-web-sdk/{p-546daa8b.entry.js → p-f6ed768d.entry.js} +2 -2
  163. package/dist/verdocs-web-sdk/{p-41f22b0a.system.entry.js → p-ff048639.system.entry.js} +2 -2
  164. package/dist/verdocs-web-sdk/verdocs-web-sdk.esm.js +1 -1
  165. package/package.json +4 -4
  166. package/dist/cjs/Datastore-4448f6ef.js.map +0 -1
  167. package/dist/components/p-58d027d1.js.map +0 -1
  168. package/dist/components/p-5e378f0e.js.map +0 -1
  169. package/dist/components/p-78043e4b.js.map +0 -1
  170. package/dist/components/p-c1159428.js.map +0 -1
  171. package/dist/custom-elements.json +0 -2156
  172. package/dist/esm/Datastore-b55570ff.js.map +0 -1
  173. package/dist/esm-es5/Datastore-b55570ff.js.map +0 -1
  174. package/dist/verdocs-web-sdk/p-277a93d5.entry.js.map +0 -1
  175. package/dist/verdocs-web-sdk/p-35dcb386.system.js.map +0 -1
  176. package/dist/verdocs-web-sdk/p-58d027d1.js.map +0 -1
  177. package/dist/verdocs-web-sdk/p-8bdd951b.system.entry.js.map +0 -1
  178. package/dist/verdocs-web-sdk/p-99d5305a.system.entry.js.map +0 -1
  179. package/dist/verdocs-web-sdk/p-d23b5949.entry.js +0 -2
  180. package/dist/verdocs-web-sdk/p-d8d279a8.entry.js.map +0 -1
  181. /package/dist/verdocs-web-sdk/{p-19462841.system.entry.js.map → p-086ee7f1.system.entry.js.map} +0 -0
  182. /package/dist/verdocs-web-sdk/{p-fedcc413.entry.js.map → p-1902bf04.entry.js.map} +0 -0
  183. /package/dist/verdocs-web-sdk/{p-fda9c437.system.entry.js.map → p-208a8b41.system.entry.js.map} +0 -0
  184. /package/dist/verdocs-web-sdk/{p-00ed440b.system.entry.js.map → p-2175c81a.system.entry.js.map} +0 -0
  185. /package/dist/verdocs-web-sdk/{p-3cc50f0b.system.entry.js.map → p-26106576.system.entry.js.map} +0 -0
  186. /package/dist/verdocs-web-sdk/{p-eb3ceb39.system.entry.js.map → p-32cf09f0.system.entry.js.map} +0 -0
  187. /package/dist/verdocs-web-sdk/{p-9021fc7b.system.entry.js.map → p-34c2298e.system.entry.js.map} +0 -0
  188. /package/dist/verdocs-web-sdk/{p-dced30fa.entry.js.map → p-471fd78e.entry.js.map} +0 -0
  189. /package/dist/verdocs-web-sdk/{p-17f35bcb.entry.js.map → p-60da8e6b.entry.js.map} +0 -0
  190. /package/dist/verdocs-web-sdk/{p-e3077c5e.system.entry.js.map → p-6b2fc4bd.system.entry.js.map} +0 -0
  191. /package/dist/verdocs-web-sdk/{p-bbf30adc.system.entry.js.map → p-90690dde.system.entry.js.map} +0 -0
  192. /package/dist/verdocs-web-sdk/{p-03399c69.entry.js.map → p-a4d94e2e.entry.js.map} +0 -0
  193. /package/dist/verdocs-web-sdk/{p-882aa754.entry.js.map → p-c59aa521.entry.js.map} +0 -0
  194. /package/dist/verdocs-web-sdk/{p-f2b16ddf.entry.js.map → p-cc230abf.entry.js.map} +0 -0
  195. /package/dist/verdocs-web-sdk/{p-c2bca18a.entry.js.map → p-d4aff253.entry.js.map} +0 -0
  196. /package/dist/verdocs-web-sdk/{p-ea078594.system.entry.js.map → p-dc5c275f.system.entry.js.map} +0 -0
  197. /package/dist/verdocs-web-sdk/{p-88baf4d1.entry.js.map → p-e84cf41e.entry.js.map} +0 -0
  198. /package/dist/verdocs-web-sdk/{p-546daa8b.entry.js.map → p-f6ed768d.entry.js.map} +0 -0
  199. /package/dist/verdocs-web-sdk/{p-41f22b0a.system.entry.js.map → p-ff048639.system.entry.js.map} +0 -0
@@ -7,7 +7,7 @@ const jsSdk = require('@verdocs/js-sdk');
7
7
  const utils = require('./utils-746daf30.js');
8
8
  const Toast = require('./Toast-d84d7bd3.js');
9
9
  const errors = require('./errors-017fb835.js');
10
- const Datastore = require('./Datastore-4448f6ef.js');
10
+ const Datastore = require('./Datastore-931fd77e.js');
11
11
  require('./_commonjsHelpers-e6ff1d6e.js');
12
12
  require('./Types-7a726ff3.js');
13
13
  require('./format-dc0f3757.js');
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  const index = require('./index-ccac8641.js');
6
6
  const jsSdk = require('@verdocs/js-sdk');
7
7
  const utils = require('./utils-746daf30.js');
8
- const Datastore = require('./Datastore-4448f6ef.js');
8
+ const Datastore = require('./Datastore-931fd77e.js');
9
9
  const popper = require('./popper-31badbf8.js');
10
10
  require('./_commonjsHelpers-e6ff1d6e.js');
11
11
  require('./Types-7a726ff3.js');
@@ -37,6 +37,7 @@ export class VerdocsFieldDate {
37
37
  }, 500);
38
38
  }
39
39
  componentDidLoad() {
40
+ console.log('Activating date picker', this.containerId, document.getElementById(this.containerId));
40
41
  this.picker = new AirDatepicker(`#${this.containerId}`, {
41
42
  locale: localeEn,
42
43
  isMobile: true,
@@ -64,6 +65,7 @@ export class VerdocsFieldDate {
64
65
  // NOTE: We don't use a "date" field here because browsers vary widely in their formatting of it.
65
66
  render() {
66
67
  const { source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1 } = this;
68
+ console.log('Rendering date picker', source, sourceid, fieldname);
67
69
  const { index, field } = Store.getField(source, sourceid, fieldname, this.field);
68
70
  const { required = false, placeholder = 'Date...', value = '', label = '' } = field || {};
69
71
  const backgroundColor = getRGBA(index);
@@ -71,7 +73,7 @@ export class VerdocsFieldDate {
71
73
  if (this.done) {
72
74
  return h(Host, { class: { done } }, formattedValue);
73
75
  }
74
- return (h(Host, { class: { required, disabled, done, focused }, style: { backgroundColor } }, label && h("label", null, label), h("input", { name: fieldname, class: "input-el", type: "text", value: formattedValue, id: fieldname, disabled: disabled, placeholder: placeholder, onFocus: () => (this.focused = true), onBlur: () => (this.focused = false) }), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
76
+ return (h(Host, { class: { required, disabled, done, focused }, style: { backgroundColor } }, label && h("label", null, label), h("input", { name: fieldname, class: "input-el", type: "text", value: formattedValue, id: this.containerId, disabled: disabled, placeholder: placeholder, onFocus: () => (this.focused = true), onBlur: () => (this.focused = false) }), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
75
77
  e.stopPropagation();
76
78
  this.showingProperties = !this.showingProperties;
77
79
  } }), this.showingProperties && (h("verdocs-portal", { anchor: `verdocs-settings-panel-trigger-${field.name}`, onClickAway: () => (this.showingProperties = false) }, h("verdocs-template-field-properties", { templateId: sourceid, fieldName: fieldname, onClose: () => (this.showingProperties = false), onDelete: () => {
@@ -1 +1 @@
1
- {"version":3,"file":"verdocs-field-date.js","sourceRoot":"","sources":["../../../../src/components/fields/verdocs-field-date/verdocs-field-date.tsx"],"names":[],"mappings":"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","sourcesContent":["import {format} from 'date-fns';\nimport {getRGBA} from '@verdocs/js-sdk';\nimport AirDatepicker from 'air-datepicker';\nimport localeEn from 'air-datepicker/locale/en';\nimport type {ITemplateField} from '@verdocs/js-sdk';\nimport {Component, Element, Event, EventEmitter, h, Host, Method, Prop, Fragment, State} from '@stencil/core';\nimport {SettingsIcon} from '../../../utils/Icons';\nimport {FORMAT_DATE} from '../../../utils/Types';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Displays a date field. When tapped or clicked, the input element will display a date picker component.\n */\n@Component({\n tag: 'verdocs-field-date',\n styleUrl: 'verdocs-field-date.scss',\n shadow: false,\n})\nexport class VerdocsFieldDate {\n @Element()\n private hostEl: HTMLInputElement;\n\n /**\n * Fields may be attached to templates or envelopes, but only template fields may be edited.\n */\n @Prop({reflect: true}) source: 'template' | 'envelope' = 'template';\n\n /**\n * The source template or envelope ID the field is found in.\n */\n @Prop({reflect: true}) sourceid: string = '';\n\n /**\n * The name of the field to display.\n */\n @Prop({reflect: true}) fieldname: string = '';\n\n /**\n * If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n */\n @Prop({reflect: true}) disabled?: boolean = false;\n\n /**\n * If set, a settings icon will be displayed on hover. The settings shown allow the field's recipient and other settings to be\n * changed, so it should typically only be enabled in the Builder.\n */\n @Prop({reflect: true}) editable?: boolean = false;\n\n /**\n * If set, the field may be dragged to a new location. This should only be enabled in the Builder, or for self-placed fields.\n */\n @Prop({reflect: true}) moveable?: boolean = false;\n\n /**\n * If set, the field is considered \"done\" and is drawn in a display-final-value state.\n */\n @Prop({reflect: true}) done?: boolean = false;\n\n /**\n * If set, the field will be be scaled horizontally by this factor.\n */\n @Prop({reflect: true}) xscale?: number = 1;\n\n /**\n * If set, the field will be be scaled vertically by this factor.\n */\n @Prop({reflect: true}) yscale?: number = 1;\n\n /**\n * The page the field is on\n */\n @Prop({reflect: true}) pagenumber?: number = 1;\n\n /**\n * If set, the field will be be scaled vertically by this factor.\n */\n @Prop() field?: ITemplateField;\n\n /**\n * Event fired on every character entered into / deleted from the field.\n */\n @Event({composed: true}) settingsPress: EventEmitter;\n\n /**\n * Event fired when the field's settings are changed.\n */\n @Event({composed: true}) settingsChanged: EventEmitter<{fieldName: string; field: ITemplateField}>;\n\n /**\n * Event fired when the field is deleted.\n */\n @Event({composed: true}) deleted: EventEmitter<{fieldName: string}>;\n\n @State() containerId = `verdocs-date-picker-${Math.random().toString(36).substring(2, 11)}`;\n\n @State() showingProperties?: boolean = false;\n\n @Method()\n async focusField() {\n // Our input field is fake, so we fake the flash too\n this.focused = true;\n this.picker?.show();\n setTimeout(() => {\n this.focused = false;\n }, 500);\n }\n\n picker: AirDatepicker<HTMLElement> | null = null;\n\n componentDidLoad() {\n this.picker = new AirDatepicker<HTMLElement>(`#${this.containerId}`, {\n locale: localeEn,\n isMobile: true,\n autoClose: true,\n onShow: () => (this.focused = true),\n onHide: () => (this.focused = false),\n onSelect: ({date, formattedDate}) => {\n const event = new CustomEvent('fieldChange', {detail: {date, formattedDate}});\n this.hostEl.dispatchEvent(event);\n },\n });\n }\n\n @Method()\n async showSettingsPanel() {\n const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n if (settingsPanel && settingsPanel.showPanel) {\n settingsPanel.showPanel();\n }\n }\n\n @Method()\n async hideSettingsPanel() {\n const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n if (settingsPanel && settingsPanel.hidePanel) {\n settingsPanel.hidePanel();\n }\n }\n\n @State() focused?: boolean = false;\n\n // NOTE: We don't use a \"date\" field here because browsers vary widely in their formatting of it.\n render() {\n const {source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1} = this;\n\n const {index, field} = Store.getField(source, sourceid, fieldname, this.field);\n const {required = false, placeholder = 'Date...', value = '', label = ''} = field || {};\n const backgroundColor = getRGBA(index);\n\n const formattedValue = value ? format(new Date(value), FORMAT_DATE) : '';\n\n if (this.done) {\n return <Host class={{done}}>{formattedValue}</Host>;\n }\n\n return (\n <Host class={{required, disabled, done, focused}} style={{backgroundColor}}>\n {label && <label>{label}</label>}\n\n <input\n name={fieldname}\n class=\"input-el\"\n type=\"text\"\n value={formattedValue}\n id={fieldname}\n disabled={disabled}\n placeholder={placeholder}\n onFocus={() => (this.focused = true)}\n onBlur={() => (this.focused = false)}\n />\n\n {editable && (\n <Fragment>\n <div\n id={`verdocs-settings-panel-trigger-${fieldname}`}\n style={{transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})`}}\n class=\"settings-icon\"\n innerHTML={SettingsIcon}\n onClick={(e: any) => {\n e.stopPropagation();\n this.showingProperties = !this.showingProperties;\n }}\n />\n\n {this.showingProperties && (\n <verdocs-portal anchor={`verdocs-settings-panel-trigger-${field.name}`} onClickAway={() => (this.showingProperties = false)}>\n <verdocs-template-field-properties\n templateId={sourceid}\n fieldName={fieldname}\n onClose={() => (this.showingProperties = false)}\n onDelete={() => {\n this.deleted?.emit({fieldName: fieldname});\n return this.hideSettingsPanel();\n }}\n onSettingsChanged={e => {\n this.settingsChanged?.emit(e.detail);\n return this.hideSettingsPanel();\n }}\n helpText={'Date fields allow the user to select a date.'}\n />\n </verdocs-portal>\n )}\n </Fragment>\n )}\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"verdocs-field-date.js","sourceRoot":"","sources":["../../../../src/components/fields/verdocs-field-date/verdocs-field-date.tsx"],"names":[],"mappings":"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","sourcesContent":["import {format} from 'date-fns';\nimport {getRGBA} from '@verdocs/js-sdk';\nimport AirDatepicker from 'air-datepicker';\nimport localeEn from 'air-datepicker/locale/en';\nimport type {ITemplateField} from '@verdocs/js-sdk';\nimport {Component, Element, Event, EventEmitter, h, Host, Method, Prop, Fragment, State} from '@stencil/core';\nimport {SettingsIcon} from '../../../utils/Icons';\nimport {FORMAT_DATE} from '../../../utils/Types';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Displays a date field. When tapped or clicked, the input element will display a date picker component.\n */\n@Component({\n tag: 'verdocs-field-date',\n styleUrl: 'verdocs-field-date.scss',\n shadow: false,\n})\nexport class VerdocsFieldDate {\n @Element()\n private hostEl: HTMLInputElement;\n\n /**\n * Fields may be attached to templates or envelopes, but only template fields may be edited.\n */\n @Prop({reflect: true}) source: 'template' | 'envelope' = 'template';\n\n /**\n * The source template or envelope ID the field is found in.\n */\n @Prop({reflect: true}) sourceid: string = '';\n\n /**\n * The name of the field to display.\n */\n @Prop({reflect: true}) fieldname: string = '';\n\n /**\n * If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n */\n @Prop({reflect: true}) disabled?: boolean = false;\n\n /**\n * If set, a settings icon will be displayed on hover. The settings shown allow the field's recipient and other settings to be\n * changed, so it should typically only be enabled in the Builder.\n */\n @Prop({reflect: true}) editable?: boolean = false;\n\n /**\n * If set, the field may be dragged to a new location. This should only be enabled in the Builder, or for self-placed fields.\n */\n @Prop({reflect: true}) moveable?: boolean = false;\n\n /**\n * If set, the field is considered \"done\" and is drawn in a display-final-value state.\n */\n @Prop({reflect: true}) done?: boolean = false;\n\n /**\n * If set, the field will be be scaled horizontally by this factor.\n */\n @Prop({reflect: true}) xscale?: number = 1;\n\n /**\n * If set, the field will be be scaled vertically by this factor.\n */\n @Prop({reflect: true}) yscale?: number = 1;\n\n /**\n * The page the field is on\n */\n @Prop({reflect: true}) pagenumber?: number = 1;\n\n /**\n * If set, the field will be be scaled vertically by this factor.\n */\n @Prop() field?: ITemplateField;\n\n /**\n * Event fired on every character entered into / deleted from the field.\n */\n @Event({composed: true}) settingsPress: EventEmitter;\n\n /**\n * Event fired when the field's settings are changed.\n */\n @Event({composed: true}) settingsChanged: EventEmitter<{fieldName: string; field: ITemplateField}>;\n\n /**\n * Event fired when the field is deleted.\n */\n @Event({composed: true}) deleted: EventEmitter<{fieldName: string}>;\n\n @State() containerId = `verdocs-date-picker-${Math.random().toString(36).substring(2, 11)}`;\n\n @State() showingProperties?: boolean = false;\n\n @Method()\n async focusField() {\n // Our input field is fake, so we fake the flash too\n this.focused = true;\n this.picker?.show();\n setTimeout(() => {\n this.focused = false;\n }, 500);\n }\n\n picker: AirDatepicker<HTMLElement> | null = null;\n\n componentDidLoad() {\n console.log('Activating date picker', this.containerId, document.getElementById(this.containerId));\n this.picker = new AirDatepicker<HTMLElement>(`#${this.containerId}`, {\n locale: localeEn,\n isMobile: true,\n autoClose: true,\n onShow: () => (this.focused = true),\n onHide: () => (this.focused = false),\n onSelect: ({date, formattedDate}) => {\n const event = new CustomEvent('fieldChange', {detail: {date, formattedDate}});\n this.hostEl.dispatchEvent(event);\n },\n });\n }\n\n @Method()\n async showSettingsPanel() {\n const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n if (settingsPanel && settingsPanel.showPanel) {\n settingsPanel.showPanel();\n }\n }\n\n @Method()\n async hideSettingsPanel() {\n const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n if (settingsPanel && settingsPanel.hidePanel) {\n settingsPanel.hidePanel();\n }\n }\n\n @State() focused?: boolean = false;\n\n // NOTE: We don't use a \"date\" field here because browsers vary widely in their formatting of it.\n render() {\n const {source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1} = this;\n console.log('Rendering date picker', source, sourceid, fieldname);\n\n const {index, field} = Store.getField(source, sourceid, fieldname, this.field);\n const {required = false, placeholder = 'Date...', value = '', label = ''} = field || {};\n const backgroundColor = getRGBA(index);\n\n const formattedValue = value ? format(new Date(value), FORMAT_DATE) : '';\n\n if (this.done) {\n return <Host class={{done}}>{formattedValue}</Host>;\n }\n\n return (\n <Host class={{required, disabled, done, focused}} style={{backgroundColor}}>\n {label && <label>{label}</label>}\n\n <input\n name={fieldname}\n class=\"input-el\"\n type=\"text\"\n value={formattedValue}\n id={this.containerId}\n disabled={disabled}\n placeholder={placeholder}\n onFocus={() => (this.focused = true)}\n onBlur={() => (this.focused = false)}\n />\n\n {editable && (\n <Fragment>\n <div\n id={`verdocs-settings-panel-trigger-${fieldname}`}\n style={{transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})`}}\n class=\"settings-icon\"\n innerHTML={SettingsIcon}\n onClick={(e: any) => {\n e.stopPropagation();\n this.showingProperties = !this.showingProperties;\n }}\n />\n\n {this.showingProperties && (\n <verdocs-portal anchor={`verdocs-settings-panel-trigger-${field.name}`} onClickAway={() => (this.showingProperties = false)}>\n <verdocs-template-field-properties\n templateId={sourceid}\n fieldName={fieldname}\n onClose={() => (this.showingProperties = false)}\n onDelete={() => {\n this.deleted?.emit({fieldName: fieldname});\n return this.hideSettingsPanel();\n }}\n onSettingsChanged={e => {\n this.settingsChanged?.emit(e.detail);\n return this.hideSettingsPanel();\n }}\n helpText={'Date fields allow the user to select a date.'}\n />\n </verdocs-portal>\n )}\n </Fragment>\n )}\n </Host>\n );\n }\n}\n"]}
@@ -70,7 +70,6 @@ export class VerdocsFieldSignature {
70
70
  render() {
71
71
  const { source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1 } = this;
72
72
  const { index, field } = Store.getField(source, sourceid, fieldname, this.field);
73
- console.log('Signature field', index, getRGBA(index), field);
74
73
  const { required = false, value = '', label = '', settings = {} } = field || {};
75
74
  const { base64 } = settings;
76
75
  const backgroundColor = getRGBA(index);
@@ -1 +1 @@
1
- {"version":3,"file":"verdocs-field-signature.js","sourceRoot":"","sources":["../../../../src/components/fields/verdocs-field-signature/verdocs-field-signature.tsx"],"names":[],"mappings":"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","sourcesContent":["import {ITemplateField, getRGBA, IEnvelopeField} from '@verdocs/js-sdk';\nimport {Component, h, Host, Prop, Event, EventEmitter, Method, Fragment, State} from '@stencil/core';\nimport {SettingsIcon} from '../../../utils/Icons';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Displays a signature field. If a signature already exists, it will be displayed and the field\n * will be disabled. Otherwise, a placeholder button will be shown. Clicking the button will\n * show a dialog to adopt a signature.\n *\n * NOTE: When signature fields are completed they will be filled with a signature \"stamp\".\n * This requires operation against a live, valid envelope. If you are testing this component\n * in Storybook, it will not be visible here.\n */\n@Component({\n tag: 'verdocs-field-signature',\n styleUrl: 'verdocs-field-signature.scss',\n shadow: false,\n})\nexport class VerdocsFieldSignature {\n /**\n * Fields may be attached to templates or envelopes, but only template fields may be edited.\n */\n @Prop({reflect: true}) source: 'template' | 'envelope' = 'template';\n\n /**\n * The source template or envelope ID the field is found in.\n */\n @Prop({reflect: true}) sourceid: string = '';\n\n /**\n * The name of the field to display.\n */\n @Prop({reflect: true}) fieldname: string = '';\n\n /**\n * Override the field's settings. This is intended to be used during signing when fields are being\n * mutated.\n */\n @Prop() field: IEnvelopeField | null | undefined = null;\n\n /**\n * If set, the signature creation dialog will be initialized with this text.\n */\n @Prop({reflect: true}) name?: string = '';\n\n /**\n * If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n */\n @Prop({reflect: true}) disabled?: boolean = false;\n\n /**\n * If set, a settings icon will be displayed on hover. The settings shown allow the field's recipient and other settings to be\n * changed, so it should typically only be enabled in the Builder.\n */\n @Prop({reflect: true}) editable?: boolean = false;\n\n /**\n * If set, the field may be dragged to a new location. This should only be enabled in the Builder, or for self-placed fields.\n */\n @Prop({reflect: true}) moveable?: boolean = false;\n\n /**\n * If set, the field is considered \"done\" and is drawn in a display-final-value state.\n */\n @Prop({reflect: true}) done?: boolean = false;\n\n /**\n * If set, the field will be be scaled horizontally by this factor.\n */\n @Prop({reflect: true}) xscale?: number = 1;\n\n /**\n * If set, the field will be be scaled vertically by this factor.\n */\n @Prop({reflect: true}) yscale?: number = 1;\n\n /**\n * The page the field is on\n */\n @Prop({reflect: true}) pagenumber?: number = 1;\n\n /**\n * Event emitted when the field has changed.\n */\n @Event({composed: true}) fieldChange: EventEmitter<string>;\n\n /**\n * Event fired on every character entered into / deleted from the field.\n */\n @Event({composed: true}) settingsPress: EventEmitter;\n\n /**\n * Event fired when the field's settings are changed.\n */\n @Event({composed: true}) settingsChanged: EventEmitter<{fieldName: string; field: ITemplateField}>;\n\n /**\n * Event fired when the field is deleted.\n */\n @Event({composed: true}) deleted: EventEmitter<{fieldName: string}>;\n\n @State() showingProperties?: boolean = false;\n @State() focused?: boolean = false;\n\n @Method() async focusField() {\n this.handleShow();\n }\n\n @State()\n tempSignature: string = '';\n\n private dialog?: any;\n\n hideDialog() {\n this.dialog?.remove();\n this.dialog = null;\n this.focused = false;\n }\n\n handleAdopt(e: any) {\n console.log('[SIGNATURE] Adopted signature');\n this.tempSignature = e.detail;\n this.fieldChange?.emit(this.tempSignature);\n this.hideDialog();\n }\n\n handleShow() {\n this.dialog = document.createElement('verdocs-signature-dialog');\n this.dialog.setAttribute('name', this.name);\n // this.dialog.setAttribute('roleindex', this.roleindex);\n this.dialog.addEventListener('exit', () => this.hideDialog());\n this.dialog.addEventListener('next', (e: any) => this.handleAdopt(e));\n document.body.append(this.dialog);\n this.focused = true;\n }\n\n @Method()\n async showSettingsPanel() {\n const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n if (settingsPanel && settingsPanel.showPanel) {\n settingsPanel.showPanel();\n }\n }\n\n @Method()\n async hideSettingsPanel() {\n const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n if (settingsPanel && settingsPanel.hidePanel) {\n settingsPanel.hidePanel();\n }\n this.showingProperties = false;\n }\n\n render() {\n const {source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1} = this;\n\n const {index, field} = Store.getField(source, sourceid, fieldname, this.field);\n console.log('Signature field', index, getRGBA(index), field);\n const {required = false, value = '', label = '', settings = {}} = field || {};\n const {base64} = settings;\n const backgroundColor = getRGBA(index);\n\n if (done) {\n return <Host class={{done}}>{value && <img src={base64} alt=\"\" />}</Host>;\n }\n\n return (\n <Host class={{required, disabled, done, focused}} style={{backgroundColor}}>\n {label && <label>{label}</label>}\n\n {base64 ? <img src={base64} alt=\"\" /> : <button onClick={() => !disabled && this.handleShow()}>Signature</button>}\n\n {editable && (\n <Fragment>\n <div\n id={`verdocs-settings-panel-trigger-${fieldname}`}\n style={{transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})`}}\n class=\"settings-icon\"\n innerHTML={SettingsIcon}\n onClick={(e: any) => {\n e.stopPropagation();\n this.showingProperties = !this.showingProperties;\n }}\n />\n\n {this.showingProperties && (\n <verdocs-portal anchor={`verdocs-settings-panel-trigger-${fieldname}`} onClickAway={() => (this.showingProperties = false)}>\n <verdocs-template-field-properties\n templateId={sourceid}\n fieldName={fieldname}\n onClose={() => this.hideSettingsPanel()}\n onDelete={() => {\n this.deleted?.emit({fieldName: fieldname});\n return this.hideSettingsPanel();\n }}\n onSettingsChanged={e => {\n this.settingsChanged?.emit(e.detail);\n return this.hideSettingsPanel();\n }}\n helpText={\"Signature fields capture a recipient's signature on a document.\"}\n />\n </verdocs-portal>\n )}\n </Fragment>\n )}\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"verdocs-field-signature.js","sourceRoot":"","sources":["../../../../src/components/fields/verdocs-field-signature/verdocs-field-signature.tsx"],"names":[],"mappings":"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","sourcesContent":["import {ITemplateField, getRGBA, IEnvelopeField} from '@verdocs/js-sdk';\nimport {Component, h, Host, Prop, Event, EventEmitter, Method, Fragment, State} from '@stencil/core';\nimport {SettingsIcon} from '../../../utils/Icons';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Displays a signature field. If a signature already exists, it will be displayed and the field\n * will be disabled. Otherwise, a placeholder button will be shown. Clicking the button will\n * show a dialog to adopt a signature.\n *\n * NOTE: When signature fields are completed they will be filled with a signature \"stamp\".\n * This requires operation against a live, valid envelope. If you are testing this component\n * in Storybook, it will not be visible here.\n */\n@Component({\n tag: 'verdocs-field-signature',\n styleUrl: 'verdocs-field-signature.scss',\n shadow: false,\n})\nexport class VerdocsFieldSignature {\n /**\n * Fields may be attached to templates or envelopes, but only template fields may be edited.\n */\n @Prop({reflect: true}) source: 'template' | 'envelope' = 'template';\n\n /**\n * The source template or envelope ID the field is found in.\n */\n @Prop({reflect: true}) sourceid: string = '';\n\n /**\n * The name of the field to display.\n */\n @Prop({reflect: true}) fieldname: string = '';\n\n /**\n * Override the field's settings. This is intended to be used during signing when fields are being\n * mutated.\n */\n @Prop() field: IEnvelopeField | null | undefined = null;\n\n /**\n * If set, the signature creation dialog will be initialized with this text.\n */\n @Prop({reflect: true}) name?: string = '';\n\n /**\n * If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n */\n @Prop({reflect: true}) disabled?: boolean = false;\n\n /**\n * If set, a settings icon will be displayed on hover. The settings shown allow the field's recipient and other settings to be\n * changed, so it should typically only be enabled in the Builder.\n */\n @Prop({reflect: true}) editable?: boolean = false;\n\n /**\n * If set, the field may be dragged to a new location. This should only be enabled in the Builder, or for self-placed fields.\n */\n @Prop({reflect: true}) moveable?: boolean = false;\n\n /**\n * If set, the field is considered \"done\" and is drawn in a display-final-value state.\n */\n @Prop({reflect: true}) done?: boolean = false;\n\n /**\n * If set, the field will be be scaled horizontally by this factor.\n */\n @Prop({reflect: true}) xscale?: number = 1;\n\n /**\n * If set, the field will be be scaled vertically by this factor.\n */\n @Prop({reflect: true}) yscale?: number = 1;\n\n /**\n * The page the field is on\n */\n @Prop({reflect: true}) pagenumber?: number = 1;\n\n /**\n * Event emitted when the field has changed.\n */\n @Event({composed: true}) fieldChange: EventEmitter<string>;\n\n /**\n * Event fired on every character entered into / deleted from the field.\n */\n @Event({composed: true}) settingsPress: EventEmitter;\n\n /**\n * Event fired when the field's settings are changed.\n */\n @Event({composed: true}) settingsChanged: EventEmitter<{fieldName: string; field: ITemplateField}>;\n\n /**\n * Event fired when the field is deleted.\n */\n @Event({composed: true}) deleted: EventEmitter<{fieldName: string}>;\n\n @State() showingProperties?: boolean = false;\n @State() focused?: boolean = false;\n\n @Method() async focusField() {\n this.handleShow();\n }\n\n @State()\n tempSignature: string = '';\n\n private dialog?: any;\n\n hideDialog() {\n this.dialog?.remove();\n this.dialog = null;\n this.focused = false;\n }\n\n handleAdopt(e: any) {\n console.log('[SIGNATURE] Adopted signature');\n this.tempSignature = e.detail;\n this.fieldChange?.emit(this.tempSignature);\n this.hideDialog();\n }\n\n handleShow() {\n this.dialog = document.createElement('verdocs-signature-dialog');\n this.dialog.setAttribute('name', this.name);\n // this.dialog.setAttribute('roleindex', this.roleindex);\n this.dialog.addEventListener('exit', () => this.hideDialog());\n this.dialog.addEventListener('next', (e: any) => this.handleAdopt(e));\n document.body.append(this.dialog);\n this.focused = true;\n }\n\n @Method()\n async showSettingsPanel() {\n const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n if (settingsPanel && settingsPanel.showPanel) {\n settingsPanel.showPanel();\n }\n }\n\n @Method()\n async hideSettingsPanel() {\n const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n if (settingsPanel && settingsPanel.hidePanel) {\n settingsPanel.hidePanel();\n }\n this.showingProperties = false;\n }\n\n render() {\n const {source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1} = this;\n\n const {index, field} = Store.getField(source, sourceid, fieldname, this.field);\n const {required = false, value = '', label = '', settings = {}} = field || {};\n const {base64} = settings;\n const backgroundColor = getRGBA(index);\n\n if (done) {\n return <Host class={{done}}>{value && <img src={base64} alt=\"\" />}</Host>;\n }\n\n return (\n <Host class={{required, disabled, done, focused}} style={{backgroundColor}}>\n {label && <label>{label}</label>}\n\n {base64 ? <img src={base64} alt=\"\" /> : <button onClick={() => !disabled && this.handleShow()}>Signature</button>}\n\n {editable && (\n <Fragment>\n <div\n id={`verdocs-settings-panel-trigger-${fieldname}`}\n style={{transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})`}}\n class=\"settings-icon\"\n innerHTML={SettingsIcon}\n onClick={(e: any) => {\n e.stopPropagation();\n this.showingProperties = !this.showingProperties;\n }}\n />\n\n {this.showingProperties && (\n <verdocs-portal anchor={`verdocs-settings-panel-trigger-${fieldname}`} onClickAway={() => (this.showingProperties = false)}>\n <verdocs-template-field-properties\n templateId={sourceid}\n fieldName={fieldname}\n onClose={() => this.hideSettingsPanel()}\n onDelete={() => {\n this.deleted?.emit({fieldName: fieldname});\n return this.hideSettingsPanel();\n }}\n onSettingsChanged={e => {\n this.settingsChanged?.emit(e.detail);\n return this.hideSettingsPanel();\n }}\n helpText={\"Signature fields capture a recipient's signature on a document.\"}\n />\n </verdocs-portal>\n )}\n </Fragment>\n )}\n </Host>\n );\n }\n}\n"]}
@@ -106,12 +106,10 @@ export class VerdocsFieldTextbox {
106
106
  }
107
107
  render() {
108
108
  const { source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1 } = this;
109
- console.log('Rendering textbox', source, sourceid, fieldname);
110
109
  const { index, field } = Store.getField(source, sourceid, fieldname, this.field);
111
- console.log('Textbox', index, getRGBA(index), field);
112
110
  let { required = false, placeholder = '', label = '', width = 150, default: value = '', multiline = false } = field || {};
113
111
  const backgroundColor = getRGBA(index);
114
- // TODO: Consolidate value/defaultValue handling between template and envelope fields
112
+ // TODO: Consolidate value/defaultValue handling between template and envelope fields.
115
113
  if (field === null || field === void 0 ? void 0 : field.value) {
116
114
  value = field === null || field === void 0 ? void 0 : field.value;
117
115
  }
@@ -1 +1 @@
1
- {"version":3,"file":"verdocs-field-textbox.js","sourceRoot":"","sources":["../../../../src/components/fields/verdocs-field-textbox/verdocs-field-textbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import interact from 'interactjs';\nimport {getRGBA, IEnvelopeField, ITemplateField, updateField, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, h, Host, Element, Prop, Method, Event, EventEmitter, Fragment, State} from '@stencil/core';\nimport {SettingsIcon} from '../../../utils/Icons';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Display a simple 1-line text input field.\n */\n@Component({\n tag: 'verdocs-field-textbox',\n styleUrl: 'verdocs-field-textbox.scss',\n shadow: false,\n})\nexport class VerdocsFieldTextbox {\n @Element() el: HTMLElement;\n private inputEl: HTMLInputElement | HTMLTextAreaElement;\n\n /**\n * Fields may be attached to templates or envelopes, but only template fields may be edited.\n */\n @Prop({reflect: true}) source: 'template' | 'envelope' = 'template';\n\n /**\n * The source template or envelope ID the field is found in.\n */\n @Prop({reflect: true}) sourceid: string = '';\n\n /**\n * The name of the field to display.\n */\n @Prop({reflect: true}) fieldname: string = '';\n\n /**\n * Override the field's settings. This is intended to be used during signing when fields are being\n * mutated.\n */\n @Prop() field: IEnvelopeField | null | undefined = null;\n\n /**\n * If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n */\n @Prop({reflect: true}) disabled?: boolean = false;\n\n /**\n * If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n */\n @Prop({reflect: true}) multiline?: boolean = false;\n\n /**\n * If set, a settings icon will be displayed on hover. The settings shown allow the field's recipient and other settings to be\n * changed, so it should typically only be enabled in the Builder.\n */\n @Prop({reflect: true}) editable?: boolean = false;\n\n /**\n * If set, the field may be dragged to a new location. This should only be enabled in the Builder, or for self-placed fields.\n */\n @Prop({reflect: true}) moveable?: boolean = false;\n\n /**\n * If set, the field is considered \"done\" and is drawn in a display-final-value state.\n */\n @Prop({reflect: true}) done?: boolean = false;\n\n /**\n * If set, the field will be be scaled horizontally by this factor.\n */\n @Prop({reflect: true}) xscale?: number = 1;\n\n /**\n * If set, the field will be be scaled vertically by this factor.\n */\n @Prop({reflect: true}) yscale?: number = 1;\n\n /**\n * The page the field is on\n */\n @Prop({reflect: true}) pagenumber?: number = 1;\n\n /**\n * Event fired when the field's settings are changed.\n */\n @Event({composed: true}) settingsChanged: EventEmitter<{fieldName: string; field: ITemplateField}>;\n\n /**\n * Event fired when the field is deleted.\n */\n @Event({composed: true}) deleted: EventEmitter<{fieldName: string}>;\n\n @State() showingProperties?: boolean = false;\n @State() focused?: boolean = false;\n\n @Method()\n async focusField() {\n this.inputEl.focus();\n }\n\n @Method()\n async showSettingsPanel() {\n const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n if (settingsPanel && settingsPanel.showPanel) {\n settingsPanel.showPanel();\n }\n }\n\n @Method()\n async hideSettingsPanel() {\n const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n if (settingsPanel && settingsPanel.hidePanel) {\n settingsPanel.hidePanel();\n }\n this.showingProperties = false;\n }\n\n componentDidRender() {\n interact.dynamicDrop(true);\n\n if (this.editable) {\n interact(this.el).resizable({\n edges: {\n top: '.edge-top',\n left: '.edge-left',\n bottom: '.edge-bottom',\n right: '.edge-right',\n },\n modifiers: [\n interact.modifiers.restrictSize({\n min: {width: 30, height: 15},\n }),\n ],\n listeners: {\n start: this.handleResizeStart.bind(this),\n move: this.handleResize.bind(this),\n end: this.handleResizeEnd.bind(this),\n },\n });\n }\n }\n\n handleResizeStart(e: any) {\n e.preventDefault();\n e.stopPropagation();\n }\n\n handleResize(e: any) {\n let {width, height} = e.rect;\n\n const dX = e.deltaRect.left;\n const dY = e.deltaRect.bottom;\n const currentLeft = parseFloat(e.target.style.left);\n const currentBottom = parseFloat(e.target.style.bottom);\n\n width /= this.xscale;\n height /= this.yscale;\n\n Object.assign(e.target.style, {\n width: `${width}px`,\n height: `${height}px`,\n left: `${currentLeft + dX}px`,\n bottom: `${currentBottom - dY}px`,\n });\n }\n\n handleResizeEnd(e: any) {\n const {sourceid, fieldname} = this;\n\n const width = Math.round(parseFloat(e.target.style.width));\n let height = Math.round(parseFloat(e.target.style.height));\n\n if (height < 20) {\n height = 15;\n }\n const multiline = height > 15;\n\n updateField(VerdocsEndpoint.getDefault(), sourceid, fieldname, {width, height, multiline})\n .then(async updatedField => {\n const template = await Store.getTemplate(VerdocsEndpoint.getDefault(), this.sourceid);\n const newTemplate = JSON.parse(JSON.stringify(template));\n const fieldIndex = newTemplate.fields.findIndex(field => field.name === fieldname);\n if (fieldIndex > -1) {\n newTemplate.fields[fieldIndex] = updatedField;\n }\n Store.updateTemplate(this.sourceid, newTemplate);\n\n this.settingsChanged?.emit({fieldName: fieldname, field: updatedField});\n Object.assign(e.target.dataset, {x: 0, y: 0, h: 0});\n })\n .catch(e => console.log('Field update failed', e));\n }\n\n render() {\n const {source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1} = this;\n console.log('Rendering textbox', source, sourceid, fieldname);\n const {index, field} = Store.getField(source, sourceid, fieldname, this.field);\n console.log('Textbox', index, getRGBA(index), field);\n let {required = false, placeholder = '', label = '', width = 150, default: value = '', multiline = false} = field || {};\n const backgroundColor = getRGBA(index);\n\n // TODO: Consolidate value/defaultValue handling between template and envelope fields\n if ((field as any)?.value) {\n value = (field as any)?.value;\n }\n\n // TODO: This is an outdated technique from the old system. We should compute it.\n const maxlength = width / 5;\n\n if (done) {\n return <Host class={{done}}>{value}</Host>;\n }\n\n return (\n <Host class={{required, disabled, done, focused}} style={{backgroundColor}}>\n {editable && <div class=\"edge-top\" />}\n {editable && <div class=\"edge-right\" />}\n {editable && <div class=\"edge-left\" />}\n {editable && <div class=\"edge-bottom\" />}\n\n {label && <label>{label}</label>}\n\n {multiline ? (\n <textarea\n name={fieldname}\n disabled={disabled}\n required={required}\n placeholder={placeholder}\n ref={el => (this.inputEl = el)}\n onFocus={() => (this.focused = true)}\n onBlur={() => (this.focused = false)}\n >\n {value}\n </textarea>\n ) : (\n <input\n type=\"text\"\n name={fieldname}\n value={value}\n disabled={disabled}\n required={required}\n placeholder={placeholder}\n maxlength={maxlength}\n ref={el => (this.inputEl = el)}\n onFocus={() => (this.focused = true)}\n onBlur={() => (this.focused = false)}\n />\n )}\n\n {editable && (\n <Fragment>\n <div\n id={`verdocs-settings-panel-trigger-${fieldname}`}\n style={{transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})`}}\n class=\"settings-icon\"\n innerHTML={SettingsIcon}\n onClick={(e: any) => {\n e.stopPropagation();\n this.showingProperties = !this.showingProperties;\n }}\n />\n\n {this.showingProperties && (\n <verdocs-portal anchor={`verdocs-settings-panel-trigger-${fieldname}`} onClickAway={() => (this.showingProperties = false)}>\n <verdocs-template-field-properties\n templateId={sourceid}\n fieldName={fieldname}\n onClose={() => this.hideSettingsPanel()}\n onDelete={() => {\n this.deleted?.emit({fieldName: fieldname});\n return this.hideSettingsPanel();\n }}\n onSettingsChanged={e => {\n this.settingsChanged?.emit(e.detail);\n return this.hideSettingsPanel();\n }}\n helpText={\n 'Text boxes may be used to capture simple text input. Participant-entered values will be stored for later retrieval via the \"name\" field.<br /><br />If marked required, the participant must complete the field before proceeding.'\n }\n />\n </verdocs-portal>\n )}\n </Fragment>\n )}\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"verdocs-field-textbox.js","sourceRoot":"","sources":["../../../../src/components/fields/verdocs-field-textbox/verdocs-field-textbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import interact from 'interactjs';\nimport {getRGBA, IEnvelopeField, ITemplateField, updateField, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, h, Host, Element, Prop, Method, Event, EventEmitter, Fragment, State} from '@stencil/core';\nimport {SettingsIcon} from '../../../utils/Icons';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Display a simple 1-line text input field.\n */\n@Component({\n tag: 'verdocs-field-textbox',\n styleUrl: 'verdocs-field-textbox.scss',\n shadow: false,\n})\nexport class VerdocsFieldTextbox {\n @Element() el: HTMLElement;\n private inputEl: HTMLInputElement | HTMLTextAreaElement;\n\n /**\n * Fields may be attached to templates or envelopes, but only template fields may be edited.\n */\n @Prop({reflect: true}) source: 'template' | 'envelope' = 'template';\n\n /**\n * The source template or envelope ID the field is found in.\n */\n @Prop({reflect: true}) sourceid: string = '';\n\n /**\n * The name of the field to display.\n */\n @Prop({reflect: true}) fieldname: string = '';\n\n /**\n * Override the field's settings. This is intended to be used during signing when fields are being\n * mutated.\n */\n @Prop() field: IEnvelopeField | null | undefined = null;\n\n /**\n * If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n */\n @Prop({reflect: true}) disabled?: boolean = false;\n\n /**\n * If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n */\n @Prop({reflect: true}) multiline?: boolean = false;\n\n /**\n * If set, a settings icon will be displayed on hover. The settings shown allow the field's recipient and other settings to be\n * changed, so it should typically only be enabled in the Builder.\n */\n @Prop({reflect: true}) editable?: boolean = false;\n\n /**\n * If set, the field may be dragged to a new location. This should only be enabled in the Builder, or for self-placed fields.\n */\n @Prop({reflect: true}) moveable?: boolean = false;\n\n /**\n * If set, the field is considered \"done\" and is drawn in a display-final-value state.\n */\n @Prop({reflect: true}) done?: boolean = false;\n\n /**\n * If set, the field will be be scaled horizontally by this factor.\n */\n @Prop({reflect: true}) xscale?: number = 1;\n\n /**\n * If set, the field will be be scaled vertically by this factor.\n */\n @Prop({reflect: true}) yscale?: number = 1;\n\n /**\n * The page the field is on\n */\n @Prop({reflect: true}) pagenumber?: number = 1;\n\n /**\n * Event fired when the field's settings are changed.\n */\n @Event({composed: true}) settingsChanged: EventEmitter<{fieldName: string; field: ITemplateField}>;\n\n /**\n * Event fired when the field is deleted.\n */\n @Event({composed: true}) deleted: EventEmitter<{fieldName: string}>;\n\n @State() showingProperties?: boolean = false;\n @State() focused?: boolean = false;\n\n @Method()\n async focusField() {\n this.inputEl.focus();\n }\n\n @Method()\n async showSettingsPanel() {\n const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n if (settingsPanel && settingsPanel.showPanel) {\n settingsPanel.showPanel();\n }\n }\n\n @Method()\n async hideSettingsPanel() {\n const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n if (settingsPanel && settingsPanel.hidePanel) {\n settingsPanel.hidePanel();\n }\n this.showingProperties = false;\n }\n\n componentDidRender() {\n interact.dynamicDrop(true);\n\n if (this.editable) {\n interact(this.el).resizable({\n edges: {\n top: '.edge-top',\n left: '.edge-left',\n bottom: '.edge-bottom',\n right: '.edge-right',\n },\n modifiers: [\n interact.modifiers.restrictSize({\n min: {width: 30, height: 15},\n }),\n ],\n listeners: {\n start: this.handleResizeStart.bind(this),\n move: this.handleResize.bind(this),\n end: this.handleResizeEnd.bind(this),\n },\n });\n }\n }\n\n handleResizeStart(e: any) {\n e.preventDefault();\n e.stopPropagation();\n }\n\n handleResize(e: any) {\n let {width, height} = e.rect;\n\n const dX = e.deltaRect.left;\n const dY = e.deltaRect.bottom;\n const currentLeft = parseFloat(e.target.style.left);\n const currentBottom = parseFloat(e.target.style.bottom);\n\n width /= this.xscale;\n height /= this.yscale;\n\n Object.assign(e.target.style, {\n width: `${width}px`,\n height: `${height}px`,\n left: `${currentLeft + dX}px`,\n bottom: `${currentBottom - dY}px`,\n });\n }\n\n handleResizeEnd(e: any) {\n const {sourceid, fieldname} = this;\n\n const width = Math.round(parseFloat(e.target.style.width));\n let height = Math.round(parseFloat(e.target.style.height));\n\n if (height < 20) {\n height = 15;\n }\n const multiline = height > 15;\n\n updateField(VerdocsEndpoint.getDefault(), sourceid, fieldname, {width, height, multiline})\n .then(async updatedField => {\n const template = await Store.getTemplate(VerdocsEndpoint.getDefault(), this.sourceid);\n const newTemplate = JSON.parse(JSON.stringify(template));\n const fieldIndex = newTemplate.fields.findIndex(field => field.name === fieldname);\n if (fieldIndex > -1) {\n newTemplate.fields[fieldIndex] = updatedField;\n }\n Store.updateTemplate(this.sourceid, newTemplate);\n\n this.settingsChanged?.emit({fieldName: fieldname, field: updatedField});\n Object.assign(e.target.dataset, {x: 0, y: 0, h: 0});\n })\n .catch(e => console.log('Field update failed', e));\n }\n\n render() {\n const {source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1} = this;\n const {index, field} = Store.getField(source, sourceid, fieldname, this.field);\n let {required = false, placeholder = '', label = '', width = 150, default: value = '', multiline = false} = field || {};\n const backgroundColor = getRGBA(index);\n\n // TODO: Consolidate value/defaultValue handling between template and envelope fields.\n if ((field as any)?.value) {\n value = (field as any)?.value;\n }\n\n // TODO: This is an outdated technique from the old system. We should compute it.\n const maxlength = width / 5;\n\n if (done) {\n return <Host class={{done}}>{value}</Host>;\n }\n\n return (\n <Host class={{required, disabled, done, focused}} style={{backgroundColor}}>\n {editable && <div class=\"edge-top\" />}\n {editable && <div class=\"edge-right\" />}\n {editable && <div class=\"edge-left\" />}\n {editable && <div class=\"edge-bottom\" />}\n\n {label && <label>{label}</label>}\n\n {multiline ? (\n <textarea\n name={fieldname}\n disabled={disabled}\n required={required}\n placeholder={placeholder}\n ref={el => (this.inputEl = el)}\n onFocus={() => (this.focused = true)}\n onBlur={() => (this.focused = false)}\n >\n {value}\n </textarea>\n ) : (\n <input\n type=\"text\"\n name={fieldname}\n value={value}\n disabled={disabled}\n required={required}\n placeholder={placeholder}\n maxlength={maxlength}\n ref={el => (this.inputEl = el)}\n onFocus={() => (this.focused = true)}\n onBlur={() => (this.focused = false)}\n />\n )}\n\n {editable && (\n <Fragment>\n <div\n id={`verdocs-settings-panel-trigger-${fieldname}`}\n style={{transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})`}}\n class=\"settings-icon\"\n innerHTML={SettingsIcon}\n onClick={(e: any) => {\n e.stopPropagation();\n this.showingProperties = !this.showingProperties;\n }}\n />\n\n {this.showingProperties && (\n <verdocs-portal anchor={`verdocs-settings-panel-trigger-${fieldname}`} onClickAway={() => (this.showingProperties = false)}>\n <verdocs-template-field-properties\n templateId={sourceid}\n fieldName={fieldname}\n onClose={() => this.hideSettingsPanel()}\n onDelete={() => {\n this.deleted?.emit({fieldName: fieldname});\n return this.hideSettingsPanel();\n }}\n onSettingsChanged={e => {\n this.settingsChanged?.emit(e.detail);\n return this.hideSettingsPanel();\n }}\n helpText={\n 'Text boxes may be used to capture simple text input. Participant-entered values will be stored for later retrieval via the \"name\" field.<br /><br />If marked required, the participant must complete the field before proceeding.'\n }\n />\n </verdocs-portal>\n )}\n </Fragment>\n )}\n </Host>\n );\n }\n}\n"]}
@@ -124,7 +124,7 @@ verdocs-template-roles .row.add-sequence {
124
124
  display: none;
125
125
  }
126
126
  verdocs-template-roles .add-role {
127
- margin: 0;
127
+ margin: 0 0 0 -8px;
128
128
  padding: 0;
129
129
  border: none;
130
130
  opacity: 0.3;
@@ -14,6 +14,7 @@ const iconCC = `<svg xmlns="http://www.w3.org/2000/svg" height="24" width="24"><
14
14
  export class VerdocsTemplateRoles {
15
15
  constructor() {
16
16
  this.templateListenerId = null;
17
+ this.sortableRefs = [];
17
18
  this.endpoint = VerdocsEndpoint.getDefault();
18
19
  this.templateId = '';
19
20
  this.showingRoleDialog = null;
@@ -24,6 +25,7 @@ export class VerdocsTemplateRoles {
24
25
  }
25
26
  disconnectedCallback() {
26
27
  this.unlistenToTemplate();
28
+ this.cleanupSortables();
27
29
  }
28
30
  async listenToTemplate() {
29
31
  console.log('[ROLES] Loading template', this.templateId);
@@ -43,7 +45,6 @@ export class VerdocsTemplateRoles {
43
45
  async componentWillLoad() {
44
46
  var _a, _b, _c;
45
47
  try {
46
- VerdocsEndpoint.getDefault().setBaseURL('https://api.verdocs.com');
47
48
  this.endpoint.loadSession();
48
49
  if (!this.templateId) {
49
50
  console.log(`[ROLES] Missing required template ID ${this.templateId}`);
@@ -60,13 +61,18 @@ export class VerdocsTemplateRoles {
60
61
  (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(new SDKError(e.message, (_b = e.response) === null || _b === void 0 ? void 0 : _b.status, (_c = e.response) === null || _c === void 0 ? void 0 : _c.data));
61
62
  }
62
63
  }
64
+ cleanupSortables() {
65
+ this.sortableRefs.forEach(sr => sr.destroy());
66
+ this.sortableRefs.length = 0;
67
+ }
63
68
  componentDidRender() {
69
+ this.cleanupSortables();
64
70
  // Existing sequence numbers
65
71
  const sequenceNumbers = this.getSequenceNumbers();
66
72
  (sequenceNumbers || []).forEach(sequence => {
67
73
  const el = document.getElementById(`verdocs-roles-sequence-${sequence}`);
68
74
  if (el) {
69
- new Sortable(el, {
75
+ const sortable = new Sortable(el, {
70
76
  group: 'roles',
71
77
  animation: 150,
72
78
  dragoverBubble: true,
@@ -75,11 +81,13 @@ export class VerdocsTemplateRoles {
75
81
  onChoose: () => (this.dragging = true),
76
82
  onUnchoose: () => (this.dragging = false),
77
83
  });
84
+ this.sortableRefs.push(sortable);
78
85
  }
79
86
  });
80
87
  const el = document.getElementById(`verdocs-roles-sequence-add-target`);
81
88
  if (el) {
82
- new Sortable(el, {
89
+ console.log('[ROLES] Applying sortable to add-sequence slot');
90
+ const sortable = new Sortable(el, {
83
91
  group: 'roles',
84
92
  animation: 150,
85
93
  dragoverBubble: true,
@@ -88,6 +96,7 @@ export class VerdocsTemplateRoles {
88
96
  onChoose: () => (this.dragging = true),
89
97
  onUnchoose: () => (this.dragging = false),
90
98
  });
99
+ this.sortableRefs.push(sortable);
91
100
  }
92
101
  }
93
102
  handleMoveEnd(evt) {
@@ -124,15 +133,9 @@ export class VerdocsTemplateRoles {
124
133
  }
125
134
  });
126
135
  });
127
- // When renumbering, we don't try to update the store for every individual item
128
- // changing. We just do it once at the end.
129
- console.log(`[ROLES] Awaiting ${renumberRequests.length} renumber requests`, renumberRequests);
130
- return Promise.all(renumberRequests).then(async () => {
131
- const newTemplate = JSON.parse(JSON.stringify(this.template));
132
- newTemplate.roles = Object.keys(sortableRoles).reduce((acc, seq) => acc.concat(sortableRoles[seq]), []);
133
- await Store.getTemplate(this.endpoint, this.templateId, true);
134
- // Store.updateTemplate(this.templateId, newTemplate);
135
- });
136
+ return Promise.all(renumberRequests)
137
+ .then(async () => console.log('[ROLES] Done renumbering'))
138
+ .catch(e => console.log('[ROLES] Error updating roles', e));
136
139
  }
137
140
  handleCancel() {
138
141
  var _a;
@@ -270,7 +273,7 @@ export class VerdocsTemplateRoles {
270
273
  const sequences = this.getSequenceNumbers();
271
274
  const nextSequence = sequences && sequences.length > 0 ? (sequences[sequences.length - 1] || 0) + 1 : 1;
272
275
  // style={{backgroundColor: getRGBA(getRoleIndex(this.template, role.name))}}
273
- return (h(Host, { class: { dragging: this.dragging } }, h("form", { onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("h5", null, "Roles and Workflow"), h("div", { class: "roles" }, sequences.map((sequence, index) => (h("div", { class: "sequence" }, h("div", { class: "sequence-label no-drag" }, index + 1, "."), h("div", { class: "sequence-roles", id: `verdocs-roles-sequence-${sequence}`, "data-sequence": sequence }, this.getRolesAtSequence(sequence).map(role => {
276
+ return (h(Host, { class: { dragging: this.dragging } }, h("form", { onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("h5", null, "Roles and Workflow"), h("div", { class: "roles" }, sequences.map((sequence, index) => (h("div", { class: "sequence" }, console.log('Rendering sequence', sequence, index, this.getRolesAtSequence(sequence)), h("div", { class: "sequence-label no-drag" }, index + 1, "."), h("div", { class: "sequence-roles", id: `verdocs-roles-sequence-${sequence}`, "data-sequence": sequence }, this.getRolesAtSequence(sequence).map(role => {
274
277
  const unknown = !role.email || !role.first_name || !role.last_name;
275
278
  return unknown ? (h("div", { class: "role", "data-rolename": role.name, "data-sequence": sequence, "data-order": role.order }, h("div", { class: "role-name" }, role.name), h("div", { class: "icons" }, h("div", { class: "gear-button", innerHTML: settingsIcon, onClick: () => (this.showingRoleDialog = role.name), "aria-role": "button" }), h("span", { class: "type-icon", innerHTML: role.type === 'signer' ? iconSigner : role.type === 'cc' ? iconCC : iconApprover })))) : (h("div", { class: "role", "data-rolename": role.name, "data-sequence": sequence, "data-order": role.order }, h("div", { class: "role-name" }, formatFullName(role)), h("div", { class: "icons" }, h("div", { class: "gear-button", innerHTML: settingsIcon, onClick: () => (this.showingRoleDialog = role.name), "aria-role": "button" }), h("span", { class: "type-icon", innerHTML: role.type === 'signer' ? iconSigner : role.type === 'cc' ? iconCC : iconApprover }))));
276
279
  })), h("button", { class: "add-role no-drag", innerHTML: plusIcon, onClick: e => this.handleAddRole(e, sequence) })))), h("div", { class: "sequence add-sequence" }, h("div", { class: "sequence-label no-drag" }, sequences.length + 1, "."), h("div", { class: "sequence-roles", id: `verdocs-roles-sequence-add-target`, "data-sequence": nextSequence }), h("button", { class: "add-role no-drag", innerHTML: plusIcon, onClick: e => this.handleAddRole(e, nextSequence) }))), roleNames.length < 1 && (h("div", { class: "empty" }, "You must add at least one Role before proceeding.", h("br", null), " Click the ", h("span", { innerHTML: plusIcon }), " Add button above to get started.")), h("div", { class: "buttons" }, h("div", { class: "flex-fill" }), h("verdocs-button", { variant: "outline", label: "Cancel", size: "small", onClick: () => this.handleCancel() }), h("verdocs-button", { label: "OK", size: "small", onClick: () => this.handleSubmit(), disabled: roleNames.length < 1 }))), this.showingRoleDialog && (h("verdocs-menu-panel", { onClose: () => (this.showingRoleDialog = null) }, h("verdocs-template-role-properties", { endpoint: this.endpoint, templateId: this.templateId, roleName: this.showingRoleDialog, onClose: () => {
@@ -1 +1 @@
1
- {"version":3,"file":"verdocs-template-roles.js","sourceRoot":"","sources":["../../../../src/components/templates/verdocs-template-roles/verdocs-template-roles.tsx"],"names":[],"mappings":"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","sourcesContent":["import Sortable from 'sortablejs';\nimport {Component, h, Element, Event, EventEmitter, Host, Prop, State} from '@stencil/core';\nimport {createTemplateRole, formatFullName, getTemplate, IRole, ITemplate, updateTemplateRole, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {SDKError} from '../../../utils/errors';\nimport {Store} from '../../../utils/Datastore';\n\nconst settingsIcon =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"20\" width=\"20\" fill=\"#00000089\"><path d=\"m8.021 17.917-.313-2.5q-.27-.125-.625-.334-.354-.208-.625-.395l-2.312.979-1.979-3.438 1.979-1.5q-.021-.167-.031-.364-.011-.198-.011-.365 0-.146.011-.344.01-.198.031-.385l-1.979-1.5 1.979-3.417 2.312.958q.271-.187.615-.385t.635-.344l.313-2.5h3.958l.313 2.5q.312.167.625.344.312.177.604.385l2.333-.958 1.979 3.417-1.979 1.521q.021.187.021.364V10q0 .146-.01.333-.011.188-.011.396l1.958 1.5-1.979 3.438-2.312-.979q-.292.208-.615.395-.323.188-.614.334l-.313 2.5Zm1.937-5.355q1.063 0 1.813-.75t.75-1.812q0-1.062-.75-1.812t-1.813-.75q-1.041 0-1.802.75-.76.75-.76 1.812t.76 1.812q.761.75 1.802.75Zm0-1.333q-.5 0-.864-.364-.365-.365-.365-.865t.365-.865q.364-.364.864-.364t.865.364q.365.365.365.865t-.365.865q-.365.364-.865.364ZM10.021 10Zm-.854 6.583h1.666l.25-2.187q.605-.167 1.136-.49.531-.323 1.031-.802l2.021.875.854-1.375-1.792-1.354q.105-.333.136-.635.031-.303.031-.615 0-.292-.031-.573-.031-.281-.115-.635l1.792-1.396-.834-1.375-2.062.875q-.438-.438-1.021-.781-.583-.344-1.125-.49l-.271-2.208H9.167l-.271 2.208q-.584.146-1.125.458-.542.313-1.042.792l-2.021-.854-.833 1.375 1.75 1.354q-.083.333-.125.646-.042.312-.042.604t.042.594q.042.302.125.635l-1.75 1.375.833 1.375 2.021-.854q.479.458 1.021.771.542.312 1.146.479Z\"/></svg>';\n\nconst plusIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"#ffffff\" viewBox=\"0 0 24 24\" strokeWidth={1.5} stroke=\"currentColor\"><path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M12 9v6m3-3H9m12 0a9 9 0 11-18 0 9 9 0 0118 0z\" /></svg>`;\n\nconst iconSigner =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"m9.225 21.225 4.65-4.65h8.45v4.65Zm-5.35-2.2H5.05l8.5-8.5-1.175-1.175-8.5 8.5Zm14.25-9.95L13.8 4.8l1.325-1.325q.625-.65 1.525-.663.9-.012 1.6.663l1.225 1.175q.675.675.663 1.562-.013.888-.663 1.513ZM16.7 10.55 6 21.225H1.675V16.9L12.35 6.225Zm-3.725-.625-.6-.575 1.175 1.175Z\"/></svg>';\n\nconst iconApprover = `<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path fill-rule=\"evenodd\" d=\"M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12zm13.36-1.814a.75.75 0 10-1.22-.872l-3.236 4.53L9.53 12.22a.75.75 0 00-1.06 1.06l2.25 2.25a.75.75 0 001.14-.094l3.75-5.25z\" clip-rule=\"evenodd\" /></svg>`;\n\nconst iconCC = `<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"M1.5 8.67v8.58a3 3 0 003 3h15a3 3 0 003-3V8.67l-8.928 5.493a3 3 0 01-3.144 0L1.5 8.67z\" /><path d=\"M22.5 6.908V6.75a3 3 0 00-3-3h-15a3 3 0 00-3 3v.158l9.714 5.978a1.5 1.5 0 001.572 0L22.5 6.908z\" /></svg>`;\n\n/**\n * Display an edit form that allows the user to adjust a template's roles and workflow.\n */\n@Component({\n tag: 'verdocs-template-roles',\n styleUrl: 'verdocs-template-roles.scss',\n shadow: false,\n})\nexport class VerdocsTemplateRoles {\n private templateListenerId = null;\n\n @Element()\n el: HTMLElement;\n\n /**\n * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n */\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /**\n * The template ID to edit.\n */\n @Prop() templateId: string = '';\n\n /**\n * Event fired when the user clicks to proceed.\n */\n @Event({composed: true}) next: EventEmitter;\n\n /**\n * Event fired when the step is cancelled. This is called exit to avoid conflicts with the JS-reserved \"cancel\" event name.\n */\n @Event({composed: true}) exit: EventEmitter;\n\n /**\n * Event fired if an error occurs. The event details will contain information about the error. Most errors will\n * terminate the process, and the calling application should correct the condition and re-render the component.\n */\n @Event({composed: true}) sdkError: EventEmitter<SDKError>;\n\n /**\n * Event fired when the template is updated in any way. May be used for tasks such as cache invalidation or reporting to other systems.\n */\n @Event({composed: true}) rolesUpdated: EventEmitter<{endpoint: VerdocsEndpoint; templateId: string; event: 'added' | 'deleted' | 'updated'; roles: IRole[]}>;\n\n @State() showingRoleDialog: string | null = null;\n @State() sender = null;\n\n @State() dragging = false;\n @State() loading = true;\n @State() template: ITemplate | null = null;\n\n disconnectedCallback() {\n this.unlistenToTemplate();\n }\n\n async listenToTemplate() {\n console.log('[ROLES] Loading template', this.templateId);\n this.unlistenToTemplate();\n Store.subscribe(\n 'templates',\n this.templateId,\n () => getTemplate(this.endpoint, this.templateId),\n false,\n (template: ITemplate) => {\n console.log('[ROLES] Template Updated', template);\n this.template = template;\n this.loading = false;\n },\n );\n }\n\n unlistenToTemplate() {\n if (this.templateListenerId) {\n Store.store.delListener(this.templateListenerId);\n this.templateListenerId = null;\n }\n }\n\n async componentWillLoad() {\n try {\n VerdocsEndpoint.getDefault().setBaseURL('https://api.verdocs.com');\n this.endpoint.loadSession();\n\n if (!this.templateId) {\n console.log(`[ROLES] Missing required template ID ${this.templateId}`);\n return;\n }\n\n if (!this.endpoint.session) {\n console.log('[ROLES] Unable to start builder session, must be authenticated');\n return;\n }\n\n this.listenToTemplate();\n } catch (e) {\n console.log('[ROLES] Error with preview session', e);\n this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n }\n }\n\n componentDidRender() {\n // Existing sequence numbers\n const sequenceNumbers = this.getSequenceNumbers();\n (sequenceNumbers || []).forEach(sequence => {\n const el = document.getElementById(`verdocs-roles-sequence-${sequence}`);\n if (el) {\n new Sortable(el, {\n group: 'roles',\n animation: 150,\n dragoverBubble: true,\n filter: '.no-drag',\n onEnd: this.handleMoveEnd.bind(this),\n onChoose: () => (this.dragging = true),\n onUnchoose: () => (this.dragging = false),\n });\n }\n });\n\n const el = document.getElementById(`verdocs-roles-sequence-add-target`);\n if (el) {\n new Sortable(el, {\n group: 'roles',\n animation: 150,\n dragoverBubble: true,\n filter: '.no-drag',\n onEnd: this.handleMoveEnd.bind(this),\n onChoose: () => (this.dragging = true),\n onUnchoose: () => (this.dragging = false),\n });\n }\n }\n\n handleMoveEnd(evt) {\n const fromSeq = +evt.from.dataset.sequence;\n const toSeq = +evt.to.dataset.sequence;\n const fromIndex = +evt.oldIndex + 1;\n const toIndex = +evt.newIndex + 1;\n\n console.log(`Move from ${fromSeq}:${fromIndex} to ${toSeq}:${toIndex}`, evt.item);\n\n const sortableRoles: Record<string, IRole[]> = {};\n const sequenceNumbers = this.getSequenceNumbers();\n sequenceNumbers.forEach(sequence => {\n const ras = this.getRolesAtSequence(sequence);\n\n sortableRoles[String(sequence)] = JSON.parse(JSON.stringify(ras));\n });\n\n // We might be adding a new sequence number now. Make sure we have an array to drop\n // the record into.\n sortableRoles[sequenceNumbers[sequenceNumbers.length - 1] + 1] = [];\n\n const role = sortableRoles[fromSeq].splice(fromIndex - 1, 1)[0];\n sortableRoles[toSeq] ||= [];\n sortableRoles[toSeq].splice(toIndex - 1, 0, role);\n\n const renumberRequests = [];\n Object.entries(sortableRoles).forEach(([targetSeq, roles]) => {\n roles.forEach((role, index) => {\n if (!role) {\n return;\n }\n\n const targetOrder = +index + 1;\n if (role.sequence !== +targetSeq || role.order !== targetOrder) {\n role.sequence = +targetSeq;\n role.order = targetOrder;\n renumberRequests.push(\n updateTemplateRole(this.endpoint, this.templateId, role.name, {sequence: +targetSeq, order: targetOrder})\n .then(r => console.log('[ROLES] Updated role', role.name, r))\n .catch(e => console.log('[ROLES] Error updating role', e)),\n );\n }\n });\n });\n\n // When renumbering, we don't try to update the store for every individual item\n // changing. We just do it once at the end.\n console.log(`[ROLES] Awaiting ${renumberRequests.length} renumber requests`, renumberRequests);\n return Promise.all(renumberRequests).then(async () => {\n const newTemplate = JSON.parse(JSON.stringify(this.template));\n newTemplate.roles = Object.keys(sortableRoles).reduce((acc, seq) => acc.concat(sortableRoles[seq]), []);\n await Store.getTemplate(this.endpoint, this.templateId, true);\n // Store.updateTemplate(this.templateId, newTemplate);\n });\n }\n\n handleCancel() {\n this.exit?.emit();\n }\n\n handleSubmit() {\n this.next?.emit();\n }\n\n getSortedRoles() {\n // NOTE: This mutates the source array but that's OK because everything that touches\n // it will want the same thing done.\n return (this.template?.roles || []).sort((a, b) => {\n return a.sequence === b.sequence ? a.order - b.order : a.sequence - b.sequence;\n });\n }\n\n getSequenceNumbers() {\n const sequenceNumbers = (this.template?.roles || []).map(role => role.sequence);\n const deduped = [...new Set(sequenceNumbers)];\n deduped.sort((a, b) => a - b);\n return deduped;\n }\n\n getRoleNames() {\n const roles = this.getSortedRoles();\n return roles.map(role => role.name);\n }\n\n getRolesAtSequence(sequence: number) {\n // Entries can be undefined when deleted because Stencil has no remove() operator yet for stores.\n // See https://github.com/ionic-team/stencil-store/issues/23\n return (this.template?.roles || []).filter(role => role && role.sequence === sequence);\n }\n\n // When the user drags a role around, we handle placement \"between\" items by assigning it a half-order number\n // e.g. 1.5 to place it between items 1 and 2, 0.5 to place it at the beginning, or last+0.5 to place it at the end.\n // Then we re-sort the list of roles and renumber them.\n async renumberTemplateRoles() {\n const sortableRoles: Record<string, IRole[]> = {};\n const renumberRequests = [];\n const sequenceNumbers = this.getSequenceNumbers();\n\n (sequenceNumbers || []).forEach(targetSeq => {\n (sortableRoles[targetSeq] || []).forEach((role, targetOrderMinusOne) => {\n const targetOrder = +targetOrderMinusOne + 1;\n if (role.sequence !== +targetSeq || role.order !== targetOrder) {\n console.log('[ROLES] Updating role', role.name, 'from', role.sequence, role.order, 'to', targetSeq, targetOrder);\n role.sequence = +targetSeq;\n role.order = targetOrder;\n renumberRequests.push(\n updateTemplateRole(this.endpoint, this.templateId, role.name, {sequence: +targetSeq, order: targetOrder})\n .then(r => console.log('[ROLES] Updated role', role.name, r))\n .catch(e => console.log('[ROLES] Error updating role', e)),\n );\n }\n });\n });\n\n console.log(`[ROLES] Awaiting ${renumberRequests.length} renumber requests`);\n await Promise.all(renumberRequests).then(async () => {\n // When renumbering, we don't try to update the store for every individual item\n // changing. We just do it once at the end.\n const newTemplate = JSON.parse(JSON.stringify(this.template));\n newTemplate.roles = Object.keys(sortableRoles).reduce((acc, seq) => acc.concat(sortableRoles[seq]), []);\n console.log(\n '[ROLES] Done renumbering',\n newTemplate.roles.map(r => ({name: r.name, sequence: r.sequence, order: r.order})),\n );\n Store.updateTemplate(this.templateId, newTemplate);\n // TODO: Explore race condition in reordering roles\n // this.template = await Store.getTemplate(this.endpoint, this.templateId, true);\n });\n\n this.rolesUpdated?.emit({event: 'updated', endpoint: this.endpoint, templateId: this.templateId, roles: this.getSortedRoles()});\n }\n\n // Look for name conflicts, because they're UGC and can be anything, regardless of order.\n getNextRoleName() {\n let name = '';\n let nextNumber = (this.template?.roles || []).length;\n do {\n nextNumber++;\n name = `Recipient ${nextNumber}`;\n } while (!name || (this.template?.roles || []).some(role => role && role.name === name));\n\n return name;\n }\n\n callCreateRole(name: string, sequence: number, order: number) {\n console.log('[ROLES] Will create role', {name, sequence, order});\n createTemplateRole(this.endpoint, this.templateId, {\n template_id: this.templateId,\n name,\n sequence,\n message: '',\n order,\n full_name: null,\n first_name: '',\n last_name: '',\n email: '',\n phone: '',\n type: 'signer',\n delegator: false,\n kba_method: null,\n })\n .then(async role => {\n console.log('[ROLES] Created role', role);\n // const newTemplate = JSON.parse(JSON.stringify(this.template));\n // newTemplate.roles.push(role);\n // TODO: Verify this immediately triggers a self-update\n console.log('Updating template in data store');\n await Store.getTemplate(this.endpoint, this.templateId, true);\n // Store.updateTemplate(this.templateId, newTemplate);\n // This will re-sort the roles and renumbers them via server calls if necessary\n // await this.renumberTemplateRoles();\n this.rolesUpdated?.emit({event: 'added', endpoint: this.endpoint, templateId: this.templateId, roles: this.getSortedRoles()});\n })\n .catch(e => {\n console.log('[ROLES] Error creating role', e);\n });\n }\n\n handleAddRole(e: any, sequence: number) {\n e.stopPropagation();\n const order = this.getRolesAtSequence(sequence).length + 1;\n const name = this.getNextRoleName();\n this.callCreateRole(name, sequence, order);\n }\n\n handleAddStep(e: any, sequence: number) {\n e.stopPropagation();\n\n const order = 1;\n const name = this.getNextRoleName();\n this.callCreateRole(name, sequence, order);\n }\n\n render() {\n if (!this.endpoint.session) {\n return (\n <Host>\n <verdocs-component-error message=\"You must be authenticated to use this module.\" />\n </Host>\n );\n }\n\n if (this.loading || !this.template) {\n return (\n <Host class=\"loading\">\n <verdocs-loader />\n </Host>\n );\n }\n\n console.log(\n '[ROLES] Rendering',\n this.template.roles.map(r => ({name: r.name, sequence: r.sequence, order: r.order})),\n );\n\n const roleNames = this.getRoleNames();\n const sequences = this.getSequenceNumbers();\n const nextSequence = sequences && sequences.length > 0 ? (sequences[sequences.length - 1] || 0) + 1 : 1;\n\n // style={{backgroundColor: getRGBA(getRoleIndex(this.template, role.name))}}\n return (\n <Host class={{dragging: this.dragging}}>\n <form onSubmit={e => e.preventDefault()} onClick={e => e.stopPropagation()} autocomplete=\"off\">\n <h5>Roles and Workflow</h5>\n\n <div class=\"roles\">\n {sequences.map((sequence, index) => (\n <div class=\"sequence\">\n <div class=\"sequence-label no-drag\">{index + 1}.</div>\n\n <div class=\"sequence-roles\" id={`verdocs-roles-sequence-${sequence}`} data-sequence={sequence}>\n {this.getRolesAtSequence(sequence).map(role => {\n const unknown = !role.email || !role.first_name || !role.last_name;\n return unknown ? (\n <div class=\"role\" data-rolename={role.name} data-sequence={sequence} data-order={role.order}>\n <div class=\"role-name\">{role.name}</div>\n <div class=\"icons\">\n <div class=\"gear-button\" innerHTML={settingsIcon} onClick={() => (this.showingRoleDialog = role.name)} aria-role=\"button\" />\n <span class=\"type-icon\" innerHTML={role.type === 'signer' ? iconSigner : role.type === 'cc' ? iconCC : iconApprover} />\n </div>\n </div>\n ) : (\n <div\n class=\"role\"\n // style={{borderColor: getRGBA(getRoleIndex(this.template, role.name))}}\n data-rolename={role.name}\n data-sequence={sequence}\n data-order={role.order}\n >\n <div class=\"role-name\">{formatFullName(role)}</div>\n <div class=\"icons\">\n <div class=\"gear-button\" innerHTML={settingsIcon} onClick={() => (this.showingRoleDialog = role.name)} aria-role=\"button\" />\n <span class=\"type-icon\" innerHTML={role.type === 'signer' ? iconSigner : role.type === 'cc' ? iconCC : iconApprover} />\n </div>\n </div>\n );\n })}\n </div>\n\n <button class=\"add-role no-drag\" innerHTML={plusIcon} onClick={e => this.handleAddRole(e, sequence)} />\n </div>\n ))}\n\n <div class=\"sequence add-sequence\">\n <div class=\"sequence-label no-drag\">{sequences.length + 1}.</div>\n\n <div class=\"sequence-roles\" id={`verdocs-roles-sequence-add-target`} data-sequence={nextSequence} />\n\n <button class=\"add-role no-drag\" innerHTML={plusIcon} onClick={e => this.handleAddRole(e, nextSequence)} />\n </div>\n </div>\n\n {roleNames.length < 1 && (\n <div class=\"empty\">\n You must add at least one Role before proceeding.\n <br /> Click the <span innerHTML={plusIcon} /> Add button above to get started.\n </div>\n )}\n\n <div class=\"buttons\">\n <div class=\"flex-fill\" />\n\n <verdocs-button variant=\"outline\" label=\"Cancel\" size=\"small\" onClick={() => this.handleCancel()} />\n <verdocs-button label=\"OK\" size=\"small\" onClick={() => this.handleSubmit()} disabled={roleNames.length < 1} />\n </div>\n </form>\n\n {this.showingRoleDialog && (\n <verdocs-menu-panel onClose={() => (this.showingRoleDialog = null)}>\n <verdocs-template-role-properties\n endpoint={this.endpoint}\n templateId={this.templateId}\n roleName={this.showingRoleDialog}\n onClose={() => {\n document.getElementById('verdocs-menu-panel-overlay')?.remove();\n this.showingRoleDialog = null;\n }}\n onDelete={async () => {\n this.showingRoleDialog = null;\n // This will re-sort the roles and renumbers them via server calls if necessary\n await this.renumberTemplateRoles();\n this.rolesUpdated?.emit({event: 'deleted', endpoint: this.endpoint, templateId: this.templateId, roles: this.getSortedRoles()});\n }}\n />\n </verdocs-menu-panel>\n )}\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"verdocs-template-roles.js","sourceRoot":"","sources":["../../../../src/components/templates/verdocs-template-roles/verdocs-template-roles.tsx"],"names":[],"mappings":"AAAA,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,EAAC,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,KAAK,EAAgB,IAAI,EAAE,IAAI,EAAE,KAAK,EAAC,MAAM,eAAe,CAAC;AAC5F,OAAO,EAAC,kBAAkB,EAAE,cAAc,EAAE,WAAW,EAAoB,kBAAkB,EAAE,eAAe,EAAC,MAAM,iBAAiB,CAAC;AACvI,OAAO,EAAC,QAAQ,EAAC,MAAM,uBAAuB,CAAC;AAC/C,OAAO,EAAC,KAAK,EAAC,MAAM,0BAA0B,CAAC;AAE/C,MAAM,YAAY,GAChB,myCAAmyC,CAAC;AAEtyC,MAAM,QAAQ,GAAG,mOAAmO,CAAC;AAErP,MAAM,UAAU,GACd,qWAAqW,CAAC;AAExW,MAAM,YAAY,GAAG,yVAAyV,CAAC;AAE/W,MAAM,MAAM,GAAG,sRAAsR,CAAC;AAEtS;;GAEG;AAMH,MAAM,OAAO,oBAAoB;;QACvB,uBAAkB,GAAG,IAAI,CAAC;QA4FlC,iBAAY,GAAe,EAAE,CAAC;wBApFM,eAAe,CAAC,UAAU,EAAE;0BAKnC,EAAE;iCAuBa,IAAI;sBAC9B,IAAI;wBAEF,KAAK;uBACN,IAAI;wBACe,IAAI;;IAE1C,oBAAoB;QAClB,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAC1B,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAC1B,CAAC;IAED,KAAK,CAAC,gBAAgB;QACpB,OAAO,CAAC,GAAG,CAAC,0BAA0B,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;QACzD,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAC1B,KAAK,CAAC,SAAS,CACb,WAAW,EACX,IAAI,CAAC,UAAU,EACf,GAAG,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,UAAU,CAAC,EACjD,KAAK,EACL,CAAC,QAAmB,EAAE,EAAE;YACtB,OAAO,CAAC,GAAG,CAAC,0BAA0B,EAAE,QAAQ,CAAC,CAAC;YAClD,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;YACzB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACvB,CAAC,CACF,CAAC;IACJ,CAAC;IAED,kBAAkB;QAChB,IAAI,IAAI,CAAC,kBAAkB,EAAE,CAAC;YAC5B,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;YACjD,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;QACjC,CAAC;IACH,CAAC;IAED,KAAK,CAAC,iBAAiB;;QACrB,IAAI,CAAC;YACH,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC;YAE5B,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC;gBACrB,OAAO,CAAC,GAAG,CAAC,wCAAwC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;gBACvE,OAAO;YACT,CAAC;YAED,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC;gBAC3B,OAAO,CAAC,GAAG,CAAC,gEAAgE,CAAC,CAAC;gBAC9E,OAAO;YACT,CAAC;YAED,IAAI,CAAC,gBAAgB,EAAE,CAAC;QAC1B,CAAC;QAAC,OAAO,CAAC,EAAE,CAAC;YACX,OAAO,CAAC,GAAG,CAAC,oCAAoC,EAAE,CAAC,CAAC,CAAC;YACrD,MAAA,IAAI,CAAC,QAAQ,0CAAE,IAAI,CAAC,IAAI,QAAQ,CAAC,CAAC,CAAC,OAAO,EAAE,MAAA,CAAC,CAAC,QAAQ,0CAAE,MAAM,EAAE,MAAA,CAAC,CAAC,QAAQ,0CAAE,IAAI,CAAC,CAAC,CAAC;QACrF,CAAC;IACH,CAAC;IAID,gBAAgB;QACd,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,OAAO,EAAE,CAAC,CAAC;QAC9C,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/B,CAAC;IAED,kBAAkB;QAChB,IAAI,CAAC,gBAAgB,EAAE,CAAC;QAExB,4BAA4B;QAC5B,MAAM,eAAe,GAAG,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAClD,CAAC,eAAe,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE;YACzC,MAAM,EAAE,GAAG,QAAQ,CAAC,cAAc,CAAC,0BAA0B,QAAQ,EAAE,CAAC,CAAC;YACzE,IAAI,EAAE,EAAE,CAAC;gBACP,MAAM,QAAQ,GAAG,IAAI,QAAQ,CAAC,EAAE,EAAE;oBAChC,KAAK,EAAE,OAAO;oBACd,SAAS,EAAE,GAAG;oBACd,cAAc,EAAE,IAAI;oBACpB,MAAM,EAAE,UAAU;oBAClB,KAAK,EAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC;oBACpC,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;oBACtC,UAAU,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;iBAC1C,CAAC,CAAC;gBACH,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;YACnC,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,MAAM,EAAE,GAAG,QAAQ,CAAC,cAAc,CAAC,mCAAmC,CAAC,CAAC;QACxE,IAAI,EAAE,EAAE,CAAC;YACP,OAAO,CAAC,GAAG,CAAC,gDAAgD,CAAC,CAAC;YAC9D,MAAM,QAAQ,GAAG,IAAI,QAAQ,CAAC,EAAE,EAAE;gBAChC,KAAK,EAAE,OAAO;gBACd,SAAS,EAAE,GAAG;gBACd,cAAc,EAAE,IAAI;gBACpB,MAAM,EAAE,UAAU;gBAClB,KAAK,EAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC;gBACpC,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;gBACtC,UAAU,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;aAC1C,CAAC,CAAC;YACH,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QACnC,CAAC;IACH,CAAC;IAED,aAAa,CAAC,GAAG;QACf,MAAM,OAAO,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC;QAC3C,MAAM,KAAK,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,OAAO,CAAC,QAAQ,CAAC;QACvC,MAAM,SAAS,GAAG,CAAC,GAAG,CAAC,QAAQ,GAAG,CAAC,CAAC;QACpC,MAAM,OAAO,GAAG,CAAC,GAAG,CAAC,QAAQ,GAAG,CAAC,CAAC;QAElC,OAAO,CAAC,GAAG,CAAC,aAAa,OAAO,IAAI,SAAS,OAAO,KAAK,IAAI,OAAO,EAAE,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC;QAElF,MAAM,aAAa,GAA4B,EAAE,CAAC;QAClD,MAAM,eAAe,GAAG,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAClD,eAAe,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE;YACjC,MAAM,GAAG,GAAG,IAAI,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;YAE9C,aAAa,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC;QACpE,CAAC,CAAC,CAAC;QAEH,mFAAmF;QACnF,mBAAmB;QACnB,aAAa,CAAC,eAAe,CAAC,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC;QAEpE,MAAM,IAAI,GAAG,aAAa,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,SAAS,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAChE,aAAa,CAAC,KAAK,MAAnB,aAAa,CAAC,KAAK,IAAM,EAAE,EAAC;QAC5B,aAAa,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,OAAO,GAAG,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,CAAC;QAElD,MAAM,gBAAgB,GAAG,EAAE,CAAC;QAC5B,MAAM,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EAAE,KAAK,CAAC,EAAE,EAAE;YAC3D,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;gBAC5B,IAAI,CAAC,IAAI,EAAE,CAAC;oBACV,OAAO;gBACT,CAAC;gBAED,MAAM,WAAW,GAAG,CAAC,KAAK,GAAG,CAAC,CAAC;gBAC/B,IAAI,IAAI,CAAC,QAAQ,KAAK,CAAC,SAAS,IAAI,IAAI,CAAC,KAAK,KAAK,WAAW,EAAE,CAAC;oBAC/D,IAAI,CAAC,QAAQ,GAAG,CAAC,SAAS,CAAC;oBAC3B,IAAI,CAAC,KAAK,GAAG,WAAW,CAAC;oBACzB,gBAAgB,CAAC,IAAI,CACnB,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,IAAI,EAAE,EAAC,QAAQ,EAAE,CAAC,SAAS,EAAE,KAAK,EAAE,WAAW,EAAC,CAAC;yBACtG,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,sBAAsB,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC;yBAC5D,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,6BAA6B,EAAE,CAAC,CAAC,CAAC,CAC7D,CAAC;gBACJ,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;QAEH,OAAO,OAAO,CAAC,GAAG,CAAC,gBAAgB,CAAC;aACjC,IAAI,CAAC,KAAK,IAAI,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,0BAA0B,CAAC,CAAC;aACzD,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,8BAA8B,EAAE,CAAC,CAAC,CAAC,CAAC;IAChE,CAAC;IAED,YAAY;;QACV,MAAA,IAAI,CAAC,IAAI,0CAAE,IAAI,EAAE,CAAC;IACpB,CAAC;IAED,YAAY;;QACV,MAAA,IAAI,CAAC,IAAI,0CAAE,IAAI,EAAE,CAAC;IACpB,CAAC;IAED,cAAc;;QACZ,oFAAoF;QACpF,oCAAoC;QACpC,OAAO,CAAC,CAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,KAAK,KAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;YAChD,OAAO,CAAC,CAAC,QAAQ,KAAK,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,GAAG,CAAC,CAAC,QAAQ,CAAC;QACjF,CAAC,CAAC,CAAC;IACL,CAAC;IAED,kBAAkB;;QAChB,MAAM,eAAe,GAAG,CAAC,CAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,KAAK,KAAI,EAAE,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAChF,MAAM,OAAO,GAAG,CAAC,GAAG,IAAI,GAAG,CAAC,eAAe,CAAC,CAAC,CAAC;QAC9C,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;QAC9B,OAAO,OAAO,CAAC;IACjB,CAAC;IAED,YAAY;QACV,MAAM,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;QACpC,OAAO,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACtC,CAAC;IAED,kBAAkB,CAAC,QAAgB;;QACjC,iGAAiG;QACjG,4DAA4D;QAC5D,OAAO,CAAC,CAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,KAAK,KAAI,EAAE,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,KAAK,QAAQ,CAAC,CAAC;IACzF,CAAC;IAED,6GAA6G;IAC7G,oHAAoH;IACpH,uDAAuD;IACvD,KAAK,CAAC,qBAAqB;;QACzB,MAAM,aAAa,GAA4B,EAAE,CAAC;QAClD,MAAM,gBAAgB,GAAG,EAAE,CAAC;QAC5B,MAAM,eAAe,GAAG,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAElD,CAAC,eAAe,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE;YAC1C,CAAC,aAAa,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,mBAAmB,EAAE,EAAE;gBACrE,MAAM,WAAW,GAAG,CAAC,mBAAmB,GAAG,CAAC,CAAC;gBAC7C,IAAI,IAAI,CAAC,QAAQ,KAAK,CAAC,SAAS,IAAI,IAAI,CAAC,KAAK,KAAK,WAAW,EAAE,CAAC;oBAC/D,OAAO,CAAC,GAAG,CAAC,uBAAuB,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,WAAW,CAAC,CAAC;oBACjH,IAAI,CAAC,QAAQ,GAAG,CAAC,SAAS,CAAC;oBAC3B,IAAI,CAAC,KAAK,GAAG,WAAW,CAAC;oBACzB,gBAAgB,CAAC,IAAI,CACnB,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,IAAI,EAAE,EAAC,QAAQ,EAAE,CAAC,SAAS,EAAE,KAAK,EAAE,WAAW,EAAC,CAAC;yBACtG,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,sBAAsB,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC;yBAC5D,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,6BAA6B,EAAE,CAAC,CAAC,CAAC,CAC7D,CAAC;gBACJ,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;QAEH,OAAO,CAAC,GAAG,CAAC,oBAAoB,gBAAgB,CAAC,MAAM,oBAAoB,CAAC,CAAC;QAC7E,MAAM,OAAO,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,EAAE;YAClD,+EAA+E;YAC/E,2CAA2C;YAC3C,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC;YAC9D,WAAW,CAAC,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,MAAM,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;YACxG,OAAO,CAAC,GAAG,CACT,0BAA0B,EAC1B,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAAC,IAAI,EAAE,CAAC,CAAC,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,EAAC,CAAC,CAAC,CACnF,CAAC;YACF,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC;YACnD,mDAAmD;YACnD,iFAAiF;QACnF,CAAC,CAAC,CAAC;QAEH,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAC,EAAC,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE,EAAC,CAAC,CAAC;IAClI,CAAC;IAED,yFAAyF;IACzF,eAAe;;QACb,IAAI,IAAI,GAAG,EAAE,CAAC;QACd,IAAI,UAAU,GAAG,CAAC,CAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,KAAK,KAAI,EAAE,CAAC,CAAC,MAAM,CAAC;QACrD,GAAG,CAAC;YACF,UAAU,EAAE,CAAC;YACb,IAAI,GAAG,aAAa,UAAU,EAAE,CAAC;QACnC,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,CAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,KAAK,KAAI,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,EAAE;QAEzF,OAAO,IAAI,CAAC;IACd,CAAC;IAED,cAAc,CAAC,IAAY,EAAE,QAAgB,EAAE,KAAa;QAC1D,OAAO,CAAC,GAAG,CAAC,0BAA0B,EAAE,EAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAC,CAAC,CAAC;QACjE,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,UAAU,EAAE;YACjD,WAAW,EAAE,IAAI,CAAC,UAAU;YAC5B,IAAI;YACJ,QAAQ;YACR,OAAO,EAAE,EAAE;YACX,KAAK;YACL,SAAS,EAAE,IAAI;YACf,UAAU,EAAE,EAAE;YACd,SAAS,EAAE,EAAE;YACb,KAAK,EAAE,EAAE;YACT,KAAK,EAAE,EAAE;YACT,IAAI,EAAE,QAAQ;YACd,SAAS,EAAE,KAAK;YAChB,UAAU,EAAE,IAAI;SACjB,CAAC;aACC,IAAI,CAAC,KAAK,EAAC,IAAI,EAAC,EAAE;;YACjB,OAAO,CAAC,GAAG,CAAC,sBAAsB,EAAE,IAAI,CAAC,CAAC;YAC1C,iEAAiE;YACjE,gCAAgC;YAChC,uDAAuD;YACvD,OAAO,CAAC,GAAG,CAAC,iCAAiC,CAAC,CAAC;YAC/C,MAAM,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;YAC9D,sDAAsD;YACtD,+EAA+E;YAC/E,sCAAsC;YACtC,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAC,EAAC,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE,EAAC,CAAC,CAAC;QAChI,CAAC,CAAC;aACD,KAAK,CAAC,CAAC,CAAC,EAAE;YACT,OAAO,CAAC,GAAG,CAAC,6BAA6B,EAAE,CAAC,CAAC,CAAC;QAChD,CAAC,CAAC,CAAC;IACP,CAAC;IAED,aAAa,CAAC,CAAM,EAAE,QAAgB;QACpC,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,MAAM,KAAK,GAAG,IAAI,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;QAC3D,MAAM,IAAI,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QACpC,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;IAC7C,CAAC;IAED,aAAa,CAAC,CAAM,EAAE,QAAgB;QACpC,CAAC,CAAC,eAAe,EAAE,CAAC;QAEpB,MAAM,KAAK,GAAG,CAAC,CAAC;QAChB,MAAM,IAAI,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QACpC,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;IAC7C,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC;YAC3B,OAAO,CACL,EAAC,IAAI;gBACH,+BAAyB,OAAO,EAAC,+CAA+C,GAAG,CAC9E,CACR,CAAC;QACJ,CAAC;QAED,IAAI,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;YACnC,OAAO,CACL,EAAC,IAAI,IAAC,KAAK,EAAC,SAAS;gBACnB,yBAAkB,CACb,CACR,CAAC;QACJ,CAAC;QAED,OAAO,CAAC,GAAG,CACT,mBAAmB,EACnB,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAAC,IAAI,EAAE,CAAC,CAAC,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,EAAC,CAAC,CAAC,CACrF,CAAC;QAEF,MAAM,SAAS,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QACtC,MAAM,SAAS,GAAG,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAC5C,MAAM,YAAY,GAAG,SAAS,IAAI,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAExG,6EAA6E;QAC7E,OAAO,CACL,EAAC,IAAI,IAAC,KAAK,EAAE,EAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAC;YACpC,YAAM,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EAAE,YAAY,EAAC,KAAK;gBAC5F,mCAA2B;gBAE3B,WAAK,KAAK,EAAC,OAAO;oBACf,SAAS,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,KAAK,EAAE,EAAE,CAAC,CAClC,WAAK,KAAK,EAAC,UAAU;wBAClB,OAAO,CAAC,GAAG,CAAC,oBAAoB,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;wBACtF,WAAK,KAAK,EAAC,wBAAwB;4BAAE,KAAK,GAAG,CAAC;gCAAQ;wBAEtD,WAAK,KAAK,EAAC,gBAAgB,EAAC,EAAE,EAAE,0BAA0B,QAAQ,EAAE,mBAAiB,QAAQ,IAC1F,IAAI,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;4BAC5C,MAAM,OAAO,GAAG,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC;4BACnE,OAAO,OAAO,CAAC,CAAC,CAAC,CACf,WAAK,KAAK,EAAC,MAAM,mBAAgB,IAAI,CAAC,IAAI,mBAAiB,QAAQ,gBAAc,IAAI,CAAC,KAAK;gCACzF,WAAK,KAAK,EAAC,WAAW,IAAE,IAAI,CAAC,IAAI,CAAO;gCACxC,WAAK,KAAK,EAAC,OAAO;oCAChB,WAAK,KAAK,EAAC,aAAa,EAAC,SAAS,EAAE,YAAY,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,IAAI,CAAC,eAAY,QAAQ,GAAG;oCAC5H,YAAM,KAAK,EAAC,WAAW,EAAC,SAAS,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,YAAY,GAAI,CACnH,CACF,CACP,CAAC,CAAC,CAAC,CACF,WACE,KAAK,EAAC,MAAM,mBAEG,IAAI,CAAC,IAAI,mBACT,QAAQ,gBACX,IAAI,CAAC,KAAK;gCAEtB,WAAK,KAAK,EAAC,WAAW,IAAE,cAAc,CAAC,IAAI,CAAC,CAAO;gCACnD,WAAK,KAAK,EAAC,OAAO;oCAChB,WAAK,KAAK,EAAC,aAAa,EAAC,SAAS,EAAE,YAAY,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,IAAI,CAAC,eAAY,QAAQ,GAAG;oCAC5H,YAAM,KAAK,EAAC,WAAW,EAAC,SAAS,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,YAAY,GAAI,CACnH,CACF,CACP,CAAC;wBACJ,CAAC,CAAC,CACE;wBAEN,cAAQ,KAAK,EAAC,kBAAkB,EAAC,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,EAAE,QAAQ,CAAC,GAAI,CACnG,CACP,CAAC;oBAEF,WAAK,KAAK,EAAC,uBAAuB;wBAChC,WAAK,KAAK,EAAC,wBAAwB;4BAAE,SAAS,CAAC,MAAM,GAAG,CAAC;gCAAQ;wBAEjE,WAAK,KAAK,EAAC,gBAAgB,EAAC,EAAE,EAAE,mCAAmC,mBAAiB,YAAY,GAAI;wBAEpG,cAAQ,KAAK,EAAC,kBAAkB,EAAC,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,EAAE,YAAY,CAAC,GAAI,CACvG,CACF;gBAEL,SAAS,CAAC,MAAM,GAAG,CAAC,IAAI,CACvB,WAAK,KAAK,EAAC,OAAO;;oBAEhB,aAAM;;oBAAW,YAAM,SAAS,EAAE,QAAQ,GAAI;wDAC1C,CACP;gBAED,WAAK,KAAK,EAAC,SAAS;oBAClB,WAAK,KAAK,EAAC,WAAW,GAAG;oBAEzB,sBAAgB,OAAO,EAAC,SAAS,EAAC,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,EAAE,GAAI;oBACpG,sBAAgB,KAAK,EAAC,IAAI,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,EAAE,EAAE,QAAQ,EAAE,SAAS,CAAC,MAAM,GAAG,CAAC,GAAI,CAC1G,CACD;YAEN,IAAI,CAAC,iBAAiB,IAAI,CACzB,0BAAoB,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;gBAChE,wCACE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,QAAQ,EAAE,IAAI,CAAC,iBAAiB,EAChC,OAAO,EAAE,GAAG,EAAE;;wBACZ,MAAA,QAAQ,CAAC,cAAc,CAAC,4BAA4B,CAAC,0CAAE,MAAM,EAAE,CAAC;wBAChE,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;oBAChC,CAAC,EACD,QAAQ,EAAE,KAAK,IAAI,EAAE;;wBACnB,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;wBAC9B,+EAA+E;wBAC/E,MAAM,IAAI,CAAC,qBAAqB,EAAE,CAAC;wBACnC,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAC,EAAC,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE,EAAC,CAAC,CAAC;oBAClI,CAAC,GACD,CACiB,CACtB,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import Sortable from 'sortablejs';\nimport {Component, h, Element, Event, EventEmitter, Host, Prop, State} from '@stencil/core';\nimport {createTemplateRole, formatFullName, getTemplate, IRole, ITemplate, updateTemplateRole, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {SDKError} from '../../../utils/errors';\nimport {Store} from '../../../utils/Datastore';\n\nconst settingsIcon =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"20\" width=\"20\" fill=\"#00000089\"><path d=\"m8.021 17.917-.313-2.5q-.27-.125-.625-.334-.354-.208-.625-.395l-2.312.979-1.979-3.438 1.979-1.5q-.021-.167-.031-.364-.011-.198-.011-.365 0-.146.011-.344.01-.198.031-.385l-1.979-1.5 1.979-3.417 2.312.958q.271-.187.615-.385t.635-.344l.313-2.5h3.958l.313 2.5q.312.167.625.344.312.177.604.385l2.333-.958 1.979 3.417-1.979 1.521q.021.187.021.364V10q0 .146-.01.333-.011.188-.011.396l1.958 1.5-1.979 3.438-2.312-.979q-.292.208-.615.395-.323.188-.614.334l-.313 2.5Zm1.937-5.355q1.063 0 1.813-.75t.75-1.812q0-1.062-.75-1.812t-1.813-.75q-1.041 0-1.802.75-.76.75-.76 1.812t.76 1.812q.761.75 1.802.75Zm0-1.333q-.5 0-.864-.364-.365-.365-.365-.865t.365-.865q.364-.364.864-.364t.865.364q.365.365.365.865t-.365.865q-.365.364-.865.364ZM10.021 10Zm-.854 6.583h1.666l.25-2.187q.605-.167 1.136-.49.531-.323 1.031-.802l2.021.875.854-1.375-1.792-1.354q.105-.333.136-.635.031-.303.031-.615 0-.292-.031-.573-.031-.281-.115-.635l1.792-1.396-.834-1.375-2.062.875q-.438-.438-1.021-.781-.583-.344-1.125-.49l-.271-2.208H9.167l-.271 2.208q-.584.146-1.125.458-.542.313-1.042.792l-2.021-.854-.833 1.375 1.75 1.354q-.083.333-.125.646-.042.312-.042.604t.042.594q.042.302.125.635l-1.75 1.375.833 1.375 2.021-.854q.479.458 1.021.771.542.312 1.146.479Z\"/></svg>';\n\nconst plusIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"#ffffff\" viewBox=\"0 0 24 24\" strokeWidth={1.5} stroke=\"currentColor\"><path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M12 9v6m3-3H9m12 0a9 9 0 11-18 0 9 9 0 0118 0z\" /></svg>`;\n\nconst iconSigner =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"m9.225 21.225 4.65-4.65h8.45v4.65Zm-5.35-2.2H5.05l8.5-8.5-1.175-1.175-8.5 8.5Zm14.25-9.95L13.8 4.8l1.325-1.325q.625-.65 1.525-.663.9-.012 1.6.663l1.225 1.175q.675.675.663 1.562-.013.888-.663 1.513ZM16.7 10.55 6 21.225H1.675V16.9L12.35 6.225Zm-3.725-.625-.6-.575 1.175 1.175Z\"/></svg>';\n\nconst iconApprover = `<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path fill-rule=\"evenodd\" d=\"M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12zm13.36-1.814a.75.75 0 10-1.22-.872l-3.236 4.53L9.53 12.22a.75.75 0 00-1.06 1.06l2.25 2.25a.75.75 0 001.14-.094l3.75-5.25z\" clip-rule=\"evenodd\" /></svg>`;\n\nconst iconCC = `<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\"><path d=\"M1.5 8.67v8.58a3 3 0 003 3h15a3 3 0 003-3V8.67l-8.928 5.493a3 3 0 01-3.144 0L1.5 8.67z\" /><path d=\"M22.5 6.908V6.75a3 3 0 00-3-3h-15a3 3 0 00-3 3v.158l9.714 5.978a1.5 1.5 0 001.572 0L22.5 6.908z\" /></svg>`;\n\n/**\n * Display an edit form that allows the user to adjust a template's roles and workflow.\n */\n@Component({\n tag: 'verdocs-template-roles',\n styleUrl: 'verdocs-template-roles.scss',\n shadow: false,\n})\nexport class VerdocsTemplateRoles {\n private templateListenerId = null;\n\n @Element()\n el: HTMLElement;\n\n /**\n * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n */\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /**\n * The template ID to edit.\n */\n @Prop() templateId: string = '';\n\n /**\n * Event fired when the user clicks to proceed.\n */\n @Event({composed: true}) next: EventEmitter;\n\n /**\n * Event fired when the step is cancelled. This is called exit to avoid conflicts with the JS-reserved \"cancel\" event name.\n */\n @Event({composed: true}) exit: EventEmitter;\n\n /**\n * Event fired if an error occurs. The event details will contain information about the error. Most errors will\n * terminate the process, and the calling application should correct the condition and re-render the component.\n */\n @Event({composed: true}) sdkError: EventEmitter<SDKError>;\n\n /**\n * Event fired when the template is updated in any way. May be used for tasks such as cache invalidation or reporting to other systems.\n */\n @Event({composed: true}) rolesUpdated: EventEmitter<{endpoint: VerdocsEndpoint; templateId: string; event: 'added' | 'deleted' | 'updated'; roles: IRole[]}>;\n\n @State() showingRoleDialog: string | null = null;\n @State() sender = null;\n\n @State() dragging = false;\n @State() loading = true;\n @State() template: ITemplate | null = null;\n\n disconnectedCallback() {\n this.unlistenToTemplate();\n this.cleanupSortables();\n }\n\n async listenToTemplate() {\n console.log('[ROLES] Loading template', this.templateId);\n this.unlistenToTemplate();\n Store.subscribe(\n 'templates',\n this.templateId,\n () => getTemplate(this.endpoint, this.templateId),\n false,\n (template: ITemplate) => {\n console.log('[ROLES] Template Updated', template);\n this.template = template;\n this.loading = false;\n },\n );\n }\n\n unlistenToTemplate() {\n if (this.templateListenerId) {\n Store.store.delListener(this.templateListenerId);\n this.templateListenerId = null;\n }\n }\n\n async componentWillLoad() {\n try {\n this.endpoint.loadSession();\n\n if (!this.templateId) {\n console.log(`[ROLES] Missing required template ID ${this.templateId}`);\n return;\n }\n\n if (!this.endpoint.session) {\n console.log('[ROLES] Unable to start builder session, must be authenticated');\n return;\n }\n\n this.listenToTemplate();\n } catch (e) {\n console.log('[ROLES] Error with preview session', e);\n this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n }\n }\n\n sortableRefs: Sortable[] = [];\n\n cleanupSortables() {\n this.sortableRefs.forEach(sr => sr.destroy());\n this.sortableRefs.length = 0;\n }\n\n componentDidRender() {\n this.cleanupSortables();\n\n // Existing sequence numbers\n const sequenceNumbers = this.getSequenceNumbers();\n (sequenceNumbers || []).forEach(sequence => {\n const el = document.getElementById(`verdocs-roles-sequence-${sequence}`);\n if (el) {\n const sortable = new Sortable(el, {\n group: 'roles',\n animation: 150,\n dragoverBubble: true,\n filter: '.no-drag',\n onEnd: this.handleMoveEnd.bind(this),\n onChoose: () => (this.dragging = true),\n onUnchoose: () => (this.dragging = false),\n });\n this.sortableRefs.push(sortable);\n }\n });\n\n const el = document.getElementById(`verdocs-roles-sequence-add-target`);\n if (el) {\n console.log('[ROLES] Applying sortable to add-sequence slot');\n const sortable = new Sortable(el, {\n group: 'roles',\n animation: 150,\n dragoverBubble: true,\n filter: '.no-drag',\n onEnd: this.handleMoveEnd.bind(this),\n onChoose: () => (this.dragging = true),\n onUnchoose: () => (this.dragging = false),\n });\n this.sortableRefs.push(sortable);\n }\n }\n\n handleMoveEnd(evt) {\n const fromSeq = +evt.from.dataset.sequence;\n const toSeq = +evt.to.dataset.sequence;\n const fromIndex = +evt.oldIndex + 1;\n const toIndex = +evt.newIndex + 1;\n\n console.log(`Move from ${fromSeq}:${fromIndex} to ${toSeq}:${toIndex}`, evt.item);\n\n const sortableRoles: Record<string, IRole[]> = {};\n const sequenceNumbers = this.getSequenceNumbers();\n sequenceNumbers.forEach(sequence => {\n const ras = this.getRolesAtSequence(sequence);\n\n sortableRoles[String(sequence)] = JSON.parse(JSON.stringify(ras));\n });\n\n // We might be adding a new sequence number now. Make sure we have an array to drop\n // the record into.\n sortableRoles[sequenceNumbers[sequenceNumbers.length - 1] + 1] = [];\n\n const role = sortableRoles[fromSeq].splice(fromIndex - 1, 1)[0];\n sortableRoles[toSeq] ||= [];\n sortableRoles[toSeq].splice(toIndex - 1, 0, role);\n\n const renumberRequests = [];\n Object.entries(sortableRoles).forEach(([targetSeq, roles]) => {\n roles.forEach((role, index) => {\n if (!role) {\n return;\n }\n\n const targetOrder = +index + 1;\n if (role.sequence !== +targetSeq || role.order !== targetOrder) {\n role.sequence = +targetSeq;\n role.order = targetOrder;\n renumberRequests.push(\n updateTemplateRole(this.endpoint, this.templateId, role.name, {sequence: +targetSeq, order: targetOrder})\n .then(r => console.log('[ROLES] Updated role', role.name, r))\n .catch(e => console.log('[ROLES] Error updating role', e)),\n );\n }\n });\n });\n\n return Promise.all(renumberRequests)\n .then(async () => console.log('[ROLES] Done renumbering'))\n .catch(e => console.log('[ROLES] Error updating roles', e));\n }\n\n handleCancel() {\n this.exit?.emit();\n }\n\n handleSubmit() {\n this.next?.emit();\n }\n\n getSortedRoles() {\n // NOTE: This mutates the source array but that's OK because everything that touches\n // it will want the same thing done.\n return (this.template?.roles || []).sort((a, b) => {\n return a.sequence === b.sequence ? a.order - b.order : a.sequence - b.sequence;\n });\n }\n\n getSequenceNumbers() {\n const sequenceNumbers = (this.template?.roles || []).map(role => role.sequence);\n const deduped = [...new Set(sequenceNumbers)];\n deduped.sort((a, b) => a - b);\n return deduped;\n }\n\n getRoleNames() {\n const roles = this.getSortedRoles();\n return roles.map(role => role.name);\n }\n\n getRolesAtSequence(sequence: number) {\n // Entries can be undefined when deleted because Stencil has no remove() operator yet for stores.\n // See https://github.com/ionic-team/stencil-store/issues/23\n return (this.template?.roles || []).filter(role => role && role.sequence === sequence);\n }\n\n // When the user drags a role around, we handle placement \"between\" items by assigning it a half-order number\n // e.g. 1.5 to place it between items 1 and 2, 0.5 to place it at the beginning, or last+0.5 to place it at the end.\n // Then we re-sort the list of roles and renumber them.\n async renumberTemplateRoles() {\n const sortableRoles: Record<string, IRole[]> = {};\n const renumberRequests = [];\n const sequenceNumbers = this.getSequenceNumbers();\n\n (sequenceNumbers || []).forEach(targetSeq => {\n (sortableRoles[targetSeq] || []).forEach((role, targetOrderMinusOne) => {\n const targetOrder = +targetOrderMinusOne + 1;\n if (role.sequence !== +targetSeq || role.order !== targetOrder) {\n console.log('[ROLES] Updating role', role.name, 'from', role.sequence, role.order, 'to', targetSeq, targetOrder);\n role.sequence = +targetSeq;\n role.order = targetOrder;\n renumberRequests.push(\n updateTemplateRole(this.endpoint, this.templateId, role.name, {sequence: +targetSeq, order: targetOrder})\n .then(r => console.log('[ROLES] Updated role', role.name, r))\n .catch(e => console.log('[ROLES] Error updating role', e)),\n );\n }\n });\n });\n\n console.log(`[ROLES] Awaiting ${renumberRequests.length} renumber requests`);\n await Promise.all(renumberRequests).then(async () => {\n // When renumbering, we don't try to update the store for every individual item\n // changing. We just do it once at the end.\n const newTemplate = JSON.parse(JSON.stringify(this.template));\n newTemplate.roles = Object.keys(sortableRoles).reduce((acc, seq) => acc.concat(sortableRoles[seq]), []);\n console.log(\n '[ROLES] Done renumbering',\n newTemplate.roles.map(r => ({name: r.name, sequence: r.sequence, order: r.order})),\n );\n Store.updateTemplate(this.templateId, newTemplate);\n // TODO: Explore race condition in reordering roles\n // this.template = await Store.getTemplate(this.endpoint, this.templateId, true);\n });\n\n this.rolesUpdated?.emit({event: 'updated', endpoint: this.endpoint, templateId: this.templateId, roles: this.getSortedRoles()});\n }\n\n // Look for name conflicts, because they're UGC and can be anything, regardless of order.\n getNextRoleName() {\n let name = '';\n let nextNumber = (this.template?.roles || []).length;\n do {\n nextNumber++;\n name = `Recipient ${nextNumber}`;\n } while (!name || (this.template?.roles || []).some(role => role && role.name === name));\n\n return name;\n }\n\n callCreateRole(name: string, sequence: number, order: number) {\n console.log('[ROLES] Will create role', {name, sequence, order});\n createTemplateRole(this.endpoint, this.templateId, {\n template_id: this.templateId,\n name,\n sequence,\n message: '',\n order,\n full_name: null,\n first_name: '',\n last_name: '',\n email: '',\n phone: '',\n type: 'signer',\n delegator: false,\n kba_method: null,\n })\n .then(async role => {\n console.log('[ROLES] Created role', role);\n // const newTemplate = JSON.parse(JSON.stringify(this.template));\n // newTemplate.roles.push(role);\n // TODO: Verify this immediately triggers a self-update\n console.log('Updating template in data store');\n await Store.getTemplate(this.endpoint, this.templateId, true);\n // Store.updateTemplate(this.templateId, newTemplate);\n // This will re-sort the roles and renumbers them via server calls if necessary\n // await this.renumberTemplateRoles();\n this.rolesUpdated?.emit({event: 'added', endpoint: this.endpoint, templateId: this.templateId, roles: this.getSortedRoles()});\n })\n .catch(e => {\n console.log('[ROLES] Error creating role', e);\n });\n }\n\n handleAddRole(e: any, sequence: number) {\n e.stopPropagation();\n const order = this.getRolesAtSequence(sequence).length + 1;\n const name = this.getNextRoleName();\n this.callCreateRole(name, sequence, order);\n }\n\n handleAddStep(e: any, sequence: number) {\n e.stopPropagation();\n\n const order = 1;\n const name = this.getNextRoleName();\n this.callCreateRole(name, sequence, order);\n }\n\n render() {\n if (!this.endpoint.session) {\n return (\n <Host>\n <verdocs-component-error message=\"You must be authenticated to use this module.\" />\n </Host>\n );\n }\n\n if (this.loading || !this.template) {\n return (\n <Host class=\"loading\">\n <verdocs-loader />\n </Host>\n );\n }\n\n console.log(\n '[ROLES] Rendering',\n this.template.roles.map(r => ({name: r.name, sequence: r.sequence, order: r.order})),\n );\n\n const roleNames = this.getRoleNames();\n const sequences = this.getSequenceNumbers();\n const nextSequence = sequences && sequences.length > 0 ? (sequences[sequences.length - 1] || 0) + 1 : 1;\n\n // style={{backgroundColor: getRGBA(getRoleIndex(this.template, role.name))}}\n return (\n <Host class={{dragging: this.dragging}}>\n <form onSubmit={e => e.preventDefault()} onClick={e => e.stopPropagation()} autocomplete=\"off\">\n <h5>Roles and Workflow</h5>\n\n <div class=\"roles\">\n {sequences.map((sequence, index) => (\n <div class=\"sequence\">\n {console.log('Rendering sequence', sequence, index, this.getRolesAtSequence(sequence))}\n <div class=\"sequence-label no-drag\">{index + 1}.</div>\n\n <div class=\"sequence-roles\" id={`verdocs-roles-sequence-${sequence}`} data-sequence={sequence}>\n {this.getRolesAtSequence(sequence).map(role => {\n const unknown = !role.email || !role.first_name || !role.last_name;\n return unknown ? (\n <div class=\"role\" data-rolename={role.name} data-sequence={sequence} data-order={role.order}>\n <div class=\"role-name\">{role.name}</div>\n <div class=\"icons\">\n <div class=\"gear-button\" innerHTML={settingsIcon} onClick={() => (this.showingRoleDialog = role.name)} aria-role=\"button\" />\n <span class=\"type-icon\" innerHTML={role.type === 'signer' ? iconSigner : role.type === 'cc' ? iconCC : iconApprover} />\n </div>\n </div>\n ) : (\n <div\n class=\"role\"\n // style={{borderColor: getRGBA(getRoleIndex(this.template, role.name))}}\n data-rolename={role.name}\n data-sequence={sequence}\n data-order={role.order}\n >\n <div class=\"role-name\">{formatFullName(role)}</div>\n <div class=\"icons\">\n <div class=\"gear-button\" innerHTML={settingsIcon} onClick={() => (this.showingRoleDialog = role.name)} aria-role=\"button\" />\n <span class=\"type-icon\" innerHTML={role.type === 'signer' ? iconSigner : role.type === 'cc' ? iconCC : iconApprover} />\n </div>\n </div>\n );\n })}\n </div>\n\n <button class=\"add-role no-drag\" innerHTML={plusIcon} onClick={e => this.handleAddRole(e, sequence)} />\n </div>\n ))}\n\n <div class=\"sequence add-sequence\">\n <div class=\"sequence-label no-drag\">{sequences.length + 1}.</div>\n\n <div class=\"sequence-roles\" id={`verdocs-roles-sequence-add-target`} data-sequence={nextSequence} />\n\n <button class=\"add-role no-drag\" innerHTML={plusIcon} onClick={e => this.handleAddRole(e, nextSequence)} />\n </div>\n </div>\n\n {roleNames.length < 1 && (\n <div class=\"empty\">\n You must add at least one Role before proceeding.\n <br /> Click the <span innerHTML={plusIcon} /> Add button above to get started.\n </div>\n )}\n\n <div class=\"buttons\">\n <div class=\"flex-fill\" />\n\n <verdocs-button variant=\"outline\" label=\"Cancel\" size=\"small\" onClick={() => this.handleCancel()} />\n <verdocs-button label=\"OK\" size=\"small\" onClick={() => this.handleSubmit()} disabled={roleNames.length < 1} />\n </div>\n </form>\n\n {this.showingRoleDialog && (\n <verdocs-menu-panel onClose={() => (this.showingRoleDialog = null)}>\n <verdocs-template-role-properties\n endpoint={this.endpoint}\n templateId={this.templateId}\n roleName={this.showingRoleDialog}\n onClose={() => {\n document.getElementById('verdocs-menu-panel-overlay')?.remove();\n this.showingRoleDialog = null;\n }}\n onDelete={async () => {\n this.showingRoleDialog = null;\n // This will re-sort the roles and renumbers them via server calls if necessary\n await this.renumberTemplateRoles();\n this.rolesUpdated?.emit({event: 'deleted', endpoint: this.endpoint, templateId: this.templateId, roles: this.getSortedRoles()});\n }}\n />\n </verdocs-menu-panel>\n )}\n </Host>\n );\n }\n}\n"]}