legalesign-document-viewer 0.2.10 → 0.2.11

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 (227) hide show
  1. package/dist/cjs/loader.cjs.js +1 -1
  2. package/dist/cjs/ls-document-options_43.cjs.entry.js +171 -78
  3. package/dist/cjs/ls-document-options_43.cjs.entry.js.map +1 -1
  4. package/dist/cjs/ls-document-viewer.cjs.js +1 -1
  5. package/dist/collection/components/ls-document-options/ls-document-options.js +62 -1
  6. package/dist/collection/components/ls-document-options/ls-document-options.js.map +1 -1
  7. package/dist/collection/components/ls-document-viewer/adapter/LsDocumentAdapter.js +3 -2
  8. package/dist/collection/components/ls-document-viewer/adapter/LsDocumentAdapter.js.map +1 -1
  9. package/dist/collection/components/ls-document-viewer/adapter/roleActions.js +4 -4
  10. package/dist/collection/components/ls-document-viewer/adapter/roleActions.js.map +1 -1
  11. package/dist/collection/components/ls-document-viewer/editorCalculator.js +6 -0
  12. package/dist/collection/components/ls-document-viewer/editorCalculator.js.map +1 -1
  13. package/dist/collection/components/ls-document-viewer/ls-document-viewer.css +16 -18
  14. package/dist/collection/components/ls-document-viewer/ls-document-viewer.js +10 -5
  15. package/dist/collection/components/ls-document-viewer/ls-document-viewer.js.map +1 -1
  16. package/dist/collection/components/ls-document-viewer/mouseHandlers.js.map +1 -1
  17. package/dist/collection/components/ls-editor-field/ls-editor-field.css +7 -0
  18. package/dist/collection/components/ls-editor-field/ls-editor-field.js +1 -1
  19. package/dist/collection/components/ls-editor-field/ls-editor-field.js.map +1 -1
  20. package/dist/collection/components/ls-field-content/ls-field-content.js +68 -2
  21. package/dist/collection/components/ls-field-content/ls-field-content.js.map +1 -1
  22. package/dist/collection/components/ls-field-properties-advanced/ls-field-properties-advanced.css +22 -1
  23. package/dist/collection/components/ls-field-properties-advanced/ls-field-properties-advanced.js +29 -4
  24. package/dist/collection/components/ls-field-properties-advanced/ls-field-properties-advanced.js.map +1 -1
  25. package/dist/collection/components/ls-field-properties-autosign/ls-field-properties-autosign.js +1 -1
  26. package/dist/collection/components/ls-field-properties-container/ls-field-properties-container.js +1 -1
  27. package/dist/collection/components/ls-field-properties-date/ls-field-properties-date.js +1 -1
  28. package/dist/collection/components/ls-field-properties-date/ls-field-properties-date.js.map +1 -1
  29. package/dist/collection/components/ls-field-properties-email/ls-field-properties-email.js +1 -1
  30. package/dist/collection/components/ls-field-properties-email/ls-field-properties-email.js.map +1 -1
  31. package/dist/collection/components/ls-field-properties-file/ls-field-properties-file.js +1 -1
  32. package/dist/collection/components/ls-field-properties-file/ls-field-properties-file.js.map +1 -1
  33. package/dist/collection/components/ls-field-properties-general/ls-field-properties-general.js +1 -1
  34. package/dist/collection/components/ls-field-properties-general/ls-field-properties-general.js.map +1 -1
  35. package/dist/collection/components/ls-field-properties-image/ls-field-properties-image.js +1 -1
  36. package/dist/collection/components/ls-field-properties-image/ls-field-properties-image.js.map +1 -1
  37. package/dist/collection/components/ls-field-properties-multiple/ls-field-properties-multiple.js +3 -3
  38. package/dist/collection/components/ls-field-properties-number/ls-field-properties-number.js +1 -1
  39. package/dist/collection/components/ls-field-properties-number/ls-field-properties-number.js.map +1 -1
  40. package/dist/collection/components/ls-field-properties-signature/ls-field-properties-signature.js +1 -1
  41. package/dist/collection/components/ls-field-properties-signature/ls-field-properties-signature.js.map +1 -1
  42. package/dist/collection/components/ls-field-properties-text/ls-field-properties-text.js +1 -1
  43. package/dist/collection/components/ls-field-properties-text/ls-field-properties-text.js.map +1 -1
  44. package/dist/collection/components/ls-field-size/ls-field-size.js +1 -1
  45. package/dist/collection/components/ls-field-type-display/ls-field-type-display.js +3 -3
  46. package/dist/collection/components/ls-formfield/inputs/ls-number-input/ls-number-input.js +3 -3
  47. package/dist/collection/components/ls-formfield/inputs/ls-radio-input/ls-radio-input.js +2 -2
  48. package/dist/collection/components/ls-formfield/inputs/ls-select-input/ls-select-input.js +3 -3
  49. package/dist/collection/components/ls-formfield/inputs/ls-text-input/ls-text-input.js +33 -4
  50. package/dist/collection/components/ls-formfield/inputs/ls-text-input/ls-text-input.js.map +1 -1
  51. package/dist/collection/components/ls-formfield/inputs/ls-textarea-input/ls-textarea-input.js +3 -3
  52. package/dist/collection/components/ls-formfield/ls-formfield.js +28 -9
  53. package/dist/collection/components/ls-formfield/ls-formfield.js.map +1 -1
  54. package/dist/collection/components/ls-icon/ls-icon.js +2 -2
  55. package/dist/collection/components/ls-input-wrapper/ls-input-wrapper.js +2 -2
  56. package/dist/collection/components/ls-participant-card/ls-participant-card.css +28 -2
  57. package/dist/collection/components/ls-participant-card/ls-participant-card.js +14 -9
  58. package/dist/collection/components/ls-participant-card/ls-participant-card.js.map +1 -1
  59. package/dist/collection/components/ls-participant-manager/ls-participant-manager.js +2 -2
  60. package/dist/collection/components/ls-participant-select/ls-participant-select.js +8 -8
  61. package/dist/collection/components/ls-props-section/ls-props-section.js +1 -1
  62. package/dist/collection/components/ls-statusbar/ls-statusbar.js +3 -3
  63. package/dist/collection/components/ls-toggle/ls-toggle.js +49 -2
  64. package/dist/collection/components/ls-toggle/ls-toggle.js.map +1 -1
  65. package/dist/collection/components/ls-toolbar/ls-toolbar.css +6 -11
  66. package/dist/collection/components/ls-toolbar/ls-toolbar.js +1 -1
  67. package/dist/collection/components/ls-toolbox-field/ls-toolbox-field.js +2 -2
  68. package/dist/collection/types/LSMutateEvent.js.map +1 -1
  69. package/dist/components/ls-document-options.js +1 -1
  70. package/dist/components/ls-document-viewer.js +73 -51
  71. package/dist/components/ls-document-viewer.js.map +1 -1
  72. package/dist/components/ls-editor-field.js +1 -1
  73. package/dist/components/ls-feature-column.js +1 -1
  74. package/dist/components/ls-field-alignment.js +1 -1
  75. package/dist/components/ls-field-content.js +1 -1
  76. package/dist/components/ls-field-dimensions.js +1 -1
  77. package/dist/components/ls-field-distribute.js +1 -1
  78. package/dist/components/ls-field-footer.js +1 -1
  79. package/dist/components/ls-field-format.js +1 -1
  80. package/dist/components/ls-field-placement.js +1 -1
  81. package/dist/components/ls-field-properties-advanced.js +1 -1
  82. package/dist/components/ls-field-properties-autosign.js +1 -1
  83. package/dist/components/ls-field-properties-container.js +1 -1
  84. package/dist/components/ls-field-properties-date.js +1 -1
  85. package/dist/components/ls-field-properties-email.js +1 -1
  86. package/dist/components/ls-field-properties-file.js +1 -1
  87. package/dist/components/ls-field-properties-general.js +1 -1
  88. package/dist/components/ls-field-properties-image.js +1 -1
  89. package/dist/components/ls-field-properties-multiple.js +1 -1
  90. package/dist/components/ls-field-properties-number.js +1 -1
  91. package/dist/components/ls-field-properties-signature.js +1 -1
  92. package/dist/components/ls-field-properties-text.js +1 -1
  93. package/dist/components/ls-field-properties.js +1 -1
  94. package/dist/components/ls-field-size.js +1 -1
  95. package/dist/components/ls-field-type-display.js +1 -1
  96. package/dist/components/ls-formfield.js +1 -1
  97. package/dist/components/ls-icon.js +1 -1
  98. package/dist/components/ls-input-wrapper.js +1 -1
  99. package/dist/components/ls-number-input.js +1 -1
  100. package/dist/components/ls-participant-card.js +1 -1
  101. package/dist/components/ls-participant-manager.js +1 -1
  102. package/dist/components/ls-participant-select.js +1 -1
  103. package/dist/components/ls-props-section.js +1 -1
  104. package/dist/components/ls-radio-input.js +1 -1
  105. package/dist/components/ls-select-input.js +1 -1
  106. package/dist/components/ls-statusbar.js +1 -1
  107. package/dist/components/ls-text-input.js +1 -1
  108. package/dist/components/ls-textarea-input.js +1 -1
  109. package/dist/components/ls-toggle.js +1 -1
  110. package/dist/components/ls-toolbar.js +1 -1
  111. package/dist/components/ls-toolbox-field.js +1 -1
  112. package/dist/components/{p-CjMHvkSx.js → p--fheLqrZ.js} +3 -3
  113. package/dist/components/{p-CjMHvkSx.js.map → p--fheLqrZ.js.map} +1 -1
  114. package/dist/components/{p-BA00o3_B.js → p-2UmdLAq_.js} +14 -14
  115. package/dist/components/p-2UmdLAq_.js.map +1 -0
  116. package/dist/components/{p-CAuyzHdc.js → p-B-eK779N.js} +26 -26
  117. package/dist/components/{p-CAuyzHdc.js.map → p-B-eK779N.js.map} +1 -1
  118. package/dist/components/{p-BWqGSxq5.js → p-B6M4f56h.js} +3 -3
  119. package/dist/components/{p-BWqGSxq5.js.map → p-B6M4f56h.js.map} +1 -1
  120. package/dist/components/{p-BabfUHqm.js → p-BACI1mCw.js} +4 -4
  121. package/dist/components/{p-BabfUHqm.js.map → p-BACI1mCw.js.map} +1 -1
  122. package/dist/components/{p-DvlAZt1N.js → p-BMGlyR62.js} +3 -3
  123. package/dist/components/{p-DvlAZt1N.js.map → p-BMGlyR62.js.map} +1 -1
  124. package/dist/components/{p-sp0SDpGC.js → p-BXFznEKF.js} +17 -11
  125. package/dist/components/p-BXFznEKF.js.map +1 -0
  126. package/dist/components/{p-CBCrQOl1.js → p-BZQ6_A7f.js} +3 -3
  127. package/dist/components/{p-CBCrQOl1.js.map → p-BZQ6_A7f.js.map} +1 -1
  128. package/dist/components/{p-CwibDgu-.js → p-Be1wOWnf.js} +4 -4
  129. package/dist/components/{p-CwibDgu-.js.map → p-Be1wOWnf.js.map} +1 -1
  130. package/dist/components/{p-CJtGZ5gi.js → p-BjEnmGcT.js} +14 -14
  131. package/dist/components/p-BjEnmGcT.js.map +1 -0
  132. package/dist/components/{p-DZIvEQf4.js → p-BjkAP0fz.js} +3 -3
  133. package/dist/components/{p-DZIvEQf4.js.map → p-BjkAP0fz.js.map} +1 -1
  134. package/dist/components/{p-CAz4MM75.js → p-BlEzYMrp.js} +11 -11
  135. package/dist/components/{p-CAz4MM75.js.map → p-BlEzYMrp.js.map} +1 -1
  136. package/dist/components/p-BrzLqF3a.js +122 -0
  137. package/dist/components/p-BrzLqF3a.js.map +1 -0
  138. package/dist/components/{p-D_xPgqKh.js → p-C-76CJRk.js} +15 -6
  139. package/dist/components/p-C-76CJRk.js.map +1 -0
  140. package/dist/components/{p-DsoUxXYJ.js → p-C0udtVoK.js} +14 -14
  141. package/dist/components/{p-DsoUxXYJ.js.map → p-C0udtVoK.js.map} +1 -1
  142. package/dist/components/{p-DMaeEjVo.js → p-CJGtnB3Y.js} +14 -14
  143. package/dist/components/{p-DMaeEjVo.js.map → p-CJGtnB3Y.js.map} +1 -1
  144. package/dist/components/{p-B6FJ4y4Z.js → p-CTkm0x2S.js} +3 -3
  145. package/dist/components/{p-B6FJ4y4Z.js.map → p-CTkm0x2S.js.map} +1 -1
  146. package/dist/components/{p-BJivWyaz.js → p-CYF3u9pO.js} +6 -6
  147. package/dist/components/{p-BJivWyaz.js.map → p-CYF3u9pO.js.map} +1 -1
  148. package/dist/components/{p-Ds7QyjZs.js → p-CjtCSSu6.js} +14 -14
  149. package/dist/components/{p-Ds7QyjZs.js.map → p-CjtCSSu6.js.map} +1 -1
  150. package/dist/components/{p-D0w6qVdJ.js → p-Cjul85r0.js} +3 -3
  151. package/dist/components/{p-D0w6qVdJ.js.map → p-Cjul85r0.js.map} +1 -1
  152. package/dist/components/{p-VV7XWae8.js → p-CyaIKArO.js} +11 -5
  153. package/dist/components/p-CyaIKArO.js.map +1 -0
  154. package/dist/components/{p-rPSdJJij.js → p-D0hPzy3-.js} +17 -5
  155. package/dist/components/p-D0hPzy3-.js.map +1 -0
  156. package/dist/components/{p-BAFmlVIM.js → p-D1ZlVU7D.js} +17 -15
  157. package/dist/components/p-D1ZlVU7D.js.map +1 -0
  158. package/dist/components/{p-DkTia1yV.js → p-DDGAtxSS.js} +29 -12
  159. package/dist/components/p-DDGAtxSS.js.map +1 -0
  160. package/dist/components/{p-CUBNvlvE.js → p-DEgX1Wvf.js} +4 -4
  161. package/dist/components/{p-CUBNvlvE.js.map → p-DEgX1Wvf.js.map} +1 -1
  162. package/dist/components/p-DIRAvPEw.js +87 -0
  163. package/dist/components/p-DIRAvPEw.js.map +1 -0
  164. package/dist/components/{p-DIJwqJno.js → p-DVyHfbCM.js} +4 -4
  165. package/dist/components/{p-DIJwqJno.js.map → p-DVyHfbCM.js.map} +1 -1
  166. package/dist/components/{p-Cbmf9Pw6.js → p-DdY_S-PS.js} +14 -14
  167. package/dist/components/{p-Cbmf9Pw6.js.map → p-DdY_S-PS.js.map} +1 -1
  168. package/dist/components/{p-DgnryVYJ.js → p-Dh4NjYGl.js} +4 -4
  169. package/dist/components/{p-DgnryVYJ.js.map → p-Dh4NjYGl.js.map} +1 -1
  170. package/dist/components/{p-DLaP71DP.js → p-DqcUxLAI.js} +14 -14
  171. package/dist/components/{p-DLaP71DP.js.map → p-DqcUxLAI.js.map} +1 -1
  172. package/dist/components/{p-B1BOQUb8.js → p-DxMK_Xd2.js} +14 -14
  173. package/dist/components/{p-B1BOQUb8.js.map → p-DxMK_Xd2.js.map} +1 -1
  174. package/dist/components/{p-C_-noUgH.js → p-OHOmdzUm.js} +3 -3
  175. package/dist/components/{p-C_-noUgH.js.map → p-OHOmdzUm.js.map} +1 -1
  176. package/dist/components/{p-CDq13hl8.js → p-RR8GRMeg.js} +7 -7
  177. package/dist/components/{p-CDq13hl8.js.map → p-RR8GRMeg.js.map} +1 -1
  178. package/dist/components/{p-CuAQ7zug.js → p-Sn0eF4R7.js} +4 -4
  179. package/dist/components/{p-CuAQ7zug.js.map → p-Sn0eF4R7.js.map} +1 -1
  180. package/dist/components/{p-3MsGX8HS.js → p-XrdJB_kX.js} +14 -14
  181. package/dist/components/{p-3MsGX8HS.js.map → p-XrdJB_kX.js.map} +1 -1
  182. package/dist/components/{p-BD71skor.js → p-a2RK076N.js} +4 -4
  183. package/dist/components/{p-BD71skor.js.map → p-a2RK076N.js.map} +1 -1
  184. package/dist/components/p-a2iwl17f.js +87 -0
  185. package/dist/components/p-a2iwl17f.js.map +1 -0
  186. package/dist/components/{p-BMlP2MBJ.js → p-aAOAosVj.js} +6 -6
  187. package/dist/components/{p-BMlP2MBJ.js.map → p-aAOAosVj.js.map} +1 -1
  188. package/dist/components/{p-DKUk0hhF.js → p-rqY4iuCY.js} +3 -3
  189. package/dist/components/{p-DKUk0hhF.js.map → p-rqY4iuCY.js.map} +1 -1
  190. package/dist/components/{p-DO9rVsz8.js → p-sLovfSwQ.js} +3 -3
  191. package/dist/components/{p-DO9rVsz8.js.map → p-sLovfSwQ.js.map} +1 -1
  192. package/dist/components/{p-EOQq6oKF.js → p-yOUMgYiI.js} +32 -10
  193. package/dist/components/p-yOUMgYiI.js.map +1 -0
  194. package/dist/esm/loader.js +1 -1
  195. package/dist/esm/ls-document-options_43.entry.js +172 -79
  196. package/dist/esm/ls-document-options_43.entry.js.map +1 -1
  197. package/dist/esm/ls-document-viewer.js +1 -1
  198. package/dist/ls-document-viewer/ls-document-viewer.esm.js +1 -1
  199. package/dist/ls-document-viewer/{p-580af1b7.entry.js → p-4c2ec35a.entry.js} +6 -6
  200. package/dist/ls-document-viewer/p-4c2ec35a.entry.js.map +1 -0
  201. package/dist/types/components/ls-document-options/ls-document-options.d.ts +6 -0
  202. package/dist/types/components/ls-document-viewer/adapter/LsDocumentAdapter.d.ts +2 -1
  203. package/dist/types/components/ls-document-viewer/ls-document-viewer.d.ts +1 -0
  204. package/dist/types/components/ls-field-content/ls-field-content.d.ts +8 -1
  205. package/dist/types/components/ls-field-properties-advanced/ls-field-properties-advanced.d.ts +1 -0
  206. package/dist/types/components/ls-formfield/inputs/ls-text-input/ls-text-input.d.ts +3 -0
  207. package/dist/types/components/ls-formfield/ls-formfield.d.ts +3 -1
  208. package/dist/types/components/ls-toggle/ls-toggle.d.ts +4 -0
  209. package/dist/types/components.d.ts +96 -2
  210. package/dist/types/types/LSMutateEvent.d.ts +3 -2
  211. package/package.json +1 -1
  212. package/dist/components/p-BA00o3_B.js.map +0 -1
  213. package/dist/components/p-BAFmlVIM.js.map +0 -1
  214. package/dist/components/p-CJtGZ5gi.js.map +0 -1
  215. package/dist/components/p-CgX-DHdf.js +0 -117
  216. package/dist/components/p-CgX-DHdf.js.map +0 -1
  217. package/dist/components/p-CybcOa1h.js +0 -87
  218. package/dist/components/p-CybcOa1h.js.map +0 -1
  219. package/dist/components/p-D_xPgqKh.js.map +0 -1
  220. package/dist/components/p-DkTia1yV.js.map +0 -1
  221. package/dist/components/p-EOQq6oKF.js.map +0 -1
  222. package/dist/components/p-RdvEI2ua.js +0 -69
  223. package/dist/components/p-RdvEI2ua.js.map +0 -1
  224. package/dist/components/p-VV7XWae8.js.map +0 -1
  225. package/dist/components/p-rPSdJJij.js.map +0 -1
  226. package/dist/components/p-sp0SDpGC.js.map +0 -1
  227. package/dist/ls-document-viewer/p-580af1b7.entry.js.map +0 -1
@@ -7,7 +7,10 @@ const lsDocumentOptionsCss = ":host{display:block}.ls-editor-infobox{padding:2px
7
7
  const LsDocumentOptions = class {
8
8
  constructor(hostRef) {
9
9
  index.registerInstance(this, hostRef);
10
+ this.mutate = index.createEvent(this, "mutate");
11
+ this.update = index.createEvent(this, "update");
10
12
  }
13
+ get component() { return index.getElement(this); }
11
14
  /**
12
15
  * The base template information (as JSON).
13
16
  * {LSApiTemplate}
@@ -16,8 +19,22 @@ const LsDocumentOptions = class {
16
19
  selectedHandler(newSelected, _oldSelected) {
17
20
  console.log(newSelected, 'document manager');
18
21
  }
22
+ mutate;
23
+ update;
24
+ alter(template) {
25
+ console.log(template);
26
+ this.update.emit([{ action: 'update', data: { ...this.template, ...template } }]);
27
+ this.mutate.emit([{ action: 'update', data: { ...this.template, ...template } }]);
28
+ }
29
+ // pure html components do not allow methods to be set in attributes so set on load
30
+ // https://stackoverflow.com/questions/49387964/pass-functions-to-stencil-component
31
+ // componentDidLoad() {
32
+ // var dropTarget = this.component.shadowRoot.getElementById('ls-form-field') as HTMLLsFormfieldElement;
33
+ // dropTarget.onChange = (ev) => { console.log(ev); this.alter({ title: (ev.target as any)?.value }) };
34
+ // this.on
35
+ // }
19
36
  render() {
20
- return (index.h(index.Host, { key: '3ec996cdaca960105b20adcc37d44af2304af3e7' }, index.h("div", { key: '43b5064abe7765cc9dfc6196d19683558d1abc8c', class: "ls-editor-infobox" }, index.h("h2", { key: '20938c4da2a6f9cfd1ff2dc801828c5b830a9e83', class: "toolbox-section-title" }, "Template Details"), index.h("p", { key: 'c779edc6379ebfa70650b4a37610054ff8d9032a', class: "toolbox-section-description" }, "Details and insights about the Template.")), index.h("div", { key: 'b9c1cc25067181ceb8b2eb394870308a662307a1', class: 'template-details' }, index.h("div", { key: '73791c9b75ff777b2af694199cc7b7a97fd7b3d7', class: 'template-detail-section column' }, index.h("p", { key: '562cc54f4651fe99fbdca89ed590b71b95290130', class: "template-detail-section-title" }, "Name"), index.h("ls-formfield", { key: '8dd61e6f4549bfb04b2d319a225ecc57001fbbe7', as: "text", value: this.template?.title, style: { width: '100%' } })), index.h("div", { key: '3e0c11badcaf10b0709b496bf368c030896f8e6e', class: 'template-detail-section' }, index.h("p", { key: 'd424b139a2b6b59ece4322f8c25676297aa3ac4b', class: "template-detail-section-title" }, "Auto Archive"), index.h("ls-toggle", { key: 'cfed16286f2714f48dc6c21b869596ced4ab98ac' })), index.h("div", { key: '7c02c2463786baef887554f3875a707c441c62e8', class: 'template-detail-section' }, index.h("p", { key: '0acf2b31aeb5a94098f492ef79093d4f19bc8b63', class: "template-detail-section-title" }, "Lock"), index.h("ls-toggle", { key: 'c4b35bcb6a317c37a6b3a1a03f9424f4405c8597' })), index.h("div", { key: 'c0b5036c0782639fbaa01fa4e60ea584145a576d', class: 'template-detail-section column' }, index.h("p", { key: '089ee0c64b794c900b09186cd67af18c917f55e1', class: "template-detail-section-title" }, "Pages"), index.h("ls-label", { key: '034ea4d3b0891683e095a66e34842a40eed3339c', text: this.template?.pageDimensionArray?.length })), index.h("div", { key: 'd1b7028176ada3f2f7ee7f3f7af4a677804c4a7e', class: 'template-detail-section column' }, index.h("p", { key: '92a4218b5951225433cdade559c2b03125159f6b', class: "template-detail-section-title" }, "Date Created"), " ", this.template?.created), index.h("div", { key: 'a7ab10d7a49690f75913424067f998900618f275', class: 'template-detail-section column' }, index.h("p", { key: '4f16dd010053902055a29bf2d6a702f2728baf08', class: "template-detail-section-title" }, "Created By"), " ", this.template?.createdBy)), index.h("slot", { key: 'dc0aa31fe86531d0c1a0c7bfb1b41cb2b035b280' })));
37
+ return (index.h(index.Host, { key: 'df602bee4eeb36c9b4e1ac89acd824842f808757' }, index.h("div", { key: '65a889d896bd0b16f8ee56b68a599c89b9d160e8', class: "ls-editor-infobox" }, index.h("h2", { key: '416cd08e39fcff18b1f919629510e01f71bef211', class: "toolbox-section-title" }, "Template Details"), index.h("p", { key: 'b69be1a590030591437dff787fe30d5309966232', class: "toolbox-section-description" }, "Details and insights about the Template.")), index.h("div", { key: 'cee4880bdde4301dabef3bdb7876deb3fa18c3d9', class: 'template-details' }, index.h("div", { key: '2fcd90472deb0d15f79951cc336f52eaa6fb27c8', class: 'template-detail-section column' }, index.h("p", { key: '1a292fff61f4f817de3d1f124ed113e13f6e90db', class: "template-detail-section-title" }, "Name"), index.h("ls-formfield", { key: '58d4fe7cc361002de2a8f19e0733624d0b0daef7', as: "text", value: this.template?.title, style: { width: '100%' }, onValueChange: (e) => { this.alter({ title: e.detail }); } })), index.h("div", { key: '400cc77a9e64f9e94eb2704ca7fb4d7e15bc59f1', class: 'template-detail-section' }, index.h("p", { key: '02735d0cebd7f51484e8e716e56f19167de6b127', class: "template-detail-section-title" }, "Auto Archive"), index.h("ls-toggle", { key: '751f91c6220c198eb45eab222a5b93977d838181', onValueChange: (e) => { this.alter({ autoArchive: e.detail }); } })), index.h("div", { key: 'fd67c724cefca1c743a245522bf9951166bc79d1', class: 'template-detail-section' }, index.h("p", { key: 'f5f4093ee50a78eb9b6bd6127328cdd73b2a878b', class: "template-detail-section-title" }, "Lock"), index.h("ls-toggle", { key: 'a952be5db9f643b061d9ab4cd215bbe68da1c150', onValueChange: (e) => { this.alter({ locked: e.detail }); } })), index.h("div", { key: '2792a4ee0daef919ccc3f7de1209ac50ae01cc31', class: 'template-detail-section column' }, index.h("p", { key: '221101ab9fcc2501d09cb7d573d384f209be3de0', class: "template-detail-section-title" }, "Pages"), index.h("ls-label", { key: 'bd23b7fc23ddc3ba15a519ee3c734528d39ec5d5', text: this.template?.pageDimensionArray?.length })), index.h("div", { key: '8f4611759bc9fdeea4ebded4b22f9909a3c42b34', class: 'template-detail-section column' }, index.h("p", { key: 'd07687d49484a4d153ca476156845cedea09ce13', class: "template-detail-section-title" }, "Date Created"), " ", this.template?.created), index.h("div", { key: '641c5ddf387680ba7802d7b4dc56a89654b6498f', class: 'template-detail-section column' }, index.h("p", { key: 'e526be19b26d30ff9681997ee49cc7db983eeec0', class: "template-detail-section-title" }, "Created By"), " ", this.template?.createdBy)), index.h("slot", { key: '8cf80adf2e0c01f6a7a1d1deea986213a14b358c' })));
21
38
  }
22
39
  static get watchers() { return {
23
40
  "template": ["selectedHandler"]
@@ -19908,6 +19925,12 @@ const recalculateCoordinates = (d) => {
19908
19925
  const ay = d.top / d.pageDimensions.height;
19909
19926
  const bx = (d.left + d.width) / d.pageDimensions.width;
19910
19927
  const by = (d.top + d.height) / d.pageDimensions.height;
19928
+ console.log({
19929
+ ax,
19930
+ ay,
19931
+ bx,
19932
+ by,
19933
+ }, 'recalc');
19911
19934
  // Return with calculated styles that try to place it as it would appear on legacy signing page
19912
19935
  return {
19913
19936
  ...d,
@@ -24338,7 +24361,7 @@ const deleteElement = obj => {
24338
24361
  const createRole = (role) => {
24339
24362
  const newParent = role?.signerParent ? `"${role.signerParent}"` : 'null';
24340
24363
  return `
24341
- mutation AddRole {
24364
+ mutation LDVAddRole {
24342
24365
  createTemplateRole(input: {
24343
24366
  templateId: "${role.templateId}"
24344
24367
  signerIndex: ${role.signerIndex}
@@ -24353,7 +24376,7 @@ const createRole = (role) => {
24353
24376
  // Remove a role
24354
24377
  const deleteRole = (role) => {
24355
24378
  return `
24356
- mutation removeRole {
24379
+ mutation LDVremoveRole {
24357
24380
  deleteTemplateRole(input: {
24358
24381
  templateRoleId: "${role.id}"
24359
24382
  })
@@ -24363,7 +24386,7 @@ const deleteRole = (role) => {
24363
24386
  const updateRole = (role) => {
24364
24387
  const newParent = role?.signerParent ? `"${role.signerParent}"` : 'null';
24365
24388
  return `
24366
- mutation updateRole {
24389
+ mutation LDVupdateRole {
24367
24390
  updateTemplateRole(input: {
24368
24391
  templateRoleId: "${role.id}"
24369
24392
  signerIndex: ${role.signerIndex}
@@ -24375,6 +24398,16 @@ const updateRole = (role) => {
24375
24398
  })
24376
24399
  }`;
24377
24400
  };
24401
+ // swap two adjacent roles
24402
+ const swapRoles = (roleId1, roleId2) => {
24403
+ return `
24404
+ mutation LDVswapRole {
24405
+ swapRoles(input: {
24406
+ roleId1: "${roleId1}"
24407
+ roleId2: "${roleId2}"
24408
+ })
24409
+ }`;
24410
+ };
24378
24411
 
24379
24412
  // Add a role
24380
24413
  const updateTemplate = template => {
@@ -24506,7 +24539,7 @@ class LsDocumentAdapter {
24506
24539
  query = deleteRole(obj);
24507
24540
  break;
24508
24541
  case 'swap':
24509
- query = updateRole(obj);
24542
+ query = swapRoles(obj, event.data2);
24510
24543
  break;
24511
24544
  }
24512
24545
  break;
@@ -24519,6 +24552,7 @@ class LsDocumentAdapter {
24519
24552
  break;
24520
24553
  }
24521
24554
  const result = await this.execute(accessToken, query);
24555
+ console.log(query, result);
24522
24556
  return { result, obj, event };
24523
24557
  };
24524
24558
  /**
@@ -24641,7 +24675,7 @@ const getGroupData = (id) => {
24641
24675
  `;
24642
24676
  };
24643
24677
 
24644
- const lsDocumentViewerCss = "*,*::before,*::after{box-sizing:border-box}*{margin:0}@media (prefers-reduced-motion: no-preference){html{interpolate-size:allow-keywords}}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}#root,#__next{isolation:isolate}:host{display:flex;flex-direction:row;width:100vw;height:100vh;margin:0px;padding:0px}#my-field-panel{position:relative;height:calc(100% - 4.313rem)}.leftBox{border-radius:16px;border:1px solid var(--gray-30, #edeff2);background:var(--white, #fff);box-shadow:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);width:21.25rem;margin:1rem;min-width:21.25rem;max-height:100%}.left-box-inner{position:relative;display:flex;height:100%;padding:0.75rem;gap:0.75rem}.rightBox{width:200px;border:1px gray solid;width:470px;min-width:390px;padding:4px;font-family:inherit}.toolbox{display:flex;flex-direction:column;width:100%;height:100%;border-radius:8px;border:1px solid var(--gray-30, #e0e2e5);background:var(--gray-10, #f7f8fa);padding:0.75rem;gap:1rem;overflow-y:auto}.ls-editor-infobox{padding:2px 8px 2px 8px}#pdf-canvas{top:0px;left:0px;width:100px;height:100px}#ls-mid-area{display:flex;flex-direction:column;width:100%;overflow:scroll}.document-frame-wrapper{position:relative;padding:0 1.25rem;display:flex;flex-direction:column;justify-content:start;align-items:center;overflow:visible}.spacer{position:fixed;min-height:5.5rem;width:100%;float:left}#ls-document-frame{position:relative;height:98vh;max-width:100%;max-height:100%;margin:0px;padding:2px;scrollbar-width:auto;scrollbar-color:auto}.prevButton{position:relative;bottom:30px}.nextButton{position:relative;bottom:30px}.fieldBox{z-index:1000}#ls-box-selector{position:absolute;visibility:hidden;background-color:transparent;border:1px rgba(71, 71, 71, 0.716) dashed}#ls-editor-form{display:flex;width:100vw;max-height:calc(100vh - 2.25rem);position:relative;background:var(--gray-10, #f7f8fa);box-shadow:0 2px 6px 0 rgba(0, 0, 0, 0.04) inset, 0 10px 15px 0 rgba(0, 0, 0, 0.04) inset}.hidden{visibility:hidden;display:none;width:0px}.toolbox-section-title{color:var(--gray-100, #45484d);font-size:1.125rem;font-style:normal;font-weight:500;line-height:1.75rem;}.toolbox-section-description{color:var(--gray-80, #5e6066);font-size:0.75rem;font-style:normal;font-weight:400;line-height:1rem}.fields-box{display:flex;flex-direction:column;gap:0.75rem}.page-header{display:flex;height:2.25rem;gap:0.5rem;padding:0.25rem 0.75rem;justify-content:center;align-items:center}.header-text-1{color:var(--gray-100, #45484d);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem}.header-text-2{color:var(--gray-100, #45484d);font-size:0.875rem;font-style:normal;font-weight:400;line-height:1.25rem}.properties-header{display:flex;padding:1rem;gap:0.75rem;align-items:center;border-bottom:1px solid var(--gray-20, #edeff2)}.properties-header-title{color:var(--gray-100, #45484d);width:100%;font-size:1.5rem;font-style:normal;font-weight:500;line-height:2rem;}.properties-header-icon{display:flex;padding:0.5rem;border-radius:0.625rem;background:var(--primary-10, #eff4ff);color:var(--primary-60, #4456f6)}.expand-fields-row{display:flex;align-items:center;gap:0.5rem;padding:0.5rem;cursor:pointer;color:var(--gray-80, #6c6e73);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;}.expand-fields-row p{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem;}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:36px}.input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.field-properties-outer{position:relative;height:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}";
24678
+ const lsDocumentViewerCss = "*,*::before,*::after{box-sizing:border-box}*{margin:0}@media (prefers-reduced-motion: no-preference){html{interpolate-size:allow-keywords}}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}#root,#__next{isolation:isolate}:host{display:flex;flex-direction:row;width:100vw;height:100vh;margin:0px;padding:0px}#my-field-panel{position:relative;height:calc(100% - 4.313rem)}.leftBox{position:relative;border-radius:16px;border:1px solid var(--gray-30, #edeff2);background:var(--white, #fff);box-shadow:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);width:21.25rem;margin:1rem;min-width:21.25rem;max-height:100%;z-index:1000;left:0;top:0}.left-box-inner{position:relative;display:flex;height:100%;padding:0.75rem;gap:0.75rem}.rightBox{width:200px;border:1px gray solid;width:470px;min-width:390px;padding:4px;font-family:inherit}.toolbox{display:flex;flex-direction:column;width:100%;height:100%;border-radius:8px;border:1px solid var(--gray-30, #e0e2e5);background:var(--gray-10, #f7f8fa);padding:0.75rem;gap:1rem;overflow-y:auto}.ls-editor-infobox{padding:2px 8px 2px 8px}#pdf-canvas{top:0px;left:0px;width:100px;height:100px}#ls-mid-area{position:absolute;top:0;left:0;display:flex;flex-direction:column;align-items:center;width:100vw}.document-frame-wrapper{display:flex;flex-direction:column;justify-content:start;align-items:center;overflow:visible;max-height:100%;width:100vw;overflow:scroll}#ls-document-frame{position:relative;height:98vh}.prevButton{position:relative;bottom:30px}.nextButton{position:relative;bottom:30px}.fieldBox{z-index:1000}#ls-box-selector{position:absolute;visibility:hidden;background-color:transparent;border:1px rgba(71, 71, 71, 0.716) dashed}#ls-editor-form{display:flex;width:100vw;height:calc(100vh - 2.25rem);position:relative;background:var(--gray-10, #f7f8fa);box-shadow:0 2px 6px 0 rgba(0, 0, 0, 0.04) inset, 0 10px 15px 0 rgba(0, 0, 0, 0.04) inset}.hidden{visibility:hidden;display:none;width:0px}.toolbox-section-title{color:var(--gray-100, #45484d);font-size:1.125rem;font-style:normal;font-weight:500;line-height:1.75rem;}.toolbox-section-description{color:var(--gray-80, #5e6066);font-size:0.75rem;font-style:normal;font-weight:400;line-height:1rem}.fields-box{display:flex;flex-direction:column;gap:0.75rem}.page-header{display:flex;height:2.25rem;gap:0.5rem;padding:0.25rem 0.75rem;justify-content:center;align-items:center}.header-text-1{color:var(--gray-100, #45484d);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem}.header-text-2{color:var(--gray-100, #45484d);font-size:0.875rem;font-style:normal;font-weight:400;line-height:1.25rem}.properties-header{display:flex;padding:1rem;gap:0.75rem;align-items:center;border-bottom:1px solid var(--gray-20, #edeff2)}.properties-header-title{color:var(--gray-100, #45484d);width:100%;font-size:1.5rem;font-style:normal;font-weight:500;line-height:2rem;}.properties-header-icon{display:flex;padding:0.5rem;border-radius:0.625rem;background:var(--primary-10, #eff4ff);color:var(--primary-60, #4456f6)}.expand-fields-row{display:flex;align-items:center;gap:0.5rem;padding:0.5rem;cursor:pointer;color:var(--gray-80, #6c6e73);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;}.expand-fields-row p{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem;}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:36px}.input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.field-properties-outer{position:relative;height:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}";
24645
24679
 
24646
24680
  pdfExports.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.5.207/pdf.worker.min.js';
24647
24681
  const LsDocumentViewer = class {
@@ -24858,13 +24892,13 @@ const LsDocumentViewer = class {
24858
24892
  this.zoom = z;
24859
24893
  this.canvas = this.component.shadowRoot.getElementById('pdf-canvas');
24860
24894
  const frame = this.component.shadowRoot.getElementById('ls-document-frame');
24861
- const wrapper = this.component.shadowRoot.getElementById('document-frame-wrapper');
24895
+ // const wrapper = this.component.shadowRoot.getElementById('document-frame-wrapper') as HTMLDivElement;
24862
24896
  this.canvas.style.height = this.pageDimensions[this.pageNum - 1].height * z + 'px';
24863
24897
  this.canvas.style.width = this.pageDimensions[this.pageNum - 1].width * z + 'px';
24864
24898
  frame.style.height = this.pageDimensions[this.pageNum - 1].height * z + 'px';
24865
24899
  frame.style.width = this.pageDimensions[this.pageNum - 1].width * z + 'px';
24866
- wrapper.style.height = (this.pageDimensions[this.pageNum - 1].height * z + 200) + 'px';
24867
- wrapper.style.width = this.pageDimensions[this.pageNum - 1].width * z + 'px';
24900
+ // wrapper.style.height = this.pageDimensions[this.pageNum - 1].height * z + 200 + 'px';
24901
+ // wrapper.style.width = this.pageDimensions[this.pageNum - 1].width * z + 600 + 'px';
24868
24902
  // place all fields at new zoom level
24869
24903
  this.component.shadowRoot.querySelectorAll('ls-editor-field').forEach(fx => moveField.bind(this)(fx, fx.dataItem));
24870
24904
  this.queueRenderPage(this.pageNum);
@@ -25041,8 +25075,13 @@ const LsDocumentViewer = class {
25041
25075
  if (this.token && !this._template)
25042
25076
  this.load();
25043
25077
  }
25078
+ componentDidLoad() {
25079
+ const box = this.component.shadowRoot.querySelector('#document-frame-wrapper');
25080
+ box.scrollTop = (box.scrollHeight - box.clientHeight) / 2;
25081
+ box.scrollLeft = (box.scrollWidth - box.clientWidth) / 2;
25082
+ }
25044
25083
  render() {
25045
- return (index.h(index.Host, { key: '8779f60d8efdbc80926d9207c4db728416fb539b' }, index.h(index.h.Fragment, null, index.h("div", { key: '073ae6253e54d1972323abdd6617c89bf4b3956f', class: "page-header" }, index.h("p", { key: 'd7e63a2b9ec941374fe1383a8ec95f0dd7ed471e', class: "header-text-1" }, "Template Creation"), index.h("p", { key: '99b5dde74b12e8b98cf47eb6ba94e5d82bccec0d' }, "/"), index.h("p", { key: '5a574f910583836baec0f26ff904924dca721fae', class: "header-text-2" }, "Template Name")), index.h("form", { key: '6761c9676abcd2ce67e7d2dfcca070c128d9954b', id: "ls-editor-form" }, this.showtoolbox === true ? (index.h("div", { class: "leftBox" }, index.h("div", { class: !this.selected || this.selected.length === 0 ? 'left-box-inner' : 'hidden' }, index.h("ls-feature-column", { onManage: manager => {
25084
+ return (index.h(index.Host, { key: 'f226c5a0576eacff23a116a28d2c4f3494f7f104' }, index.h(index.h.Fragment, null, index.h("div", { key: 'e639ff97c64c798f004eb880ac3eeff971bfda34', class: "page-header" }, index.h("p", { key: '4d39a11db18943e8b224ded27de59180110769c5', class: "header-text-1" }, "Template Creation"), index.h("p", { key: 'c414c9939f263ef743f4c1c744b8215e32fded23' }, "/"), index.h("p", { key: '3ca828d331f6445f52587ccc0a810789956bab1b', class: "header-text-2" }, "Template Name")), index.h("form", { key: 'f0bd9486d22c55f73660f6fbdc3c8745ae3c2201', id: "ls-editor-form" }, this.showtoolbox === true ? (index.h("div", { class: "leftBox" }, index.h("div", { class: !this.selected || this.selected.length === 0 ? 'left-box-inner' : 'hidden' }, index.h("ls-feature-column", { onManage: manager => {
25046
25085
  if (manager.detail === 'document') {
25047
25086
  var documentManager = this.component.shadowRoot.getElementById('ls-document-options');
25048
25087
  documentManager.template = this._template;
@@ -25055,7 +25094,7 @@ const LsDocumentViewer = class {
25055
25094
  } }), index.h("div", { id: "ls-toolbox", class: this.manager === 'toolbox' ? 'toolbox' : 'hidden' }, index.h("div", { class: "ls-editor-infobox" }, index.h("h2", { class: "toolbox-section-title" }, "Participant Fields"), index.h("p", { class: "toolbox-section-description" }, "Select and Click to place Signature fields where you\u2019d like on the Document.")), index.h("div", { class: "fields-box" }, this.signer > 0 ? (index.h("ls-toolbox-field", { elementType: "signature", formElementType: "signature", label: "Signature", defaultHeight: 27, defaultWidth: 120, validation: 0, icon: "signature", signer: this.signer })) : (index.h("ls-toolbox-field", { elementType: "auto sign", formElementType: "auto sign", label: "Auto Sign", defaultHeight: 27, defaultWidth: 120, validation: 3000, icon: "auto-sign", signer: this.signer })), index.h("ls-toolbox-field", { elementType: "initials", formElementType: "initials", label: "Initials", defaultHeight: 27, defaultWidth: 120, validation: 2000, icon: "initials", signer: this.signer }), index.h("ls-toolbox-field", { elementType: "date", formElementType: "date", label: "Date", defaultHeight: 27, defaultWidth: 80, validation: 2, icon: "calender", signer: this.signer }), index.h("ls-toolbox-field", { elementType: "signing date", formElementType: "signing date", label: "Signing Date", defaultHeight: 27, defaultWidth: 120, validation: 30, icon: "auto-date", signer: this.signer }), index.h("ls-toolbox-field", { elementType: "email", formElementType: "email", label: "Email", defaultHeight: 27, defaultWidth: 120, validation: 1, icon: "at-symbol", signer: this.signer }), index.h("ls-toolbox-field", { elementType: "text", formElementType: "text", label: "Text", defaultHeight: 27, defaultWidth: 100, validation: 0, icon: "text", signer: this.signer }), index.h("div", { class: 'expand-fields-row', onClick: () => (this.expandfields = !this.expandfields) }, index.h("ls-icon", { name: this.expandfields ? 'expand' : 'collapse', size: "20", solid: true }), index.h("p", null, "More Field Types")), this.expandfields && (index.h("div", { class: "fields-box" }, index.h("ls-toolbox-field", { elementType: "number", formElementType: "number", label: "Number", defaultHeight: 27, defaultWidth: 80, validation: 50, icon: "hashtag", signer: this.signer }), index.h("ls-toolbox-field", { elementType: "checkbox", formElementType: "checkbox", label: "Checkbox", defaultHeight: 27, defaultWidth: 27, validation: 25, icon: "check", signer: this.signer }), index.h("ls-toolbox-field", { elementType: "regex", formElementType: "regex", label: "Regex", defaultHeight: 27, defaultWidth: 120, validation: 93, icon: "code", signer: this.signer }), index.h("ls-toolbox-field", { elementType: "image", formElementType: "image", label: "Image", defaultHeight: 27, defaultWidth: 120, validation: 90, icon: "photograph", signer: this.signer }), index.h("ls-toolbox-field", { elementType: "file", formElementType: "file", label: "File", defaultHeight: 27, defaultWidth: 120, validation: 74, icon: "upload", signer: this.signer }))))), index.h("ls-participant-manager", { id: "ls-participant-manager", class: this.manager === 'participant' ? 'toolbox' : 'hidden', editor: this }), index.h("ls-document-options", { id: "ls-document-options", class: this.manager === 'document' ? 'toolbox' : 'hidden' })), this.showrightpanel && !this.displayTable && (index.h("div", { class: this.selected && this.selected.length > 0 ? 'field-properties-outer' : 'hidden' }, index.h("div", { class: 'properties-header' }, index.h("div", { class: 'properties-header-icon' }, index.h("ls-icon", { name: "pre-filled-content" })), index.h("h1", { class: 'properties-header-title' }, "Field Properties"), index.h("button", { class: 'tertiaryGrey', onClick: e => {
25056
25095
  this.selected = [];
25057
25096
  e.preventDefault();
25058
- } }, index.h("ls-icon", { name: "x", size: "20" }))), index.h("ls-field-properties", { id: "my-field-panel" }), index.h("slot", null))))) : (index.h(index.h.Fragment, null)), index.h("div", { key: 'addae2356623fc587da8f4c0446553067bebec06', id: "ls-mid-area" }, index.h("ls-toolbar", { key: '2ceb43132282e347d0fd85ecfcee69fff9bf9857', id: "ls-toolbar", dataItem: this.selected ? this.selected.map(s => s.dataItem) : null, template: this._template }), index.h("div", { key: 'e719832d96683c210912f1cafa8db7c5de154ab2', class: 'document-frame-wrapper', id: 'document-frame-wrapper' }, index.h("div", { key: 'cf0aea9f0510849c1b30fb6c845ed9541229f098', class: 'spacer' }), index.h("div", { key: '7afc1c5e0b1b4f3e155a27ec31c712960cf5dfcc', id: "ls-document-frame" }, index.h("canvas", { key: '81ef135f7c72bc0e27423931117bc102718fdf08', id: "pdf-canvas", class: this.displayTable ? 'hidden' : '' }), index.h("ls-editor-table", { key: '5fa4d2291d51fca5a06d24cd26528037eff2a1d8', editor: this, class: this.displayTable ? '' : 'hidden' }), index.h("div", { key: '7d18844d5f758f58ca4af7b017e14fe1d7019d4e', id: "ls-box-selector" }))), index.h("ls-statusbar", { key: 'f13529aa9366b9ac830abf2ba4547ad0454328fd', editor: this }))))));
25097
+ } }, index.h("ls-icon", { name: "x", size: "20" }))), index.h("ls-field-properties", { id: "my-field-panel" }), index.h("slot", null))))) : (index.h(index.h.Fragment, null)), index.h("ls-toolbar", { key: '58503d287b530b80fc34330e00cb3a3f24c5f490', id: "ls-toolbar", dataItem: this.selected ? this.selected.map(s => s.dataItem) : null, template: this._template }), index.h("div", { key: 'efb8e5c398ccce4ffb07f3373cb456e42aded4e7', id: "ls-mid-area" }, index.h("div", { key: 'e5ca86dfe5ddd84b8f0c2b73e6e5c8ea9c4c6b11', class: 'document-frame-wrapper', id: "document-frame-wrapper" }, index.h("div", { key: '1b8b7fc2b1485bccb0abced8020ac49d97e0cd90', id: "ls-document-frame" }, index.h("canvas", { key: '7945707591d04d8cf3152214140aed26cca8037c', id: "pdf-canvas", class: this.displayTable ? 'hidden' : '' }), index.h("ls-editor-table", { key: '889f17bf17a63d0b88f99f1b4801dbdbfb80fd72', editor: this, class: this.displayTable ? '' : 'hidden' }), index.h("div", { key: '2968db328f19735d9d20530889b35f0cc3d06f79', id: "ls-box-selector" }))), index.h("ls-statusbar", { key: 'b090e33695891a437a8339cf96b85a8eb7ed389c', editor: this }))))));
25059
25098
  }
25060
25099
  static get watchers() { return {
25061
25100
  "mode": ["modeHandler"],
@@ -25280,7 +25319,7 @@ const defaultRolePalette = [
25280
25319
  ];
25281
25320
  // export const defaultRolePalette: string[] = ['gray', 'blue', 'green', 'yellow', 'purple', 'teal', 'pink', 'lime', 'red', 'lightblue', 'aubergine', 'burnt', 'trueGreen', 'indigo', 'cyan'];
25282
25321
 
25283
- const lsEditorFieldCss = ":host{display:block;position:absolute;margin:0px;padding:0px 0px 0px 0px;isolation:isolate}.ls-editor-field-editable{display:block;font-family:inherit;font-size:inherit;overflow:hidden;white-space:nowrap;margin:0;padding:0px 0px 0px 0px;min-width:2em;height:100%;width:100%}.ls-editor-field{opacity:0.7}.ls-editor-field-editable:focus{outline:none}.ls-editor-field-draggable{display:block;font-family:inherit;font-size:inherit;overflow:hidden;white-space:nowrap;min-width:2px;height:98%;width:98%}.hidden-field{display:none}input{all:unset}.draggable-input{font-family:inherit;font-size:inherit;position:relative;height:95%;width:95%}.editing-input{caret-color:rgb(15 23 42);caret-shape:auto;height:100%;width:100%}";
25322
+ const lsEditorFieldCss = ":host{display:block;position:absolute;margin:0px;padding:0px 0px 0px 0px;isolation:isolate}.ls-editor-field-editable{display:block;font-family:inherit;font-size:inherit;overflow:hidden;white-space:nowrap;margin:0;padding:0px 0px 0px 0px;min-width:2em;height:100%;width:100%}.ls-editor-field{opacity:0.7}.ls-editor-field-editable:focus{outline:none}.ls-editor-field-draggable{display:block;font-family:inherit;font-size:inherit;overflow:hidden;white-space:nowrap;min-width:2px;height:98%;width:98%}.hidden-field{display:none}input{all:unset}.draggable-input{font-family:inherit;font-size:inherit;position:relative;height:95%;width:95%}.editing-input{caret-color:rgb(15 23 42);caret-shape:auto;height:100%;width:100%}.required-icon{position:absolute;top:2px;right:2px;color:var(--red-60)}";
25284
25323
 
25285
25324
  const LsEditorField = class {
25286
25325
  constructor(hostRef) {
@@ -25395,7 +25434,7 @@ const LsEditorField = class {
25395
25434
  return (index.h(index.Host, { key: '5239d34cfda7e3a83d55d447a46a6bf728316fe9', style: { border: `2px ${defaultRolePalette[this.dataItem?.signer % 100].s60} solid` } }, index.h("div", { key: '59181ee2a080db4469d8d4e262ca69f27d9c3e2b', class: {
25396
25435
  'ls-editor-field': true,
25397
25436
  'is-selected': this.selected,
25398
- } }, index.h("input", { key: '9ff569194d24e787e0a3f4fcc53663f7d4b3c10e', id: "editing-input", class: this.isEditing ? 'ls-editor-field-editable' : 'hidden-field', type: getInputType(this.dataItem.validation).inputType, value: this.dataItem?.value || this.innerValue, onChange: e => this.onInputChange(e) }), index.h("div", { key: '1c5bbd9daa97e262353c9a8a641b148ce5dca238', id: "field-info", class: this.isEditing ? 'hidden-field' : 'ls-editor-field-draggable' }, this.innerValue || this.dataItem?.label || this.dataItem?.formElementType))));
25437
+ } }, !this.dataItem?.optional && index.h("ls-icon", { key: '9416fcdb2cce01b90858e16263a94efe668ffabe', name: "required", size: "12", class: "required-icon" }), index.h("input", { key: 'c92ba9a8b846b7e41d62cb4af3c501db6a2560f1', id: "editing-input", class: this.isEditing ? 'ls-editor-field-editable' : 'hidden-field', type: getInputType(this.dataItem.validation).inputType, value: this.dataItem?.value || this.innerValue, onChange: e => this.onInputChange(e) }), index.h("div", { key: 'e3663eb3363123cb166c61f27dadc2744928e737', id: "field-info", class: this.isEditing ? 'hidden-field' : 'ls-editor-field-draggable' }, this.innerValue || this.dataItem?.label || this.dataItem?.formElementType))));
25399
25438
  }
25400
25439
  static get watchers() { return {
25401
25440
  "selected": ["watchSelectedHandler"]
@@ -25602,13 +25641,35 @@ const lsFieldContentCss = ":host{display:flex;flex-direction:column;gap:1rem;wid
25602
25641
  const LsFieldContent = class {
25603
25642
  constructor(hostRef) {
25604
25643
  index.registerInstance(this, hostRef);
25644
+ this.mutate = index.createEvent(this, "mutate");
25645
+ this.update = index.createEvent(this, "update");
25605
25646
  }
25647
+ get component() { return index.getElement(this); }
25606
25648
  dataItem;
25607
25649
  showValidationTypes = true;
25650
+ mutate;
25651
+ update;
25652
+ // Send one or more mutations up the chain
25653
+ // The source of the chain fires the mutation
25654
+ // NOTE this alter is debounced to account for typing
25655
+ alter(diff) {
25656
+ this.dataItem = { ...this.dataItem, ...diff };
25657
+ this.debounce(this.dataItem, 500);
25658
+ }
25659
+ labeltimer;
25660
+ debounce(data, delay) {
25661
+ if (this.labeltimer)
25662
+ clearTimeout(this.labeltimer);
25663
+ this.labeltimer = setTimeout(() => {
25664
+ const diffs = [{ action: 'update', data }];
25665
+ this.mutate.emit(diffs);
25666
+ this.update.emit(diffs);
25667
+ }, delay);
25668
+ }
25608
25669
  render() {
25609
- return (index.h(index.Host, { key: 'f40099a4b122f41dd53e2639fbd79699f7b6a0c9' }, index.h("ls-props-section", { key: '68e2cdb5bba9f29ce1218e55100fbbfbc0a7f648', sectionTitle: "Field Type", sectionDescription: "The Field you currently have selected" }, index.h("ls-field-type-display", { key: '16ffdd1ee14008c4d376dd8201b883b3f7063485', fieldType: this.dataItem?.elementType, assignee: this.dataItem?.signer })), index.h("ls-props-section", { key: 'ac40d7a20d76ba00c83d78285aa6bf115fcf9981', sectionTitle: "Required Field", row: true }, index.h("ls-toggle", { key: 'd1f144f9963789502e32c8801c959d6fab2b26ef' })), index.h("ls-props-section", { key: '48ecc917b8fcbeeff92288a76c68f3e5250a0116', sectionTitle: "Field Label", sectionDescription: "Add a label to clarify the information required from the Recipient." }, index.h("input", { key: 'b6bb5079e4a19083af3c8bae2b6ae2ce36fa8184', value: this.dataItem?.label, placeholder: "eg. Sign Here" })), this.showValidationTypes && (index.h("ls-props-section", { key: '5428255b7c30eb72f311eada4357b485347906c8', sectionTitle: "Content Format", sectionDescription: "Select the specific format you want the Recipient to enter." }, index.h("ls-input-wrapper", { key: '9e490a7e4028d39da82405758cf80b224430615e', select: true }, index.h("select", { key: '1a13ee0ac605c43b49a6484deb2c1063a1d4113e' }, validationTypes
25670
+ return (index.h(index.Host, { key: 'fbcd61d4be4223977b4111b2c6869824cc92ae95' }, index.h("ls-props-section", { key: 'c9ccee360ab21e0d87aac95bd68501e45f6a42de', sectionTitle: "Field Type", sectionDescription: "The Field you currently have selected" }, index.h("ls-field-type-display", { key: '64d603f9f4fc2d29e058408db7f342387d40adde', fieldType: this.dataItem?.elementType, assignee: this.dataItem?.signer })), index.h("ls-props-section", { key: '417e6a383ba695bdd2bc33ad72e9dba6571c003a', sectionTitle: "Required Field", row: true }, index.h("ls-toggle", { key: 'c0f5b0c545a81fbaa6822a69c8c3b39c5012f0f8', id: "toggle-required", checked: !this.dataItem?.optional, onValueChange: (ev) => this.alter({ optional: !ev.detail }) })), index.h("ls-props-section", { key: 'b66fbfe2058ce0a038e93731aec4e52ece3abcdd', sectionTitle: "Field Label", sectionDescription: "Add a label to clarify the information required from the Recipient." }, index.h("input", { key: '13821df6723e1e06a4e1b40bb5f4ff4c3ed96f9b', value: this.dataItem?.label, placeholder: "eg. Sign Here", onInput: (e) => this.alter({ label: e.target.value }) })), this.showValidationTypes && (index.h("ls-props-section", { key: '15fc50a9cb4713fcfdbc0d28d4fc6f726bb0248a', sectionTitle: "Content Format", sectionDescription: "Select the specific format you want the Recipient to enter." }, index.h("ls-input-wrapper", { key: 'a1f58bc51a939d5e29b240890ca340cd5baa82f9', select: true }, index.h("select", { key: '168e0334ee15f426a8757fde2e1f416cf22b19a1', onChange: (ev) => this.alter({ validation: parseInt(ev.target.value) }) }, validationTypes
25610
25671
  .filter(type => type.formType === this.dataItem?.elementType)
25611
- .map(type => (index.h("option", { selected: this.dataItem?.validation === type.id, value: type.value }, type.description))))))), index.h("slot", { key: '34a0924278b03f855bb7b64b23b95998e5244ad8' })));
25672
+ .map(type => (index.h("option", { selected: this.dataItem?.validation === type.id, value: type.id }, type.description))))))), index.h("slot", { key: '7d32ed3bd6452b15c078614955d2bb2ababb812f' })));
25612
25673
  }
25613
25674
  };
25614
25675
  LsFieldContent.style = lsFieldContentCss;
@@ -25934,7 +25995,7 @@ const LsFieldProperties = class {
25934
25995
  };
25935
25996
  LsFieldProperties.style = lsFieldPropertiesCss;
25936
25997
 
25937
- const lsFieldPropertiesAdvancedCss = ":host{display:flex;flex-direction:column;gap:1rem;width:100%;position:relative}*{margin:0;box-sizing:border-box}.field-set{display:flex;flex-direction:column;gap:1rem;width:100%}.ls-field-properties-section{display:flex;position:relative;flex-direction:column;gap:0.5rem}.row{flex-direction:row;align-items:center;justify-content:space-between}.multi-button-group-row{display:flex;gap:0.5rem}.ls-field-properties-section-text{display:flex;flex-direction:column;gap:0.25rem;padding:0.25rem}.ls-field-properties-section-title{color:var(--gray-90, #5e6066);font-size:1rem;font-style:normal;font-weight:500;line-height:1.25rem;}.ls-field-properties-section-description{overflow:hidden;color:var(--gray-80, #6c6e73);text-overflow:ellipsis;font-size:0.75rem;font-style:normal;font-weight:400;line-height:0.75rem;}.input-row{display:flex;gap:0.5rem}.input-row .input-wrapper input{width:9.313rem;max-width:9.313rem}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:36px}.input-wrapper{position:relative;width:100%}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIconDisabled{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-50, #d8d9dc)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover:not(:disabled),select:hover:not(:disabled),textarea:hover:not(:disabled){border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus:not(:disabled),select:focus:not(:disabled),textarea:focus:not(:disabled){outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active:not(:disabled),select:active:not(:disabled),textarea:active:not(:disabled){border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa);color:var(--gray-50, #d8d9dc);box-shadow:none}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip;width:100%}.button-group button{display:flex;width:100%;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;color:var(--gray-80, #6c6e73)}.button-group button:disabled{background:var(--gray-10, #f7f8fa);cursor:not-allowed;color:var(--gray-50, #d8d9dc)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}";
25998
+ const lsFieldPropertiesAdvancedCss = ":host,.field-set{display:flex;flex-direction:column;gap:1rem;width:100%;position:relative}*{margin:0;box-sizing:border-box}.expand-fields-row{display:flex;align-items:center;gap:0.5rem;padding:0.5rem 0.25rem;cursor:pointer;color:var(--gray-80, #6c6e73);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;}.expand-fields-row p{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem;}.field-set{display:flex;flex-direction:column;gap:1rem;width:100%}.ls-field-properties-section{display:flex;position:relative;flex-direction:column;gap:0.5rem}.row{flex-direction:row;align-items:center;justify-content:space-between}.multi-button-group-row{display:flex;gap:0.5rem}.ls-field-properties-section-text{display:flex;flex-direction:column;gap:0.25rem;padding:0.25rem}.ls-field-properties-section-title{color:var(--gray-90, #5e6066);font-size:1rem;font-style:normal;font-weight:500;line-height:1.25rem;}.ls-field-properties-section-description{overflow:hidden;color:var(--gray-80, #6c6e73);text-overflow:ellipsis;font-size:0.75rem;font-style:normal;font-weight:400;line-height:0.75rem;}.input-row{display:flex;gap:0.5rem}.input-row .input-wrapper input{width:9.313rem;max-width:9.313rem}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:36px}.input-wrapper{position:relative;width:100%}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIconDisabled{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-50, #d8d9dc)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover:not(:disabled),select:hover:not(:disabled),textarea:hover:not(:disabled){border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus:not(:disabled),select:focus:not(:disabled),textarea:focus:not(:disabled){outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active:not(:disabled),select:active:not(:disabled),textarea:active:not(:disabled){border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa);color:var(--gray-50, #d8d9dc);box-shadow:none}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip;width:100%}.button-group button{display:flex;width:100%;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;color:var(--gray-80, #6c6e73)}.button-group button:disabled{background:var(--gray-10, #f7f8fa);cursor:not-allowed;color:var(--gray-50, #d8d9dc)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}";
25938
25999
 
25939
26000
  const LsFieldPropertiesAdvanced = class {
25940
26001
  constructor(hostRef) {
@@ -25943,6 +26004,7 @@ const LsFieldPropertiesAdvanced = class {
25943
26004
  this.update = index.createEvent(this, "update");
25944
26005
  }
25945
26006
  dataItem;
26007
+ expanded = false;
25946
26008
  mutate;
25947
26009
  update;
25948
26010
  isSingle(dt) {
@@ -25954,8 +26016,12 @@ const LsFieldPropertiesAdvanced = class {
25954
26016
  alter(diff) {
25955
26017
  let diffs = [];
25956
26018
  if (this.isMultiple(this.dataItem)) {
25957
- this.dataItem = this.dataItem.map(di => { return { ...di, ...diff }; });
25958
- diffs = this.dataItem.map(di => { return { action: 'update', data: { ...di, ...diff } }; });
26019
+ this.dataItem = this.dataItem.map(di => {
26020
+ return { ...di, ...diff };
26021
+ });
26022
+ diffs = this.dataItem.map(di => {
26023
+ return { action: 'update', data: { ...di, ...diff } };
26024
+ });
25959
26025
  }
25960
26026
  else if (this.isMultiple(this.dataItem)) {
25961
26027
  this.dataItem = { ...this.dataItem, ...diff };
@@ -25966,7 +26032,7 @@ const LsFieldPropertiesAdvanced = class {
25966
26032
  }
25967
26033
  getValue(key) {
25968
26034
  if (this.isMultiple(this.dataItem)) {
25969
- return "";
26035
+ return '';
25970
26036
  }
25971
26037
  else if (this.isSingle(this.dataItem)) {
25972
26038
  return this.dataItem[key];
@@ -25974,7 +26040,7 @@ const LsFieldPropertiesAdvanced = class {
25974
26040
  return '';
25975
26041
  }
25976
26042
  render() {
25977
- return (index.h(index.Host, { key: 'cfeb8466da924eb5ff0e22419ce42f9fa62916fc' }, index.h("div", { key: '104b767320975d61197a681a6908ab5729188c76', class: 'ls-field-properties-section' }, index.h("div", { key: '5e13e3f6a3f901a782462dbbc268480378752a5d', class: 'ls-field-properties-section-text' }, index.h("p", { key: 'cc2559ee4b416368f35bf0fec95543b57936b6fc', class: 'ls-field-properties-section-title' }, "Field Order"), index.h("p", { key: '641e48a121c435db5e08664911fb457ff24642a2', class: 'ls-field-properties-section-description' }, "Determines what order fields will be filled in by the user")), index.h("div", { key: 'f2f7f55377ebf856719692774986c188945fcf8e', class: 'input-row' }, index.h("div", { key: 'e57b9213a3039cec1061bec0e7af800bff2e4e18', class: 'input-wrapper' }, index.h("input", { key: '67381c1f0277fb0db96862f183694638e8a9f807', value: this.getValue('fieldOrder'), width: "30", placeholder: "eg. Sign Here", onChange: e => this.alter({ fieldOrder: e.target.value }) })))), index.h("div", { key: '5f2c3489ff4fbc8d24533b25cb183e8d16a63b10', class: 'ls-field-properties-section' }, index.h("div", { key: '39d15edfa2b6291be1c6ea2f8f33d316b5811b3b', class: 'ls-field-properties-section-text' }, index.h("p", { key: 'cdf2dffd127fb0efeb9e6b6a557b3b6c3745f50a', class: 'ls-field-properties-section-title' }, "Ref Name")), index.h("div", { key: 'b4ae0157b16012fe431d18cdf96af472f021a939', class: 'input-row' }, index.h("div", { key: 'f5f7b4f38f2b4aca69affa8be7dc99e0a54073b5', class: 'input-wrapper' }, index.h("input", { key: 'af3e8bc2970a7f5fd3923f9f668cb53ffbdfe71f', value: this.getValue('link'), width: "30", placeholder: "", onChange: e => this.alter({ link: e.target.value }) }))), index.h("div", { key: '2e3fdcd03909b0008831efecdb8a21c8649c7361', class: 'ls-field-properties-section-text' }, index.h("p", { key: 'ed6aaa0e3c5ebdd2e6d81b5f97e654adba1e7532', class: 'ls-field-properties-section-title' }, "Link Field")), index.h("div", { key: 'be06875d5749587960b691f37de5e23f6013c8d2', class: 'input-row' }, index.h("div", { key: '846422d3cd5a259358bb967871f2351b9d89118a', class: 'input-wrapper' }, index.h("input", { key: '8f53750d605f61cf49c2e5c07ca26e8650900416', value: this.getValue('logicGroup'), width: "30", placeholder: "", onChange: e => this.alter({ logicGroup: e.target.value }) }))), index.h("div", { key: '01dc9f0bd938585c10d9a05a522aac5deef7a232', class: 'ls-field-properties-section-text' }, index.h("p", { key: 'ed557adcfb2b8cda9b71ca7e072fd8f52b42b1ae', class: 'ls-field-properties-section-title' }, "Link Value")), index.h("div", { key: '73d91a676bacda278ef5f21d538693d410b9cc71', class: 'input-row' }, index.h("div", { key: '60834af88de3ed902c915ed5b69168eded0c54ca', class: 'input-wrapper' }, index.h("input", { key: '3ab12ef6398a35b434835cba68f419c027a73548', value: this.getValue('logicAction'), width: "30", placeholder: "", onChange: e => this.alter({ logicAction: e.target.value }) }))))));
26043
+ return (index.h(index.Host, { key: '13764250d68a05fbee356dbde639776287cdf9e5' }, index.h("div", { key: 'c92ad260794264e6404c899d2710481af8d10e44', class: 'expand-fields-row', onClick: () => (this.expanded = !this.expanded) }, index.h("ls-icon", { key: '5805196a133f130833092504f86487efd770a74a', name: this.expanded ? 'expand' : 'collapse', size: "20", solid: true }), index.h("p", { key: '5e9284bd0d1b616c39c3fd1a50613897edeb4968' }, "Advanced Properties")), this.expanded && (index.h("div", { key: 'a61dcdba03cab23524f21991fcbbf023a313b403', class: 'field-set' }, index.h("ls-props-section", { key: 'c0ca45f621a1f7cbcba368c7c9d2d168e534d51f', sectionTitle: "Field Order", sectionDescription: "Determines what order fields will be filled in by the user" }, index.h("input", { key: '698ef61532e2ca9d00d509432f65b5b3b881fa37', value: this.getValue('fieldOrder'), type: "text", placeholder: "eg. 1", onChange: e => this.alter({ fieldOrder: e.target.value }) })), index.h("ls-props-section", { key: '540fd53b8452fb387bfb75fbd3a17f935295d300', sectionTitle: "Ref. Name" }, index.h("input", { key: '6658e31e3f9ca1190883b19a8103f37e434771c5', value: this.getValue('link'), placeholder: "eg. checkbox group", onChange: e => this.alter({ link: e.target.value }) })), index.h("ls-props-section", { key: '758601e648c189f4d8f0ff80ce5974a4c779c0bb', sectionTitle: "Link Type", sectionDescription: "Determines in what way this field is linked to other fields" }, index.h("select", { key: 'a26d18acd3d15017267b0cafb0c346e4af9d8416', onChange: e => this.alter({ linkType: e.target.value }), name: "Link Field", "aria-label": "Link Field" }, index.h("option", { key: '375df98bd655971a6a7fc35dce325657e6cd8a36', value: "0", selected: this.getValue('linkType') === '0' }, "None"), index.h("option", { key: '6100b1adfdd493723150acb3a8d8c73c5fb6dccd', value: "1", selected: this.getValue('linkType') === '1' }, "One of a group (e.g. select one checkbox)"), index.h("option", { key: '2e7c259691e2b0e2bb59cdc6802d2ca96ff0a1f9', value: "2", selected: this.getValue('linkType') === '2' }, "Add to a total"), index.h("option", { key: '1efa3dc3df6b3c00d95e737e3e2717483426a68e', value: "3", selected: this.getValue('linkType') === '3' }, "Make this conditional upon..."))), index.h("ls-props-section", { key: '29812fd14ef2c57990d242b7ee816c3cabcd547a', sectionTitle: "Link Value", sectionDescription: "Fields with the same Link Value will be linked together" }, index.h("input", { key: '92ca9721c4b4bef3f91e3b69469175eddd2859d3', value: this.getValue('logicAction'), width: "30", placeholder: "eg. checkbox group", onChange: e => this.alter({ logicAction: e.target.value }) }))))));
25978
26044
  }
25979
26045
  };
25980
26046
  LsFieldPropertiesAdvanced.style = lsFieldPropertiesAdvancedCss;
@@ -25987,7 +26053,7 @@ const LsFieldPropertiesAutosign = class {
25987
26053
  }
25988
26054
  dataItem;
25989
26055
  render() {
25990
- return (index.h(index.Host, { key: 'd5ccb24439990eb3cc4f366fb7394f2e3e2cb452' }, index.h("div", { key: 'be4140d089703ef67eb9b6ac68877e37bb7f3df0', class: "ls-field-properties-section" }, "Self Sign Field"), index.h("div", { key: 'ee24bf3c4a5142f60f215600be085e59349c0554' }, "Label: ", index.h("input", { key: '62285453c5941ea10c4276f669aa14a1eeb0a959', value: this.dataItem?.label, width: "30" })), index.h("ls-field-dimensions", { key: '0a1fb9c049038637c2274dd4b84c36deaac02cfa', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: '2a151f7683892a71fde381d813dd1a46eefbdfbc', dataItem: this.dataItem }), index.h("ls-field-footer", { key: 'c2dd2b78196792f45d34bdc8ae6c13b29b5a8756', dataItem: this.dataItem }), index.h("slot", { key: '0f22d1a42d53cd77e620e229e8d78a2b1bdac548' })));
26056
+ return (index.h(index.Host, { key: '509d9977fabd976760f5ac004627f377e9da5809' }, index.h("div", { key: '33a0e46c2fff043b4758decf242ef73ba925ce41', class: "ls-field-properties-section" }, "Self Sign Field"), index.h("div", { key: 'e72c11df7e14710a6a5bbcfd03b512ddcc08268f' }, "Label: ", index.h("input", { key: '0eea2722278b212fb9f9bf9c4030b6bedb80deaa', value: this.dataItem?.label, width: "30" })), index.h("ls-field-dimensions", { key: '43ccc8c1fd9c3adbd2970099a2347c093a643647', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: '6fafad0b24e22d32e5ef648c0903770bdabda02a', dataItem: this.dataItem }), index.h("ls-field-footer", { key: 'ac6e9753309f751ee4cfc46a29077579b376a79b', dataItem: this.dataItem }), index.h("slot", { key: 'e6f61f7e6cd0f2e98748ce014fdde5a996297350' })));
25991
26057
  }
25992
26058
  };
25993
26059
  LsFieldPropertiesAutosign.style = lsFieldPropertiesAutosignCss;
@@ -26007,7 +26073,7 @@ const LsFieldPropertiesContainer = class {
26007
26073
  }
26008
26074
  }
26009
26075
  render() {
26010
- return (index.h(index.Host, { key: '25eb2d3af29ce59d7c13a036c9c44e9fa9a666b5' }, this.tabs.length > 1 && (index.h("div", { key: 'a202c440d465a3ef0f6292ad00af7a2c19da4b8c', class: 'tabs-container', style: { gridTemplateColumns: `repeat(${this.tabs.length}, 1fr)` } }, this.tabs.map(tab => (index.h("button", { class: tab === this.selectedTab ? 'ls-tab active' : 'ls-tab', onClick: () => (this.selectedTab = tab) }, tab))))), index.h("div", { key: 'e7696713a10454fed3372b8038c513bc92d1f45a', class: 'scrolling-container' }, index.h("slot", { key: '5ff6adbdcfe3aa10b94a4a146e9d8bb886d7ea3c', name: this.selectedTab }))));
26076
+ return (index.h(index.Host, { key: '6079b2c5963afbab2881822ad90626bb3d538bd4' }, this.tabs.length > 1 && (index.h("div", { key: 'd170b92c0570c51840884f125e8f60bb551c2d21', class: 'tabs-container', style: { gridTemplateColumns: `repeat(${this.tabs.length}, 1fr)` } }, this.tabs.map(tab => (index.h("button", { class: tab === this.selectedTab ? 'ls-tab active' : 'ls-tab', onClick: () => (this.selectedTab = tab) }, tab))))), index.h("div", { key: '5783106ef24e1cb20e34fb7f90a1013388461041', class: 'scrolling-container' }, index.h("slot", { key: 'ad3734e9292d10a8d092d6e361fc1d1c0270cfce', name: this.selectedTab }))));
26011
26077
  }
26012
26078
  };
26013
26079
  LsFieldPropertiesContainer.style = lsFieldPropertiesContainerCss;
@@ -26020,7 +26086,7 @@ const LsFieldPropertiesDate = class {
26020
26086
  }
26021
26087
  dataItem;
26022
26088
  render() {
26023
- return (index.h(index.Host, { key: '15e1790a3e3b2bab9a1363b50868571b36743819' }, index.h("ls-field-properties-container", { key: 'f036e0787551d08f20d73c7bd298982b39b99aa2', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: '29b6b94164b24bb0c0a7cb54ba03cb00e27e69fa', class: 'field-set', slot: "content" }, index.h("ls-field-content", { key: 'b69912b94a1ee136b3edf224e2fc4b84846c3221', dataItem: this.dataItem })), index.h("div", { key: 'a75d0fb0aaf5b7f19c7873737aea11faf5e8b0a8', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: 'b71db3204dc049e0c6d58784eeab40becf052932', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: '84b00bcc0afc4fe0e528a6519bbf804bcc52abab', dataItem: this.dataItem })), index.h("div", { key: '10938ac9e48fb68d1648f7041e3035bdf085affa', class: 'field-set', slot: "placement" }, index.h("ls-field-placement", { key: 'a093830cddab37f5fc880487485b10ddeb848ba7', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: 'd578684a63e9bc7e7721dff92faf78da9ae58b77', dataItem: this.dataItem })));
26089
+ return (index.h(index.Host, { key: '561f285f854c85ca972c64680815247b22dc9375' }, index.h("ls-field-properties-container", { key: '6db75b020fb217fc23eee221f2ae286487abeb1b', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: 'fc0948a3ee41b4a0c080a222d0ea072bea30698b', class: 'field-set', slot: "content" }, index.h("ls-field-content", { key: '6671fa05122e2b42453636d88a2d8e04ec57df79', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: '4e60347e00e3295dfd0f961ec785695fe8dcc2b2', dataItem: this.dataItem })), index.h("div", { key: 'c05bef5b9272591f1080cacc93bb04da8aa3ddce', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: '605caaa6a8f45f84db210f9290ebac03bb4b444f', dataItem: this.dataItem })), index.h("div", { key: 'c29e769913ba3c8879916e32ed76b5f1368ca79f', class: 'field-set', slot: "placement" }, index.h("ls-field-placement", { key: 'ae23c6263ec6aa10d9c17e55836a6f8420e56913', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: '5c905ba34549cad4a216003f2e5d15a4cbeb8bc3', dataItem: this.dataItem })));
26024
26090
  }
26025
26091
  };
26026
26092
  LsFieldPropertiesDate.style = lsFieldPropertiesDateCss;
@@ -26033,7 +26099,7 @@ const LsFieldPropertiesEmail = class {
26033
26099
  }
26034
26100
  dataItem;
26035
26101
  render() {
26036
- return (index.h(index.Host, { key: 'fe57500849f3a12c8c3ab3af7d428f866bfcfc14' }, index.h("ls-field-properties-container", { key: 'bda0522f559082a0148d5b4d330c38f36dabde36', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: '38c7082d4a05adc7e293741522bc0afd524fb064', class: 'field-set', slot: "content" }, index.h("ls-field-content", { key: 'ce455797552fb6fdea8d70df17c9328853d1b5f3', dataItem: this.dataItem })), index.h("div", { key: '48c900dd7e21b4bcd24ee6b2ecc6053b7426a085', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: '57f2bf18d919eb42df4ad13d5b2fe5047d48d9f6', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: '024219dd1e7a9f56a11b52c6c62f4811774c0307', dataItem: this.dataItem })), index.h("div", { key: '18488b79ee3852165808938cfa856d5776d0318a', class: 'field-set', slot: "placement" }, index.h("ls-field-placement", { key: '561984d158d86f83cad30532364139731e22677f', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: '3d9dade730d3cd652cdcaedddec6ee018c7ff1d0', dataItem: this.dataItem })));
26102
+ return (index.h(index.Host, { key: '33fea4828cffefd5eaae74a43e3a704fe2832cec' }, index.h("ls-field-properties-container", { key: '41d59f707ef7c197d69c332488e44cecb9204e3f', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: 'dfe52edf587bf1547cf51054e605e484f3116936', class: 'field-set', slot: "content" }, index.h("ls-field-content", { key: '1fa27823f0e291b152ce523404212b0f0fb07cca', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: 'f4f95a13f16478e361bd25802c88ae21d1ebbdca', dataItem: this.dataItem })), index.h("div", { key: 'a47cc75a5d9a5a5dac56b72e0e6841cbd1250f4b', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: 'b94c59c4e089854cbea563499bccc5d665d90d94', dataItem: this.dataItem })), index.h("div", { key: '94e7a84e164c1211deb3b7ddbd1b5c51b9515893', class: 'field-set', slot: "placement" }, index.h("ls-field-placement", { key: 'c86e375a85dada5d92f44e4388ab455d7bd9a1ed', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: '9fcc5e6eb73b6132671a55002cbd066f77e52d78', dataItem: this.dataItem })));
26037
26103
  }
26038
26104
  };
26039
26105
  LsFieldPropertiesEmail.style = lsFieldPropertiesEmailCss;
@@ -26046,7 +26112,7 @@ const LsFieldPropertiesFile = class {
26046
26112
  }
26047
26113
  dataItem;
26048
26114
  render() {
26049
- return (index.h(index.Host, { key: 'abe869fbc6fe87fb001a788e67620fd750c559de' }, index.h("ls-field-properties-container", { key: '4db843846015ace0fdc34f9dc3d24e5a257dc9d6', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: '5700bdeed53b83cb940d37defe750ca5e08564f5', class: 'field-set', slot: "content" }, index.h("ls-field-content", { key: '779b337e3da04d5ff1da49a96197d00cb605bf8c', dataItem: this.dataItem })), index.h("div", { key: 'fd27f9967c8e63a1a2fd6818a8ebcd5de5e338b1', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: 'c3a248f6c6f6b0467819e3e4725e69c354b05cfe', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: '74244e8d8773afe806f2cc58ca8bb11ea865af1b', dataItem: this.dataItem })), index.h("div", { key: 'a74e367fea26025b82d0691d4dd0e4644fff8dda', class: 'field-set', slot: "placement" }, index.h("ls-field-placement", { key: 'd9c964d39ee5e9ab56a7422fd04569dc53da36f2', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: '62f7abd758b29f6fa46808c96c7f376751623c8b', dataItem: this.dataItem })));
26115
+ return (index.h(index.Host, { key: '162bcbf721f54f6ac81f0060c3583554d59b3797' }, index.h("ls-field-properties-container", { key: '6cf46415eeac665e770b64c0b78cfd8f953d48df', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: 'bc12cb0dba8cea583b9f93e557424b7557c7168b', class: 'field-set', slot: "content" }, index.h("ls-field-content", { key: '8d98ac4999a22742e065e4d179019e2c8ffa2f69', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: '67e42897a7f2c0754efc39d30b90e0b5dc17eab8', dataItem: this.dataItem })), index.h("div", { key: 'e4b704c373cd03e3087355af153d00fc8f5ccc46', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: 'c8345c4fca3c686bf78c82f75307191072e076d0', dataItem: this.dataItem })), index.h("div", { key: 'e2134cecb75e15e737bf42d9341e70042193b339', class: 'field-set', slot: "placement" }, index.h("ls-field-placement", { key: '11f74937bfdc94ee064af348bbe70c69df73ce9c', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: 'cf65774013025576175ed7abd9dff747444dc1ef', dataItem: this.dataItem })));
26050
26116
  }
26051
26117
  };
26052
26118
  LsFieldPropertiesFile.style = lsFieldPropertiesFileCss;
@@ -26059,7 +26125,7 @@ const LsFieldPropertiesGeneral = class {
26059
26125
  }
26060
26126
  dataItem;
26061
26127
  render() {
26062
- return (index.h(index.Host, { key: '6d7519f081ab44db15372b79260683bdeadb44f5' }, index.h("ls-field-properties-container", { key: '4816faeb330b8abc692dc7af39801c54358e1a46', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: '6e291a153ffa4a0742b8c0aa87f25c377f697f33', class: 'field-set', slot: "content" }, index.h("ls-field-content", { key: '2d172b69853a019d29570bb2c473b9d57f723f88', dataItem: this.dataItem })), index.h("div", { key: 'f89f980b850d6ca5b5258be4faa5b86ac6a4c644', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: '434ca6a54956c29cef1e47ec137d83379a402574', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: 'ad318ec30cd2cd2455cc7c55f897f266a82c14f2', dataItem: this.dataItem })), index.h("div", { key: 'b101a40d2f82e0490c49676a1e59cf3c9e4e7b11', class: 'field-set', slot: "placement" }, index.h("ls-field-placement", { key: 'c60b5e55a2ec0c0d3866b1dc4b50c480a5f36569', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: '27e4ed293fb9255d96f5599abef17c444f634087', dataItem: this.dataItem })));
26128
+ return (index.h(index.Host, { key: '8e70b4c661db5622072b5336f7d0d3a291e31487' }, index.h("ls-field-properties-container", { key: '1668577d5901d93756fce93445b20fa547a07b90', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: '660cdbd41acde0a9e1f24a61e3e00449f892b79e', class: 'field-set', slot: "content" }, index.h("ls-field-content", { key: '0eb6046520c4639017d46c9f3daf18cb28c1fb77', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: '51b3a5756cd9e26b54646064fa8424505fbbf899', dataItem: this.dataItem })), index.h("div", { key: '7ed6daa4612bd86167d523553e479d834af0330b', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: 'a72b43cec0cd7761e5264fd0abb16566940a33e8', dataItem: this.dataItem })), index.h("div", { key: 'ba570c0f5e1a04bd1002717fb3b6e158f1fe855f', class: 'field-set', slot: "placement" }, index.h("ls-field-placement", { key: 'e17bc93ab4ecc3aa05a97429da456e577d3695ee', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: '862d7cf5de1bc450044008230db4481bca4647bb', dataItem: this.dataItem })));
26063
26129
  }
26064
26130
  };
26065
26131
  LsFieldPropertiesGeneral.style = lsFieldPropertiesGeneralCss;
@@ -26072,7 +26138,7 @@ const LsFieldPropertiesImage = class {
26072
26138
  }
26073
26139
  dataItem;
26074
26140
  render() {
26075
- return (index.h(index.Host, { key: '5cad1f01d18a7dca2543c979cc42030e7729b5a7' }, index.h("ls-field-properties-container", { key: '7d9a6ee09e506bb20d93e382185c1adedb748e29', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: '2df8383ba9e43b92587de95175ee2a76c7ccd252', class: 'field-set', slot: "content" }, index.h("ls-field-content", { key: 'c6d74bb817bc7df4ebc0c0328fa8266a48b98958', dataItem: this.dataItem })), index.h("div", { key: 'bb396c7dd6fd19c5df6d6041cca87b348e6ca290', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: '01d9a2e2fd6ae6ba85e3b54c2a0f9f3caeb01932', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: 'bc6ce1caffa0162515174dda19c1ba14bbcbd555', dataItem: this.dataItem })), index.h("div", { key: '8698ad230506c3daa92d94b090102f7f4127f4e0', class: 'field-set', slot: "placement" }, index.h("ls-field-placement", { key: 'b760c0363f62beb8fd53486e72f7e11af95b4c84', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: '47fc05d11b26a36c6be5666ac29460fb56e23ce3', dataItem: this.dataItem })));
26141
+ return (index.h(index.Host, { key: '7dfab77e158e86d6f65114c2e2eb018f25fc5da1' }, index.h("ls-field-properties-container", { key: '2e4c9410600d561811ad58051ccb60b1ec8c9660', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: 'd9cf2997d89242ffdcb74b70768ad8b95d9ffec9', class: 'field-set', slot: "content" }, index.h("ls-field-content", { key: '7df9cc00713c931ab241005fab037ed8061947a2', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: '3c99ccc2516bfed139e6440b7fa4bd9d84ba0671', dataItem: this.dataItem })), index.h("div", { key: '15098eb0b2a578fdea90315452c9ace103c14f3c', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: '611181fa07e91b053e3004334b10667034784bd0', dataItem: this.dataItem })), index.h("div", { key: '9b1ca8c7095d1f1f275300cae50bce3aa3673e21', class: 'field-set', slot: "placement" }, index.h("ls-field-placement", { key: 'c077fc5e6c365126da59f31c61fc74df463b6661', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: '74cddb79b38d4580ad084c5e3b6a7055d611c31b', dataItem: this.dataItem })));
26076
26142
  }
26077
26143
  };
26078
26144
  LsFieldPropertiesImage.style = lsFieldPropertiesImageCss;
@@ -26126,14 +26192,14 @@ const LsFieldPropertiesMultiple = class {
26126
26192
  return { isSame: allSame, elementType: allSame ? firstElementType : 'mixed' };
26127
26193
  };
26128
26194
  render() {
26129
- return (index.h(index.Host, { key: '4c2c2803ea02df94423257db8e22e1551270310a' }, index.h("ls-field-properties-container", { key: 'cf83a933f78b1b2bbaa2a078588d6eeea7cacce3', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: 'b304b9123a01db5814805dcd16eb9e9a9372545a', class: 'field-set', slot: "content" }, index.h("div", { key: 'bd76fbb2ff71d300b87e2d0722dfc425c47324a9', class: 'ls-field-properties-section' }, index.h("div", { key: '8f14900f8cba5b0999cec7b701bcd10e2cdca757', class: 'ls-field-properties-section-text' }, index.h("p", { key: '7f98eef813aa23257213823a0e093ed1c1e2eb69', class: 'ls-field-properties-section-title' }, "Field Type"), index.h("p", { key: '75d7f7388615e378d9e97b68bb68a2134d78206a', class: 'ls-field-properties-section-description' }, "The Fields you currently have selected")), index.h("div", { key: 'ea77719516401a6a411b6d0fcf7b637d41c80360', class: 'ls-field-type-wrapper', style: {
26195
+ return (index.h(index.Host, { key: 'ebd6f5e2ce867dfa63377445ae76f97fa3b5e486' }, index.h("ls-field-properties-container", { key: 'cd41f97f58ba358b498d26cd8a5f66c5a8120c6b', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: '67a9a3a30b1ffe4a404db3ac9607119a1c165d10', class: 'field-set', slot: "content" }, index.h("div", { key: '68f7f3db09e909fdcfe8baf6f550e36afd0ece11', class: 'ls-field-properties-section' }, index.h("div", { key: 'bd4a0ad7e320b759916fc36b0ab7999988e76ef8', class: 'ls-field-properties-section-text' }, index.h("p", { key: 'c57b188697af8ba89202f4cf183490d2766764ed', class: 'ls-field-properties-section-title' }, "Field Type"), index.h("p", { key: '8c4017440c558b8367ec13a794f97b28c97b1d1c', class: 'ls-field-properties-section-description' }, "The Fields you currently have selected")), index.h("div", { key: '2cde399b2f7b8e47efcbcd1732cf69d3ba7c92f6', class: 'ls-field-type-wrapper', style: {
26130
26196
  border: `1px dashed ${defaultRolePalette[this.allSignersSame().signer % 100].s30}`,
26131
26197
  background: defaultRolePalette[this.allSignersSame().signer % 100].s10,
26132
- } }, index.h("div", { key: 'b986332792955c0aef27d771328b88a9b3742b31', class: 'ls-field-type-inner' }, index.h("div", { key: '7d712b6bfada39b0da6c6a2f6b285da66966d9bd', class: 'ls-field-type-icon', style: {
26198
+ } }, index.h("div", { key: '7375db87dc102145a9b712995aed16674a16b704', class: 'ls-field-type-inner' }, index.h("div", { key: '060c591bdbb72e08d60cb0d23447f6242fe94455', class: 'ls-field-type-icon', style: {
26133
26199
  border: `1px solid ${defaultRolePalette[this.allSignersSame().signer % 100].s60}`,
26134
26200
  color: defaultRolePalette[this.allSignersSame().signer % 100].s60,
26135
26201
  background: defaultRolePalette[this.allSignersSame().signer % 100].s10,
26136
- } }, index.h("ls-icon", { key: 'db07ad1372e262bf903e79105c61bea9da59017a', name: getFieldIcon(this.allElementsSame().elementType), size: "20" })), index.h("p", { key: 'c3924ef9e0a1068d8451d735a23a02d769ea40b8', class: 'ls-field-type-name' }, this.dataItem.length, " ", this.allElementsSame().elementType, " ", 'Fields')))), index.h("div", { key: '70332b5f559101e0e8b53ca8f250b81117266a3c', class: 'ls-field-properties-section row' }, index.h("div", { key: 'a65f089be10b9f5a7a1bd8be387c86145e206a4e', class: 'ls-field-properties-section-text' }, index.h("p", { key: '8698871ebc6665e8d5d7e31c66f8d04725d20d0f', class: 'ls-field-properties-section-title' }, "Required Field")), index.h("ls-toggle", { key: 'de7ed0f9d82f31a99766abfdaad5f14cbc087258' })), index.h("div", { key: '5ca66f86c288280d99c6cbd508fcd2cd4645cb8e', class: 'ls-field-properties-section' }, index.h("div", { key: 'c29a3dd4d9219798f5dcf8764ed9a6245a4ab181', class: 'ls-field-properties-section-text' }, index.h("p", { key: '5cb60aef38be09802f1ffb2c1d5741b36012ec91', class: 'ls-field-properties-section-title' }, "Field Label"), index.h("p", { key: '02c560f9bb3bf2de0900e71a89dc96fe022188c6', class: 'ls-field-properties-section-description' }, "Add a label to clarify the information required from the Recipient.")), index.h("input", { key: 'b68c358eea2796a45dedff31284ab1e5034df501', value: this.allLabelsSame().label, width: "30", placeholder: "eg. Sign Here" }))), index.h("div", { key: '82da2aa3841d38f16a30a6e00015d725a8484ad8', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: '5f2da913cd12ba10291cbf4dfc9b1b633f1ed50c', dataItem: this.dataItem }), index.h("ls-field-size", { key: 'c7fea2531d1250f71b56c6e4ffea718918b93ba4', dataItem: this.dataItem })), index.h("div", { key: 'e9032cc55007958fca2c9276b88de00b8a3d2e48', class: 'field-set', slot: "placement" }, index.h("ls-field-alignment", { key: 'af0bde4c13d46935488f5e7e1cf08def1027a6b5', dataItem: this.dataItem }), index.h("ls-field-placement", { key: '4a1d62b8fb499f3258cd7c9cd8677fdfbb6cb31e', dataItem: this.dataItem }), index.h("ls-field-distribute", { key: '6eea0f8a9715c74e7f3014472702ef3fd1d039bb', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: 'c20ea68afc068fe2b310d6d77ebf7dd9d08d8397' }), index.h("slot", { key: '0bd1b846b0f0fa748f18fd09609ad1c85690d5f7' })));
26202
+ } }, index.h("ls-icon", { key: '7b103d1d2822194782c583e1e8ddf9be124e5922', name: getFieldIcon(this.allElementsSame().elementType), size: "20" })), index.h("p", { key: '698ccfac728993c3c1fd5327844b0d6fb4d4db10', class: 'ls-field-type-name' }, this.dataItem.length, " ", this.allElementsSame().elementType, " ", 'Fields')))), index.h("div", { key: '92289d28ccecf9c32bc94f094224ae32d66984c4', class: 'ls-field-properties-section row' }, index.h("div", { key: 'fc125615d4a45c6d4c5aaeb24f2bb8287d38c877', class: 'ls-field-properties-section-text' }, index.h("p", { key: 'f4f76e0e991f48256cde939e9e52ceccfffc4d60', class: 'ls-field-properties-section-title' }, "Required Field")), index.h("ls-toggle", { key: '0db2516e7f430b95eebbef197eb744d6a21645d9' })), index.h("div", { key: '9f3f3dbed823a3ce722a80f932ffc2717b8249ac', class: 'ls-field-properties-section' }, index.h("div", { key: '8e830c49abffa3e45de9a063cfbe6a2d9d54b9db', class: 'ls-field-properties-section-text' }, index.h("p", { key: 'f1acdc9affda38a87abc2c5b87d125cff7fd1296', class: 'ls-field-properties-section-title' }, "Field Label"), index.h("p", { key: '9d71e80ac7625baae5e2e574e898308116545ee8', class: 'ls-field-properties-section-description' }, "Add a label to clarify the information required from the Recipient.")), index.h("input", { key: '0a29d55fc3d71c82e03b49f580044cc19b415676', value: this.allLabelsSame().label, width: "30", placeholder: "eg. Sign Here" }))), index.h("div", { key: '6ef362c04acbf78c5554539064107e8570fd0ec7', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: 'f7c662c8a4b5e1ffb1ba7b680eb7234daaac5e95', dataItem: this.dataItem }), index.h("ls-field-size", { key: '6422e8ef49213824b67228b98bcc0f47c091a81d', dataItem: this.dataItem })), index.h("div", { key: '922cc3b60aab600e1438a8787b4430906f622c76', class: 'field-set', slot: "placement" }, index.h("ls-field-alignment", { key: '8a156338302c4254ed3ed626ebeb2f09df91db6a', dataItem: this.dataItem }), index.h("ls-field-placement", { key: 'a52775d15c46ff881782e0f7e165ba7670ccbb35', dataItem: this.dataItem }), index.h("ls-field-distribute", { key: 'da6e5840c99d536982281c4ea1835f41adfd680e', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: '5d265e78e5e7c785cf4ad458b1f24d6873d144d2' }), index.h("slot", { key: 'e25278e88b2dbda1fd28e18f893999c0ea7c90fc' })));
26137
26203
  }
26138
26204
  };
26139
26205
  LsFieldPropertiesMultiple.style = lsFieldPropertiesMultipleCss;
@@ -26146,7 +26212,7 @@ const LsFieldPropertiesNumber = class {
26146
26212
  }
26147
26213
  dataItem;
26148
26214
  render() {
26149
- return (index.h(index.Host, { key: '428d4a87c83b066fefb56ae181243f002394bdc8' }, index.h("ls-field-properties-container", { key: '487e6689227f9fb520f9f8f3734c4dd3bc7b76c8', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: '667ccb4cbc7122a9da98c9d0f982684bf21d4c95', class: 'field-set', slot: "content" }, index.h("ls-field-content", { key: 'd7d4b158d08621980b3824866fcdcae4666fd339', dataItem: this.dataItem })), index.h("div", { key: 'cb5f4eb18cd86c7f39513fb597f13760ae4e68a3', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: 'e772fd00bb2d39ec2a1c0d8dc2f8e8d90d30243d', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: '6b4fb9b4a9050198d55dba84794ecacc2c33b3fb', dataItem: this.dataItem })), index.h("div", { key: '1146116277ce19a9eb8fcbfe219e2e1e15da37d2', class: 'field-set', slot: "placement" }, index.h("ls-field-placement", { key: 'ed6a5c398761f3c44c76f60ff0e23dcd50f5d369', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: 'b519aa1d12d67386fbc817aff8f2fd99538e1303', dataItem: this.dataItem })));
26215
+ return (index.h(index.Host, { key: '28f789781cad0b21b127126a26e4597162caa705' }, index.h("ls-field-properties-container", { key: 'd4fa12d0d1a2ff6d585e7a005b3d14126ea5ec12', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: '6618c396a7116d3f7b00b99ec3bb0fcb3770dc58', class: 'field-set', slot: "content" }, index.h("ls-field-content", { key: '384b7f0c1183881617a36462b4fea982ce0107eb', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: '6a59f0c2618e69c5e227d9ee4ef102bca3850e8b', dataItem: this.dataItem })), index.h("div", { key: 'c1f1d99f634f542163ba0e39241fe60c3f5be902', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: '01cbab95055b454847dd33d3712db5ed141dd604', dataItem: this.dataItem })), index.h("div", { key: '790e17ac8b8fb6db5ddd68ed52abad65eba01d18', class: 'field-set', slot: "placement" }, index.h("ls-field-placement", { key: '46df1a8cb778b52773c85cc5a691d1aef77c3597', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: '24e4d795a6f15948a353c48c761df9b9cf015891', dataItem: this.dataItem })));
26150
26216
  }
26151
26217
  };
26152
26218
  LsFieldPropertiesNumber.style = lsFieldPropertiesNumberCss;
@@ -26159,7 +26225,7 @@ const LsFieldPropertiesSignature = class {
26159
26225
  }
26160
26226
  dataItem;
26161
26227
  render() {
26162
- return (index.h(index.Host, { key: '14e2d0ff4a4c98796eba4b87453d3a6a8146efd0' }, index.h("ls-field-properties-container", { key: '7f838a8d338502772f91360d9af366cd7f313514', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: 'ea4ef5668d131ed1f1b671b9addd069e78400a4a', class: 'field-set', slot: "content" }, index.h("ls-field-content", { key: '6ec973b6360ec572b4dbcb6c9da69f5173efa4bb', dataItem: this.dataItem, showValidationTypes: false })), index.h("div", { key: 'a703894470800c99adf752308b32c824cc471da8', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: '2ce167964fca49a4fb9648a130849a29bdfd80db', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: 'ab7af7fa45c5e05edec5cb0d95fa76df7aecd95d', dataItem: this.dataItem })), index.h("div", { key: 'a7e9a940037b370e3f88c9230ebec5998ff52788', class: 'field-set', slot: "placement" }, index.h("ls-field-placement", { key: 'b4678a0a13c493dec00595bff5f5d50dca43fbce', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: '659861e2e9fcfc2cf2958d82a9e168d1789da395', dataItem: this.dataItem })));
26228
+ return (index.h(index.Host, { key: '723074ad497495421be9aa9e0464485d613d602d' }, index.h("ls-field-properties-container", { key: 'f73de10d2722092d486b3e6f38a1710ea18ad8bd', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: '7a774106c2131d623934bcb42d1e0cea1b5e898f', class: 'field-set', slot: "content" }, index.h("ls-field-content", { key: '4121046e5359c669973819d6f0749d2321740a61', dataItem: this.dataItem, showValidationTypes: false }), index.h("ls-field-properties-advanced", { key: 'cabcf54fdac5e05a3afb5efa069004b46edea4fc', dataItem: this.dataItem })), index.h("div", { key: '62b88a61f16d93aa8994a2eebfe61ed076799ba7', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: '467047de4da0f166e2962481385bd3c27c6f740d', dataItem: this.dataItem })), index.h("div", { key: 'd72c0b59b468ff6133994345a9fe28da47d499c3', class: 'field-set', slot: "placement" }, index.h("ls-field-placement", { key: '5b8b6eb72e23fac2347e9b23d95401cdc8054324', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: '2543f517ad29a738a099f066edeb4d71b537d868', dataItem: this.dataItem })));
26163
26229
  }
26164
26230
  };
26165
26231
  LsFieldPropertiesSignature.style = lsFieldPropertiesSignatureCss;
@@ -26172,7 +26238,7 @@ const LsFieldPropertiesText = class {
26172
26238
  }
26173
26239
  dataItem;
26174
26240
  render() {
26175
- return (index.h(index.Host, { key: '8b2b22b236689b065c76bb0c211934408e5bf3f5' }, index.h("ls-field-properties-container", { key: 'a9bb14f355f4e52cc9a4cdc05397b435d35c077e', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: '67d13d787dea89295345365c32e6f7e7e71ecdf9', class: 'field-set', slot: "content" }, index.h("ls-field-content", { key: '4dd6d26220a8d444b3dabfdfa4e99c4e3e1c5b4e', dataItem: this.dataItem, showValidationTypes: false })), index.h("div", { key: '71083db9efa2ac58168775e65a8595a9aefdd213', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: '23d97ecb94e968f25c6ec207f6d50ca3b1e3324f', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: 'a4246817c30d67485924df7a08b38db179ba48d9', dataItem: this.dataItem })), index.h("div", { key: '5cdfe903dcc4fdf0f567c173ad149d7b9bfb5a98', class: 'field-set', slot: "placement" }, index.h("ls-field-placement", { key: 'e97fb3893639fd21003f609c3b0e386f24798fb7', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: '5333acaaeda3b4456d89cb679423bedcdf92300e', dataItem: this.dataItem })));
26241
+ return (index.h(index.Host, { key: '58852594bb3b81be39ac455c58ad22ed4aff8f10' }, index.h("ls-field-properties-container", { key: '062f48e72aa57d8a30fb4df5c857adb94f76694b', tabs: ['content', 'placement', 'dimensions'] }, index.h("div", { key: '904551e8bf73d2a649ce03da5b9f379fd61b851a', class: 'field-set', slot: "content" }, index.h("ls-field-content", { key: 'f8a07c991e91dbbd3d7317fb95cca70ea33c98b6', dataItem: this.dataItem }), index.h("ls-field-properties-advanced", { key: '54a68bba7ceb23cbf1b934f91161edc69af8ef3d', dataItem: this.dataItem })), index.h("div", { key: 'e9ad36107e86cab3ea207714591b5be3189f11f9', class: 'field-set', slot: "dimensions" }, index.h("ls-field-dimensions", { key: '8356a632e1955f8d8eed05193874b22f9a7f5ce3', dataItem: this.dataItem })), index.h("div", { key: '9157aee2cf33e806cf90aede56a599df8b1481a7', class: 'field-set', slot: "placement" }, index.h("ls-field-placement", { key: '6040dbecb1683bbe32479f6419852ef700f7925d', dataItem: this.dataItem }))), index.h("ls-field-footer", { key: '1b07b81900e3465fcba8bbaec3306a811b0acd4a', dataItem: this.dataItem })));
26176
26242
  }
26177
26243
  };
26178
26244
  LsFieldPropertiesText.style = lsFieldPropertiesTextCss;
@@ -26199,7 +26265,7 @@ const LsFieldSize = class {
26199
26265
  this.update.emit(diffs);
26200
26266
  }
26201
26267
  render() {
26202
- return (index.h(index.Host, { key: '862f0420ef9ae449e83c6e7ff6e9f2ef87f36c8e' }, index.h("div", { key: '1c2c42c305b627835d8610dca1f3a798971028af', class: 'ls-field-properties-section' }, index.h("div", { key: '1e0aa447540ba5eacc41762c75d0d92b58be243f', class: 'ls-field-properties-section-text' }, index.h("p", { key: '2a83adeef17fee5134866ce2a5ef82ed9200abb5', class: 'ls-field-properties-section-title' }, "Scale and Resize"), index.h("p", { key: 'ac3c284202db510ad12f41844fea087da909278c', class: 'ls-field-properties-section-description' }, "Multi-select fields and match their dimensions")), index.h("div", { key: 'a92b18b76ca3d0f084dbaea82da04aa8bf61dac4', class: 'button-group' }, index.h("button", { key: '6fd56132acd84d25506fcef42c8a190533edd98e', onClick: () => this.alter({ width: this.dataItem[0].width, height: this.dataItem[0].height }), "aria-label": "Make selected fields the same height and width as the first selected field.", "data-tooltip-id": "le-tooltip", "data-tooltip-content": "Make selected fields the same height and width as the first selected field.", "data-tooltip-place": "top" }, index.h("ls-icon", { key: '088d3221e5e94ebdb583c6e1cc323683e25f7708', name: "field-scale" })), index.h("button", { key: '96875b70c34b39f1085c02b0b201d0bd2fe2debf', "aria-label": "Make selected fields the same width as the first selected field.", onClick: () => this.alter({ width: this.dataItem[0].width }), "data-tooltip-id": "le-tooltip", "data-tooltip-content": "Make selected fields the same width as the first selected field.", "data-tooltip-place": "top" }, index.h("ls-icon", { key: '78771f6321505f59eb14a4a4815e6069b11c220a', name: "field-match-width" })), index.h("button", { key: 'aa726608ce7593a5c5632e95859d8d84284ec83c', onClick: () => this.alter({ height: this.dataItem[0].height }), "aria-label": "Make selected fields the same height as the first selected field.", "data-tooltip-id": "le-tooltip", "data-tooltip-content": "Make selected fields the same height as the first selected field.", "data-tooltip-place": "top" }, index.h("ls-icon", { key: '8eed3ca7dac99543473df6f4274dba0868408341', name: "field-match-height" })))), index.h("slot", { key: '3e00627dfa861729846e8be72871a3c0bc102dbf' })));
26268
+ return (index.h(index.Host, { key: 'c14bef2bdf008df4b0e5ff64d283f55baa9275bd' }, index.h("div", { key: '660df296da3917e989be89fa019d89a828ed71a5', class: 'ls-field-properties-section' }, index.h("div", { key: 'da0b2e16fc684b2338537788c34f7bd2294efd32', class: 'ls-field-properties-section-text' }, index.h("p", { key: 'b8b854c5d683aae0a115c9c4321aaff89b7b3ef8', class: 'ls-field-properties-section-title' }, "Scale and Resize"), index.h("p", { key: '1d251db8ca7deba828de09736b32dac64084163d', class: 'ls-field-properties-section-description' }, "Multi-select fields and match their dimensions")), index.h("div", { key: '54832e47953a58f57c532b1d9ea9eb43c1650dbd', class: 'button-group' }, index.h("button", { key: 'df31f31e66ff576064e437a6b4ae4fcc5bcac6a8', onClick: () => this.alter({ width: this.dataItem[0].width, height: this.dataItem[0].height }), "aria-label": "Make selected fields the same height and width as the first selected field.", "data-tooltip-id": "le-tooltip", "data-tooltip-content": "Make selected fields the same height and width as the first selected field.", "data-tooltip-place": "top" }, index.h("ls-icon", { key: 'bd0d751d84b06fed37478ebaa40c3e8d31e803d1', name: "field-scale" })), index.h("button", { key: '6f7e5aec604a303f798bbb047f815cfe132bb31e', "aria-label": "Make selected fields the same width as the first selected field.", onClick: () => this.alter({ width: this.dataItem[0].width }), "data-tooltip-id": "le-tooltip", "data-tooltip-content": "Make selected fields the same width as the first selected field.", "data-tooltip-place": "top" }, index.h("ls-icon", { key: '2ba81548c5cd9b76c75bf25404f30d764323d021', name: "field-match-width" })), index.h("button", { key: 'a933306a2ced6b25378556631ca63a754b8694c6', onClick: () => this.alter({ height: this.dataItem[0].height }), "aria-label": "Make selected fields the same height as the first selected field.", "data-tooltip-id": "le-tooltip", "data-tooltip-content": "Make selected fields the same height as the first selected field.", "data-tooltip-place": "top" }, index.h("ls-icon", { key: 'dad3e8be3be3fe2681c9abc550f2d608d73a044f', name: "field-match-height" })))), index.h("slot", { key: 'a4ecdfe1a093ffe70e37ff21df9e1cc826a38bb7' })));
26203
26269
  }
26204
26270
  };
26205
26271
  LsFieldSize.style = lsFieldSizeCss;
@@ -26234,14 +26300,14 @@ const LsFieldTypeDisplay = class {
26234
26300
  fieldType = 'signature';
26235
26301
  render() {
26236
26302
  const color = defaultRolePalette[this.assignee % 100];
26237
- return (index.h(index.Host, { key: 'e82a282e21c93fd9dfb1ddc39ba8f58024beb922', class: 'ls-field-type-wrapper', style: {
26303
+ return (index.h(index.Host, { key: '874c6de79f2aa0f1b11a78d9ee996d2f2f8862d5', class: 'ls-field-type-wrapper', style: {
26238
26304
  border: `1px dashed ${color.s30}`,
26239
26305
  background: color.s10,
26240
- } }, index.h("div", { key: 'ce3fb362a6573632918b8a82df5eb629e435b5a0', class: 'ls-field-type-inner' }, index.h("div", { key: '6bb212d74026e7dca3815c940d1205781635acf1', class: 'ls-field-type-icon', style: {
26306
+ } }, index.h("div", { key: '1e504c8c0b0b4a7e09824c1c3234e70f8df4fded', class: 'ls-field-type-inner' }, index.h("div", { key: '1c1a30b7cb8978c31201eacd28d7e856281d23cc', class: 'ls-field-type-icon', style: {
26241
26307
  border: `1px solid ${color.s60}`,
26242
26308
  color: color.s60,
26243
26309
  background: color.s10,
26244
- } }, index.h("ls-icon", { key: '96eb74c4bcc2917b0ec99d6902e7e73c945f68af', name: getFieldIcon(this.fieldType), size: "20" })), index.h("p", { key: 'dcc51f0b64af0acd1210a93d7bae83f17a72ac65', class: 'ls-field-type-name' }, getFieldLabel(this.fieldType)))));
26310
+ } }, index.h("ls-icon", { key: 'bcb81904254225e7c786209da4b51a1cf7dab829', name: getFieldIcon(this.fieldType), size: "20" })), index.h("p", { key: '5d5b5ad50597d2adf9b5c523147b17708a75920a', class: 'ls-field-type-name' }, getFieldLabel(this.fieldType)))));
26245
26311
  }
26246
26312
  };
26247
26313
  LsFieldTypeDisplay.style = lsFieldTypeDisplayCss;
@@ -26251,6 +26317,7 @@ const lsFormfieldCss = "* {\n box-sizing: border-box;\n margin: 0;\n}\n\n.form
26251
26317
  const LsFormfield = class {
26252
26318
  constructor(hostRef) {
26253
26319
  index.registerInstance(this, hostRef);
26320
+ this.valueChange = index.createEvent(this, "valueChange");
26254
26321
  }
26255
26322
  name;
26256
26323
  fieldId;
@@ -26275,24 +26342,25 @@ const LsFormfield = class {
26275
26342
  buttonIcon;
26276
26343
  labelIcon;
26277
26344
  fieldIcon;
26345
+ valueChange;
26346
+ changeHandler(value) {
26347
+ this.valueChange.emit(value);
26348
+ }
26278
26349
  _value;
26279
26350
  valueWatcher(newValue) {
26280
26351
  this._value = newValue;
26352
+ console.log(newValue);
26281
26353
  }
26282
26354
  componentWillLoad() {
26283
26355
  this.valueWatcher(this?.value?.toString());
26284
26356
  }
26285
- handleChange = (event) => {
26286
- const target = event.target;
26287
- this.value = target.value;
26288
- };
26289
26357
  render() {
26290
26358
  const { name, fieldId, label, as, value, placeholder, descriptionText, errorText, aria, infoTooltipText, disabled, extraLabel, valid, dirty, count, countMax, buttonClick, buttonIcon, fieldIcon, labelIcon, } = this;
26291
26359
  const countClass = value && value.toString().length > countMax ? 'formfield-count-error' : 'formfield-count';
26292
- return (index.h("host", { key: 'ff9143c9ff55a0d9c54b907418ddcfcde32ba9a6', class: "formfield-host" }, label?.length > 1 || extraLabel !== 'none' && (index.h("div", { key: '1f64d8ccdb229c7ac52934256347886a7eb0573d', class: "formfield-top-elements" }, index.h("div", { key: 'aa8378c4c1471f51e2477305353da7e507b9676a', class: "formfield-left-side" }, labelIcon && index.h("ls-icon", { key: '6fad5514e17b6e1cabae96ea63d790cbce35c1e5', name: labelIcon }), index.h("label", { key: '6cb123c9020f73c5907240a118bcab2a61432a17', htmlFor: name, class: "formfield-label" }, label), infoTooltipText && index.h("ls-icon", { key: '3af203f9be91f333d23af4a2d4ddb7db51ce7b12', name: 'information-circle' })), extraLabel === 'optional' ? (index.h("ls-label", { text: "Optional", colour: "gray", type: "low" })) : extraLabel === 'required' ? (index.h("ls-label", { text: "Required", colour: "gray", type: "low" })) : (''))), as === 'text' ? (index.h("ls-text-input", { id: fieldId, name: name, value: value?.toString(), countMax: countMax, placeholder: placeholder, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon, onInput: (event) => this.handleChange(event) })) : as === 'select' ? (index.h("ls-select-input", { id: name, name: name, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon }, index.h("slot", null))) : as === 'radio' ? (index.h("ls-radio-input", { radioId: label, label: value?.toString(), icon: fieldIcon, name: name, disabled: disabled })) : as === 'textarea' ? (index.h("ls-textarea-input", { id: name, name: name, value: value?.toString(), countMax: countMax, placeholder: placeholder, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon })) : as === 'password' ? (index.h("ls-text-input", { type: "password", id: name, name: name, value: value?.toString(), countMax: countMax, placeholder: placeholder, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon })) : as === 'displayonly' ? (index.h("ls-text-input", { type: "displayonly", id: name, name: name, value: value?.toString(), countMax: countMax, placeholder: placeholder, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon })) : as === 'number' ? (index.h("ls-number-input", { type: "ls", id: name, name: name, value: Number(value), countMax: countMax, placeholder: placeholder, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon })) : (index.h("p", null, "placeholder")), errorText ||
26360
+ return (index.h("host", { key: 'daaac1d8b3f3a180d2f69a97b12a614365997663', class: "formfield-host" }, label?.length > 1 || extraLabel !== 'none' && (index.h("div", { key: '7abc0a522b55d8aa3fd45d6f9e597e41d1cc56cc', class: "formfield-top-elements" }, index.h("div", { key: '11445bd1bebbd6c3cc0a18cd7248fb8d5a532ca9', class: "formfield-left-side" }, labelIcon && index.h("ls-icon", { key: '3bb504fd411e441bf781bbd14b641175b8cb8c45', name: labelIcon }), index.h("label", { key: 'be97a1f7f942fdf6311f2e6eb4a6fe72cd8a5c4c', htmlFor: name, class: "formfield-label" }, label), infoTooltipText && index.h("ls-icon", { key: 'c4baa9c424af848fcc3258633d1cf340a51df004', name: 'information-circle' })), extraLabel === 'optional' ? (index.h("ls-label", { text: "Optional", colour: "gray", type: "low" })) : extraLabel === 'required' ? (index.h("ls-label", { text: "Required", colour: "gray", type: "low" })) : (''))), as === 'text' ? (index.h("ls-text-input", { id: fieldId, name: name, value: value?.toString(), countMax: countMax, placeholder: placeholder, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon, onValueChange: (e) => { this.changeHandler(e.detail); } })) : as === 'select' ? (index.h("ls-select-input", { id: name, name: name, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon }, index.h("slot", null))) : as === 'radio' ? (index.h("ls-radio-input", { radioId: label, label: value?.toString(), icon: fieldIcon, name: name, disabled: disabled })) : as === 'textarea' ? (index.h("ls-textarea-input", { id: name, name: name, value: value?.toString(), countMax: countMax, placeholder: placeholder, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon })) : as === 'password' ? (index.h("ls-text-input", { type: "password", id: name, name: name, value: value?.toString(), countMax: countMax, placeholder: placeholder, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon })) : as === 'displayonly' ? (index.h("ls-text-input", { type: "displayonly", id: name, name: name, value: value?.toString(), countMax: countMax, placeholder: placeholder, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon })) : as === 'number' ? (index.h("ls-number-input", { type: "ls", id: name, name: name, value: Number(value), countMax: countMax, placeholder: placeholder, "aria-label": aria, required: extraLabel === 'required', disabled: disabled, valid: valid, dirty: dirty, buttonIcon: buttonIcon, buttonClick: buttonClick, fieldIcon: fieldIcon })) : (index.h("p", null, "placeholder")), errorText ||
26293
26361
  count ||
26294
26362
  countMax ||
26295
- (descriptionText && (index.h("div", { key: '1e741b4f86993b9a5ff39e4dd8ad63fd0a0d2c31', class: "formfield-bottom-elements" }, errorText && !valid ? index.h("p", { class: "formfield-error-text" }, errorText) : descriptionText ? index.h("p", { class: "formfield-description-text" }, descriptionText) : '', count && (index.h("div", { key: '9c5e92c28ffaf296bc4ef62c55436e8868c7e3c9', class: "formfield-count-container" }, index.h("p", { key: '502323a7464aafde181a48310104259aadc64e43', class: countClass }, value?.toString()?.length), countMax > 0 && (index.h("div", { key: '59022e4179b8129404efc8baee45f5ca0180be38', class: countClass }, index.h("p", { key: 'b02345f0585ce5e31d9e80f0b709561b92197912' }, "/"), index.h("p", { key: '63167ca8234f605f189a9a59457b9afc459916b0' }, countMax))))))))));
26363
+ (descriptionText && (index.h("div", { key: '4a770018d94c2b2729f59358f9e7365f033432f1', class: "formfield-bottom-elements" }, errorText && !valid ? index.h("p", { class: "formfield-error-text" }, errorText) : descriptionText ? index.h("p", { class: "formfield-description-text" }, descriptionText) : '', count && (index.h("div", { key: '1d269de287a492fc8b5cc95cd6ebcb3c460dc818', class: "formfield-count-container" }, index.h("p", { key: '07155f4d0aa0e14d7b6aee7a2a30f66bc0b5e753', class: countClass }, value?.toString()?.length), countMax > 0 && (index.h("div", { key: 'a88c4244692d23c99140840ce0fc3b4e79650a2c', class: countClass }, index.h("p", { key: 'e12bd7d3b27a0c0e1298bd680bbac47be9951d56' }, "/"), index.h("p", { key: '64b75dc2f476e1755bcb6e8e7623146071134437' }, countMax))))))))));
26296
26364
  }
26297
26365
  static get watchers() { return {
26298
26366
  "value": ["valueWatcher"]
@@ -33324,7 +33392,7 @@ const LsIcon = class {
33324
33392
  console.warn('Icons in src/components/ls-icon/icons.ts should be identical to the enum type in src/types/Icon.ts. Please add all icons to the enum type.');
33325
33393
  }
33326
33394
  render() {
33327
- return (index.h("host", { key: '177c1f5af9a4758e8b16a17baee60608db9042ca' }, icons
33395
+ return (index.h("host", { key: 'd664f982e5c6680eff47d16f955715299f33e931' }, icons
33328
33396
  ?.filter((icon) => icon.name === this.name)
33329
33397
  ?.map((icon) => (index.h("div", { key: icon?.name, class: 'iconContainer', style: {
33330
33398
  height: `${this.size}px`,
@@ -33343,7 +33411,7 @@ const LsInputWrapper = class {
33343
33411
  leadingIcon;
33344
33412
  select = false;
33345
33413
  render() {
33346
- return (index.h(index.Host, { key: '163dc8952bcd636f3850b85d2641ee32b21128ff' }, index.h("ls-icon", { key: '35e576a72dc602d04130f93540055a7b7dd0d9fa', id: "selectLeadingIcon", name: this.leadingIcon }), this.select && index.h("ls-icon", { key: '6796c184d1b9314f439c8dbd66a9a15bff23b8ab', id: "selectorIcon", name: "selector" }), index.h("slot", { key: '96777f79a86b0e3b48d866eca49c537a6ba5068b' })));
33414
+ return (index.h(index.Host, { key: '6e88b53160b6e18d913292de6f9096dc1798e984' }, index.h("ls-icon", { key: 'be0553bf9dd52444fe3ebe2ac93b5077fe4fd138', id: "selectLeadingIcon", name: this.leadingIcon }), this.select && index.h("ls-icon", { key: '613e6fdaf85148bd351f1a44e2bd7b32c7608ebf', id: "selectorIcon", name: "selector" }), index.h("slot", { key: '1dfa83a8b9fd0330513b2327426db292f566fedb' })));
33347
33415
  }
33348
33416
  };
33349
33417
  LsInputWrapper.style = lsInputWrapperCss;
@@ -33389,12 +33457,12 @@ const LsNumberInput = class {
33389
33457
  ? 'invalid'
33390
33458
  : 'default', fieldIcon && 'icon-input', dirty && 'button-input', buttonIcon && 'button-input', buttonIcon && dirty && 'right-items-input');
33391
33459
  const plusMinusClass = clsx(disabled ? 'button-disabled' : 'button');
33392
- return (index.h("host", { key: 'ff9cc3281c5cba80fcd527e17764b1597a761c78', class: type === 'ls' && 'host' }, type === 'ls' && (index.h("button", { key: '89b3db166aeabe3ef2761d7d544245683f862d6d', class: plusMinusClass, onClick: () => handleMinus(), disabled: disabled }, index.h("ls-icon", { key: 'd9b0f65a3cc53e5ce5c91b0193ab1ed1239175c6', id: 'buttonIcon', name: 'minus-sm' }))), index.h("div", { key: 'd211443c992e66e7fb062d2b39af826cce4fa7fe', class: 'input-container' }, fieldIcon && (index.h("ls-icon", { key: '5acd214e541420781135d2797b8c1fe70be610a3', id: disabled ? 'fieldIconDisabled' : 'fieldIcon', name: fieldIcon })), index.h("input", { key: '0e8bc8c05640a488ea60a3cf0b40cc46e4e7a022', type: 'number', class: inputClass, id: name, name: name, value: value, placeholder: placeholder, "aria-label": aria, required: required, disabled: disabled, onInput: (event) => handleChange(event) }), index.h("div", { key: '4ee0060f6d161adf728604536db1337395c2ca6d', class: 'right-items' }, dirty && !disabled && (index.h("ls-icon", { key: '1077f2fe3b8c61a73ce7c7e8c6d0e9af980555c2', id: valid ? 'validIcon' : 'invalidIcon', name: valid ? 'check-circle' : 'exclamation-circle' })), buttonIcon && type !== 'ls' && (index.h("button", { key: '2e28b16c5874e8ca598e3780e8799869f31d0db7', class: 'button', onClick: buttonClick }, index.h("ls-icon", { key: '3174bdba320a93bdb6462381e8bd89640027c78c', id: 'buttonIcon', name: buttonIcon }))))), type === 'ls' && (index.h("button", { key: '0395c4d2bbd14b0bea870a2019dbaac32fceae92', class: plusMinusClass, onClick: handlePlus, disabled: disabled }, index.h("ls-icon", { key: '1b16aa5a73b5e702b20f9f66c026f87dbe0d1226', id: 'buttonIcon', name: 'plus-sm' })))));
33460
+ return (index.h("host", { key: 'e89fbfda5732a9f5b04234e4640cfb03cef7d49d', class: type === 'ls' && 'host' }, type === 'ls' && (index.h("button", { key: '17906e0db50d93180c9482aaec28ea18dec49587', class: plusMinusClass, onClick: () => handleMinus(), disabled: disabled }, index.h("ls-icon", { key: '6935646d9d6a0cc6fe7f3b53f07125b3f6365979', id: 'buttonIcon', name: 'minus-sm' }))), index.h("div", { key: 'e49d192db60f5d0bce33da1db22e331d9651ac08', class: 'input-container' }, fieldIcon && (index.h("ls-icon", { key: 'a25f5885d2dd42308ccee52a63f8002f8c2345c3', id: disabled ? 'fieldIconDisabled' : 'fieldIcon', name: fieldIcon })), index.h("input", { key: '4e59e3586f248a5e72d8efe1a423b74cd6271409', type: 'number', class: inputClass, id: name, name: name, value: value, placeholder: placeholder, "aria-label": aria, required: required, disabled: disabled, onInput: (event) => handleChange(event) }), index.h("div", { key: 'f4958fbf9e0de963317734ab7d943fe17ac993f5', class: 'right-items' }, dirty && !disabled && (index.h("ls-icon", { key: '81c512051f8f187742ee2ab8f13dc51a13df3807', id: valid ? 'validIcon' : 'invalidIcon', name: valid ? 'check-circle' : 'exclamation-circle' })), buttonIcon && type !== 'ls' && (index.h("button", { key: 'f660f1415755667140b8420c628602973045ba66', class: 'button', onClick: buttonClick }, index.h("ls-icon", { key: '9c4f16f97893e37f3c9a31dc46011ca22a0c0b1c', id: 'buttonIcon', name: buttonIcon }))))), type === 'ls' && (index.h("button", { key: 'b06543e661a5fc727fc2839fd01829be562a1011', class: plusMinusClass, onClick: handlePlus, disabled: disabled }, index.h("ls-icon", { key: '0d232807d5304196ac7dca314435fd1dadf63116', id: 'buttonIcon', name: 'plus-sm' })))));
33393
33461
  }
33394
33462
  };
33395
33463
  LsNumberInput.style = lsNumberInputCss;
33396
33464
 
33397
- const lsParticipantCardCss = ":host{display:block}*{box-sizing:border-box;margin:0}.participant-card{display:flex;padding:0.625rem;flex-direction:column;align-items:flex-start;gap:0.5rem;align-self:stretch;border-radius:1rem}.participant-card-inner{width:100%;display:flex;flex-direction:column;gap:0.5rem}.hidden{visibility:hidden;display:none}.role-label{display:flex;padding:0.125rem 0.375rem;justify-content:center;align-items:center;gap:0.25rem;border-radius:0.25rem;font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;}.innerButton{margin:0px;padding:0px;max-height:1.25rem !important;max-width:1.25rem !important;background-color:transparent;border:none;cursor:pointer;color:var(--default-button-colour)}.innerButton:hover{color:var(--hover-button-colour)}.participant-card-top-items{display:flex;width:100%;justify-content:space-between;align-items:center}.button-set{display:flex;gap:0.125rem}.participant-text-description{font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;}.participant-text-type{font-style:normal;font-weight:400;line-height:1.25rem;}.titleButton{width:100%;text-align:left;background-color:transparent;border:none}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:36px;width:100%}.input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}";
33465
+ const lsParticipantCardCss = ":host{display:block}*{box-sizing:border-box;margin:0}.participant-card{display:flex;padding:0.625rem;flex-direction:column;align-items:flex-start;gap:0.5rem;align-self:stretch;border-radius:1rem}.participant-card-inner{width:100%;display:flex;flex-direction:column;gap:0.5rem}.hidden{visibility:hidden;display:none}.form-button-set{display:flex;gap:0.5rem}.role-label{display:flex;padding:0.125rem 0.5rem;justify-content:center;align-items:center;gap:0.25rem;border-radius:0.5rem;font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;}.role-label.fields{border-radius:1rem;margin-top:0.5rem}.innerButton{margin:0px;padding:0px;max-height:1.25rem !important;max-width:1.25rem !important;background-color:transparent;border:none;cursor:pointer;color:var(--default-button-colour)}.innerButton:hover{color:var(--hover-button-colour)}.participant-card-top-items{display:flex;width:100%;justify-content:space-between;align-items:center}.button-set{display:flex;gap:0.125rem}.participant-text-description{font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;}.participant-text-type{font-style:normal;font-weight:400;line-height:1.25rem;}.titleButton{width:100%;text-align:left;background-color:transparent;border:none}.full-width{width:100%}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:36px;width:100%}.input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}button.secondary{border:1px solid var(--gray-50, #c8c9cc);background:var(--white, #fff);color:var(--gray-90, #5e6066);box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1)}button.secondary:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}";
33398
33466
 
33399
33467
  const LsParticipantCard = class {
33400
33468
  constructor(hostRef) {
@@ -33417,38 +33485,40 @@ const LsParticipantCard = class {
33417
33485
  }
33418
33486
  swapHandler(role1, role2) {
33419
33487
  this.update.emit([{ action: 'swap', data: role1, data2: role2 }]);
33488
+ this.mutate.emit([{ action: 'swap', data: role1, data2: role2 }]);
33420
33489
  }
33421
33490
  render() {
33422
- return (index.h(index.Host, { key: '6c04fbc73a0682f73ebe37b7cae2892d002e494d' }, index.h("div", { key: 'd131e463096f408abf00048b635cebd57176c9fd', class: "participant-card", onClick: () => {
33491
+ const participantFields = this.template.elementConnection.templateElements.filter(f => f.signer === this.signer.signerIndex) || [];
33492
+ return (index.h(index.Host, { key: '300399f367f4312a1a41e4042538358025bd9d32' }, index.h("div", { key: '5f693039b0dd611c617682a94ad9b490e47d4595', class: "participant-card", onClick: () => {
33423
33493
  this.selectedHandler(this.signer);
33424
33494
  }, style: {
33425
33495
  background: defaultRolePalette[this.signer?.signerIndex % 100].s10,
33426
33496
  border: `1px solid ${defaultRolePalette[this.signer?.signerIndex % 100].s60}`,
33427
33497
  marginTop: this.signer.signerIndex > 100 && '-0.813rem',
33428
- }, onMouseEnter: e => e.currentTarget.querySelector('.button-set')?.classList.remove('hidden'), onMouseLeave: e => e.currentTarget.querySelector('.button-set')?.classList.add('hidden') }, index.h("div", { key: 'ec60ae781e1f358c3667e246a6fbf14cf685453b', class: 'participant-card-inner' }, index.h("div", { key: '9846a86361a0b5f23cfa43b7e3e292a3d427f82b', class: 'participant-card-top-items' }, index.h("div", { key: '4c85875538786fb8603c332e917be496199feda9', class: 'role-label', style: {
33498
+ }, onMouseEnter: e => e.currentTarget.querySelector('.button-set')?.classList.remove('hidden'), onMouseLeave: e => e.currentTarget.querySelector('.button-set')?.classList.add('hidden') }, index.h("div", { key: 'e0091f70bd9dd2d992b7b929930326af9fc07e8d', class: 'participant-card-inner' }, index.h("div", { key: 'e954256599d9189b68b50b6b75bb62a1583a5340', class: 'participant-card-top-items' }, index.h("div", { key: '22ab590f8670f502e4a38d757dd9b409ed19f450', class: 'role-label', style: {
33429
33499
  background: defaultRolePalette[this.signer?.signerIndex % 100].s20,
33430
33500
  color: defaultRolePalette[this.signer?.signerIndex % 100].s90,
33431
- } }, index.h("ls-icon", { key: 'e1859e93c7f4da493f42c886e5ca1bd957f35a79', name: this.signer?.signerIndex > 100 ? 'eye' : 'signature' }), 'Participant ' + (this.signer?.signerIndex || '')), index.h("div", { key: 'ee4104395bd2d0da3722fccdaf61f22f95d3e031', class: 'button-set hidden' }, this.index > 0 && (index.h("div", { key: '479c833898ecf8816ac1478c259d8a8c9a8352fa', class: "innerButton", onClick: () => {
33501
+ } }, index.h("ls-icon", { key: '0e314f53b07b487d7d6b39c4143bbb9d7ae98b80', name: this.signer?.signerIndex > 100 ? 'eye' : 'signature' }), 'Participant ' + (this.signer?.signerIndex || '')), !this.editable && (index.h("div", { key: '119b5fbaa16a0a9268ca77a277b108894b7e71cf', class: 'button-set hidden' }, this.index > 0 && (index.h("div", { key: '6b241a08436d20678b79daa30c49636bd3c17800', class: "innerButton", onClick: () => {
33432
33502
  this.swapHandler(this.signer, this.template.roles[this.index - 1]);
33433
33503
  }, style: {
33434
33504
  '--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,
33435
33505
  '--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,
33436
- } }, index.h("ls-icon", { key: '2d7f3c8e0da80bd565db60c6b2813927270af9aa', name: "arrow-up", size: "18" }))), this.signer.signerIndex !== this.template.roles.length && (index.h("div", { key: '8c1f5f115dbf50a02762d87c5f3f7014ed04ffea', class: "innerButton", onClick: () => {
33506
+ } }, index.h("ls-icon", { key: '59e635917341faa1442ab316a727764dac4282e9', name: "arrow-up", size: "18" }))), this.signer.signerIndex !== this.template.roles.length && (index.h("div", { key: '4346610f1ef79bee775b9e6b7d28434d8f522615', class: "innerButton", onClick: () => {
33437
33507
  this.swapHandler(this.signer, this.template.roles[this.index + 1]);
33438
33508
  }, style: {
33439
33509
  '--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,
33440
33510
  '--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,
33441
- } }, index.h("ls-icon", { key: 'b34cacf61d21b7f452a5811cbb1cfa56146f1719', name: "arrow-down", size: "18" }))), index.h("div", { key: 'ab45089498c182283021f8d6ec03be092b4d96b9', class: "innerButton", onClick: () => {
33511
+ } }, index.h("ls-icon", { key: '0d85a63b0d8441ca06ded1eda695237078597810', name: "arrow-down", size: "18" }))), index.h("div", { key: 'd14f861436b44bc43f2f46f804c785425de4cb8b', class: "innerButton", onClick: () => {
33442
33512
  this.editable = true;
33443
33513
  }, style: {
33444
33514
  '--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,
33445
33515
  '--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,
33446
- } }, index.h("ls-icon", { key: 'e4e00095c20c482a180a70df1fda68b08acfcff7', name: "pencil-alt", size: "18" })), index.h("div", { key: '6ebdfbf08115018173a48143bfe946bb6b7f73a7', class: "innerButton", onClick: () => {
33516
+ } }, index.h("ls-icon", { key: '4f4dce9110dcab1f23439427bc4112acee768584', name: "pencil-alt", size: "18" })), index.h("div", { key: 'cc9d0a0ae6f7d1449d7f7d30055e1b204021ebda', class: "innerButton", onClick: () => {
33447
33517
  this.deleteHandler(this.signer);
33448
33518
  }, style: {
33449
33519
  '--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,
33450
33520
  '--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,
33451
- } }, index.h("ls-icon", { key: '6167a5a30eedd0a7edf968c9171d0029ab3ea6ac', name: "trash", size: "18" })))), this.editable ? (index.h("form", { class: 'participant-card-inner', onSubmit: e => {
33521
+ } }, index.h("ls-icon", { key: '648d735c2c4647082db6e2a1a1596034963c6b25', name: "trash", size: "18" }))))), this.editable ? (index.h("form", { class: 'participant-card-inner', onSubmit: e => {
33452
33522
  e.preventDefault();
33453
33523
  this.update.emit([
33454
33524
  {
@@ -33461,12 +33531,15 @@ const LsParticipantCard = class {
33461
33531
  },
33462
33532
  ]);
33463
33533
  this.editable = false;
33464
- } }, index.h("ls-input-wrapper", { select: true, leadingIcon: this.signer?.roleType === 'APPROVER' ? 'eye' : 'signature' }, index.h("select", { name: "roleType", id: "role-type", class: 'has-leading-icon' }, index.h("option", { value: "APPROVER", selected: this.signer?.roleType === 'APPROVER' }, "Approver"), index.h("option", { value: "SIGNER", selected: this.signer?.roleType === 'SIGNER' }, "Signer"))), index.h("input", { type: "text", id: "participant-description", name: "participantDescription", placeholder: "Description, eg. Tenant 1, Agent", defaultValue: this.signer.name }), index.h("button", { type: "submit", class: "submit-btn" }, "Save"))) : (index.h("div", { class: 'participant-card-text' }, index.h("p", { class: "participant-text-description", style: {
33534
+ } }, index.h("ls-input-wrapper", { select: true, leadingIcon: this.signer?.roleType === 'APPROVER' ? 'eye' : 'signature' }, index.h("select", { name: "roleType", id: "role-type", class: 'has-leading-icon' }, index.h("option", { value: "APPROVER", selected: this.signer?.roleType === 'APPROVER' }, "Approver"), index.h("option", { value: "SIGNER", selected: this.signer?.roleType === 'SIGNER' }, "Signer"))), index.h("input", { type: "text", id: "participant-description", name: "participantDescription", placeholder: "Description, eg. Tenant 1, Agent", defaultValue: this.signer.name }), index.h("div", { class: 'form-button-set' }, index.h("button", { type: "cancel", class: "secondary full-width" }, "Cancel"), index.h("button", { type: "submit", class: "full-width" }, "Save")))) : (index.h("div", { class: 'participant-card-text' }, index.h("p", { class: "participant-text-description", style: {
33465
33535
  color: defaultRolePalette[this.signer?.signerIndex % 100].s100,
33466
33536
  } }, this.signer.name || `${this.signer.signerIndex > 100 ? 'Witness' : 'Signer'} ${this.signer.signerIndex + 1}`), index.h("p", { class: "participant-text-type", style: {
33467
33537
  color: defaultRolePalette[this.signer?.signerIndex % 100].s80,
33468
33538
  textTransform: 'capitalize',
33469
- } }, this.signer.roleType.toLowerCase()))))), index.h("slot", { key: 'f9a151fc2dc910b6be691ff1a02d9c773dfa631e' })));
33539
+ } }, this.signer.roleType.toLowerCase()), this.signer?.roleType !== 'APPROVER' && (index.h("div", { class: 'role-label fields', style: {
33540
+ background: participantFields.length === 0 ? defaultRolePalette[this.signer?.signerIndex % 100].s60 : defaultRolePalette[this.signer?.signerIndex % 100].s20,
33541
+ color: participantFields.length === 0 ? 'white' : defaultRolePalette[this.signer?.signerIndex % 100].s90,
33542
+ } }, participantFields.length === 0 && index.h("ls-icon", { name: "exclamation-circle", size: "16", style: { marginRight: '0.125rem' } }), participantFields.length === 0 ? 'Signature Required' : `${participantFields.length} ${participantFields.length === 1 ? 'Field' : 'Fields'}`)))))), index.h("slot", { key: 'dda0b0195b5058a91e9249bc3f251f6da598973f' })));
33470
33543
  }
33471
33544
  };
33472
33545
  LsParticipantCard.style = lsParticipantCardCss;
@@ -33522,10 +33595,10 @@ const LsParticipantManager = class {
33522
33595
  this.mutate.emit(data);
33523
33596
  }
33524
33597
  render() {
33525
- return (index.h(index.Host, { key: '2f94ec45b0e77280ff2a93510f5252c52148b2ec' }, index.h("div", { key: 'be0334a702286fa8247d0da989bacf1eb70c588c', class: "ls-editor-infobox" }, index.h("h2", { key: '2c43847f2e70eda803dcae69ccd0ae6e6bcda5e7', class: "toolbox-section-title" }, "Participants"), index.h("p", { key: '76114f1b7e003a0273e3d8885992605405d0e45c', class: "toolbox-section-description" }, "Select and Click to place Signature fields where you\u2019d like on the Document.")), index.h("div", { key: 'e0f7ffc118ce39e1b7ff1f921c3273ea6d24f691', class: "participant-list" }, this.template &&
33598
+ return (index.h(index.Host, { key: '5b11da563144f62fb59e2821bcd2fd57896f7e68' }, index.h("div", { key: 'ba4d1443c0edc91eb123d3a225c5e1f9e49df79e', class: "ls-editor-infobox" }, index.h("h2", { key: '11eec7e5c1db6cefd3bdd87c7d5444f06424afc7', class: "toolbox-section-title" }, "Participants"), index.h("p", { key: '80c3e2ae3c60005ba34c7a5499e0b0c009b8585d', class: "toolbox-section-description" }, "Select and Click to place Signature fields where you\u2019d like on the Document.")), index.h("div", { key: '22d8aa202afc49c5fc10c85c283126b9fc557d9d', class: "participant-list" }, this.template &&
33526
33599
  this.template?.roles.map((r, index$1) => {
33527
33600
  return index.h("ls-participant-card", { signer: r, index: index$1, template: this.template });
33528
- })), index.h("div", { key: '279cab9721249459183f8a4550e7b49027899fad', class: 'add-participant-button' }, index.h("button", { key: 'd9c26c28c418f8a7b0b8bee17923df228f406c92', onClick: () => this.createHandler() }, index.h("ls-icon", { key: '0766ee1e4048850ba58980ae103980bce62abc32', name: "user-add", size: "20", color: "var(--gray-100, #45484D);" }), index.h("p", { key: 'c3d17275576d99825418970646871093a8f9d124' }, "Add Participant"))), index.h("slot", { key: '4cf0ad6fc3bba91f678ad6fe2d832a1c06d1a77c' })));
33601
+ })), index.h("div", { key: '40f05d87af9a9be58d4c0d67bbef14285a6315df', class: 'add-participant-button' }, index.h("button", { key: '15b8d0b2e3a6f12b39cd462fab6e9cd0c3b1d116', onClick: () => this.createHandler() }, index.h("ls-icon", { key: '7569e30b350228c6258722212624a32540231a86', name: "user-add", size: "20", color: "var(--gray-100, #45484D);" }), index.h("p", { key: '24501b424b7266ae689ac89954d8f0aea53d12b8' }, "Add Participant"))), index.h("slot", { key: 'ff03b8dbdb614019261cf5a4ae10b5f1863ca86f' })));
33529
33602
  }
33530
33603
  };
33531
33604
  LsParticipantManager.style = lsParticipantManagerCss;
@@ -33574,27 +33647,27 @@ const LsParticipantSelect = class {
33574
33647
  this.roleChange.emit(role.signerIndex);
33575
33648
  }
33576
33649
  render() {
33577
- return (index.h(index.Host, { key: 'abc30333f08008eb26a12c4da687bb65fd3ecf9e' }, index.h("div", { key: '5ff27c5c732f5c801e18a8a85d7344a875373e80', class: "dropdown" }, index.h("div", { key: 'a7ff163b9623c3270295bc6d43871f536eadd116', class: "dropdown-header", onClick: this.toggleDropdown }, index.h("svg", { key: 'feb11332e1189c7b1251046e949cbc3ea5bbee32', width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: 'c79f2da68976cfb2530d80e531d7de5dd4ce3f6c', d: "M4 0.5H6.5C8.433 0.5 10 2.067 10 4V6.5C10 8.433 8.433 10 6.5 10H4C2.067 10 0.5 8.433 0.5 6.5V4C0.5 2.067 2.067 0.5 4 0.5Z", fill: "#78A3FA", stroke: "#F7F8FA" }), index.h("path", { key: '09dd601caf5379d50b13b16dbe9ba0b5ccb71126', d: "M13.5 0.5H16C17.933 0.5 19.5 2.067 19.5 4V6.5C19.5 8.433 17.933 10 16 10H13.5C11.567 10 10 8.433 10 6.5V4C10 2.067 11.567 0.5 13.5 0.5Z", fill: "#46DBAA", stroke: "#F7F8FA" }), index.h("path", { key: 'c7ec8814c9d887d45e443c1f381bb683137bc6f6', d: "M4 10H6.5C8.433 10 10 11.567 10 13.5V16C10 17.933 8.433 19.5 6.5 19.5H4C2.067 19.5 0.5 17.933 0.5 16V13.5C0.5 11.567 2.067 10 4 10Z", fill: "#FAD232", stroke: "#F7F8FA" }), index.h("path", { key: 'cc574fac0148ab1fcefa6ce226263f744ef2c542', d: "M14.75 12.125V14.75M14.75 14.75V17.375M14.75 14.75H17.375M14.75 14.75L12.125 14.75", stroke: "#939599", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })), index.h("p", { key: 'da59733ddff6b363f82dee294e6fb24fee27c8f5', class: 'placing-fields-text' }, "Placing Fields for"), index.h("div", { key: 'c25b281b284cf0a19f3d28685660dd44b736ce41', class: 'selected-role-label', style: {
33650
+ return (index.h(index.Host, { key: 'c1d9fa3cdd06b43966a70c513d663c7c0c6b80b3' }, index.h("div", { key: '2d47dc0e8dc4df90904527efe2babccac04b0590', class: "dropdown" }, index.h("div", { key: '2ac6dee09d1b6f9a2f2e289029442a05f21a3cf2', class: "dropdown-header", onClick: this.toggleDropdown }, index.h("svg", { key: 'e3b392d0300805c61d82a0d9441fde5ceb6bea34', width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: 'b876273e38fbb82fd397b2d4eb8267a03e9ca651', d: "M4 0.5H6.5C8.433 0.5 10 2.067 10 4V6.5C10 8.433 8.433 10 6.5 10H4C2.067 10 0.5 8.433 0.5 6.5V4C0.5 2.067 2.067 0.5 4 0.5Z", fill: "#78A3FA", stroke: "#F7F8FA" }), index.h("path", { key: '08baf17ccfcfb091be185a48349f857d887864ae', d: "M13.5 0.5H16C17.933 0.5 19.5 2.067 19.5 4V6.5C19.5 8.433 17.933 10 16 10H13.5C11.567 10 10 8.433 10 6.5V4C10 2.067 11.567 0.5 13.5 0.5Z", fill: "#46DBAA", stroke: "#F7F8FA" }), index.h("path", { key: '362cba1256c05f712e5755f1b87902ef47e77387', d: "M4 10H6.5C8.433 10 10 11.567 10 13.5V16C10 17.933 8.433 19.5 6.5 19.5H4C2.067 19.5 0.5 17.933 0.5 16V13.5C0.5 11.567 2.067 10 4 10Z", fill: "#FAD232", stroke: "#F7F8FA" }), index.h("path", { key: '9a57ce6c4a2b4de7fc2a42b9c62ee5a3f8bf0ab2', d: "M14.75 12.125V14.75M14.75 14.75V17.375M14.75 14.75H17.375M14.75 14.75L12.125 14.75", stroke: "#939599", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })), index.h("p", { key: '5d333e210fe6667abcf2c4a86ee8d0821010c9e7', class: 'placing-fields-text' }, "Placing Fields for"), index.h("div", { key: 'e10cfbbef26dbaa3d0c5eb13152158490ff840e1', class: 'selected-role-label', style: {
33578
33651
  background: defaultRolePalette[this.selectedRole?.signerIndex % 100].s20,
33579
33652
  color: defaultRolePalette[this.selectedRole?.signerIndex % 100].s80,
33580
- } }, index.h("ls-icon", { key: '64fbdb1c37f83777a4cf0d9d80224cd3f3a3e514', size: "18", name: this.selectedRole?.roleType === 'SENDER'
33653
+ } }, index.h("ls-icon", { key: '82953c3e913a27ddbf2550104df21b296c68adc9', size: "18", name: this.selectedRole?.roleType === 'SENDER'
33581
33654
  ? 'user'
33582
33655
  : this.selectedRole?.roleType === 'APPROVER'
33583
33656
  ? 'check-circle'
33584
33657
  : this.selectedRole?.roleType === 'WITNESS'
33585
33658
  ? 'eye'
33586
33659
  : 'signature' }), this.selectedRole.name ||
33587
- (this.selectedRole.signerIndex > 100 ? `Participant ${this.selectedRole.signerIndex - 100} Witness` : `Participant ${this.selectedRole.signerIndex}`)), index.h("button", { key: '018d3ddcfcc802cb63ebcfb77a3d51cac6fb657e', class: 'tertiaryGrey expand-button', "aria-haspopup": "listbox", "aria-expanded": this.isOpen }, index.h("ls-icon", { key: 'b0c0fde73ae923d55a3c5f6d2107afa36d6e0c5c', name: "chevron-down" }))), this.isOpen && (index.h("div", { key: '18bd61e4a5b40938f61ac984e98abe5a33fb9bc2', class: "dropdown-list" }, index.h("div", { key: 'cd6d2c4f892211d9ed1c0d8650aa5bb6e4f59fe4', class: this.selectedRole?.signerIndex === 0 ? 'dropdown-item selected' : 'dropdown-item', style: {
33660
+ (this.selectedRole.signerIndex > 100 ? `Participant ${this.selectedRole.signerIndex - 100} Witness` : `Participant ${this.selectedRole.signerIndex}`)), index.h("button", { key: 'ab629516573aca57b8bb025172ff5994e3ef0104', class: 'tertiaryGrey expand-button', "aria-haspopup": "listbox", "aria-expanded": this.isOpen }, index.h("ls-icon", { key: '4bce05740c4bfbbd76c9375dc2a577ee124c1656', name: "chevron-down" }))), this.isOpen && (index.h("div", { key: 'abcb46c3b2ce920aa8c58424b5802d8e5d7075fd', class: "dropdown-list" }, index.h("div", { key: 'abf152359eb5c9932f6a61fc5cc3c423ef035953', class: this.selectedRole?.signerIndex === 0 ? 'dropdown-item selected' : 'dropdown-item', style: {
33588
33661
  '--background-selected': defaultRolePalette[0].s10,
33589
33662
  '--check-icon-selected': defaultRolePalette[0].s50,
33590
- }, onClick: () => this.selectRole({ signerIndex: 0, name: 'Sender', roleType: 'SENDER' }), onMouseEnter: e => e.currentTarget.querySelector('.check-icon')?.setAttribute('name', 'check-circle'), onMouseLeave: e => e.currentTarget.querySelector('.check-icon')?.setAttribute('name', this.selectedRole?.signerIndex !== 0 ? 'base-circle' : 'check-circle') }, index.h("div", { key: '36d24bae48e0ebb0ebf03bb9f27fbe88b89d8609', class: 'role-icon', style: {
33663
+ }, onClick: () => this.selectRole({ signerIndex: 0, name: 'Sender', roleType: 'SENDER' }), onMouseEnter: e => e.currentTarget.querySelector('.check-icon')?.setAttribute('name', 'check-circle'), onMouseLeave: e => e.currentTarget.querySelector('.check-icon')?.setAttribute('name', this.selectedRole?.signerIndex !== 0 ? 'base-circle' : 'check-circle') }, index.h("div", { key: 'bf13d5678ae3b7cf3abe8fb0de483038183af28f', class: 'role-icon', style: {
33591
33664
  background: defaultRolePalette[0].s50,
33592
33665
  color: defaultRolePalette[0].s80,
33593
- } }, index.h("ls-icon", { key: 'dc00b4a878dcd4984ca4f5ac84db64a33defbfc4', name: "user" })), index.h("div", { key: '3a20d11a0370bf19aa005fcb4a829ca2d1f92d13', class: 'role-text' }, index.h("p", { key: '8eae8a0458f55d9346db72d3bb67f69eba71a3b1', class: 'role-name', style: {
33666
+ } }, index.h("ls-icon", { key: '14151f994adad84005a49e825507588490005e4a', name: "user" })), index.h("div", { key: '44224772f8759fd551b86b2628ab8a0224944e35', class: 'role-text' }, index.h("p", { key: '414e8985272aa555f5946d50092a8750531d5a34', class: 'role-name', style: {
33594
33667
  '--role-name-selected': defaultRolePalette[0].s80,
33595
- } }, 'Sender'), index.h("p", { key: 'a9edba6663ed70da8f8a911da07bcfdac34b70d0', class: 'role-type', style: {
33668
+ } }, 'Sender'), index.h("p", { key: '6a4be2dcead24578e7ccbb95b5531fbbfed0c9b1', class: 'role-type', style: {
33596
33669
  '--role-type-selected': defaultRolePalette[0].s80,
33597
- } }, "You")), index.h("ls-icon", { key: '5045741835dd409408073c24ba6cc37c09b5957b', class: 'check-icon', name: this.selectedRole?.signerIndex === 0 ? 'check-circle' : 'base-circle', solid: this.selectedRole?.signerIndex === 0 })), this.roles.map(r => (index.h("div", { class: r.signerIndex === this.selectedRole?.signerIndex ? 'dropdown-item selected' : 'dropdown-item', style: {
33670
+ } }, "You")), index.h("ls-icon", { key: '228f6822f6ad462cd91cbeb367f5a77bd40dc7ce', class: 'check-icon', name: this.selectedRole?.signerIndex === 0 ? 'check-circle' : 'base-circle', solid: this.selectedRole?.signerIndex === 0 })), this.roles.map(r => (index.h("div", { class: r.signerIndex === this.selectedRole?.signerIndex ? 'dropdown-item selected' : 'dropdown-item', style: {
33598
33671
  '--background-selected': defaultRolePalette[r?.signerIndex % 100].s10,
33599
33672
  '--check-icon-selected': defaultRolePalette[r?.signerIndex % 100].s50,
33600
33673
  }, onClick: () => this.selectRole(r), onMouseEnter: e => e.currentTarget.querySelector('.check-icon')?.setAttribute('name', 'check-circle'), onMouseLeave: e => e.currentTarget
@@ -33606,7 +33679,7 @@ const LsParticipantSelect = class {
33606
33679
  '--role-name-selected': defaultRolePalette[r?.signerIndex % 100].s100,
33607
33680
  } }, r.name || (r.signerIndex > 100 ? `Participant ${r.signerIndex - 100} Witness` : `Participant ${r.signerIndex}`)), index.h("p", { class: 'role-type', style: {
33608
33681
  '--role-type-selected': defaultRolePalette[r?.signerIndex % 100].s80,
33609
- } }, r.roleType === 'WITNESS' ? 'Witness' : r.roleType === 'APPROVER' ? 'Approver' : 'Signer')), index.h("ls-icon", { class: 'check-icon', name: r.signerIndex === this.selectedRole?.signerIndex ? 'check-circle' : 'base-circle', solid: r.signerIndex === this.selectedRole?.signerIndex }))))))), index.h("slot", { key: '4defb862774f3be686aed9dbb722742b976fdc59' })));
33682
+ } }, r.roleType === 'WITNESS' ? 'Witness' : r.roleType === 'APPROVER' ? 'Approver' : 'Signer')), index.h("ls-icon", { class: 'check-icon', name: r.signerIndex === this.selectedRole?.signerIndex ? 'check-circle' : 'base-circle', solid: r.signerIndex === this.selectedRole?.signerIndex }))))))), index.h("slot", { key: 'd52aef3496df65cebdf608bde47b0b0584df8e4f' })));
33610
33683
  }
33611
33684
  };
33612
33685
  LsParticipantSelect.style = lsParticipantSelectCss;
@@ -33621,7 +33694,7 @@ const LsPropsSection = class {
33621
33694
  sectionDescription;
33622
33695
  row = false;
33623
33696
  render() {
33624
- return (index.h(index.Host, { key: '5993bc2e95d70e3625af9647964b601fbcc5e98e' }, index.h("div", { key: '56c7bd55b4e357752d32025ede162ae42ed545ab', class: this.row ? 'ls-field-properties-section row' : 'ls-field-properties-section' }, index.h("div", { key: 'a02514409e4ee6652b83d1264b2157db847bac73', class: 'ls-field-properties-section-text' }, index.h("p", { key: '1e56fcd1dfecfbe5545113754b8cf97b7e536c58', class: 'ls-field-properties-section-title' }, this.sectionTitle), this.sectionDescription && index.h("p", { key: 'af0a13f4e2f4cb99abd346aa8c547af8c5a4b6c9', class: 'ls-field-properties-section-description' }, this.sectionDescription)), index.h("slot", { key: 'bea116d371a1390573f7779cc8d6d8dbb3a7ce34' }))));
33697
+ return (index.h(index.Host, { key: '8af3f4adbeea425e8d3a38bf95fbf8ae8e337e57' }, index.h("div", { key: 'f80bab923d1607da243e9fbef8518c1621b0f6d8', class: this.row ? 'ls-field-properties-section row' : 'ls-field-properties-section' }, index.h("div", { key: '7d8d3d6336665525d6ec7f6b1ffbafcd34949710', class: 'ls-field-properties-section-text' }, index.h("p", { key: 'edbd39ea436a62ecb9f9139398e7f1f47728dc0d', class: 'ls-field-properties-section-title' }, this.sectionTitle), this.sectionDescription && index.h("p", { key: '44de2ab5ed2ef26e31348d320de1332d56d20b59', class: 'ls-field-properties-section-description' }, this.sectionDescription)), index.h("slot", { key: '87a848d33fb4aad0189db6a968ed8826dfd7641f' }))));
33625
33698
  }
33626
33699
  };
33627
33700
  LsPropsSection.style = lsPropsSectionCss;
@@ -33642,7 +33715,7 @@ const LsRadioInput = class {
33642
33715
  render() {
33643
33716
  const { label, radioId, icon, name, disabled, checked, customStyle, } = this;
33644
33717
  const radioLabelClass = clsx('radioLabel', disabled && 'disabled', checked && 'checked');
33645
- return (index.h("label", { key: 'de0993bfb376fcc4e0ae063d14d7d67a72fd73c4', htmlFor: radioId, tabIndex: 0, class: radioLabelClass, style: customStyle }, index.h("input", { key: '35f7c3c53cea25aa55026a19a90cc1c96fea935a', type: 'radio', class: 'inputClass', id: radioId, name: name, value: label, disabled: disabled, tabIndex: 0, checked: checked }), index.h("div", { key: '0bde5541443547f0c6c9a386b49ee3a9f9e73ed2', class: 'spanContainer' }, index.h("span", { key: '24766c2cbd96c59f54875aca6a2bb08f590c2943' }, icon && index.h("ls-icon", { key: '3acaa6ef8bb5216d6e2fe01ce84a824d1f029369', name: icon, size: "16" })), index.h("span", { key: '81074958b38325eb28f81343c6ea21efdd5fcfe9' }, label))));
33718
+ return (index.h("label", { key: 'bbae0b9694ffe32d08bc92d19a6d86c816a68a41', htmlFor: radioId, tabIndex: 0, class: radioLabelClass, style: customStyle }, index.h("input", { key: '080d4e498934fcd4385c96e3c66ea4acf1e46b70', type: 'radio', class: 'inputClass', id: radioId, name: name, value: label, disabled: disabled, tabIndex: 0, checked: checked }), index.h("div", { key: '860b00749727c8bce00ab04e184431c37b8e2242', class: 'spanContainer' }, index.h("span", { key: '4a5423b7b13f935d14c4ced1d0c0d8e0552f98fe' }, icon && index.h("ls-icon", { key: 'd4e96dbe63a5933ced6b19826952146cad620a1d', name: icon, size: "16" })), index.h("span", { key: '82690546986e6d7d0f26aa455e170984fb865fe8' }, label))));
33646
33719
  }
33647
33720
  };
33648
33721
  LsRadioInput.style = lsRadioInputCss;
@@ -33679,7 +33752,7 @@ const LsSelectInput = class {
33679
33752
  : displayOnly
33680
33753
  ? 'displayOnly'
33681
33754
  : 'default', fieldIcon && 'icon-input', dirty && 'button-input', buttonIcon && 'button-input', buttonIcon && dirty && 'right-items-input');
33682
- return (index.h("host", { key: '1b9c9b3cdf4bed97646bef454ba079ac1b321ed4', class: 'host' }, fieldIcon && (index.h("ls-icon", { key: '6a77ed9f2f884079842298669994d14985a7715e', id: disabled ? 'fieldIconDisabled' : 'fieldIcon', name: fieldIcon })), index.h("select", { key: '52f7b511af3aefe07c3e100262d763d0109542f9', class: inputClass, id: name, name: name, "aria-label": aria, required: required, disabled: disabled }, index.h("slot", { key: 'bfc6c636434ff26718ddbf81932d4c3ab2b8e8c8' })), index.h("div", { key: '6efec7eb5c630e013460c2dccbc6aac07f0db5c4', class: 'right-items' }, dirty && !disabled && (index.h("ls-icon", { key: 'd18e5b52c8dc3419043dbedbf84a38dfc17797da', id: valid ? 'validIcon' : 'invalidIcon', name: valid ? 'check-circle' : 'exclamation-circle' })), buttonIcon ? (index.h("button", { class: 'button', onClick: buttonClick }, index.h("ls-icon", { id: 'buttonIcon', name: buttonIcon }))) : (index.h("ls-icon", { id: disabled ? 'select-arrow-disabled' : 'select-arrow', name: 'chevron-down' })))));
33755
+ return (index.h("host", { key: '3198e57fe90d122525a59d9ba97deb167780d56e', class: 'host' }, fieldIcon && (index.h("ls-icon", { key: 'be5ffb22ca4e124fac1b016f34b42664e4b08a2b', id: disabled ? 'fieldIconDisabled' : 'fieldIcon', name: fieldIcon })), index.h("select", { key: '2434eae8a73565f78fc5eaf942cae0f6ad6dc2ed', class: inputClass, id: name, name: name, "aria-label": aria, required: required, disabled: disabled }, index.h("slot", { key: '57a99df199b2acf09d5c04239d979aec20bea07e' })), index.h("div", { key: '1caf895c6bab1d0f61078ee9d0451b60ad84b45c', class: 'right-items' }, dirty && !disabled && (index.h("ls-icon", { key: 'e15ccaf5a83f300b8ef6c8603edef89390f6d628', id: valid ? 'validIcon' : 'invalidIcon', name: valid ? 'check-circle' : 'exclamation-circle' })), buttonIcon ? (index.h("button", { class: 'button', onClick: buttonClick }, index.h("ls-icon", { id: 'buttonIcon', name: buttonIcon }))) : (index.h("ls-icon", { id: disabled ? 'select-arrow-disabled' : 'select-arrow', name: 'chevron-down' })))));
33683
33756
  }
33684
33757
  };
33685
33758
  LsSelectInput.style = lsSelectInputCss;
@@ -33723,11 +33796,11 @@ const LsStatusbar = class {
33723
33796
  this.zoom = this.editor.zoom;
33724
33797
  }
33725
33798
  render() {
33726
- return (index.h(index.Host, { key: 'a2d25325c28e7d3ee5656c5d03e29cadd7968cea' }, index.h("div", { key: '6356309e9a41097679a48c124cd459af995c1bf5', class: "status-bar-section" }, index.h("button", { key: '642bd5af767b56e80ff1bd3a2b1370833ba16dbd', onClick: () => this.setZoom(this.editor.zoom * 0.8) }, index.h("ls-icon", { key: '9f61578b8fcb66d4ebda5b76efe2c91ea0aadcb7', name: "zoom-out" })), index.h("div", { key: '738b44442c23f3d1fce6461e794c91e535b78beb' }, index.h("input", { key: '4bd376ef3d7a5d8d666f2ad2357c85f306d0ae9d', type: "range", min: "1", max: "300", value: this.zoom * 100, class: "slider", id: "zoomRange", onInput: () => this.handleZoomInput() })), index.h("button", { key: '37088296667df1683e63811ed96aeb915b43881a', onClick: () => this.setZoom(this.editor.zoom / 0.8) }, index.h("ls-icon", { key: 'c3de9b7f3ee79481d1e0a4ac63a2edff28175ce2', name: "zoom-in" }))), index.h("div", { key: '2aa5fccbe3dd364aea307eef922c6ad7d6eac5c2', class: "status-bar-section" }, index.h("button", { key: '0b671ea6f3943da1057713a262ea6a91c2db816d', onClick: () => this.fitWidth() }, index.h("ls-icon", { key: 'a637b3120acbc0d3963783debea8be5f0b5c9b92', name: "fit-width" })), index.h("button", { key: 'a0347f81f25c138bdc1990337faeeb97d05b02b0', onClick: () => this.fitHeight() }, index.h("ls-icon", { key: '9d2142b33f5a24cf03f8d32bc16ae62e2be5eddf', name: "fit-height" }))), index.h("div", { key: '5a1efe22de5fe1729c612594c64ebdfc72089da1', class: "status-bar-section" }, index.h("button", { key: '9bbb8980302a46459a73eb027d9e515f32c98b57', onClick: () => {
33799
+ return (index.h(index.Host, { key: '4bd1a21af721a005d600df17fcd60b3f0d7b366b' }, index.h("div", { key: '62955953c4485c48653b3da3164f966c10227a2b', class: "status-bar-section" }, index.h("button", { key: '98fc2664e5432c6f33fd634796f6e7d2eed33a95', onClick: () => this.setZoom(this.editor.zoom * 0.8) }, index.h("ls-icon", { key: '83eb3c9987e804cadfd82858b3a9b4759d46d236', name: "zoom-out" })), index.h("div", { key: 'ee55d3bccbf0272988f44c7c1bf61f3e44e7c79b' }, index.h("input", { key: '287c0c6f792a8f7072923765eb73d8763758a14f', type: "range", min: "1", max: "300", value: this.zoom * 100, class: "slider", id: "zoomRange", onInput: () => this.handleZoomInput() })), index.h("button", { key: '283b244472927eb51c4c07e083f80fe02a3c1a20', onClick: () => this.setZoom(this.editor.zoom / 0.8) }, index.h("ls-icon", { key: 'd00e1b019730f8af5ac801e7afcb0a09f2a7951c', name: "zoom-in" }))), index.h("div", { key: '34ccb92641e8fbf5afe3710cd0f8db431ee6e729', class: "status-bar-section" }, index.h("button", { key: 'c2ff18c984d591670964e212c0f2596dc3895020', onClick: () => this.fitWidth() }, index.h("ls-icon", { key: '43456ec3c5921a6d3eec055c95e733e299807627', name: "fit-width" })), index.h("button", { key: 'd75887d090131f2e2a14cff8b80cc4f19ce1549a', onClick: () => this.fitHeight() }, index.h("ls-icon", { key: '9ea9ac42c1616beb3a1fbd17e0fd25d6c6bd0386', name: "fit-height" }))), index.h("div", { key: 'b24d99c900e7110483a047e176dc29321e0f9473', class: "status-bar-section" }, index.h("button", { key: 'f3272a6db8f5b44e551139b225576d83b46e1aa7', onClick: () => {
33727
33800
  this.editor.pagePrev();
33728
- } }, index.h("ls-icon", { key: '4b99335299f0134de0779a5ee1ac724f0d2cdaef', name: "chevron-left" })), index.h("p", { key: '77759fde49162c9210d63c859ceb400f51b35502' }, "1 / 2"), index.h("button", { key: '5b4c1f6bbd6ef6dd97ac265694522539c214dd55', onClick: () => {
33801
+ } }, index.h("ls-icon", { key: '2456635ebda7460863cbaa39e07d1dd8af68dbcd', name: "chevron-left" })), index.h("p", { key: '0aaf26d9af14db1632afa6695ecd0dd5e2e1cfd0' }, "1 / 2"), index.h("button", { key: '5b89e0d484f51adb7646ea16e42e65b2c96c813a', onClick: () => {
33729
33802
  this.editor.pageNext();
33730
- } }, index.h("ls-icon", { key: 'a2a28b8ba51a44e79679280d5af985090baf0d1a', name: "chevron-right" }))), index.h("slot", { key: '3bd9e7a1a8eb4d85e1688c84ec40b8dcdb423abb' })));
33803
+ } }, index.h("ls-icon", { key: 'f4b858dc69fd3ee4ca6fc60173c7411ac213982d', name: "chevron-right" }))), index.h("slot", { key: '2d8a04174cf4a6fe127f844025dd9309304fdd3a' })));
33731
33804
  }
33732
33805
  };
33733
33806
  LsStatusbar.style = lsStatusbarCss;
@@ -33737,6 +33810,7 @@ const lsTextInputCss = "* {\n box-sizing: border-box;\n font-family: \"IBM Ple
33737
33810
  const LsTextInput = class {
33738
33811
  constructor(hostRef) {
33739
33812
  index.registerInstance(this, hostRef);
33813
+ this.valueChange = index.createEvent(this, "valueChange");
33740
33814
  }
33741
33815
  type = 'default';
33742
33816
  name;
@@ -33752,10 +33826,15 @@ const LsTextInput = class {
33752
33826
  buttonClick;
33753
33827
  buttonIcon;
33754
33828
  fieldIcon;
33829
+ valueChange;
33755
33830
  showPassword = false;
33756
33831
  handlePassword = () => {
33757
33832
  this.showPassword = !this.showPassword;
33758
33833
  };
33834
+ changeHandler(event) {
33835
+ console.log(event);
33836
+ this.valueChange.emit(event.target.value);
33837
+ }
33759
33838
  render() {
33760
33839
  const { type, name, value, placeholder, aria, disabled, required, valid, dirty, countMax, buttonClick, buttonIcon, fieldIcon, showPassword, handlePassword, } = this;
33761
33840
  const inputClass = clsx('input-base', type === 'displayonly'
@@ -33767,7 +33846,13 @@ const LsTextInput = class {
33767
33846
  : dirty && !valid
33768
33847
  ? 'invalid'
33769
33848
  : 'default', fieldIcon && 'icon-input', dirty && 'button-input', buttonIcon && 'button-input', buttonIcon && dirty && 'right-items-input');
33770
- return (index.h(index.Host, { key: '15e32001a44ea63d0a73caa931443df95dd98136', class: 'host' }, fieldIcon && (index.h("ls-icon", { key: '105186b5f37275d8584ea07b62c19814ce464348', id: disabled ? 'fieldIconDisabled' : 'fieldIcon', name: fieldIcon })), type === 'password' ? (index.h("input", { type: showPassword && 'password', class: inputClass, id: name, name: name, value: value, maxlength: countMax, placeholder: placeholder, "aria-label": aria, required: required, disabled: disabled })) : type === 'displayonly' ? (index.h("input", { class: inputClass, id: name, name: name, value: value, maxlength: countMax, placeholder: placeholder, "aria-label": aria, required: required, disabled: true })) : (index.h("input", { class: inputClass, id: name, name: name, value: value, maxlength: countMax, placeholder: placeholder, "aria-label": aria, required: required, disabled: disabled })), index.h("div", { key: '6f4bcd900d79e4445feee89a552a22c8b3f59165', class: 'right-items' }, dirty && !disabled && (index.h("ls-icon", { key: '9ab1ec6ed1ed89dd736b0ee18e256aa00c03b52a', id: valid ? 'validIcon' : 'invalidIcon', name: valid ? 'check-circle' : 'exclamation-circle' })), buttonIcon && (index.h("button", { key: 'e175639b3f81dd937ed6496c0ec3f48a4498a720', class: 'button', onClick: buttonClick }, index.h("ls-icon", { key: 'aaebed49b783bb502cf592876bd553b149e2fc8e', id: 'buttonIcon', name: buttonIcon }))), type === 'password' && !buttonIcon && (index.h("ls-icon-button", { key: 'a30ceccb6e5d05c81eea8c1756e6cbf71d6d96ec', id: 'password-icon', icon: showPassword ? 'eye' : 'eye-off', onClick: handlePassword })))));
33849
+ return (index.h(index.Host, { key: '7e438a1e8dce5d705f497a21ebfa9355eee20212', class: 'host' }, fieldIcon && (index.h("ls-icon", { key: '2813d3b571abc660c0f74d8c7b6946a0e61f56d3', id: disabled ? 'fieldIconDisabled' : 'fieldIcon', name: fieldIcon })), type === 'password' ? (index.h("input", { type: showPassword && 'password', class: inputClass, id: name, name: name, value: value, maxlength: countMax, placeholder: placeholder, "aria-label": aria, required: required, disabled: disabled, onChange: (e) => {
33850
+ this.changeHandler(e);
33851
+ } })) : type === 'displayonly' ? (index.h("input", { class: inputClass, id: name, name: name, value: value, maxlength: countMax, placeholder: placeholder, "aria-label": aria, required: required, disabled: true, onChange: (e) => {
33852
+ this.changeHandler(e);
33853
+ } })) : (index.h("input", { class: inputClass, id: name, name: name, value: value, maxlength: countMax, placeholder: placeholder, "aria-label": aria, required: required, disabled: disabled, onChange: (e) => {
33854
+ this.changeHandler(e);
33855
+ } })), index.h("div", { key: '2288d7fa46d4cf2980ea0990c3a89948eb545866', class: 'right-items' }, dirty && !disabled && (index.h("ls-icon", { key: '8710f82e0d692f80a01858a226baf8e7d2a27cbc', id: valid ? 'validIcon' : 'invalidIcon', name: valid ? 'check-circle' : 'exclamation-circle' })), buttonIcon && (index.h("button", { key: 'be490c5b6c236c238d07e3260148ccc02c3a1090', class: 'button', onClick: buttonClick }, index.h("ls-icon", { key: 'd60bca581a72d0c5a90a554726042765d052bbe8', id: 'buttonIcon', name: buttonIcon }))), type === 'password' && !buttonIcon && (index.h("ls-icon-button", { key: '7a3a6f7f61cd7362057160799b442f3a9bb227d3', id: 'password-icon', icon: showPassword ? 'eye' : 'eye-off', onClick: handlePassword })))));
33771
33856
  }
33772
33857
  };
33773
33858
  LsTextInput.style = lsTextInputCss;
@@ -33803,7 +33888,7 @@ const LsTextareaInput = class {
33803
33888
  : displayOnly
33804
33889
  ? 'displayOnly'
33805
33890
  : 'default', fieldIcon && 'icon-input', dirty && 'button-input', buttonIcon && 'button-input', buttonIcon && dirty && 'right-items-input');
33806
- return (index.h("host", { key: '8ec37a0a93ea85c54b2cec30d1d2fac15cda47c0', class: 'host' }, fieldIcon && (index.h("ls-icon", { key: '6a33ec27c7099eba78502e1091bb55316fc451fc', id: disabled ? 'fieldIconDisabled' : 'fieldIcon', name: fieldIcon })), index.h("textarea", { key: '05a9067d05555edf9533b3127f9f93851397dc81', class: inputClass, id: name, name: name, value: value, maxlength: countMax, placeholder: placeholder, "aria-label": aria, required: required, disabled: disabled }), index.h("div", { key: 'd5b37b20e0b4cfeb6bc2d93d607fd8193309a103', class: 'right-items' }, dirty && !disabled && (index.h("ls-icon", { key: 'a71afb6502bd82fe7161c492e936cf74934035e5', id: valid ? 'validIcon' : 'invalidIcon', name: valid ? 'check-circle' : 'exclamation-circle' })), buttonIcon && (index.h("button", { key: '60afa61757e6ea8cc4d43c49c246b4940b7bacf3', class: 'button', onClick: buttonClick }, index.h("ls-icon", { key: '715802045df59ff4ff415bcb477a51a303e62d46', id: 'buttonIcon', name: buttonIcon }))))));
33891
+ return (index.h("host", { key: '38a837b2e0b215f0fc2838cd42da69c17eb7ec4f', class: 'host' }, fieldIcon && (index.h("ls-icon", { key: 'c103b6243b1ee163f2c89d337bee408f472d9e3b', id: disabled ? 'fieldIconDisabled' : 'fieldIcon', name: fieldIcon })), index.h("textarea", { key: '3af7a868e6468bb54759bb28022ae3da0079fa6a', class: inputClass, id: name, name: name, value: value, maxlength: countMax, placeholder: placeholder, "aria-label": aria, required: required, disabled: disabled }), index.h("div", { key: '3537563cfb1b1dcf8b317c1c216ae7e1b0c8c2da', class: 'right-items' }, dirty && !disabled && (index.h("ls-icon", { key: '09fccef073dfc64f6705b0802379ef55d963063d', id: valid ? 'validIcon' : 'invalidIcon', name: valid ? 'check-circle' : 'exclamation-circle' })), buttonIcon && (index.h("button", { key: '2b946ff816a56126054cbdf776274b96eb7ab601', class: 'button', onClick: buttonClick }, index.h("ls-icon", { key: '80b62d71c925cc94abc862ebbbd246ee9ddbf2b1', id: 'buttonIcon', name: buttonIcon }))))));
33807
33892
  }
33808
33893
  };
33809
33894
  LsTextareaInput.style = lsTextareaInputCss;
@@ -33813,14 +33898,22 @@ const lsToggleCss = ":host{display:block}.switch{position:relative;display:inlin
33813
33898
  const LsToggle = class {
33814
33899
  constructor(hostRef) {
33815
33900
  index.registerInstance(this, hostRef);
33901
+ this.valueChange = index.createEvent(this, "valueChange");
33902
+ }
33903
+ checked;
33904
+ valueChange;
33905
+ changeHandler(value) {
33906
+ this.valueChange.emit(value);
33816
33907
  }
33817
33908
  render() {
33818
- return (index.h(index.Host, { key: '7ac7e2efe34d5069f27773cfe6d7128290311367' }, index.h("label", { key: 'ed48e05e053fad6e0844075b2ea9071e5438b686', class: "switch" }, index.h("input", { key: 'cb812dbc57809d3e10d232a8ba54392c6a61d263', type: "checkbox" }), index.h("span", { key: 'f2291febb2e8d30ab9da5d88264f710b2266d016', class: "slider round" })), index.h("slot", { key: '750162d4305971733cdae71a231819071b78dca9' })));
33909
+ return (index.h(index.Host, { key: '51deaab22424e7372179516041331176dc1420c3' }, index.h("label", { key: '9cbc256f58728549486c1b0b6cc60cb6405f593e', class: "switch" }, index.h("input", { key: '7fb0b6164eaee85e6fb6343daaa3995f7e484b7a', type: "checkbox", checked: this.checked, onChange: (e) => {
33910
+ this.changeHandler(e.target.checked);
33911
+ } }), index.h("span", { key: 'e7819ba797ad9109fc7908bfb7d69c5ef4460e16', class: "slider round" })), index.h("slot", { key: 'f330659c0b39f7e85a4973306fdcd48ebf7b7005' })));
33819
33912
  }
33820
33913
  };
33821
33914
  LsToggle.style = lsToggleCss;
33822
33915
 
33823
- const lsToolbarCss = ":host{position:relative;display:flex;width:100%;align-items:center;justify-content:center}.rowbox{position:absolute;top:1rem;display:flex;padding:0.5rem;justify-content:center;align-items:center;gap:0.5rem;width:fit-content;border-radius:1rem;border:1px solid var(--gray-20, #edeff2);background:var(--white, #fff);margin-bottom:1rem;z-index:200}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:36px}.input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}";
33916
+ const lsToolbarCss = ":host{position:absolute;top:1rem;left:50%;transform:translateX(-50%);display:flex;width:100%;align-items:center;justify-content:center;padding:0.5rem;gap:0.5rem;width:fit-content;border-radius:1rem;border:1px solid var(--gray-20, #edeff2);background:var(--white, #fff);z-index:1000}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:36px}.input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.5rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #fff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type='checkbox']{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type='checkbox']:checked,input[type='checkbox'].indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type='checkbox']:checked::after{content:'';position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type='checkbox'].indeterminate::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type='checkbox']:checked:hover,input[type='checkbox'].indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type='checkbox']:hover{border:1px solid #9ca3af}input[type='checkbox']:focus,input[type='checkbox']:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type='checkbox']:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type='checkbox']:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}";
33824
33917
 
33825
33918
  const LsToolbar = class {
33826
33919
  constructor(hostRef) {
@@ -33858,7 +33951,7 @@ const LsToolbar = class {
33858
33951
  this.update.emit(diffs);
33859
33952
  }
33860
33953
  render() {
33861
- return (index.h(index.Host, { key: 'c37ef3418f928a920fe46635a38090850835b5b6' }, this.dataItem && this.dataItem.length > 1 ? (index.h("div", { class: 'rowbox' }, index.h("ls-field-format", { dataItem: this?.dataItem }))) : (index.h("div", { class: 'rowbox' }, this.dataItem && this.dataItem.length === 1 ? (index.h("ls-field-format", { dataItem: this?.dataItem })) : (index.h("ls-participant-select", { roles: this.template?.roles, dataItem: this?.dataItem })))), index.h("slot", { key: 'e5e566755b02496acac48ada3d04d72b954b83a7' })));
33954
+ return (index.h(index.Host, { key: 'b508c0fc8ea43d6792991f7cba1fbea5bd912163' }, this.dataItem && this.dataItem.length > 1 ? (index.h("div", { class: 'rowbox' }, index.h("ls-field-format", { dataItem: this?.dataItem }))) : (index.h("div", { class: 'rowbox' }, this.dataItem && this.dataItem.length === 1 ? (index.h("ls-field-format", { dataItem: this?.dataItem })) : (index.h("ls-participant-select", { roles: this.template?.roles, dataItem: this?.dataItem })))), index.h("slot", { key: '7709a476f91dc4f601e9a13ffe3433a5e1045f85' })));
33862
33955
  }
33863
33956
  };
33864
33957
  LsToolbar.style = lsToolbarCss;
@@ -33912,7 +34005,7 @@ const LsToolboxField = class {
33912
34005
  }
33913
34006
  }
33914
34007
  render() {
33915
- return (index.h(index.Host, { key: '40d4706f36b70be2e13b1a2b6d7192ec3465d326', draggable: "true" }, index.h("div", { key: '99957249aa1a69ba9ab624b8ff60cfb37b9982c7', class: "toolbox-field-icon", style: { '--signer-color-light': defaultRolePalette[this.signer % 100].s10, '--signer-color': defaultRolePalette[this.signer % 100].s60 } }, index.h("ls-icon", { key: 'ddef21693d5477d431c5683668085c31d623c241', name: this.icon, size: "20" })), index.h("p", { key: 'a02a1593e2734ca129754cae74770c19f363d72e', class: "toolbox-field-label" }, this.label), index.h("ls-icon", { key: '86b6f0bdd96c3ec1ecb3486c22c8e74af9a368ab', name: "drag-vertical", size: "16", color: "#787a80" })));
34008
+ return (index.h(index.Host, { key: '856e5d70fb0902cf3bed2b72d8d956909b46dbbc', draggable: "true" }, index.h("div", { key: 'b791fa8da5a8168e8779ab1bf5074b9ce64d1984', class: "toolbox-field-icon", style: { '--signer-color-light': defaultRolePalette[this.signer % 100].s10, '--signer-color': defaultRolePalette[this.signer % 100].s60 } }, index.h("ls-icon", { key: 'bf02aa9efc15c684bbefd16c03fe1223005999a9', name: this.icon, size: "20" })), index.h("p", { key: '86ea59f55c6298c11ce9718927461723e339cdb1', class: "toolbox-field-label" }, this.label), index.h("ls-icon", { key: '1e8c15fae1767ad69d206c15e42c600d493f78a9', name: "drag-vertical", size: "16", color: "#787a80" })));
33916
34009
  }
33917
34010
  };
33918
34011
  LsToolboxField.style = lsToolboxFieldCss;