@templatical/editor 0.26.2 → 0.27.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 (285) hide show
  1. package/README.md +3 -1
  2. package/dist/{AiChatSidebar-CMBz6Wix.js → AiChatSidebar-iVJDzqjr.js} +60 -60
  3. package/dist/AiFeatureMenu-DvrK-dzj.js +57 -0
  4. package/dist/{BlockIssueBadge-Buk3_6QF.js → BlockIssueBadge-BHysq7XQ.js} +11 -11
  5. package/dist/BlockPreviewCanvas-GZbr0ph5.js +121 -0
  6. package/dist/CloudHeaderExtras-Cx8gFWu2.js +59 -0
  7. package/dist/CloudPanels-D0X449DD.js +227 -0
  8. package/dist/{CollaboratorBar-zvfvE7f-.js → CollaboratorBar-DMSWCrX3.js} +21 -21
  9. package/dist/ColorPicker-DCjFQCAg.js +501 -0
  10. package/dist/CommentsPanel-D5wQB1Kf.js +18 -0
  11. package/dist/CommentsSidebar-BoTIxpLE.js +481 -0
  12. package/dist/{cdn/chunks/CountdownBlock-vLTkTI9e.js → CountdownBlock-BFX8iU90.js} +19 -21
  13. package/dist/{cdn/chunks/CountdownToolbar-DPjcgcVR.js → CountdownToolbar-CSftc9Ma.js} +52 -53
  14. package/dist/{DesignReferenceSidebar-Bx96XFmK.js → DesignReferenceSidebar-DKsx2TiL.js} +72 -71
  15. package/dist/{IssuesPanel-Do7RLXsP.js → IssuesPanel-flKKwKpM.js} +38 -38
  16. package/dist/{LoadingTrack-BexpNuTV.js → LoadingTrack-C2T8ixEL.js} +3 -3
  17. package/dist/{MergeTagModeToggle-P-UguQHc.js → MergeTagModeToggle-PKCoKAoF.js} +43 -43
  18. package/dist/{MergeTagSuggestion-BJ43ihWR.js → MergeTagSuggestion-DGha0WRp.js} +46 -46
  19. package/dist/{cdn/chunks/NumberWithSuffix-BXrRdfq1.js → NumberWithSuffix-DdPCXfKf.js} +42 -44
  20. package/dist/{ParagraphEditor-CLvv5Ija.js → ParagraphEditor-vDU-5y6r.js} +202 -199
  21. package/dist/RestoreVersionDialog-DIn1muFD.js +86 -0
  22. package/dist/{RichTextEditorContent-fbYJXAio.js → RichTextEditorContent-I83k5DtQ.js} +44 -44
  23. package/dist/SaveBlockDialog-C_QvYAeL.js +266 -0
  24. package/dist/{SavedBlocksBrowserModal-KWlaiLlr.js → SavedBlocksBrowserModal-CefWWcdT.js} +116 -115
  25. package/dist/{cdn/chunks/SavedBlocksPanels-e4HyTZ8v.js → SavedBlocksPanels-DnQwO-7O.js} +9 -11
  26. package/dist/{SavedBlocksPickBar-C3h8oL3r.js → SavedBlocksPickBar-BsFubArH.js} +17 -17
  27. package/dist/{TemplateScoringPanel-BZUsb3FD.js → TemplateScoringPanel-Bv_bBsJi.js} +87 -87
  28. package/dist/TestEmailModal-STPWDP79.js +206 -0
  29. package/dist/{cdn/chunks/TestEmailPanel-CZAG1gQE.js → TestEmailPanel-HYVjApKZ.js} +4 -6
  30. package/dist/TitleEditor-DnB0EJ_g.js +198 -0
  31. package/dist/TplModal-chvLhXmC.js +49 -0
  32. package/dist/VersionHistoryMenu-Cq4rH56t.js +155 -0
  33. package/dist/VersionHistoryPanels-D7k_F7-9.js +46 -0
  34. package/dist/VersionPreviewBanner-DthyHe6C.js +38 -0
  35. package/dist/{blockTypeIcons-2_85L_CL.js → blockTypeIcons-B8r4jMBn.js} +6 -6
  36. package/dist/bundle-stats.json +8 -8
  37. package/dist/{ca-D1zgI9fQ.js → ca-Cqg9O8mx.js} +69 -6
  38. package/dist/cdn/chunks/{AiChatSidebar-CQ8KUmNB.js → AiChatSidebar-DTUoBH5a.js} +54 -54
  39. package/dist/cdn/chunks/AiChatSidebar-DTUoBH5a.js.map +1 -0
  40. package/dist/cdn/chunks/AiFeatureMenu-Dyh7mUMB.js +57 -0
  41. package/dist/cdn/chunks/AiFeatureMenu-Dyh7mUMB.js.map +1 -0
  42. package/dist/cdn/chunks/{BlockIssueBadge-BEEY9o2o.js → BlockIssueBadge-UzSSOM_2.js} +13 -13
  43. package/dist/cdn/chunks/{BlockIssueBadge-BEEY9o2o.js.map → BlockIssueBadge-UzSSOM_2.js.map} +1 -1
  44. package/dist/cdn/chunks/{BlockPreviewCanvas-DPtiMsVz.js → BlockPreviewCanvas-DStQFo9P.js} +42 -42
  45. package/dist/cdn/chunks/{BlockPreviewCanvas-DPtiMsVz.js.map → BlockPreviewCanvas-DStQFo9P.js.map} +1 -1
  46. package/dist/cdn/chunks/CloudHeaderExtras-BZVu7dnO.js +60 -0
  47. package/dist/cdn/chunks/CloudHeaderExtras-BZVu7dnO.js.map +1 -0
  48. package/dist/cdn/chunks/CloudPanels-CXbaBKHQ.js +227 -0
  49. package/dist/cdn/chunks/CloudPanels-CXbaBKHQ.js.map +1 -0
  50. package/dist/cdn/chunks/{CollaboratorBar-BF469_AN.js → CollaboratorBar-BH_lZlat.js} +22 -22
  51. package/dist/cdn/chunks/CollaboratorBar-BH_lZlat.js.map +1 -0
  52. package/dist/cdn/chunks/ColorPicker-CStXen0Y.js +502 -0
  53. package/dist/cdn/chunks/ColorPicker-CStXen0Y.js.map +1 -0
  54. package/dist/cdn/chunks/CommentsPanel-jzZ2X0P4.js +20 -0
  55. package/dist/cdn/chunks/CommentsPanel-jzZ2X0P4.js.map +1 -0
  56. package/dist/cdn/chunks/CommentsSidebar-Dxke-vUP.js +460 -0
  57. package/dist/cdn/chunks/CommentsSidebar-Dxke-vUP.js.map +1 -0
  58. package/dist/{CountdownBlock-DuyvGcr8.js → cdn/chunks/CountdownBlock-BYSrJWxg.js} +25 -23
  59. package/dist/cdn/chunks/{CountdownBlock-vLTkTI9e.js.map → CountdownBlock-BYSrJWxg.js.map} +1 -1
  60. package/dist/{CountdownToolbar-CBE9wRaV.js → cdn/chunks/CountdownToolbar-CZPtQIb8.js} +66 -63
  61. package/dist/cdn/chunks/{CountdownToolbar-DPjcgcVR.js.map → CountdownToolbar-CZPtQIb8.js.map} +1 -1
  62. package/dist/cdn/chunks/{DesignReferenceSidebar-B-HFXV0W.js → DesignReferenceSidebar-sZWciECR.js} +64 -64
  63. package/dist/cdn/chunks/DesignReferenceSidebar-sZWciECR.js.map +1 -0
  64. package/dist/cdn/chunks/{IssuesPanel-DKTS4QVb.js → IssuesPanel-CHtetM9i.js} +36 -36
  65. package/dist/cdn/chunks/IssuesPanel-CHtetM9i.js.map +1 -0
  66. package/dist/cdn/chunks/{LoadingTrack-C52ZGL5q.js → LoadingTrack-Dp_QZvAK.js} +3 -3
  67. package/dist/cdn/chunks/{LoadingTrack-C52ZGL5q.js.map → LoadingTrack-Dp_QZvAK.js.map} +1 -1
  68. package/dist/cdn/chunks/{MergeTagModeToggle-DQ79SqQc.js → MergeTagModeToggle-ZwW-5EeN.js} +39 -39
  69. package/dist/cdn/chunks/{MergeTagModeToggle-DQ79SqQc.js.map → MergeTagModeToggle-ZwW-5EeN.js.map} +1 -1
  70. package/dist/cdn/chunks/{MergeTagSuggestion-Dn8dExNa.js → MergeTagSuggestion-DhllqTA3.js} +47 -47
  71. package/dist/cdn/chunks/MergeTagSuggestion-DhllqTA3.js.map +1 -0
  72. package/dist/{NumberWithSuffix-D37ZWiZh.js → cdn/chunks/NumberWithSuffix-yeQLcCyH.js} +37 -35
  73. package/dist/cdn/chunks/NumberWithSuffix-yeQLcCyH.js.map +1 -0
  74. package/dist/cdn/chunks/{ParagraphEditor-Bzcma_Lm.js → ParagraphEditor-BJJ925sx.js} +235 -233
  75. package/dist/cdn/chunks/ParagraphEditor-BJJ925sx.js.map +1 -0
  76. package/dist/cdn/chunks/RestoreVersionDialog-B0Jadu6F.js +87 -0
  77. package/dist/cdn/chunks/RestoreVersionDialog-B0Jadu6F.js.map +1 -0
  78. package/dist/cdn/chunks/{RichTextEditorContent-DtL49Jpo.js → RichTextEditorContent-CfSq2wPR.js} +44 -44
  79. package/dist/cdn/chunks/RichTextEditorContent-CfSq2wPR.js.map +1 -0
  80. package/dist/cdn/chunks/SaveBlockDialog-C1DXh6P9.js +265 -0
  81. package/dist/cdn/chunks/SaveBlockDialog-C1DXh6P9.js.map +1 -0
  82. package/dist/cdn/chunks/{SavedBlocksBrowserModal-C59D4G5C.js → SavedBlocksBrowserModal-BerMxAUt.js} +114 -113
  83. package/dist/cdn/chunks/SavedBlocksBrowserModal-BerMxAUt.js.map +1 -0
  84. package/dist/{SavedBlocksPanels-CQsZvWO_.js → cdn/chunks/SavedBlocksPanels-BUE4lzVP.js} +11 -9
  85. package/dist/cdn/chunks/{SavedBlocksPanels-e4HyTZ8v.js.map → SavedBlocksPanels-BUE4lzVP.js.map} +1 -1
  86. package/dist/cdn/chunks/{SavedBlocksPickBar-DMHxPCM4.js → SavedBlocksPickBar-4HrqQfvl.js} +17 -17
  87. package/dist/cdn/chunks/SavedBlocksPickBar-4HrqQfvl.js.map +1 -0
  88. package/dist/cdn/chunks/{TemplateScoringPanel-NucRtAP0.js → TemplateScoringPanel-Xdkp2EMY.js} +81 -81
  89. package/dist/cdn/chunks/TemplateScoringPanel-Xdkp2EMY.js.map +1 -0
  90. package/dist/cdn/chunks/TestEmailModal-yfmFiavR.js +206 -0
  91. package/dist/cdn/chunks/TestEmailModal-yfmFiavR.js.map +1 -0
  92. package/dist/{TestEmailPanel-B6goIAxT.js → cdn/chunks/TestEmailPanel-DqTDh5ri.js} +6 -4
  93. package/dist/cdn/chunks/{TestEmailPanel-CZAG1gQE.js.map → TestEmailPanel-DqTDh5ri.js.map} +1 -1
  94. package/dist/cdn/chunks/{TitleEditor-D0_LY2Ex.js → TitleEditor-nUAF7fKr.js} +85 -84
  95. package/dist/cdn/chunks/TitleEditor-nUAF7fKr.js.map +1 -0
  96. package/dist/cdn/chunks/TplModal-C0IqikoV.js +50 -0
  97. package/dist/cdn/chunks/TplModal-C0IqikoV.js.map +1 -0
  98. package/dist/cdn/chunks/VersionHistoryMenu-_MAj3qZj.js +148 -0
  99. package/dist/cdn/chunks/VersionHistoryMenu-_MAj3qZj.js.map +1 -0
  100. package/dist/cdn/chunks/VersionHistoryPanels-6Hz9w20W.js +48 -0
  101. package/dist/cdn/chunks/VersionHistoryPanels-6Hz9w20W.js.map +1 -0
  102. package/dist/cdn/chunks/VersionPreviewBanner-D098_6_I.js +40 -0
  103. package/dist/cdn/chunks/VersionPreviewBanner-D098_6_I.js.map +1 -0
  104. package/dist/cdn/chunks/{blockTypeIcons-FXlMM3PL.js → blockTypeIcons-hX_W4dqo.js} +2 -2
  105. package/dist/cdn/chunks/{blockTypeIcons-FXlMM3PL.js.map → blockTypeIcons-hX_W4dqo.js.map} +1 -1
  106. package/dist/cdn/chunks/{ca-D1zgI9fQ.js → ca-Cqg9O8mx.js} +70 -7
  107. package/dist/cdn/chunks/ca-Cqg9O8mx.js.map +1 -0
  108. package/dist/{cloud-qINCmQbn.js → cdn/chunks/cloud-BA0OpRh-.js} +400 -609
  109. package/dist/cdn/chunks/cloud-BA0OpRh-.js.map +1 -0
  110. package/dist/cdn/chunks/createCloudRuntime-DmzV7OnU.js +344 -0
  111. package/dist/cdn/chunks/createCloudRuntime-DmzV7OnU.js.map +1 -0
  112. package/dist/{de-DHra3lvx.js → cdn/chunks/de-BXmeeFbX.js} +71 -6
  113. package/dist/cdn/chunks/de-BXmeeFbX.js.map +1 -0
  114. package/dist/{de-uVoSP1xF.js → cdn/chunks/de-Dbwm2cON.js} +3 -54
  115. package/dist/cdn/chunks/de-Dbwm2cON.js.map +1 -0
  116. package/dist/cdn/chunks/{dist-B2HKGHnc.js → dist-CM8TB0VD.js} +136 -136
  117. package/dist/cdn/chunks/{dist-B2HKGHnc.js.map → dist-CM8TB0VD.js.map} +1 -1
  118. package/dist/cdn/chunks/{dist-C6z8AjBC.js → dist-CYLJiSiH.js} +63 -63
  119. package/dist/cdn/chunks/{dist-C6z8AjBC.js.map → dist-CYLJiSiH.js.map} +1 -1
  120. package/dist/cdn/chunks/{draggable-DCs9qL-b.js → draggable-BfpsXFg7.js} +916 -905
  121. package/dist/cdn/chunks/{draggable-DCs9qL-b.js.map → draggable-BfpsXFg7.js.map} +1 -1
  122. package/dist/cdn/chunks/{en-DlqX2YWZ.js → en-DbBNy67B.js} +70 -7
  123. package/dist/cdn/chunks/en-DbBNy67B.js.map +1 -0
  124. package/dist/{en-CjhsJxb-.js → cdn/chunks/en-Dzw4EqNI.js} +3 -54
  125. package/dist/cdn/chunks/en-Dzw4EqNI.js.map +1 -0
  126. package/dist/cdn/chunks/{es-Cuss2snv.js → es-JUsAjxWu.js} +70 -7
  127. package/dist/cdn/chunks/es-JUsAjxWu.js.map +1 -0
  128. package/dist/cdn/chunks/{extensions-C7h52yuk.js → extensions-CMcVw2uu.js} +81 -67
  129. package/dist/cdn/chunks/extensions-CMcVw2uu.js.map +1 -0
  130. package/dist/{fr-Cm85vB2g.js → cdn/chunks/fr-J3qgXH4h.js} +71 -6
  131. package/dist/cdn/chunks/fr-J3qgXH4h.js.map +1 -0
  132. package/dist/cdn/chunks/{icons-CvYN6zrM.js → icons-C36Ha5VU.js} +11 -11
  133. package/dist/cdn/chunks/{icons-CvYN6zrM.js.map → icons-C36Ha5VU.js.map} +1 -1
  134. package/dist/{keys-fwF3qZax.js → cdn/chunks/keys-CbQuRX85.js} +6 -4
  135. package/dist/cdn/chunks/keys-CbQuRX85.js.map +1 -0
  136. package/dist/cdn/chunks/logger-ByvdoAwq.js +23 -0
  137. package/dist/cdn/chunks/logger-ByvdoAwq.js.map +1 -0
  138. package/dist/cdn/chunks/{nl-dmiIX7oT.js → nl-D_4DkqOi.js} +70 -7
  139. package/dist/cdn/chunks/nl-D_4DkqOi.js.map +1 -0
  140. package/dist/cdn/chunks/preRenderCustomBlocks-CbA3RcAy.js +23 -0
  141. package/dist/cdn/chunks/preRenderCustomBlocks-CbA3RcAy.js.map +1 -0
  142. package/dist/{pt-BR-CTzHTqJD.js → cdn/chunks/pt-BR-BxzQzWGJ.js} +3 -54
  143. package/dist/cdn/chunks/pt-BR-BxzQzWGJ.js.map +1 -0
  144. package/dist/cdn/chunks/{pt-BR-CaIG-7EM.js → pt-BR-KGURyEEQ.js} +70 -7
  145. package/dist/cdn/chunks/pt-BR-KGURyEEQ.js.map +1 -0
  146. package/dist/cdn/chunks/{src-CUKUsRzX.js → src-BOjFLNf7.js} +148 -134
  147. package/dist/cdn/chunks/src-BOjFLNf7.js.map +1 -0
  148. package/dist/cdn/chunks/{src-xkGep9eN.js → src-Dq3fgSIx.js} +1448 -1458
  149. package/dist/cdn/chunks/src-Dq3fgSIx.js.map +1 -0
  150. package/dist/cdn/chunks/styleConstants-ByDqaYj_.js +61 -0
  151. package/dist/cdn/chunks/styleConstants-ByDqaYj_.js.map +1 -0
  152. package/dist/cdn/chunks/timeouts-DHPZQ0G3.js +6 -0
  153. package/dist/cdn/chunks/timeouts-DHPZQ0G3.js.map +1 -0
  154. package/dist/cdn/chunks/{tiptap-C44S1Cmh.js → tiptap-DmpGap5g.js} +40 -40
  155. package/dist/cdn/chunks/{tiptap-C44S1Cmh.js.map → tiptap-DmpGap5g.js.map} +1 -1
  156. package/dist/cdn/chunks/{useAliveFlag-Dxwgo6P4.js → useAliveFlag-Dtm174fG.js} +2 -2
  157. package/dist/cdn/chunks/{useAliveFlag-Dxwgo6P4.js.map → useAliveFlag-Dtm174fG.js.map} +1 -1
  158. package/dist/cdn/chunks/{useCloudI18n-8wkJtuJD.js → useCloudI18n-NVa1aeY8.js} +5 -5
  159. package/dist/cdn/chunks/{useCloudI18n-8wkJtuJD.js.map → useCloudI18n-NVa1aeY8.js.map} +1 -1
  160. package/dist/cdn/chunks/{useEditorCore-CKQ9gmoo.js → useEditorCore-CTu_qZ3W.js} +1434 -1147
  161. package/dist/cdn/chunks/useEditorCore-CTu_qZ3W.js.map +1 -0
  162. package/dist/cdn/chunks/{useI18n-UMs0F71x.js → useI18n-DVWCJJFH.js} +5 -5
  163. package/dist/cdn/chunks/{useI18n-UMs0F71x.js.map → useI18n-DVWCJJFH.js.map} +1 -1
  164. package/dist/cdn/chunks/{useMergeTag-JmXOtpln.js → useMergeTag-BfZBRPQp.js} +4 -4
  165. package/dist/cdn/chunks/{useMergeTag-JmXOtpln.js.map → useMergeTag-BfZBRPQp.js.map} +1 -1
  166. package/dist/cdn/chunks/{usePopoverPosition-cf8Y-ynK.js → usePopoverPosition-BC-HA7TK.js} +3 -3
  167. package/dist/cdn/chunks/{usePopoverPosition-cf8Y-ynK.js.map → usePopoverPosition-BC-HA7TK.js.map} +1 -1
  168. package/dist/cdn/editor.css +1 -1
  169. package/dist/cdn/editor.js +5103 -284
  170. package/dist/cdn/editor.js.map +1 -1
  171. package/dist/{check-On4TSac-.js → check-DZbmkMQe.js} +1 -1
  172. package/dist/{chevron-down-69EiBGoB.js → chevron-down-nYScOLeZ.js} +1 -1
  173. package/dist/{chevron-up-Dh3MG1Dw.js → chevron-up-CpYpDLnc.js} +1 -1
  174. package/dist/{circle-alert-cilwzafX.js → circle-alert-CuuK6thq.js} +1 -1
  175. package/dist/{clock-Dt0APH92.js → clock-DxkrtqOr.js} +1 -1
  176. package/dist/cloud-BAefVBb_.js +1444 -0
  177. package/dist/createCloudRuntime-Bt8W-ajI.js +342 -0
  178. package/dist/{createLucideIcon-C8WzBYCv.js → createLucideIcon-L-wQXW_R.js} +9 -9
  179. package/dist/{cdn/chunks/de-DHra3lvx.js → de-BXmeeFbX.js} +69 -8
  180. package/dist/{cdn/chunks/de-uVoSP1xF.js → de-Dbwm2cON.js} +1 -56
  181. package/dist/dist-B5iReTtK.js +251 -0
  182. package/dist/{dist-Cl8J0IES.js → dist-Ck9roB6K.js} +42 -42
  183. package/dist/{dist-BpKxrUi2.js → dist-CqcGTIiX.js} +46 -46
  184. package/dist/{en-DlqX2YWZ.js → en-DbBNy67B.js} +69 -6
  185. package/dist/{cdn/chunks/en-CjhsJxb-.js → en-Dzw4EqNI.js} +1 -56
  186. package/dist/{es-Cuss2snv.js → es-JUsAjxWu.js} +69 -6
  187. package/dist/{extensions-DzKNPITR.js → extensions-CX87G4aL.js} +71 -57
  188. package/dist/{cdn/chunks/fr-Cm85vB2g.js → fr-J3qgXH4h.js} +69 -8
  189. package/dist/{image-up-Ceggh_R3.js → image-up-DouZRGVt.js} +1 -1
  190. package/dist/index.d.ts +499 -23
  191. package/dist/{info-DO5odBcZ.js → info-puX5V6Iq.js} +1 -1
  192. package/dist/{cdn/chunks/keys-Cmc2Yl3D.js → keys-BxixS0TN.js} +4 -6
  193. package/dist/{list-checks-BSkPKbuI.js → list-checks-jw-ZlvWY.js} +1 -1
  194. package/dist/{loader-circle-bO7o7_HD.js → loader-circle-DqTxB7Kr.js} +1 -1
  195. package/dist/logger-BBlvSn6q.js +21 -0
  196. package/dist/{message-circle-BEkAk65X.js → message-circle-BZ7YpB22.js} +1 -1
  197. package/dist/{nl-dmiIX7oT.js → nl-D_4DkqOi.js} +69 -6
  198. package/dist/{pencil-t6m0EtKL.js → pencil-DmbRhTJu.js} +1 -1
  199. package/dist/preRenderCustomBlocks-BebjKtmw.js +21 -0
  200. package/dist/{cdn/chunks/pt-BR-CTzHTqJD.js → pt-BR-BxzQzWGJ.js} +1 -56
  201. package/dist/{pt-BR-CaIG-7EM.js → pt-BR-KGURyEEQ.js} +69 -6
  202. package/dist/{refresh-cw-CkOYVzK5.js → refresh-cw-OK_O-cL0.js} +1 -1
  203. package/dist/{runtime-dom.esm-bundler-CepEmvwF.js → runtime-dom.esm-bundler-BgKXIPLV.js} +144 -144
  204. package/dist/{scan-line-DwSVj25O.js → scan-line-DyaSTsJ5.js} +1 -1
  205. package/dist/{send-CWsWN8PQ.js → send-B-wasJJC.js} +1 -1
  206. package/dist/{shield-check-qje8Kufw.js → shield-check-DUIyRrTo.js} +1 -1
  207. package/dist/{sparkles-DumaWRW-.js → sparkles-DYEMATWC.js} +1 -1
  208. package/dist/style.css +1 -1
  209. package/dist/styleConstants-ByDqaYj_.js +59 -0
  210. package/dist/templatical-editor.js +5303 -289
  211. package/dist/{text-align-start-Ir8Ah4mT.js → text-align-start-CzjLeBLe.js} +1 -1
  212. package/dist/timeouts-DHPZQ0G3.js +4 -0
  213. package/dist/{trash-2-CklAFCmO.js → trash-2-C0shEPry.js} +1 -1
  214. package/dist/{triangle-alert-BBi4n93g.js → triangle-alert-Fw0ce8oQ.js} +1 -1
  215. package/dist/{upload-sVqqppuv.js → upload-D69C2CBx.js} +3 -4
  216. package/dist/{useAliveFlag-cvyBxHp7.js → useAliveFlag-BGIAZii_.js} +1 -1
  217. package/dist/{useCloudI18n-DKVm6PCa.js → useCloudI18n-CAZTZ9_a.js} +2 -2
  218. package/dist/{useEditorCore-idmPLUeb.js → useEditorCore-B-kONNRw.js} +1604 -1320
  219. package/dist/{useI18n-DoVKdCTH.js → useI18n-BfXff_Sy.js} +2 -2
  220. package/dist/{useMergeTag-CYZk7dZD.js → useMergeTag-Dd4I7kge.js} +3 -3
  221. package/dist/usePopoverPosition-CxhCX3SQ.js +59 -0
  222. package/dist/{vue.runtime.esm-bundler-D1diBMsm.js → vue.runtime.esm-bundler-DzEsDRtY.js} +447 -436
  223. package/dist/{x-Mby7KlhS.js → x-BjTlFqRv.js} +1 -1
  224. package/package.json +7 -7
  225. package/dist/AiFeatureMenu-BY6mubnR.js +0 -63
  226. package/dist/BlockPreviewCanvas-DbNOqSI1.js +0 -121
  227. package/dist/CloudEditor-DEnMNMbm.js +0 -1188
  228. package/dist/ColorPicker-ClETsjA3.js +0 -550
  229. package/dist/CommentsSidebar-CdRCCSDD.js +0 -435
  230. package/dist/SaveBlockDialog-fVp_PwZi.js +0 -265
  231. package/dist/SnapshotHistory-DjA3Ej_i.js +0 -128
  232. package/dist/TestEmailModal-EM0RP_9L.js +0 -205
  233. package/dist/TitleEditor-JEaP9jVF.js +0 -197
  234. package/dist/TplModal-DoneXIj_.js +0 -49
  235. package/dist/cdn/chunks/AiChatSidebar-CQ8KUmNB.js.map +0 -1
  236. package/dist/cdn/chunks/AiFeatureMenu-Cwj8afsi.js +0 -63
  237. package/dist/cdn/chunks/AiFeatureMenu-Cwj8afsi.js.map +0 -1
  238. package/dist/cdn/chunks/CloudEditor-CQ830jJt.js +0 -1166
  239. package/dist/cdn/chunks/CloudEditor-CQ830jJt.js.map +0 -1
  240. package/dist/cdn/chunks/CollaboratorBar-BF469_AN.js.map +0 -1
  241. package/dist/cdn/chunks/ColorPicker-W_UyiVGc.js +0 -552
  242. package/dist/cdn/chunks/ColorPicker-W_UyiVGc.js.map +0 -1
  243. package/dist/cdn/chunks/CommentsSidebar-BLRZRSSC.js +0 -412
  244. package/dist/cdn/chunks/CommentsSidebar-BLRZRSSC.js.map +0 -1
  245. package/dist/cdn/chunks/DesignReferenceSidebar-B-HFXV0W.js.map +0 -1
  246. package/dist/cdn/chunks/IssuesPanel-DKTS4QVb.js.map +0 -1
  247. package/dist/cdn/chunks/MergeTagSuggestion-Dn8dExNa.js.map +0 -1
  248. package/dist/cdn/chunks/NumberWithSuffix-BXrRdfq1.js.map +0 -1
  249. package/dist/cdn/chunks/ParagraphEditor-Bzcma_Lm.js.map +0 -1
  250. package/dist/cdn/chunks/RichTextEditorContent-DtL49Jpo.js.map +0 -1
  251. package/dist/cdn/chunks/SaveBlockDialog-BfNVeXXV.js +0 -264
  252. package/dist/cdn/chunks/SaveBlockDialog-BfNVeXXV.js.map +0 -1
  253. package/dist/cdn/chunks/SavedBlocksBrowserModal-C59D4G5C.js.map +0 -1
  254. package/dist/cdn/chunks/SavedBlocksPickBar-DMHxPCM4.js.map +0 -1
  255. package/dist/cdn/chunks/SnapshotHistory-80tAU_VX.js +0 -121
  256. package/dist/cdn/chunks/SnapshotHistory-80tAU_VX.js.map +0 -1
  257. package/dist/cdn/chunks/TemplateScoringPanel-NucRtAP0.js.map +0 -1
  258. package/dist/cdn/chunks/TestEmailModal-DdWfAGNe.js +0 -205
  259. package/dist/cdn/chunks/TestEmailModal-DdWfAGNe.js.map +0 -1
  260. package/dist/cdn/chunks/TitleEditor-D0_LY2Ex.js.map +0 -1
  261. package/dist/cdn/chunks/TplModal-iCmoKB2k.js +0 -50
  262. package/dist/cdn/chunks/TplModal-iCmoKB2k.js.map +0 -1
  263. package/dist/cdn/chunks/ca-D1zgI9fQ.js.map +0 -1
  264. package/dist/cdn/chunks/cloud-DcC8bPwn.js +0 -1787
  265. package/dist/cdn/chunks/cloud-DcC8bPwn.js.map +0 -1
  266. package/dist/cdn/chunks/de-DHra3lvx.js.map +0 -1
  267. package/dist/cdn/chunks/de-uVoSP1xF.js.map +0 -1
  268. package/dist/cdn/chunks/en-CjhsJxb-.js.map +0 -1
  269. package/dist/cdn/chunks/en-DlqX2YWZ.js.map +0 -1
  270. package/dist/cdn/chunks/es-Cuss2snv.js.map +0 -1
  271. package/dist/cdn/chunks/extensions-C7h52yuk.js.map +0 -1
  272. package/dist/cdn/chunks/fr-Cm85vB2g.js.map +0 -1
  273. package/dist/cdn/chunks/keys-Cmc2Yl3D.js.map +0 -1
  274. package/dist/cdn/chunks/nl-dmiIX7oT.js.map +0 -1
  275. package/dist/cdn/chunks/pt-BR-CTzHTqJD.js.map +0 -1
  276. package/dist/cdn/chunks/pt-BR-CaIG-7EM.js.map +0 -1
  277. package/dist/cdn/chunks/src-CUKUsRzX.js.map +0 -1
  278. package/dist/cdn/chunks/src-xkGep9eN.js.map +0 -1
  279. package/dist/cdn/chunks/styles-CND3ey2g.js +0 -4140
  280. package/dist/cdn/chunks/styles-CND3ey2g.js.map +0 -1
  281. package/dist/cdn/chunks/timeouts-SsLMC4a3.js +0 -6
  282. package/dist/cdn/chunks/timeouts-SsLMC4a3.js.map +0 -1
  283. package/dist/cdn/chunks/useEditorCore-CKQ9gmoo.js.map +0 -1
  284. package/dist/styles-BK36D1sy.js +0 -4318
  285. package/dist/usePopoverPosition-C0dPEF4X.js +0 -308
@@ -1,4140 +0,0 @@
1
- import { C as e, F as t, G as n, H as r, J as i, K as a, L as o, M as s, N as c, O as l, P as u, T as d, V as f, Y as p, Z as m, b as h, c as g, ct as _, f as v, g as y, h as b, it as x, l as S, lt as C, m as w, n as T, o as ee, p as E, s as D, st as O, t as k, u as A, v as j, x as M, y as N, z as P } from "./draggable-DCs9qL-b.js";
2
- import { H as F, L as I, S as L, T as R, a as z, c as B, d as V, i as H, l as te, r as ne, x as re } from "./src-B_QJduQD.js";
3
- import { A as ie, C as ae, I as oe, L as U, N as se, O as ce, _ as le, a as ue, c as de, d as fe, f as pe, g as me, h as he, i as ge, j as _e, k as ve, l as ye, m as be, n as xe, o as Se, p as Ce, r as we, s as Te, v as Ee, y as De } from "./useEditorCore-CKQ9gmoo.js";
4
- import { _ as Oe, d as ke } from "./dist-C6z8AjBC.js";
5
- import { A as Ae, B as je, G as Me, H as Ne, I as Pe, M as Fe, O as Ie, P as Le, R as Re, T as ze, U as Be, V as Ve, W as He, c as Ue, f as We, g as Ge, h as Ke, k as qe, m as Je, n as Ye, o as Xe, p as Ze, r as Qe, s as $e, u as et, v as tt } from "./keys-Cmc2Yl3D.js";
6
- import { t as W } from "./useI18n-UMs0F71x.js";
7
- import { a as nt, n as rt } from "./usePopoverPosition-cf8Y-ynK.js";
8
- import { $ as it, At as at, D as ot, E as st, Et as ct, It as lt, Mt as ut, N as dt, Ot as ft, P as pt, Q as mt, Rt as ht, T as gt, Tt as _t, U as G, Y as vt, _ as yt, _t as bt, b as xt, d as St, dt as Ct, et as wt, ft as Tt, g as Et, it as Dt, j as Ot, lt as kt, m as At, n as jt, nt as Mt, pt as Nt, q as Pt, rt as Ft, s as It, st as Lt, w as Rt, wt as zt, z as Bt } from "./icons-CvYN6zrM.js";
9
- import { t as Vt } from "./_plugin-vue_export-helper-B3ysoDQm.js";
10
- import { t as Ht } from "./useCloudI18n-8wkJtuJD.js";
11
- import { t as Ut } from "./useMergeTag-JmXOtpln.js";
12
- import { t as Wt } from "./useAliveFlag-Dxwgo6P4.js";
13
- import { n as Gt, t as Kt } from "./emailFrameWidth-BmFCN2dp.js";
14
- import { t as qt } from "./readableTextColor-f8Kykfnh.js";
15
- import { t as Jt } from "./blockTypeIcons-FXlMM3PL.js";
16
- import { _ as Yt, f as K, g as Xt, h as q, i as Zt, l as Qt, m as J, n as $t, p as Y, t as X, u as en } from "./ColorPicker-W_UyiVGc.js";
17
- import { n as tn, r as nn } from "./MergeTagSuggestion-Dn8dExNa.js";
18
- import { i as Z, n as Q, r as rn, t as an } from "./NumberWithSuffix-BXrRdfq1.js";
19
- import { t as on } from "./TplModal-iCmoKB2k.js";
20
- //#region src/composables/useSavedBlocksFeature.ts
21
- function sn(e) {
22
- let { provider: t, editor: n } = e, r = oe({
23
- provider: t,
24
- onError: e.onError
25
- }), i = m(!1), a = m(!1), o = m(!1), s = m(/* @__PURE__ */ new Set()), l = v(() => o.value), u = v(() => s.value.size);
26
- function d(e) {
27
- r.canCreate.value && (n.state.previewMode || (s.value = /* @__PURE__ */ new Set([e]), o.value = !0));
28
- }
29
- function f(e) {
30
- if (!o.value) return;
31
- let t = new Set(s.value);
32
- t.has(e) ? t.delete(e) : t.add(e), s.value = t;
33
- }
34
- function p(e) {
35
- return s.value.has(e);
36
- }
37
- function h() {
38
- o.value = !1, s.value = /* @__PURE__ */ new Set();
39
- }
40
- function g() {
41
- u.value !== 0 && (o.value = !1, i.value = !0, S());
42
- }
43
- function _() {
44
- i.value = !1, s.value = /* @__PURE__ */ new Set();
45
- }
46
- P(() => n.state.previewMode, (e) => {
47
- e && o.value && h();
48
- });
49
- function y() {
50
- a.value = !0, S();
51
- }
52
- function b() {
53
- a.value = !1;
54
- }
55
- function x(e, t) {
56
- for (let r = 0; r < e.content.length; r++) {
57
- let i = re(e.content[r]), a = t === void 0 ? void 0 : t + r;
58
- n.addBlock(i, void 0, void 0, a);
59
- }
60
- a.value = !1;
61
- }
62
- function S() {
63
- r.load().catch(() => {});
64
- }
65
- let C = v(() => r.savedBlocks.value.length), w = v(() => e.isAvailable?.() ?? !0);
66
- return c(Re, r), {
67
- headless: r,
68
- isPicking: l,
69
- pickedIds: s,
70
- pickedCount: u,
71
- startPicking: d,
72
- togglePick: f,
73
- isPicked: p,
74
- confirmPicking: g,
75
- cancelPicking: h,
76
- isSaveDialogOpen: i,
77
- closeSaveDialog: _,
78
- isBrowserOpen: a,
79
- openBrowser: y,
80
- closeBrowser: b,
81
- insert: x,
82
- refresh: S,
83
- capability: {
84
- startPicking: d,
85
- togglePick: f,
86
- isPicked: p,
87
- isPicking: l,
88
- confirmPicking: g,
89
- cancelPicking: h,
90
- openBrowser: y,
91
- count: C,
92
- isAvailable: w,
93
- canCreate: r.canCreate,
94
- canUpdate: r.canUpdate,
95
- canDelete: r.canDelete
96
- },
97
- count: C,
98
- isAvailable: w
99
- };
100
- }
101
- //#endregion
102
- //#region src/utils/toMjml.ts
103
- async function cn() {
104
- try {
105
- return await import("./src-CUKUsRzX.js");
106
- } catch {
107
- return null;
108
- }
109
- }
110
- async function ln(e) {
111
- let t = await cn();
112
- if (!t) throw Error("[Templatical] toMjml() requires the @templatical/renderer package. Please install it.");
113
- let n = e.getCustomBlockStylesheet;
114
- return t.renderToMjml(e.getContent(), {
115
- renderCustomBlock: e.renderCustomBlock,
116
- ...n ? { getCustomBlockStylesheet: (e) => n(e) } : {}
117
- });
118
- }
119
- //#endregion
120
- //#region src/composables/useTestEmailFeature.ts
121
- var un = 1200;
122
- function dn(e) {
123
- let { provider: t } = e, n = m(!1), r = m(!1), a = m(!1), o = m(null), s = null, c = !1;
124
- function l() {
125
- s !== null && (clearTimeout(s), s = null);
126
- }
127
- i(l);
128
- let u = v(() => t.allowedRecipients), d = v(() => {
129
- let e = t.defaultRecipient;
130
- if (e === void 0) return;
131
- let n = u.value;
132
- if (!(n && !n.includes(e))) return e;
133
- }), f = v(() => u.value?.length === 0 ? !1 : e.isAvailable?.() ?? !0);
134
- function p() {
135
- f.value && (o.value = null, a.value = !1, l(), n.value = !0);
136
- }
137
- function h() {
138
- l(), n.value = !1, a.value = !1;
139
- }
140
- async function g() {
141
- if (!(!t.includeMjml || !e.renderMjml)) try {
142
- return await e.renderMjml();
143
- } catch (e) {
144
- if (await cn() === null) {
145
- c || (c = !0, _e.warn("testEmail.includeMjml is set but @templatical/renderer is not installed — sending the template as JSON only. Install it to receive `payload.mjml`."));
146
- return;
147
- }
148
- throw e;
149
- }
150
- }
151
- async function _(n) {
152
- if (r.value) return;
153
- let i = u.value;
154
- if (i && !i.includes(n)) {
155
- o.value = { kind: "recipientNotAllowed" };
156
- return;
157
- }
158
- r.value = !0, o.value = null;
159
- try {
160
- let r = await g();
161
- await t.send({
162
- recipient: n,
163
- content: e.getContent(),
164
- ...r === void 0 ? {} : { mjml: r },
165
- ...i === void 0 ? {} : { allowedRecipients: i }
166
- }), a.value = !0, s = setTimeout(h, un);
167
- } catch (t) {
168
- let n = t instanceof Error ? t : Error(String(t));
169
- o.value = {
170
- kind: "provider",
171
- message: n.message
172
- }, e.onError?.(n);
173
- } finally {
174
- r.value = !1;
175
- }
176
- }
177
- return {
178
- isModalOpen: n,
179
- open: p,
180
- close: h,
181
- isSending: r,
182
- justSent: a,
183
- error: o,
184
- send: _,
185
- allowedRecipients: u,
186
- defaultRecipient: d,
187
- isAvailable: f,
188
- capability: {
189
- open: p,
190
- isAvailable: f
191
- }
192
- };
193
- }
194
- //#endregion
195
- //#region src/utils/resolveLintOptions.ts
196
- function fn(e) {
197
- return {
198
- ...e.lint,
199
- locale: e.locale
200
- };
201
- }
202
- //#endregion
203
- //#region src/components/Canvas.vue?vue&type=script&setup=true&lang.ts
204
- var pn = ["aria-label"], mn = {
205
- key: 0,
206
- role: "status",
207
- "aria-busy": "true",
208
- "data-testid": "preview-resolution-loading",
209
- class: "tpl:flex tpl:flex-col tpl:gap-3 tpl:p-6"
210
- }, hn = { class: "tpl:sr-only" }, gn = {
211
- key: 1,
212
- role: "status",
213
- "data-testid": "preview-resolution-failed",
214
- class: "tpl:mx-6 tpl:mt-4 tpl:rounded-md tpl:px-3 tpl:py-2 tpl:text-xs tpl:text-[var(--tpl-text-muted)] tpl:bg-[var(--tpl-bg-hover)]"
215
- }, _n = {
216
- key: 0,
217
- class: "tpl-canvas-empty-content tpl:flex tpl:flex-col tpl:items-center"
218
- }, vn = { class: "tpl-canvas-empty-icon tpl:mb-4 tpl:text-[var(--tpl-primary)]" }, yn = { class: "tpl-canvas-empty-title tpl:m-0 tpl:mb-2 tpl:text-base tpl:font-semibold tpl:text-[var(--tpl-primary)]" }, bn = { class: "tpl-canvas-empty-text tpl:m-0 tpl:text-sm tpl:text-[var(--tpl-text-dim)]" }, xn = {
219
- key: 0,
220
- class: "tpl:m-0 tpl:mt-2 tpl:flex tpl:flex-wrap tpl:items-center tpl:justify-center tpl:gap-x-1 tpl:gap-y-0.5 tpl:text-sm tpl:text-[var(--tpl-text-dim)]"
221
- }, Sn = {
222
- key: 1,
223
- class: "tpl:m-0 tpl:mt-4 tpl:flex tpl:flex-wrap tpl:items-center tpl:justify-center tpl:gap-x-1 tpl:gap-y-0.5 tpl:text-sm tpl:text-[var(--tpl-text-dim)]"
224
- }, Cn = { class: "tpl:relative" }, wn = {
225
- class: "tpl:inline-flex tpl:size-3 tpl:items-center tpl:justify-center tpl:rounded-full tpl:text-[8px] tpl:font-bold",
226
- style: { "background-color": "color-mix(\n in srgb,\n var(--tpl-bg) 30%,\n transparent\n )" }
227
- }, Tn = /*#__PURE__*/ Vt(/* @__PURE__ */ M({
228
- __name: "Canvas",
229
- props: {
230
- viewport: {},
231
- content: {},
232
- selectedBlockId: {},
233
- darkMode: { type: Boolean },
234
- previewMode: { type: Boolean },
235
- lockedBlocks: {}
236
- },
237
- emits: [
238
- "select-block",
239
- "open-ai-chat",
240
- "open-design-reference"
241
- ],
242
- setup(e, { emit: t }) {
243
- let n = {
244
- section: Te,
245
- title: de,
246
- paragraph: Ce,
247
- image: he,
248
- button: ve,
249
- divider: Ee,
250
- spacer: ge,
251
- html: le,
252
- social: ue,
253
- menu: be,
254
- table: we,
255
- video: xe,
256
- custom: De
257
- }, i = e, a = t, { t: l } = W(), { t: p } = Ht(), h = Me(Ge, "Canvas"), g = d(We, null), S = d($e, null), T = d(Ue, {}), ee = d(qe, null), M = d(Pe, null);
258
- c(He, v(() => i.previewMode && (ee?.value ?? !1) && !M?.isConfigured));
259
- let P = v(() => (T.plan?.hasFeature("ai_generation") ?? !1) && (T.ai?.isFeatureEnabled("chat") ?? !1)), F = v(() => (T.plan?.hasFeature("ai_generation") ?? !1) && (T.ai?.isFeatureEnabled("designToTemplate") ?? !1)), I = d(Qe, null), L = v({
260
- get: () => i.content.blocks,
261
- set: (e) => {
262
- h.setContent({
263
- ...i.content,
264
- blocks: e
265
- });
266
- }
267
- }), R = v(() => Gt(i.content.settings, i.viewport)), z = v(() => R.value + 192), B = v(() => fe(i.content.settings)), V = v(() => L.value.length === 0 && !i.previewMode), H = m(0), te = v(() => V.value && H.value > 0);
268
- function ne() {
269
- V.value && (H.value += 1);
270
- }
271
- function re() {
272
- V.value && (H.value = Math.max(0, H.value - 1));
273
- }
274
- function ie() {
275
- H.value = 0;
276
- }
277
- function ae(e) {
278
- i.previewMode || T.savedBlocks?.isPicking.value || e.target === e.currentTarget && a("select-block", null);
279
- }
280
- function oe(e) {
281
- return pe(e, S, n);
282
- }
283
- function U(e) {
284
- return i.lockedBlocks?.get(e) ?? null;
285
- }
286
- function se(e) {
287
- if (i.previewMode || U(e)) return;
288
- let t = T.savedBlocks;
289
- if (t?.isPicking.value) {
290
- t.togglePick(e);
291
- return;
292
- }
293
- a("select-block", e);
294
- }
295
- function ce(e) {
296
- return T.savedBlocks?.isPicked(e) ?? !1;
297
- }
298
- let me = v(() => T.savedBlocks?.isPicking.value === !0);
299
- function _e(e, t) {
300
- e.type === "custom" && h.updateBlock(e.id, {
301
- fieldValues: t.fieldValues,
302
- dataSourceFetched: t.dataSourceFetched
303
- });
304
- }
305
- return (t, n) => (s(), y("div", {
306
- class: "tpl-canvas-stage tpl:relative tpl:flex tpl:justify-center tpl:rounded-lg",
307
- style: _({
308
- width: `${z.value}px`,
309
- boxShadow: e.darkMode ? "none" : "var(--tpl-shadow-xl)",
310
- transition: x(Kt)
311
- })
312
- }, [E("div", {
313
- class: "tpl-canvas-bg tpl:absolute tpl:inset-0 tpl:rounded-lg tpl:pointer-events-none",
314
- style: _({
315
- backgroundColor: e.content.settings.backgroundColor,
316
- ...e.darkMode ? { filter: "invert(1) hue-rotate(180deg)" } : {},
317
- transition: "filter 300ms ease"
318
- })
319
- }, null, 4), E("div", {
320
- "data-testid": "canvas-wrapper",
321
- role: "region",
322
- "aria-label": x(l).landmarks.canvas,
323
- class: "tpl-canvas-wrapper tpl:relative",
324
- style: _({
325
- width: `${R.value}px`,
326
- transition: x(Kt)
327
- })
328
- }, [E("div", {
329
- class: O(["tpl-canvas tpl:relative tpl:rounded-lg", {
330
- "tpl-canvas--dark-mode": e.darkMode,
331
- "tpl-preview-mode": e.previewMode
332
- }]),
333
- style: _(B.value),
334
- onClick: ae
335
- }, [x(M)?.isInitialResolve.value ? (s(), y("div", mn, [E("span", hn, C(x(l).previewResolution.resolving), 1), (s(), y(A, null, u(3, (e) => E("div", {
336
- key: e,
337
- "aria-hidden": "true",
338
- class: "tpl-pulse tpl:h-16 tpl:rounded-md tpl:bg-[var(--tpl-bg-hover)]"
339
- })), 64))])) : x(M)?.hasFailed.value ? (s(), y("p", gn, C(x(l).previewResolution.failed), 1)) : b("", !0), r(N(x(k), {
340
- modelValue: L.value,
341
- "onUpdate:modelValue": n[2] ||= (e) => L.value = e,
342
- group: "blocks",
343
- animation: 150,
344
- "ghost-class": "tpl-ghost",
345
- "drag-class": "tpl-dragging",
346
- handle: ".tpl-block-btn",
347
- "invert-swap": !0,
348
- "inverted-swap-threshold": .65,
349
- disabled: e.previewMode,
350
- draggable: ".tpl-block-item",
351
- "force-fallback": !0,
352
- class: O([
353
- "tpl-canvas-blocks",
354
- V.value ? "tpl-canvas-empty tpl:m-6 tpl:flex tpl:min-h-[400px] tpl:flex-col tpl:items-center tpl:justify-center tpl:rounded-xl tpl:border-2 tpl:border-dashed tpl:px-10 tpl:py-12 tpl:text-center tpl:bg-[var(--tpl-bg-elevated)] tpl:font-[var(--tpl-font-family)] tpl:transition-colors tpl:duration-150" : "",
355
- V.value && te.value ? "tpl-canvas-empty--drag-over tpl:border-[var(--tpl-primary-hover)] tpl:bg-[var(--tpl-primary-light)]" : "",
356
- V.value && !te.value ? "tpl:border-[var(--tpl-primary)]" : ""
357
- ]),
358
- onDragenter: ne,
359
- onDragleave: re,
360
- onDrop: ie
361
- }, {
362
- default: f(() => [V.value ? (s(), y("div", _n, [
363
- E("div", vn, [N(x(gt), {
364
- size: 48,
365
- "stroke-width": 1
366
- })]),
367
- E("p", yn, C(x(l).canvas.noBlocks), 1),
368
- E("p", bn, C(x(l).canvas.dragHint), 1),
369
- P.value && x(p) ? (s(), y("p", xn, [
370
- j(C(x(l).canvas.aiHintChat) + " ", 1),
371
- E("button", {
372
- class: "tpl:inline-flex tpl:shrink-0 tpl:cursor-pointer tpl:items-center tpl:gap-1 tpl:whitespace-nowrap tpl:rounded-[var(--tpl-radius-sm)] tpl:border-none tpl:px-2 tpl:py-0.5 tpl:text-sm tpl:font-semibold tpl:transition-colors tpl:duration-150 tpl:bg-[var(--tpl-primary-light)] tpl:text-[var(--tpl-primary-hover)]",
373
- onClick: n[0] ||= (e) => a("open-ai-chat")
374
- }, [N(x(st), {
375
- size: 14,
376
- "stroke-width": 2
377
- }), j(" " + C(x(p).aiMenu.aiAssistant), 1)]),
378
- j(" " + C(x(l).canvas.aiHintChatSuffix), 1)
379
- ])) : b("", !0),
380
- F.value && x(p) ? (s(), y("p", Sn, [
381
- j(C(x(l).canvas.aiHintDesign) + " ", 1),
382
- E("button", {
383
- class: "tpl:inline-flex tpl:shrink-0 tpl:cursor-pointer tpl:items-center tpl:gap-1 tpl:whitespace-nowrap tpl:rounded-[var(--tpl-radius-sm)] tpl:border-none tpl:px-2 tpl:py-0.5 tpl:text-sm tpl:font-semibold tpl:transition-colors tpl:duration-150 tpl:bg-[var(--tpl-primary-light)] tpl:text-[var(--tpl-primary-hover)]",
384
- onClick: n[1] ||= (e) => a("open-design-reference")
385
- }, [N(x(Nt), {
386
- size: 14,
387
- "stroke-width": 2
388
- }), j(" " + C(x(p).aiMenu.designToTemplate), 1)]),
389
- j(" " + C(x(l).canvas.aiHintDesignSuffix), 1)
390
- ])) : b("", !0)
391
- ])) : b("", !0), (s(!0), y(A, null, u(L.value, (t) => r((s(), y("div", {
392
- key: t.id,
393
- class: "tpl-block-item"
394
- }, [E("div", Cn, [U(t.id) ? (s(), y("div", {
395
- key: 0,
396
- class: "tpl-collab-lock tpl:pointer-events-none tpl:absolute tpl:inset-0 tpl:z-[4] tpl:rounded-sm",
397
- style: _({
398
- outline: `2px solid ${U(t.id).color}`,
399
- outlineOffset: "-1px"
400
- })
401
- }, [E("span", {
402
- class: "tpl:absolute tpl:-top-0.5 tpl:left-1/2 tpl:z-[5] tpl:flex tpl:-translate-x-1/2 tpl:-translate-y-full tpl:items-center tpl:gap-1 tpl:rounded-full tpl:px-2 tpl:py-0.5 tpl:text-[10px] tpl:font-medium tpl:whitespace-nowrap",
403
- style: _({
404
- backgroundColor: U(t.id).color,
405
- color: x(qt)(U(t.id).color)
406
- })
407
- }, [E("span", wn, C(U(t.id).name.charAt(0)), 1), j(" " + C(U(t.id).name), 1)], 4)], 4)) : b("", !0), N(ye, {
408
- block: t,
409
- "is-selected": !e.previewMode && !me.value && e.selectedBlockId === t.id && !U(t.id),
410
- picked: ce(t.id),
411
- viewport: e.viewport,
412
- "preview-mode": e.previewMode,
413
- onSelect: (e) => se(t.id)
414
- }, {
415
- default: f(() => [(s(), w(o(oe(t)), {
416
- block: t,
417
- viewport: e.viewport,
418
- onFetchData: (e) => _e(t, e),
419
- onUpdate: (e) => x(h).updateBlock(t.id, e)
420
- }, null, 40, [
421
- "block",
422
- "viewport",
423
- "onFetchData",
424
- "onUpdate"
425
- ]))]),
426
- _: 2
427
- }, 1032, [
428
- "block",
429
- "is-selected",
430
- "picked",
431
- "viewport",
432
- "preview-mode",
433
- "onSelect"
434
- ])])])), [[D, x(I) === !1 || !x(g)?.isHidden(t.id)]])), 128))]),
435
- _: 1
436
- }, 8, [
437
- "modelValue",
438
- "disabled",
439
- "class"
440
- ]), [[D, !x(M)?.isInitialResolve.value]])], 6)], 12, pn)], 4));
441
- }
442
- }), [["__scopeId", "data-v-0af1c100"]]), En = M({
443
- name: "CustomBlockStylesheets",
444
- setup() {
445
- let t = d(Je, null);
446
- return () => t ? t.value.map((t, n) => e("style", {
447
- key: n,
448
- "data-tpl-custom-block-stylesheet": "",
449
- innerHTML: t
450
- })) : null;
451
- }
452
- });
453
- //#endregion
454
- //#region src/utils/resolvePaletteBlocks.ts
455
- function Dn(e, t) {
456
- if (!t || t.length === 0) return {
457
- items: e,
458
- unknown: []
459
- };
460
- let n = new Map(e.map((e) => [e.type, e])), r = [], i = [], a = /* @__PURE__ */ new Set();
461
- for (let e of t) {
462
- if (a.has(e)) continue;
463
- a.add(e);
464
- let t = n.get(e);
465
- t ? r.push(t) : i.push(e);
466
- }
467
- return {
468
- items: r,
469
- unknown: i
470
- };
471
- }
472
- //#endregion
473
- //#region src/components/Sidebar.vue?vue&type=script&setup=true&lang.ts
474
- var On = ["aria-label"], kn = {
475
- key: 0,
476
- class: "tpl:border-b tpl:px-1 tpl:pb-1 tpl:border-[var(--tpl-border)]"
477
- }, An = ["aria-label"], jn = {
478
- key: 0,
479
- class: "tpl:truncate tpl:text-sm tpl:font-medium"
480
- }, Mn = [
481
- "data-palette-type",
482
- "aria-label",
483
- "onClick",
484
- "onKeydown"
485
- ], Nn = { class: "tpl:flex tpl:shrink-0 tpl:items-center tpl:justify-center tpl:transition-transform tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)] hover:tpl:scale-105" }, Pn = {
486
- key: 0,
487
- class: "tpl:truncate tpl:text-sm tpl:font-medium"
488
- }, Fn = /* @__PURE__ */ M({
489
- __name: "Sidebar",
490
- setup(e) {
491
- let { t, format: n } = W(), r = d(Ze, []), i = d(Le, void 0), a = d(Xe, void 0), c = d(Ge, null), l = d(Ue, {}), p = v(() => l.savedBlocks?.isAvailable.value === !0), h = m(!1), g = m(!1);
492
- function S() {
493
- g.value || (h.value = !1);
494
- }
495
- function T() {
496
- g.value = !0;
497
- }
498
- function ee() {
499
- g.value = !1, h.value = !1;
500
- }
501
- let D = [
502
- "section",
503
- "image",
504
- "title",
505
- "paragraph",
506
- "button",
507
- "divider",
508
- "video",
509
- "social",
510
- "menu",
511
- "table",
512
- "spacer",
513
- "html"
514
- ], O = v(() => {
515
- let e = D.map((e) => ({
516
- type: e,
517
- label: se(e, t)
518
- }));
519
- return l.plan && e.splice(-1, 0, {
520
- type: "countdown",
521
- label: se("countdown", t)
522
- }), e;
523
- }), j = v(() => r.map((e) => ({
524
- type: `custom:${e.type}`,
525
- label: e.name,
526
- isCustom: !0,
527
- icon: e.icon
528
- }))), M = v(() => [...O.value, ...j.value]), F = v(() => Dn(M.value, i)), I = v(() => F.value.items), z = /* @__PURE__ */ new Set();
529
- P(() => F.value.unknown, (e) => {
530
- for (let t of e) z.has(t) || (z.add(t), _e.warn(`config.paletteBlocks: "${t}" is not a built-in or registered custom block (use the "custom:" prefix for custom blocks) — skipping it in the palette.`));
531
- }, { immediate: !0 });
532
- function B(e) {
533
- if (e.isCustom) {
534
- let t = e.type.replace("custom:", ""), n = r.find((e) => e.type === t);
535
- if (n) return R(n);
536
- }
537
- return L(e.type, a);
538
- }
539
- function V(e) {
540
- if (!c) return;
541
- let t = B(e);
542
- c.addBlock(t), c.selectBlock(t.id);
543
- }
544
- function H(e, t) {
545
- (e.key === "Enter" || e.key === " ") && (e.preventDefault(), V(t));
546
- }
547
- return (e, r) => (s(), y("aside", {
548
- "aria-label": x(t).sidebarNav.palette,
549
- class: "tpl-sidebar-rail tpl:absolute tpl:top-14 tpl:bottom-0 tpl:left-0 tpl:z-40 tpl:flex tpl:flex-col tpl:overflow-hidden",
550
- style: _({
551
- width: h.value ? "200px" : "48px",
552
- backgroundColor: "var(--tpl-bg-elevated)",
553
- borderRight: "1px solid var(--tpl-border)",
554
- boxShadow: h.value ? "var(--tpl-shadow-lg)" : "none",
555
- transition: "width 200ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 200ms cubic-bezier(0.16, 1, 0.3, 1)"
556
- }),
557
- onMouseenter: r[1] ||= (e) => h.value = !0,
558
- onMouseleave: S,
559
- onFocusin: r[2] ||= (e) => h.value = !0,
560
- onFocusout: r[3] ||= (e) => h.value = !1
561
- }, [p.value ? (s(), y("div", kn, [E("button", {
562
- type: "button",
563
- "aria-label": x(t).sidebarNav.browseSavedBlocks,
564
- class: "tpl:flex tpl:h-10 tpl:w-full tpl:cursor-pointer tpl:items-center tpl:gap-3 tpl:rounded-[var(--tpl-radius-sm)] tpl:border-none tpl:bg-transparent tpl:px-3 tpl:text-[var(--tpl-text-muted)] tpl:transition-all tpl:duration-[120ms] hover:tpl:bg-[var(--tpl-primary-light)] hover:tpl:text-[var(--tpl-primary)]",
565
- style: _({ justifyContent: h.value ? "flex-start" : "center" }),
566
- onClick: r[0] ||= (e) => x(l).savedBlocks?.openBrowser()
567
- }, [N(x(vt), {
568
- size: 20,
569
- "stroke-width": 1.5,
570
- class: "tpl:shrink-0"
571
- }), h.value ? (s(), y("span", jn, C(x(t).savedBlocks.title), 1)) : b("", !0)], 12, An)])) : b("", !0), N(x(k), {
572
- "model-value": I.value,
573
- group: {
574
- name: "blocks",
575
- pull: "clone",
576
- put: !1
577
- },
578
- clone: B,
579
- sort: !1,
580
- animation: 150,
581
- "force-fallback": !0,
582
- class: "tpl:flex tpl:min-h-0 tpl:flex-1 tpl:flex-col tpl:gap-0.5 tpl:overflow-y-auto tpl:p-1",
583
- onChoose: T,
584
- onEnd: ee
585
- }, {
586
- default: f(() => [(s(!0), y(A, null, u(I.value, (e) => (s(), y("button", {
587
- key: e.type,
588
- type: "button",
589
- "data-palette-type": e.type,
590
- "aria-label": x(n)(x(t).sidebarNav.insertBlock, { block: e.label }),
591
- class: "tpl:flex tpl:h-10 tpl:w-full tpl:shrink-0 tpl:cursor-grab tpl:items-center tpl:gap-3 tpl:rounded-[var(--tpl-radius-sm)] tpl:border-none tpl:bg-transparent tpl:px-3 tpl:text-[var(--tpl-text-muted)] tpl:transition-all tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)] hover:tpl:bg-[var(--tpl-primary-light)] hover:tpl:text-[var(--tpl-primary)] active:tpl:cursor-grabbing",
592
- style: _({ justifyContent: h.value ? "flex-start" : "center" }),
593
- onClick: (t) => V(e),
594
- onKeydown: (t) => H(t, e)
595
- }, [E("div", Nn, [x(Jt)[e.type] ? (s(), w(o(x(Jt)[e.type]), {
596
- key: 0,
597
- size: 20,
598
- "stroke-width": 1.5
599
- })) : e.isCustom ? (s(), w(ce, {
600
- key: 1,
601
- icon: e.icon,
602
- size: 20
603
- }, null, 8, ["icon"])) : b("", !0)]), h.value ? (s(), y("span", Pn, C(e.label), 1)) : b("", !0)], 44, Mn))), 128))]),
604
- _: 1
605
- }, 8, ["model-value"])], 44, On));
606
- }
607
- });
608
- //#endregion
609
- //#region src/utils/mergeTagTrigger.ts
610
- function In(e, t, n, r) {
611
- if (!n) return null;
612
- let i = e.slice(0, t), a = i.lastIndexOf(n);
613
- if (a === -1) return null;
614
- let o = i.slice(a + n.length);
615
- return /\s/.test(o) || r && o.includes(r) ? null : {
616
- triggerStart: a,
617
- caret: t,
618
- query: o
619
- };
620
- }
621
- //#endregion
622
- //#region src/utils/textFieldCaret.ts
623
- var Ln = /* @__PURE__ */ "boxSizing.width.borderTopWidth.borderRightWidth.borderBottomWidth.borderLeftWidth.borderStyle.paddingTop.paddingRight.paddingBottom.paddingLeft.fontStyle.fontVariant.fontWeight.fontStretch.fontSize.lineHeight.fontFamily.textAlign.textTransform.textIndent.letterSpacing.wordSpacing.tabSize.whiteSpace.wordWrap.wordBreak".split(".");
624
- function Rn(e, t, n) {
625
- return {
626
- left: e,
627
- top: t,
628
- bottom: n,
629
- right: e,
630
- width: 0,
631
- height: n - t,
632
- x: e,
633
- y: t,
634
- toJSON: () => ({})
635
- };
636
- }
637
- function zn(e, t) {
638
- let n = e.ownerDocument, r = n.defaultView;
639
- if (!r) return null;
640
- let i = e.tagName === "INPUT", a = r.getComputedStyle(e), o = n.createElement("div");
641
- o.setAttribute("aria-hidden", "true");
642
- let s = o.style;
643
- s.position = "absolute", s.visibility = "hidden", s.top = "0", s.left = "0", s.overflow = "hidden", s.whiteSpace = i ? "pre" : "pre-wrap", s.wordWrap = i ? "normal" : "break-word";
644
- let c = s, l = a;
645
- for (let e of Ln) c[e] = l[e];
646
- i && (s.width = "auto", s.whiteSpace = "pre");
647
- let u = e.value, d = u.slice(0, t);
648
- i && (d = d.replace(/\s/g, "\xA0")), o.textContent = d;
649
- let f = n.createElement("span");
650
- f.textContent = u.slice(t) || ".", o.appendChild(f), n.body.appendChild(o);
651
- let p = f.offsetTop, m = f.offsetLeft;
652
- n.body.removeChild(o);
653
- let h = e.getBoundingClientRect(), g = parseFloat(a.borderTopWidth) || 0, _ = parseFloat(a.borderLeftWidth) || 0, v = parseFloat(a.lineHeight) || parseFloat(a.fontSize) || 0, y = h.left + m + _ - e.scrollLeft;
654
- if (i) return Rn(y, h.top, h.bottom);
655
- let b = h.top + p + g - e.scrollTop;
656
- return Rn(y, b, b + v);
657
- }
658
- //#endregion
659
- //#region src/composables/useMergeTagAutocomplete.ts
660
- var Bn = /* @__PURE__ */ new Set([
661
- "ArrowLeft",
662
- "ArrowRight",
663
- "Home",
664
- "End"
665
- ]);
666
- function Vn(e) {
667
- let { elementRef: t, modelValue: r, emit: o, mergeTags: s, syntax: c, enabled: u, onInsert: f } = e, p = te(c), m = B(c), h = u && p !== null && s.length > 0, g = d(Ne, null), _ = (a(g) ? g.value : g)?.mergeTag?.suggestionEmpty ?? "No matching merge tags", v = rt(), y = tn(_, v), b = !1;
668
- n() && i(() => {
669
- b = !0, y.close();
670
- });
671
- function x(e) {
672
- let t = e.value ?? "";
673
- return In(t, e.selectionStart ?? t.length, p, m);
674
- }
675
- function S(e, n, i) {
676
- let a = e.value ?? r(), s = a.slice(n.caret), c = m && s.startsWith(m) ? m.length : 0, u = a.slice(0, n.triggerStart), d = a.slice(n.caret + c), p = u + i.value + d, h = u.length + i.value.length;
677
- f?.(), o(p), y.close(), l(() => {
678
- if (b) return;
679
- let e = t.value;
680
- e?.focus(), e?.setSelectionRange(h, h);
681
- });
682
- }
683
- function C() {
684
- if (!h || b) return;
685
- let e = t.value;
686
- if (!e) {
687
- y.close();
688
- return;
689
- }
690
- let n = x(e);
691
- if (!n) {
692
- y.close();
693
- return;
694
- }
695
- let r = nn(s, n.query), i = () => zn(e, n.triggerStart), a = (t) => S(e, n, t);
696
- y.isOpen() ? y.update({
697
- items: r,
698
- getRect: i,
699
- onCommand: a
700
- }) : y.open({
701
- items: r,
702
- getRect: i,
703
- anchorEl: e,
704
- onCommand: a
705
- });
706
- }
707
- function w(e) {
708
- return y.isOpen() ? e.key === "Escape" ? (y.close(), !0) : Bn.has(e.key) ? (y.close(), !1) : y.handleKeyDown(e) : !1;
709
- }
710
- return {
711
- available: h,
712
- refresh: C,
713
- handleKeydown: w,
714
- close: () => y.close(),
715
- isOpen: () => y.isOpen()
716
- };
717
- }
718
- //#endregion
719
- //#region src/composables/useMergeTagField.ts
720
- function Hn(e) {
721
- let { modelValue: t, emit: r, elementRef: a } = e, { mergeTags: o, canRequestMergeTag: s, isRequesting: c, isMergeTagValue: u, getMergeTagLabel: d, requestMergeTag: f, syntax: p, autocomplete: h } = Ut(), { canInsertLogicTag: g, isRequesting: _, requestLogicTag: y } = ae(), b = m(!1), x = !1, S = !1;
722
- n() && i(() => {
723
- S = !0;
724
- });
725
- let C = Vn({
726
- elementRef: a,
727
- modelValue: t,
728
- emit: r,
729
- mergeTags: o,
730
- syntax: p,
731
- enabled: h,
732
- onInsert: () => {
733
- b.value = !0;
734
- }
735
- }), w = v(() => {
736
- let e = t();
737
- if (!e) return [];
738
- let n = [], r = `(${p.value.source}|${p.logic.source})`, i = new RegExp(r, "g"), a = 0, o;
739
- for (; (o = i.exec(e)) !== null;) {
740
- o.index > a && n.push({
741
- type: "text",
742
- value: e.slice(a, o.index)
743
- });
744
- let t = o[0];
745
- u(t) ? n.push({
746
- type: "mergeTag",
747
- value: t,
748
- label: d(t)
749
- }) : V(t, p) ? n.push({
750
- type: "logicMergeTag",
751
- value: t,
752
- keyword: z(t, p)
753
- }) : n.push({
754
- type: "text",
755
- value: t
756
- }), a = o.index + t.length;
757
- }
758
- return a < e.length && n.push({
759
- type: "text",
760
- value: e.slice(a)
761
- }), n;
762
- }), T = v(() => w.value.some((e) => e.type === "mergeTag" || e.type === "logicMergeTag"));
763
- function ee() {
764
- b.value = !0, l(() => {
765
- a.value?.focus();
766
- let e = t()?.length || 0;
767
- a.value?.setSelectionRange(e, e);
768
- });
769
- }
770
- function E() {
771
- x || (b.value = !1);
772
- }
773
- function D(e) {
774
- r(e.target.value), C.refresh();
775
- }
776
- function O(e) {
777
- if (C.handleKeydown(e)) {
778
- e.preventDefault();
779
- return;
780
- }
781
- e.key === "Escape" && E();
782
- }
783
- function k() {
784
- C.refresh();
785
- }
786
- function A() {
787
- C.close(), E();
788
- }
789
- function j() {
790
- r("");
791
- }
792
- async function M() {
793
- let e = b.value && a.value ? a.value.selectionStart ?? t().length : t().length;
794
- x = !0;
795
- let n;
796
- try {
797
- n = await f();
798
- } finally {
799
- x = !1;
800
- }
801
- if (!S && n) {
802
- let i = t().slice(0, e), o = t().slice(e), s = i + n.value + o;
803
- r(s), b.value = !0, l(() => {
804
- if (S) return;
805
- let t = e + n.value.length;
806
- a.value?.focus(), a.value?.setSelectionRange(t, t);
807
- });
808
- }
809
- }
810
- async function N() {
811
- let e = a.value, n = e?.selectionStart ?? t().length, i = e?.selectionEnd ?? n;
812
- x = !0;
813
- let o;
814
- try {
815
- o = await y();
816
- } finally {
817
- x = !1;
818
- }
819
- if (S || !o) return;
820
- let s = t(), c, u;
821
- "before" in o ? (c = s.slice(0, n) + o.before + s.slice(n, i) + o.after + s.slice(i), u = n + o.before.length + (i - n)) : (c = s.slice(0, n) + o.value + s.slice(n), u = n + o.value.length), r(c), b.value = !0, l(() => {
822
- S || (a.value?.focus(), a.value?.setSelectionRange(u, u));
823
- });
824
- }
825
- return {
826
- segments: w,
827
- hasMergeTags: T,
828
- canRequestMergeTag: s,
829
- isRequestingMergeTag: c,
830
- canInsertLogicTag: g,
831
- isRequestingLogicTag: _,
832
- isEditing: b,
833
- startEditing: ee,
834
- stopEditing: E,
835
- handleInput: D,
836
- handleKeydown: O,
837
- handleClick: k,
838
- handleBlur: A,
839
- clearValue: j,
840
- insertMergeTag: M,
841
- insertLogicTag: N,
842
- autocompleteAvailable: C.available
843
- };
844
- }
845
- //#endregion
846
- //#region src/components/MergeTagSegments.vue?vue&type=script&setup=true&lang.ts
847
- var Un = ["aria-label", "onKeydown"], Wn = ["data-tooltip"], Gn = ["data-tooltip"], Kn = {
848
- key: 2,
849
- class: "tpl:text-sm tpl:text-[var(--tpl-text)]"
850
- }, qn = ["aria-label", "title"], Jn = /* @__PURE__ */ M({
851
- __name: "MergeTagSegments",
852
- props: {
853
- segments: {},
854
- displayClass: {},
855
- pulse: { type: Boolean }
856
- },
857
- emits: ["edit", "clear"],
858
- setup(e, { emit: t }) {
859
- let n = t, { t: r } = W();
860
- function i() {
861
- n("edit");
862
- }
863
- return (t, a) => (s(), y("div", {
864
- role: "button",
865
- tabindex: "0",
866
- "aria-label": x(r).mergeTag.clickToEdit,
867
- class: O([e.displayClass, { "tpl-pulse-fill": e.pulse }]),
868
- onClick: i,
869
- onKeydown: [g(i, ["enter"]), g(S(i, ["prevent"]), ["space"])]
870
- }, [(s(!0), y(A, null, u(e.segments, (e, t) => (s(), y(A, { key: `${e.type}-${t}-${e.value}` }, [e.type === "mergeTag" ? (s(), y("span", {
871
- key: 0,
872
- class: "tpl-tooltip tpl:inline-flex tpl:items-center tpl:gap-1 tpl:rounded tpl:px-1.5 tpl:py-0.5 tpl:text-[0.9em] tpl:font-medium",
873
- "data-tooltip": e.value,
874
- style: {
875
- "background-color": "color-mix(\n in srgb,\n var(--tpl-primary) 20%,\n transparent\n )",
876
- color: "var(--tpl-primary)"
877
- }
878
- }, C(e.label), 9, Wn)) : e.type === "logicMergeTag" ? (s(), y("span", {
879
- key: 1,
880
- class: "tpl-tooltip tpl:inline-flex tpl:items-center tpl:rounded tpl:px-1.5 tpl:py-0.5 tpl:text-[0.8em] tpl:font-bold tpl:tracking-wide tpl:uppercase",
881
- "data-tooltip": e.value,
882
- style: {
883
- "background-color": "transparent",
884
- border: "1.5px solid\n color-mix(in srgb, var(--tpl-primary) 50%, transparent)",
885
- color: "var(--tpl-primary)"
886
- }
887
- }, C(e.keyword), 9, Gn)) : (s(), y("span", Kn, C(e.value), 1))], 64))), 128)), E("button", {
888
- type: "button",
889
- class: "tpl:ml-auto tpl:flex tpl:size-6 tpl:shrink-0 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded-full tpl:border-none tpl:bg-transparent tpl:p-0 tpl:text-[var(--tpl-text-dim)] tpl:opacity-60 tpl:transition-all hover:tpl:text-[var(--tpl-danger)] hover:tpl:opacity-100",
890
- "aria-label": x(r).mergeTag.remove,
891
- title: x(r).mergeTag.remove,
892
- onClick: a[0] ||= S((e) => n("clear"), ["stop"])
893
- }, [N(x(jt), {
894
- size: 12,
895
- "stroke-width": 2.5
896
- })], 8, qn)], 42, Un));
897
- }
898
- }), Yn = [
899
- "aria-label",
900
- "title",
901
- "disabled"
902
- ], Xn = "tpl:flex tpl:items-center tpl:justify-center tpl:gap-1 tpl:rounded-[var(--tpl-radius-sm)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-hover)] tpl:px-2 tpl:py-1 tpl:text-xs tpl:text-[var(--tpl-text-muted)] tpl:transition-all tpl:duration-[120ms] hover:tpl:bg-[var(--tpl-primary-light)] hover:tpl:text-[var(--tpl-primary)] hover:tpl:border-[var(--tpl-primary)]", Zn = /* @__PURE__ */ M({
903
- __name: "MergeTagInsertButton",
904
- props: { disabled: { type: Boolean } },
905
- emits: ["insert"],
906
- setup(e) {
907
- let { t } = W();
908
- return (n, r) => (s(), y("button", {
909
- type: "button",
910
- class: O([Xn, "tpl:mt-1.5"]),
911
- "aria-label": x(t).mergeTag.insert,
912
- title: x(t).mergeTag.insert,
913
- disabled: e.disabled,
914
- onMousedown: r[0] ||= S(() => {}, ["prevent"]),
915
- onClick: r[1] ||= (e) => n.$emit("insert")
916
- }, [N(x(pt), {
917
- size: 12,
918
- "stroke-width": 2
919
- }), j(" " + C(x(t).mergeTag.insertShort), 1)], 42, Yn));
920
- }
921
- }), Qn = [
922
- "aria-label",
923
- "title",
924
- "disabled"
925
- ], $n = "tpl:flex tpl:items-center tpl:justify-center tpl:gap-1 tpl:rounded-[var(--tpl-radius-sm)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-hover)] tpl:px-2 tpl:py-1 tpl:text-xs tpl:text-[var(--tpl-text-muted)] tpl:transition-all tpl:duration-[120ms] hover:tpl:bg-[var(--tpl-primary-light)] hover:tpl:text-[var(--tpl-primary)] hover:tpl:border-[var(--tpl-primary)]", er = /* @__PURE__ */ M({
926
- __name: "LogicTagInsertButton",
927
- props: { disabled: { type: Boolean } },
928
- emits: ["insert"],
929
- setup(e) {
930
- let { t } = W();
931
- return (n, r) => (s(), y("button", {
932
- type: "button",
933
- class: O([$n, "tpl:mt-1.5"]),
934
- "aria-label": x(t).logicTag.insert,
935
- title: x(t).logicTag.insert,
936
- disabled: e.disabled,
937
- "data-testid": "field-insert-logic-button",
938
- onMousedown: r[0] ||= S(() => {}, ["prevent"]),
939
- onClick: r[1] ||= (e) => n.$emit("insert")
940
- }, [N(x(ht), {
941
- size: 12,
942
- "stroke-width": 2
943
- }), j(" " + C(x(t).logicTag.insertShort), 1)], 42, Qn));
944
- }
945
- }), tr = { key: 0 }, nr = {
946
- key: 0,
947
- class: "tpl:flex tpl:flex-wrap tpl:gap-1.5"
948
- }, rr = { key: 1 }, ir = [
949
- "value",
950
- "placeholder",
951
- "rows"
952
- ], ar = {
953
- key: 0,
954
- class: "tpl:flex tpl:flex-wrap tpl:gap-1.5"
955
- }, or = "tpl:w-full tpl:resize-y tpl:rounded-[var(--tpl-radius-sm)] tpl:border tpl:shadow-xs tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:px-3 tpl:py-2 tpl:text-sm tpl:text-[var(--tpl-text)] tpl:outline-none tpl:transition-all tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)] tpl:placeholder:text-[var(--tpl-text-dim)] tpl:focus:border-[var(--tpl-primary)] tpl:focus:shadow-[var(--tpl-ring)]", sr = "tpl:flex tpl:w-full tpl:min-h-20 tpl:cursor-pointer tpl:items-start tpl:flex-wrap tpl:gap-1 tpl:rounded-[var(--tpl-radius-sm)] tpl:border tpl:shadow-xs tpl:bg-[var(--tpl-bg)] tpl:border-[var(--tpl-border)] tpl:px-3 tpl:py-2 tpl:transition-all tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)]", cr = /* @__PURE__ */ M({
956
- __name: "MergeTagTextarea",
957
- props: {
958
- modelValue: {},
959
- placeholder: { default: "" },
960
- rows: { default: 3 }
961
- },
962
- emits: ["update:modelValue"],
963
- setup(e, { emit: t }) {
964
- let n = e, r = t, i = m(null), { segments: a, hasMergeTags: o, canRequestMergeTag: c, isRequestingMergeTag: l, canInsertLogicTag: u, isRequestingLogicTag: d, isEditing: f, startEditing: p, handleInput: h, handleKeydown: g, handleClick: _, handleBlur: v, clearValue: S, insertMergeTag: C, insertLogicTag: T } = Hn({
965
- modelValue: () => n.modelValue,
966
- emit: (e) => r("update:modelValue", e),
967
- elementRef: i
968
- });
969
- return (t, n) => x(o) && !x(f) ? (s(), y("div", tr, [N(Jn, {
970
- segments: x(a),
971
- "display-class": sr,
972
- onEdit: x(p),
973
- onClear: x(S)
974
- }, null, 8, [
975
- "segments",
976
- "onEdit",
977
- "onClear"
978
- ]), x(c) || x(u) ? (s(), y("div", nr, [x(c) ? (s(), w(Zn, {
979
- key: 0,
980
- disabled: x(l),
981
- onInsert: x(C)
982
- }, null, 8, ["disabled", "onInsert"])) : b("", !0), x(u) ? (s(), w(er, {
983
- key: 1,
984
- disabled: x(d),
985
- onInsert: x(T)
986
- }, null, 8, ["disabled", "onInsert"])) : b("", !0)])) : b("", !0)])) : (s(), y("div", rr, [E("textarea", {
987
- ref_key: "textareaRef",
988
- ref: i,
989
- class: O(or),
990
- value: e.modelValue,
991
- placeholder: e.placeholder,
992
- rows: e.rows,
993
- onInput: n[0] ||= (...e) => x(h) && x(h)(...e),
994
- onKeydown: n[1] ||= (...e) => x(g) && x(g)(...e),
995
- onClick: n[2] ||= (...e) => x(_) && x(_)(...e),
996
- onBlur: n[3] ||= (...e) => x(v) && x(v)(...e)
997
- }, null, 40, ir), x(c) || x(u) ? (s(), y("div", ar, [x(c) ? (s(), w(Zn, {
998
- key: 0,
999
- disabled: x(l),
1000
- onInsert: x(C)
1001
- }, null, 8, ["disabled", "onInsert"])) : b("", !0), x(u) ? (s(), w(er, {
1002
- key: 1,
1003
- disabled: x(d),
1004
- onInsert: x(T)
1005
- }, null, 8, ["disabled", "onInsert"])) : b("", !0)])) : b("", !0)]));
1006
- }
1007
- }), lr = { class: "tpl:flex tpl:w-full tpl:flex-1 tpl:flex-col tpl:bg-[var(--tpl-bg-elevated)]" }, ur = { class: "tpl:flex tpl:flex-1 tpl:flex-col tpl:gap-3 tpl:overflow-y-auto tpl:p-4" }, dr = { class: "tpl:mb-3.5 tpl:flex tpl:items-center tpl:gap-2 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]" }, fr = { class: "tpl:mb-3.5" }, pr = { class: "tpl:grid tpl:grid-cols-4 tpl:gap-1 tpl:rounded-[var(--tpl-radius-sm)] tpl:p-1 tpl:bg-[var(--tpl-bg-hover)]" }, mr = ["onClick"], hr = { class: "tpl:flex tpl:items-stretch" }, gr = ["value"], _r = { class: "tpl:mb-3.5 tpl:flex tpl:items-center tpl:gap-2 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]" }, vr = { class: "tpl:mb-3.5" }, yr = { class: "tpl:mb-3.5" }, br = { class: "tpl:mb-3.5" }, xr = { class: "tpl:mb-3.5" }, Sr = ["value"], Cr = ["value"], wr = { class: "tpl:mb-3.5 tpl:flex tpl:items-center tpl:gap-2 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]" }, Tr = ["value"], Er = { class: "tpl:mt-1 tpl:text-xs tpl:leading-relaxed tpl:text-[var(--tpl-text-dim)]" }, Dr = { class: "tpl:mb-3.5 tpl:flex tpl:items-center tpl:gap-2 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]" }, Or = { class: "tpl:mt-1 tpl:flex tpl:items-start tpl:justify-between tpl:gap-2" }, kr = { class: "tpl:text-xs tpl:leading-relaxed tpl:text-[var(--tpl-text-dim)]" }, Ar = { class: "tpl:shrink-0 tpl:text-xs tpl:tabular-nums tpl:text-[var(--tpl-text-dim)]" }, jr = { class: "tpl:rounded-[var(--tpl-radius)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-3" }, Mr = { class: "tpl:mb-2.5 tpl:flex tpl:items-center tpl:gap-1.5 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text-muted)]" }, Nr = { class: "tpl:m-0 tpl:pl-[18px] tpl:text-xs tpl:leading-relaxed tpl:text-[var(--tpl-text-dim)]" }, Pr = { class: "tpl:mb-1 tpl:last:mb-0" }, Fr = { class: "tpl:mb-1 tpl:last:mb-0" }, Ir = { class: "tpl:mb-1 tpl:last:mb-0" }, Lr = 150, Rr = /* @__PURE__ */ M({
1008
- __name: "TemplateSettings",
1009
- props: { settings: {} },
1010
- emits: ["update"],
1011
- setup(e, { emit: t }) {
1012
- let n = e, r = t, { t: i } = W(), a = Me(tt, "TemplateSettings"), o = v(() => a.fonts.value), c = v(() => o.value.some((e) => e.value === n.settings.fontFamily) ? n.settings.fontFamily : a.defaultFont.value), l = [
1013
- {
1014
- value: 480,
1015
- label: "480px"
1016
- },
1017
- {
1018
- value: 600,
1019
- label: "600px"
1020
- },
1021
- {
1022
- value: 700,
1023
- label: "700px"
1024
- },
1025
- {
1026
- value: 800,
1027
- label: "800px"
1028
- }
1029
- ];
1030
- return (t, n) => (s(), y("aside", lr, [E("div", ur, [
1031
- E("div", { class: O(x(en)) }, [
1032
- E("div", dr, [N(x(Rt), {
1033
- class: "tpl:text-[var(--tpl-text-muted)]",
1034
- size: 14,
1035
- "stroke-width": 2
1036
- }), E("span", null, C(x(i).templateSettings.layout), 1)]),
1037
- E("div", fr, [E("label", { class: O(x(q)) }, C(x(i).templateSettings.widthPreset), 3), E("div", pr, [(s(), y(A, null, u(l, (t) => E("button", {
1038
- key: t.value,
1039
- class: "tpl:cursor-pointer tpl:rounded-[var(--tpl-radius-sm)] tpl:border-none tpl:px-2 tpl:py-1.5 tpl:text-sm tpl:font-medium tpl:transition-all tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)]",
1040
- style: _({
1041
- backgroundColor: e.settings.width === t.value ? "var(--tpl-bg)" : "transparent",
1042
- color: e.settings.width === t.value ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
1043
- boxShadow: e.settings.width === t.value ? "var(--tpl-shadow)" : "none"
1044
- }),
1045
- onClick: (e) => r("update", { width: t.value })
1046
- }, C(t.label), 13, mr)), 64))])]),
1047
- E("div", null, [E("label", { class: O(x(q)) }, C(x(i).templateSettings.customWidth), 3), E("div", hr, [E("input", {
1048
- type: "number",
1049
- class: O(x(Y)),
1050
- value: e.settings.width,
1051
- min: "300",
1052
- max: "900",
1053
- onInput: n[0] ||= (e) => r("update", { width: Number(e.target.value) })
1054
- }, null, 42, gr), E("span", { class: O(x(J)) }, "px", 2)])])
1055
- ], 2),
1056
- E("div", { class: O(x(en)) }, [
1057
- E("div", _r, [N(x(at), {
1058
- class: "tpl:text-[var(--tpl-text-muted)]",
1059
- size: 14,
1060
- "stroke-width": 2
1061
- }), E("span", null, C(x(i).templateSettings.appearance), 1)]),
1062
- E("div", vr, [E("label", { class: O(x(q)) }, C(x(i).templateSettings.backgroundColor), 3), N(X, {
1063
- "model-value": e.settings.backgroundColor,
1064
- placeholder: x($t),
1065
- "onUpdate:modelValue": n[1] ||= (e) => r("update", { backgroundColor: e })
1066
- }, null, 8, ["model-value", "placeholder"])]),
1067
- E("div", yr, [E("label", { class: O(x(q)) }, C(x(i).templateSettings.textColor), 3), N(X, {
1068
- "model-value": e.settings.textColor ?? "",
1069
- "seed-color": "#1a1a1a",
1070
- "onUpdate:modelValue": n[2] ||= (e) => r("update", { textColor: e })
1071
- }, null, 8, ["model-value"])]),
1072
- E("div", br, [E("label", { class: O(x(q)) }, C(x(i).templateSettings.linkColor), 3), N(X, {
1073
- "model-value": e.settings.linkColor ?? "",
1074
- "seed-color": "#0066cc",
1075
- "onUpdate:modelValue": n[3] ||= (e) => r("update", { linkColor: e || void 0 })
1076
- }, null, 8, ["model-value"])]),
1077
- E("div", xr, [N(Z, {
1078
- class: "tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-text-muted)]",
1079
- "model-value": e.settings.linkUnderline,
1080
- label: x(i).templateSettings.linkUnderline,
1081
- "onUpdate:modelValue": n[4] ||= (e) => r("update", { linkUnderline: e })
1082
- }, null, 8, ["model-value", "label"])]),
1083
- E("div", null, [E("label", { class: O(x(q)) }, C(x(i).templateSettings.fontFamily), 3), E("select", {
1084
- class: O(x(K)),
1085
- value: c.value,
1086
- onChange: n[5] ||= (e) => r("update", { fontFamily: e.target.value })
1087
- }, [(s(!0), y(A, null, u(o.value, (e) => (s(), y("option", {
1088
- key: e.value,
1089
- value: e.value
1090
- }, C(e.label), 9, Cr))), 128))], 42, Sr)])
1091
- ], 2),
1092
- E("div", { class: O(x(en)) }, [E("div", wr, [N(x(bt), {
1093
- class: "tpl:text-[var(--tpl-text-muted)]",
1094
- size: 14,
1095
- "stroke-width": 2
1096
- }), E("span", null, C(x(i).templateSettings.language), 1)]), E("div", null, [
1097
- E("label", { class: O(x(q)) }, C(x(i).templateSettings.contentLocale), 3),
1098
- E("input", {
1099
- type: "text",
1100
- class: O(x(K)),
1101
- value: e.settings.locale ?? "",
1102
- placeholder: "en",
1103
- spellcheck: "false",
1104
- autocapitalize: "off",
1105
- autocomplete: "off",
1106
- onInput: n[6] ||= (e) => r("update", { locale: e.target.value.trim() || void 0 })
1107
- }, null, 42, Tr),
1108
- E("p", Er, C(x(i).templateSettings.contentLocaleHint), 1)
1109
- ])], 2),
1110
- E("div", { class: O(x(en)) }, [E("div", Dr, [N(x(zt), {
1111
- class: "tpl:text-[var(--tpl-text-muted)]",
1112
- size: 14,
1113
- "stroke-width": 2
1114
- }), E("span", null, C(x(i).templateSettings.preheaderText), 1)]), E("div", null, [N(cr, {
1115
- "model-value": e.settings.preheaderText ?? "",
1116
- placeholder: x(i).templateSettings.preheaderTextPlaceholder,
1117
- rows: 2,
1118
- "onUpdate:modelValue": n[7] ||= (e) => r("update", { preheaderText: e.replace(/[\r\n]/g, " ") || void 0 })
1119
- }, null, 8, ["model-value", "placeholder"]), E("div", Or, [E("span", kr, C(x(i).templateSettings.preheaderTextHint), 1), E("span", Ar, C((e.settings.preheaderText ?? "").length) + "/" + C(Lr), 1)])])], 2),
1120
- E("div", jr, [E("div", Mr, [N(x(Ct), {
1121
- size: 14,
1122
- "stroke-width": 2
1123
- }), E("span", null, C(x(i).templateSettings.tips), 1)]), E("ul", Nr, [
1124
- E("li", Pr, C(x(i).templateSettings.tip1), 1),
1125
- E("li", Fr, C(x(i).templateSettings.tip2), 1),
1126
- E("li", Ir, C(x(i).templateSettings.tip3), 1)
1127
- ])])
1128
- ])]));
1129
- }
1130
- }), zr = { key: 0 }, Br = {
1131
- key: 0,
1132
- class: "tpl:flex tpl:flex-wrap tpl:gap-1.5"
1133
- }, Vr = { key: 1 }, Hr = [
1134
- "type",
1135
- "value",
1136
- "placeholder"
1137
- ], Ur = {
1138
- key: 0,
1139
- class: "tpl:flex tpl:flex-wrap tpl:gap-1.5"
1140
- }, Wr = "tpl:flex tpl:w-full tpl:min-h-10 tpl:cursor-pointer tpl:items-center tpl:flex-wrap tpl:gap-1 tpl:rounded-[var(--tpl-radius-sm)] tpl:border tpl:shadow-xs tpl:bg-[var(--tpl-bg)] tpl:border-[var(--tpl-border)] tpl:px-3.5 tpl:py-1.5 tpl:transition-all tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)]", $ = /*#__PURE__*/ Vt(/* @__PURE__ */ M({
1141
- __name: "MergeTagInput",
1142
- props: {
1143
- modelValue: {},
1144
- type: { default: "text" },
1145
- placeholder: { default: "" },
1146
- pulse: {
1147
- type: Boolean,
1148
- default: !1
1149
- }
1150
- },
1151
- emits: ["update:modelValue"],
1152
- setup(e, { emit: t }) {
1153
- let n = e, r = t, i = m(null), { segments: a, hasMergeTags: o, canRequestMergeTag: c, isRequestingMergeTag: l, canInsertLogicTag: u, isRequestingLogicTag: d, isEditing: f, startEditing: p, handleInput: h, handleKeydown: g, handleClick: _, handleBlur: v, clearValue: S, insertMergeTag: C, insertLogicTag: T } = Hn({
1154
- modelValue: () => n.modelValue,
1155
- emit: (e) => r("update:modelValue", e),
1156
- elementRef: i
1157
- });
1158
- return (t, n) => x(o) && !x(f) ? (s(), y("div", zr, [N(Jn, {
1159
- segments: x(a),
1160
- "display-class": Wr,
1161
- pulse: e.pulse,
1162
- onEdit: x(p),
1163
- onClear: x(S)
1164
- }, null, 8, [
1165
- "segments",
1166
- "pulse",
1167
- "onEdit",
1168
- "onClear"
1169
- ]), x(c) || x(u) ? (s(), y("div", Br, [x(c) ? (s(), w(Zn, {
1170
- key: 0,
1171
- disabled: x(l),
1172
- onInsert: x(C)
1173
- }, null, 8, ["disabled", "onInsert"])) : b("", !0), x(u) ? (s(), w(er, {
1174
- key: 1,
1175
- disabled: x(d),
1176
- onInsert: x(T)
1177
- }, null, 8, ["disabled", "onInsert"])) : b("", !0)])) : b("", !0)])) : (s(), y("div", Vr, [E("input", {
1178
- ref_key: "inputRef",
1179
- ref: i,
1180
- type: e.type,
1181
- class: O([x(K), { "tpl-pulse-fill": e.pulse }]),
1182
- value: e.modelValue,
1183
- placeholder: e.placeholder,
1184
- onInput: n[0] ||= (...e) => x(h) && x(h)(...e),
1185
- onKeydown: n[1] ||= (...e) => x(g) && x(g)(...e),
1186
- onClick: n[2] ||= (...e) => x(_) && x(_)(...e),
1187
- onBlur: n[3] ||= (...e) => x(v) && x(v)(...e)
1188
- }, null, 42, Hr), x(c) || x(u) ? (s(), y("div", Ur, [x(c) ? (s(), w(Zn, {
1189
- key: 0,
1190
- disabled: x(l),
1191
- onInsert: x(C)
1192
- }, null, 8, ["disabled", "onInsert"])) : b("", !0), x(u) ? (s(), w(er, {
1193
- key: 1,
1194
- disabled: x(d),
1195
- onInsert: x(T)
1196
- }, null, 8, ["disabled", "onInsert"])) : b("", !0)])) : b("", !0)]));
1197
- }
1198
- }), [["__scopeId", "data-v-d6563be6"]]), Gr = { class: "tpl:mb-3.5" }, Kr = ["value"], qr = { value: "" }, Jr = ["value"], Yr = { class: "tpl:mb-3.5" }, Xr = { class: "tpl:mb-3.5" }, Zr = { class: "tpl:mb-3.5" }, Qr = { class: "tpl:mb-3.5" }, $r = { class: "tpl:grid tpl:grid-cols-2 tpl:gap-3" }, ei = { class: "tpl:mb-3.5" }, ti = { class: "tpl:flex tpl:items-stretch" }, ni = ["value"], ri = { class: "tpl:mb-3.5" }, ii = { class: "tpl:flex tpl:items-stretch" }, ai = ["value"], oi = { class: "tpl:mb-3.5" }, si = ["value"], ci = { value: "auto" }, li = { value: "full" }, ui = { value: "custom" }, di = {
1199
- key: 0,
1200
- class: "tpl:mt-2 tpl:flex tpl:items-stretch"
1201
- }, fi = ["value"], pi = { class: "tpl:mb-3.5" }, mi = 200, hi = /* @__PURE__ */ M({
1202
- __name: "ButtonToolbar",
1203
- props: {
1204
- block: {},
1205
- fontFamilies: {}
1206
- },
1207
- emits: ["update"],
1208
- setup(e, { emit: t }) {
1209
- let n = e, r = t, { t: i } = W(), a = v(() => n.block.width === "full" ? "full" : typeof n.block.width == "number" ? "custom" : "auto");
1210
- function o(e, t) {
1211
- r("update", { [e]: t });
1212
- }
1213
- function c(e) {
1214
- if (e === "full") {
1215
- o("width", "full");
1216
- return;
1217
- }
1218
- if (e === "custom") {
1219
- o("width", typeof n.block.width == "number" ? n.block.width : mi);
1220
- return;
1221
- }
1222
- o("width", void 0);
1223
- }
1224
- function l(e) {
1225
- let t = Number(e);
1226
- !Number.isFinite(t) || t <= 0 || o("width", t);
1227
- }
1228
- return (t, n) => (s(), y(A, null, [
1229
- E("div", Gr, [E("label", { class: O(x(q)) }, C(x(i).button.fontFamily), 3), E("select", {
1230
- class: O(x(K)),
1231
- value: e.block.fontFamily || "",
1232
- onChange: n[0] ||= (e) => o("fontFamily", e.target.value || void 0)
1233
- }, [E("option", qr, C(x(i).button.inheritFont), 1), (s(!0), y(A, null, u(e.fontFamilies, (e) => (s(), y("option", {
1234
- key: e.value,
1235
- value: e.value
1236
- }, C(e.label), 9, Jr))), 128))], 42, Kr)]),
1237
- E("div", Yr, [E("label", { class: O(x(q)) }, C(x(i).button.text), 3), N($, {
1238
- "model-value": e.block.text,
1239
- type: "text",
1240
- "onUpdate:modelValue": n[1] ||= (e) => o("text", e)
1241
- }, null, 8, ["model-value"])]),
1242
- E("div", Xr, [
1243
- E("label", { class: O(x(q)) }, C(x(i).button.url), 3),
1244
- N($, {
1245
- "model-value": e.block.url,
1246
- type: "url",
1247
- placeholder: x(i).button.urlPlaceholder,
1248
- "onUpdate:modelValue": n[2] ||= (e) => o("url", e)
1249
- }, null, 8, ["model-value", "placeholder"]),
1250
- e.block.url ? (s(), w(Z, {
1251
- key: 0,
1252
- class: "tpl:mt-2 tpl:text-[12px] tpl:text-[var(--tpl-text-muted)]",
1253
- "model-value": e.block.openInNewTab ?? !1,
1254
- label: x(i).button.openInNewTab,
1255
- "onUpdate:modelValue": n[3] ||= (e) => o("openInNewTab", e)
1256
- }, null, 8, ["model-value", "label"])) : b("", !0)
1257
- ]),
1258
- E("div", Zr, [E("label", { class: O(x(q)) }, C(x(i).button.background), 3), N(X, {
1259
- "model-value": e.block.backgroundColor,
1260
- "onUpdate:modelValue": n[4] ||= (e) => o("backgroundColor", e)
1261
- }, null, 8, ["model-value"])]),
1262
- E("div", Qr, [E("label", { class: O(x(q)) }, C(x(i).button.textColor), 3), N(X, {
1263
- "model-value": e.block.textColor,
1264
- "onUpdate:modelValue": n[5] ||= (e) => o("textColor", e)
1265
- }, null, 8, ["model-value"])]),
1266
- E("div", $r, [E("div", ei, [E("label", { class: O(x(q)) }, C(x(i).button.borderRadius), 3), E("div", ti, [E("input", {
1267
- type: "number",
1268
- class: O(x(Y)),
1269
- value: e.block.borderRadius,
1270
- min: "0",
1271
- max: "50",
1272
- onInput: n[6] ||= (e) => o("borderRadius", Number(e.target.value))
1273
- }, null, 42, ni), E("span", { class: O(x(J)) }, "px", 2)])]), E("div", ri, [E("label", { class: O(x(q)) }, C(x(i).button.fontSize), 3), E("div", ii, [E("input", {
1274
- type: "number",
1275
- class: O(x(Y)),
1276
- value: e.block.fontSize,
1277
- min: "10",
1278
- max: "36",
1279
- onInput: n[7] ||= (e) => o("fontSize", Number(e.target.value))
1280
- }, null, 42, ai), E("span", { class: O(x(J)) }, "px", 2)])])]),
1281
- E("div", oi, [
1282
- E("label", { class: O(x(q)) }, C(x(i).button.width), 3),
1283
- E("select", {
1284
- class: O(x(K)),
1285
- value: a.value,
1286
- onChange: n[8] ||= (e) => c(e.target.value)
1287
- }, [
1288
- E("option", ci, C(x(i).button.widthAuto), 1),
1289
- E("option", li, C(x(i).button.fullWidth), 1),
1290
- E("option", ui, C(x(i).button.widthCustom), 1)
1291
- ], 42, si),
1292
- a.value === "custom" ? (s(), y("div", di, [E("input", {
1293
- type: "number",
1294
- class: O(x(Y)),
1295
- value: typeof e.block.width == "number" ? e.block.width : mi,
1296
- min: "20",
1297
- onInput: n[9] ||= (e) => l(e.target.value)
1298
- }, null, 42, fi), E("span", { class: O(x(J)) }, "px", 2)])) : b("", !0)
1299
- ]),
1300
- E("div", pi, [E("label", { class: O(x(q)) }, C(x(i).title.align), 3), N(rn, {
1301
- options: [
1302
- {
1303
- value: "left",
1304
- label: x(i).title.alignLeft
1305
- },
1306
- {
1307
- value: "center",
1308
- label: x(i).title.alignCenter
1309
- },
1310
- {
1311
- value: "right",
1312
- label: x(i).title.alignRight
1313
- }
1314
- ],
1315
- "model-value": e.block.align ?? "center",
1316
- "onUpdate:modelValue": n[10] ||= (e) => o("align", e)
1317
- }, null, 8, ["options", "model-value"])])
1318
- ], 64));
1319
- }
1320
- }), gi = { class: "spacing-control" }, _i = { class: "tpl:mb-2 tpl:block tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-text-muted)]" }, vi = { class: "tpl:flex tpl:flex-col tpl:items-center tpl:gap-1.5" }, yi = { class: "tpl:flex tpl:items-center" }, bi = ["aria-label"], xi = ["value", "aria-label"], Si = ["aria-label"], Ci = { class: "tpl:flex tpl:items-center tpl:gap-2" }, wi = { class: "tpl:flex tpl:items-center" }, Ti = ["aria-label"], Ei = ["value", "aria-label"], Di = ["aria-label"], Oi = ["aria-label", "title"], ki = { class: "tpl:flex tpl:items-center" }, Ai = ["aria-label"], ji = ["value", "aria-label"], Mi = ["aria-label"], Ni = { class: "tpl:flex tpl:items-center" }, Pi = ["aria-label"], Fi = ["value", "aria-label"], Ii = ["aria-label"], Li = "tpl:flex tpl:items-center tpl:justify-center tpl:w-8 tpl:h-8 tpl:text-[var(--tpl-text-muted)] tpl:bg-[var(--tpl-bg)] tpl:border tpl:border-[var(--tpl-border)] tpl:cursor-pointer tpl:transition-all tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)] hover:tpl:bg-[var(--tpl-bg-hover)] hover:tpl:text-[var(--tpl-text)] active:tpl:bg-[var(--tpl-bg-active)]", Ri = "tpl:w-10 tpl:h-8 tpl:text-center tpl:text-xs tpl:font-medium tpl:border-y tpl:border-x-0 tpl:border-[var(--tpl-border)] tpl:text-[var(--tpl-text)] tpl:bg-[var(--tpl-bg)] tpl:outline-none tpl:transition-all tpl:duration-[120ms] focus:tpl:border-[var(--tpl-primary)] focus:tpl:shadow-[var(--tpl-ring)]", zi = /*#__PURE__*/ Vt(/* @__PURE__ */ M({
1321
- __name: "SpacingControl",
1322
- props: {
1323
- modelValue: {},
1324
- label: {}
1325
- },
1326
- emits: ["update:modelValue"],
1327
- setup(e, { emit: t }) {
1328
- let n = e, r = t, { t: i } = W(), a = v(() => n.modelValue.top === n.modelValue.right && n.modelValue.right === n.modelValue.bottom && n.modelValue.bottom === n.modelValue.left), o = m(a.value);
1329
- P(a, (e) => {
1330
- !e && o.value && (o.value = !1);
1331
- });
1332
- function c(e, t) {
1333
- let i = Math.max(0, n.modelValue[e] + t);
1334
- o.value ? r("update:modelValue", {
1335
- top: i,
1336
- right: i,
1337
- bottom: i,
1338
- left: i
1339
- }) : r("update:modelValue", {
1340
- ...n.modelValue,
1341
- [e]: i
1342
- });
1343
- }
1344
- function l(e, t) {
1345
- let i = Math.max(0, t);
1346
- o.value ? r("update:modelValue", {
1347
- top: i,
1348
- right: i,
1349
- bottom: i,
1350
- left: i
1351
- }) : r("update:modelValue", {
1352
- ...n.modelValue,
1353
- [e]: i
1354
- });
1355
- }
1356
- function u() {
1357
- if (o.value = !o.value, o.value) {
1358
- let e = n.modelValue.top;
1359
- r("update:modelValue", {
1360
- top: e,
1361
- right: e,
1362
- bottom: e,
1363
- left: e
1364
- });
1365
- }
1366
- }
1367
- return (t, n) => (s(), y("div", gi, [E("label", _i, C(e.label), 1), E("div", vi, [
1368
- E("div", yi, [
1369
- E("button", {
1370
- "aria-label": x(i).spacingControl.decreaseTop,
1371
- class: O([Li, "tpl:rounded-l-[var(--tpl-radius-sm)]"]),
1372
- onClick: n[0] ||= (e) => c("top", -1)
1373
- }, [N(x(wt), {
1374
- size: 12,
1375
- "stroke-width": 2
1376
- })], 10, bi),
1377
- E("input", {
1378
- type: "number",
1379
- class: O(Ri),
1380
- value: e.modelValue.top,
1381
- "aria-label": x(i).spacingControl.top,
1382
- min: "0",
1383
- onInput: n[1] ||= (e) => l("top", Number(e.target.value))
1384
- }, null, 40, xi),
1385
- E("button", {
1386
- "aria-label": x(i).spacingControl.increaseTop,
1387
- class: O([Li, "tpl:rounded-r-[var(--tpl-radius-sm)]"]),
1388
- onClick: n[2] ||= (e) => c("top", 1)
1389
- }, [N(x(G), {
1390
- size: 12,
1391
- "stroke-width": 2
1392
- })], 10, Si)
1393
- ]),
1394
- E("div", Ci, [
1395
- E("div", wi, [
1396
- E("button", {
1397
- "aria-label": x(i).spacingControl.decreaseLeft,
1398
- class: O([Li, "tpl:rounded-l-[var(--tpl-radius-sm)]"]),
1399
- onClick: n[3] ||= (e) => c("left", -1)
1400
- }, [N(x(wt), {
1401
- size: 12,
1402
- "stroke-width": 2
1403
- })], 10, Ti),
1404
- E("input", {
1405
- type: "number",
1406
- class: O(Ri),
1407
- value: e.modelValue.left,
1408
- "aria-label": x(i).spacingControl.left,
1409
- min: "0",
1410
- onInput: n[4] ||= (e) => l("left", Number(e.target.value))
1411
- }, null, 40, Ei),
1412
- E("button", {
1413
- "aria-label": x(i).spacingControl.increaseLeft,
1414
- class: O([Li, "tpl:rounded-r-[var(--tpl-radius-sm)]"]),
1415
- onClick: n[5] ||= (e) => c("left", 1)
1416
- }, [N(x(G), {
1417
- size: 12,
1418
- "stroke-width": 2
1419
- })], 10, Di)
1420
- ]),
1421
- E("button", {
1422
- class: O(["tpl:flex tpl:h-8 tpl:w-8 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded-[var(--tpl-radius-sm)] tpl:border tpl:transition-all tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)]", o.value ? "tpl:border-[var(--tpl-primary)] tpl:bg-[var(--tpl-primary-light)] tpl:text-[var(--tpl-primary)]" : "tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:text-[var(--tpl-text-muted)] hover:tpl:bg-[var(--tpl-bg-hover)]"]),
1423
- "aria-label": o.value ? x(i).spacingControl.unlock : x(i).spacingControl.lockAll,
1424
- title: o.value ? x(i).spacingControl.unlock : x(i).spacingControl.lockAll,
1425
- onClick: u
1426
- }, [o.value ? (s(), w(x(Mt), {
1427
- key: 0,
1428
- size: 14,
1429
- "stroke-width": 2
1430
- })) : (s(), w(x(Ft), {
1431
- key: 1,
1432
- size: 14,
1433
- "stroke-width": 2
1434
- }))], 10, Oi),
1435
- E("div", ki, [
1436
- E("button", {
1437
- "aria-label": x(i).spacingControl.decreaseRight,
1438
- class: O([Li, "tpl:rounded-l-[var(--tpl-radius-sm)]"]),
1439
- onClick: n[6] ||= (e) => c("right", -1)
1440
- }, [N(x(wt), {
1441
- size: 12,
1442
- "stroke-width": 2
1443
- })], 10, Ai),
1444
- E("input", {
1445
- type: "number",
1446
- class: O(Ri),
1447
- value: e.modelValue.right,
1448
- "aria-label": x(i).spacingControl.right,
1449
- min: "0",
1450
- onInput: n[7] ||= (e) => l("right", Number(e.target.value))
1451
- }, null, 40, ji),
1452
- E("button", {
1453
- "aria-label": x(i).spacingControl.increaseRight,
1454
- class: O([Li, "tpl:rounded-r-[var(--tpl-radius-sm)]"]),
1455
- onClick: n[8] ||= (e) => c("right", 1)
1456
- }, [N(x(G), {
1457
- size: 12,
1458
- "stroke-width": 2
1459
- })], 10, Mi)
1460
- ])
1461
- ]),
1462
- E("div", Ni, [
1463
- E("button", {
1464
- "aria-label": x(i).spacingControl.decreaseBottom,
1465
- class: O([Li, "tpl:rounded-l-[var(--tpl-radius-sm)]"]),
1466
- onClick: n[9] ||= (e) => c("bottom", -1)
1467
- }, [N(x(wt), {
1468
- size: 12,
1469
- "stroke-width": 2
1470
- })], 10, Pi),
1471
- E("input", {
1472
- type: "number",
1473
- class: O(Ri),
1474
- value: e.modelValue.bottom,
1475
- "aria-label": x(i).spacingControl.bottom,
1476
- min: "0",
1477
- onInput: n[10] ||= (e) => l("bottom", Number(e.target.value))
1478
- }, null, 40, Fi),
1479
- E("button", {
1480
- "aria-label": x(i).spacingControl.increaseBottom,
1481
- class: O([Li, "tpl:rounded-r-[var(--tpl-radius-sm)]"]),
1482
- onClick: n[11] ||= (e) => c("bottom", 1)
1483
- }, [N(x(G), {
1484
- size: 12,
1485
- "stroke-width": 2
1486
- })], 10, Ii)
1487
- ])
1488
- ])]));
1489
- }
1490
- }), [["__scopeId", "data-v-9a9c8a07"]]), Bi = ["data-testid"], Vi = { class: "tpl:mt-3" }, Hi = /* @__PURE__ */ M({
1491
- __name: "CollapsibleSection",
1492
- props: {
1493
- title: {},
1494
- open: { type: Boolean },
1495
- noBorder: { type: Boolean },
1496
- headerTestId: {}
1497
- },
1498
- emits: ["toggle"],
1499
- setup(e) {
1500
- return (n, i) => (s(), y("div", { class: O(["tpl:py-3", e.noBorder ? "" : "tpl:border-t tpl:border-[var(--tpl-border)]"]) }, [E("button", {
1501
- type: "button",
1502
- "data-testid": e.headerTestId,
1503
- class: "tpl:flex tpl:w-full tpl:cursor-pointer tpl:items-center tpl:gap-1.5 tpl:border-none tpl:bg-transparent tpl:p-0 tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-text-muted)]",
1504
- onClick: i[0] ||= (e) => n.$emit("toggle")
1505
- }, [N(x(lt), {
1506
- class: O(["tpl:transition-transform tpl:duration-200", e.open ? "tpl:rotate-0" : "tpl:-rotate-90"]),
1507
- size: 12,
1508
- "stroke-width": 2
1509
- }, null, 8, ["class"]), E("span", null, C(e.title), 1)], 8, Bi), r(E("div", Vi, [t(n.$slots, "default")], 512), [[D, e.open]])], 2));
1510
- }
1511
- }), Ui = { class: "tpl:space-y-2" }, Wi = { class: "tpl:flex tpl:items-center tpl:gap-2" }, Gi = { class: "tpl:space-y-2" }, Ki = ["value"], qi = { value: "" }, Ji = ["label"], Yi = ["value"], Xi = ["value"], Zi = {
1512
- key: 0,
1513
- value: "__custom__"
1514
- }, Qi = {
1515
- key: 0,
1516
- class: "tpl:space-y-2"
1517
- }, $i = { class: "tpl:mb-1 tpl:block tpl:text-[11px] tpl:font-medium tpl:text-[var(--tpl-text-muted)]" }, ea = { class: "tpl:mb-1 tpl:block tpl:text-[11px] tpl:font-medium tpl:text-[var(--tpl-text-muted)]" }, ta = { class: "tpl:flex tpl:justify-end" }, na = ["disabled"], ra = {
1518
- key: 0,
1519
- class: "tpl:text-[11px] tpl:text-[var(--tpl-text-muted)]"
1520
- }, ia = { class: "tpl:space-y-1" }, aa = { class: "tpl:m-0 tpl:overflow-x-auto tpl:rounded tpl:bg-[var(--tpl-bg)] tpl:p-2 tpl:font-mono tpl:text-[10px] tpl:text-[var(--tpl-text-muted)]" }, oa = {
1521
- key: 0,
1522
- class: "tpl:m-0 tpl:overflow-x-auto tpl:rounded tpl:bg-[var(--tpl-bg)] tpl:p-2 tpl:font-mono tpl:text-[10px] tpl:text-[var(--tpl-text-muted)]"
1523
- }, sa = /* @__PURE__ */ M({
1524
- __name: "CommonBlockSettings",
1525
- props: {
1526
- block: {},
1527
- isFirstSection: { type: Boolean }
1528
- },
1529
- emits: ["update"],
1530
- setup(e, { emit: t }) {
1531
- let n = e, i = t, { t: a } = W(), c = d(Ke, []), l = d(Ye, !1), h = p(/* @__PURE__ */ new Set()), g = m(!1), _ = m(""), S = m(""), T = [{
1532
- key: "desktop",
1533
- icon: it,
1534
- labelKey: "showOnDesktop"
1535
- }, {
1536
- key: "mobile",
1537
- icon: ot,
1538
- labelKey: "showOnMobile"
1539
- }];
1540
- function D(e) {
1541
- h.has(e) ? h.delete(e) : h.add(e);
1542
- }
1543
- let k = v(() => c.length > 0 || l), M = v(() => n.block.displayCondition ? !c.some((e) => e.label === n.block.displayCondition?.label) : !1);
1544
- function F() {
1545
- g.value = !0, M.value && n.block.displayCondition ? (_.value = n.block.displayCondition.before, S.value = n.block.displayCondition.after ?? "") : (_.value = "", S.value = "");
1546
- }
1547
- function I() {
1548
- _.value.trim() && (i("update", { displayCondition: {
1549
- label: a.blockSettings.customCondition,
1550
- before: _.value.trim(),
1551
- after: S.value.trim()
1552
- } }), g.value = !1, _.value = "", S.value = "");
1553
- }
1554
- P(() => n.block.displayCondition, (e) => {
1555
- if (!e) {
1556
- g.value = !1, _.value = "", S.value = "";
1557
- return;
1558
- }
1559
- M.value && (_.value = e.before, S.value = e.after ?? "");
1560
- }, { immediate: !0 });
1561
- let L = v(() => {
1562
- let e = {};
1563
- for (let t of c) {
1564
- let n = t.group ?? "";
1565
- e[n] || (e[n] = []), e[n].push(t);
1566
- }
1567
- return e;
1568
- });
1569
- function R(e, t) {
1570
- i("update", { styles: {
1571
- ...n.block.styles,
1572
- [e]: t
1573
- } });
1574
- }
1575
- function z(e) {
1576
- return n.block.visibility?.[e] !== !1;
1577
- }
1578
- function B(e) {
1579
- let t = {
1580
- desktop: z("desktop"),
1581
- mobile: z("mobile")
1582
- };
1583
- t[e] = !t[e], i("update", { visibility: t });
1584
- }
1585
- return (t, n) => (s(), y("div", { class: O(["tpl:flex tpl:flex-col", e.isFirstSection ? "" : "tpl:mt-4"]) }, [
1586
- N(Hi, {
1587
- title: x(a).blockSettings.spacing,
1588
- open: h.has("spacing"),
1589
- "no-border": e.isFirstSection,
1590
- onToggle: n[1] ||= (e) => D("spacing")
1591
- }, {
1592
- default: f(() => [N(zi, {
1593
- label: x(a).blockSettings.padding,
1594
- "model-value": e.block.styles.padding,
1595
- "onUpdate:modelValue": n[0] ||= (e) => R("padding", e)
1596
- }, null, 8, ["label", "model-value"])]),
1597
- _: 1
1598
- }, 8, [
1599
- "title",
1600
- "open",
1601
- "no-border"
1602
- ]),
1603
- N(Hi, {
1604
- title: x(a).blockSettings.background,
1605
- open: h.has("bg"),
1606
- onToggle: n[3] ||= (e) => D("bg")
1607
- }, {
1608
- default: f(() => [E("label", { class: O(x(q)) }, C(x(a).blockSettings.color), 3), N(X, {
1609
- "model-value": e.block.styles.backgroundColor ?? "",
1610
- "onUpdate:modelValue": n[2] ||= (e) => R("backgroundColor", e)
1611
- }, null, 8, ["model-value"])]),
1612
- _: 1
1613
- }, 8, ["title", "open"]),
1614
- N(Hi, {
1615
- title: x(a).blockSettings.display,
1616
- open: h.has("display"),
1617
- onToggle: n[4] ||= (e) => D("display")
1618
- }, {
1619
- default: f(() => [E("div", Ui, [(s(), y(A, null, u(T, (e) => N(Z, {
1620
- key: e.key,
1621
- class: "tpl:text-xs tpl:text-[var(--tpl-text)]",
1622
- "model-value": z(e.key),
1623
- label: x(a).blockSettings[e.labelKey],
1624
- "onUpdate:modelValue": (t) => B(e.key)
1625
- }, {
1626
- default: f(() => [E("span", Wi, [(s(), w(o(e.icon), {
1627
- size: 14,
1628
- "stroke-width": 1.5
1629
- })), j(" " + C(x(a).blockSettings[e.labelKey]), 1)])]),
1630
- _: 2
1631
- }, 1032, [
1632
- "model-value",
1633
- "label",
1634
- "onUpdate:modelValue"
1635
- ])), 64))])]),
1636
- _: 1
1637
- }, 8, ["title", "open"]),
1638
- k.value ? (s(), w(Hi, {
1639
- key: 0,
1640
- "header-test-id": "display-condition-section",
1641
- title: x(a).blockSettings.displayCondition,
1642
- open: h.has("condition"),
1643
- onToggle: n[8] ||= (e) => D("condition")
1644
- }, {
1645
- default: f(() => [E("div", Gi, [E("select", {
1646
- "data-testid": "display-condition-select",
1647
- class: O(["tpl:w-full tpl:rounded-md tpl:border tpl:px-2.5 tpl:py-2 tpl:text-xs tpl:outline-none tpl:transition-all tpl:duration-150 tpl:focus:border-[var(--tpl-primary)] tpl:focus:shadow-[0_0_0_3px_var(--tpl-primary-light)]", e.block.displayCondition ? "tpl:border-[var(--tpl-primary)] tpl:bg-[var(--tpl-primary-light)] tpl:text-[var(--tpl-text)]" : "tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:text-[var(--tpl-text)]"]),
1648
- value: g.value || M.value ? "__custom__" : e.block.displayCondition?.label ?? "",
1649
- onChange: n[5] ||= (e) => {
1650
- let t = e.target.value;
1651
- if (t === "__custom__") {
1652
- F();
1653
- return;
1654
- }
1655
- if (g.value = !1, !t) {
1656
- i("update", { displayCondition: void 0 });
1657
- return;
1658
- }
1659
- let n = x(c).find((e) => e.label === t);
1660
- n && i("update", { displayCondition: n });
1661
- }
1662
- }, [
1663
- E("option", qi, C(x(a).blockSettings.noCondition), 1),
1664
- (s(!0), y(A, null, u(L.value, (e, t) => (s(), y(A, { key: t }, [t ? (s(), y("optgroup", {
1665
- key: 0,
1666
- label: String(t)
1667
- }, [(s(!0), y(A, null, u(e, (e) => (s(), y("option", {
1668
- key: e.label,
1669
- value: e.label
1670
- }, C(e.label), 9, Yi))), 128))], 8, Ji)) : (s(!0), y(A, { key: 1 }, u(e, (e) => (s(), y("option", {
1671
- key: e.label,
1672
- value: e.label
1673
- }, C(e.label), 9, Xi))), 128))], 64))), 128)),
1674
- x(l) ? (s(), y("option", Zi, C(x(a).blockSettings.customCondition), 1)) : b("", !0)
1675
- ], 42, Ki), g.value || M.value ? (s(), y("div", Qi, [
1676
- E("div", null, [E("label", $i, C(x(a).blockSettings.customConditionBefore), 1), r(E("textarea", {
1677
- "onUpdate:modelValue": n[6] ||= (e) => _.value = e,
1678
- rows: "2",
1679
- class: O(x(Xt))
1680
- }, null, 2), [[ee, _.value]])]),
1681
- E("div", null, [E("label", ea, C(x(a).blockSettings.customConditionAfter), 1), r(E("textarea", {
1682
- "onUpdate:modelValue": n[7] ||= (e) => S.value = e,
1683
- rows: "2",
1684
- class: O(x(Xt))
1685
- }, null, 2), [[ee, S.value]])]),
1686
- E("div", ta, [E("button", {
1687
- type: "button",
1688
- class: "tpl:cursor-pointer tpl:rounded-md tpl:border-none tpl:bg-[var(--tpl-primary)] tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-bg)] tpl:transition-all tpl:duration-150 tpl:hover:opacity-90 tpl:disabled:opacity-50",
1689
- disabled: !_.value.trim(),
1690
- onClick: I
1691
- }, C(x(a).blockSettings.applyCondition), 9, na)])
1692
- ])) : e.block.displayCondition && !M.value ? (s(), y(A, { key: 1 }, [e.block.displayCondition.description ? (s(), y("p", ra, C(e.block.displayCondition.description), 1)) : b("", !0), E("div", ia, [E("pre", aa, C(e.block.displayCondition.before), 1), e.block.displayCondition.after ? (s(), y("pre", oa, C(e.block.displayCondition.after), 1)) : b("", !0)])], 64)) : b("", !0)])]),
1693
- _: 1
1694
- }, 8, ["title", "open"])) : b("", !0)
1695
- ], 2));
1696
- }
1697
- }), ca = ["title"], la = /* @__PURE__ */ M({
1698
- __name: "BooleanField",
1699
- props: {
1700
- field: {},
1701
- modelValue: { type: Boolean },
1702
- readOnly: { type: Boolean }
1703
- },
1704
- emits: ["update:modelValue"],
1705
- setup(e, { emit: t }) {
1706
- let n = t, { t: r } = W();
1707
- return (t, i) => (s(), y("div", {
1708
- class: "tpl:mb-3.5",
1709
- title: e.readOnly ? x(r).customBlocks.dataSource.readOnlyTooltip : void 0
1710
- }, [N(Z, {
1711
- class: "tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-text-muted)]",
1712
- "model-value": e.modelValue,
1713
- label: e.field.label,
1714
- required: e.field.required,
1715
- disabled: e.readOnly,
1716
- "onUpdate:modelValue": i[0] ||= (e) => n("update:modelValue", e)
1717
- }, {
1718
- default: f(() => [j(C(e.field.label) + " ", 1), e.readOnly ? (s(), w(x(Mt), {
1719
- key: 0,
1720
- size: 12,
1721
- class: "tpl:inline tpl:text-[var(--tpl-text-dim)]"
1722
- })) : b("", !0)]),
1723
- _: 1
1724
- }, 8, [
1725
- "model-value",
1726
- "label",
1727
- "required",
1728
- "disabled"
1729
- ])], 8, ca));
1730
- }
1731
- }), ua = { class: "tpl:mb-3.5" }, da = {
1732
- key: 1,
1733
- class: "tpl:text-[var(--tpl-danger)]"
1734
- }, fa = /* @__PURE__ */ M({
1735
- __name: "FieldWrapper",
1736
- props: {
1737
- label: {},
1738
- required: { type: Boolean },
1739
- readOnly: { type: Boolean }
1740
- },
1741
- setup(e) {
1742
- return (n, r) => (s(), y("div", ua, [E("label", { class: O(x(q)) }, [
1743
- j(C(e.label) + " ", 1),
1744
- e.readOnly ? (s(), w(x(Mt), {
1745
- key: 0,
1746
- size: 12,
1747
- class: "tpl:inline tpl:text-[var(--tpl-text-dim)]"
1748
- })) : b("", !0),
1749
- e.required ? (s(), y("span", da, "*")) : b("", !0)
1750
- ], 2), t(n.$slots, "default")]));
1751
- }
1752
- }), pa = /* @__PURE__ */ M({
1753
- __name: "ColorField",
1754
- props: {
1755
- field: {},
1756
- modelValue: {},
1757
- readOnly: { type: Boolean }
1758
- },
1759
- emits: ["update:modelValue"],
1760
- setup(e, { emit: t }) {
1761
- let n = e, r = t, { t: i } = W(), a = d(et, nt), o = v(() => ie(n.field, a));
1762
- return (t, n) => (s(), w(fa, {
1763
- label: e.field.label,
1764
- required: e.field.required,
1765
- "read-only": e.readOnly
1766
- }, {
1767
- default: f(() => [N(X, {
1768
- "model-value": e.modelValue,
1769
- placeholder: e.field.placeholder,
1770
- disabled: e.readOnly,
1771
- presets: o.value.presets,
1772
- "allow-custom": o.value.allowCustom,
1773
- title: e.readOnly ? x(i).customBlocks.dataSource.readOnlyTooltip : void 0,
1774
- "onUpdate:modelValue": n[0] ||= (e) => r("update:modelValue", e)
1775
- }, null, 8, [
1776
- "model-value",
1777
- "placeholder",
1778
- "disabled",
1779
- "presets",
1780
- "allow-custom",
1781
- "title"
1782
- ])]),
1783
- _: 1
1784
- }, 8, [
1785
- "label",
1786
- "required",
1787
- "read-only"
1788
- ]));
1789
- }
1790
- }), ma = {
1791
- key: 0,
1792
- class: "tpl:pointer-events-none tpl:absolute tpl:inset-0 tpl:z-10 tpl:flex tpl:flex-col tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded tpl:border-2 tpl:border-dashed tpl:text-xs tpl:font-medium tpl:border-[var(--tpl-primary)] tpl:text-[var(--tpl-primary)]",
1793
- style: { "background-color": "color-mix(in srgb, var(--tpl-bg) 90%, transparent)" }
1794
- }, ha = [
1795
- "value",
1796
- "placeholder",
1797
- "title"
1798
- ], ga = ["value", "placeholder"], _a = /* @__PURE__ */ M({
1799
- __name: "ImageField",
1800
- props: {
1801
- field: {},
1802
- modelValue: {},
1803
- readOnly: { type: Boolean }
1804
- },
1805
- emits: ["update:modelValue"],
1806
- setup(e, { emit: t }) {
1807
- let n = e, r = t, { t: i } = W(), a = d(Fe, null), o = Wt(), c = v(() => !!a);
1808
- async function l() {
1809
- let e = await a?.({ accept: ["images"] });
1810
- o.alive && e && r("update:modelValue", e.url);
1811
- }
1812
- let u = m(), p = m(!1), h = v(() => c.value && !p.value && !n.readOnly);
1813
- async function g(e) {
1814
- if (a) {
1815
- p.value = !0;
1816
- try {
1817
- let t = await a({
1818
- accept: ["images"],
1819
- files: e
1820
- });
1821
- if (!o.alive) return;
1822
- t && r("update:modelValue", t.url);
1823
- } finally {
1824
- o.alive && (p.value = !1);
1825
- }
1826
- }
1827
- }
1828
- let { isOver: _ } = me({
1829
- target: u,
1830
- enabled: h,
1831
- onFiles: g
1832
- });
1833
- return (t, n) => (s(), w(fa, {
1834
- label: e.field.label,
1835
- required: e.field.required,
1836
- "read-only": e.readOnly
1837
- }, {
1838
- default: f(() => [E("div", {
1839
- ref_key: "dropZoneRef",
1840
- ref: u,
1841
- class: "tpl:relative"
1842
- }, [
1843
- h.value && (x(_) || p.value) ? (s(), y("div", ma, [p.value ? (s(), y(A, { key: 0 }, [N(x(Dt), {
1844
- class: "tpl-spinner",
1845
- size: 18,
1846
- "stroke-width": 2
1847
- }), j(" " + C(x(i).image.uploading), 1)], 64)) : (s(), y(A, { key: 1 }, [N(x(It), {
1848
- size: 18,
1849
- "stroke-width": 1.5
1850
- }), j(" " + C(x(i).image.dropToUpload), 1)], 64))])) : b("", !0),
1851
- e.readOnly ? (s(), y("input", {
1852
- key: 1,
1853
- type: "url",
1854
- class: O([x(K), "tpl:opacity-60 tpl:cursor-not-allowed"]),
1855
- value: e.modelValue,
1856
- placeholder: e.field.placeholder || "https://...",
1857
- disabled: "",
1858
- title: x(i).customBlocks.dataSource.readOnlyTooltip
1859
- }, null, 10, ha)) : (s(), y("input", {
1860
- key: 2,
1861
- type: "url",
1862
- class: O(x(K)),
1863
- value: e.modelValue,
1864
- placeholder: e.field.placeholder || "https://...",
1865
- onInput: n[0] ||= (e) => r("update:modelValue", e.target.value)
1866
- }, null, 42, ga)),
1867
- c.value && !e.readOnly ? (s(), y("button", {
1868
- key: 3,
1869
- class: "tpl:mt-2 tpl:flex tpl:w-full tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded-md tpl:border tpl:px-3 tpl:py-2 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150 tpl:border-[var(--tpl-border)] tpl:text-[var(--tpl-primary)] tpl:bg-[var(--tpl-bg)]",
1870
- onClick: n[1] ||= (e) => l()
1871
- }, [N(x(Tt), {
1872
- size: 14,
1873
- "stroke-width": 1.5
1874
- }), j(" " + C(x(i).image.browseMedia), 1)])) : b("", !0)
1875
- ], 512)]),
1876
- _: 1
1877
- }, 8, [
1878
- "label",
1879
- "required",
1880
- "read-only"
1881
- ]));
1882
- }
1883
- }), va = [
1884
- "value",
1885
- "placeholder",
1886
- "min",
1887
- "max",
1888
- "step",
1889
- "disabled",
1890
- "title"
1891
- ], ya = /* @__PURE__ */ M({
1892
- __name: "NumberField",
1893
- props: {
1894
- field: {},
1895
- modelValue: {},
1896
- readOnly: { type: Boolean }
1897
- },
1898
- emits: ["update:modelValue"],
1899
- setup(e, { emit: t }) {
1900
- let n = t, { t: r } = W();
1901
- return (t, i) => (s(), w(fa, {
1902
- label: e.field.label,
1903
- required: e.field.required,
1904
- "read-only": e.readOnly
1905
- }, {
1906
- default: f(() => [E("input", {
1907
- type: "number",
1908
- class: O([x(K), e.readOnly && "tpl:opacity-60 tpl:cursor-not-allowed"]),
1909
- value: e.modelValue,
1910
- placeholder: e.field.placeholder,
1911
- min: e.field.min,
1912
- max: e.field.max,
1913
- step: e.field.step,
1914
- disabled: e.readOnly,
1915
- title: e.readOnly ? x(r).customBlocks.dataSource.readOnlyTooltip : void 0,
1916
- onInput: i[0] ||= (t) => !e.readOnly && n("update:modelValue", Number(t.target.value))
1917
- }, null, 42, va)]),
1918
- _: 1
1919
- }, 8, [
1920
- "label",
1921
- "required",
1922
- "read-only"
1923
- ]));
1924
- }
1925
- }), ba = { class: "tpl:flex tpl:flex-col tpl:gap-2" }, xa = { class: "tpl:mb-2 tpl:flex tpl:items-center tpl:justify-between" }, Sa = { class: "tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text-dim)]" }, Ca = ["title", "onClick"], wa = {
1926
- key: 1,
1927
- class: "tpl:m-0 tpl:text-center tpl:text-xs tpl:text-[var(--tpl-text-dim)]"
1928
- }, Ta = /* @__PURE__ */ M({
1929
- __name: "RepeatableField",
1930
- props: {
1931
- field: {},
1932
- modelValue: {},
1933
- readOnly: { type: Boolean }
1934
- },
1935
- emits: ["update:modelValue"],
1936
- setup(e, { emit: t }) {
1937
- let n = e, r = t, { t: i } = W(), a = v(() => n.modelValue || []), c = v(() => !n.field.maxItems || a.value.length < n.field.maxItems), l = v(() => !n.field.minItems || a.value.length > n.field.minItems);
1938
- function d() {
1939
- if (!c.value || n.readOnly) return;
1940
- let e = {};
1941
- for (let t of n.field.fields) e[t.key] = t.default ?? "";
1942
- r("update:modelValue", [...a.value, e]);
1943
- }
1944
- function p(e) {
1945
- if (!l.value || n.readOnly) return;
1946
- let t = [...a.value];
1947
- t.splice(e, 1), r("update:modelValue", t);
1948
- }
1949
- function m(e, t, n) {
1950
- let i = a.value.map((r, i) => i === e ? {
1951
- ...r,
1952
- [t]: n
1953
- } : r);
1954
- r("update:modelValue", i);
1955
- }
1956
- return (t, n) => (s(), w(fa, {
1957
- label: e.field.label,
1958
- required: e.field.required,
1959
- "read-only": e.readOnly
1960
- }, {
1961
- default: f(() => [E("div", ba, [
1962
- (s(!0), y(A, null, u(a.value, (t, n) => (s(), y("div", {
1963
- key: `${e.field.key}-${n}`,
1964
- class: "tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-hover)] tpl:p-3"
1965
- }, [E("div", xa, [E("span", Sa, " #" + C(n + 1), 1), l.value && !e.readOnly ? (s(), y("button", {
1966
- key: 0,
1967
- type: "button",
1968
- class: "tpl:flex tpl:size-6 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:text-[var(--tpl-text-muted)] tpl:transition-all tpl:duration-150 tpl:hover:border-[var(--tpl-danger)] tpl:hover:bg-[var(--tpl-danger-light)] tpl:hover:text-[var(--tpl-danger)]",
1969
- title: x(i).customBlocks.fields.removeItem,
1970
- onClick: (e) => p(n)
1971
- }, [N(x(St), {
1972
- size: 12,
1973
- "stroke-width": 2
1974
- })], 8, Ca)) : b("", !0)]), (s(!0), y(A, null, u(e.field.fields, (r) => (s(), w(o(x(Pa)(r.type)), {
1975
- key: r.key,
1976
- field: r,
1977
- "model-value": t[r.key],
1978
- "read-only": e.readOnly,
1979
- "onUpdate:modelValue": (e) => m(n, r.key, e)
1980
- }, null, 8, [
1981
- "field",
1982
- "model-value",
1983
- "read-only",
1984
- "onUpdate:modelValue"
1985
- ]))), 128))]))), 128)),
1986
- c.value && !e.readOnly ? (s(), y("button", {
1987
- key: 0,
1988
- type: "button",
1989
- class: O(x(Qt)),
1990
- onClick: d
1991
- }, [N(x(G), {
1992
- size: 14,
1993
- "stroke-width": 2
1994
- }), j(" " + C(x(i).customBlocks.fields.addItem), 1)], 2)) : b("", !0),
1995
- !c.value && !e.readOnly ? (s(), y("p", wa, C(x(i).customBlocks.fields.maxItemsReached), 1)) : b("", !0)
1996
- ])]),
1997
- _: 1
1998
- }, 8, [
1999
- "label",
2000
- "required",
2001
- "read-only"
2002
- ]));
2003
- }
2004
- }), Ea = [
2005
- "value",
2006
- "disabled",
2007
- "title"
2008
- ], Da = ["value"], Oa = /* @__PURE__ */ M({
2009
- __name: "SelectField",
2010
- props: {
2011
- field: {},
2012
- modelValue: {},
2013
- readOnly: { type: Boolean }
2014
- },
2015
- emits: ["update:modelValue"],
2016
- setup(e, { emit: t }) {
2017
- let n = t, { t: r } = W();
2018
- return (t, i) => (s(), w(fa, {
2019
- label: e.field.label,
2020
- required: e.field.required,
2021
- "read-only": e.readOnly
2022
- }, {
2023
- default: f(() => [E("select", {
2024
- class: O([x(K), e.readOnly && "tpl:opacity-60 tpl:cursor-not-allowed"]),
2025
- value: e.modelValue,
2026
- disabled: e.readOnly,
2027
- title: e.readOnly ? x(r).customBlocks.dataSource.readOnlyTooltip : void 0,
2028
- onChange: i[0] ||= (t) => !e.readOnly && n("update:modelValue", t.target.value)
2029
- }, [(s(!0), y(A, null, u(e.field.options, (e) => (s(), y("option", {
2030
- key: e.value,
2031
- value: e.value
2032
- }, C(e.label), 9, Da))), 128))], 42, Ea)]),
2033
- _: 1
2034
- }, 8, [
2035
- "label",
2036
- "required",
2037
- "read-only"
2038
- ]));
2039
- }
2040
- }), ka = [
2041
- "value",
2042
- "placeholder",
2043
- "title"
2044
- ], Aa = /* @__PURE__ */ M({
2045
- __name: "TextField",
2046
- props: {
2047
- field: {},
2048
- modelValue: {},
2049
- readOnly: { type: Boolean }
2050
- },
2051
- emits: ["update:modelValue"],
2052
- setup(e, { emit: t }) {
2053
- let n = t, { t: r } = W();
2054
- return (t, i) => (s(), w(fa, {
2055
- label: e.field.label,
2056
- required: e.field.required,
2057
- "read-only": e.readOnly
2058
- }, {
2059
- default: f(() => [e.readOnly ? (s(), y("input", {
2060
- key: 0,
2061
- type: "text",
2062
- class: O([x(K), "tpl:opacity-60 tpl:cursor-not-allowed"]),
2063
- value: e.modelValue,
2064
- placeholder: e.field.placeholder,
2065
- disabled: "",
2066
- title: x(r).customBlocks.dataSource.readOnlyTooltip
2067
- }, null, 10, ka)) : (s(), w($, {
2068
- key: 1,
2069
- "model-value": e.modelValue,
2070
- placeholder: e.field.placeholder,
2071
- "onUpdate:modelValue": i[0] ||= (e) => n("update:modelValue", e)
2072
- }, null, 8, ["model-value", "placeholder"]))]),
2073
- _: 1
2074
- }, 8, [
2075
- "label",
2076
- "required",
2077
- "read-only"
2078
- ]));
2079
- }
2080
- }), ja = [
2081
- "value",
2082
- "placeholder",
2083
- "title"
2084
- ], Ma = "tpl:w-full tpl:resize-y tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:px-3 tpl:py-2 tpl:text-sm tpl:text-[var(--tpl-text)] tpl:outline-none tpl:opacity-60 tpl:cursor-not-allowed", Na = {
2085
- text: Aa,
2086
- textarea: /* @__PURE__ */ M({
2087
- __name: "TextareaField",
2088
- props: {
2089
- field: {},
2090
- modelValue: {},
2091
- readOnly: { type: Boolean }
2092
- },
2093
- emits: ["update:modelValue"],
2094
- setup(e, { emit: t }) {
2095
- let n = t, { t: r } = W();
2096
- return (t, i) => (s(), w(fa, {
2097
- label: e.field.label,
2098
- required: e.field.required,
2099
- "read-only": e.readOnly
2100
- }, {
2101
- default: f(() => [e.readOnly ? (s(), y("textarea", {
2102
- key: 0,
2103
- value: e.modelValue,
2104
- placeholder: e.field.placeholder,
2105
- rows: "3",
2106
- disabled: "",
2107
- title: x(r).customBlocks.dataSource.readOnlyTooltip,
2108
- class: O(Ma)
2109
- }, null, 8, ja)) : (s(), w(cr, {
2110
- key: 1,
2111
- "model-value": e.modelValue,
2112
- placeholder: e.field.placeholder,
2113
- "onUpdate:modelValue": i[0] ||= (e) => n("update:modelValue", e)
2114
- }, null, 8, ["model-value", "placeholder"]))]),
2115
- _: 1
2116
- }, 8, [
2117
- "label",
2118
- "required",
2119
- "read-only"
2120
- ]));
2121
- }
2122
- }),
2123
- image: _a,
2124
- color: pa,
2125
- number: ya,
2126
- select: Oa,
2127
- boolean: la,
2128
- repeatable: Ta
2129
- };
2130
- function Pa(e) {
2131
- return Na[e] ?? Aa;
2132
- }
2133
- //#endregion
2134
- //#region src/components/toolbar/CustomBlockToolbar.vue?vue&type=script&setup=true&lang.ts
2135
- var Fa = {
2136
- key: 0,
2137
- class: "tpl:p-4"
2138
- }, Ia = { class: "tpl:m-0 tpl:text-center tpl:text-sm tpl:text-[var(--tpl-text-muted)]" }, La = { key: 1 }, Ra = {
2139
- key: 0,
2140
- class: "tpl:m-0 tpl:mb-3 tpl:text-xs tpl:text-[var(--tpl-text-dim)]"
2141
- }, za = {
2142
- key: 1,
2143
- class: "tpl:mb-4"
2144
- }, Ba = {
2145
- key: 1,
2146
- class: "tpl:flex tpl:h-[32px] tpl:items-center"
2147
- }, Va = {
2148
- key: 0,
2149
- class: "tpl:w-full tpl:text-center tpl:text-xs tpl:text-[var(--tpl-text-muted)]"
2150
- }, Ha = {
2151
- key: 2,
2152
- class: "tpl:m-0 tpl:mt-2 tpl:flex tpl:items-center tpl:gap-1.5 tpl:text-xs tpl:text-[var(--tpl-danger)]"
2153
- }, Ua = /* @__PURE__ */ M({
2154
- __name: "CustomBlockToolbar",
2155
- props: { block: {} },
2156
- emits: ["updateFieldValues", "updateDataSourceFetched"],
2157
- setup(e, { emit: t }) {
2158
- let n = e, r = t, { t: i } = W(), a = d(Ze, []), c = v(() => a.find((e) => e.type === n.block.customType)), l = v(() => n.block), { isFetching: f, fetchError: p, fetch: m, hasDataSource: h, needsFetch: g } = U({
2159
- definition: c,
2160
- block: l,
2161
- onUpdate: (e, t) => {
2162
- r("updateFieldValues", e), r("updateDataSourceFetched", t);
2163
- }
2164
- });
2165
- function _(e) {
2166
- return e.readOnly === !0 && h.value && !!n.block.dataSourceFetched;
2167
- }
2168
- function S(e, t) {
2169
- r("updateFieldValues", {
2170
- ...n.block.fieldValues,
2171
- [e]: t
2172
- });
2173
- }
2174
- return (t, n) => c.value ? (s(), y("div", La, [
2175
- c.value.description ? (s(), y("p", Ra, C(c.value.description), 1)) : b("", !0),
2176
- x(h) ? (s(), y("div", za, [x(g) && !x(f) ? (s(), y("button", {
2177
- key: 0,
2178
- type: "button",
2179
- class: "tpl:flex tpl:w-full tpl:items-center tpl:justify-center tpl:gap-2 tpl:rounded-md tpl:px-3 tpl:py-2.5 tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-bg)] tpl:transition-all tpl:duration-150 tpl:bg-[var(--tpl-primary)]",
2180
- onClick: n[0] ||= (...e) => x(m) && x(m)(...e)
2181
- }, C(c.value?.dataSource?.label || x(i).customBlocks.dataSource.fetchButton), 1)) : (s(), y("div", Ba, [x(f) ? (s(), y("div", Va, C(x(i).customBlocks.dataSource.fetching), 1)) : (s(), y("button", {
2182
- key: 1,
2183
- type: "button",
2184
- class: "tpl:flex tpl:w-full tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text-muted)] tpl:transition-all tpl:duration-150 tpl:hover:border-[var(--tpl-primary)] tpl:hover:text-[var(--tpl-primary)]",
2185
- onClick: n[1] ||= (...e) => x(m) && x(m)(...e)
2186
- }, [N(x(Bt), { size: 12 }), j(" " + C(x(i).customBlocks.dataSource.changeButton), 1)]))])), x(p) ? (s(), y("p", Ha, [N(x(ut), {
2187
- size: 14,
2188
- class: "tpl:shrink-0"
2189
- }), j(" " + C(x(i).customBlocks.dataSource.fetchError), 1)])) : b("", !0)])) : b("", !0),
2190
- (s(!0), y(A, null, u(c.value.fields, (t) => (s(), w(o(x(Pa)(t.type)), {
2191
- key: t.key,
2192
- field: t,
2193
- "model-value": e.block.fieldValues[t.key],
2194
- "read-only": _(t),
2195
- "onUpdate:modelValue": (e) => S(t.key, e)
2196
- }, null, 8, [
2197
- "field",
2198
- "model-value",
2199
- "read-only",
2200
- "onUpdate:modelValue"
2201
- ]))), 128))
2202
- ])) : (s(), y("div", Fa, [E("p", Ia, C(x(i).customBlocks.toolbar.noDefinition), 1)]));
2203
- }
2204
- }), Wa = { class: "tpl:mb-3.5" }, Ga = { class: "tpl:mb-3.5" }, Ka = { class: "tpl:mb-3.5" }, qa = { class: "tpl:flex tpl:items-stretch" }, Ja = ["value"], Ya = /* @__PURE__ */ M({
2205
- __name: "DividerToolbar",
2206
- props: { block: {} },
2207
- emits: ["update"],
2208
- setup(e, { emit: t }) {
2209
- let n = t, { t: r } = W();
2210
- function i(e, t) {
2211
- n("update", { [e]: t });
2212
- }
2213
- return (t, n) => (s(), y(A, null, [
2214
- E("div", Wa, [E("label", { class: O(x(q)) }, C(x(r).divider.style), 3), N(rn, {
2215
- options: [
2216
- {
2217
- value: "solid",
2218
- label: x(r).divider.solid
2219
- },
2220
- {
2221
- value: "dashed",
2222
- label: x(r).divider.dashed
2223
- },
2224
- {
2225
- value: "dotted",
2226
- label: x(r).divider.dotted
2227
- }
2228
- ],
2229
- "model-value": e.block.lineStyle,
2230
- "onUpdate:modelValue": n[0] ||= (e) => i("lineStyle", e)
2231
- }, null, 8, ["options", "model-value"])]),
2232
- E("div", Ga, [E("label", { class: O(x(q)) }, C(x(r).divider.color), 3), N(X, {
2233
- "model-value": e.block.color,
2234
- "onUpdate:modelValue": n[1] ||= (e) => i("color", e)
2235
- }, null, 8, ["model-value"])]),
2236
- E("div", Ka, [E("label", { class: O(x(q)) }, C(x(r).divider.thickness), 3), E("div", qa, [E("input", {
2237
- type: "number",
2238
- class: O(x(Y)),
2239
- value: e.block.thickness,
2240
- min: "1",
2241
- max: "10",
2242
- onInput: n[2] ||= (e) => i("thickness", Number(e.target.value))
2243
- }, null, 42, Ja), E("span", { class: O(x(J)) }, "px", 2)])])
2244
- ], 64));
2245
- }
2246
- }), Xa = { class: "tpl:mb-3.5" }, Za = ["value"], Qa = { class: "tpl:mt-1.5 tpl:flex tpl:items-start tpl:gap-1.5 tpl:text-[11px] tpl:text-[var(--tpl-text-dim)]" }, $a = /* @__PURE__ */ M({
2247
- __name: "HtmlToolbar",
2248
- props: { block: {} },
2249
- emits: ["update"],
2250
- setup(e, { emit: t }) {
2251
- let n = t, { t: r } = W();
2252
- return (t, i) => (s(), y("div", Xa, [
2253
- E("label", { class: O(x(q)) }, C(x(r).html.content), 3),
2254
- E("textarea", {
2255
- value: e.block.content,
2256
- placeholder: "<div>...</div>",
2257
- rows: "10",
2258
- class: O(x(Xt)),
2259
- onInput: i[0] ||= (e) => n("update", { content: e.target.value })
2260
- }, null, 42, Za),
2261
- E("p", Qa, [N(x(Ct), {
2262
- size: 12,
2263
- class: "tpl:mt-0.5 tpl:shrink-0"
2264
- }), j(" " + C(x(r).html.sanitizationHint), 1)])
2265
- ]));
2266
- }
2267
- }), eo = { class: "tpl:mb-3.5" }, to = {
2268
- key: 0,
2269
- class: "tpl:pointer-events-none tpl:absolute tpl:inset-0 tpl:z-10 tpl:flex tpl:flex-col tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded tpl:border-2 tpl:border-dashed tpl:text-xs tpl:font-medium tpl:border-[var(--tpl-primary)] tpl:text-[var(--tpl-primary)]",
2270
- style: { "background-color": "color-mix(in srgb, var(--tpl-bg) 90%, transparent)" }
2271
- }, no = {
2272
- key: 0,
2273
- class: "tpl:mb-3.5"
2274
- }, ro = ["value", "placeholder"], io = { class: "tpl:mb-3.5" }, ao = { class: "tpl:block tpl:text-[var(--tpl-text-dim)]" }, oo = { class: "tpl:mb-3.5" }, so = ["value"], co = { value: "full" }, lo = { value: "custom" }, uo = {
2275
- key: 0,
2276
- class: "tpl:mt-2 tpl:flex tpl:items-stretch"
2277
- }, fo = ["value"], po = { class: "tpl:mb-3.5" }, mo = { class: "tpl:mb-3.5" }, ho = 350, go = /* @__PURE__ */ M({
2278
- __name: "ImageToolbar",
2279
- props: { block: {} },
2280
- emits: ["update"],
2281
- setup(e, { emit: t }) {
2282
- let n = e, r = t, { t: i } = W(), a = d(Fe, null), o = d(Ae, ne.liquid), c = Wt(), l = v(() => !!a), u = m(!1), p = m(!1), { start: h } = Oe(() => {
2283
- u.value = !1;
2284
- }, 1e3, { immediate: !1 }), g = [
2285
- 300,
2286
- 400,
2287
- 500
2288
- ], _ = v(() => {
2289
- let e = n.block.width;
2290
- return e === "full" ? "full" : g.includes(e) ? String(e) : "custom";
2291
- });
2292
- function S(e, t) {
2293
- r("update", { [e]: t });
2294
- }
2295
- function T(e) {
2296
- if (e === "custom") {
2297
- let e = n.block.width;
2298
- (typeof e != "number" || g.includes(e)) && S("width", ho);
2299
- return;
2300
- }
2301
- S("width", e === "full" ? "full" : Number(e));
2302
- }
2303
- function ee(e) {
2304
- let t = Number(e);
2305
- !Number.isFinite(t) || t <= 0 || S("width", t);
2306
- }
2307
- async function D() {
2308
- let e = await a?.({ accept: ["images"] });
2309
- c.alive && e && (S("src", e.url), e.alt && (S("alt", e.alt), p.value = !0), u.value = !0, h());
2310
- }
2311
- let k = m(), M = m(!1), P = v(() => H(n.block.src, o)), F = v(() => l.value && !M.value && !P.value);
2312
- async function I(e) {
2313
- if (a) {
2314
- M.value = !0;
2315
- try {
2316
- let t = await a({
2317
- accept: ["images"],
2318
- files: e
2319
- });
2320
- if (!c.alive) return;
2321
- t && (S("src", t.url), t.alt && (S("alt", t.alt), p.value = !0), u.value = !0, h());
2322
- } finally {
2323
- c.alive && (M.value = !1);
2324
- }
2325
- }
2326
- }
2327
- let { isOver: L } = me({
2328
- target: k,
2329
- enabled: F,
2330
- onFiles: I
2331
- });
2332
- return (t, n) => (s(), y(A, null, [
2333
- E("div", eo, [E("label", { class: O(x(q)) }, C(x(i).image.imageUrl), 3), E("div", {
2334
- ref_key: "dropZoneRef",
2335
- ref: k,
2336
- class: "tpl:relative"
2337
- }, [
2338
- F.value && (x(L) || M.value) ? (s(), y("div", to, [M.value ? (s(), y(A, { key: 0 }, [N(x(Dt), {
2339
- class: "tpl-spinner",
2340
- size: 18,
2341
- "stroke-width": 2
2342
- }), j(" " + C(x(i).image.uploading), 1)], 64)) : (s(), y(A, { key: 1 }, [N(x(It), {
2343
- size: 18,
2344
- "stroke-width": 1.5
2345
- }), j(" " + C(x(i).image.dropToUpload), 1)], 64))])) : b("", !0),
2346
- N($, {
2347
- "model-value": e.block.src,
2348
- type: "url",
2349
- placeholder: x(i).image.imageUrlPlaceholder,
2350
- pulse: u.value,
2351
- "onUpdate:modelValue": n[0] ||= (e) => S("src", e)
2352
- }, null, 8, [
2353
- "model-value",
2354
- "placeholder",
2355
- "pulse"
2356
- ]),
2357
- l.value ? (s(), y("button", {
2358
- key: 1,
2359
- class: "tpl:mt-2 tpl:flex tpl:w-full tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded-md tpl:border tpl:px-3 tpl:py-2 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
2360
- style: {
2361
- "border-color": "var(--tpl-border)",
2362
- color: "var(--tpl-primary)",
2363
- "background-color": "var(--tpl-bg)"
2364
- },
2365
- onClick: D
2366
- }, [N(x(Tt), {
2367
- size: 14,
2368
- "stroke-width": 1.5
2369
- }), j(" " + C(x(i).image.browseMedia), 1)])) : b("", !0)
2370
- ], 512)]),
2371
- x(H)(e.block.src, x(o)) ? (s(), y("div", no, [E("label", { class: O(x(q)) }, [j(C(x(i).image.placeholderUrl) + " ", 1), n[9] ||= E("span", { class: "tpl:font-normal tpl:text-[var(--tpl-text-dim)]" }, C("(optional)"), -1)], 2), E("input", {
2372
- type: "url",
2373
- class: O(x(K)),
2374
- value: e.block.placeholderUrl || "",
2375
- placeholder: x(i).image.placeholderUrlPlaceholder,
2376
- onInput: n[1] ||= (e) => S("placeholderUrl", e.target.value)
2377
- }, null, 42, ro)])) : b("", !0),
2378
- E("div", io, [
2379
- E("label", { class: O(x(q)) }, C(x(i).image.altText), 3),
2380
- N($, {
2381
- "model-value": e.block.alt,
2382
- type: "text",
2383
- placeholder: x(i).image.altTextPlaceholder,
2384
- pulse: p.value,
2385
- disabled: e.block.decorative === !0,
2386
- "onUpdate:modelValue": n[2] ||= (e) => S("alt", e)
2387
- }, null, 8, [
2388
- "model-value",
2389
- "placeholder",
2390
- "pulse",
2391
- "disabled"
2392
- ]),
2393
- N(Z, {
2394
- class: "tpl:mt-2 tpl:text-[12px] tpl:text-[var(--tpl-text-muted)]",
2395
- "model-value": e.block.decorative === !0,
2396
- label: x(i).image.decorative,
2397
- "onUpdate:modelValue": n[3] ||= (e) => S("decorative", e)
2398
- }, {
2399
- default: f(() => [E("span", null, [j(C(x(i).image.decorative) + " ", 1), E("span", ao, C(x(i).image.decorativeHint), 1)])]),
2400
- _: 1
2401
- }, 8, ["model-value", "label"])
2402
- ]),
2403
- E("div", oo, [
2404
- E("label", { class: O(x(q)) }, C(x(i).image.width), 3),
2405
- E("select", {
2406
- class: O(x(K)),
2407
- value: _.value,
2408
- onChange: n[4] ||= (e) => T(e.target.value)
2409
- }, [
2410
- E("option", co, C(x(i).image.fullWidth), 1),
2411
- n[10] ||= E("option", { value: "300" }, "300px", -1),
2412
- n[11] ||= E("option", { value: "400" }, "400px", -1),
2413
- n[12] ||= E("option", { value: "500" }, "500px", -1),
2414
- E("option", lo, C(x(i).image.widthCustom), 1)
2415
- ], 42, so),
2416
- _.value === "custom" ? (s(), y("div", uo, [E("input", {
2417
- type: "number",
2418
- class: O(x(Y)),
2419
- value: typeof e.block.width == "number" ? e.block.width : ho,
2420
- min: "20",
2421
- onInput: n[5] ||= (e) => ee(e.target.value)
2422
- }, null, 42, fo), E("span", { class: O(x(J)) }, "px", 2)])) : b("", !0)
2423
- ]),
2424
- E("div", po, [E("label", { class: O(x(q)) }, C(x(i).title.align), 3), N(rn, {
2425
- options: [
2426
- {
2427
- value: "left",
2428
- label: x(i).title.alignLeft
2429
- },
2430
- {
2431
- value: "center",
2432
- label: x(i).title.alignCenter
2433
- },
2434
- {
2435
- value: "right",
2436
- label: x(i).title.alignRight
2437
- }
2438
- ],
2439
- "model-value": e.block.align,
2440
- "onUpdate:modelValue": n[6] ||= (e) => S("align", e)
2441
- }, null, 8, ["options", "model-value"])]),
2442
- E("div", mo, [
2443
- E("label", { class: O(x(q)) }, C(x(i).image.linkUrl), 3),
2444
- N($, {
2445
- "model-value": e.block.linkUrl || "",
2446
- type: "url",
2447
- placeholder: x(i).image.imageUrlPlaceholder,
2448
- "onUpdate:modelValue": n[7] ||= (e) => S("linkUrl", e)
2449
- }, null, 8, ["model-value", "placeholder"]),
2450
- e.block.linkUrl ? (s(), w(Z, {
2451
- key: 0,
2452
- class: "tpl:mt-2 tpl:text-[12px] tpl:text-[var(--tpl-text-muted)]",
2453
- "model-value": e.block.linkOpenInNewTab ?? !1,
2454
- label: x(i).image.openInNewTab,
2455
- "onUpdate:modelValue": n[8] ||= (e) => S("linkOpenInNewTab", e)
2456
- }, null, 8, ["model-value", "label"])) : b("", !0)
2457
- ])
2458
- ], 64));
2459
- }
2460
- }), _o = { class: "tpl:flex tpl:flex-col tpl:gap-2" }, vo = { class: "tpl:flex tpl:items-center tpl:gap-2" }, yo = [
2461
- "value",
2462
- "placeholder",
2463
- "onInput"
2464
- ], bo = ["title", "onClick"], xo = { class: "tpl:flex tpl:flex-wrap tpl:items-center tpl:gap-x-3 tpl:gap-y-1.5 tpl:text-xs tpl:text-[var(--tpl-text-muted)]" }, So = { class: "tpl:flex tpl:items-center tpl:gap-2" }, Co = ["value"], wo = { value: "" }, To = ["value"], Eo = ["value"], Do = /* @__PURE__ */ M({
2465
- __name: "MenuToolbar",
2466
- props: {
2467
- block: {},
2468
- fontFamilies: {}
2469
- },
2470
- emits: ["update"],
2471
- setup(e, { emit: t }) {
2472
- let n = e, r = t, { t: i } = W(), a = v(() => [
2473
- {
2474
- key: "openInNewTab",
2475
- label: i.menu.openInNewTab
2476
- },
2477
- {
2478
- key: "bold",
2479
- label: i.menu.bold
2480
- },
2481
- {
2482
- key: "underline",
2483
- label: i.menu.underline
2484
- }
2485
- ]), o = v(() => [
2486
- {
2487
- value: "left",
2488
- label: i.title.alignLeft,
2489
- icon: At
2490
- },
2491
- {
2492
- value: "center",
2493
- label: i.title.alignCenter,
2494
- icon: yt
2495
- },
2496
- {
2497
- value: "right",
2498
- label: i.title.alignRight,
2499
- icon: Et
2500
- }
2501
- ]);
2502
- function c(e, t) {
2503
- r("update", { [e]: t });
2504
- }
2505
- function l() {
2506
- let e = {
2507
- id: I(),
2508
- text: "",
2509
- url: "",
2510
- openInNewTab: !1,
2511
- bold: !1,
2512
- underline: !1
2513
- };
2514
- r("update", { items: [...n.block.items, e] });
2515
- }
2516
- function d(e, t, i) {
2517
- let a = n.block.items.map((n) => n.id === e ? {
2518
- ...n,
2519
- [t]: i
2520
- } : n);
2521
- r("update", { items: a });
2522
- }
2523
- function p(e) {
2524
- r("update", { items: n.block.items.filter((t) => t.id !== e) });
2525
- }
2526
- return (t, n) => (s(), y(A, null, [
2527
- N(Q, { label: x(i).menu.items }, {
2528
- default: f(() => [E("div", _o, [(s(!0), y(A, null, u(e.block.items, (t) => (s(), y("div", {
2529
- key: t.id,
2530
- class: "tpl:flex tpl:flex-col tpl:gap-1.5 tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-hover)] tpl:p-2"
2531
- }, [
2532
- E("div", vo, [E("input", {
2533
- type: "text",
2534
- class: O([x(K), "tpl:flex-1"]),
2535
- value: t.text,
2536
- placeholder: x(i).menu.text,
2537
- onInput: (e) => d(t.id, "text", e.target.value)
2538
- }, null, 42, yo), E("button", {
2539
- class: O(x(Yt)),
2540
- title: x(i).menu.removeItem,
2541
- onClick: (e) => p(t.id)
2542
- }, [N(x(jt), {
2543
- size: 14,
2544
- "stroke-width": 2
2545
- })], 10, bo)]),
2546
- N($, {
2547
- "model-value": t.url,
2548
- type: "url",
2549
- placeholder: x(i).menu.urlPlaceholder,
2550
- "onUpdate:modelValue": (e) => d(t.id, "url", e)
2551
- }, null, 8, [
2552
- "model-value",
2553
- "placeholder",
2554
- "onUpdate:modelValue"
2555
- ]),
2556
- E("div", xo, [(s(!0), y(A, null, u(a.value, (e) => (s(), w(Z, {
2557
- key: e.key,
2558
- "model-value": t[e.key],
2559
- label: e.label,
2560
- "onUpdate:modelValue": (n) => d(t.id, e.key, n)
2561
- }, null, 8, [
2562
- "model-value",
2563
- "label",
2564
- "onUpdate:modelValue"
2565
- ]))), 128))]),
2566
- E("div", So, [E("label", { class: O([x(q), "tpl:!mb-0"]) }, C(x(i).menu.color), 3), N(X, {
2567
- "swatch-only": "",
2568
- "model-value": t.color || e.block.linkColor || e.block.color || "",
2569
- "onUpdate:modelValue": (e) => d(t.id, "color", e)
2570
- }, null, 8, ["model-value", "onUpdate:modelValue"])])
2571
- ]))), 128)), E("button", {
2572
- class: O(x(Qt)),
2573
- onClick: l
2574
- }, [N(x(G), {
2575
- size: 14,
2576
- "stroke-width": 2
2577
- }), j(" " + C(x(i).menu.addItem), 1)], 2)])]),
2578
- _: 1
2579
- }, 8, ["label"]),
2580
- N(Q, { label: x(i).menu.fontFamily }, {
2581
- default: f(() => [E("select", {
2582
- class: O(x(K)),
2583
- value: e.block.fontFamily || "",
2584
- onChange: n[0] ||= (e) => c("fontFamily", e.target.value || void 0)
2585
- }, [E("option", wo, C(x(i).title.inheritFont), 1), (s(!0), y(A, null, u(e.fontFamilies, (e) => (s(), y("option", {
2586
- key: e.value,
2587
- value: e.value
2588
- }, C(e.label), 9, To))), 128))], 42, Co)]),
2589
- _: 1
2590
- }, 8, ["label"]),
2591
- N(Q, { label: x(i).menu.fontSize }, {
2592
- default: f(() => [N(an, {
2593
- "model-value": e.block.fontSize,
2594
- min: 8,
2595
- max: 48,
2596
- suffix: "px",
2597
- "onUpdate:modelValue": n[1] ||= (e) => c("fontSize", e)
2598
- }, null, 8, ["model-value"])]),
2599
- _: 1
2600
- }, 8, ["label"]),
2601
- N(Q, { label: x(i).menu.color }, {
2602
- default: f(() => [N(X, {
2603
- "model-value": e.block.color ?? "",
2604
- "onUpdate:modelValue": n[2] ||= (e) => c("color", e || void 0)
2605
- }, null, 8, ["model-value"])]),
2606
- _: 1
2607
- }, 8, ["label"]),
2608
- N(Q, { label: x(i).menu.linkColor }, {
2609
- default: f(() => [N(X, {
2610
- "model-value": e.block.linkColor || e.block.color || "",
2611
- "onUpdate:modelValue": n[3] ||= (e) => c("linkColor", e || void 0)
2612
- }, null, 8, ["model-value"])]),
2613
- _: 1
2614
- }, 8, ["label"]),
2615
- N(Q, { label: x(i).menu.textAlign }, {
2616
- default: f(() => [N(rn, {
2617
- options: o.value,
2618
- "model-value": e.block.textAlign,
2619
- "onUpdate:modelValue": n[4] ||= (e) => c("textAlign", e)
2620
- }, null, 8, ["options", "model-value"])]),
2621
- _: 1
2622
- }, 8, ["label"]),
2623
- N(Q, { label: x(i).menu.separator }, {
2624
- default: f(() => [E("input", {
2625
- type: "text",
2626
- class: O(x(K)),
2627
- value: e.block.separator,
2628
- onInput: n[5] ||= (e) => c("separator", e.target.value)
2629
- }, null, 42, Eo)]),
2630
- _: 1
2631
- }, 8, ["label"]),
2632
- N(Q, { label: x(i).menu.separatorColor }, {
2633
- default: f(() => [N(X, {
2634
- "model-value": e.block.separatorColor,
2635
- "onUpdate:modelValue": n[6] ||= (e) => c("separatorColor", e)
2636
- }, null, 8, ["model-value"])]),
2637
- _: 1
2638
- }, 8, ["label"]),
2639
- N(Q, { label: x(i).menu.spacing }, {
2640
- default: f(() => [N(an, {
2641
- "model-value": e.block.spacing,
2642
- min: 0,
2643
- max: 50,
2644
- suffix: "px",
2645
- "onUpdate:modelValue": n[7] ||= (e) => c("spacing", e)
2646
- }, null, 8, ["model-value"])]),
2647
- _: 1
2648
- }, 8, ["label"])
2649
- ], 64));
2650
- }
2651
- });
2652
- //#endregion
2653
- //#region src/utils/rebalanceColumnChildren.ts
2654
- function Oo(e) {
2655
- return e === "1" ? 1 : e === "3" ? 3 : 2;
2656
- }
2657
- function ko(e, t) {
2658
- let n = Oo(t);
2659
- if (e.length === n) return e;
2660
- if (e.length < n) {
2661
- let t = Array.from({ length: n - e.length }, () => []);
2662
- return [...e, ...t];
2663
- }
2664
- let r = e.slice(0, n), i = e.slice(n).flat(), a = [...r[n - 1], ...i];
2665
- return [...r.slice(0, n - 1), a];
2666
- }
2667
- //#endregion
2668
- //#region src/components/toolbar/SectionToolbar.vue?vue&type=script&setup=true&lang.ts
2669
- var Ao = { class: "tpl:mb-3.5" }, jo = ["value"], Mo = ["value"], No = {
2670
- key: 0,
2671
- class: "tpl:mb-3.5"
2672
- }, Po = { class: "tpl:mb-3.5" }, Fo = { class: "tpl:flex tpl:items-stretch" }, Io = ["value"], Lo = { class: "tpl:mb-3.5" }, Ro = {
2673
- key: 0,
2674
- class: "tpl:mt-3 tpl:ml-0.5 tpl:space-y-3 tpl:border-l tpl:border-[var(--tpl-border)] tpl:pl-3"
2675
- }, zo = { class: "tpl:flex tpl:items-stretch" }, Bo = ["value"], Vo = /* @__PURE__ */ M({
2676
- __name: "SectionToolbar",
2677
- props: { block: {} },
2678
- emits: ["update"],
2679
- setup(e, { emit: t }) {
2680
- let n = e, r = t, { t: i } = W(), a = v(() => [
2681
- {
2682
- value: "1",
2683
- label: i.section.column1
2684
- },
2685
- {
2686
- value: "2",
2687
- label: i.section.column2
2688
- },
2689
- {
2690
- value: "3",
2691
- label: i.section.column3
2692
- },
2693
- {
2694
- value: "1-2",
2695
- label: i.section.ratio12
2696
- },
2697
- {
2698
- value: "2-1",
2699
- label: i.section.ratio21
2700
- }
2701
- ]);
2702
- function o(e) {
2703
- let t = e.target.value, i = ko(n.block.children, t);
2704
- r("update", {
2705
- columns: t,
2706
- children: i
2707
- });
2708
- }
2709
- function c(e) {
2710
- r("update", { stackOnMobile: e });
2711
- }
2712
- function l(e) {
2713
- let t = Number(e.target.value);
2714
- r("update", { borderRadius: t });
2715
- }
2716
- function d(e) {
2717
- r("update", { wrapper: e ? { padding: {
2718
- top: 20,
2719
- right: 20,
2720
- bottom: 20,
2721
- left: 20
2722
- } } : void 0 });
2723
- }
2724
- function f(e) {
2725
- r("update", { wrapper: {
2726
- ...n.block.wrapper,
2727
- ...e
2728
- } });
2729
- }
2730
- function p(e) {
2731
- f({ padding: e });
2732
- }
2733
- function m(e) {
2734
- f({ borderRadius: Number(e.target.value) });
2735
- }
2736
- return (t, n) => (s(), y(A, null, [
2737
- E("div", Ao, [E("label", { class: O(x(q)) }, C(x(i).section.columns), 3), E("select", {
2738
- class: O(x(K)),
2739
- value: e.block.columns,
2740
- onChange: o
2741
- }, [(s(!0), y(A, null, u(a.value, (e) => (s(), y("option", {
2742
- key: e.value,
2743
- value: e.value
2744
- }, C(e.label), 9, Mo))), 128))], 42, jo)]),
2745
- e.block.columns === "1" ? b("", !0) : (s(), y("div", No, [N(Z, {
2746
- class: "tpl:text-xs tpl:text-[var(--tpl-text)]",
2747
- "model-value": e.block.stackOnMobile !== !1,
2748
- label: x(i).section.stackOnMobile,
2749
- "onUpdate:modelValue": n[0] ||= (e) => c(e)
2750
- }, null, 8, ["model-value", "label"])])),
2751
- E("div", Po, [E("label", { class: O(x(q)) }, C(x(i).section.borderRadius), 3), E("div", Fo, [E("input", {
2752
- type: "number",
2753
- class: O(x(Y)),
2754
- value: e.block.borderRadius ?? 0,
2755
- min: "0",
2756
- max: "50",
2757
- onInput: l
2758
- }, null, 42, Io), E("span", { class: O(x(J)) }, "px", 2)])]),
2759
- E("div", Lo, [N(Z, {
2760
- class: "tpl:text-xs tpl:text-[var(--tpl-text)]",
2761
- "model-value": !!e.block.wrapper,
2762
- label: x(i).section.wrapperEnable,
2763
- "onUpdate:modelValue": n[1] ||= (e) => d(e)
2764
- }, null, 8, ["model-value", "label"]), e.block.wrapper ? (s(), y("div", Ro, [
2765
- E("div", null, [E("label", { class: O(x(q)) }, C(x(i).blockSettings.color), 3), N(X, {
2766
- "model-value": e.block.wrapper.backgroundColor ?? "",
2767
- "onUpdate:modelValue": n[2] ||= (e) => f({ backgroundColor: e })
2768
- }, null, 8, ["model-value"])]),
2769
- N(zi, {
2770
- label: x(i).blockSettings.padding,
2771
- "model-value": e.block.wrapper.padding ?? {
2772
- top: 0,
2773
- right: 0,
2774
- bottom: 0,
2775
- left: 0
2776
- },
2777
- "onUpdate:modelValue": p
2778
- }, null, 8, ["label", "model-value"]),
2779
- E("div", null, [E("label", { class: O(x(q)) }, C(x(i).section.borderRadius), 3), E("div", zo, [E("input", {
2780
- type: "number",
2781
- class: O(x(Y)),
2782
- value: e.block.wrapper.borderRadius ?? 0,
2783
- min: "0",
2784
- max: "50",
2785
- onInput: m
2786
- }, null, 42, Bo), E("span", { class: O(x(J)) }, "px", 2)])])
2787
- ])) : b("", !0)])
2788
- ], 64));
2789
- }
2790
- }), Ho = { class: "tpl:mb-3.5" }, Uo = { class: "tpl:flex tpl:flex-col tpl:gap-2" }, Wo = { class: "tpl:flex tpl:items-center tpl:gap-2" }, Go = ["value", "onChange"], Ko = ["value"], qo = ["title", "onClick"], Jo = { class: "tpl:mb-3.5" }, Yo = ["value"], Xo = { value: "solid" }, Zo = { value: "outlined" }, Qo = { value: "rounded" }, $o = { value: "square" }, es = { value: "circle" }, ts = { class: "tpl:mb-3.5" }, ns = { class: "tpl:mb-3.5" }, rs = { class: "tpl:flex tpl:items-stretch" }, is = ["value"], as = { class: "tpl:mb-3.5" }, os = /* @__PURE__ */ M({
2791
- __name: "SocialToolbar",
2792
- props: { block: {} },
2793
- emits: ["update"],
2794
- setup(e, { emit: t }) {
2795
- let n = e, r = t, { t: i } = W();
2796
- function a(e, t) {
2797
- r("update", { [e]: t });
2798
- }
2799
- function o() {
2800
- let e = {
2801
- id: I(),
2802
- platform: "facebook",
2803
- url: ""
2804
- };
2805
- r("update", { icons: [...n.block.icons, e] });
2806
- }
2807
- function c(e, t, i) {
2808
- let a = n.block.icons.map((n) => n.id === e ? {
2809
- ...n,
2810
- [t]: i
2811
- } : n);
2812
- r("update", { icons: a });
2813
- }
2814
- function l(e) {
2815
- r("update", { icons: n.block.icons.filter((t) => t.id !== e) });
2816
- }
2817
- return (t, n) => (s(), y(A, null, [
2818
- E("div", Ho, [E("label", { class: O(x(q)) }, C(x(i).social.icons), 3), E("div", Uo, [(s(!0), y(A, null, u(e.block.icons, (e) => (s(), y("div", {
2819
- key: e.id,
2820
- class: "tpl:flex tpl:flex-col tpl:gap-1.5 tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-hover)] tpl:p-2"
2821
- }, [E("div", Wo, [E("select", {
2822
- "data-testid": "social-platform-select",
2823
- class: O([x(K), "tpl:flex-1"]),
2824
- value: e.platform,
2825
- onChange: (t) => c(e.id, "platform", t.target.value)
2826
- }, [(s(!0), y(A, null, u(x(Se), (e) => (s(), y("option", {
2827
- key: e,
2828
- value: e
2829
- }, C(x(i).social.platforms[e]), 9, Ko))), 128))], 42, Go), E("button", {
2830
- class: O(x(Yt)),
2831
- title: x(i).social.removeIcon,
2832
- onClick: (t) => l(e.id)
2833
- }, [N(x(jt), {
2834
- size: 14,
2835
- "stroke-width": 2
2836
- })], 10, qo)]), N($, {
2837
- "model-value": e.url,
2838
- type: "url",
2839
- placeholder: x(i).social.urlPlaceholder,
2840
- "onUpdate:modelValue": (t) => c(e.id, "url", t)
2841
- }, null, 8, [
2842
- "model-value",
2843
- "placeholder",
2844
- "onUpdate:modelValue"
2845
- ])]))), 128)), E("button", {
2846
- class: O(x(Qt)),
2847
- onClick: o
2848
- }, [N(x(G), {
2849
- size: 14,
2850
- "stroke-width": 2
2851
- }), j(" " + C(x(i).social.addIcon), 1)], 2)])]),
2852
- E("div", Jo, [E("label", { class: O(x(q)) }, C(x(i).social.style), 3), E("select", {
2853
- class: O(x(K)),
2854
- value: e.block.iconStyle,
2855
- onChange: n[0] ||= (e) => a("iconStyle", e.target.value)
2856
- }, [
2857
- E("option", Xo, C(x(i).social.styleSolid), 1),
2858
- E("option", Zo, C(x(i).social.styleOutlined), 1),
2859
- E("option", Qo, C(x(i).social.styleRounded), 1),
2860
- E("option", $o, C(x(i).social.styleSquare), 1),
2861
- E("option", es, C(x(i).social.styleCircle), 1)
2862
- ], 42, Yo)]),
2863
- E("div", ts, [E("label", { class: O(x(q)) }, C(x(i).social.size), 3), N(rn, {
2864
- options: [
2865
- {
2866
- value: "small",
2867
- label: x(i).social.sizeSmall
2868
- },
2869
- {
2870
- value: "medium",
2871
- label: x(i).social.sizeMedium
2872
- },
2873
- {
2874
- value: "large",
2875
- label: x(i).social.sizeLarge
2876
- }
2877
- ],
2878
- "model-value": e.block.iconSize,
2879
- "onUpdate:modelValue": n[1] ||= (e) => a("iconSize", e)
2880
- }, null, 8, ["options", "model-value"])]),
2881
- E("div", ns, [E("label", { class: O(x(q)) }, C(x(i).social.spacing), 3), E("div", rs, [E("input", {
2882
- type: "number",
2883
- class: O(x(Y)),
2884
- value: e.block.spacing,
2885
- min: "0",
2886
- max: "50",
2887
- onInput: n[2] ||= (e) => a("spacing", Number(e.target.value))
2888
- }, null, 42, is), E("span", { class: O(x(J)) }, "px", 2)])]),
2889
- E("div", as, [E("label", { class: O(x(q)) }, C(x(i).social.align), 3), N(rn, {
2890
- options: [
2891
- {
2892
- value: "left",
2893
- label: x(i).title.alignLeft,
2894
- icon: x(At)
2895
- },
2896
- {
2897
- value: "center",
2898
- label: x(i).title.alignCenter,
2899
- icon: x(yt)
2900
- },
2901
- {
2902
- value: "right",
2903
- label: x(i).title.alignRight,
2904
- icon: x(Et)
2905
- }
2906
- ],
2907
- "model-value": e.block.align,
2908
- "onUpdate:modelValue": n[3] ||= (e) => a("align", e)
2909
- }, null, 8, ["options", "model-value"])])
2910
- ], 64));
2911
- }
2912
- }), ss = { class: "tpl:mb-3.5" }, cs = { class: "tpl:flex tpl:items-stretch" }, ls = ["value"], us = ["value"], ds = /* @__PURE__ */ M({
2913
- __name: "SpacerToolbar",
2914
- props: { block: {} },
2915
- emits: ["update"],
2916
- setup(e, { emit: t }) {
2917
- let n = t, { t: r } = W();
2918
- return (t, i) => (s(), y("div", ss, [
2919
- E("label", { class: O(x(q)) }, C(x(r).spacer.height), 3),
2920
- E("div", cs, [E("input", {
2921
- type: "number",
2922
- class: O(x(Y)),
2923
- value: e.block.height,
2924
- min: "10",
2925
- max: "100",
2926
- onInput: i[0] ||= (e) => n("update", { height: Number(e.target.value) })
2927
- }, null, 42, ls), E("span", { class: O(x(J)) }, "px", 2)]),
2928
- E("input", {
2929
- type: "range",
2930
- class: "tpl:mt-2 tpl:w-full tpl:accent-[var(--tpl-primary)]",
2931
- value: e.block.height,
2932
- min: "10",
2933
- max: "100",
2934
- onInput: i[1] ||= (e) => n("update", { height: Number(e.target.value) })
2935
- }, null, 40, us)
2936
- ]));
2937
- }
2938
- }), fs = { class: "tpl:mb-3.5" }, ps = { class: "tpl:flex tpl:items-center tpl:gap-3" }, ms = { class: "tpl:flex tpl:flex-1 tpl:items-center tpl:gap-1.5" }, hs = { class: "tpl:text-xs tpl:text-[var(--tpl-text-muted)]" }, gs = { class: "tpl:flex tpl:items-center tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)]" }, _s = ["disabled"], vs = { class: "tpl:min-w-[20px] tpl:text-center tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text)]" }, ys = { class: "tpl:flex tpl:flex-1 tpl:items-center tpl:gap-1.5" }, bs = { class: "tpl:text-xs tpl:text-[var(--tpl-text-muted)]" }, xs = { class: "tpl:flex tpl:items-center tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)]" }, Ss = ["disabled"], Cs = { class: "tpl:min-w-[20px] tpl:text-center tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text)]" }, ws = { class: "tpl:mb-3.5" }, Ts = {
2939
- key: 0,
2940
- class: "tpl:mb-3.5"
2941
- }, Es = { class: "tpl:mb-3.5" }, Ds = { class: "tpl:mb-3.5" }, Os = { class: "tpl:flex tpl:items-stretch" }, ks = ["value"], As = { class: "tpl:mb-3.5" }, js = { class: "tpl:flex tpl:items-stretch" }, Ms = ["value"], Ns = { class: "tpl:mb-3.5" }, Ps = ["value"], Fs = { value: "" }, Is = ["value"], Ls = { class: "tpl:mb-3.5" }, Rs = { class: "tpl:flex tpl:items-stretch" }, zs = ["value"], Bs = { class: "tpl:mb-3.5" }, Vs = { class: "tpl:mb-3.5" }, Hs = /* @__PURE__ */ M({
2942
- __name: "TableToolbar",
2943
- props: {
2944
- block: {},
2945
- fontFamilies: {}
2946
- },
2947
- emits: ["update"],
2948
- setup(e, { emit: t }) {
2949
- let n = e, r = t, { t: i } = W(), a = v(() => n.block.rows.length > 0 ? n.block.rows[0].cells.length : 0);
2950
- function o(e, t) {
2951
- r("update", { [e]: t });
2952
- }
2953
- function c() {
2954
- let e = n.block.rows.length > 0 ? n.block.rows[0].cells.length : 3, t = {
2955
- id: I(),
2956
- cells: Array.from({ length: e }, () => ({
2957
- id: I(),
2958
- content: ""
2959
- }))
2960
- };
2961
- r("update", { rows: [...n.block.rows, t] });
2962
- }
2963
- function l(e) {
2964
- r("update", { rows: n.block.rows.filter((t) => t.id !== e) });
2965
- }
2966
- function d() {
2967
- let e = n.block.rows.map((e) => ({
2968
- ...e,
2969
- cells: [...e.cells, {
2970
- id: I(),
2971
- content: ""
2972
- }]
2973
- }));
2974
- r("update", { rows: e });
2975
- }
2976
- function f(e) {
2977
- let t = n.block.rows.map((t) => ({
2978
- ...t,
2979
- cells: t.cells.filter((t, n) => n !== e)
2980
- }));
2981
- r("update", { rows: t });
2982
- }
2983
- return (t, n) => (s(), y(A, null, [
2984
- E("div", fs, [E("label", { class: O(x(q)) }, C(x(i).table.dimensions), 3), E("div", ps, [E("div", ms, [E("span", hs, C(x(i).table.rows), 1), E("div", gs, [
2985
- E("button", {
2986
- class: "tpl:flex tpl:items-center tpl:justify-center tpl:px-1.5 tpl:py-1 tpl:text-[var(--tpl-text-muted)] tpl:transition-colors tpl:duration-150 tpl:hover:text-[var(--tpl-primary)] tpl:disabled:opacity-30",
2987
- disabled: e.block.rows.length <= 1,
2988
- onClick: n[0] ||= (t) => l(e.block.rows[e.block.rows.length - 1].id)
2989
- }, [N(x(wt), {
2990
- size: 12,
2991
- "stroke-width": 2
2992
- })], 8, _s),
2993
- E("span", vs, C(e.block.rows.length), 1),
2994
- E("button", {
2995
- class: "tpl:flex tpl:items-center tpl:justify-center tpl:px-1.5 tpl:py-1 tpl:text-[var(--tpl-text-muted)] tpl:transition-colors tpl:duration-150 tpl:hover:text-[var(--tpl-primary)]",
2996
- onClick: c
2997
- }, [N(x(G), {
2998
- size: 12,
2999
- "stroke-width": 2
3000
- })])
3001
- ])]), E("div", ys, [E("span", bs, C(x(i).table.columns), 1), E("div", xs, [
3002
- E("button", {
3003
- class: "tpl:flex tpl:items-center tpl:justify-center tpl:px-1.5 tpl:py-1 tpl:text-[var(--tpl-text-muted)] tpl:transition-colors tpl:duration-150 tpl:hover:text-[var(--tpl-primary)] tpl:disabled:opacity-30",
3004
- disabled: a.value <= 1,
3005
- onClick: n[1] ||= (e) => f(a.value - 1)
3006
- }, [N(x(wt), {
3007
- size: 12,
3008
- "stroke-width": 2
3009
- })], 8, Ss),
3010
- E("span", Cs, C(a.value), 1),
3011
- E("button", {
3012
- class: "tpl:flex tpl:items-center tpl:justify-center tpl:px-1.5 tpl:py-1 tpl:text-[var(--tpl-text-muted)] tpl:transition-colors tpl:duration-150 tpl:hover:text-[var(--tpl-primary)]",
3013
- onClick: d
3014
- }, [N(x(G), {
3015
- size: 12,
3016
- "stroke-width": 2
3017
- })])
3018
- ])])])]),
3019
- E("div", ws, [N(Z, {
3020
- class: "tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text-muted)]",
3021
- "model-value": e.block.hasHeaderRow,
3022
- label: x(i).table.hasHeaderRow,
3023
- "onUpdate:modelValue": n[2] ||= (e) => o("hasHeaderRow", e)
3024
- }, null, 8, ["model-value", "label"])]),
3025
- e.block.hasHeaderRow ? (s(), y("div", Ts, [E("label", { class: O(x(q)) }, C(x(i).table.headerBackgroundColor), 3), N(X, {
3026
- "model-value": e.block.headerBackgroundColor ?? "",
3027
- "seed-color": x(Zt),
3028
- placeholder: x(i).table.noHeaderBg,
3029
- "onUpdate:modelValue": n[3] ||= (e) => o("headerBackgroundColor", e || null)
3030
- }, null, 8, [
3031
- "model-value",
3032
- "seed-color",
3033
- "placeholder"
3034
- ])])) : b("", !0),
3035
- E("div", Es, [E("label", { class: O(x(q)) }, C(x(i).table.borderColor), 3), N(X, {
3036
- "model-value": e.block.borderColor,
3037
- "onUpdate:modelValue": n[4] ||= (e) => o("borderColor", e)
3038
- }, null, 8, ["model-value"])]),
3039
- E("div", Ds, [E("label", { class: O(x(q)) }, C(x(i).table.borderWidth), 3), E("div", Os, [E("input", {
3040
- type: "number",
3041
- class: O(x(Y)),
3042
- value: e.block.borderWidth,
3043
- min: "0",
3044
- max: "10",
3045
- onInput: n[5] ||= (e) => o("borderWidth", Number(e.target.value))
3046
- }, null, 42, ks), E("span", { class: O(x(J)) }, "px", 2)])]),
3047
- E("div", As, [E("label", { class: O(x(q)) }, C(x(i).table.cellPadding), 3), E("div", js, [E("input", {
3048
- type: "number",
3049
- class: O(x(Y)),
3050
- value: e.block.cellPadding,
3051
- min: "0",
3052
- max: "30",
3053
- onInput: n[6] ||= (e) => o("cellPadding", Number(e.target.value))
3054
- }, null, 42, Ms), E("span", { class: O(x(J)) }, "px", 2)])]),
3055
- E("div", Ns, [E("label", { class: O(x(q)) }, C(x(i).table.fontFamily), 3), E("select", {
3056
- class: O(x(K)),
3057
- value: e.block.fontFamily || "",
3058
- onChange: n[7] ||= (e) => o("fontFamily", e.target.value || void 0)
3059
- }, [E("option", Fs, C(x(i).title.inheritFont), 1), (s(!0), y(A, null, u(e.fontFamilies, (e) => (s(), y("option", {
3060
- key: e.value,
3061
- value: e.value
3062
- }, C(e.label), 9, Is))), 128))], 42, Ps)]),
3063
- E("div", Ls, [E("label", { class: O(x(q)) }, C(x(i).table.fontSize), 3), E("div", Rs, [E("input", {
3064
- type: "number",
3065
- class: O(x(Y)),
3066
- value: e.block.fontSize,
3067
- min: "10",
3068
- max: "32",
3069
- onInput: n[8] ||= (e) => o("fontSize", Number(e.target.value))
3070
- }, null, 42, zs), E("span", { class: O(x(J)) }, "px", 2)])]),
3071
- E("div", Bs, [E("label", { class: O(x(q)) }, C(x(i).table.color), 3), N(X, {
3072
- "model-value": e.block.color ?? "",
3073
- "onUpdate:modelValue": n[9] ||= (e) => o("color", e || void 0)
3074
- }, null, 8, ["model-value"])]),
3075
- E("div", Vs, [E("label", { class: O(x(q)) }, C(x(i).table.textAlign), 3), N(rn, {
3076
- options: [
3077
- {
3078
- value: "left",
3079
- label: x(i).title.alignLeft,
3080
- icon: x(At)
3081
- },
3082
- {
3083
- value: "center",
3084
- label: x(i).title.alignCenter,
3085
- icon: x(yt)
3086
- },
3087
- {
3088
- value: "right",
3089
- label: x(i).title.alignRight,
3090
- icon: x(Et)
3091
- }
3092
- ],
3093
- "model-value": e.block.textAlign,
3094
- "onUpdate:modelValue": n[10] ||= (e) => o("textAlign", e)
3095
- }, null, 8, ["options", "model-value"])])
3096
- ], 64));
3097
- }
3098
- }), Us = { class: "tpl:mb-3.5" }, Ws = ["value"], Gs = { value: 1 }, Ks = { value: 2 }, qs = { value: 3 }, Js = { value: 4 }, Ys = { class: "tpl:mb-3.5" }, Xs = ["value"], Zs = { value: "" }, Qs = ["value"], $s = { class: "tpl:mb-3.5" }, ec = { class: "tpl:mb-3.5" }, tc = /* @__PURE__ */ M({
3099
- __name: "TitleToolbar",
3100
- props: {
3101
- block: {},
3102
- fontFamilies: {}
3103
- },
3104
- emits: ["update"],
3105
- setup(e, { emit: t }) {
3106
- let n = t, { t: r } = W();
3107
- function i(e, t) {
3108
- n("update", { [e]: t });
3109
- }
3110
- return (t, n) => (s(), y(A, null, [
3111
- E("div", Us, [E("label", { class: O(x(q)) }, C(x(r).title.level), 3), E("select", {
3112
- class: O(x(K)),
3113
- value: e.block.level,
3114
- onChange: n[0] ||= (e) => i("level", Number(e.target.value))
3115
- }, [
3116
- E("option", Gs, C(x(r).title.heading1), 1),
3117
- E("option", Ks, C(x(r).title.heading2), 1),
3118
- E("option", qs, C(x(r).title.heading3), 1),
3119
- E("option", Js, C(x(r).title.heading4), 1)
3120
- ], 42, Ws)]),
3121
- E("div", Ys, [E("label", { class: O(x(q)) }, C(x(r).title.fontFamily), 3), E("select", {
3122
- class: O(x(K)),
3123
- value: e.block.fontFamily || "",
3124
- onChange: n[1] ||= (e) => i("fontFamily", e.target.value || void 0)
3125
- }, [E("option", Zs, C(x(r).title.inheritFont), 1), (s(!0), y(A, null, u(e.fontFamilies, (e) => (s(), y("option", {
3126
- key: e.value,
3127
- value: e.value
3128
- }, C(e.label), 9, Qs))), 128))], 42, Xs)]),
3129
- E("div", $s, [E("label", { class: O(x(q)) }, C(x(r).title.color), 3), N(X, {
3130
- "model-value": e.block.color ?? "",
3131
- "onUpdate:modelValue": n[2] ||= (e) => i("color", e || void 0)
3132
- }, null, 8, ["model-value"])]),
3133
- E("div", ec, [E("label", { class: O(x(q)) }, C(x(r).title.align), 3), N(rn, {
3134
- options: [
3135
- {
3136
- value: "left",
3137
- label: x(r).title.alignLeft,
3138
- icon: x(At)
3139
- },
3140
- {
3141
- value: "center",
3142
- label: x(r).title.alignCenter,
3143
- icon: x(yt)
3144
- },
3145
- {
3146
- value: "right",
3147
- label: x(r).title.alignRight,
3148
- icon: x(Et)
3149
- }
3150
- ],
3151
- "model-value": e.block.textAlign,
3152
- "onUpdate:modelValue": n[3] ||= (e) => i("textAlign", e)
3153
- }, null, 8, ["options", "model-value"])])
3154
- ], 64));
3155
- }
3156
- }), nc = { class: "tpl:mb-3.5" }, rc = {
3157
- key: 0,
3158
- class: "tpl:mb-3.5"
3159
- }, ic = { class: "tpl:font-normal tpl:text-[var(--tpl-text-dim)]" }, ac = [
3160
- "value",
3161
- "placeholder",
3162
- "title"
3163
- ], oc = { class: "tpl:mb-3.5" }, sc = { class: "tpl:font-normal tpl:text-[var(--tpl-text-dim)]" }, cc = { class: "tpl:mb-3.5" }, lc = { class: "tpl:mb-3.5" }, uc = ["value"], dc = { value: "full" }, fc = { class: "tpl:mb-3.5" }, pc = /* @__PURE__ */ M({
3164
- __name: "VideoToolbar",
3165
- props: { block: {} },
3166
- emits: ["update"],
3167
- setup(e, { emit: t }) {
3168
- let n = e, r = t, { t: i } = W(), a = d(Fe, null), o = d(Ae, ne.liquid), c = Wt(), l = v(() => !!a), u = v(() => H(n.block.url, o)), f = m(!1), { start: p } = Oe(() => {
3169
- f.value = !1;
3170
- }, 1e3, { immediate: !1 });
3171
- function h(e, t) {
3172
- r("update", { [e]: t });
3173
- }
3174
- async function g() {
3175
- let e = await a?.({ accept: ["images"] });
3176
- c.alive && e && (h("thumbnailUrl", e.url), f.value = !0, p());
3177
- }
3178
- return (t, n) => (s(), y(A, null, [
3179
- E("div", nc, [
3180
- E("label", { class: O(x(q)) }, C(x(i).video.videoUrl), 3),
3181
- N($, {
3182
- "model-value": e.block.url,
3183
- type: "url",
3184
- placeholder: x(i).video.videoUrlPlaceholder,
3185
- "onUpdate:modelValue": n[0] ||= (e) => h("url", e)
3186
- }, null, 8, ["model-value", "placeholder"]),
3187
- e.block.url ? (s(), w(Z, {
3188
- key: 0,
3189
- class: "tpl:mt-2 tpl:text-[12px] tpl:text-[var(--tpl-text-muted)]",
3190
- "model-value": e.block.openInNewTab ?? !1,
3191
- label: x(i).video.openInNewTab,
3192
- "onUpdate:modelValue": n[1] ||= (e) => h("openInNewTab", e)
3193
- }, null, 8, ["model-value", "label"])) : b("", !0)
3194
- ]),
3195
- u.value ? (s(), y("div", rc, [E("label", { class: O(x(q)) }, [j(C(x(i).video.placeholderUrl) + " ", 1), E("span", ic, C(x(i).video.optional), 1)], 2), E("input", {
3196
- type: "url",
3197
- class: O(x(K)),
3198
- value: e.block.placeholderUrl || "",
3199
- placeholder: x(i).video.placeholderUrlPlaceholder,
3200
- title: x(i).video.placeholderUrlTooltip,
3201
- onInput: n[2] ||= (e) => h("placeholderUrl", e.target.value)
3202
- }, null, 42, ac)])) : b("", !0),
3203
- E("div", oc, [
3204
- E("label", { class: O(x(q)) }, [j(C(x(i).video.customThumbnail) + " ", 1), E("span", sc, C(x(i).video.optional), 1)], 2),
3205
- N($, {
3206
- "model-value": e.block.thumbnailUrl,
3207
- type: "url",
3208
- placeholder: x(i).video.thumbnailPlaceholder,
3209
- pulse: f.value,
3210
- "onUpdate:modelValue": n[3] ||= (e) => h("thumbnailUrl", e)
3211
- }, null, 8, [
3212
- "model-value",
3213
- "placeholder",
3214
- "pulse"
3215
- ]),
3216
- l.value ? (s(), y("button", {
3217
- key: 0,
3218
- class: "tpl:mt-2 tpl:flex tpl:w-full tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded-md tpl:border tpl:px-3 tpl:py-2 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
3219
- style: {
3220
- "border-color": "var(--tpl-border)",
3221
- color: "var(--tpl-primary)",
3222
- "background-color": "var(--tpl-bg)"
3223
- },
3224
- onClick: g
3225
- }, [N(x(Tt), {
3226
- size: 14,
3227
- "stroke-width": 1.5
3228
- }), j(" " + C(x(i).image.browseMedia), 1)])) : b("", !0)
3229
- ]),
3230
- E("div", cc, [E("label", { class: O(x(q)) }, C(x(i).video.altText), 3), N($, {
3231
- "model-value": e.block.alt,
3232
- type: "text",
3233
- placeholder: x(i).video.altTextPlaceholder,
3234
- "onUpdate:modelValue": n[4] ||= (e) => h("alt", e)
3235
- }, null, 8, ["model-value", "placeholder"])]),
3236
- E("div", lc, [E("label", { class: O(x(q)) }, C(x(i).video.width), 3), E("select", {
3237
- class: O(x(K)),
3238
- value: e.block.width,
3239
- onChange: n[5] ||= (e) => h("width", e.target.value === "full" ? "full" : Number(e.target.value))
3240
- }, [
3241
- E("option", dc, C(x(i).video.fullWidth), 1),
3242
- n[7] ||= E("option", { value: "300" }, "300px", -1),
3243
- n[8] ||= E("option", { value: "400" }, "400px", -1),
3244
- n[9] ||= E("option", { value: "500" }, "500px", -1)
3245
- ], 42, uc)]),
3246
- E("div", fc, [E("label", { class: O(x(q)) }, C(x(i).title.align), 3), N(rn, {
3247
- options: [
3248
- {
3249
- value: "left",
3250
- label: x(i).title.alignLeft
3251
- },
3252
- {
3253
- value: "center",
3254
- label: x(i).title.alignCenter
3255
- },
3256
- {
3257
- value: "right",
3258
- label: x(i).title.alignRight
3259
- }
3260
- ],
3261
- "model-value": e.block.align,
3262
- "onUpdate:modelValue": n[6] ||= (e) => h("align", e)
3263
- }, null, 8, ["options", "model-value"])])
3264
- ], 64));
3265
- }
3266
- }), mc = ["aria-label"], hc = { class: "tpl:flex tpl:items-center tpl:justify-between tpl:border-b tpl:border-[var(--tpl-border)] tpl:px-4 tpl:py-3.5" }, gc = { class: "tpl:flex tpl:items-center tpl:gap-2 tpl:text-[var(--tpl-primary)]" }, _c = { class: "tpl:m-0 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]" }, vc = { class: "tpl:flex tpl:gap-1" }, yc = ["title"], bc = ["title"], xc = { class: "tpl:flex-1 tpl:overflow-y-auto tpl:p-4" }, Sc = /*#__PURE__*/ Vt(/* @__PURE__ */ M({
3267
- __name: "Toolbar",
3268
- props: { block: {} },
3269
- emits: [
3270
- "update",
3271
- "delete",
3272
- "duplicate"
3273
- ],
3274
- setup(e, { emit: t }) {
3275
- let n = h(() => import("./CountdownToolbar-DPjcgcVR.js")), r = e, i = t, { t: a } = W(), c = Me(tt, "Toolbar"), l = d(Ze, []), u = v(() => r.block.type), f = v(() => F(r.block)), p = v(() => {
3276
- if (f.value) return l.find((e) => e.type === r.block.customType);
3277
- }), m = v(() => f.value ? p.value?.name ?? r.block.customType : se(u.value, a)), g = c.fonts;
3278
- function _(e) {
3279
- i("update", e);
3280
- }
3281
- return (t, r) => (s(), y("aside", {
3282
- "aria-label": x(a).landmarks.blockToolbar,
3283
- class: "tpl:flex tpl:w-full tpl:flex-1 tpl:flex-col tpl:bg-[var(--tpl-bg-elevated)]"
3284
- }, [E("div", hc, [E("div", gc, [x(Jt)[u.value] ? (s(), w(o(x(Jt)[u.value]), {
3285
- key: 0,
3286
- size: 16,
3287
- "stroke-width": 1.5
3288
- })) : f.value ? (s(), w(x(ft), {
3289
- key: 1,
3290
- size: 16,
3291
- "stroke-width": 1.5
3292
- })) : b("", !0), E("h3", _c, C(m.value), 1)]), E("div", vc, [E("button", {
3293
- class: "tpl:flex tpl:size-7 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-hover)] tpl:text-[var(--tpl-text-muted)] tpl:transition-all tpl:duration-150 tpl:hover:bg-[var(--tpl-bg-active)] tpl:hover:text-[var(--tpl-text)]",
3294
- title: x(a).toolbar.duplicate,
3295
- onClick: r[0] ||= (e) => i("duplicate")
3296
- }, [N(x(ct), {
3297
- size: 14,
3298
- "stroke-width": 2
3299
- })], 8, yc), E("button", {
3300
- class: "tpl:flex tpl:size-7 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-hover)] tpl:text-[var(--tpl-text-muted)] tpl:transition-all tpl:duration-150 tpl:hover:border-[var(--tpl-danger)] tpl:hover:bg-[var(--tpl-danger-light)] tpl:hover:text-[var(--tpl-danger)]",
3301
- title: x(a).toolbar.delete,
3302
- onClick: r[1] ||= (e) => i("delete")
3303
- }, [N(x(St), {
3304
- size: 14,
3305
- "stroke-width": 2
3306
- })], 8, bc)])]), E("div", xc, [f.value ? (s(), w(Ua, {
3307
- key: 0,
3308
- block: e.block,
3309
- onUpdateFieldValues: r[2] ||= (e) => i("update", { fieldValues: e }),
3310
- onUpdateDataSourceFetched: r[3] ||= (e) => i("update", { dataSourceFetched: e })
3311
- }, null, 8, ["block"])) : u.value === "section" ? (s(), w(Vo, {
3312
- key: 1,
3313
- block: e.block,
3314
- onUpdate: _
3315
- }, null, 8, ["block"])) : u.value === "title" ? (s(), w(tc, {
3316
- key: 2,
3317
- block: e.block,
3318
- "font-families": x(g),
3319
- onUpdate: _
3320
- }, null, 8, ["block", "font-families"])) : u.value === "paragraph" ? (s(), y(A, { key: 3 }, [], 64)) : u.value === "image" ? (s(), w(go, {
3321
- key: 4,
3322
- block: e.block,
3323
- onUpdate: _
3324
- }, null, 8, ["block"])) : u.value === "video" ? (s(), w(pc, {
3325
- key: 5,
3326
- block: e.block,
3327
- onUpdate: _
3328
- }, null, 8, ["block"])) : u.value === "button" ? (s(), w(hi, {
3329
- key: 6,
3330
- block: e.block,
3331
- "font-families": x(g),
3332
- onUpdate: _
3333
- }, null, 8, ["block", "font-families"])) : u.value === "divider" ? (s(), w(Ya, {
3334
- key: 7,
3335
- block: e.block,
3336
- onUpdate: _
3337
- }, null, 8, ["block"])) : u.value === "social" ? (s(), w(os, {
3338
- key: 8,
3339
- block: e.block,
3340
- onUpdate: _
3341
- }, null, 8, ["block"])) : u.value === "menu" ? (s(), w(Do, {
3342
- key: 9,
3343
- block: e.block,
3344
- "font-families": x(g),
3345
- onUpdate: _
3346
- }, null, 8, ["block", "font-families"])) : u.value === "table" ? (s(), w(Hs, {
3347
- key: 10,
3348
- block: e.block,
3349
- "font-families": x(g),
3350
- onUpdate: _
3351
- }, null, 8, ["block", "font-families"])) : u.value === "spacer" ? (s(), w(ds, {
3352
- key: 11,
3353
- block: e.block,
3354
- onUpdate: _
3355
- }, null, 8, ["block"])) : u.value === "html" ? (s(), w($a, {
3356
- key: 12,
3357
- block: e.block,
3358
- onUpdate: _
3359
- }, null, 8, ["block"])) : u.value === "countdown" ? (s(), w(x(n), {
3360
- key: 13,
3361
- block: e.block,
3362
- "font-families": x(g),
3363
- onUpdate: _
3364
- }, null, 8, ["block", "font-families"])) : b("", !0), N(sa, {
3365
- block: e.block,
3366
- "is-first-section": u.value === "paragraph",
3367
- onUpdate: _
3368
- }, null, 8, ["block", "is-first-section"])])], 8, mc));
3369
- }
3370
- }), [["__scopeId", "data-v-2ac88283"]]), Cc = ["aria-label"], wc = {
3371
- role: "tablist",
3372
- class: "tpl:relative tpl:flex tpl:gap-1 tpl:border-b tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-active)] tpl:p-1.5"
3373
- }, Tc = [
3374
- "aria-selected",
3375
- "aria-label",
3376
- "title"
3377
- ], Ec = { key: 0 }, Dc = [
3378
- "aria-selected",
3379
- "aria-label",
3380
- "title"
3381
- ], Oc = { key: 0 }, kc = [
3382
- "aria-selected",
3383
- "aria-label",
3384
- "title"
3385
- ], Ac = { key: 0 }, jc = {
3386
- key: 1,
3387
- class: "tpl:ml-1 tpl:rounded-full tpl:bg-[var(--tpl-bg-hover)] tpl:px-1.5 tpl:text-[10px]"
3388
- }, Mc = {
3389
- key: 0,
3390
- id: "tpl-tabpanel-content",
3391
- role: "tabpanel",
3392
- "aria-labelledby": "tpl-tab-content",
3393
- class: "tpl:flex tpl:flex-1 tpl:flex-col tpl:overflow-y-auto"
3394
- }, Nc = {
3395
- key: 1,
3396
- class: "tpl:flex tpl:flex-col tpl:items-center tpl:justify-center tpl:px-6 tpl:py-10 tpl:text-center tpl:text-[var(--tpl-text-muted)]"
3397
- }, Pc = { class: "tpl:mb-4 tpl:text-[var(--tpl-text-dim)]" }, Fc = { class: "tpl:m-0 tpl:mb-2 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]" }, Ic = { class: "tpl:m-0 tpl:text-sm tpl:leading-normal" }, Lc = {
3398
- key: 1,
3399
- id: "tpl-tabpanel-settings",
3400
- role: "tabpanel",
3401
- "aria-labelledby": "tpl-tab-settings",
3402
- class: "tpl:flex tpl:flex-1 tpl:flex-col tpl:overflow-y-auto"
3403
- }, Rc = {
3404
- key: 2,
3405
- id: "tpl-tabpanel-issues",
3406
- role: "tabpanel",
3407
- "aria-labelledby": "tpl-tab-issues",
3408
- class: "tpl:flex tpl:flex-1 tpl:flex-col tpl:overflow-y-auto"
3409
- }, zc = /* @__PURE__ */ M({
3410
- __name: "RightSidebar",
3411
- props: {
3412
- selectedBlock: {},
3413
- settings: {},
3414
- shiftedLeft: { type: Boolean }
3415
- },
3416
- emits: [
3417
- "update-block",
3418
- "delete-block",
3419
- "duplicate-block",
3420
- "update-settings"
3421
- ],
3422
- setup(e, { emit: t }) {
3423
- let n = h(() => import("./IssuesPanel-DKTS4QVb.js")), r = e, i = t, { t: a } = W(), o = m("content"), c = d(je, null), l = v(() => c !== null), u = v(() => c?.issues.value.length ?? 0);
3424
- function f(e) {
3425
- return o.value === e ? "tpl:flex-1 tpl:text-[var(--tpl-primary)]" : "tpl:shrink-0 tpl:text-[var(--tpl-text-muted)] hover:tpl:text-[var(--tpl-text)]";
3426
- }
3427
- function p(e) {
3428
- return o.value === e ? {
3429
- backgroundColor: "var(--tpl-bg)",
3430
- boxShadow: "var(--tpl-shadow-md)"
3431
- } : { backgroundColor: "transparent" };
3432
- }
3433
- return P(() => r.selectedBlock, (e) => {
3434
- e && (o.value = "content");
3435
- }), (t, r) => (s(), y("aside", {
3436
- "aria-label": x(a).landmarks.rightSidebar,
3437
- class: O(["tpl-right-sidebar tpl:absolute tpl:top-14 tpl:bottom-0 tpl:z-40 tpl:flex tpl:w-[320px] tpl:flex-col tpl:bg-[var(--tpl-bg-elevated)] tpl:transition-all tpl:duration-200 tpl:border-l tpl:border-[var(--tpl-border)]", e.shiftedLeft ? "tpl:right-[360px]" : "tpl:right-0"])
3438
- }, [
3439
- E("div", wc, [
3440
- E("button", {
3441
- id: "tpl-tab-content",
3442
- role: "tab",
3443
- "aria-selected": o.value === "content",
3444
- "aria-controls": "tpl-tabpanel-content",
3445
- "aria-label": x(a).sidebar.content,
3446
- title: x(a).sidebar.content,
3447
- class: O(["tpl:flex tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded-[var(--tpl-radius-sm)] tpl:border-none tpl:px-3 tpl:py-2 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)]", f("content")]),
3448
- style: _(p("content")),
3449
- onClick: r[0] ||= (e) => o.value = "content"
3450
- }, [N(x(Pt), {
3451
- size: 14,
3452
- "stroke-width": 2
3453
- }), o.value === "content" ? (s(), y("span", Ec, C(x(a).sidebar.content), 1)) : b("", !0)], 14, Tc),
3454
- E("button", {
3455
- id: "tpl-tab-settings",
3456
- role: "tab",
3457
- "aria-selected": o.value === "settings",
3458
- "aria-controls": "tpl-tabpanel-settings",
3459
- "aria-label": x(a).sidebar.settings,
3460
- title: x(a).sidebar.settings,
3461
- class: O(["tpl:flex tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded-[var(--tpl-radius-sm)] tpl:border-none tpl:px-3 tpl:py-2 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)]", f("settings")]),
3462
- style: _(p("settings")),
3463
- onClick: r[1] ||= (e) => o.value = "settings"
3464
- }, [N(x(Ot), {
3465
- size: 14,
3466
- "stroke-width": 1.5
3467
- }), o.value === "settings" ? (s(), y("span", Oc, C(x(a).sidebar.settings), 1)) : b("", !0)], 14, Dc),
3468
- l.value ? (s(), y("button", {
3469
- key: 0,
3470
- id: "tpl-tab-issues",
3471
- role: "tab",
3472
- "aria-selected": o.value === "issues",
3473
- "aria-controls": "tpl-tabpanel-issues",
3474
- "aria-label": x(a).issues.panelTabLabel,
3475
- title: x(a).issues.panelTabLabel,
3476
- class: O(["tpl:flex tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded-[var(--tpl-radius-sm)] tpl:border-none tpl:px-3 tpl:py-2 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-[120ms] tpl:ease-[cubic-bezier(0.16,1,0.3,1)]", f("issues")]),
3477
- style: _(p("issues")),
3478
- onClick: r[2] ||= (e) => o.value = "issues"
3479
- }, [
3480
- N(x(Lt), {
3481
- size: 14,
3482
- "stroke-width": 1.5
3483
- }),
3484
- o.value === "issues" ? (s(), y("span", Ac, C(x(a).issues.panelTabLabel), 1)) : b("", !0),
3485
- u.value > 0 ? (s(), y("span", jc, C(u.value), 1)) : b("", !0)
3486
- ], 14, kc)) : b("", !0)
3487
- ]),
3488
- o.value === "content" ? (s(), y("div", Mc, [e.selectedBlock ? (s(), w(Sc, {
3489
- key: 0,
3490
- block: e.selectedBlock,
3491
- onUpdate: r[3] ||= (e) => i("update-block", e),
3492
- onDelete: r[4] ||= (e) => i("delete-block"),
3493
- onDuplicate: r[5] ||= (e) => i("duplicate-block")
3494
- }, null, 8, ["block"])) : (s(), y("div", Nc, [
3495
- E("div", Pc, [N(x(kt), {
3496
- size: 40,
3497
- "stroke-width": 1.5
3498
- })]),
3499
- E("h3", Fc, C(x(a).sidebar.noSelection), 1),
3500
- E("p", Ic, C(x(a).sidebar.noSelectionHint), 1)
3501
- ]))])) : b("", !0),
3502
- o.value === "settings" ? (s(), y("div", Lc, [N(Rr, {
3503
- settings: e.settings,
3504
- onUpdate: r[6] ||= (e) => i("update-settings", e)
3505
- }, null, 8, ["settings"])])) : b("", !0),
3506
- o.value === "issues" && l.value ? (s(), y("div", Rc, [N(x(n))])) : b("", !0)
3507
- ], 10, Cc));
3508
- }
3509
- }), Bc = {
3510
- class: "tpl-small-screen-notice tpl:absolute tpl:inset-0 tpl:flex tpl:flex-col tpl:items-center tpl:justify-center tpl:gap-4 tpl:px-6 tpl:py-10 tpl:text-center tpl:bg-[var(--tpl-bg)] tpl:text-[var(--tpl-text-muted)]",
3511
- style: { "z-index": "10001" },
3512
- role: "status",
3513
- "data-testid": "small-screen-notice"
3514
- }, Vc = { class: "tpl:text-[var(--tpl-text-dim)]" }, Hc = { class: "tpl:m-0 tpl:text-base tpl:font-semibold tpl:text-[var(--tpl-text)]" }, Uc = { class: "tpl:m-0 tpl:max-w-sm tpl:text-sm tpl:leading-normal" }, Wc = /* @__PURE__ */ M({
3515
- __name: "SmallScreenNotice",
3516
- setup(e) {
3517
- let { t } = W();
3518
- return (e, n) => (s(), y("div", Bc, [
3519
- E("div", Vc, [N(x(it), {
3520
- size: 48,
3521
- "stroke-width": 1.5
3522
- })]),
3523
- E("h2", Hc, C(x(t).smallScreen.title), 1),
3524
- E("p", Uc, C(x(t).smallScreen.message), 1)
3525
- ]));
3526
- }
3527
- }), Gc = [
3528
- "aria-label",
3529
- "title",
3530
- "aria-pressed"
3531
- ], Kc = /*#__PURE__*/ Vt(/* @__PURE__ */ M({
3532
- __name: "PreviewToggle",
3533
- props: { previewMode: { type: Boolean } },
3534
- emits: ["change"],
3535
- setup(e, { emit: t }) {
3536
- let n = t, { t: r } = W();
3537
- return (t, i) => (s(), y("button", {
3538
- class: "tpl-preview-toggle tpl:relative tpl:flex tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded-[var(--tpl-radius-sm)] tpl:border-none tpl:p-2 tpl:transition-all tpl:duration-150",
3539
- style: _({
3540
- color: e.previewMode ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
3541
- backgroundColor: e.previewMode ? "var(--tpl-primary-light)" : "transparent"
3542
- }),
3543
- "aria-label": e.previewMode ? x(r).previewMode.disable : x(r).previewMode.enable,
3544
- title: e.previewMode ? x(r).previewMode.disable : x(r).previewMode.enable,
3545
- "aria-pressed": e.previewMode,
3546
- onClick: i[0] ||= (t) => n("change", !e.previewMode)
3547
- }, [N(T, {
3548
- "enter-active-class": "tpl-icon-enter-active",
3549
- "leave-active-class": "tpl-icon-leave-active",
3550
- "enter-from-class": "tpl-icon-enter-from",
3551
- "leave-to-class": "tpl-icon-leave-to",
3552
- mode: "out-in"
3553
- }, {
3554
- default: f(() => [e.previewMode ? (s(), w(x(zt), {
3555
- key: "eye",
3556
- size: 18,
3557
- "stroke-width": 1.5
3558
- })) : (s(), w(x(_t), {
3559
- key: "eye-off",
3560
- size: 18,
3561
- "stroke-width": 1.5
3562
- }))]),
3563
- _: 1
3564
- })], 12, Gc));
3565
- }
3566
- }), [["__scopeId", "data-v-af87d02a"]]), qc = [
3567
- "aria-label",
3568
- "title",
3569
- "aria-pressed"
3570
- ], Jc = /*#__PURE__*/ Vt(/* @__PURE__ */ M({
3571
- __name: "DarkModeToggle",
3572
- props: { darkMode: { type: Boolean } },
3573
- emits: ["change"],
3574
- setup(e, { emit: t }) {
3575
- let n = t, { t: r } = W();
3576
- return (t, i) => (s(), y("button", {
3577
- class: "tpl-dark-mode-toggle tpl:relative tpl:flex tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded-[var(--tpl-radius-sm)] tpl:border-none tpl:p-2 tpl:transition-all tpl:duration-150",
3578
- style: _({
3579
- color: e.darkMode ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
3580
- backgroundColor: e.darkMode ? "var(--tpl-primary-light)" : "transparent"
3581
- }),
3582
- "aria-label": e.darkMode ? x(r).darkMode.disable : x(r).darkMode.enable,
3583
- title: e.darkMode ? x(r).darkMode.disable : x(r).darkMode.enable,
3584
- "aria-pressed": e.darkMode,
3585
- onClick: i[0] ||= (t) => n("change", !e.darkMode)
3586
- }, [N(T, {
3587
- "enter-active-class": "tpl-icon-enter-active",
3588
- "leave-active-class": "tpl-icon-leave-active",
3589
- "enter-from-class": "tpl-icon-enter-from",
3590
- "leave-to-class": "tpl-icon-leave-to",
3591
- mode: "out-in"
3592
- }, {
3593
- default: f(() => [e.darkMode ? (s(), w(x(mt), {
3594
- key: "moon",
3595
- size: 18,
3596
- "stroke-width": 1.5
3597
- })) : (s(), w(x(xt), {
3598
- key: "sun",
3599
- size: 18,
3600
- "stroke-width": 1.5
3601
- }))]),
3602
- _: 1
3603
- })], 12, qc));
3604
- }
3605
- }), [["__scopeId", "data-v-f8694f76"]]), Yc = {
3606
- class: "tpl:pointer-events-auto tpl:flex tpl:items-center tpl:gap-1.5 tpl:rounded-tl-lg tpl:p-1",
3607
- style: {
3608
- "background-color": "color-mix(\n in srgb,\n var(--tpl-canvas-bg) 85%,\n transparent\n )",
3609
- "backdrop-filter": "blur(8px)",
3610
- "-webkit-backdrop-filter": "blur(8px)"
3611
- }
3612
- }, Xc = {
3613
- href: "https://github.com/templatical/sdk",
3614
- target: "_blank",
3615
- rel: "noopener noreferrer",
3616
- class: "tpl:transition-colors tpl:duration-150 hover:tpl:opacity-80 tpl:text-[var(--tpl-text-dim)]",
3617
- style: { "text-decoration": "none" }
3618
- }, Zc = /* @__PURE__ */ M({
3619
- __name: "EditorFooter",
3620
- props: { positionClass: {} },
3621
- setup(e) {
3622
- let { t } = W();
3623
- return (n, r) => (s(), y("footer", { class: O(["tpl:pointer-events-none tpl:absolute tpl:bottom-0 tpl:z-50 tpl:flex tpl:h-8 tpl:items-center tpl:justify-end tpl:pr-4 tpl:text-[9px] tpl:opacity-90 tpl:transition-all tpl:duration-300 tpl:text-[var(--tpl-text-dim)]", e.positionClass]) }, [E("div", Yc, [
3624
- E("span", null, C(x(t).footer.poweredBy), 1),
3625
- r[0] ||= E("a", {
3626
- href: "https://templatical.com",
3627
- target: "_blank",
3628
- rel: "noopener noreferrer",
3629
- class: "tpl:inline-flex tpl:items-center tpl:gap-1 tpl:font-medium tpl:transition-colors tpl:duration-150 hover:tpl:opacity-80 tpl:text-[var(--tpl-text-muted)]",
3630
- style: { "text-decoration": "none" }
3631
- }, [E("img", {
3632
- width: "14",
3633
- height: "14",
3634
- src: "https://templatical.com/logo.svg",
3635
- alt: ""
3636
- }), j(" Templatical ")], -1),
3637
- r[1] ||= E("span", { class: "tpl:text-[var(--tpl-border)]" }, "·", -1),
3638
- E("a", Xc, C(x(t).footer.openSource), 1)
3639
- ])], 2));
3640
- }
3641
- }), Qc = ["aria-labelledby", "data-tpl-theme"], $c = { class: "tpl:flex tpl:items-center tpl:justify-between tpl:gap-3 tpl:border-b tpl:border-[var(--tpl-border)] tpl:px-3 tpl:py-2.5" }, el = ["id"], tl = ["aria-label"], nl = { class: "tpl:relative tpl:border-b tpl:border-[var(--tpl-border)] tpl:px-3 tpl:py-2.5" }, rl = [
3642
- "id",
3643
- "placeholder",
3644
- "aria-label",
3645
- "aria-activedescendant"
3646
- ], il = {
3647
- key: 0,
3648
- class: "tpl:flex tpl:gap-1.5 tpl:overflow-x-auto tpl:border-b tpl:border-[var(--tpl-border)] tpl:px-3 tpl:py-2",
3649
- "data-testid": "merge-tag-picker-group-pills"
3650
- }, al = ["data-group-name", "onClick"], ol = ["aria-label"], sl = {
3651
- key: 0,
3652
- class: "tpl:px-3 tpl:py-6 tpl:text-center tpl:text-xs tpl:text-[var(--tpl-text-dim)]",
3653
- "data-testid": "merge-tag-picker-empty"
3654
- }, cl = {
3655
- key: 1,
3656
- class: "tpl:px-3 tpl:py-6 tpl:text-center tpl:text-xs tpl:text-[var(--tpl-text-dim)]",
3657
- "data-testid": "merge-tag-picker-empty"
3658
- }, ll = [
3659
- "aria-expanded",
3660
- "data-group-name",
3661
- "data-group-collapsed",
3662
- "onClick"
3663
- ], ul = { class: "tpl:ml-1 tpl:font-normal" }, dl = [
3664
- "id",
3665
- "aria-selected",
3666
- "data-selected",
3667
- "data-merge-tag-index",
3668
- "data-merge-tag-value",
3669
- "title",
3670
- "onMousemove",
3671
- "onClick"
3672
- ], fl = { class: "tpl:text-sm tpl:font-medium" }, pl = { class: "tpl:line-clamp-2 tpl:font-mono tpl:text-xs tpl:text-ellipsis tpl:break-all tpl:text-[var(--tpl-text-dim)]" }, ml = {
3673
- key: 0,
3674
- class: "tpl:line-clamp-2 tpl:text-xs tpl:text-ellipsis tpl:text-[var(--tpl-text-dim)]"
3675
- }, hl = {
3676
- key: 1,
3677
- "data-testid": "merge-tag-picker-sample",
3678
- class: "tpl:line-clamp-1 tpl:text-xs tpl:text-ellipsis tpl:text-[var(--tpl-text-dim)]"
3679
- }, gl = "tpl-merge-tag-picker-list", _l = /* @__PURE__ */ M({
3680
- __name: "MergeTagPickerModal",
3681
- setup(e) {
3682
- let t = Me(Ie, "MergeTagPickerModal"), { t: n, format: i } = W(), a = d(Ve, null), o = d(Be, null), c = m(""), p = ke(c, 200), h = m(null), T = v(() => p.value.trim().length > 0), D = m(0), k = v(() => t.tags.value.some((e) => !!e.group)), j = m(/* @__PURE__ */ new Set());
3683
- function M(e) {
3684
- return j.value.has(e);
3685
- }
3686
- function F(e) {
3687
- let t = new Set(j.value);
3688
- t.has(e) ? t.delete(e) : t.add(e), j.value = t, D.value = 0;
3689
- }
3690
- let I = v(() => {
3691
- let e = p.value.trim().toLowerCase();
3692
- return e ? t.tags.value.filter((t) => [
3693
- t.label,
3694
- t.value,
3695
- t.description ?? ""
3696
- ].join(" ").toLowerCase().includes(e)) : t.tags.value;
3697
- }), L = v(() => {
3698
- if (!k.value) return [];
3699
- let e = n.mergeTag.picker.otherGroup, r = /* @__PURE__ */ new Set(), i = [];
3700
- for (let n of t.tags.value) {
3701
- let t = n.group ?? e;
3702
- r.has(t) || (r.add(t), i.push(t));
3703
- }
3704
- return i;
3705
- }), R = v(() => {
3706
- let e = I.value;
3707
- if (!k.value || T.value) return e.map((e, t) => ({
3708
- kind: "tag",
3709
- tag: e,
3710
- index: t
3711
- }));
3712
- let t = n.mergeTag.picker.otherGroup, r = /* @__PURE__ */ new Map(), i = [];
3713
- for (let n of e) {
3714
- let e = n.group ?? t;
3715
- r.has(e) || (r.set(e, []), i.push(e)), r.get(e).push(n);
3716
- }
3717
- let a = [], o = 0;
3718
- for (let e of i) {
3719
- let t = r.get(e);
3720
- if (a.push({
3721
- kind: "header",
3722
- group: e,
3723
- count: t.length
3724
- }), !j.value.has(e)) for (let e of t) a.push({
3725
- kind: "tag",
3726
- tag: e,
3727
- index: o
3728
- }), o++;
3729
- }
3730
- return a;
3731
- }), z = v(() => R.value.flatMap((e) => e.kind === "tag" ? [e.tag] : []));
3732
- P(() => t.isOpen.value, (e) => {
3733
- e && (c.value = "", D.value = 0, j.value = /* @__PURE__ */ new Set(), l(() => {
3734
- h.value?.focus();
3735
- }));
3736
- }), P(z, (e) => {
3737
- D.value >= e.length && (D.value = Math.max(0, e.length - 1));
3738
- });
3739
- function B(e) {
3740
- t.resolve(e);
3741
- }
3742
- function V() {
3743
- t.resolve(null);
3744
- }
3745
- function H(e) {
3746
- if (z.value.length === 0) return;
3747
- let t = D.value + e;
3748
- D.value = Math.max(0, Math.min(z.value.length - 1, t)), ie();
3749
- }
3750
- let te = m(null), ne = m({});
3751
- function re(e, t) {
3752
- ne.value[e] = t ?? null;
3753
- }
3754
- function ie() {
3755
- l(() => {
3756
- let e = te.value;
3757
- e && e.querySelector(`[data-merge-tag-index="${D.value}"]`)?.scrollIntoView({ block: "nearest" });
3758
- });
3759
- }
3760
- function ae(e) {
3761
- if (j.value.has(e)) {
3762
- let t = new Set(j.value);
3763
- t.delete(e), j.value = t;
3764
- }
3765
- l(() => {
3766
- let t = te.value;
3767
- if (!t) return;
3768
- let n = 0, r = !1;
3769
- for (let i of Array.from(t.children)) {
3770
- if (i.dataset.testid === "merge-tag-picker-group-header" && i.dataset.groupName === e) {
3771
- r = !0;
3772
- break;
3773
- }
3774
- n += i.offsetHeight;
3775
- }
3776
- r && t.scrollTo({
3777
- top: n,
3778
- behavior: "smooth"
3779
- });
3780
- });
3781
- }
3782
- function oe(e) {
3783
- if (e.key === "ArrowDown") e.preventDefault(), H(1);
3784
- else if (e.key === "ArrowUp") e.preventDefault(), H(-1);
3785
- else if (e.key === "Enter") {
3786
- e.preventDefault();
3787
- let t = z.value[D.value];
3788
- t && B(t);
3789
- }
3790
- }
3791
- function U() {
3792
- if (z.value.length !== 0) return `${gl}-opt-${D.value}`;
3793
- }
3794
- function se(e) {
3795
- return `${gl}-opt-${e}`;
3796
- }
3797
- let ce = v(() => t.tags.value.length === 0), le = v(() => !ce.value && I.value.length === 0), ue = v(() => k.value && L.value.length > 1 && !T.value);
3798
- return (e, l) => (s(), w(on, {
3799
- visible: x(t).isOpen.value,
3800
- onClose: V,
3801
- onKeydown: oe
3802
- }, {
3803
- default: f(() => [E("div", {
3804
- role: "dialog",
3805
- "aria-modal": "true",
3806
- "aria-labelledby": `${gl}-title`,
3807
- "data-tpl-theme": x(o),
3808
- "data-testid": "merge-tag-picker-modal",
3809
- class: "tpl tpl:flex tpl:max-h-[80vh] tpl:w-[min(420px,92vw)] tpl:flex-col tpl:rounded-[var(--tpl-radius)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-elevated)] tpl:shadow-[var(--tpl-shadow-lg)]",
3810
- style: _(x(a))
3811
- }, [
3812
- E("header", $c, [E("h2", {
3813
- id: `${gl}-title`,
3814
- class: "tpl:m-0 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]"
3815
- }, C(x(n).mergeTag.picker.title), 9, el), E("button", {
3816
- type: "button",
3817
- class: "tpl:flex tpl:h-7 tpl:w-7 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded-[var(--tpl-radius-sm)] tpl:border-none tpl:bg-transparent tpl:text-[var(--tpl-text-dim)] tpl:transition-colors tpl:hover:bg-[var(--tpl-bg-hover)] tpl:hover:text-[var(--tpl-text)]",
3818
- "aria-label": x(n).mergeTag.picker.close,
3819
- "data-testid": "merge-tag-picker-close",
3820
- onClick: V
3821
- }, [N(x(jt), {
3822
- size: 16,
3823
- "stroke-width": 2
3824
- })], 8, tl)]),
3825
- E("div", nl, [N(x(dt), {
3826
- class: "tpl:pointer-events-none tpl:absolute tpl:top-1/2 tpl:left-5 tpl:-translate-y-1/2 tpl:text-[var(--tpl-text-dim)]",
3827
- size: 14,
3828
- "stroke-width": 2
3829
- }), r(E("input", {
3830
- id: `${gl}-search`,
3831
- ref_key: "searchInputRef",
3832
- ref: h,
3833
- "onUpdate:modelValue": l[0] ||= (e) => c.value = e,
3834
- type: "text",
3835
- class: "tpl:w-full tpl:rounded-[var(--tpl-radius-sm)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:py-1.5 tpl:pr-3 tpl:pl-8 tpl:text-sm tpl:text-[var(--tpl-text)] tpl:outline-none tpl:focus:border-[var(--tpl-primary)]",
3836
- placeholder: x(n).mergeTag.picker.searchPlaceholder,
3837
- "aria-label": x(n).mergeTag.picker.searchAriaLabel,
3838
- "aria-controls": gl,
3839
- "aria-activedescendant": U(),
3840
- "data-testid": "merge-tag-picker-search",
3841
- onKeydown: l[1] ||= g(S(() => {}, ["prevent"]), ["enter"])
3842
- }, null, 40, rl), [[ee, c.value]])]),
3843
- ue.value ? (s(), y("div", il, [(s(!0), y(A, null, u(L.value, (e) => (s(), y("button", {
3844
- key: e,
3845
- type: "button",
3846
- class: "tpl:flex tpl:flex-shrink-0 tpl:cursor-pointer tpl:items-center tpl:rounded-full tpl:border tpl:border-[var(--tpl-border)] tpl:bg-transparent tpl:px-2.5 tpl:py-0.5 tpl:text-[11px] tpl:font-medium tpl:text-[var(--tpl-text-dim)] tpl:transition-colors tpl:hover:bg-[var(--tpl-bg-hover)] tpl:hover:text-[var(--tpl-text)]",
3847
- "data-testid": "merge-tag-picker-group-pill",
3848
- "data-group-name": e,
3849
- onClick: (t) => ae(e)
3850
- }, C(e), 9, al))), 128))])) : b("", !0),
3851
- E("div", {
3852
- id: gl,
3853
- ref_key: "listRef",
3854
- ref: te,
3855
- class: "tpl:relative tpl:max-h-[60vh] tpl:flex-1 tpl:overflow-y-auto",
3856
- role: "listbox",
3857
- "aria-label": x(n).mergeTag.picker.title,
3858
- "data-testid": "merge-tag-picker-list"
3859
- }, [ce.value ? (s(), y("div", sl, C(x(n).mergeTag.picker.empty), 1)) : le.value ? (s(), y("div", cl, C(x(n).mergeTag.picker.noResults), 1)) : (s(!0), y(A, { key: 2 }, u(R.value, (e, t) => (s(), y(A, { key: t }, [e.kind === "header" ? (s(), y("button", {
3860
- key: 0,
3861
- ref_for: !0,
3862
- ref: (t) => re(e.group, t),
3863
- type: "button",
3864
- "aria-expanded": !M(e.group),
3865
- "aria-controls": gl,
3866
- class: "tpl:sticky tpl:top-0 tpl:z-10 tpl:flex tpl:w-full tpl:cursor-pointer tpl:items-center tpl:gap-1.5 tpl:border-none tpl:bg-[var(--tpl-bg-elevated)] tpl:px-3 tpl:pt-2.5 tpl:pb-1 tpl:text-left tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text-dim)] tpl:transition-colors tpl:hover:bg-[var(--tpl-bg-hover)]",
3867
- "data-testid": "merge-tag-picker-group-header",
3868
- "data-group-name": e.group,
3869
- "data-group-collapsed": M(e.group) ? "true" : "false",
3870
- onClick: (t) => F(e.group)
3871
- }, [
3872
- N(x(lt), {
3873
- size: 12,
3874
- "stroke-width": 2,
3875
- class: O(["tpl:transition-transform", M(e.group) ? "tpl:-rotate-90" : ""])
3876
- }, null, 8, ["class"]),
3877
- E("span", null, C(e.group), 1),
3878
- E("span", ul, " (" + C(x(i)(x(n).mergeTag.picker.groupCount, { count: e.count })) + ") ", 1)
3879
- ], 8, ll)) : (s(), y("button", {
3880
- key: 1,
3881
- id: se(e.index),
3882
- type: "button",
3883
- role: "option",
3884
- "aria-selected": e.index === D.value,
3885
- "data-selected": e.index === D.value ? "true" : "false",
3886
- "data-merge-tag-index": e.index,
3887
- "data-merge-tag-value": e.tag.value,
3888
- title: e.tag.description ? `${e.tag.value} — ${e.tag.description}` : e.tag.value,
3889
- class: O(["tpl:flex tpl:w-full tpl:cursor-pointer tpl:flex-col tpl:items-start tpl:gap-0.5 tpl:border-none tpl:px-3 tpl:py-1.5 tpl:text-left tpl:transition-colors", e.index === D.value ? "tpl:bg-[var(--tpl-primary-light)] tpl:text-[var(--tpl-primary)]" : "tpl:bg-transparent tpl:text-[var(--tpl-text)] tpl:hover:bg-[var(--tpl-bg-hover)]"]),
3890
- "data-testid": "merge-tag-picker-item",
3891
- onMousemove: (t) => D.value = e.index,
3892
- onClick: (t) => B(e.tag)
3893
- }, [
3894
- E("span", fl, C(e.tag.label), 1),
3895
- E("span", pl, C(e.tag.value), 1),
3896
- e.tag.description ? (s(), y("span", ml, C(e.tag.description), 1)) : b("", !0),
3897
- e.tag.sample === void 0 ? b("", !0) : (s(), y("span", hl, C(x(i)(x(n).mergeTag.picker.sample, { sample: e.tag.sample })), 1))
3898
- ], 42, dl))], 64))), 128))], 8, ol)
3899
- ], 12, Qc)]),
3900
- _: 1
3901
- }, 8, ["visible"]));
3902
- }
3903
- }), vl = ["data-logic-keyword"], yl = /* @__PURE__ */ M({
3904
- __name: "LogicTagBadge",
3905
- props: {
3906
- value: {},
3907
- syntax: {}
3908
- },
3909
- setup(e) {
3910
- let t = e, n = v(() => V(t.value, t.syntax)), r = v(() => z(t.value, t.syntax));
3911
- return (e, t) => n.value ? (s(), y("span", {
3912
- key: 0,
3913
- class: "tpl:inline-flex tpl:flex-shrink-0 tpl:items-center tpl:rounded tpl:px-1.5 tpl:py-0.5 tpl:text-[10px] tpl:leading-none tpl:font-bold tpl:tracking-wide tpl:uppercase",
3914
- style: {
3915
- border: "1.5px solid\n color-mix(in srgb, var(--tpl-primary) 50%, transparent)",
3916
- color: "var(--tpl-primary)"
3917
- },
3918
- "data-testid": "merge-tag-logic-badge",
3919
- "data-logic-keyword": r.value
3920
- }, C(r.value), 9, vl)) : b("", !0);
3921
- }
3922
- }), bl = ["aria-labelledby", "data-tpl-theme"], xl = { class: "tpl:flex tpl:items-center tpl:justify-between tpl:gap-3 tpl:border-b tpl:border-[var(--tpl-border)] tpl:px-3 tpl:py-2.5" }, Sl = ["id"], Cl = ["aria-label"], wl = { class: "tpl:relative tpl:border-b tpl:border-[var(--tpl-border)] tpl:px-3 tpl:py-2.5" }, Tl = [
3923
- "id",
3924
- "placeholder",
3925
- "aria-label",
3926
- "aria-activedescendant"
3927
- ], El = ["aria-label"], Dl = {
3928
- key: 0,
3929
- class: "tpl:px-3 tpl:py-6 tpl:text-center tpl:text-xs tpl:text-[var(--tpl-text-dim)]",
3930
- "data-testid": "logic-picker-empty"
3931
- }, Ol = {
3932
- key: 1,
3933
- class: "tpl:px-3 tpl:py-6 tpl:text-center tpl:text-xs tpl:text-[var(--tpl-text-dim)]",
3934
- "data-testid": "logic-picker-empty"
3935
- }, kl = ["data-group-name"], Al = [
3936
- "id",
3937
- "aria-selected",
3938
- "data-selected",
3939
- "data-logic-index",
3940
- "data-logic-kind",
3941
- "onMousemove",
3942
- "onClick"
3943
- ], jl = { class: "tpl:flex tpl:w-full tpl:items-center tpl:justify-between tpl:gap-2" }, Ml = { class: "tpl:text-sm tpl:font-medium" }, Nl = {
3944
- key: 0,
3945
- class: "tpl:flex tpl:items-center"
3946
- }, Pl = {
3947
- key: 1,
3948
- class: "tpl:flex tpl:items-center tpl:gap-1"
3949
- }, Fl = { class: "tpl:line-clamp-2 tpl:font-mono tpl:text-xs tpl:text-ellipsis tpl:break-all tpl:text-[var(--tpl-text-dim)]" }, Il = {
3950
- key: 0,
3951
- class: "tpl:line-clamp-2 tpl:text-xs tpl:text-ellipsis tpl:text-[var(--tpl-text-dim)]"
3952
- }, Ll = "tpl-logic-picker-list", Rl = /* @__PURE__ */ M({
3953
- __name: "LogicTagPickerModal",
3954
- setup(e) {
3955
- let t = Me(ze, "LogicTagPickerModal"), { t: n } = W(), i = d(Ae, ne.liquid), a = d(Ve, null), o = d(Be, null), c = m(""), p = ke(c, 200), h = m(null), T = v(() => p.value.trim().length > 0), D = m(0);
3956
- function k(e) {
3957
- let t = p.value.trim().toLowerCase();
3958
- return !t || e.filter(Boolean).join(" ").toLowerCase().includes(t);
3959
- }
3960
- let j = v(() => t.tags.value.filter((e) => k([
3961
- e.label,
3962
- e.value,
3963
- e.description
3964
- ]))), M = v(() => t.pairs.value.filter((e) => k([
3965
- e.label,
3966
- e.before,
3967
- e.after,
3968
- e.description
3969
- ]))), F = v(() => [...M.value.map((e) => ({
3970
- kind: "pair",
3971
- pair: e,
3972
- group: e.group
3973
- })), ...j.value.map((e) => ({
3974
- kind: "tag",
3975
- tag: e,
3976
- group: e.group
3977
- }))]), I = v(() => t.tags.value.some((e) => !!e.group) || t.pairs.value.some((e) => !!e.group));
3978
- function L(e) {
3979
- let t = n.logicTag.picker.otherGroup, r = /* @__PURE__ */ new Map(), i = [];
3980
- for (let n of e) {
3981
- let e = n.group ?? t;
3982
- r.has(e) || (r.set(e, []), i.push(e)), r.get(e).push(n);
3983
- }
3984
- return i.map((e) => [e, r.get(e)]);
3985
- }
3986
- let R = v(() => {
3987
- let e = [], t = [], n = 0, r = (r) => {
3988
- r.kind === "tag" ? (e.push({
3989
- kind: "tag",
3990
- tag: r.tag,
3991
- index: n
3992
- }), t.push(r.tag)) : (e.push({
3993
- kind: "pair",
3994
- pair: r.pair,
3995
- index: n
3996
- }), t.push(r.pair)), n++;
3997
- }, i = F.value;
3998
- if (T.value || !I.value) for (let e of i) r(e);
3999
- else for (let [t, n] of L(i)) {
4000
- e.push({
4001
- kind: "header",
4002
- label: t
4003
- });
4004
- for (let e of n) r(e);
4005
- }
4006
- return {
4007
- rows: e,
4008
- items: t
4009
- };
4010
- }), z = v(() => R.value.items), B = v(() => t.tags.value.length === 0 && t.pairs.value.length === 0), V = v(() => !B.value && z.value.length === 0);
4011
- P(() => t.isOpen.value, (e) => {
4012
- e && (c.value = "", D.value = 0, l(() => h.value?.focus()));
4013
- }), P(z, (e) => {
4014
- D.value >= e.length && (D.value = Math.max(0, e.length - 1));
4015
- });
4016
- let H = m(null);
4017
- function te(e) {
4018
- t.resolve(e);
4019
- }
4020
- function re() {
4021
- t.resolve(null);
4022
- }
4023
- function ie(e) {
4024
- z.value.length !== 0 && (D.value = Math.max(0, Math.min(z.value.length - 1, D.value + e)), l(() => {
4025
- H.value?.querySelector(`[data-logic-index="${D.value}"]`)?.scrollIntoView({ block: "nearest" });
4026
- }));
4027
- }
4028
- function ae(e) {
4029
- if (e.key === "ArrowDown") e.preventDefault(), ie(1);
4030
- else if (e.key === "ArrowUp") e.preventDefault(), ie(-1);
4031
- else if (e.key === "Enter") {
4032
- e.preventDefault();
4033
- let t = z.value[D.value];
4034
- t && te(t);
4035
- }
4036
- }
4037
- function oe(e) {
4038
- return `${Ll}-opt-${e}`;
4039
- }
4040
- function U() {
4041
- return z.value.length === 0 ? void 0 : `${Ll}-opt-${D.value}`;
4042
- }
4043
- return (e, l) => (s(), w(on, {
4044
- visible: x(t).isOpen.value,
4045
- onClose: re,
4046
- onKeydown: ae
4047
- }, {
4048
- default: f(() => [E("div", {
4049
- role: "dialog",
4050
- "aria-modal": "true",
4051
- "aria-labelledby": `${Ll}-title`,
4052
- "data-tpl-theme": x(o),
4053
- "data-testid": "logic-picker-modal",
4054
- class: "tpl tpl:flex tpl:max-h-[80vh] tpl:w-[min(420px,92vw)] tpl:flex-col tpl:rounded-[var(--tpl-radius)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-elevated)] tpl:shadow-[var(--tpl-shadow-lg)]",
4055
- style: _(x(a))
4056
- }, [
4057
- E("header", xl, [E("h2", {
4058
- id: `${Ll}-title`,
4059
- class: "tpl:m-0 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]"
4060
- }, C(x(n).logicTag.picker.title), 9, Sl), E("button", {
4061
- type: "button",
4062
- class: "tpl:flex tpl:h-7 tpl:w-7 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded-[var(--tpl-radius-sm)] tpl:border-none tpl:bg-transparent tpl:text-[var(--tpl-text-dim)] tpl:transition-colors tpl:hover:bg-[var(--tpl-bg-hover)] tpl:hover:text-[var(--tpl-text)]",
4063
- "aria-label": x(n).logicTag.picker.close,
4064
- "data-testid": "logic-picker-close",
4065
- onClick: re
4066
- }, [N(x(jt), {
4067
- size: 16,
4068
- "stroke-width": 2
4069
- })], 8, Cl)]),
4070
- E("div", wl, [N(x(dt), {
4071
- class: "tpl:pointer-events-none tpl:absolute tpl:top-1/2 tpl:left-5 tpl:-translate-y-1/2 tpl:text-[var(--tpl-text-dim)]",
4072
- size: 14,
4073
- "stroke-width": 2
4074
- }), r(E("input", {
4075
- id: `${Ll}-search`,
4076
- ref_key: "searchInputRef",
4077
- ref: h,
4078
- "onUpdate:modelValue": l[0] ||= (e) => c.value = e,
4079
- type: "text",
4080
- class: "tpl:w-full tpl:rounded-[var(--tpl-radius-sm)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:py-1.5 tpl:pr-3 tpl:pl-8 tpl:text-sm tpl:text-[var(--tpl-text)] tpl:outline-none tpl:focus:border-[var(--tpl-primary)]",
4081
- placeholder: x(n).logicTag.picker.searchPlaceholder,
4082
- "aria-label": x(n).logicTag.picker.searchAriaLabel,
4083
- "aria-controls": Ll,
4084
- "aria-activedescendant": U(),
4085
- "data-testid": "logic-picker-search",
4086
- onKeydown: l[1] ||= g(S(() => {}, ["prevent"]), ["enter"])
4087
- }, null, 40, Tl), [[ee, c.value]])]),
4088
- E("div", {
4089
- id: Ll,
4090
- ref_key: "listRef",
4091
- ref: H,
4092
- class: "tpl:relative tpl:max-h-[60vh] tpl:flex-1 tpl:overflow-y-auto",
4093
- role: "listbox",
4094
- "aria-label": x(n).logicTag.picker.title,
4095
- "data-testid": "logic-picker-list"
4096
- }, [B.value ? (s(), y("div", Dl, C(x(n).logicTag.picker.empty), 1)) : V.value ? (s(), y("div", Ol, C(x(n).logicTag.picker.noResults), 1)) : (s(!0), y(A, { key: 2 }, u(R.value.rows, (e, t) => (s(), y(A, { key: t }, [e.kind === "header" ? (s(), y("div", {
4097
- key: 0,
4098
- class: "tpl:px-3 tpl:pt-2.5 tpl:pb-1 tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text-dim)]",
4099
- "data-testid": "logic-picker-header",
4100
- "data-group-name": e.label
4101
- }, C(e.label), 9, kl)) : (s(), y("button", {
4102
- key: 1,
4103
- id: oe(e.index),
4104
- type: "button",
4105
- role: "option",
4106
- "aria-selected": e.index === D.value,
4107
- "data-selected": e.index === D.value ? "true" : "false",
4108
- "data-logic-index": e.index,
4109
- "data-logic-kind": e.kind,
4110
- class: O(["tpl:flex tpl:w-full tpl:cursor-pointer tpl:flex-col tpl:items-start tpl:gap-0.5 tpl:border-none tpl:px-3 tpl:py-1.5 tpl:text-left tpl:transition-colors", e.index === D.value ? "tpl:bg-[var(--tpl-primary-light)] tpl:text-[var(--tpl-primary)]" : "tpl:bg-transparent tpl:text-[var(--tpl-text)] tpl:hover:bg-[var(--tpl-bg-hover)]"]),
4111
- "data-testid": "logic-picker-item",
4112
- onMousemove: (t) => D.value = e.index,
4113
- onClick: (t) => te(e.kind === "tag" ? e.tag : e.pair)
4114
- }, [
4115
- E("span", jl, [E("span", Ml, C(e.kind === "tag" ? e.tag.label : e.pair.label), 1), e.kind === "tag" ? (s(), y("span", Nl, [N(yl, {
4116
- value: e.tag.value,
4117
- syntax: x(i)
4118
- }, null, 8, ["value", "syntax"])])) : (s(), y("span", Pl, [
4119
- N(yl, {
4120
- value: e.pair.before,
4121
- syntax: x(i)
4122
- }, null, 8, ["value", "syntax"]),
4123
- l[2] ||= E("span", { class: "tpl:text-[var(--tpl-text-dim)]" }, "…", -1),
4124
- N(yl, {
4125
- value: e.pair.after,
4126
- syntax: x(i)
4127
- }, null, 8, ["value", "syntax"])
4128
- ]))]),
4129
- E("span", Fl, C(e.kind === "tag" ? e.tag.value : `${e.pair.before} … ${e.pair.after}`), 1),
4130
- (e.kind === "tag" ? e.tag.description : e.pair.description) ? (s(), y("span", Il, C(e.kind === "tag" ? e.tag.description : e.pair.description), 1)) : b("", !0)
4131
- ], 42, Al))], 64))), 128))], 8, El)
4132
- ], 12, bl)]),
4133
- _: 1
4134
- }, 8, ["visible"]));
4135
- }
4136
- });
4137
- //#endregion
4138
- export { Kc as a, Fn as c, fn as d, dn as f, Jc as i, En as l, sn as m, _l as n, Wc as o, ln as p, Zc as r, zc as s, Rl as t, Tn as u };
4139
-
4140
- //# sourceMappingURL=styles-CND3ey2g.js.map