@verdocs/web-sdk 2.2.20 → 2.2.22

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 (206) hide show
  1. package/dist/cjs/{TemplateStore-66577b50.js → TemplateStore-a5fa2b0c.js} +1 -1
  2. package/dist/cjs/{VerdocsEndpoint-a2dc85ad.js → VerdocsEndpoint-45deeb6a.js} +2 -2
  3. package/dist/cjs/ipc-test.cjs.entry.js +2 -2
  4. package/dist/cjs/loader.cjs.js +1 -1
  5. package/dist/cjs/verdocs-activity-box.cjs.entry.js +1 -1
  6. package/dist/cjs/verdocs-auth.cjs.entry.js +1 -1
  7. package/dist/cjs/verdocs-build.cjs.entry.js +50 -72
  8. package/dist/cjs/verdocs-button-panel_2.cjs.entry.js +2 -2
  9. package/dist/cjs/verdocs-contact-picker_2.cjs.entry.js +1 -1
  10. package/dist/cjs/{verdocs-dialog_3.cjs.entry.js → verdocs-dialog_2.cjs.entry.js} +0 -25
  11. package/dist/cjs/verdocs-envelope-document-page.cjs.entry.js +1 -1
  12. package/dist/cjs/verdocs-envelope-recipient-link_2.cjs.entry.js +1 -1
  13. package/dist/cjs/verdocs-envelope-sidebar.cjs.entry.js +1 -1
  14. package/dist/cjs/verdocs-envelopes-list.cjs.entry.js +1 -1
  15. package/dist/cjs/verdocs-field-textarea.cjs.entry.js +1 -1
  16. package/dist/cjs/verdocs-field-textbox.cjs.entry.js +1 -1
  17. package/dist/cjs/verdocs-file-chooser_2.cjs.entry.js +1 -1
  18. package/dist/cjs/{verdocs-preview_6.cjs.entry.js → verdocs-preview_8.cjs.entry.js} +205 -14
  19. package/dist/cjs/verdocs-quick-functions_3.cjs.entry.js +1 -1
  20. package/dist/cjs/verdocs-search.cjs.entry.js +1 -1
  21. package/dist/cjs/verdocs-settings-api-keys_4.cjs.entry.js +1 -1
  22. package/dist/cjs/verdocs-settings.cjs.entry.js +1 -1
  23. package/dist/cjs/verdocs-sign.cjs.entry.js +1 -1
  24. package/dist/cjs/verdocs-tabs.cjs.entry.js +26 -0
  25. package/dist/cjs/verdocs-template-document-page_2.cjs.entry.js +1 -1
  26. package/dist/cjs/verdocs-template-fields_4.cjs.entry.js +11 -5
  27. package/dist/cjs/verdocs-template-star.cjs.entry.js +1 -1
  28. package/dist/cjs/verdocs-templates-list.cjs.entry.js +1 -1
  29. package/dist/cjs/verdocs-view.cjs.entry.js +1 -1
  30. package/dist/cjs/verdocs-web-sdk.cjs.js +1 -1
  31. package/dist/collection/collection-manifest.json +1 -0
  32. package/dist/collection/components/controls/verdocs-tabs/verdocs-tabs.css +15 -16
  33. package/dist/collection/components/controls/verdocs-tabs/verdocs-tabs.js +5 -14
  34. package/dist/collection/components/controls/verdocs-tabs/verdocs-tabs.stories.js +4 -13
  35. package/dist/collection/components/embeds/verdocs-build/verdocs-build.css +1 -34
  36. package/dist/collection/components/embeds/verdocs-build/verdocs-build.js +107 -17
  37. package/dist/collection/components/embeds/verdocs-build/verdocs-build.stories.js +1 -1
  38. package/dist/collection/components/templates/verdocs-template-attachments/verdocs-template-attachments.js +13 -8
  39. package/dist/collection/components/templates/verdocs-template-build-tabs/verdocs-template-build-tabs.css +25 -0
  40. package/dist/collection/components/templates/verdocs-template-build-tabs/verdocs-template-build-tabs.js +219 -0
  41. package/dist/collection/components/templates/verdocs-template-build-tabs/verdocs-template-build-tabs.stories.js +16 -0
  42. package/dist/collection/components/templates/verdocs-template-create/verdocs-template-create.js +28 -3
  43. package/dist/collection/components/templates/verdocs-template-name/verdocs-template-name.js +27 -3
  44. package/dist/collection/components/templates/verdocs-template-reminders/verdocs-template-reminders.js +28 -3
  45. package/dist/collection/components/templates/verdocs-template-roles/verdocs-template-roles.js +9 -3
  46. package/dist/collection/components/templates/verdocs-template-visibillity/verdocs-template-visibility.js +27 -2
  47. package/dist/components/VerdocsEndpoint.js +1 -1
  48. package/dist/components/index.d.ts +1 -0
  49. package/dist/components/index.js +1 -0
  50. package/dist/components/verdocs-build.js +99 -102
  51. package/dist/components/verdocs-tabs2.js +2 -8
  52. package/dist/components/verdocs-template-attachments2.js +5 -4
  53. package/dist/components/verdocs-template-build-tabs.d.ts +11 -0
  54. package/dist/components/verdocs-template-build-tabs.js +6 -0
  55. package/dist/components/verdocs-template-build-tabs2.js +132 -0
  56. package/dist/components/verdocs-template-create.js +1 -138
  57. package/dist/{esm/verdocs-template-create.entry.js → components/verdocs-template-create2.js} +61 -14
  58. package/dist/components/verdocs-template-name2.js +4 -3
  59. package/dist/components/verdocs-template-reminders2.js +5 -3
  60. package/dist/components/verdocs-template-roles2.js +9 -3
  61. package/dist/components/verdocs-template-visibility2.js +4 -2
  62. package/dist/docs.json +212 -13
  63. package/dist/esm/{TemplateStore-3c138524.js → TemplateStore-e8cf5a15.js} +1 -1
  64. package/dist/esm/{VerdocsEndpoint-6fe4258b.js → VerdocsEndpoint-d58d5544.js} +1 -1
  65. package/dist/esm/ipc-test.entry.js +2 -2
  66. package/dist/esm/loader.js +1 -1
  67. package/dist/esm/verdocs-activity-box.entry.js +1 -1
  68. package/dist/esm/verdocs-auth.entry.js +1 -1
  69. package/dist/esm/verdocs-build.entry.js +51 -73
  70. package/dist/esm/verdocs-button-panel_2.entry.js +2 -2
  71. package/dist/esm/verdocs-contact-picker_2.entry.js +1 -1
  72. package/dist/esm/{verdocs-dialog_3.entry.js → verdocs-dialog_2.entry.js} +1 -25
  73. package/dist/esm/verdocs-envelope-document-page.entry.js +1 -1
  74. package/dist/esm/verdocs-envelope-recipient-link_2.entry.js +1 -1
  75. package/dist/esm/verdocs-envelope-sidebar.entry.js +1 -1
  76. package/dist/esm/verdocs-envelopes-list.entry.js +1 -1
  77. package/dist/esm/verdocs-field-textarea.entry.js +1 -1
  78. package/dist/esm/verdocs-field-textbox.entry.js +1 -1
  79. package/dist/esm/verdocs-file-chooser_2.entry.js +1 -1
  80. package/dist/esm/{verdocs-preview_6.entry.js → verdocs-preview_8.entry.js} +207 -18
  81. package/dist/esm/verdocs-quick-functions_3.entry.js +1 -1
  82. package/dist/esm/verdocs-search.entry.js +1 -1
  83. package/dist/esm/verdocs-settings-api-keys_4.entry.js +1 -1
  84. package/dist/esm/verdocs-settings.entry.js +1 -1
  85. package/dist/esm/verdocs-sign.entry.js +1 -1
  86. package/dist/esm/verdocs-tabs.entry.js +22 -0
  87. package/dist/esm/verdocs-template-document-page_2.entry.js +1 -1
  88. package/dist/esm/verdocs-template-fields_4.entry.js +11 -5
  89. package/dist/esm/verdocs-template-star.entry.js +1 -1
  90. package/dist/esm/verdocs-templates-list.entry.js +1 -1
  91. package/dist/esm/verdocs-view.entry.js +1 -1
  92. package/dist/esm/verdocs-web-sdk.js +1 -1
  93. package/dist/esm-es5/{TemplateStore-3c138524.js → TemplateStore-e8cf5a15.js} +1 -1
  94. package/dist/esm-es5/{VerdocsEndpoint-6fe4258b.js → VerdocsEndpoint-d58d5544.js} +1 -1
  95. package/dist/esm-es5/ipc-test.entry.js +1 -1
  96. package/dist/esm-es5/loader.js +1 -1
  97. package/dist/esm-es5/verdocs-activity-box.entry.js +1 -1
  98. package/dist/esm-es5/verdocs-auth.entry.js +1 -1
  99. package/dist/esm-es5/verdocs-build.entry.js +1 -1
  100. package/dist/esm-es5/verdocs-button-panel_2.entry.js +1 -1
  101. package/dist/esm-es5/verdocs-contact-picker_2.entry.js +1 -1
  102. package/dist/esm-es5/{verdocs-dialog_3.entry.js → verdocs-dialog_2.entry.js} +1 -1
  103. package/dist/esm-es5/verdocs-envelope-document-page.entry.js +1 -1
  104. package/dist/esm-es5/verdocs-envelope-recipient-link_2.entry.js +1 -1
  105. package/dist/esm-es5/verdocs-envelope-sidebar.entry.js +1 -1
  106. package/dist/esm-es5/verdocs-envelopes-list.entry.js +1 -1
  107. package/dist/esm-es5/verdocs-field-textarea.entry.js +1 -1
  108. package/dist/esm-es5/verdocs-field-textbox.entry.js +1 -1
  109. package/dist/esm-es5/verdocs-file-chooser_2.entry.js +1 -1
  110. package/dist/esm-es5/verdocs-preview_8.entry.js +1 -0
  111. package/dist/esm-es5/verdocs-quick-functions_3.entry.js +1 -1
  112. package/dist/esm-es5/verdocs-search.entry.js +1 -1
  113. package/dist/esm-es5/verdocs-settings-api-keys_4.entry.js +1 -1
  114. package/dist/esm-es5/verdocs-settings.entry.js +1 -1
  115. package/dist/esm-es5/verdocs-sign.entry.js +1 -1
  116. package/dist/esm-es5/verdocs-tabs.entry.js +1 -0
  117. package/dist/esm-es5/verdocs-template-document-page_2.entry.js +1 -1
  118. package/dist/esm-es5/verdocs-template-fields_4.entry.js +1 -1
  119. package/dist/esm-es5/verdocs-template-star.entry.js +1 -1
  120. package/dist/esm-es5/verdocs-templates-list.entry.js +1 -1
  121. package/dist/esm-es5/verdocs-view.entry.js +1 -1
  122. package/dist/esm-es5/verdocs-web-sdk.js +1 -1
  123. package/dist/types/components/controls/verdocs-tabs/verdocs-tabs.d.ts +3 -4
  124. package/dist/types/components/controls/verdocs-tabs/verdocs-tabs.stories.d.ts +2 -3
  125. package/dist/types/components/embeds/verdocs-build/verdocs-build.d.ts +24 -2
  126. package/dist/types/components/templates/verdocs-template-attachments/verdocs-template-attachments.d.ts +4 -2
  127. package/dist/types/components/templates/verdocs-template-build-tabs/verdocs-template-build-tabs.d.ts +39 -0
  128. package/dist/types/components/templates/verdocs-template-build-tabs/verdocs-template-build-tabs.stories.d.ts +8 -0
  129. package/dist/types/components/templates/verdocs-template-create/verdocs-template-create.d.ts +8 -0
  130. package/dist/types/components/templates/verdocs-template-name/verdocs-template-name.d.ts +9 -0
  131. package/dist/types/components/templates/verdocs-template-reminders/verdocs-template-reminders.d.ts +9 -0
  132. package/dist/types/components/templates/verdocs-template-roles/verdocs-template-roles.d.ts +1 -0
  133. package/dist/types/components/templates/verdocs-template-visibillity/verdocs-template-visibility.d.ts +9 -0
  134. package/dist/types/components.d.ts +82 -8
  135. package/dist/verdocs-web-sdk/{p-963f6e05.system.entry.js → p-07696831.system.entry.js} +1 -1
  136. package/dist/verdocs-web-sdk/{p-8eb640c4.system.entry.js → p-07b5f356.system.entry.js} +1 -1
  137. package/dist/verdocs-web-sdk/{p-957e1e4e.entry.js → p-0b2102df.entry.js} +1 -1
  138. package/dist/verdocs-web-sdk/{p-ec9f11dc.system.entry.js → p-0df9e6e1.system.entry.js} +1 -1
  139. package/dist/verdocs-web-sdk/p-15df3998.system.entry.js +1 -0
  140. package/dist/verdocs-web-sdk/{p-724d4efa.system.js → p-1753f57b.system.js} +1 -1
  141. package/dist/verdocs-web-sdk/p-1dda2d09.entry.js +1 -0
  142. package/dist/verdocs-web-sdk/{p-7fb8387d.system.entry.js → p-21e137f0.system.entry.js} +1 -1
  143. package/dist/verdocs-web-sdk/{p-1ab8f7f6.system.entry.js → p-2284d430.system.entry.js} +1 -1
  144. package/dist/verdocs-web-sdk/{p-49777798.system.entry.js → p-2549a794.system.entry.js} +1 -1
  145. package/dist/verdocs-web-sdk/p-2a0ed0ab.entry.js +1 -0
  146. package/dist/verdocs-web-sdk/{p-53fb6c8c.entry.js → p-2b6e4f2a.entry.js} +1 -1
  147. package/dist/verdocs-web-sdk/{p-a06f6e8e.entry.js → p-3a90098d.entry.js} +1 -1
  148. package/dist/verdocs-web-sdk/p-3ce7e733.system.entry.js +1 -0
  149. package/dist/verdocs-web-sdk/{p-4a3f9e45.entry.js → p-3da4fed1.entry.js} +1 -1
  150. package/dist/verdocs-web-sdk/{p-3a5d8085.system.entry.js → p-4017b53a.system.entry.js} +1 -1
  151. package/dist/verdocs-web-sdk/{p-f867f61b.entry.js → p-428de4a5.entry.js} +1 -1
  152. package/dist/verdocs-web-sdk/{p-6c4de84c.entry.js → p-42f27e8c.entry.js} +1 -1
  153. package/dist/verdocs-web-sdk/p-4422958b.system.js +1 -0
  154. package/dist/verdocs-web-sdk/{p-71d6e1c3.system.entry.js → p-45bee3f6.system.entry.js} +1 -1
  155. package/dist/verdocs-web-sdk/{p-92e3d974.system.entry.js → p-45d5e035.system.entry.js} +1 -1
  156. package/dist/verdocs-web-sdk/{p-0fa99a06.system.entry.js → p-48c62137.system.entry.js} +1 -1
  157. package/dist/verdocs-web-sdk/{p-79c09ffc.system.entry.js → p-506754d5.system.entry.js} +1 -1
  158. package/dist/verdocs-web-sdk/{p-79410da3.entry.js → p-51979353.entry.js} +1 -1
  159. package/dist/verdocs-web-sdk/{p-2cb422a2.entry.js → p-5ab837bf.entry.js} +1 -1
  160. package/dist/verdocs-web-sdk/p-65c99d51.system.entry.js +1 -0
  161. package/dist/verdocs-web-sdk/{p-96fb90bd.system.entry.js → p-66cec042.system.entry.js} +1 -1
  162. package/dist/verdocs-web-sdk/{p-f732abf1.entry.js → p-6ccb86b6.entry.js} +1 -1
  163. package/dist/verdocs-web-sdk/p-6f1e794d.system.entry.js +1 -0
  164. package/dist/verdocs-web-sdk/p-70685224.entry.js +1 -0
  165. package/dist/verdocs-web-sdk/{p-58c8584e.entry.js → p-77ecee31.entry.js} +1 -1
  166. package/dist/verdocs-web-sdk/{p-b3b370b5.entry.js → p-78e4f430.entry.js} +1 -1
  167. package/dist/verdocs-web-sdk/{p-6734b77c.entry.js → p-79b0c643.entry.js} +1 -1
  168. package/dist/verdocs-web-sdk/{p-c26d3d7b.system.entry.js → p-7bd5db75.system.entry.js} +1 -1
  169. package/dist/verdocs-web-sdk/{p-5ed21587.entry.js → p-84efd562.entry.js} +1 -1
  170. package/dist/verdocs-web-sdk/{p-b3706eb2.system.entry.js → p-883d60e1.system.entry.js} +1 -1
  171. package/dist/verdocs-web-sdk/p-8d14ace0.entry.js +1 -0
  172. package/dist/verdocs-web-sdk/{p-87c527e4.entry.js → p-9009e136.entry.js} +1 -1
  173. package/dist/verdocs-web-sdk/{p-a41a8742.entry.js → p-965b66a8.entry.js} +1 -1
  174. package/dist/verdocs-web-sdk/{p-99c8acfa.system.entry.js → p-a0ad315e.system.entry.js} +1 -1
  175. package/dist/verdocs-web-sdk/{p-d56ac75b.entry.js → p-a1e82d5a.entry.js} +1 -1
  176. package/dist/verdocs-web-sdk/{p-a8aefe57.system.entry.js → p-a894761f.system.entry.js} +1 -1
  177. package/dist/verdocs-web-sdk/{p-ab7df219.system.entry.js → p-aba05f25.system.entry.js} +1 -1
  178. package/dist/verdocs-web-sdk/{p-c488219f.entry.js → p-ad273610.entry.js} +1 -1
  179. package/dist/verdocs-web-sdk/{p-1e48cc2c.system.entry.js → p-ae971bb4.system.entry.js} +1 -1
  180. package/dist/verdocs-web-sdk/{p-53276c5b.js → p-af048fad.js} +1 -1
  181. package/dist/verdocs-web-sdk/{p-ec06b3d1.entry.js → p-ba04698a.entry.js} +1 -1
  182. package/dist/verdocs-web-sdk/{p-55f66c83.entry.js → p-bbd400a5.entry.js} +1 -1
  183. package/dist/verdocs-web-sdk/{p-38031118.system.entry.js → p-cd64b223.system.entry.js} +1 -1
  184. package/dist/verdocs-web-sdk/{p-e36c7481.entry.js → p-d4aec860.entry.js} +1 -1
  185. package/dist/verdocs-web-sdk/{p-2c5e2d73.js → p-d4d8858f.js} +1 -1
  186. package/dist/verdocs-web-sdk/{p-a6d93251.entry.js → p-e40dd4d1.entry.js} +1 -1
  187. package/dist/verdocs-web-sdk/{p-f8210aa7.system.entry.js → p-edabba6b.system.entry.js} +1 -1
  188. package/dist/verdocs-web-sdk/p-f04bf956.system.js +1 -1
  189. package/dist/verdocs-web-sdk/{p-994623c4.entry.js → p-f2deae25.entry.js} +1 -1
  190. package/dist/verdocs-web-sdk/{p-3e20d28c.system.entry.js → p-f9e89b56.system.entry.js} +1 -1
  191. package/dist/verdocs-web-sdk/{p-75435256.system.entry.js → p-fab73ec8.system.entry.js} +1 -1
  192. package/dist/verdocs-web-sdk/verdocs-web-sdk.esm.js +1 -1
  193. package/package.json +1 -1
  194. package/dist/cjs/verdocs-template-create.cjs.entry.js +0 -99
  195. package/dist/custom-elements.json +0 -2021
  196. package/dist/esm-es5/verdocs-preview_6.entry.js +0 -1
  197. package/dist/esm-es5/verdocs-template-create.entry.js +0 -1
  198. package/dist/verdocs-web-sdk/p-070dfd64.system.entry.js +0 -1
  199. package/dist/verdocs-web-sdk/p-7ebe11ff.entry.js +0 -1
  200. package/dist/verdocs-web-sdk/p-88e12975.entry.js +0 -1
  201. package/dist/verdocs-web-sdk/p-93eb4996.system.entry.js +0 -1
  202. package/dist/verdocs-web-sdk/p-9e15bdda.system.js +0 -1
  203. package/dist/verdocs-web-sdk/p-b35e8183.system.entry.js +0 -1
  204. package/dist/verdocs-web-sdk/p-e1cad931.entry.js +0 -1
  205. package/dist/verdocs-web-sdk/p-f3aa514e.system.entry.js +0 -1
  206. package/dist/verdocs-web-sdk/p-fbd27c79.entry.js +0 -1
@@ -9,6 +9,7 @@
9
9
  "./components/elements/verdocs-search-box/verdocs-search-box.js",
10
10
  "./components/controls/verdocs-table/verdocs-table.js",
11
11
  "./components/controls/verdocs-tabs/verdocs-tabs.js",
12
+ "./components/templates/verdocs-template-build-tabs/verdocs-template-build-tabs.js",
12
13
  "./components/templates/verdocs-templates-list/verdocs-templates-list.js",
13
14
  "./components/controls/verdocs-toggle/verdocs-toggle.js",
14
15
  "./components/controls/verdocs-button/verdocs-button.js",
@@ -1,33 +1,32 @@
1
1
  verdocs-tabs {
2
- width: 100%;
3
- height: 50px;
2
+ gap: 10px;
4
3
  display: flex;
5
- color: #72757d;
6
4
  flex-wrap: wrap;
7
- margin: 0 0 10px 0;
8
5
  flex-direction: row;
9
- align-items: flex-end;
10
- box-sizing: border-box;
11
- background-color: #e5e5e5;
12
6
  font-family: "Inter", "Barlow", sans-serif;
13
- filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.1)) drop-shadow(0 1px 1px rgba(0, 0, 0, 0.06));
14
7
  }
15
8
  verdocs-tabs .tab {
16
- height: 50px;
17
9
  display: flex;
10
+ color: #111111;
18
11
  cursor: pointer;
19
- padding: 0 40px;
20
- font-size: 16px;
21
- font-weight: 600;
12
+ font-size: 14px;
13
+ font-weight: 400;
14
+ padding: 5px 10px;
22
15
  align-items: center;
16
+ text-transform: none;
23
17
  justify-content: center;
24
- background-color: #e4e4e7;
18
+ border-bottom: 4px solid transparent;
19
+ }
20
+ verdocs-tabs .tab:focus {
21
+ border: none;
22
+ outline: none;
25
23
  }
26
24
  verdocs-tabs .tab.active {
27
- color: #707ae5;
28
- background-color: #ffffff;
25
+ color: #000000;
26
+ font-weight: 500;
27
+ border-bottom: 4px solid #654dcb;
29
28
  }
30
29
  verdocs-tabs .tab.disabled {
31
- color: #d4d4d8;
30
+ color: #666666;
32
31
  cursor: default;
33
32
  }
@@ -1,19 +1,15 @@
1
1
  import { Host, h } from '@stencil/core';
2
2
  /**
3
- * Display a simple row of selectable tabs.
3
+ * Display a simple row of selectable tabs. This is a controlled element.
4
+ * The parent must adjust selectedTab as selection events are fired.
4
5
  */
5
6
  export class VerdocsTabs {
6
7
  constructor() {
7
8
  this.tabs = [];
8
- this.defaultTab = 0;
9
9
  this.selectedTab = 0;
10
10
  }
11
- componentWillLoad() {
12
- this.selectedTab = this.defaultTab || 0;
13
- }
14
11
  handleSelectTab(index) {
15
12
  var _a;
16
- this.selectedTab = index;
17
13
  (_a = this.selectTab) === null || _a === void 0 ? void 0 : _a.emit({ tab: this.tabs[index], index });
18
14
  }
19
15
  render() {
@@ -52,7 +48,7 @@ export class VerdocsTabs {
52
48
  },
53
49
  "defaultValue": "[]"
54
50
  },
55
- "defaultTab": {
51
+ "selectedTab": {
56
52
  "type": "number",
57
53
  "mutable": false,
58
54
  "complexType": {
@@ -64,19 +60,14 @@ export class VerdocsTabs {
64
60
  "optional": false,
65
61
  "docs": {
66
62
  "tags": [],
67
- "text": "The index of the initial tab to select."
63
+ "text": "The index of the tab to show selected."
68
64
  },
69
- "attribute": "default-tab",
65
+ "attribute": "selected-tab",
70
66
  "reflect": false,
71
67
  "defaultValue": "0"
72
68
  }
73
69
  };
74
70
  }
75
- static get states() {
76
- return {
77
- "selectedTab": {}
78
- };
79
- }
80
71
  static get events() {
81
72
  return [{
82
73
  "method": "selectTab",
@@ -4,22 +4,13 @@ export default {
4
4
  component: 'verdocs-tabs',
5
5
  args: {
6
6
  tabs: [
7
- { id: 'id', header: 'ID' },
8
- { id: 'name', header: 'Name' },
9
- {
10
- id: 'date',
11
- header: 'Date',
12
- renderHeader: () => 'Past Due Since',
13
- renderCell: (_, row) => `<span style="color: red">${new Date(row.date).toLocaleDateString()}</a>`,
14
- },
15
- ],
16
- data: [
17
- { id: '123', name: 'Test 1', date: new Date() },
18
- { id: '456', name: 'Test 2', date: new Date() },
7
+ { id: 'tab1', label: 'Tab 1' },
8
+ { id: 'tab2', label: 'Tab 2', disabled: true },
9
+ { id: 'tab3', label: 'Tab 3' },
19
10
  ],
20
11
  },
21
12
  parameters: {
22
13
  layout: 'fullscreen',
23
14
  },
24
15
  };
25
- export const Table = ({ columns, data }) => html `<verdocs-table .columns=${columns} .data=${data} />`;
16
+ export const Tabs = ({ tabs }) => html `<verdocs-tabs .tabs=${tabs} />`;
@@ -3,45 +3,12 @@ verdocs-build {
3
3
  flex-direction: column;
4
4
  font-family: "Inter", -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;
5
5
  }
6
- verdocs-build .steps {
7
- flex: 0;
8
- gap: 10px;
9
- display: flex;
10
- align-items: center;
11
- flex-direction: row;
12
- padding: 5px 20px 0 10px;
13
- background-color: #f2f5fa;
14
- border-bottom: 1px solid #cccccc;
15
- }
16
- verdocs-build .steps .step {
17
- border: none;
18
- height: 40px;
19
- display: flex;
20
- color: #ffffff;
21
- cursor: pointer;
22
- padding: 0 20px;
23
- font-size: 13px;
24
- font-weight: 600;
25
- align-items: center;
26
- justify-content: center;
27
- text-transform: uppercase;
28
- border-top-left-radius: 5px;
29
- border-top-right-radius: 5px;
30
- background-color: #666666;
31
- }
32
- verdocs-build .steps .step:disabled {
33
- cursor: inherit;
34
- background-color: #aaaaaa;
35
- }
36
- verdocs-build .steps .step.active {
37
- background-color: #707ae5;
38
- }
39
6
  verdocs-build .content {
40
7
  flex: 1;
8
+ gap: 20px;
41
9
  display: flex;
42
10
  align-items: center;
43
11
  flex-direction: column;
44
- box-shadow: 0 0 7px -3px #000000cc;
45
12
  }
46
13
  verdocs-build verdocs-template-attachments,
47
14
  verdocs-build verdocs-template-roles {
@@ -1,6 +1,5 @@
1
1
  import { VerdocsEndpoint } from '@verdocs/js-sdk';
2
- import { h, Host } from '@stencil/core';
3
- import { userCanBuildTemplate, userCanPreviewTemplate, userCanUpdateTemplate } from '@verdocs/js-sdk/Templates/Permissions';
2
+ import { h, forceUpdate, Host } from '@stencil/core';
4
3
  import { getTemplateStore } from '../../../utils/TemplateStore';
5
4
  import { SDKError } from '../../../utils/errors';
6
5
  /**
@@ -8,35 +7,62 @@ import { SDKError } from '../../../utils/errors';
8
7
  */
9
8
  export class VerdocsBuild {
10
9
  constructor() {
11
- this.store = null;
12
10
  this.endpoint = VerdocsEndpoint.getDefault();
13
11
  this.templateId = null;
14
- this.step = null;
12
+ this.step = 'preview';
13
+ this.store = null;
14
+ }
15
+ onTemplateIdChanged(newTemplateId) {
16
+ console.log('Template ID changed', newTemplateId);
17
+ this.loadTemplate(newTemplateId).catch((e) => console.log('Unknown Error', e));
18
+ }
19
+ onStepChanged(newStep) {
20
+ console.log('Step changed', newStep);
21
+ this.loadTemplate(this.templateId).catch((e) => console.log('Unknown Error', e));
15
22
  }
16
23
  async componentWillLoad() {
17
24
  var _a, _b, _c;
18
25
  try {
19
26
  this.endpoint.loadSession();
20
27
  if (!this.templateId) {
21
- console.log(`[BUILD] Missing required template ID ${this.templateId}`);
28
+ console.log(`[BUILD] No template ID, activating upload mode`);
29
+ this.step = 'attachments';
22
30
  return;
23
31
  }
24
32
  if (!this.endpoint.session) {
25
33
  console.log('[BUILD] Unable to start builder session, must be authenticated');
26
34
  return;
27
35
  }
28
- this.step = 'roles';
29
- this.store = await getTemplateStore(this.endpoint, this.templateId, true);
36
+ this.loadTemplate(this.templateId).catch(e => console.log('[BUILD] Unable to load template', e));
30
37
  }
31
38
  catch (e) {
32
39
  console.log('[BUILD] Error loading template', e);
33
40
  (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(new SDKError(e.message, (_b = e.response) === null || _b === void 0 ? void 0 : _b.status, (_c = e.response) === null || _c === void 0 ? void 0 : _c.data));
34
41
  }
35
42
  }
43
+ async loadTemplate(templateId) {
44
+ if (templateId) {
45
+ console.log('Loading store', templateId);
46
+ this.store = await getTemplateStore(this.endpoint, templateId, true);
47
+ forceUpdate(this.el);
48
+ }
49
+ }
36
50
  handleCancel(e) {
37
51
  console.log('Cancel', e.detail);
38
52
  this.step = 'preview';
39
53
  }
54
+ async handleTemplateCreated(templateId) {
55
+ var _a;
56
+ await this.loadTemplate(templateId);
57
+ this.templateId = templateId;
58
+ this.step = 'roles';
59
+ (_a = this.stepChanged) === null || _a === void 0 ? void 0 : _a.emit('roles');
60
+ }
61
+ async handleTemplateUpdated(e) {
62
+ var _a;
63
+ console.log('tup');
64
+ (_a = this.templateUpdated) === null || _a === void 0 ? void 0 : _a.emit(e.detail);
65
+ }
40
66
  handleAttachmentsNext() {
41
67
  var _a;
42
68
  this.step = 'roles';
@@ -47,10 +73,9 @@ export class VerdocsBuild {
47
73
  this.step = 'fields';
48
74
  (_a = this.stepChanged) === null || _a === void 0 ? void 0 : _a.emit('fields');
49
75
  }
50
- setStep(e, step) {
76
+ handleStepChanged(step) {
51
77
  var _a;
52
- e.stopPropagation();
53
- e.preventDefault();
78
+ console.log('osc', step);
54
79
  this.step = step;
55
80
  (_a = this.stepChanged) === null || _a === void 0 ? void 0 : _a.emit(step);
56
81
  }
@@ -58,10 +83,12 @@ export class VerdocsBuild {
58
83
  if (!this.endpoint.session) {
59
84
  return (h(Host, null, h("verdocs-component-error", { message: "You must be authenticated to use this module." })));
60
85
  }
61
- const canPreview = userCanPreviewTemplate(this.endpoint.session, this.store.state);
62
- const canEditFields = userCanBuildTemplate(this.endpoint.session, this.store.state);
63
- const canEditRoles = userCanUpdateTemplate(this.endpoint.session, this.store.state);
64
- return (h(Host, null, h("div", { class: "steps" }, h("button", { class: `step ${this.step === 'attachments' ? 'active' : ''}`, onClick: e => this.setStep(e, 'attachments') }, "Attachments"), h("button", { class: `step ${this.step === 'roles' ? 'active' : ''}`, onClick: e => this.setStep(e, 'roles'), disabled: !canEditRoles }, "Roles"), h("button", { class: `step ${this.step === 'settings' ? 'active' : ''}`, onClick: e => this.setStep(e, 'settings'), disabled: !canEditFields }, "Settings"), h("button", { class: `step ${this.step === 'fields' ? 'active' : ''}`, onClick: e => this.setStep(e, 'fields'), disabled: !canEditFields }, "Fields"), h("button", { class: `step ${this.step === 'preview' ? 'active' : ''}`, onClick: e => this.setStep(e, 'preview'), disabled: !canPreview }, "Preview/Send")), h("div", { class: "content" }, this.step === 'attachments' && (h("verdocs-template-attachments", { templateId: this.templateId, endpoint: this.endpoint, onExit: e => this.handleCancel(e), onNext: () => this.handleAttachmentsNext() })), this.step === 'roles' && (h("verdocs-template-roles", { templateId: this.templateId, endpoint: this.endpoint, onExit: e => this.handleCancel(e), onNext: () => this.handleRolesNext() })), this.step === 'settings' && (h("div", { style: { flexDirection: 'column', gap: '20px', display: 'flex', maxWidth: '400px', margin: '20px' } }, h("verdocs-template-name", { templateId: this.templateId, endpoint: this.endpoint, style: { backgroundColor: '#ffffff', padding: '20px' } }), h("verdocs-template-reminders", { templateId: this.templateId, endpoint: this.endpoint, style: { backgroundColor: '#ffffff', padding: '20px' } }), h("verdocs-template-visibility", { templateId: this.templateId, endpoint: this.endpoint, style: { backgroundColor: '#ffffff', padding: '20px' } }))), this.step === 'fields' && h("verdocs-template-fields", { templateId: this.templateId, endpoint: this.endpoint }), this.step === 'preview' && (h("div", { style: { flexDirection: 'row', display: 'flex', width: '100%', backgroundColor: '#eeeeee', maxHeight: '100%' } }, h("div", { style: { display: 'flex', flex: '0 0 300px', backgroundColor: '#ffffff', boxShadow: '1px 1px 6px -2px #0000007f' } }, h("verdocs-send", { templateId: this.templateId, endpoint: this.endpoint, onSend: e => { var _a; return (_a = this.send) === null || _a === void 0 ? void 0 : _a.emit(e.detail); }, style: { width: '100%' } })), h("div", { style: { display: 'flex', flex: '1', justifyContent: 'center', overflowY: 'scroll' } }, h("verdocs-preview", { templateId: this.templateId, endpoint: this.endpoint, style: { display: 'flex', flex: '1', maxWidth: '1000px' } })))))));
86
+ if (!this.store) {
87
+ console.log('[BUILD] No template ID, rendering created view');
88
+ return (h(Host, null, h("div", { class: "content" }, h("verdocs-template-build-tabs", { endpoint: this.endpoint, templateId: this.templateId, step: "attachments", onSdkError: e => { var _a; return (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(e.detail); }, onStepChanged: e => this.handleStepChanged(e.detail) }), h("verdocs-template-create", { endpoint: this.endpoint, onExit: e => this.handleCancel(e), onNext: () => this.handleAttachmentsNext(), onTemplateCreated: e => this.handleTemplateCreated(e.detail.templateId) }))));
89
+ }
90
+ console.log('[BUILD] Rendering build view', this.step, ['attachments', 'roles', 'settings', 'fields', 'preview'].indexOf(this.step));
91
+ return (h(Host, null, h("div", { class: "content" }, h("verdocs-template-build-tabs", { endpoint: this.endpoint, templateId: this.templateId, step: this.step, onSdkError: e => { var _a; return (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(e.detail); }, onStepChanged: e => this.handleStepChanged(e.detail) }), this.step === 'attachments' && (h("verdocs-template-attachments", { templateId: this.templateId, endpoint: this.endpoint, onExit: e => this.handleCancel(e), onNext: () => this.handleAttachmentsNext(), onTemplateUpdated: e => this.handleTemplateUpdated(e) })), this.step === 'roles' && (h("verdocs-template-roles", { templateId: this.templateId, endpoint: this.endpoint, onExit: e => this.handleCancel(e), onNext: () => this.handleRolesNext(), onTemplateUpdated: e => this.handleTemplateUpdated(e) })), this.step === 'settings' && (h("div", { style: { flexDirection: 'column', gap: '20px', display: 'flex', maxWidth: '400px', margin: '20px' } }, h("verdocs-template-name", { templateId: this.templateId, endpoint: this.endpoint, style: { backgroundColor: '#ffffff', padding: '20px' }, onTemplateUpdated: e => this.handleTemplateUpdated(e) }), h("verdocs-template-reminders", { templateId: this.templateId, endpoint: this.endpoint, style: { backgroundColor: '#ffffff', padding: '20px' }, onTemplateUpdated: e => this.handleTemplateUpdated(e) }), h("verdocs-template-visibility", { templateId: this.templateId, endpoint: this.endpoint, style: { backgroundColor: '#ffffff', padding: '20px' }, onTemplateUpdated: e => this.handleTemplateUpdated(e) }))), this.step === 'fields' && h("verdocs-template-fields", { templateId: this.templateId, endpoint: this.endpoint, onTemplateUpdated: e => this.handleTemplateUpdated(e) }), this.step === 'preview' && (h("div", { style: { flexDirection: 'row', display: 'flex', width: '100%', backgroundColor: '#eeeeee', maxHeight: '100%' } }, h("div", { style: { display: 'flex', flex: '0 0 300px', backgroundColor: '#ffffff', boxShadow: '1px 1px 6px -2px #0000007f' } }, h("verdocs-send", { templateId: this.templateId, endpoint: this.endpoint, onSend: e => { var _a; return (_a = this.send) === null || _a === void 0 ? void 0 : _a.emit(e.detail); }, style: { width: '100%' } })), h("div", { style: { display: 'flex', flex: '1', justifyContent: 'center', overflowY: 'scroll' } }, h("verdocs-preview", { templateId: this.templateId, endpoint: this.endpoint, style: { display: 'flex', flex: '1', maxWidth: '1000px' } })))))));
65
92
  }
66
93
  static get is() { return "verdocs-build"; }
67
94
  static get originalStyleUrls() {
@@ -99,7 +126,7 @@ export class VerdocsBuild {
99
126
  },
100
127
  "templateId": {
101
128
  "type": "string",
102
- "mutable": false,
129
+ "mutable": true,
103
130
  "complexType": {
104
131
  "original": "string | null",
105
132
  "resolved": "string",
@@ -112,7 +139,7 @@ export class VerdocsBuild {
112
139
  "text": "The ID of the template to create the document from. Unlike most other components, this is an optional parameter here.\nIf the template ID is known, `step` may also be specified to force displaying a specific step in the creation process.\nIf it is not specified, `step` will be ignored and the create step will be shown."
113
140
  },
114
141
  "attribute": "template-id",
115
- "reflect": false,
142
+ "reflect": true,
116
143
  "defaultValue": "null"
117
144
  },
118
145
  "step": {
@@ -135,10 +162,15 @@ export class VerdocsBuild {
135
162
  },
136
163
  "attribute": "step",
137
164
  "reflect": true,
138
- "defaultValue": "null"
165
+ "defaultValue": "'preview'"
139
166
  }
140
167
  };
141
168
  }
169
+ static get states() {
170
+ return {
171
+ "store": {}
172
+ };
173
+ }
142
174
  static get events() {
143
175
  return [{
144
176
  "method": "sdkError",
@@ -199,6 +231,64 @@ export class VerdocsBuild {
199
231
  }
200
232
  }
201
233
  }
234
+ }, {
235
+ "method": "templateUpdated",
236
+ "name": "templateUpdated",
237
+ "bubbles": true,
238
+ "cancelable": true,
239
+ "composed": true,
240
+ "docs": {
241
+ "tags": [],
242
+ "text": "Event fired when the template is updated in any way. May be used for tasks such as cache invalidation or reporting to other systems."
243
+ },
244
+ "complexType": {
245
+ "original": "{endpoint: VerdocsEndpoint; template: ITemplate; event: string}",
246
+ "resolved": "{ endpoint: VerdocsEndpoint; template: ITemplate; event: string; }",
247
+ "references": {
248
+ "VerdocsEndpoint": {
249
+ "location": "import",
250
+ "path": "@verdocs/js-sdk"
251
+ },
252
+ "ITemplate": {
253
+ "location": "import",
254
+ "path": "@verdocs/js-sdk/Templates/Types"
255
+ }
256
+ }
257
+ }
258
+ }, {
259
+ "method": "templateCreated",
260
+ "name": "templateCreated",
261
+ "bubbles": true,
262
+ "cancelable": true,
263
+ "composed": true,
264
+ "docs": {
265
+ "tags": [],
266
+ "text": "Event fired when the template is created by the upload step."
267
+ },
268
+ "complexType": {
269
+ "original": "{endpoint: VerdocsEndpoint; template: ITemplate; event: string}",
270
+ "resolved": "{ endpoint: VerdocsEndpoint; template: ITemplate; event: string; }",
271
+ "references": {
272
+ "VerdocsEndpoint": {
273
+ "location": "import",
274
+ "path": "@verdocs/js-sdk"
275
+ },
276
+ "ITemplate": {
277
+ "location": "import",
278
+ "path": "@verdocs/js-sdk/Templates/Types"
279
+ }
280
+ }
281
+ }
282
+ }];
283
+ }
284
+ static get elementRef() { return "el"; }
285
+ static get watchers() {
286
+ return [{
287
+ "propName": "templateId",
288
+ "methodName": "onTemplateIdChanged"
289
+ }, {
290
+ "propName": "step",
291
+ "methodName": "onStepChanged"
202
292
  }];
203
293
  }
204
294
  }
@@ -3,7 +3,7 @@ export default {
3
3
  title: 'Embeds/Build',
4
4
  component: 'verdocs-build',
5
5
  args: {
6
- templateId: '90c2e63d-6b61-4dd2-a2e2-e137778f5ab5',
6
+ templateId: '',
7
7
  step: 'preview',
8
8
  },
9
9
  parameters: {
@@ -52,7 +52,7 @@ export class VerdocsTemplateAttachments {
52
52
  }
53
53
  }
54
54
  async handleUpload(e) {
55
- var _a, _b, _c;
55
+ var _a, _b, _c, _d;
56
56
  e.stopPropagation();
57
57
  const file = e.detail.file;
58
58
  if (!file) {
@@ -65,14 +65,15 @@ export class VerdocsTemplateAttachments {
65
65
  const template = await createTemplateDocument(this.endpoint, this.templateId, file, this.handleUploadProgress.bind(this));
66
66
  console.log('[ATTACHMENTS] Created attachment', template);
67
67
  this.store = await getTemplateStore(this.endpoint, this.templateId, true);
68
- console.log('[ATTACHMENTS] New template', this.store.state);
68
+ console.log('[ATTACHMENTS] Updated template', this.store.state);
69
+ (_a = this.templateUpdated) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, template: this.store.state, event: 'attachments' });
69
70
  this.uploading = false;
70
71
  this.progressLabel = '';
71
72
  this.progressPercent = 0;
72
73
  }
73
74
  catch (e) {
74
75
  console.log('[ATTACHMENTS] Error creating template', e);
75
- (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(new SDKError(e.message, (_b = e.response) === null || _b === void 0 ? void 0 : _b.status, (_c = e.response) === null || _c === void 0 ? void 0 : _c.data));
76
+ (_b = this.sdkError) === null || _b === void 0 ? void 0 : _b.emit(new SDKError(e.message, (_c = e.response) === null || _c === void 0 ? void 0 : _c.status, (_d = e.response) === null || _d === void 0 ? void 0 : _d.data));
76
77
  this.uploading = false;
77
78
  }
78
79
  }
@@ -231,19 +232,23 @@ export class VerdocsTemplateAttachments {
231
232
  }
232
233
  }
233
234
  }, {
234
- "method": "templateUpdate",
235
- "name": "templateUpdate",
235
+ "method": "templateUpdated",
236
+ "name": "templateUpdated",
236
237
  "bubbles": true,
237
238
  "cancelable": true,
238
239
  "composed": true,
239
240
  "docs": {
240
241
  "tags": [],
241
- "text": "Event fired when the user clicks the next button."
242
+ "text": "Event fired when the user updates the template."
242
243
  },
243
244
  "complexType": {
244
- "original": "{template: ITemplate}",
245
- "resolved": "{ template: ITemplate; }",
245
+ "original": "{endpoint: VerdocsEndpoint; template: ITemplate; event: string}",
246
+ "resolved": "{ endpoint: VerdocsEndpoint; template: ITemplate; event: string; }",
246
247
  "references": {
248
+ "VerdocsEndpoint": {
249
+ "location": "import",
250
+ "path": "@verdocs/js-sdk"
251
+ },
247
252
  "ITemplate": {
248
253
  "location": "import",
249
254
  "path": "@verdocs/js-sdk/Templates/Types"
@@ -0,0 +1,25 @@
1
+ verdocs-template-build-tabs {
2
+ flex: 1;
3
+ gap: 20px;
4
+ display: flex;
5
+ align-items: center;
6
+ flex-direction: column;
7
+ font-family: "Inter", -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;
8
+ }
9
+ verdocs-template-build-tabs verdocs-template-attachments,
10
+ verdocs-template-build-tabs verdocs-template-roles {
11
+ margin: 20px;
12
+ }
13
+ verdocs-template-build-tabs verdocs-template-fields {
14
+ border-top: 1px solid #777777;
15
+ }
16
+ verdocs-template-build-tabs verdocs-template-attachments {
17
+ padding: 20px;
18
+ background: #ffffff;
19
+ }
20
+ verdocs-template-build-tabs verdocs-template-fields {
21
+ width: 100%;
22
+ }
23
+ verdocs-template-build-tabs verdocs-preview {
24
+ flex: 1;
25
+ }