@nyaruka/temba-components 0.139.0 → 0.141.0

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 (385) hide show
  1. package/.github/workflows/cla.yml +1 -1
  2. package/.github/workflows/copilot-setup-steps.yml +6 -1
  3. package/.lintstagedrc.js +10 -0
  4. package/CHANGELOG.md +32 -0
  5. package/demo/data/flows/sample-flow.json +24 -0
  6. package/dist/locales/es.js +5 -5
  7. package/dist/locales/es.js.map +1 -1
  8. package/dist/locales/fr.js +5 -5
  9. package/dist/locales/fr.js.map +1 -1
  10. package/dist/locales/locale-codes.js +11 -2
  11. package/dist/locales/locale-codes.js.map +1 -1
  12. package/dist/locales/pt.js +5 -5
  13. package/dist/locales/pt.js.map +1 -1
  14. package/dist/temba-components.js +702 -338
  15. package/dist/temba-components.js.map +1 -1
  16. package/out-tsc/src/display/Chat.js +10 -7
  17. package/out-tsc/src/display/Chat.js.map +1 -1
  18. package/out-tsc/src/display/Dropdown.js +3 -1
  19. package/out-tsc/src/display/Dropdown.js.map +1 -1
  20. package/out-tsc/src/display/FloatingTab.js +4 -4
  21. package/out-tsc/src/display/FloatingTab.js.map +1 -1
  22. package/out-tsc/src/display/Thumbnail.js +163 -5
  23. package/out-tsc/src/display/Thumbnail.js.map +1 -1
  24. package/out-tsc/src/flow/CanvasNode.js +65 -23
  25. package/out-tsc/src/flow/CanvasNode.js.map +1 -1
  26. package/out-tsc/src/flow/Editor.js +369 -49
  27. package/out-tsc/src/flow/Editor.js.map +1 -1
  28. package/out-tsc/src/flow/NodeEditor.js +118 -10
  29. package/out-tsc/src/flow/NodeEditor.js.map +1 -1
  30. package/out-tsc/src/flow/Plumber.js +61 -14
  31. package/out-tsc/src/flow/Plumber.js.map +1 -1
  32. package/out-tsc/src/flow/StickyNote.js +13 -4
  33. package/out-tsc/src/flow/StickyNote.js.map +1 -1
  34. package/out-tsc/src/flow/actions/add_contact_groups.js +4 -1
  35. package/out-tsc/src/flow/actions/add_contact_groups.js.map +1 -1
  36. package/out-tsc/src/flow/actions/add_input_labels.js +4 -1
  37. package/out-tsc/src/flow/actions/add_input_labels.js.map +1 -1
  38. package/out-tsc/src/flow/actions/audio-player.js +112 -0
  39. package/out-tsc/src/flow/actions/audio-player.js.map +1 -0
  40. package/out-tsc/src/flow/actions/enter_flow.js +43 -0
  41. package/out-tsc/src/flow/actions/enter_flow.js.map +1 -0
  42. package/out-tsc/src/flow/actions/play_audio.js +57 -4
  43. package/out-tsc/src/flow/actions/play_audio.js.map +1 -1
  44. package/out-tsc/src/flow/actions/remove_contact_groups.js +6 -1
  45. package/out-tsc/src/flow/actions/remove_contact_groups.js.map +1 -1
  46. package/out-tsc/src/flow/actions/say_msg.js +86 -3
  47. package/out-tsc/src/flow/actions/say_msg.js.map +1 -1
  48. package/out-tsc/src/flow/actions/send_broadcast.js +6 -2
  49. package/out-tsc/src/flow/actions/send_broadcast.js.map +1 -1
  50. package/out-tsc/src/flow/actions/set_contact_channel.js +13 -0
  51. package/out-tsc/src/flow/actions/set_contact_channel.js.map +1 -1
  52. package/out-tsc/src/flow/actions/set_contact_status.js +7 -5
  53. package/out-tsc/src/flow/actions/set_contact_status.js.map +1 -1
  54. package/out-tsc/src/flow/actions/start_session.js +10 -3
  55. package/out-tsc/src/flow/actions/start_session.js.map +1 -1
  56. package/out-tsc/src/flow/config.js +11 -3
  57. package/out-tsc/src/flow/config.js.map +1 -1
  58. package/out-tsc/src/flow/nodes/shared-rules.js +1 -1
  59. package/out-tsc/src/flow/nodes/shared-rules.js.map +1 -1
  60. package/out-tsc/src/flow/nodes/split_by_contact_field.js +18 -5
  61. package/out-tsc/src/flow/nodes/split_by_contact_field.js.map +1 -1
  62. package/out-tsc/src/flow/nodes/split_by_expression.js +1 -1
  63. package/out-tsc/src/flow/nodes/split_by_expression.js.map +1 -1
  64. package/out-tsc/src/flow/nodes/split_by_llm_categorize.js +0 -1
  65. package/out-tsc/src/flow/nodes/split_by_llm_categorize.js.map +1 -1
  66. package/out-tsc/src/flow/nodes/split_by_random.js +0 -1
  67. package/out-tsc/src/flow/nodes/split_by_random.js.map +1 -1
  68. package/out-tsc/src/flow/nodes/split_by_run_result.js +10 -4
  69. package/out-tsc/src/flow/nodes/split_by_run_result.js.map +1 -1
  70. package/out-tsc/src/flow/nodes/terminal.js +7 -0
  71. package/out-tsc/src/flow/nodes/terminal.js.map +1 -0
  72. package/out-tsc/src/flow/nodes/wait_for_audio.js +77 -0
  73. package/out-tsc/src/flow/nodes/wait_for_audio.js.map +1 -0
  74. package/out-tsc/src/flow/nodes/wait_for_dial.js +151 -0
  75. package/out-tsc/src/flow/nodes/wait_for_dial.js.map +1 -0
  76. package/out-tsc/src/flow/nodes/wait_for_digits.js +61 -1
  77. package/out-tsc/src/flow/nodes/wait_for_digits.js.map +1 -1
  78. package/out-tsc/src/flow/nodes/wait_for_menu.js +173 -2
  79. package/out-tsc/src/flow/nodes/wait_for_menu.js.map +1 -1
  80. package/out-tsc/src/flow/nodes/wait_for_response.js +1 -1
  81. package/out-tsc/src/flow/nodes/wait_for_response.js.map +1 -1
  82. package/out-tsc/src/flow/operators.js +21 -5
  83. package/out-tsc/src/flow/operators.js.map +1 -1
  84. package/out-tsc/src/flow/types.js.map +1 -1
  85. package/out-tsc/src/flow/utils.js +79 -3
  86. package/out-tsc/src/flow/utils.js.map +1 -1
  87. package/out-tsc/src/form/ArrayEditor.js +4 -2
  88. package/out-tsc/src/form/ArrayEditor.js.map +1 -1
  89. package/out-tsc/src/form/FieldRenderer.js +56 -0
  90. package/out-tsc/src/form/FieldRenderer.js.map +1 -1
  91. package/out-tsc/src/interfaces.js +1 -0
  92. package/out-tsc/src/interfaces.js.map +1 -1
  93. package/out-tsc/src/layout/Dialog.js +51 -7
  94. package/out-tsc/src/layout/Dialog.js.map +1 -1
  95. package/out-tsc/src/layout/Modax.js +20 -2
  96. package/out-tsc/src/layout/Modax.js.map +1 -1
  97. package/out-tsc/src/list/ContentMenu.js +14 -1
  98. package/out-tsc/src/list/ContentMenu.js.map +1 -1
  99. package/out-tsc/src/locales/es.js +5 -5
  100. package/out-tsc/src/locales/es.js.map +1 -1
  101. package/out-tsc/src/locales/fr.js +5 -5
  102. package/out-tsc/src/locales/fr.js.map +1 -1
  103. package/out-tsc/src/locales/locale-codes.js +11 -2
  104. package/out-tsc/src/locales/locale-codes.js.map +1 -1
  105. package/out-tsc/src/locales/pt.js +5 -5
  106. package/out-tsc/src/locales/pt.js.map +1 -1
  107. package/out-tsc/src/simulator/Simulator.js +21 -4
  108. package/out-tsc/src/simulator/Simulator.js.map +1 -1
  109. package/out-tsc/src/store/AppState.js +102 -3
  110. package/out-tsc/src/store/AppState.js.map +1 -1
  111. package/out-tsc/test/actions/add_contact_groups.test.js +35 -0
  112. package/out-tsc/test/actions/add_contact_groups.test.js.map +1 -1
  113. package/out-tsc/test/actions/add_input_labels.test.js +53 -0
  114. package/out-tsc/test/actions/add_input_labels.test.js.map +1 -0
  115. package/out-tsc/test/actions/enter_flow.test.js +71 -0
  116. package/out-tsc/test/actions/enter_flow.test.js.map +1 -0
  117. package/out-tsc/test/actions/play_audio.test.js +118 -0
  118. package/out-tsc/test/actions/play_audio.test.js.map +1 -0
  119. package/out-tsc/test/actions/remove_contact_groups.test.js +24 -0
  120. package/out-tsc/test/actions/remove_contact_groups.test.js.map +1 -1
  121. package/out-tsc/test/actions/say_msg.test.js +158 -0
  122. package/out-tsc/test/actions/say_msg.test.js.map +1 -0
  123. package/out-tsc/test/actions/send_broadcast.test.js +41 -0
  124. package/out-tsc/test/actions/send_broadcast.test.js.map +1 -1
  125. package/out-tsc/test/actions/set_contact_channel.test.js +67 -0
  126. package/out-tsc/test/actions/set_contact_channel.test.js.map +1 -0
  127. package/out-tsc/test/actions/set_contact_field.test.js +52 -0
  128. package/out-tsc/test/actions/set_contact_field.test.js.map +1 -0
  129. package/out-tsc/test/actions/set_contact_language.test.js +39 -0
  130. package/out-tsc/test/actions/set_contact_language.test.js.map +1 -0
  131. package/out-tsc/test/actions/set_contact_name.test.js +28 -0
  132. package/out-tsc/test/actions/set_contact_name.test.js.map +1 -0
  133. package/out-tsc/test/actions/set_contact_status.test.js +44 -0
  134. package/out-tsc/test/actions/set_contact_status.test.js.map +1 -0
  135. package/out-tsc/test/actions/set_run_result.test.js +47 -0
  136. package/out-tsc/test/actions/set_run_result.test.js.map +1 -0
  137. package/out-tsc/test/actions/start_session.test.js +76 -0
  138. package/out-tsc/test/actions/start_session.test.js.map +1 -1
  139. package/out-tsc/test/nodes/split_by_contact_field.test.js +50 -0
  140. package/out-tsc/test/nodes/split_by_contact_field.test.js.map +1 -1
  141. package/out-tsc/test/nodes/split_by_run_result.test.js +82 -0
  142. package/out-tsc/test/nodes/split_by_run_result.test.js.map +1 -1
  143. package/out-tsc/test/nodes/split_by_ticket.test.js +139 -0
  144. package/out-tsc/test/nodes/split_by_ticket.test.js.map +1 -0
  145. package/out-tsc/test/nodes/split_by_webhook.test.js +111 -0
  146. package/out-tsc/test/nodes/split_by_webhook.test.js.map +1 -0
  147. package/out-tsc/test/nodes/wait_for_audio.test.js +156 -0
  148. package/out-tsc/test/nodes/wait_for_audio.test.js.map +1 -0
  149. package/out-tsc/test/nodes/wait_for_dial.test.js +336 -0
  150. package/out-tsc/test/nodes/wait_for_dial.test.js.map +1 -0
  151. package/out-tsc/test/nodes/wait_for_digits.test.js +198 -84
  152. package/out-tsc/test/nodes/wait_for_digits.test.js.map +1 -1
  153. package/out-tsc/test/nodes/wait_for_menu.test.js +340 -0
  154. package/out-tsc/test/nodes/wait_for_menu.test.js.map +1 -0
  155. package/out-tsc/test/temba-flow-collision.test.js +261 -6
  156. package/out-tsc/test/temba-flow-collision.test.js.map +1 -1
  157. package/out-tsc/test/temba-flow-editor.test.js +187 -0
  158. package/out-tsc/test/temba-flow-editor.test.js.map +1 -1
  159. package/out-tsc/test/temba-flow-plumber.test.js +19 -0
  160. package/out-tsc/test/temba-flow-plumber.test.js.map +1 -1
  161. package/out-tsc/test/temba-node-type-selector.test.js +6 -6
  162. package/out-tsc/test/temba-node-type-selector.test.js.map +1 -1
  163. package/out-tsc/test/temba-select.test.js +4 -1
  164. package/out-tsc/test/temba-select.test.js.map +1 -1
  165. package/out-tsc/test/utils.test.js +4 -2
  166. package/out-tsc/test/utils.test.js.map +1 -1
  167. package/package.json +3 -9
  168. package/screenshots/truth/actions/add_contact_groups/render/descriptive-group-names.png +0 -0
  169. package/screenshots/truth/actions/add_contact_groups/render/long-group-names.png +0 -0
  170. package/screenshots/truth/actions/add_contact_groups/render/many-groups.png +0 -0
  171. package/screenshots/truth/actions/add_contact_groups/render/multiple-groups.png +0 -0
  172. package/screenshots/truth/actions/add_contact_groups/render/single-group.png +0 -0
  173. package/screenshots/truth/actions/add_contact_urn/render/expression-facebook.png +0 -0
  174. package/screenshots/truth/actions/add_contact_urn/render/expression-phone.png +0 -0
  175. package/screenshots/truth/actions/add_contact_urn/render/facebook-id.png +0 -0
  176. package/screenshots/truth/actions/add_contact_urn/render/instagram-handle.png +0 -0
  177. package/screenshots/truth/actions/add_contact_urn/render/line-id.png +0 -0
  178. package/screenshots/truth/actions/add_contact_urn/render/phone-number.png +0 -0
  179. package/screenshots/truth/actions/add_contact_urn/render/telegram-id.png +0 -0
  180. package/screenshots/truth/actions/add_contact_urn/render/viber-id.png +0 -0
  181. package/screenshots/truth/actions/add_contact_urn/render/wechat-id.png +0 -0
  182. package/screenshots/truth/actions/add_contact_urn/render/whatsapp.png +0 -0
  183. package/screenshots/truth/actions/add_input_labels/editor/multiple-labels.png +0 -0
  184. package/screenshots/truth/actions/add_input_labels/editor/single-label.png +0 -0
  185. package/screenshots/truth/actions/add_input_labels/render/multiple-labels.png +0 -0
  186. package/screenshots/truth/actions/add_input_labels/render/single-label.png +0 -0
  187. package/screenshots/truth/actions/enter_flow/editor/basic-flow.png +0 -0
  188. package/screenshots/truth/actions/enter_flow/editor/long-flow-name.png +0 -0
  189. package/screenshots/truth/actions/enter_flow/render/basic-flow.png +0 -0
  190. package/screenshots/truth/actions/enter_flow/render/long-flow-name.png +0 -0
  191. package/screenshots/truth/actions/play_audio/editor/expression-url.png +0 -0
  192. package/screenshots/truth/actions/play_audio/editor/static-url.png +0 -0
  193. package/screenshots/truth/actions/play_audio/render/expression-url.png +0 -0
  194. package/screenshots/truth/actions/play_audio/render/static-url.png +0 -0
  195. package/screenshots/truth/actions/remove_contact_groups/render/cleanup-groups.png +0 -0
  196. package/screenshots/truth/actions/remove_contact_groups/render/long-descriptive-group-names.png +0 -0
  197. package/screenshots/truth/actions/remove_contact_groups/render/many-groups.png +0 -0
  198. package/screenshots/truth/actions/remove_contact_groups/render/multiple-groups.png +0 -0
  199. package/screenshots/truth/actions/remove_contact_groups/render/remove-from-all-groups.png +0 -0
  200. package/screenshots/truth/actions/remove_contact_groups/render/single-group.png +0 -0
  201. package/screenshots/truth/actions/say_msg/editor/multiline-text.png +0 -0
  202. package/screenshots/truth/actions/say_msg/editor/simple-text.png +0 -0
  203. package/screenshots/truth/actions/say_msg/editor/text-with-audio-url.png +0 -0
  204. package/screenshots/truth/actions/say_msg/render/multiline-text.png +0 -0
  205. package/screenshots/truth/actions/say_msg/render/simple-text.png +0 -0
  206. package/screenshots/truth/actions/say_msg/render/text-with-audio-url.png +0 -0
  207. package/screenshots/truth/actions/send_broadcast/render/contacts-only.png +0 -0
  208. package/screenshots/truth/actions/send_broadcast/render/groups-and-contacts.png +0 -0
  209. package/screenshots/truth/actions/send_broadcast/render/groups-only.png +0 -0
  210. package/screenshots/truth/actions/send_broadcast/render/many-groups.png +0 -0
  211. package/screenshots/truth/actions/send_broadcast/render/multiline-text.png +0 -0
  212. package/screenshots/truth/actions/send_email/render/complex-business-email.png +0 -0
  213. package/screenshots/truth/actions/send_email/render/empty-body.png +0 -0
  214. package/screenshots/truth/actions/send_email/render/empty-subject.png +0 -0
  215. package/screenshots/truth/actions/send_email/render/long-subject.png +0 -0
  216. package/screenshots/truth/actions/send_email/render/multiline-body.png +0 -0
  217. package/screenshots/truth/actions/send_email/render/multiple-recipients.png +0 -0
  218. package/screenshots/truth/actions/send_email/render/simple-email.png +0 -0
  219. package/screenshots/truth/actions/send_email/render/with-expressions.png +0 -0
  220. package/screenshots/truth/actions/send_msg/render/long-quick-replies.png +0 -0
  221. package/screenshots/truth/actions/send_msg/render/multiline-text-with-replies.png +0 -0
  222. package/screenshots/truth/actions/send_msg/render/simple-text.png +0 -0
  223. package/screenshots/truth/actions/send_msg/render/text-with-linebreaks.png +0 -0
  224. package/screenshots/truth/actions/send_msg/render/text-with-many-quick-replies.png +0 -0
  225. package/screenshots/truth/actions/send_msg/render/text-with-quick-replies.png +0 -0
  226. package/screenshots/truth/actions/send_msg/render/text-without-quick-replies.png +0 -0
  227. package/screenshots/truth/actions/set_contact_channel/editor/sms-channel.png +0 -0
  228. package/screenshots/truth/actions/set_contact_channel/editor/whatsapp-channel.png +0 -0
  229. package/screenshots/truth/actions/set_contact_channel/render/sms-channel.png +0 -0
  230. package/screenshots/truth/actions/set_contact_channel/render/whatsapp-channel.png +0 -0
  231. package/screenshots/truth/actions/set_contact_field/editor/clear-value.png +0 -0
  232. package/screenshots/truth/actions/set_contact_field/editor/set-value.png +0 -0
  233. package/screenshots/truth/actions/set_contact_field/render/clear-value.png +0 -0
  234. package/screenshots/truth/actions/set_contact_field/render/set-value.png +0 -0
  235. package/screenshots/truth/actions/set_contact_language/editor/english.png +0 -0
  236. package/screenshots/truth/actions/set_contact_language/editor/french.png +0 -0
  237. package/screenshots/truth/actions/set_contact_language/render/english.png +0 -0
  238. package/screenshots/truth/actions/set_contact_language/render/french.png +0 -0
  239. package/screenshots/truth/actions/set_contact_name/editor/expression-name.png +0 -0
  240. package/screenshots/truth/actions/set_contact_name/editor/static-name.png +0 -0
  241. package/screenshots/truth/actions/set_contact_name/render/expression-name.png +0 -0
  242. package/screenshots/truth/actions/set_contact_name/render/static-name.png +0 -0
  243. package/screenshots/truth/actions/set_contact_status/editor/active.png +0 -0
  244. package/screenshots/truth/actions/set_contact_status/editor/archived.png +0 -0
  245. package/screenshots/truth/actions/set_contact_status/editor/blocked.png +0 -0
  246. package/screenshots/truth/actions/set_contact_status/render/active.png +0 -0
  247. package/screenshots/truth/actions/set_contact_status/render/archived.png +0 -0
  248. package/screenshots/truth/actions/set_contact_status/render/blocked.png +0 -0
  249. package/screenshots/truth/actions/set_run_result/editor/expression-value.png +0 -0
  250. package/screenshots/truth/actions/set_run_result/editor/with-category.png +0 -0
  251. package/screenshots/truth/actions/set_run_result/render/expression-value.png +0 -0
  252. package/screenshots/truth/actions/set_run_result/render/with-category.png +0 -0
  253. package/screenshots/truth/actions/start_session/render/contact-query.png +0 -0
  254. package/screenshots/truth/actions/start_session/render/contacts-only.png +0 -0
  255. package/screenshots/truth/actions/start_session/render/create-contact.png +0 -0
  256. package/screenshots/truth/actions/start_session/render/groups-and-contacts.png +0 -0
  257. package/screenshots/truth/actions/start_session/render/groups-only.png +0 -0
  258. package/screenshots/truth/actions/start_session/render/many-recipients.png +0 -0
  259. package/screenshots/truth/editor/router.png +0 -0
  260. package/screenshots/truth/editor/wait.png +0 -0
  261. package/screenshots/truth/nodes/split_by_llm/render/information-extraction.png +0 -0
  262. package/screenshots/truth/nodes/split_by_llm/render/sentiment-analysis.png +0 -0
  263. package/screenshots/truth/nodes/split_by_llm/render/summarization.png +0 -0
  264. package/screenshots/truth/nodes/split_by_llm/render/translation-task.png +0 -0
  265. package/screenshots/truth/nodes/split_by_llm_categorize/editor/basic-categorization.png +0 -0
  266. package/screenshots/truth/nodes/split_by_llm_categorize/editor/custom-input-and-result-name.png +0 -0
  267. package/screenshots/truth/nodes/split_by_llm_categorize/editor/feedback-categorization.png +0 -0
  268. package/screenshots/truth/nodes/split_by_llm_categorize/editor/many-categories.png +0 -0
  269. package/screenshots/truth/nodes/split_by_llm_categorize/editor/minimal-categories.png +0 -0
  270. package/screenshots/truth/nodes/split_by_llm_categorize/render/basic-categorization.png +0 -0
  271. package/screenshots/truth/nodes/split_by_llm_categorize/render/custom-input-and-result-name.png +0 -0
  272. package/screenshots/truth/nodes/split_by_llm_categorize/render/feedback-categorization.png +0 -0
  273. package/screenshots/truth/nodes/split_by_llm_categorize/render/many-categories.png +0 -0
  274. package/screenshots/truth/nodes/split_by_llm_categorize/render/minimal-categories.png +0 -0
  275. package/screenshots/truth/nodes/split_by_random/editor/ab-test-multiple-variants.png +0 -0
  276. package/screenshots/truth/nodes/split_by_random/editor/sampling-split.png +0 -0
  277. package/screenshots/truth/nodes/split_by_random/editor/three-way-split.png +0 -0
  278. package/screenshots/truth/nodes/split_by_random/editor/two-bucket-split.png +0 -0
  279. package/screenshots/truth/nodes/split_by_random/render/ab-test-multiple-variants.png +0 -0
  280. package/screenshots/truth/nodes/split_by_random/render/sampling-split.png +0 -0
  281. package/screenshots/truth/nodes/split_by_random/render/three-way-split.png +0 -0
  282. package/screenshots/truth/nodes/split_by_random/render/two-bucket-split.png +0 -0
  283. package/screenshots/truth/nodes/wait_for_audio/editor/basic-audio-wait.png +0 -0
  284. package/screenshots/truth/nodes/wait_for_audio/render/basic-audio-wait.png +0 -0
  285. package/screenshots/truth/nodes/wait_for_dial/editor/basic-dial.png +0 -0
  286. package/screenshots/truth/nodes/wait_for_dial/editor/dial-with-limits.png +0 -0
  287. package/screenshots/truth/nodes/wait_for_dial/render/basic-dial.png +0 -0
  288. package/screenshots/truth/nodes/wait_for_dial/render/dial-with-limits.png +0 -0
  289. package/screenshots/truth/nodes/wait_for_digits/editor/basic-digits-wait.png +0 -0
  290. package/screenshots/truth/nodes/wait_for_digits/editor/digits-with-rules.png +0 -0
  291. package/screenshots/truth/nodes/wait_for_digits/render/basic-digits-wait.png +0 -0
  292. package/screenshots/truth/nodes/wait_for_digits/render/digits-with-rules.png +0 -0
  293. package/screenshots/truth/nodes/wait_for_menu/editor/menu-with-digits.png +0 -0
  294. package/screenshots/truth/nodes/wait_for_menu/render/menu-with-digits.png +0 -0
  295. package/screenshots/truth/nodes/wait_for_response/editor/basic-wait.png +0 -0
  296. package/screenshots/truth/nodes/wait_for_response/editor/custom-result-name.png +0 -0
  297. package/screenshots/truth/nodes/wait_for_response/editor/no-timeout.png +0 -0
  298. package/screenshots/truth/nodes/wait_for_response/editor/short-timeout.png +0 -0
  299. package/screenshots/truth/nodes/wait_for_response/render/basic-wait.png +0 -0
  300. package/screenshots/truth/nodes/wait_for_response/render/custom-result-name.png +0 -0
  301. package/screenshots/truth/nodes/wait_for_response/render/no-timeout.png +0 -0
  302. package/screenshots/truth/nodes/wait_for_response/render/short-timeout.png +0 -0
  303. package/src/display/Chat.ts +13 -7
  304. package/src/display/Dropdown.ts +3 -1
  305. package/src/display/FloatingTab.ts +4 -4
  306. package/src/display/Thumbnail.ts +162 -2
  307. package/src/flow/CanvasNode.ts +70 -24
  308. package/src/flow/Editor.ts +440 -99
  309. package/src/flow/NodeEditor.ts +137 -9
  310. package/src/flow/Plumber.ts +89 -14
  311. package/src/flow/StickyNote.ts +14 -4
  312. package/src/flow/actions/add_contact_groups.ts +4 -1
  313. package/src/flow/actions/add_input_labels.ts +4 -1
  314. package/src/flow/actions/audio-player.ts +127 -0
  315. package/src/flow/actions/enter_flow.ts +44 -0
  316. package/src/flow/actions/play_audio.ts +64 -5
  317. package/src/flow/actions/remove_contact_groups.ts +6 -1
  318. package/src/flow/actions/say_msg.ts +94 -4
  319. package/src/flow/actions/send_broadcast.ts +6 -2
  320. package/src/flow/actions/set_contact_channel.ts +13 -1
  321. package/src/flow/actions/set_contact_status.ts +7 -5
  322. package/src/flow/actions/start_session.ts +10 -3
  323. package/src/flow/config.ts +11 -3
  324. package/src/flow/nodes/shared-rules.ts +1 -1
  325. package/src/flow/nodes/split_by_contact_field.ts +16 -5
  326. package/src/flow/nodes/split_by_expression.ts +1 -1
  327. package/src/flow/nodes/split_by_llm_categorize.ts +0 -1
  328. package/src/flow/nodes/split_by_random.ts +0 -1
  329. package/src/flow/nodes/split_by_run_result.ts +10 -4
  330. package/src/flow/nodes/terminal.ts +9 -0
  331. package/src/flow/nodes/wait_for_audio.ts +88 -0
  332. package/src/flow/nodes/wait_for_dial.ts +176 -0
  333. package/src/flow/nodes/wait_for_digits.ts +87 -2
  334. package/src/flow/nodes/wait_for_menu.ts +209 -3
  335. package/src/flow/nodes/wait_for_response.ts +1 -1
  336. package/src/flow/operators.ts +23 -5
  337. package/src/flow/types.ts +23 -1
  338. package/src/flow/utils.ts +82 -3
  339. package/src/form/ArrayEditor.ts +4 -2
  340. package/src/form/FieldRenderer.ts +71 -1
  341. package/src/interfaces.ts +2 -1
  342. package/src/layout/Dialog.ts +52 -7
  343. package/src/layout/Modax.ts +19 -2
  344. package/src/list/ContentMenu.ts +15 -1
  345. package/src/locales/es.ts +18 -13
  346. package/src/locales/fr.ts +18 -13
  347. package/src/locales/locale-codes.ts +11 -2
  348. package/src/locales/pt.ts +18 -13
  349. package/src/simulator/Simulator.ts +25 -4
  350. package/src/store/AppState.ts +120 -1
  351. package/src/store/flow-definition.d.ts +2 -0
  352. package/test/actions/add_contact_groups.test.ts +38 -0
  353. package/test/actions/add_input_labels.test.ts +67 -0
  354. package/test/actions/enter_flow.test.ts +88 -0
  355. package/test/actions/play_audio.test.ts +155 -0
  356. package/test/actions/remove_contact_groups.test.ts +29 -0
  357. package/test/actions/say_msg.test.ts +196 -0
  358. package/test/actions/send_broadcast.test.ts +44 -0
  359. package/test/actions/set_contact_channel.test.ts +88 -0
  360. package/test/actions/set_contact_field.test.ts +68 -0
  361. package/test/actions/set_contact_language.test.ts +55 -0
  362. package/test/actions/set_contact_name.test.ts +39 -0
  363. package/test/actions/set_contact_status.test.ts +64 -0
  364. package/test/actions/set_run_result.test.ts +61 -0
  365. package/test/actions/start_session.test.ts +82 -0
  366. package/test/nodes/split_by_contact_field.test.ts +59 -0
  367. package/test/nodes/split_by_run_result.test.ts +100 -0
  368. package/test/nodes/split_by_ticket.test.ts +157 -0
  369. package/test/nodes/split_by_webhook.test.ts +131 -0
  370. package/test/nodes/wait_for_audio.test.ts +182 -0
  371. package/test/nodes/wait_for_dial.test.ts +382 -0
  372. package/test/nodes/wait_for_digits.test.ts +233 -109
  373. package/test/nodes/wait_for_menu.test.ts +383 -0
  374. package/test/temba-flow-collision.test.ts +286 -6
  375. package/test/temba-flow-editor.test.ts +240 -0
  376. package/test/temba-flow-plumber.test.ts +62 -0
  377. package/test/temba-node-type-selector.test.ts +6 -6
  378. package/test/temba-select.test.ts +6 -1
  379. package/test/utils.test.ts +4 -2
  380. package/screenshots/truth/nodes/wait_for_digits/editor/phone-number-collection.png +0 -0
  381. package/screenshots/truth/nodes/wait_for_digits/editor/single-digit-with-timeout.png +0 -0
  382. package/screenshots/truth/nodes/wait_for_digits/editor/verification-code.png +0 -0
  383. package/screenshots/truth/nodes/wait_for_digits/render/phone-number-collection.png +0 -0
  384. package/screenshots/truth/nodes/wait_for_digits/render/single-digit-with-timeout.png +0 -0
  385. package/screenshots/truth/nodes/wait_for_digits/render/verification-code.png +0 -0
@@ -89,7 +89,7 @@ export class Dialog extends ResizeElement {
89
89
 
90
90
  .dialog-mask .dialog-container {
91
91
  position: relative;
92
- transition: transform var(--transition-speed) var(--bounce),
92
+ transition: transform var(--transition-speed) ease-in-out,
93
93
  opacity ease-in-out calc(var(--transition-speed) - 50ms);
94
94
  border-radius: var(--curvature);
95
95
  box-shadow: 0px 0px 2px 4px rgba(0, 0, 0, 0.06);
@@ -104,6 +104,7 @@ export class Dialog extends ResizeElement {
104
104
  .dialog-body {
105
105
  background: #fff;
106
106
  overflow-y: auto;
107
+ overflow-x: hidden;
107
108
  flex-grow: 1;
108
109
  }
109
110
 
@@ -117,7 +118,7 @@ export class Dialog extends ResizeElement {
117
118
  }
118
119
 
119
120
  .dialog-mask.dialog-animation-end .dialog-container {
120
- transform: scale(1) !important;
121
+ transform: scale(1) translate(0, 0) !important;
121
122
  }
122
123
 
123
124
  .dialog-mask.dialog-ready .dialog-container {
@@ -199,6 +200,8 @@ export class Dialog extends ResizeElement {
199
200
  this.width = null;
200
201
  this.submittingName = 'Saving';
201
202
  this.buttons = [];
203
+ this.originX = null;
204
+ this.originY = null;
202
205
  this.scrollOffset = 0;
203
206
  }
204
207
  updateButtons() {
@@ -226,11 +229,46 @@ export class Dialog extends ResizeElement {
226
229
  if (changes.has('open')) {
227
230
  const body = document.querySelector('body');
228
231
  if (this.open) {
229
- this.animationEnd = true;
230
- window.setTimeout(() => {
231
- this.ready = true;
232
- this.animationEnd = false;
233
- }, 400);
232
+ if (this.originX != null && this.originY != null) {
233
+ // Spring-from-origin animation: measure final position, then
234
+ // set initial transform at click point and transition to center
235
+ const ox = this.originX;
236
+ const oy = this.originY;
237
+ this.originX = null;
238
+ this.originY = null;
239
+ requestAnimationFrame(() => {
240
+ var _a;
241
+ const container = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.dialog-container');
242
+ if (container) {
243
+ const rect = container.getBoundingClientRect();
244
+ const cx = rect.left + rect.width / 2;
245
+ const cy = rect.top + rect.height / 2;
246
+ const dx = ox - cx;
247
+ const dy = oy - cy;
248
+ // Disable transition so we can set the start position instantly
249
+ container.style.transition = 'none';
250
+ container.style.transform = `translate(${dx}px, ${dy}px) scale(0.2)`;
251
+ // Force reflow to register the start position
252
+ container.getBoundingClientRect();
253
+ // Re-enable transition and trigger animation to final position
254
+ container.style.transition = '';
255
+ this.animationEnd = true;
256
+ window.setTimeout(() => {
257
+ this.ready = true;
258
+ this.animationEnd = false;
259
+ container.style.transform = '';
260
+ }, 400);
261
+ }
262
+ });
263
+ }
264
+ else {
265
+ // Default animation (no origin)
266
+ this.animationEnd = true;
267
+ window.setTimeout(() => {
268
+ this.ready = true;
269
+ this.animationEnd = false;
270
+ }, 400);
271
+ }
234
272
  this.scrollOffset = -document.documentElement.scrollTop;
235
273
  body.style.position = 'fixed';
236
274
  body.style.overflowY = 'scroll';
@@ -461,4 +499,10 @@ __decorate([
461
499
  __decorate([
462
500
  property({ attribute: false })
463
501
  ], Dialog.prototype, "onButtonClicked", void 0);
502
+ __decorate([
503
+ property({ type: Number })
504
+ ], Dialog.prototype, "originX", void 0);
505
+ __decorate([
506
+ property({ type: Number })
507
+ ], Dialog.prototype, "originY", void 0);
464
508
  //# sourceMappingURL=Dialog.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../src/layout/Dialog.ts"],"names":[],"mappings":"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","sourcesContent":["import { property } from 'lit/decorators.js';\nimport { TemplateResult, html, css } from 'lit';\nimport { Button } from '../display/Button';\nimport { CustomEventType } from '../interfaces';\nimport { styleMap } from 'lit-html/directives/style-map.js';\nimport { getClasses } from '../utils';\nimport { ResizeElement } from '../ResizeElement';\n\nexport enum ButtonType {\n PRIMARY = 'primary',\n SECONDARY = 'secondary',\n DESTRUCTIVE = 'destructive'\n}\nexport class DialogButton {\n name?: string;\n id?: string;\n details?: any;\n type?: string;\n closes?: boolean;\n}\n\nexport class Dialog extends ResizeElement {\n static get widths(): { [size: string]: string } {\n return {\n small: '400px',\n medium: '600px',\n large: '655px',\n xlarge: '800px'\n };\n }\n\n static get styles() {\n return css`\n :host {\n position: absolute;\n z-index: 10000;\n font-family: var(--font-family);\n background: white;\n }\n\n .flex-grow {\n flex-grow: 1;\n }\n\n .flex {\n display: flex;\n flex-direction: column;\n width: 100%;\n position: relative;\n left: 0px;\n top: 0px;\n align-items: center;\n height: 100vh;\n }\n\n .mobile .flex {\n height: 100%;\n position: fixed;\n }\n\n .mobile .grow-top {\n flex-grow: 0;\n }\n\n .mobile .grow-bottom {\n flex-grow: 0;\n }\n\n .grow-top {\n flex-grow: 1;\n }\n\n .grow-bottom {\n flex-grow: 3;\n }\n\n .bottom-padding {\n padding: 3rem;\n }\n\n .dialog-mask {\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.5);\n opacity: 0;\n position: fixed;\n top: 0px;\n left: 0px;\n transition: opacity linear calc(var(--transition-speed) / 2ms);\n pointer-events: none;\n }\n\n .mobile.dialog-mask .dialog-container {\n border-radius: 0px;\n }\n\n .dialog-mask .dialog-container {\n position: relative;\n transition: transform var(--transition-speed) var(--bounce),\n opacity ease-in-out calc(var(--transition-speed) - 50ms);\n border-radius: var(--curvature);\n box-shadow: 0px 0px 2px 4px rgba(0, 0, 0, 0.06);\n overflow: hidden;\n transform: scale(0.9) translatey(2em);\n background: white;\n margin: auto;\n display: flex;\n flex-direction: column;\n }\n\n .dialog-body {\n background: #fff;\n overflow-y: auto;\n flex-grow: 1;\n }\n\n .dialog-mask.dialog-open {\n opacity: 1;\n pointer-events: auto;\n }\n\n .dialog-mask.dialog-open .dialog-container {\n top: inherit;\n }\n\n .dialog-mask.dialog-animation-end .dialog-container {\n transform: scale(1) !important;\n }\n\n .dialog-mask.dialog-ready .dialog-container {\n transform: none;\n }\n\n .dialog-mask.dialog-loading .dialog-container {\n margin-top: -10000px;\n }\n\n .header-text {\n display: flex;\n flex-direction: row;\n align-items: center;\n font-size: 20px;\n padding: 12px 20px;\n color: var(--header-text);\n background: var(--header-bg);\n }\n\n .header-text .title {\n flex-grow: 1;\n }\n\n .header-text .status {\n font-size: 0.6em;\n font-weight: bold;\n }\n\n .dialog-footer {\n background: var(--color-primary-light);\n padding: 10px;\n display: flex;\n flex-flow: row;\n align-items: center;\n }\n\n temba-button {\n margin-left: 10px;\n }\n\n .dialog-body temba-loading {\n position: absolute;\n right: 12px;\n margin-top: -30px;\n padding-bottom: 9px;\n display: none;\n }\n\n #page-loader {\n text-align: center;\n display: block;\n position: relative;\n opacity: 0;\n margin: auto;\n margin-top: 30px;\n width: 154px;\n transition: opacity calc(var(--transition-speed) * 5ms) ease-in\n calc(var(--transition-speed * 2));\n visibility: hidden;\n }\n\n .dialog-mask.dialog-loading #page-loader {\n opacity: 1;\n visibility: visible;\n }\n\n #submit-loader {\n flex-grow: 1;\n text-align: right;\n }\n `;\n }\n\n @property({ type: Boolean })\n open: boolean;\n\n @property()\n header: string;\n\n @property()\n body: string;\n\n @property({ type: Boolean })\n submitting: boolean;\n\n @property({ type: Boolean })\n destructive: boolean;\n\n @property({ type: Boolean })\n disabled: boolean;\n\n @property({ type: Boolean })\n loading: boolean;\n\n @property({ type: Boolean })\n hideOnClick: boolean;\n\n @property({ type: Boolean })\n noFocus: boolean;\n\n @property()\n size = 'medium';\n\n @property({ type: String })\n primaryButtonName = 'Ok';\n\n @property({ type: String })\n cancelButtonName = 'Cancel';\n\n @property({ type: String })\n width = null;\n\n @property()\n submittingName = 'Saving';\n\n @property()\n animationEnd: boolean;\n\n @property()\n ready: boolean;\n\n @property({ type: Array })\n buttons: DialogButton[] = [];\n\n @property({ attribute: false })\n onButtonClicked: (button: Button) => void;\n\n scrollOffset: any = 0;\n\n public constructor() {\n super();\n }\n\n private updateButtons() {\n this.buttons = [];\n if (this.cancelButtonName) {\n this.buttons.push({\n name: this.cancelButtonName,\n type: ButtonType.SECONDARY,\n closes: true\n });\n }\n\n if (this.primaryButtonName) {\n this.buttons.push({\n name: this.primaryButtonName,\n type: ButtonType.PRIMARY\n });\n }\n this.requestUpdate();\n }\n\n public updated(changes: Map<string, any>) {\n super.updated(changes);\n\n if (changes.has('cancelButtonName') || changes.has('primaryButtonName')) {\n this.updateButtons();\n }\n\n if (changes.has('open')) {\n const body = document.querySelector('body');\n\n if (this.open) {\n this.animationEnd = true;\n window.setTimeout(() => {\n this.ready = true;\n this.animationEnd = false;\n }, 400);\n\n this.scrollOffset = -document.documentElement.scrollTop;\n body.style.position = 'fixed';\n body.style.overflowY = 'scroll';\n body.style.top = this.scrollOffset + 'px';\n body.style.width = '100%';\n body.style.overflowY = 'hidden';\n } else {\n body.style.position = '';\n body.style.overflowY = '';\n body.style.width = '';\n body.style.marginRight = '';\n body.style.paddingRight = '0px';\n window.scrollTo(0, parseInt(this.scrollOffset || '0') * -1);\n }\n\n // make sure our buttons aren't in progress on show\n if (this.open && !changes.get('open')) {\n this.shadowRoot\n .querySelectorAll('temba-button')\n .forEach((button: Button) => {\n if (button) button.submitting = false;\n });\n\n if (!this.noFocus) {\n this.focusFirstInput();\n }\n } else {\n window.setTimeout(() => {\n this.ready = false;\n }, 400);\n }\n }\n }\n\n public focusFirstInput(): void {\n window.setTimeout(() => {\n let input = this.querySelector(\n 'temba-textinput, temba-completion, input[type=\"text\"], textarea'\n ) as any;\n if (input) {\n input = input.textInputElement || input.inputElement || input;\n if (!input.readOnly) {\n input.focus();\n input.click();\n }\n }\n }, 100);\n }\n\n public handleClick(evt: MouseEvent) {\n const button = evt.currentTarget as Button;\n if (!button.disabled) {\n let detail: DialogButton = {};\n if (button.index >= 0 && button.index < this.buttons.length) {\n detail = this.buttons[button.index];\n }\n\n this.fireCustomEvent(CustomEventType.ButtonClicked, { button, detail });\n if (button.name === this.cancelButtonName || (detail && detail.closes)) {\n this.open = false;\n }\n }\n }\n\n private getDocumentHeight(): number {\n const body = document.body;\n const html = document.documentElement;\n return Math.max(\n body.scrollHeight,\n body.offsetHeight,\n html.clientHeight,\n html.scrollHeight,\n html.offsetHeight\n );\n }\n\n private clickCancel() {\n const cancel = this.getCancelButton();\n if (cancel) {\n cancel.click();\n }\n }\n\n public getCancelButton(): Button {\n return this.shadowRoot.querySelector(\n `temba-button[name='${this.cancelButtonName}']`\n );\n }\n\n public getPrimaryButton(): Button {\n return this.shadowRoot.querySelector(`temba-button[primary]`);\n }\n\n private handleKeyUp(event: KeyboardEvent) {\n if (event.key === 'Escape') {\n this.clickCancel();\n }\n }\n\n private handleClickMask(event: MouseEvent) {\n if (this.hideOnClick) {\n const id = (event.target as HTMLElement).id;\n if (id === 'dialog-mask' || id === 'dialog-bg') {\n this.fireCustomEvent(CustomEventType.DialogHidden);\n this.clickCancel();\n }\n }\n }\n\n public show(): void {\n this.open = true;\n }\n\n public hide(): void {\n this.open = false;\n }\n\n public render(): TemplateResult {\n const dialogStyle = {\n width: this.width\n };\n\n if (!this.width) {\n dialogStyle['width'] = Dialog.widths[this.size];\n }\n\n if (this.isMobile()) {\n dialogStyle['width'] = '100%';\n dialogStyle['height'] = '100%';\n delete dialogStyle['maxWidth'];\n }\n\n const header = this.header\n ? html`\n <div class=\"dialog-header\">\n <div class=\"header-text\">\n <div class=\"title\">${this.header}</div>\n </div>\n </div>\n `\n : null;\n\n return html`\n <div\n id=\"dialog-mask\"\n @click=${this.handleClickMask}\n class=\"dialog-mask ${getClasses({\n 'dialog-open': this.open,\n 'dialog-loading': this.loading,\n 'dialog-animation-end': this.animationEnd,\n 'dialog-ready': this.ready,\n mobile: this.isMobile()\n })}\"\n >\n <div style=\"position: absolute; width: 100%;\">\n <temba-loading\n id=\"page-loader\"\n units=\"6\"\n size=\"12\"\n color=\"#ccc\"\n ></temba-loading>\n </div>\n\n <div class=\"flex\">\n <div class=\"grow-top\" style=\"${\n this.isMobile() ? 'flex-grow:0' : ''\n }\"></div>\n <div\n @keyup=${this.handleKeyUp}\n style=${styleMap(dialogStyle)}\n class=\"dialog-container\"\n >\n ${header}\n <div class=\"dialog-body\" @keypress=${this.handleKeyUp}>\n ${this.body ? this.body : html`<slot></slot>`}\n <temba-loading units=\"6\" size=\"8\"></temba-loading>\n </div>\n\n <div class=\"dialog-footer\">\n <div class=\"flex-grow\">\n <slot name=\"gutter\"></slot>\n </div>\n ${this.buttons.map(\n (button: DialogButton, index) => html`\n <temba-button\n name=${button.name}\n ?destructive=${button.type == 'primary' && this.destructive}\n ?primary=${button.type == 'primary' && !this.destructive}\n ?secondary=${button.type == 'secondary'}\n ?submitting=${this.submitting}\n ?disabled=${this.disabled && !button.closes}\n index=${index}\n @click=${this.handleClick}\n ></temba-button>\n `\n )}\n </div>\n </div>\n <div class=\"grow-bottom\"></div>\n </div>\n </div>\n </div>\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../src/layout/Dialog.ts"],"names":[],"mappings":"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","sourcesContent":["import { property } from 'lit/decorators.js';\nimport { TemplateResult, html, css } from 'lit';\nimport { Button } from '../display/Button';\nimport { CustomEventType } from '../interfaces';\nimport { styleMap } from 'lit-html/directives/style-map.js';\nimport { getClasses } from '../utils';\nimport { ResizeElement } from '../ResizeElement';\n\nexport enum ButtonType {\n PRIMARY = 'primary',\n SECONDARY = 'secondary',\n DESTRUCTIVE = 'destructive'\n}\nexport class DialogButton {\n name?: string;\n id?: string;\n details?: any;\n type?: string;\n closes?: boolean;\n}\n\nexport class Dialog extends ResizeElement {\n static get widths(): { [size: string]: string } {\n return {\n small: '400px',\n medium: '600px',\n large: '655px',\n xlarge: '800px'\n };\n }\n\n static get styles() {\n return css`\n :host {\n position: absolute;\n z-index: 10000;\n font-family: var(--font-family);\n background: white;\n }\n\n .flex-grow {\n flex-grow: 1;\n }\n\n .flex {\n display: flex;\n flex-direction: column;\n width: 100%;\n position: relative;\n left: 0px;\n top: 0px;\n align-items: center;\n height: 100vh;\n }\n\n .mobile .flex {\n height: 100%;\n position: fixed;\n }\n\n .mobile .grow-top {\n flex-grow: 0;\n }\n\n .mobile .grow-bottom {\n flex-grow: 0;\n }\n\n .grow-top {\n flex-grow: 1;\n }\n\n .grow-bottom {\n flex-grow: 3;\n }\n\n .bottom-padding {\n padding: 3rem;\n }\n\n .dialog-mask {\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.5);\n opacity: 0;\n position: fixed;\n top: 0px;\n left: 0px;\n transition: opacity linear calc(var(--transition-speed) / 2ms);\n pointer-events: none;\n }\n\n .mobile.dialog-mask .dialog-container {\n border-radius: 0px;\n }\n\n .dialog-mask .dialog-container {\n position: relative;\n transition: transform var(--transition-speed) ease-in-out,\n opacity ease-in-out calc(var(--transition-speed) - 50ms);\n border-radius: var(--curvature);\n box-shadow: 0px 0px 2px 4px rgba(0, 0, 0, 0.06);\n overflow: hidden;\n transform: scale(0.9) translatey(2em);\n background: white;\n margin: auto;\n display: flex;\n flex-direction: column;\n }\n\n .dialog-body {\n background: #fff;\n overflow-y: auto;\n overflow-x: hidden;\n flex-grow: 1;\n }\n\n .dialog-mask.dialog-open {\n opacity: 1;\n pointer-events: auto;\n }\n\n .dialog-mask.dialog-open .dialog-container {\n top: inherit;\n }\n\n .dialog-mask.dialog-animation-end .dialog-container {\n transform: scale(1) translate(0, 0) !important;\n }\n\n .dialog-mask.dialog-ready .dialog-container {\n transform: none;\n }\n\n .dialog-mask.dialog-loading .dialog-container {\n margin-top: -10000px;\n }\n\n .header-text {\n display: flex;\n flex-direction: row;\n align-items: center;\n font-size: 20px;\n padding: 12px 20px;\n color: var(--header-text);\n background: var(--header-bg);\n }\n\n .header-text .title {\n flex-grow: 1;\n }\n\n .header-text .status {\n font-size: 0.6em;\n font-weight: bold;\n }\n\n .dialog-footer {\n background: var(--color-primary-light);\n padding: 10px;\n display: flex;\n flex-flow: row;\n align-items: center;\n }\n\n temba-button {\n margin-left: 10px;\n }\n\n .dialog-body temba-loading {\n position: absolute;\n right: 12px;\n margin-top: -30px;\n padding-bottom: 9px;\n display: none;\n }\n\n #page-loader {\n text-align: center;\n display: block;\n position: relative;\n opacity: 0;\n margin: auto;\n margin-top: 30px;\n width: 154px;\n transition: opacity calc(var(--transition-speed) * 5ms) ease-in\n calc(var(--transition-speed * 2));\n visibility: hidden;\n }\n\n .dialog-mask.dialog-loading #page-loader {\n opacity: 1;\n visibility: visible;\n }\n\n #submit-loader {\n flex-grow: 1;\n text-align: right;\n }\n `;\n }\n\n @property({ type: Boolean })\n open: boolean;\n\n @property()\n header: string;\n\n @property()\n body: string;\n\n @property({ type: Boolean })\n submitting: boolean;\n\n @property({ type: Boolean })\n destructive: boolean;\n\n @property({ type: Boolean })\n disabled: boolean;\n\n @property({ type: Boolean })\n loading: boolean;\n\n @property({ type: Boolean })\n hideOnClick: boolean;\n\n @property({ type: Boolean })\n noFocus: boolean;\n\n @property()\n size = 'medium';\n\n @property({ type: String })\n primaryButtonName = 'Ok';\n\n @property({ type: String })\n cancelButtonName = 'Cancel';\n\n @property({ type: String })\n width = null;\n\n @property()\n submittingName = 'Saving';\n\n @property()\n animationEnd: boolean;\n\n @property()\n ready: boolean;\n\n @property({ type: Array })\n buttons: DialogButton[] = [];\n\n @property({ attribute: false })\n onButtonClicked: (button: Button) => void;\n\n @property({ type: Number })\n originX: number | null = null;\n\n @property({ type: Number })\n originY: number | null = null;\n\n scrollOffset: any = 0;\n\n public constructor() {\n super();\n }\n\n private updateButtons() {\n this.buttons = [];\n if (this.cancelButtonName) {\n this.buttons.push({\n name: this.cancelButtonName,\n type: ButtonType.SECONDARY,\n closes: true\n });\n }\n\n if (this.primaryButtonName) {\n this.buttons.push({\n name: this.primaryButtonName,\n type: ButtonType.PRIMARY\n });\n }\n this.requestUpdate();\n }\n\n public updated(changes: Map<string, any>) {\n super.updated(changes);\n\n if (changes.has('cancelButtonName') || changes.has('primaryButtonName')) {\n this.updateButtons();\n }\n\n if (changes.has('open')) {\n const body = document.querySelector('body');\n\n if (this.open) {\n if (this.originX != null && this.originY != null) {\n // Spring-from-origin animation: measure final position, then\n // set initial transform at click point and transition to center\n const ox = this.originX;\n const oy = this.originY;\n this.originX = null;\n this.originY = null;\n\n requestAnimationFrame(() => {\n const container = this.shadowRoot?.querySelector(\n '.dialog-container'\n ) as HTMLElement;\n if (container) {\n const rect = container.getBoundingClientRect();\n const cx = rect.left + rect.width / 2;\n const cy = rect.top + rect.height / 2;\n const dx = ox - cx;\n const dy = oy - cy;\n\n // Disable transition so we can set the start position instantly\n container.style.transition = 'none';\n container.style.transform = `translate(${dx}px, ${dy}px) scale(0.2)`;\n // Force reflow to register the start position\n container.getBoundingClientRect();\n\n // Re-enable transition and trigger animation to final position\n container.style.transition = '';\n this.animationEnd = true;\n window.setTimeout(() => {\n this.ready = true;\n this.animationEnd = false;\n container.style.transform = '';\n }, 400);\n }\n });\n } else {\n // Default animation (no origin)\n this.animationEnd = true;\n window.setTimeout(() => {\n this.ready = true;\n this.animationEnd = false;\n }, 400);\n }\n\n this.scrollOffset = -document.documentElement.scrollTop;\n body.style.position = 'fixed';\n body.style.overflowY = 'scroll';\n body.style.top = this.scrollOffset + 'px';\n body.style.width = '100%';\n body.style.overflowY = 'hidden';\n } else {\n body.style.position = '';\n body.style.overflowY = '';\n body.style.width = '';\n body.style.marginRight = '';\n body.style.paddingRight = '0px';\n window.scrollTo(0, parseInt(this.scrollOffset || '0') * -1);\n }\n\n // make sure our buttons aren't in progress on show\n if (this.open && !changes.get('open')) {\n this.shadowRoot\n .querySelectorAll('temba-button')\n .forEach((button: Button) => {\n if (button) button.submitting = false;\n });\n\n if (!this.noFocus) {\n this.focusFirstInput();\n }\n } else {\n window.setTimeout(() => {\n this.ready = false;\n }, 400);\n }\n }\n }\n\n public focusFirstInput(): void {\n window.setTimeout(() => {\n let input = this.querySelector(\n 'temba-textinput, temba-completion, input[type=\"text\"], textarea'\n ) as any;\n if (input) {\n input = input.textInputElement || input.inputElement || input;\n if (!input.readOnly) {\n input.focus();\n input.click();\n }\n }\n }, 100);\n }\n\n public handleClick(evt: MouseEvent) {\n const button = evt.currentTarget as Button;\n if (!button.disabled) {\n let detail: DialogButton = {};\n if (button.index >= 0 && button.index < this.buttons.length) {\n detail = this.buttons[button.index];\n }\n\n this.fireCustomEvent(CustomEventType.ButtonClicked, { button, detail });\n if (button.name === this.cancelButtonName || (detail && detail.closes)) {\n this.open = false;\n }\n }\n }\n\n private getDocumentHeight(): number {\n const body = document.body;\n const html = document.documentElement;\n return Math.max(\n body.scrollHeight,\n body.offsetHeight,\n html.clientHeight,\n html.scrollHeight,\n html.offsetHeight\n );\n }\n\n private clickCancel() {\n const cancel = this.getCancelButton();\n if (cancel) {\n cancel.click();\n }\n }\n\n public getCancelButton(): Button {\n return this.shadowRoot.querySelector(\n `temba-button[name='${this.cancelButtonName}']`\n );\n }\n\n public getPrimaryButton(): Button {\n return this.shadowRoot.querySelector(`temba-button[primary]`);\n }\n\n private handleKeyUp(event: KeyboardEvent) {\n if (event.key === 'Escape') {\n this.clickCancel();\n }\n }\n\n private handleClickMask(event: MouseEvent) {\n if (this.hideOnClick) {\n const id = (event.target as HTMLElement).id;\n if (id === 'dialog-mask' || id === 'dialog-bg') {\n this.fireCustomEvent(CustomEventType.DialogHidden);\n this.clickCancel();\n }\n }\n }\n\n public show(): void {\n this.open = true;\n }\n\n public hide(): void {\n this.open = false;\n }\n\n public render(): TemplateResult {\n const dialogStyle = {\n width: this.width\n };\n\n if (!this.width) {\n dialogStyle['width'] = Dialog.widths[this.size];\n }\n\n if (this.isMobile()) {\n dialogStyle['width'] = '100%';\n dialogStyle['height'] = '100%';\n delete dialogStyle['maxWidth'];\n }\n\n const header = this.header\n ? html`\n <div class=\"dialog-header\">\n <div class=\"header-text\">\n <div class=\"title\">${this.header}</div>\n </div>\n </div>\n `\n : null;\n\n return html`\n <div\n id=\"dialog-mask\"\n @click=${this.handleClickMask}\n class=\"dialog-mask ${getClasses({\n 'dialog-open': this.open,\n 'dialog-loading': this.loading,\n 'dialog-animation-end': this.animationEnd,\n 'dialog-ready': this.ready,\n mobile: this.isMobile()\n })}\"\n >\n <div style=\"position: absolute; width: 100%;\">\n <temba-loading\n id=\"page-loader\"\n units=\"6\"\n size=\"12\"\n color=\"#ccc\"\n ></temba-loading>\n </div>\n\n <div class=\"flex\">\n <div class=\"grow-top\" style=\"${\n this.isMobile() ? 'flex-grow:0' : ''\n }\"></div>\n <div\n @keyup=${this.handleKeyUp}\n style=${styleMap(dialogStyle)}\n class=\"dialog-container\"\n >\n ${header}\n <div class=\"dialog-body\" @keypress=${this.handleKeyUp}>\n ${this.body ? this.body : html`<slot></slot>`}\n <temba-loading units=\"6\" size=\"8\"></temba-loading>\n </div>\n\n <div class=\"dialog-footer\">\n <div class=\"flex-grow\">\n <slot name=\"gutter\"></slot>\n </div>\n ${this.buttons.map(\n (button: DialogButton, index) => html`\n <temba-button\n name=${button.name}\n ?destructive=${button.type == 'primary' && this.destructive}\n ?primary=${button.type == 'primary' && !this.destructive}\n ?secondary=${button.type == 'secondary'}\n ?submitting=${this.submitting}\n ?disabled=${this.disabled && !button.closes}\n index=${index}\n @click=${this.handleClick}\n ></temba-button>\n `\n )}\n </div>\n </div>\n <div class=\"grow-bottom\"></div>\n </div>\n </div>\n </div>\n `;\n }\n}\n"]}
@@ -19,6 +19,8 @@ export class Modax extends RapidElement {
19
19
  this.wizardStep = 0;
20
20
  this.wizardStepCount = 0;
21
21
  this.suspendSubmit = false;
22
+ this.originX = null;
23
+ this.originY = null;
22
24
  }
23
25
  static get styles() {
24
26
  return css `
@@ -113,7 +115,13 @@ export class Modax extends RapidElement {
113
115
  `;
114
116
  }
115
117
  // private cancelToken: CancelTokenSource;
116
- handleSlotClicked() {
118
+ handleSlotClicked(event) {
119
+ const el = event.currentTarget;
120
+ if (el) {
121
+ const rect = el.getBoundingClientRect();
122
+ this.originX = rect.left + rect.width / 2;
123
+ this.originY = rect.top;
124
+ }
117
125
  this.open = true;
118
126
  }
119
127
  updated(changes) {
@@ -136,6 +144,8 @@ export class Modax extends RapidElement {
136
144
  // clear the modal body out when closed, note that js functions declared on the
137
145
  // window will hang around
138
146
  this.setBody('');
147
+ this.originX = null;
148
+ this.originY = null;
139
149
  }
140
150
  }
141
151
  }
@@ -363,11 +373,13 @@ export class Modax extends RapidElement {
363
373
  .header=${this.header}
364
374
  .buttons=${this.buttons}
365
375
  ?open=${this.open}
366
- ?loading=${this.fetching}
376
+ ?loading=${this.fetching && this.originX == null}
367
377
  ?submitting=${this.submitting}
368
378
  ?destructive=${this.isDestructive()}
369
379
  ?noFocus=${true}
370
380
  ?disabled=${this.disabled}
381
+ .originX=${this.originX}
382
+ .originY=${this.originY}
371
383
  @temba-button-clicked=${this.handleDialogClick.bind(this)}
372
384
  @temba-dialog-hidden=${this.handleDialogHidden.bind(this)}
373
385
  >
@@ -436,4 +448,10 @@ __decorate([
436
448
  __decorate([
437
449
  property({ type: Boolean })
438
450
  ], Modax.prototype, "suspendSubmit", void 0);
451
+ __decorate([
452
+ property({ type: Number })
453
+ ], Modax.prototype, "originX", void 0);
454
+ __decorate([
455
+ property({ type: Number })
456
+ ], Modax.prototype, "originY", void 0);
439
457
  //# sourceMappingURL=Modax.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Modax.js","sourceRoot":"","sources":["../../../src/layout/Modax.ts"],"names":[],"mappings":"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","sourcesContent":["import { TemplateResult, html, css } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { unsafeHTML } from 'lit-html/directives/unsafe-html.js';\n\nimport { RapidElement } from '../RapidElement';\nimport { getUrl, serialize, postUrl, WebResponse, getClasses } from '../utils';\nimport { CustomEventType } from '../interfaces';\nimport { ButtonType, Dialog, DialogButton } from './Dialog';\n\nexport class Modax extends RapidElement {\n static get styles() {\n return css`\n fieldset {\n border: none;\n margin: 0;\n padding: 0;\n }\n\n .control-group {\n margin-bottom: var(--control-margin-bottom);\n }\n\n .form-actions {\n display: none;\n }\n\n button[type='submit'],\n input[type='submit'] {\n display: none;\n }\n\n .modax-body {\n padding: 20px;\n display: block;\n position: relative;\n background: var(--body-bg);\n }\n\n .modax-body.submitting:before {\n display: inline-block;\n content: '';\n height: 100%;\n width: 100%;\n margin-left: -20px;\n margin-top: -20px;\n background: rgba(200, 200, 200, 0.1);\n position: absolute;\n z-index: 10000;\n }\n\n temba-loading {\n margin: 0 auto;\n display: block;\n width: 150px;\n }\n\n ul.errorlist {\n margin-top: 0px;\n list-style-type: none;\n padding-left: 0;\n padding-bottom: 7px;\n }\n\n ul.errorlist li {\n color: var(--color-error);\n background: rgba(255, 181, 181, 0.17);\n box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1),\n 0 1px 2px 0 rgba(0, 0, 0, 0.06);\n color: tomato;\n padding: 10px;\n margin-bottom: 10px;\n border-radius: 6px;\n }\n\n .step-ball {\n background: rgba(var(--primary-rgb), 0.2);\n width: 1.2em;\n height: 1.2em;\n border-radius: 100%;\n margin-right: 0.5em;\n border: 0.15em solid transparent;\n }\n\n .step-ball.complete {\n background: rgba(var(--primary-rgb), 0.7);\n cursor: pointer;\n }\n .step-ball.complete:hover {\n background: rgba(var(--primary-rgb), 0.8);\n }\n\n .step-ball.active {\n border: 0.15em solid var(--color-primary-dark);\n }\n\n .wizard-steps {\n display: flex;\n flex-direction: row;\n margin-left: 0.6em;\n }\n `;\n }\n\n @property({ type: String })\n header = '';\n\n @property({ type: String })\n endpoint: string;\n\n @property({ type: Boolean, reflect: true })\n open = false;\n\n @property({ type: Boolean })\n fetching = false;\n\n @property({ type: Boolean })\n submitting: boolean;\n\n @property({ type: String })\n primaryName: string;\n\n @property({ type: String })\n cancelName: string;\n\n @property({ type: String })\n onLoaded: string;\n\n @property({ type: Boolean })\n noSubmit: boolean;\n\n @property({ type: Object })\n headers: any = {};\n\n @property({ type: String })\n body: any = this.getLoading();\n\n @property({ type: Boolean })\n disabled = false;\n\n @property({ type: Array })\n buttons: DialogButton[] = [];\n\n @property({ type: Number })\n wizardStep = 0;\n\n @property({ type: Number })\n wizardStepCount = 0;\n\n @property({ type: Boolean })\n suspendSubmit = false;\n // private cancelToken: CancelTokenSource;\n\n private handleSlotClicked(): void {\n this.open = true;\n }\n\n public updated(changes: Map<string, any>) {\n super.updated(changes);\n\n if (changes.has('open')) {\n if (this.open) {\n this.fetchForm();\n } else {\n // open can get reflected into undefined, make sure we've been open before\n if (changes.get('open') !== undefined) {\n // hide our body after our hiding animation is done\n if (this.open) {\n window.setTimeout(() => {\n this.body = this.getLoading();\n this.submitting = false;\n }, 500);\n } else {\n // clear the modal body out when closed, note that js functions declared on the\n // window will hang around\n this.setBody('');\n }\n }\n }\n }\n\n if (changes.has('body') && this.open && this.body && !this.fetching) {\n const dialog = this.shadowRoot.querySelector('temba-dialog') as Dialog;\n dialog.focusFirstInput();\n }\n }\n\n private getLoading() {\n return html`<temba-loading units=\"6\" size=\"8\"></temba-loading>`;\n }\n\n public updatePrimaryButton(): void {\n const wizard = this.shadowRoot.querySelector(\n '#wizard-form'\n ) as HTMLDivElement;\n if (wizard) {\n this.wizardStep = parseInt(wizard.dataset.step);\n this.wizardStepCount = parseInt(wizard.dataset.steps);\n }\n\n if (!this.noSubmit) {\n this.updateComplete.then(() => {\n const submitButton = this.shadowRoot.querySelector(\n \"input[type='submit'],button[type='submit']\"\n ) as any;\n\n if (submitButton) {\n this.buttons = [\n { type: ButtonType.SECONDARY, name: 'Cancel', closes: true },\n { type: ButtonType.PRIMARY, name: submitButton.value }\n ];\n } else {\n this.buttons = [\n { type: ButtonType.SECONDARY, name: 'Ok', closes: true }\n ];\n }\n this.submitting = false;\n });\n }\n }\n\n private setBody(body: string): boolean {\n // remove any existing on our previous body\n const scriptBlock = this.shadowRoot.querySelector('.scripts') as any;\n for (const child of scriptBlock.children) {\n child.remove();\n }\n\n // parse out any scripts in the body\n const div = this.ownerDocument.createElement('div');\n div.innerHTML = body;\n const scripts = div.getElementsByTagName('script');\n const toAdd: any = [];\n // now add them in\n for (let i = scripts.length - 1; i >= 0; i--) {\n // for (let i = 0; i < scripts.length; i++) {\n const script = this.ownerDocument.createElement('script');\n const code = scripts[i].innerText;\n\n if (scripts[i].src && scripts[i].src.indexOf('web-dev-server') === -1) {\n script.src = scripts[i].src;\n script.type = 'text/javascript';\n script.async = true;\n\n // TODO: track and fire event once all scripts are loaded\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n script.onload = function () {};\n toAdd.push(script);\n } else if (code) {\n script.appendChild(this.ownerDocument.createTextNode(code));\n toAdd.push(script);\n // remove it from our current body text\n }\n scripts[i].remove();\n }\n\n const scriptOnly = !!div.querySelector('.success-script');\n\n if (!scriptOnly) {\n this.body = unsafeHTML(div.innerHTML);\n }\n\n this.updateComplete.then(() => {\n for (const script of toAdd) {\n scriptBlock.appendChild(script);\n }\n });\n return !scriptOnly;\n }\n\n public getHeaders(): any {\n const headers = this.headers;\n headers['X-PJAX'] = 1;\n return headers;\n }\n\n private fetchForm() {\n // const CancelToken = axios.CancelToken;\n // this.cancelToken = CancelToken.source();\n this.fetching = true;\n this.body = this.getLoading();\n getUrl(this.endpoint, null, this.getHeaders())\n .then((response: WebResponse) => {\n // if it's a full page, breakout of the modal\n if (response.body.indexOf('<!DOCTYPE HTML>') == 0) {\n this.open = false;\n document.location = response.url;\n } else {\n this.setBody(response.body);\n this.fetching = false;\n this.updateComplete.then(() => {\n this.updatePrimaryButton();\n this.fireCustomEvent(CustomEventType.Loaded, {\n body: this.getBody()\n });\n });\n }\n })\n .catch((error) => {\n this.fetching = false;\n this.open = false;\n this.fireCustomEvent(CustomEventType.Error, { error });\n });\n }\n\n public submit(extra = {}): void {\n this.submitting = true;\n const form = this.shadowRoot.querySelector('form');\n\n let postData = form ? serialize(form) : '';\n if (extra) {\n Object.keys(extra).forEach((key) => {\n postData +=\n (postData.length > 1 ? '&' : '') +\n encodeURIComponent(key) +\n '=' +\n encodeURIComponent(extra[key]);\n });\n }\n\n postUrl(\n this.endpoint,\n postData,\n this.getHeaders(),\n 'application/x-www-form-urlencoded'\n )\n .then((response: WebResponse) => {\n window.setTimeout(() => {\n let redirect = response.headers.get('X-Temba-Success');\n if (\n !redirect &&\n response.url &&\n response.url.indexOf(this.endpoint) === -1\n ) {\n redirect = response.url;\n }\n\n if (redirect) {\n if (redirect === 'hide') {\n this.updateComplete.then(() => {\n this.open = false;\n this.fireCustomEvent(CustomEventType.Submitted);\n });\n } else {\n this.fireCustomEvent(CustomEventType.Redirected, {\n url: redirect\n });\n this.open = false;\n }\n } else {\n if (response.body.indexOf('<!DOCTYPE HTML>') == 0) {\n this.open = false;\n document.location = response.url;\n return;\n }\n\n // if we set the body, update our submit button\n if (this.setBody(response.body)) {\n this.updateComplete.then(() => {\n this.updatePrimaryButton();\n });\n }\n }\n }, 1000);\n })\n .catch((error) => {\n console.error(error);\n });\n }\n\n private handleDialogClick(evt: CustomEvent) {\n const button = evt.detail.button;\n const detail = evt.detail.detail;\n if (!button.disabled && !button.submitting) {\n if (button.primary || button.destructive) {\n if (!this.suspendSubmit) {\n this.submit();\n }\n }\n }\n\n if (detail.closes) {\n this.open = false;\n this.fetching = false;\n this.cancelName = undefined;\n }\n }\n\n private handleDialogHidden() {\n // this.cancelToken.cancel();\n this.open = false;\n this.fetching = false;\n }\n\n private isDestructive(): boolean {\n return (\n this.endpoint &&\n (this.endpoint.indexOf('delete') > -1 ||\n this.endpoint.indexOf('interrupt') > -1)\n );\n }\n\n private handleGotoStep(evt: MouseEvent) {\n const step = (evt.target as HTMLDivElement).dataset.gotoStep;\n if (step) {\n this.submit({ wizard_goto_step: step });\n }\n }\n\n public getBody() {\n return this.shadowRoot.querySelector('.modax-body');\n }\n\n public render(): TemplateResult {\n const wizardStepBalls = [];\n\n const wizard = this.shadowRoot.querySelector(\n '#wizard-form'\n ) as HTMLDivElement;\n if (wizard) {\n const completed = (wizard.getAttribute('data-completed') || '')\n .split(',')\n .filter((step) => step.length > 0);\n\n for (let i = 0; i < this.wizardStepCount; i++) {\n wizardStepBalls.push(\n html`<div\n data-goto-step=${completed[i]}\n @click=${this.handleGotoStep.bind(this)}\n class=\"${getClasses({\n 'step-ball': true,\n active: this.wizardStep - 1 === i,\n complete: i < completed.length\n })}\"\n ></div>`\n );\n }\n }\n\n return html`\n <temba-dialog\n .header=${this.header}\n .buttons=${this.buttons}\n ?open=${this.open}\n ?loading=${this.fetching}\n ?submitting=${this.submitting}\n ?destructive=${this.isDestructive()}\n ?noFocus=${true}\n ?disabled=${this.disabled}\n @temba-button-clicked=${this.handleDialogClick.bind(this)}\n @temba-dialog-hidden=${this.handleDialogHidden.bind(this)}\n >\n <div\n class=\"modax-body ${this.submitting ? 'submitting' : ''}\"\n style=\"${this.isMobile() ? 'flex-grow:1' : ''}\"\n >\n ${this.body}\n </div>\n <div class=\"scripts\"></div>\n <div slot=\"gutter\">\n <div class=\"wizard-steps\">${wizardStepBalls}</div>\n </div>\n </temba-dialog>\n <div class=\"slot-wrapper\" @click=${this.handleSlotClicked}>\n <slot></slot>\n </div>\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"Modax.js","sourceRoot":"","sources":["../../../src/layout/Modax.ts"],"names":[],"mappings":"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","sourcesContent":["import { TemplateResult, html, css } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { unsafeHTML } from 'lit-html/directives/unsafe-html.js';\n\nimport { RapidElement } from '../RapidElement';\nimport { getUrl, serialize, postUrl, WebResponse, getClasses } from '../utils';\nimport { CustomEventType } from '../interfaces';\nimport { ButtonType, Dialog, DialogButton } from './Dialog';\n\nexport class Modax extends RapidElement {\n static get styles() {\n return css`\n fieldset {\n border: none;\n margin: 0;\n padding: 0;\n }\n\n .control-group {\n margin-bottom: var(--control-margin-bottom);\n }\n\n .form-actions {\n display: none;\n }\n\n button[type='submit'],\n input[type='submit'] {\n display: none;\n }\n\n .modax-body {\n padding: 20px;\n display: block;\n position: relative;\n background: var(--body-bg);\n }\n\n .modax-body.submitting:before {\n display: inline-block;\n content: '';\n height: 100%;\n width: 100%;\n margin-left: -20px;\n margin-top: -20px;\n background: rgba(200, 200, 200, 0.1);\n position: absolute;\n z-index: 10000;\n }\n\n temba-loading {\n margin: 0 auto;\n display: block;\n width: 150px;\n }\n\n ul.errorlist {\n margin-top: 0px;\n list-style-type: none;\n padding-left: 0;\n padding-bottom: 7px;\n }\n\n ul.errorlist li {\n color: var(--color-error);\n background: rgba(255, 181, 181, 0.17);\n box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1),\n 0 1px 2px 0 rgba(0, 0, 0, 0.06);\n color: tomato;\n padding: 10px;\n margin-bottom: 10px;\n border-radius: 6px;\n }\n\n .step-ball {\n background: rgba(var(--primary-rgb), 0.2);\n width: 1.2em;\n height: 1.2em;\n border-radius: 100%;\n margin-right: 0.5em;\n border: 0.15em solid transparent;\n }\n\n .step-ball.complete {\n background: rgba(var(--primary-rgb), 0.7);\n cursor: pointer;\n }\n .step-ball.complete:hover {\n background: rgba(var(--primary-rgb), 0.8);\n }\n\n .step-ball.active {\n border: 0.15em solid var(--color-primary-dark);\n }\n\n .wizard-steps {\n display: flex;\n flex-direction: row;\n margin-left: 0.6em;\n }\n `;\n }\n\n @property({ type: String })\n header = '';\n\n @property({ type: String })\n endpoint: string;\n\n @property({ type: Boolean, reflect: true })\n open = false;\n\n @property({ type: Boolean })\n fetching = false;\n\n @property({ type: Boolean })\n submitting: boolean;\n\n @property({ type: String })\n primaryName: string;\n\n @property({ type: String })\n cancelName: string;\n\n @property({ type: String })\n onLoaded: string;\n\n @property({ type: Boolean })\n noSubmit: boolean;\n\n @property({ type: Object })\n headers: any = {};\n\n @property({ type: String })\n body: any = this.getLoading();\n\n @property({ type: Boolean })\n disabled = false;\n\n @property({ type: Array })\n buttons: DialogButton[] = [];\n\n @property({ type: Number })\n wizardStep = 0;\n\n @property({ type: Number })\n wizardStepCount = 0;\n\n @property({ type: Boolean })\n suspendSubmit = false;\n\n @property({ type: Number })\n originX: number | null = null;\n\n @property({ type: Number })\n originY: number | null = null;\n\n // private cancelToken: CancelTokenSource;\n\n private handleSlotClicked(event: MouseEvent): void {\n const el = event.currentTarget as Element;\n if (el) {\n const rect = el.getBoundingClientRect();\n this.originX = rect.left + rect.width / 2;\n this.originY = rect.top;\n }\n this.open = true;\n }\n\n public updated(changes: Map<string, any>) {\n super.updated(changes);\n\n if (changes.has('open')) {\n if (this.open) {\n this.fetchForm();\n } else {\n // open can get reflected into undefined, make sure we've been open before\n if (changes.get('open') !== undefined) {\n // hide our body after our hiding animation is done\n if (this.open) {\n window.setTimeout(() => {\n this.body = this.getLoading();\n this.submitting = false;\n }, 500);\n } else {\n // clear the modal body out when closed, note that js functions declared on the\n // window will hang around\n this.setBody('');\n this.originX = null;\n this.originY = null;\n }\n }\n }\n }\n\n if (changes.has('body') && this.open && this.body && !this.fetching) {\n const dialog = this.shadowRoot.querySelector('temba-dialog') as Dialog;\n dialog.focusFirstInput();\n }\n }\n\n private getLoading() {\n return html`<temba-loading units=\"6\" size=\"8\"></temba-loading>`;\n }\n\n public updatePrimaryButton(): void {\n const wizard = this.shadowRoot.querySelector(\n '#wizard-form'\n ) as HTMLDivElement;\n if (wizard) {\n this.wizardStep = parseInt(wizard.dataset.step);\n this.wizardStepCount = parseInt(wizard.dataset.steps);\n }\n\n if (!this.noSubmit) {\n this.updateComplete.then(() => {\n const submitButton = this.shadowRoot.querySelector(\n \"input[type='submit'],button[type='submit']\"\n ) as any;\n\n if (submitButton) {\n this.buttons = [\n { type: ButtonType.SECONDARY, name: 'Cancel', closes: true },\n { type: ButtonType.PRIMARY, name: submitButton.value }\n ];\n } else {\n this.buttons = [\n { type: ButtonType.SECONDARY, name: 'Ok', closes: true }\n ];\n }\n this.submitting = false;\n });\n }\n }\n\n private setBody(body: string): boolean {\n // remove any existing on our previous body\n const scriptBlock = this.shadowRoot.querySelector('.scripts') as any;\n for (const child of scriptBlock.children) {\n child.remove();\n }\n\n // parse out any scripts in the body\n const div = this.ownerDocument.createElement('div');\n div.innerHTML = body;\n const scripts = div.getElementsByTagName('script');\n const toAdd: any = [];\n // now add them in\n for (let i = scripts.length - 1; i >= 0; i--) {\n // for (let i = 0; i < scripts.length; i++) {\n const script = this.ownerDocument.createElement('script');\n const code = scripts[i].innerText;\n\n if (scripts[i].src && scripts[i].src.indexOf('web-dev-server') === -1) {\n script.src = scripts[i].src;\n script.type = 'text/javascript';\n script.async = true;\n\n // TODO: track and fire event once all scripts are loaded\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n script.onload = function () {};\n toAdd.push(script);\n } else if (code) {\n script.appendChild(this.ownerDocument.createTextNode(code));\n toAdd.push(script);\n // remove it from our current body text\n }\n scripts[i].remove();\n }\n\n const scriptOnly = !!div.querySelector('.success-script');\n\n if (!scriptOnly) {\n this.body = unsafeHTML(div.innerHTML);\n }\n\n this.updateComplete.then(() => {\n for (const script of toAdd) {\n scriptBlock.appendChild(script);\n }\n });\n return !scriptOnly;\n }\n\n public getHeaders(): any {\n const headers = this.headers;\n headers['X-PJAX'] = 1;\n return headers;\n }\n\n private fetchForm() {\n // const CancelToken = axios.CancelToken;\n // this.cancelToken = CancelToken.source();\n this.fetching = true;\n this.body = this.getLoading();\n getUrl(this.endpoint, null, this.getHeaders())\n .then((response: WebResponse) => {\n // if it's a full page, breakout of the modal\n if (response.body.indexOf('<!DOCTYPE HTML>') == 0) {\n this.open = false;\n document.location = response.url;\n } else {\n this.setBody(response.body);\n this.fetching = false;\n this.updateComplete.then(() => {\n this.updatePrimaryButton();\n this.fireCustomEvent(CustomEventType.Loaded, {\n body: this.getBody()\n });\n });\n }\n })\n .catch((error) => {\n this.fetching = false;\n this.open = false;\n this.fireCustomEvent(CustomEventType.Error, { error });\n });\n }\n\n public submit(extra = {}): void {\n this.submitting = true;\n const form = this.shadowRoot.querySelector('form');\n\n let postData = form ? serialize(form) : '';\n if (extra) {\n Object.keys(extra).forEach((key) => {\n postData +=\n (postData.length > 1 ? '&' : '') +\n encodeURIComponent(key) +\n '=' +\n encodeURIComponent(extra[key]);\n });\n }\n\n postUrl(\n this.endpoint,\n postData,\n this.getHeaders(),\n 'application/x-www-form-urlencoded'\n )\n .then((response: WebResponse) => {\n window.setTimeout(() => {\n let redirect = response.headers.get('X-Temba-Success');\n if (\n !redirect &&\n response.url &&\n response.url.indexOf(this.endpoint) === -1\n ) {\n redirect = response.url;\n }\n\n if (redirect) {\n if (redirect === 'hide') {\n this.updateComplete.then(() => {\n this.open = false;\n this.fireCustomEvent(CustomEventType.Submitted);\n });\n } else {\n this.fireCustomEvent(CustomEventType.Redirected, {\n url: redirect\n });\n this.open = false;\n }\n } else {\n if (response.body.indexOf('<!DOCTYPE HTML>') == 0) {\n this.open = false;\n document.location = response.url;\n return;\n }\n\n // if we set the body, update our submit button\n if (this.setBody(response.body)) {\n this.updateComplete.then(() => {\n this.updatePrimaryButton();\n });\n }\n }\n }, 1000);\n })\n .catch((error) => {\n console.error(error);\n });\n }\n\n private handleDialogClick(evt: CustomEvent) {\n const button = evt.detail.button;\n const detail = evt.detail.detail;\n if (!button.disabled && !button.submitting) {\n if (button.primary || button.destructive) {\n if (!this.suspendSubmit) {\n this.submit();\n }\n }\n }\n\n if (detail.closes) {\n this.open = false;\n this.fetching = false;\n this.cancelName = undefined;\n }\n }\n\n private handleDialogHidden() {\n // this.cancelToken.cancel();\n this.open = false;\n this.fetching = false;\n }\n\n private isDestructive(): boolean {\n return (\n this.endpoint &&\n (this.endpoint.indexOf('delete') > -1 ||\n this.endpoint.indexOf('interrupt') > -1)\n );\n }\n\n private handleGotoStep(evt: MouseEvent) {\n const step = (evt.target as HTMLDivElement).dataset.gotoStep;\n if (step) {\n this.submit({ wizard_goto_step: step });\n }\n }\n\n public getBody() {\n return this.shadowRoot.querySelector('.modax-body');\n }\n\n public render(): TemplateResult {\n const wizardStepBalls = [];\n\n const wizard = this.shadowRoot.querySelector(\n '#wizard-form'\n ) as HTMLDivElement;\n if (wizard) {\n const completed = (wizard.getAttribute('data-completed') || '')\n .split(',')\n .filter((step) => step.length > 0);\n\n for (let i = 0; i < this.wizardStepCount; i++) {\n wizardStepBalls.push(\n html`<div\n data-goto-step=${completed[i]}\n @click=${this.handleGotoStep.bind(this)}\n class=\"${getClasses({\n 'step-ball': true,\n active: this.wizardStep - 1 === i,\n complete: i < completed.length\n })}\"\n ></div>`\n );\n }\n }\n\n return html`\n <temba-dialog\n .header=${this.header}\n .buttons=${this.buttons}\n ?open=${this.open}\n ?loading=${this.fetching && this.originX == null}\n ?submitting=${this.submitting}\n ?destructive=${this.isDestructive()}\n ?noFocus=${true}\n ?disabled=${this.disabled}\n .originX=${this.originX}\n .originY=${this.originY}\n @temba-button-clicked=${this.handleDialogClick.bind(this)}\n @temba-dialog-hidden=${this.handleDialogHidden.bind(this)}\n >\n <div\n class=\"modax-body ${this.submitting ? 'submitting' : ''}\"\n style=\"${this.isMobile() ? 'flex-grow:1' : ''}\"\n >\n ${this.body}\n </div>\n <div class=\"scripts\"></div>\n <div slot=\"gutter\">\n <div class=\"wizard-steps\">${wizardStepBalls}</div>\n </div>\n </temba-dialog>\n <div class=\"slot-wrapper\" @click=${this.handleSlotClicked}>\n <slot></slot>\n </div>\n `;\n }\n}\n"]}
@@ -127,8 +127,21 @@ export class ContentMenu extends RapidElement {
127
127
  this.fetchContentMenu();
128
128
  }
129
129
  }
130
+ getTopCenter(el) {
131
+ const rect = el.getBoundingClientRect();
132
+ return { x: rect.left + rect.width / 2, y: rect.top };
133
+ }
130
134
  handleItemClicked(item, event) {
131
- this.fireCustomEvent(CustomEventType.Selection, { item, event });
135
+ const el = event.currentTarget;
136
+ const origin = el
137
+ ? this.getTopCenter(el)
138
+ : { x: event.clientX, y: event.clientY };
139
+ this.fireCustomEvent(CustomEventType.Selection, {
140
+ item,
141
+ event,
142
+ originX: origin.x,
143
+ originY: origin.y
144
+ });
132
145
  }
133
146
  render() {
134
147
  return html `
@@ -1 +1 @@
1
- {"version":3,"file":"ContentMenu.js","sourceRoot":"","sources":["../../../src/list/ContentMenu.ts"],"names":[],"mappings":"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","sourcesContent":["import { TemplateResult, html, css } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { CustomEventType } from '../interfaces';\n\nimport { RapidElement } from '../RapidElement';\nimport { getUrl, WebResponse } from '../utils';\n\nconst HEADERS = {\n 'X-Temba-Content-Menu': '1',\n 'X-Temba-Spa': '1'\n};\nexport interface ContentMenuItem {\n type: string;\n as_button: boolean;\n label: string;\n url: string;\n disabled: boolean;\n modal_id: string;\n on_submit: string;\n primary: boolean;\n title: string;\n on_click: null;\n link_class: string;\n}\n\nexport enum ContentMenuItemType {\n LINK = 'link',\n JS = 'js',\n URL_POST = 'url_post',\n MODAX = 'modax',\n DIVIDER = 'divider'\n}\n\nexport class ContentMenu extends RapidElement {\n static get styles() {\n return css`\n :host {\n tabindex: 0;\n z-index: 5000;\n }\n .container {\n --button-y: 0.4em;\n --button-x: 1em;\n display: flex;\n align-items: center;\n }\n\n .button_item,\n .primary_button_item {\n margin-left: 1rem;\n }\n\n temba-button {\n margin-right: 0.5rem;\n }\n .toggle {\n --icon-color: rgb(102, 102, 102);\n padding: 0.4em;\n }\n\n .toggle:hover {\n background: rgba(0, 0, 0, 0.05);\n border-radius: var(--curvature);\n --icon-color: rgb(136, 136, 136);\n }\n\n .dropdown {\n padding: 1rem 1.5rem;\n color: rgb(45, 45, 45);\n z-index: 50;\n min-width: 200px;\n tabindex: 0;\n }\n\n .divider {\n border-bottom: 1px solid rgb(237, 237, 237);\n margin: 1rem -1.5em;\n }\n\n .item {\n white-space: nowrap;\n margin: 0.2em 0em;\n font-size: 1.1rem;\n cursor: pointer;\n font-weight: 400;\n tabindex: 0;\n }\n\n .item:hover {\n color: var(--color-link-primary);\n }\n `;\n }\n\n @property({ type: String })\n endpoint: string;\n\n @property({ type: Number })\n legacy: number;\n\n @property({ type: Array, attribute: false })\n buttons: ContentMenuItem[] = [];\n\n @property({ type: Array, attribute: false })\n items: ContentMenuItem[] = [];\n\n @property({ type: Boolean })\n arrowTopLeft: boolean;\n\n private fetchContentMenu() {\n const url = this.endpoint;\n if (url) {\n const legacy = this.legacy;\n const headers = HEADERS;\n if (legacy) {\n delete headers['Temba-Spa'];\n }\n\n //ok, fetch the content menu\n getUrl(url, null, headers)\n .then((response: WebResponse) => {\n const json = response.json;\n const contentMenu = json.items as ContentMenuItem[];\n\n //populate (or initialize) the buttons and items\n if (contentMenu) {\n this.buttons = contentMenu.filter((item) => item.as_button);\n this.items = contentMenu.filter((item) => !item.as_button);\n } else {\n this.buttons = [];\n this.items = [];\n }\n\n //fire custom loaded event type when we're finished\n this.fireCustomEvent(CustomEventType.Loaded, {\n buttons: this.buttons,\n items: this.items\n });\n })\n .catch((error: any) => {\n this.fireCustomEvent(CustomEventType.Loaded, {\n buttons: this.buttons,\n items: this.items\n });\n\n console.error(error);\n });\n }\n }\n\n public refresh() {\n this.fetchContentMenu();\n }\n\n protected updated(changes: Map<string, any>) {\n super.updated(changes);\n if (changes.has('endpoint') || changes.has('legacy')) {\n this.fetchContentMenu();\n }\n }\n\n private handleItemClicked(item: ContentMenuItem, event: MouseEvent) {\n this.fireCustomEvent(CustomEventType.Selection, { item, event });\n }\n\n public render(): TemplateResult {\n return html`\n <div class=\"container\">\n ${this.buttons.map((button) => {\n return html`<temba-button\n class=\"${button.primary ? 'primary_button_item' : 'button_item'}\"\n name=${button.label}\n @click=${(event) => this.handleItemClicked(button, event)}\n >\n ${button.label}\n </temba-button>`;\n })}\n ${this.items && this.items.length > 0\n ? html`<temba-dropdown>\n <div slot=\"toggle\" class=\"toggle\">\n <temba-icon name=\"menu\" size=\"1.5\"></temba-icon>\n </div>\n <div slot=\"dropdown\" class=\"dropdown\">\n ${this.items.map((item) => {\n if (item.type === ContentMenuItemType.DIVIDER) {\n return html` <div class=\"divider\"></div>`;\n } else {\n return html` <div\n class=\"item\"\n name=${item.label}\n @click=${(event) => this.handleItemClicked(item, event)}\n >\n ${item.label}\n </div>`;\n }\n })}\n </div>\n </temba-dropdown>`\n : null}\n </div>\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"ContentMenu.js","sourceRoot":"","sources":["../../../src/list/ContentMenu.ts"],"names":[],"mappings":"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","sourcesContent":["import { TemplateResult, html, css } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { CustomEventType } from '../interfaces';\n\nimport { RapidElement } from '../RapidElement';\nimport { getUrl, WebResponse } from '../utils';\n\nconst HEADERS = {\n 'X-Temba-Content-Menu': '1',\n 'X-Temba-Spa': '1'\n};\nexport interface ContentMenuItem {\n type: string;\n as_button: boolean;\n label: string;\n url: string;\n disabled: boolean;\n modal_id: string;\n on_submit: string;\n primary: boolean;\n title: string;\n on_click: null;\n link_class: string;\n}\n\nexport enum ContentMenuItemType {\n LINK = 'link',\n JS = 'js',\n URL_POST = 'url_post',\n MODAX = 'modax',\n DIVIDER = 'divider'\n}\n\nexport class ContentMenu extends RapidElement {\n static get styles() {\n return css`\n :host {\n tabindex: 0;\n z-index: 5000;\n }\n .container {\n --button-y: 0.4em;\n --button-x: 1em;\n display: flex;\n align-items: center;\n }\n\n .button_item,\n .primary_button_item {\n margin-left: 1rem;\n }\n\n temba-button {\n margin-right: 0.5rem;\n }\n .toggle {\n --icon-color: rgb(102, 102, 102);\n padding: 0.4em;\n }\n\n .toggle:hover {\n background: rgba(0, 0, 0, 0.05);\n border-radius: var(--curvature);\n --icon-color: rgb(136, 136, 136);\n }\n\n .dropdown {\n padding: 1rem 1.5rem;\n color: rgb(45, 45, 45);\n z-index: 50;\n min-width: 200px;\n tabindex: 0;\n }\n\n .divider {\n border-bottom: 1px solid rgb(237, 237, 237);\n margin: 1rem -1.5em;\n }\n\n .item {\n white-space: nowrap;\n margin: 0.2em 0em;\n font-size: 1.1rem;\n cursor: pointer;\n font-weight: 400;\n tabindex: 0;\n }\n\n .item:hover {\n color: var(--color-link-primary);\n }\n `;\n }\n\n @property({ type: String })\n endpoint: string;\n\n @property({ type: Number })\n legacy: number;\n\n @property({ type: Array, attribute: false })\n buttons: ContentMenuItem[] = [];\n\n @property({ type: Array, attribute: false })\n items: ContentMenuItem[] = [];\n\n @property({ type: Boolean })\n arrowTopLeft: boolean;\n\n private fetchContentMenu() {\n const url = this.endpoint;\n if (url) {\n const legacy = this.legacy;\n const headers = HEADERS;\n if (legacy) {\n delete headers['Temba-Spa'];\n }\n\n //ok, fetch the content menu\n getUrl(url, null, headers)\n .then((response: WebResponse) => {\n const json = response.json;\n const contentMenu = json.items as ContentMenuItem[];\n\n //populate (or initialize) the buttons and items\n if (contentMenu) {\n this.buttons = contentMenu.filter((item) => item.as_button);\n this.items = contentMenu.filter((item) => !item.as_button);\n } else {\n this.buttons = [];\n this.items = [];\n }\n\n //fire custom loaded event type when we're finished\n this.fireCustomEvent(CustomEventType.Loaded, {\n buttons: this.buttons,\n items: this.items\n });\n })\n .catch((error: any) => {\n this.fireCustomEvent(CustomEventType.Loaded, {\n buttons: this.buttons,\n items: this.items\n });\n\n console.error(error);\n });\n }\n }\n\n public refresh() {\n this.fetchContentMenu();\n }\n\n protected updated(changes: Map<string, any>) {\n super.updated(changes);\n if (changes.has('endpoint') || changes.has('legacy')) {\n this.fetchContentMenu();\n }\n }\n\n private getTopCenter(el: Element): { x: number; y: number } {\n const rect = el.getBoundingClientRect();\n return { x: rect.left + rect.width / 2, y: rect.top };\n }\n\n private handleItemClicked(item: ContentMenuItem, event: MouseEvent) {\n const el = event.currentTarget as Element;\n const origin = el\n ? this.getTopCenter(el)\n : { x: event.clientX, y: event.clientY };\n this.fireCustomEvent(CustomEventType.Selection, {\n item,\n event,\n originX: origin.x,\n originY: origin.y\n });\n }\n\n public render(): TemplateResult {\n return html`\n <div class=\"container\">\n ${this.buttons.map((button) => {\n return html`<temba-button\n class=\"${button.primary ? 'primary_button_item' : 'button_item'}\"\n name=${button.label}\n @click=${(event) => this.handleItemClicked(button, event)}\n >\n ${button.label}\n </temba-button>`;\n })}\n ${this.items && this.items.length > 0\n ? html`<temba-dropdown>\n <div slot=\"toggle\" class=\"toggle\">\n <temba-icon name=\"menu\" size=\"1.5\"></temba-icon>\n </div>\n <div slot=\"dropdown\" class=\"dropdown\">\n ${this.items.map((item) => {\n if (item.type === ContentMenuItemType.DIVIDER) {\n return html` <div class=\"divider\"></div>`;\n } else {\n return html` <div\n class=\"item\"\n name=${item.label}\n @click=${(event) => this.handleItemClicked(item, event)}\n >\n ${item.label}\n </div>`;\n }\n })}\n </div>\n </temba-dropdown>`\n : null}\n </div>\n `;\n }\n}\n"]}
@@ -3,10 +3,10 @@
3
3
  /* eslint-disable no-irregular-whitespace */
4
4
  /* eslint-disable @typescript-eslint/no-explicit-any */
5
5
  export const templates = {
6
- scf1453991c986b25: `Tab para completar, enter para seleccionar`,
7
- s73b4d70c02f4b4e0: `No options`,
8
- s8f02e3a18ffc083a: `Are not currently in a flow`,
9
- s638236250662c6b3: `Have sent a message in the last`,
10
- s4788ee206c4570c7: `Have not started this flow in the last 90 days`
6
+ 'scf1453991c986b25': `Tab para completar, enter para seleccionar`,
7
+ 's73b4d70c02f4b4e0': `No options`,
8
+ 's8f02e3a18ffc083a': `Are not currently in a flow`,
9
+ 's638236250662c6b3': `Have sent a message in the last`,
10
+ 's4788ee206c4570c7': `Have not started this flow in the last 90 days`,
11
11
  };
12
12
  //# sourceMappingURL=es.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"es.js","sourceRoot":"","sources":["../../../src/locales/es.ts"],"names":[],"mappings":"AAAA,mCAAmC;AACnC,gDAAgD;AAEhD,4CAA4C;AAC5C,uDAAuD;AAEvD,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,iBAAiB,EAAE,4CAA4C;IAC/D,iBAAiB,EAAE,YAAY;IAC/B,iBAAiB,EAAE,6BAA6B;IAChD,iBAAiB,EAAE,iCAAiC;IACpD,iBAAiB,EAAE,gDAAgD;CACpE,CAAC","sourcesContent":["// Do not modify this file by hand!\n// Re-generate this file by running lit-localize\n\n/* eslint-disable no-irregular-whitespace */\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nexport const templates = {\n scf1453991c986b25: `Tab para completar, enter para seleccionar`,\n s73b4d70c02f4b4e0: `No options`,\n s8f02e3a18ffc083a: `Are not currently in a flow`,\n s638236250662c6b3: `Have sent a message in the last`,\n s4788ee206c4570c7: `Have not started this flow in the last 90 days`\n};\n"]}
1
+ {"version":3,"file":"es.js","sourceRoot":"","sources":["../../../src/locales/es.ts"],"names":[],"mappings":"AACI,mCAAmC;AACnC,gDAAgD;AAKhD,4CAA4C;AAC5C,uDAAuD;AAEvD,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,mBAAmB,EAAE,4CAA4C;IACvE,mBAAmB,EAAE,YAAY;IACjC,mBAAmB,EAAE,6BAA6B;IAClD,mBAAmB,EAAE,iCAAiC;IACtD,mBAAmB,EAAE,gDAAgD;CAChE,CAAC","sourcesContent":["\n // Do not modify this file by hand!\n // Re-generate this file by running lit-localize\n\n \n \n\n /* eslint-disable no-irregular-whitespace */\n /* eslint-disable @typescript-eslint/no-explicit-any */\n\n export const templates = {\n 'scf1453991c986b25': `Tab para completar, enter para seleccionar`,\n's73b4d70c02f4b4e0': `No options`,\n's8f02e3a18ffc083a': `Are not currently in a flow`,\n's638236250662c6b3': `Have sent a message in the last`,\n's4788ee206c4570c7': `Have not started this flow in the last 90 days`,\n };\n "]}
@@ -3,10 +3,10 @@
3
3
  /* eslint-disable no-irregular-whitespace */
4
4
  /* eslint-disable @typescript-eslint/no-explicit-any */
5
5
  export const templates = {
6
- s73b4d70c02f4b4e0: `No options`,
7
- scf1453991c986b25: `Tab to complete, enter to select`,
8
- s8f02e3a18ffc083a: `Are not currently in a flow`,
9
- s638236250662c6b3: `Have sent a message in the last`,
10
- s4788ee206c4570c7: `Have not started this flow in the last 90 days`
6
+ 's73b4d70c02f4b4e0': `No options`,
7
+ 'scf1453991c986b25': `Tab to complete, enter to select`,
8
+ 's8f02e3a18ffc083a': `Are not currently in a flow`,
9
+ 's638236250662c6b3': `Have sent a message in the last`,
10
+ 's4788ee206c4570c7': `Have not started this flow in the last 90 days`,
11
11
  };
12
12
  //# sourceMappingURL=fr.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"fr.js","sourceRoot":"","sources":["../../../src/locales/fr.ts"],"names":[],"mappings":"AAAA,mCAAmC;AACnC,gDAAgD;AAEhD,4CAA4C;AAC5C,uDAAuD;AAEvD,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,iBAAiB,EAAE,YAAY;IAC/B,iBAAiB,EAAE,kCAAkC;IACrD,iBAAiB,EAAE,6BAA6B;IAChD,iBAAiB,EAAE,iCAAiC;IACpD,iBAAiB,EAAE,gDAAgD;CACpE,CAAC","sourcesContent":["// Do not modify this file by hand!\n// Re-generate this file by running lit-localize\n\n/* eslint-disable no-irregular-whitespace */\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nexport const templates = {\n s73b4d70c02f4b4e0: `No options`,\n scf1453991c986b25: `Tab to complete, enter to select`,\n s8f02e3a18ffc083a: `Are not currently in a flow`,\n s638236250662c6b3: `Have sent a message in the last`,\n s4788ee206c4570c7: `Have not started this flow in the last 90 days`\n};\n"]}
1
+ {"version":3,"file":"fr.js","sourceRoot":"","sources":["../../../src/locales/fr.ts"],"names":[],"mappings":"AACI,mCAAmC;AACnC,gDAAgD;AAKhD,4CAA4C;AAC5C,uDAAuD;AAEvD,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,mBAAmB,EAAE,YAAY;IACvC,mBAAmB,EAAE,kCAAkC;IACvD,mBAAmB,EAAE,6BAA6B;IAClD,mBAAmB,EAAE,iCAAiC;IACtD,mBAAmB,EAAE,gDAAgD;CAChE,CAAC","sourcesContent":["\n // Do not modify this file by hand!\n // Re-generate this file by running lit-localize\n\n \n \n\n /* eslint-disable no-irregular-whitespace */\n /* eslint-disable @typescript-eslint/no-explicit-any */\n\n export const templates = {\n 's73b4d70c02f4b4e0': `No options`,\n'scf1453991c986b25': `Tab to complete, enter to select`,\n's8f02e3a18ffc083a': `Are not currently in a flow`,\n's638236250662c6b3': `Have sent a message in the last`,\n's4788ee206c4570c7': `Have not started this flow in the last 90 days`,\n };\n "]}
@@ -8,9 +8,18 @@ export const sourceLocale = `en`;
8
8
  * The other locale codes that this application is localized into. Sorted
9
9
  * lexicographically.
10
10
  */
11
- export const targetLocales = [`es`, `fr`, `pt`];
11
+ export const targetLocales = [
12
+ `es`,
13
+ `fr`,
14
+ `pt`,
15
+ ];
12
16
  /**
13
17
  * All valid project locale codes. Sorted lexicographically.
14
18
  */
15
- export const allLocales = [`en`, `es`, `fr`, `pt`];
19
+ export const allLocales = [
20
+ `en`,
21
+ `es`,
22
+ `fr`,
23
+ `pt`,
24
+ ];
16
25
  //# sourceMappingURL=locale-codes.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"locale-codes.js","sourceRoot":"","sources":["../../../src/locales/locale-codes.ts"],"names":[],"mappings":"AAAA,mCAAmC;AACnC,iDAAiD;AAEjD;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,IAAI,CAAC;AAEjC;;;GAGG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAU,CAAC;AAEzD;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAU,CAAC","sourcesContent":["// Do not modify this file by hand!\n// Re-generate this file by running lit-localize.\n\n/**\n * The locale code that templates in this source code are written in.\n */\nexport const sourceLocale = `en`;\n\n/**\n * The other locale codes that this application is localized into. Sorted\n * lexicographically.\n */\nexport const targetLocales = [`es`, `fr`, `pt`] as const;\n\n/**\n * All valid project locale codes. Sorted lexicographically.\n */\nexport const allLocales = [`en`, `es`, `fr`, `pt`] as const;\n"]}
1
+ {"version":3,"file":"locale-codes.js","sourceRoot":"","sources":["../../../src/locales/locale-codes.ts"],"names":[],"mappings":"AAAA,mCAAmC;AACnC,iDAAiD;AAEjD;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,IAAI,CAAC;AAEjC;;;GAGG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG;IAC3B,IAAI;IACJ,IAAI;IACJ,IAAI;CACI,CAAC;AAEX;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;CACI,CAAC","sourcesContent":["// Do not modify this file by hand!\n// Re-generate this file by running lit-localize.\n\n/**\n * The locale code that templates in this source code are written in.\n */\nexport const sourceLocale = `en`;\n\n/**\n * The other locale codes that this application is localized into. Sorted\n * lexicographically.\n */\nexport const targetLocales = [\n `es`,\n `fr`,\n `pt`,\n] as const;\n\n/**\n * All valid project locale codes. Sorted lexicographically.\n */\nexport const allLocales = [\n `en`,\n `es`,\n `fr`,\n `pt`,\n] as const;\n"]}
@@ -3,10 +3,10 @@
3
3
  /* eslint-disable no-irregular-whitespace */
4
4
  /* eslint-disable @typescript-eslint/no-explicit-any */
5
5
  export const templates = {
6
- s73b4d70c02f4b4e0: `No options`,
7
- scf1453991c986b25: `Tab to complete, enter to select`,
8
- s8f02e3a18ffc083a: `Are not currently in a flow`,
9
- s638236250662c6b3: `Have sent a message in the last`,
10
- s4788ee206c4570c7: `Have not started this flow in the last 90 days`
6
+ 's73b4d70c02f4b4e0': `No options`,
7
+ 'scf1453991c986b25': `Tab to complete, enter to select`,
8
+ 's8f02e3a18ffc083a': `Are not currently in a flow`,
9
+ 's638236250662c6b3': `Have sent a message in the last`,
10
+ 's4788ee206c4570c7': `Have not started this flow in the last 90 days`,
11
11
  };
12
12
  //# sourceMappingURL=pt.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"pt.js","sourceRoot":"","sources":["../../../src/locales/pt.ts"],"names":[],"mappings":"AAAA,mCAAmC;AACnC,gDAAgD;AAEhD,4CAA4C;AAC5C,uDAAuD;AAEvD,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,iBAAiB,EAAE,YAAY;IAC/B,iBAAiB,EAAE,kCAAkC;IACrD,iBAAiB,EAAE,6BAA6B;IAChD,iBAAiB,EAAE,iCAAiC;IACpD,iBAAiB,EAAE,gDAAgD;CACpE,CAAC","sourcesContent":["// Do not modify this file by hand!\n// Re-generate this file by running lit-localize\n\n/* eslint-disable no-irregular-whitespace */\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nexport const templates = {\n s73b4d70c02f4b4e0: `No options`,\n scf1453991c986b25: `Tab to complete, enter to select`,\n s8f02e3a18ffc083a: `Are not currently in a flow`,\n s638236250662c6b3: `Have sent a message in the last`,\n s4788ee206c4570c7: `Have not started this flow in the last 90 days`\n};\n"]}
1
+ {"version":3,"file":"pt.js","sourceRoot":"","sources":["../../../src/locales/pt.ts"],"names":[],"mappings":"AACI,mCAAmC;AACnC,gDAAgD;AAKhD,4CAA4C;AAC5C,uDAAuD;AAEvD,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,mBAAmB,EAAE,YAAY;IACvC,mBAAmB,EAAE,kCAAkC;IACvD,mBAAmB,EAAE,6BAA6B;IAClD,mBAAmB,EAAE,iCAAiC;IACtD,mBAAmB,EAAE,gDAAgD;CAChE,CAAC","sourcesContent":["\n // Do not modify this file by hand!\n // Re-generate this file by running lit-localize\n\n \n \n\n /* eslint-disable no-irregular-whitespace */\n /* eslint-disable @typescript-eslint/no-explicit-any */\n\n export const templates = {\n 's73b4d70c02f4b4e0': `No options`,\n'scf1453991c986b25': `Tab to complete, enter to select`,\n's8f02e3a18ffc083a': `Are not currently in a flow`,\n's638236250662c6b3': `Have sent a message in the last`,\n's4788ee206c4570c7': `Have not started this flow in the last 90 days`,\n };\n "]}