@templatical/editor 0.13.0 → 0.15.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 (178) hide show
  1. package/dist/{AiChatSidebar-B0-U5-sb.js → AiChatSidebar-BIKvYREk.js} +57 -56
  2. package/dist/{AiFeatureMenu-DxDwLS8B.js → AiFeatureMenu-QbD82crt.js} +23 -23
  3. package/dist/{BlockIssueBadge-C-EPqWsh.js → BlockIssueBadge-B3xVgMTh.js} +11 -11
  4. package/dist/CloudEditor-DptuSf7A.js +1234 -0
  5. package/dist/{CollaboratorBar-DgwjisX2.js → CollaboratorBar-DrA_K69w.js} +20 -20
  6. package/dist/{CommentsSidebar-CpRLN40c.js → CommentsSidebar-D_tSGvTX.js} +158 -157
  7. package/dist/CountdownBlock-apiYUhkQ.js +92 -0
  8. package/dist/CountdownToolbar-CS0axcjz.js +210 -0
  9. package/dist/{DesignReferenceSidebar-BgPDbOsl.js → DesignReferenceSidebar-DWYK9nTk.js} +58 -57
  10. package/dist/{IssuesPanel-I0z6k6-H.js → IssuesPanel-CR1MPaDE.js} +40 -40
  11. package/dist/{LoadingTrack-C7mGWPHS.js → LoadingTrack-DsecR8Rw.js} +1 -1
  12. package/dist/MergeTagSuggestion-CH2SUxBo.js +1327 -0
  13. package/dist/ModuleBrowserModal-D45rBj5C.js +202 -0
  14. package/dist/{ModulePreviewCanvas-Dni9kK4j.js → ModulePreviewCanvas-BiQ6B2-l.js} +29 -29
  15. package/dist/{NumberWithSuffix-D3fdj0iO.js → NumberWithSuffix-CrA6quxx.js} +143 -142
  16. package/dist/ParagraphEditor-1NaUJpZO.js +721 -0
  17. package/dist/{RichTextEditorContent-Q5altsx1.js → RichTextEditorContent-BqLHIZY7.js} +45 -44
  18. package/dist/{SaveModuleDialog-C38VqN2T.js → SaveModuleDialog-B0sPOTgO.js} +38 -37
  19. package/dist/{SnapshotHistory-ByloTpwh.js → SnapshotHistory-DslVzmSb.js} +34 -33
  20. package/dist/{TemplateScoringPanel-CUxiPtEf.js → TemplateScoringPanel-CZ62rGHz.js} +83 -82
  21. package/dist/{TestEmailModal-BvZBMBad.js → TestEmailModal-DWGniJVu.js} +22 -21
  22. package/dist/TitleEditor-D4t_gZZJ.js +193 -0
  23. package/dist/{TplModal-BYb-X5Bj.js → TplModal-Br2VG6cn.js} +14 -13
  24. package/dist/{blockTypeIcons-CyAom3iI.js → blockTypeIcons-CXhCS5WV.js} +5 -5
  25. package/dist/bundle-stats.json +8 -8
  26. package/dist/cdn/chunks/{AiFeatureMenu-BSoy-SoF.js → AiFeatureMenu-3Slo_LGA.js} +8 -8
  27. package/dist/cdn/chunks/{AiFeatureMenu-BSoy-SoF.js.map → AiFeatureMenu-3Slo_LGA.js.map} +1 -1
  28. package/dist/cdn/chunks/{BlockIssueBadge-BQDUuJxy.js → BlockIssueBadge-BxwEiiF3.js} +5 -5
  29. package/dist/cdn/chunks/{BlockIssueBadge-BQDUuJxy.js.map → BlockIssueBadge-BxwEiiF3.js.map} +1 -1
  30. package/dist/cdn/chunks/{CloudEditor-BZuzsQOZ.js → CloudEditor-DFIFWD9G.js} +163 -161
  31. package/dist/cdn/chunks/CloudEditor-DFIFWD9G.js.map +1 -0
  32. package/dist/cdn/chunks/{CollaboratorBar-DUpSrtDr.js → CollaboratorBar-Cu3vuN66.js} +4 -4
  33. package/dist/cdn/chunks/{CollaboratorBar-DUpSrtDr.js.map → CollaboratorBar-Cu3vuN66.js.map} +1 -1
  34. package/dist/cdn/chunks/{CountdownBlock-DChGTAsH.js → CountdownBlock-BEVAJQtQ.js} +3 -3
  35. package/dist/cdn/chunks/{CountdownBlock-DChGTAsH.js.map → CountdownBlock-BEVAJQtQ.js.map} +1 -1
  36. package/dist/cdn/chunks/{CountdownToolbar-C6gX2SJr.js → CountdownToolbar-CI2sQZv5.js} +4 -4
  37. package/dist/cdn/chunks/{CountdownToolbar-C6gX2SJr.js.map → CountdownToolbar-CI2sQZv5.js.map} +1 -1
  38. package/dist/cdn/chunks/{IssuesPanel-Bo1uhdSe.js → IssuesPanel-BdeDoTcn.js} +11 -11
  39. package/dist/cdn/chunks/{IssuesPanel-Bo1uhdSe.js.map → IssuesPanel-BdeDoTcn.js.map} +1 -1
  40. package/dist/cdn/chunks/MergeTagSuggestion-BsCAo4Co.js +213 -0
  41. package/dist/cdn/chunks/MergeTagSuggestion-BsCAo4Co.js.map +1 -0
  42. package/dist/cdn/chunks/{ModuleBrowserModal-a-tZRCcD.js → ModuleBrowserModal-Dz-I5zfj.js} +11 -8
  43. package/dist/cdn/chunks/{ModuleBrowserModal-a-tZRCcD.js.map → ModuleBrowserModal-Dz-I5zfj.js.map} +1 -1
  44. package/dist/cdn/chunks/{ModulePreviewCanvas-Bm6k0Op0.js → ModulePreviewCanvas-BfinyuAN.js} +21 -21
  45. package/dist/cdn/chunks/{ModulePreviewCanvas-Bm6k0Op0.js.map → ModulePreviewCanvas-BfinyuAN.js.map} +1 -1
  46. package/dist/cdn/chunks/{NumberWithSuffix-HTbuD3VJ.js → NumberWithSuffix-CDjEa08X.js} +4 -4
  47. package/dist/cdn/chunks/{NumberWithSuffix-HTbuD3VJ.js.map → NumberWithSuffix-CDjEa08X.js.map} +1 -1
  48. package/dist/cdn/chunks/{ParagraphEditor-pGrfSccu.js → ParagraphEditor-B3fG0vge.js} +130 -110
  49. package/dist/cdn/chunks/ParagraphEditor-B3fG0vge.js.map +1 -0
  50. package/dist/cdn/chunks/{RichTextEditorContent-D7XZix_1.js → RichTextEditorContent-C6YPCp9j.js} +4 -4
  51. package/dist/cdn/chunks/{RichTextEditorContent-D7XZix_1.js.map → RichTextEditorContent-C6YPCp9j.js.map} +1 -1
  52. package/dist/cdn/chunks/{SaveModuleDialog-C9PQ9x6j.js → SaveModuleDialog-C6UIIVAM.js} +6 -6
  53. package/dist/cdn/chunks/{SaveModuleDialog-C9PQ9x6j.js.map → SaveModuleDialog-C6UIIVAM.js.map} +1 -1
  54. package/dist/cdn/chunks/{TitleEditor-BvFbL16O.js → TitleEditor-BiZbLYF1.js} +62 -46
  55. package/dist/cdn/chunks/TitleEditor-BiZbLYF1.js.map +1 -0
  56. package/dist/cdn/chunks/blockTypeIcons-BernVG06.js +22 -0
  57. package/dist/cdn/chunks/{blockTypeIcons-Kd1MT0u8.js.map → blockTypeIcons-BernVG06.js.map} +1 -1
  58. package/dist/{de-C2wOXoxs.js → cdn/chunks/de-LsV0u1tP.js} +19 -1
  59. package/dist/cdn/chunks/de-LsV0u1tP.js.map +1 -0
  60. package/dist/cdn/chunks/{draggable-Bci-fq8y.js → draggable-kG-D5Xsm.js} +19 -10
  61. package/dist/cdn/chunks/draggable-kG-D5Xsm.js.map +1 -0
  62. package/dist/cdn/chunks/{en-dR7zfNC3.js → en-Bb8X1bOs.js} +18 -2
  63. package/dist/cdn/chunks/en-Bb8X1bOs.js.map +1 -0
  64. package/dist/cdn/chunks/extensions-Drp8UDc6.js +421 -0
  65. package/dist/cdn/chunks/extensions-Drp8UDc6.js.map +1 -0
  66. package/dist/cdn/chunks/{features-DU6lA8l1.js → features-Dpczf9Su.js} +1171 -994
  67. package/dist/cdn/chunks/features-Dpczf9Su.js.map +1 -0
  68. package/dist/cdn/chunks/{icons-BjHUZZyJ.js → icons-CuxnJiGQ.js} +170 -164
  69. package/dist/cdn/chunks/icons-CuxnJiGQ.js.map +1 -0
  70. package/dist/cdn/chunks/{liquid.browser-DKKBzRQu.js → liquid.browser-BJOEu6Cg.js} +693 -678
  71. package/dist/cdn/chunks/liquid.browser-BJOEu6Cg.js.map +1 -0
  72. package/dist/cdn/chunks/{media-library-Byelliig.js → media-library-CiYl_BO7.js} +556 -554
  73. package/dist/cdn/chunks/{media-library-Byelliig.js.map → media-library-CiYl_BO7.js.map} +1 -1
  74. package/dist/cdn/chunks/{pt-BR-BZ86xqK6.js → pt-BR-BwJY_cvb.js} +18 -2
  75. package/dist/cdn/chunks/pt-BR-BwJY_cvb.js.map +1 -0
  76. package/dist/cdn/chunks/{pusher-BICWUP2j.js → pusher-CIwiKF8H.js} +9 -6
  77. package/dist/cdn/chunks/{pusher-BICWUP2j.js.map → pusher-CIwiKF8H.js.map} +1 -1
  78. package/dist/cdn/chunks/quality-CNjGxBG0.js +2176 -0
  79. package/dist/cdn/chunks/{quality-DNnYAntR.js.map → quality-CNjGxBG0.js.map} +1 -1
  80. package/dist/cdn/chunks/{renderer-CZKO-Tav.js → renderer-CFkg8h-K.js} +40 -31
  81. package/dist/cdn/chunks/renderer-CFkg8h-K.js.map +1 -0
  82. package/dist/cdn/chunks/{src-DsqSXXjk.js → src-DRpKu4Dy.js} +11 -11
  83. package/dist/cdn/chunks/{src-DsqSXXjk.js.map → src-DRpKu4Dy.js.map} +1 -1
  84. package/dist/cdn/chunks/styles-B7wryV0l.js +3943 -0
  85. package/dist/cdn/chunks/styles-B7wryV0l.js.map +1 -0
  86. package/dist/cdn/chunks/{tiptap-CwScfbsM.js → tiptap-DF9PEiqH.js} +5429 -5373
  87. package/dist/cdn/chunks/tiptap-DF9PEiqH.js.map +1 -0
  88. package/dist/cdn/editor.css +1 -1
  89. package/dist/cdn/editor.js +117 -115
  90. package/dist/cdn/editor.js.map +1 -1
  91. package/dist/{check-BRzXxFHr.js → check-rl7ok6uJ.js} +1 -1
  92. package/dist/{chevron-down-DmEgzmYT.js → chevron-down-BKe__NOD.js} +1 -1
  93. package/dist/{circle-alert-BStvZr3O.js → circle-alert-C8xmpMsK.js} +1 -1
  94. package/dist/{clock-Blwp_1R6.js → clock-BW4JuDCN.js} +1 -1
  95. package/dist/{cloud-_olro76D.js → cloud-BQusL53H.js} +208 -208
  96. package/dist/createLucideIcon-Dx-EjR9r.js +43 -0
  97. package/dist/{cdn/chunks/de-C2wOXoxs.js → de-LsV0u1tP.js} +17 -3
  98. package/dist/{dist-BlG7k25W.js → dist-B5Sov3sS.js} +7 -7
  99. package/dist/dist-BEWiuOMi.js +251 -0
  100. package/dist/{dist-b7Ak-CuM.js → dist-BFmE-7hB.js} +2 -2
  101. package/dist/{dist-o73iaGqy.js → dist-BMoa33wT.js} +2 -2
  102. package/dist/{dist-BctFrpeA.js → dist-BibU4HNl.js} +74 -65
  103. package/dist/{dist-D6x1cQeh.js → dist-BsCGIDSt.js} +103 -102
  104. package/dist/dist-CNLKj9wa.js +5 -0
  105. package/dist/{dist-DULfKmTh.js → dist-CNXDNYQn.js} +729 -695
  106. package/dist/{dist-412xXefB.js → dist-COG3IdPK.js} +3 -3
  107. package/dist/{dist-Cz79qrLL.js → dist-CQZxDvFw.js} +3 -3
  108. package/dist/{dist-BwgjpLfr.js → dist-CRsjOQM-.js} +2 -2
  109. package/dist/dist-CTT6WYJ6.js +134 -0
  110. package/dist/dist-Cqa6aeAJ.js +5 -0
  111. package/dist/{dist-BCQZZUE9.js → dist-SXJJ2v41.js} +2 -2
  112. package/dist/{dist-DhKTdU52.js → dist-itdjZraK.js} +1445 -1420
  113. package/dist/{en-dR7zfNC3.js → en-Bb8X1bOs.js} +17 -1
  114. package/dist/extensions-DwaZAqm6.js +423 -0
  115. package/dist/{image-up-BFPbw_Zq.js → image-up-BwBCmQ4P.js} +1 -1
  116. package/dist/index.d.ts +17 -0
  117. package/dist/{info-B_qLEBN2.js → info-TCn7uWR5.js} +1 -1
  118. package/dist/keys-Cv8-8GsD.js +10 -0
  119. package/dist/{liquid.browser-CVjP5Mex.js → liquid.browser-DZLtv26k.js} +692 -677
  120. package/dist/{list-checks-CGg7JxPm.js → list-checks-CSrOWNgq.js} +1 -1
  121. package/dist/{loader-circle-CDF8eR_Q.js → loader-circle-BLmicnPG.js} +1 -1
  122. package/dist/{message-circle-C3cHsCJl.js → message-circle-C9hHMQCI.js} +1 -1
  123. package/dist/{pt-BR-BZ86xqK6.js → pt-BR-BwJY_cvb.js} +17 -1
  124. package/dist/{refresh-cw-Butml7Q4.js → refresh-cw-D1JQ1LNa.js} +1 -1
  125. package/dist/runtime-dom.esm-bundler-BzuoCyNp.js +523 -0
  126. package/dist/scan-line-DgijVq9y.js +31 -0
  127. package/dist/{send-k7npFJNO.js → send-DjPdq69F.js} +1 -1
  128. package/dist/{shield-check-CV6GbmCu.js → shield-check-Bqluu8FS.js} +1 -1
  129. package/dist/{sparkles-C965Xop4.js → sparkles-M4azPVSP.js} +1 -1
  130. package/dist/style.css +1 -1
  131. package/dist/styles-D7fQ7f_1.js +4164 -0
  132. package/dist/templatical-editor.js +155 -152
  133. package/dist/{text-align-start-Bxnps8fH.js → text-align-start-CMya5pCQ.js} +11 -11
  134. package/dist/{trash-2-DpGb7fIt.js → trash-2-C-81rkLS.js} +1 -1
  135. package/dist/{triangle-alert-BKYElAwz.js → triangle-alert-BuRWnynk.js} +1 -1
  136. package/dist/{upload-BF7sxd1_.js → upload-CWBIoLd4.js} +1 -1
  137. package/dist/{useAliveFlag-BinvbqQR.js → useAliveFlag-CECL_OUb.js} +1 -1
  138. package/dist/{useCloudI18n-L3H2XvdW.js → useCloudI18n-AKCy98qD.js} +2 -2
  139. package/dist/{useEditorCore-DKYZ7aKk.js → useEditorCore-vcWLdnjN.js} +1480 -1310
  140. package/dist/{useI18n-CTs_bP9d.js → useI18n-C-TDeJBt.js} +2 -2
  141. package/dist/{useMergeTag-e3RSY-s3.js → useMergeTag-DSrBY0-2.js} +6 -6
  142. package/dist/usePopoverRoot-DKUDnr55.js +8 -0
  143. package/dist/{vue.runtime.esm-bundler-B2k01iQh.js → vue.runtime.esm-bundler-l0XAqiyv.js} +639 -1151
  144. package/dist/{x-CGjkjdKK.js → x-CQSvXnGR.js} +1 -1
  145. package/package.json +27 -27
  146. package/dist/CloudEditor-DaEfipBn.js +0 -1230
  147. package/dist/CountdownBlock-DO9fziwf.js +0 -92
  148. package/dist/CountdownToolbar-BeII06yJ.js +0 -210
  149. package/dist/ModuleBrowserModal-DsZRr87F.js +0 -198
  150. package/dist/ParagraphEditor-CZ-cmhX3.js +0 -700
  151. package/dist/TitleEditor-DbNOcvhR.js +0 -177
  152. package/dist/cdn/chunks/CloudEditor-BZuzsQOZ.js.map +0 -1
  153. package/dist/cdn/chunks/ParagraphEditor-pGrfSccu.js.map +0 -1
  154. package/dist/cdn/chunks/TitleEditor-BvFbL16O.js.map +0 -1
  155. package/dist/cdn/chunks/blockTypeIcons-Kd1MT0u8.js +0 -22
  156. package/dist/cdn/chunks/de-C2wOXoxs.js.map +0 -1
  157. package/dist/cdn/chunks/draggable-Bci-fq8y.js.map +0 -1
  158. package/dist/cdn/chunks/en-dR7zfNC3.js.map +0 -1
  159. package/dist/cdn/chunks/extensions-CuUjSmuA.js +0 -605
  160. package/dist/cdn/chunks/extensions-CuUjSmuA.js.map +0 -1
  161. package/dist/cdn/chunks/features-DU6lA8l1.js.map +0 -1
  162. package/dist/cdn/chunks/icons-BjHUZZyJ.js.map +0 -1
  163. package/dist/cdn/chunks/liquid.browser-DKKBzRQu.js.map +0 -1
  164. package/dist/cdn/chunks/pt-BR-BZ86xqK6.js.map +0 -1
  165. package/dist/cdn/chunks/quality-DNnYAntR.js +0 -2176
  166. package/dist/cdn/chunks/renderer-CZKO-Tav.js.map +0 -1
  167. package/dist/cdn/chunks/styles-DiAdtiz9.js +0 -3428
  168. package/dist/cdn/chunks/styles-DiAdtiz9.js.map +0 -1
  169. package/dist/cdn/chunks/tiptap-CwScfbsM.js.map +0 -1
  170. package/dist/createLucideIcon-CmPAC-gt.js +0 -43
  171. package/dist/dist-BNEdeWub.js +0 -5
  172. package/dist/dist-Cgry6fNv.js +0 -382
  173. package/dist/dist-u0iIJH3V.js +0 -5
  174. package/dist/extensions-XPlNAKIL.js +0 -1720
  175. package/dist/keys-mFiJ5N0_.js +0 -10
  176. package/dist/scan-line-XYEqim_E.js +0 -25
  177. package/dist/styles-D0RCAWhB.js +0 -3647
  178. package/dist/usePopoverRoot-DVh7NY1q.js +0 -8
@@ -1,3647 +0,0 @@
1
- import { A as e, B as t, E as n, F as r, J as i, L as a, M as o, N as s, S as c, U as l, X as u, _ as d, a as f, at as p, b as m, c as h, d as g, f as _, h as v, l as y, m as b, o as x, ot as S, p as C, q as w, rt as T, s as E, st as D, t as O, v as k, w as A, y as j, z as M } from "./vue.runtime.esm-bundler-B2k01iQh.js";
2
- import { C as N, D as P, O as F, o as I, r as L, s as R, u as ee, w as z } from "./dist-BctFrpeA.js";
3
- import { A as B, E as te, F as ne, I as re, L as V, M as ie, N as ae, P as oe, _ as se, a as ce, c as le, f as ue, g as de, h as fe, i as pe, j as me, l as he, m as ge, n as _e, o as ve, p as ye, r as be, s as xe, u as Se, v as Ce, y as we } from "./useEditorCore-DKYZ7aKk.js";
4
- import { l as Te, o as Ee } from "./dist-Cgry6fNv.js";
5
- import { A as De, C as Oe, M as ke, N as Ae, S as je, T as Me, a as Ne, d as Pe, f as Fe, g as Ie, k as Le, m as Re, n as ze, o as Be, p as Ve, s as He, u as Ue, x as We } from "./keys-mFiJ5N0_.js";
6
- import { t as H } from "./useI18n-CTs_bP9d.js";
7
- import { t as U } from "./createLucideIcon-CmPAC-gt.js";
8
- import { t as Ge } from "./circle-alert-BStvZr3O.js";
9
- import { i as Ke, n as qe, r as Je, t as Ye } from "./blockTypeIcons-CyAom3iI.js";
10
- import { t as Xe } from "./loader-circle-CDF8eR_Q.js";
11
- import { t as Ze } from "./sparkles-C965Xop4.js";
12
- import { n as Qe, r as $e, t as et } from "./text-align-start-Bxnps8fH.js";
13
- import { t as tt } from "./chevron-down-DmEgzmYT.js";
14
- import { n as nt, t as rt } from "./refresh-cw-Butml7Q4.js";
15
- import { t as it } from "./image-up-BFPbw_Zq.js";
16
- import { t as at } from "./info-B_qLEBN2.js";
17
- import { t as ot } from "./list-checks-CGg7JxPm.js";
18
- import { t as st } from "./scan-line-XYEqim_E.js";
19
- import { t as ct } from "./trash-2-DpGb7fIt.js";
20
- import { t as lt } from "./upload-BF7sxd1_.js";
21
- import { t as ut } from "./x-CGjkjdKK.js";
22
- import { t as dt } from "./_plugin-vue_export-helper-B3ysoDQm.js";
23
- import { t as ft } from "./useCloudI18n-L3H2XvdW.js";
24
- import { t as pt } from "./useMergeTag-e3RSY-s3.js";
25
- import { t as mt } from "./useAliveFlag-BinvbqQR.js";
26
- import { t as ht } from "./readableTextColor-f8Kykfnh.js";
27
- import { t as gt } from "./CountdownBlock-DO9fziwf.js";
28
- import { _ as _t, c as vt, f as W, g as yt, h as G, l as bt, m as K, p as q, r as xt, t as St } from "./styleConstants-lGobwiLH.js";
29
- import { i as J, n as Y, r as X, t as Ct } from "./NumberWithSuffix-D3fdj0iO.js";
30
- import { t as wt } from "./TplModal-BYb-X5Bj.js";
31
- var Tt = U("lock-open", [["rect", {
32
- width: "18",
33
- height: "11",
34
- x: "3",
35
- y: "11",
36
- rx: "2",
37
- ry: "2",
38
- key: "1w4ew1"
39
- }], ["path", {
40
- d: "M7 11V7a5 5 0 0 1 9.9-1",
41
- key: "1mm8w8"
42
- }]]), Et = U("square-plus", [
43
- ["rect", {
44
- width: "18",
45
- height: "18",
46
- x: "3",
47
- y: "3",
48
- rx: "2",
49
- key: "afitv7"
50
- }],
51
- ["path", {
52
- d: "M8 12h8",
53
- key: "1wcyev"
54
- }],
55
- ["path", {
56
- d: "M12 8v8",
57
- key: "napkw2"
58
- }]
59
- ]), Dt = U("circle", [["circle", {
60
- cx: "12",
61
- cy: "12",
62
- r: "10",
63
- key: "1mglay"
64
- }]]), Ot = U("globe", [
65
- ["circle", {
66
- cx: "12",
67
- cy: "12",
68
- r: "10",
69
- key: "1mglay"
70
- }],
71
- ["path", {
72
- d: "M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20",
73
- key: "13o1zl"
74
- }],
75
- ["path", {
76
- d: "M2 12h20",
77
- key: "9i4pu4"
78
- }]
79
- ]), kt = U("layout-template", [
80
- ["rect", {
81
- width: "18",
82
- height: "7",
83
- x: "3",
84
- y: "3",
85
- rx: "1",
86
- key: "f1a2em"
87
- }],
88
- ["rect", {
89
- width: "9",
90
- height: "7",
91
- x: "3",
92
- y: "14",
93
- rx: "1",
94
- key: "jqznyg"
95
- }],
96
- ["rect", {
97
- width: "5",
98
- height: "7",
99
- x: "16",
100
- y: "14",
101
- rx: "1",
102
- key: "q5h2i8"
103
- }]
104
- ]), At = U("lock", [["rect", {
105
- width: "18",
106
- height: "11",
107
- x: "3",
108
- y: "11",
109
- rx: "2",
110
- ry: "2",
111
- key: "1w4ew1"
112
- }], ["path", {
113
- d: "M7 11V7a5 5 0 0 1 10 0v4",
114
- key: "fwvmzm"
115
- }]]), jt = U("monitor", [
116
- ["rect", {
117
- width: "20",
118
- height: "14",
119
- x: "2",
120
- y: "3",
121
- rx: "2",
122
- key: "48i651"
123
- }],
124
- ["line", {
125
- x1: "8",
126
- x2: "16",
127
- y1: "21",
128
- y2: "21",
129
- key: "1svkeh"
130
- }],
131
- ["line", {
132
- x1: "12",
133
- x2: "12",
134
- y1: "17",
135
- y2: "21",
136
- key: "vw1qmm"
137
- }]
138
- ]), Mt = U("moon", [["path", {
139
- d: "M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401",
140
- key: "kfwtm"
141
- }]]), Nt = U("panel-top", [["rect", {
142
- width: "18",
143
- height: "18",
144
- x: "3",
145
- y: "3",
146
- rx: "2",
147
- key: "afitv7"
148
- }], ["path", {
149
- d: "M3 9h18",
150
- key: "1pudct"
151
- }]]), Z = U("plus", [["path", {
152
- d: "M5 12h14",
153
- key: "1ays0h"
154
- }], ["path", {
155
- d: "M12 5v14",
156
- key: "s699le"
157
- }]]), Pt = U("rotate-ccw", [["path", {
158
- d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8",
159
- key: "1357e3"
160
- }], ["path", {
161
- d: "M3 3v5h5",
162
- key: "1xhq8a"
163
- }]]), Ft = U("settings", [["path", {
164
- d: "M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915",
165
- key: "1i5ecw"
166
- }], ["circle", {
167
- cx: "12",
168
- cy: "12",
169
- r: "3",
170
- key: "1v7zrd"
171
- }]]), It = U("smartphone", [["rect", {
172
- width: "14",
173
- height: "20",
174
- x: "5",
175
- y: "2",
176
- rx: "2",
177
- ry: "2",
178
- key: "1yt0o3"
179
- }], ["path", {
180
- d: "M12 18h.01",
181
- key: "mhygvu"
182
- }]]), Lt = U("square", [["rect", {
183
- width: "18",
184
- height: "18",
185
- x: "3",
186
- y: "3",
187
- rx: "2",
188
- key: "afitv7"
189
- }]]), Rt = U("sun", [
190
- ["circle", {
191
- cx: "12",
192
- cy: "12",
193
- r: "4",
194
- key: "4exip2"
195
- }],
196
- ["path", {
197
- d: "M12 2v2",
198
- key: "tus03m"
199
- }],
200
- ["path", {
201
- d: "M12 20v2",
202
- key: "1lh1kg"
203
- }],
204
- ["path", {
205
- d: "m4.93 4.93 1.41 1.41",
206
- key: "149t6j"
207
- }],
208
- ["path", {
209
- d: "m17.66 17.66 1.41 1.41",
210
- key: "ptbguv"
211
- }],
212
- ["path", {
213
- d: "M2 12h2",
214
- key: "1t8f8n"
215
- }],
216
- ["path", {
217
- d: "M20 12h2",
218
- key: "1q8mjw"
219
- }],
220
- ["path", {
221
- d: "m6.34 17.66-1.41 1.41",
222
- key: "1m8zz5"
223
- }],
224
- ["path", {
225
- d: "m19.07 4.93-1.41 1.41",
226
- key: "1shlcs"
227
- }]
228
- ]);
229
- //#endregion
230
- //#region src/utils/resolveLintOptions.ts
231
- function zt(e) {
232
- return {
233
- ...e.lint,
234
- locale: e.locale
235
- };
236
- }
237
- //#endregion
238
- //#region src/components/Canvas.vue?vue&type=script&setup=true&lang.ts
239
- var Bt = ["aria-label"], Vt = {
240
- key: 0,
241
- class: "tpl-canvas-empty-content tpl:flex tpl:flex-col tpl:items-center"
242
- }, Ht = { class: "tpl-canvas-empty-icon tpl:mb-4 tpl:text-[var(--tpl-primary)]" }, Ut = { class: "tpl-canvas-empty-title tpl:m-0 tpl:mb-2 tpl:text-base tpl:font-semibold tpl:text-[var(--tpl-primary)]" }, Wt = { class: "tpl-canvas-empty-text tpl:m-0 tpl:text-sm tpl:text-[var(--tpl-text-dim)]" }, Gt = {
243
- key: 0,
244
- 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)]"
245
- }, Kt = {
246
- key: 1,
247
- 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)]"
248
- }, qt = { class: "tpl:relative" }, Jt = {
249
- class: "tpl:inline-flex tpl:size-3 tpl:items-center tpl:justify-center tpl:rounded-full tpl:text-[8px] tpl:font-bold",
250
- style: { "background-color": "color-mix(\n in srgb,\n var(--tpl-bg) 30%,\n transparent\n )" }
251
- }, Yt = 96, Xt = /*#__PURE__*/ dt(/* @__PURE__ */ m({
252
- __name: "Canvas",
253
- props: {
254
- viewport: {},
255
- content: {},
256
- selectedBlockId: {},
257
- darkMode: { type: Boolean },
258
- previewMode: { type: Boolean },
259
- lockedBlocks: {}
260
- },
261
- emits: [
262
- "select-block",
263
- "open-ai-chat",
264
- "open-design-reference"
265
- ],
266
- setup(n, { emit: i }) {
267
- let a = {
268
- section: xe,
269
- title: he,
270
- paragraph: ye,
271
- image: fe,
272
- button: oe,
273
- divider: Ce,
274
- spacer: pe,
275
- html: se,
276
- social: ce,
277
- menu: ge,
278
- table: be,
279
- video: _e,
280
- countdown: gt,
281
- custom: we
282
- }, s = n, c = i, { t: l } = H(), { t: f } = ft(), m = Ae(Re, "Canvas"), h = A(Ue, null), w = A(Be, null), E = A(He, {}), O = g(() => (E.plan?.hasFeature("ai_generation") ?? !1) && (E.ai?.isFeatureEnabled("chat") ?? !1)), j = g(() => (E.plan?.hasFeature("ai_generation") ?? !1) && (E.ai?.isFeatureEnabled("designToTemplate") ?? !1)), N = g({
283
- get: () => s.content.blocks,
284
- set: (e) => {
285
- m.setContent({
286
- ...s.content,
287
- blocks: e
288
- });
289
- }
290
- }), P = g(() => {
291
- switch (s.viewport) {
292
- case "mobile": return 375;
293
- default: return s.content.settings.width;
294
- }
295
- }), F = g(() => P.value + Yt * 2), I = g(() => ({ fontFamily: s.content.settings.fontFamily })), L = g(() => N.value.length === 0 && !s.previewMode), R = u(0), ee = g(() => L.value && R.value > 0);
296
- function z() {
297
- L.value && (R.value += 1);
298
- }
299
- function B() {
300
- L.value && (R.value = Math.max(0, R.value - 1));
301
- }
302
- function te() {
303
- R.value = 0;
304
- }
305
- function ne(e) {
306
- s.previewMode || e.target === e.currentTarget && c("select-block", null);
307
- }
308
- function re(e) {
309
- return ue(e, w, a);
310
- }
311
- function V(e) {
312
- return s.lockedBlocks?.get(e) ?? null;
313
- }
314
- function ie(e, t) {
315
- e.type === "custom" && m.updateBlock(e.id, {
316
- fieldValues: t.fieldValues,
317
- dataSourceFetched: t.dataSourceFetched
318
- });
319
- }
320
- return (i, a) => (e(), v("div", {
321
- class: "tpl-canvas-stage tpl:relative tpl:flex tpl:justify-center tpl:rounded-lg",
322
- style: S({
323
- width: `${F.value}px`,
324
- boxShadow: n.darkMode ? "none" : "var(--tpl-shadow-xl)",
325
- transition: "width 300ms cubic-bezier(0.34, 1.56, 0.64, 1)"
326
- })
327
- }, [_("div", {
328
- class: "tpl-canvas-bg tpl:absolute tpl:inset-0 tpl:rounded-lg tpl:pointer-events-none",
329
- style: S({
330
- backgroundColor: n.content.settings.backgroundColor,
331
- ...n.darkMode ? { filter: "invert(1) hue-rotate(180deg)" } : {},
332
- transition: "filter 300ms ease"
333
- })
334
- }, null, 4), _("div", {
335
- "data-testid": "canvas-wrapper",
336
- role: "region",
337
- "aria-label": T(l).landmarks.canvas,
338
- class: "tpl-canvas-wrapper tpl:relative",
339
- style: S({
340
- width: `${P.value}px`,
341
- transition: "width 300ms cubic-bezier(0.34, 1.56, 0.64, 1)"
342
- })
343
- }, [_("div", {
344
- class: p(["tpl-canvas tpl:relative tpl:rounded-lg", {
345
- "tpl-canvas--dark-mode": n.darkMode,
346
- "tpl-preview-mode": n.previewMode
347
- }]),
348
- style: S(I.value),
349
- onClick: ne
350
- }, [k(T(le), {
351
- modelValue: N.value,
352
- "onUpdate:modelValue": a[2] ||= (e) => N.value = e,
353
- group: "blocks",
354
- animation: 150,
355
- "ghost-class": "tpl-ghost",
356
- "drag-class": "tpl-dragging",
357
- handle: ".tpl-block-btn",
358
- "invert-swap": !0,
359
- "inverted-swap-threshold": .65,
360
- disabled: n.previewMode,
361
- draggable: ".tpl-block-item",
362
- "force-fallback": !0,
363
- class: p([
364
- "tpl-canvas-blocks",
365
- L.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" : "",
366
- L.value && ee.value ? "tpl-canvas-empty--drag-over tpl:border-[var(--tpl-primary-hover)] tpl:bg-[var(--tpl-primary-light)]" : "",
367
- L.value && !ee.value ? "tpl:border-[var(--tpl-primary)]" : ""
368
- ]),
369
- onDragenter: z,
370
- onDragleave: B,
371
- onDrop: te
372
- }, {
373
- default: M(() => [L.value ? (e(), v("div", Vt, [
374
- _("div", Ht, [k(T(Et), {
375
- size: 48,
376
- "stroke-width": 1
377
- })]),
378
- _("p", Ut, D(T(l).canvas.noBlocks), 1),
379
- _("p", Wt, D(T(l).canvas.dragHint), 1),
380
- O.value && T(f) ? (e(), v("p", Gt, [
381
- d(D(T(l).canvas.aiHintChat) + " ", 1),
382
- _("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: a[0] ||= (e) => c("open-ai-chat")
385
- }, [k(T(Ze), {
386
- size: 14,
387
- "stroke-width": 2
388
- }), d(" " + D(T(f).aiMenu.aiAssistant), 1)]),
389
- d(" " + D(T(l).canvas.aiHintChatSuffix), 1)
390
- ])) : b("", !0),
391
- j.value && T(f) ? (e(), v("p", Kt, [
392
- d(D(T(l).canvas.aiHintDesign) + " ", 1),
393
- _("button", {
394
- 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)]",
395
- onClick: a[1] ||= (e) => c("open-design-reference")
396
- }, [k(T(it), {
397
- size: 14,
398
- "stroke-width": 2
399
- }), d(" " + D(T(f).aiMenu.designToTemplate), 1)]),
400
- d(" " + D(T(l).canvas.aiHintDesignSuffix), 1)
401
- ])) : b("", !0)
402
- ])) : b("", !0), (e(!0), v(y, null, o(N.value, (i) => t((e(), v("div", {
403
- key: i.id,
404
- class: "tpl-block-item"
405
- }, [_("div", qt, [V(i.id) ? (e(), v("div", {
406
- key: 0,
407
- class: "tpl-collab-lock tpl:pointer-events-none tpl:absolute tpl:inset-0 tpl:z-[4] tpl:rounded-sm",
408
- style: S({
409
- outline: `2px solid ${V(i.id).color}`,
410
- outlineOffset: "-1px"
411
- })
412
- }, [_("span", {
413
- 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",
414
- style: S({
415
- backgroundColor: V(i.id).color,
416
- color: T(ht)(V(i.id).color)
417
- })
418
- }, [_("span", Jt, D(V(i.id).name.charAt(0)), 1), d(" " + D(V(i.id).name), 1)], 4)], 4)) : b("", !0), k(Se, {
419
- block: i,
420
- "is-selected": !n.previewMode && n.selectedBlockId === i.id && !V(i.id),
421
- viewport: n.viewport,
422
- "preview-mode": n.previewMode,
423
- onSelect: (e) => n.previewMode || V(i.id) ? void 0 : c("select-block", i.id)
424
- }, {
425
- default: M(() => [(e(), C(r(re(i)), {
426
- block: i,
427
- viewport: n.viewport,
428
- onFetchData: (e) => ie(i, e),
429
- onUpdate: (e) => T(m).updateBlock(i.id, e)
430
- }, null, 40, [
431
- "block",
432
- "viewport",
433
- "onFetchData",
434
- "onUpdate"
435
- ]))]),
436
- _: 2
437
- }, 1032, [
438
- "block",
439
- "is-selected",
440
- "viewport",
441
- "preview-mode",
442
- "onSelect"
443
- ])])])), [[x, !T(h)?.isHidden(i.id)]])), 128))]),
444
- _: 1
445
- }, 8, [
446
- "modelValue",
447
- "disabled",
448
- "class"
449
- ])], 6)], 12, Bt)], 4));
450
- }
451
- }), [["__scopeId", "data-v-a9a1158b"]]), Zt = m({
452
- name: "CustomBlockStylesheets",
453
- setup() {
454
- let e = A(Fe, null);
455
- return () => e ? e.value.map((e, t) => c("style", {
456
- key: t,
457
- "data-tpl-custom-block-stylesheet": "",
458
- innerHTML: e
459
- })) : null;
460
- }
461
- });
462
- //#endregion
463
- //#region src/utils/resolvePaletteBlocks.ts
464
- function Qt(e, t) {
465
- if (!t || t.length === 0) return {
466
- items: e,
467
- unknown: []
468
- };
469
- let n = new Map(e.map((e) => [e.type, e])), r = [], i = [], a = /* @__PURE__ */ new Set();
470
- for (let e of t) {
471
- if (a.has(e)) continue;
472
- a.add(e);
473
- let t = n.get(e);
474
- t ? r.push(t) : i.push(e);
475
- }
476
- return {
477
- items: r,
478
- unknown: i
479
- };
480
- }
481
- //#endregion
482
- //#region src/components/Sidebar.vue?vue&type=script&setup=true&lang.ts
483
- var $t = ["aria-label"], en = {
484
- key: 0,
485
- class: "tpl:border-b tpl:px-1 tpl:pb-1 tpl:border-[var(--tpl-border)]"
486
- }, tn = ["aria-label"], nn = {
487
- key: 0,
488
- class: "tpl:flex-1 tpl:truncate tpl:text-sm tpl:font-medium"
489
- }, rn = {
490
- key: 1,
491
- class: "tpl:shrink-0 tpl:rounded-full tpl:px-1.5 tpl:py-0.5 tpl:text-[10px] tpl:font-medium tpl:bg-[var(--tpl-bg-hover)] tpl:text-[var(--tpl-text-muted)]"
492
- }, an = [
493
- "data-palette-type",
494
- "aria-label",
495
- "onClick",
496
- "onKeydown"
497
- ], on = { 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" }, sn = {
498
- key: 0,
499
- class: "tpl:truncate tpl:text-sm tpl:font-medium"
500
- }, cn = /* @__PURE__ */ m({
501
- __name: "Sidebar",
502
- setup(t) {
503
- let { t: n, format: i } = H(), { t: s } = ft(), c = A(Pe, []), l = A(Me, void 0), d = A(Ne, void 0), f = A(Re, null), p = A(He, {}), m = g(() => (p.savedModules?.moduleCount.value ?? 0) > 0), h = u(!1), x = u(!1);
504
- function w() {
505
- x.value || (h.value = !1);
506
- }
507
- function E() {
508
- x.value = !0;
509
- }
510
- function O() {
511
- x.value = !1;
512
- }
513
- let j = [
514
- "section",
515
- "image",
516
- "title",
517
- "paragraph",
518
- "button",
519
- "divider",
520
- "video",
521
- "social",
522
- "menu",
523
- "table",
524
- "spacer",
525
- "html"
526
- ], N = g(() => {
527
- let e = j.map((e) => ({
528
- type: e,
529
- label: re(e, n)
530
- }));
531
- return p.plan && e.splice(-1, 0, {
532
- type: "countdown",
533
- label: re("countdown", n)
534
- }), e;
535
- }), P = g(() => c.map((e) => ({
536
- type: `custom:${e.type}`,
537
- label: e.name,
538
- isCustom: !0,
539
- icon: e.icon
540
- }))), F = g(() => [...N.value, ...P.value]), I = g(() => Qt(F.value, l)), L = g(() => I.value.items), z = /* @__PURE__ */ new Set();
541
- a(() => I.value.unknown, (e) => {
542
- for (let t of e) z.has(t) || (z.add(t), ne.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.`));
543
- }, { immediate: !0 });
544
- function B(e) {
545
- if (e.isCustom) {
546
- let t = e.type.replace("custom:", ""), n = c.find((e) => e.type === t);
547
- if (n) return ee(n);
548
- }
549
- return R(e.type, d);
550
- }
551
- function V(e) {
552
- if (!f) return;
553
- let t = B(e);
554
- f.addBlock(t), f.selectBlock(t.id);
555
- }
556
- function ie(e, t) {
557
- (e.key === "Enter" || e.key === " ") && (e.preventDefault(), V(t));
558
- }
559
- return (t, a) => (e(), v("aside", {
560
- "aria-label": T(n).sidebarNav.palette,
561
- 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",
562
- style: S({
563
- width: h.value ? "200px" : "48px",
564
- backgroundColor: "var(--tpl-bg-elevated)",
565
- borderRight: "1px solid var(--tpl-border)",
566
- boxShadow: h.value ? "var(--tpl-shadow-lg)" : "none",
567
- transition: "width 200ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 200ms cubic-bezier(0.16, 1, 0.3, 1)"
568
- }),
569
- onMouseenter: a[1] ||= (e) => h.value = !0,
570
- onMouseleave: w,
571
- onFocusin: a[2] ||= (e) => h.value = !0,
572
- onFocusout: a[3] ||= (e) => h.value = !1
573
- }, [m.value && T(s) ? (e(), v("div", en, [_("button", {
574
- type: "button",
575
- "aria-label": T(n).sidebarNav.browseModules,
576
- 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)]",
577
- style: S({ justifyContent: h.value ? "flex-start" : "center" }),
578
- onClick: a[0] ||= (e) => T(p).savedModules?.openBrowser()
579
- }, [
580
- k(T(Je), {
581
- size: 20,
582
- "stroke-width": 1.5,
583
- class: "tpl:shrink-0"
584
- }),
585
- h.value ? (e(), v("span", nn, D(T(s).modules.title), 1)) : b("", !0),
586
- h.value ? (e(), v("span", rn, D(T(p).savedModules?.moduleCount.value ?? 0), 1)) : b("", !0)
587
- ], 12, tn)])) : b("", !0), k(T(le), {
588
- "model-value": L.value,
589
- group: {
590
- name: "blocks",
591
- pull: "clone",
592
- put: !1
593
- },
594
- clone: B,
595
- sort: !1,
596
- animation: 150,
597
- "force-fallback": !0,
598
- class: "tpl:flex tpl:min-h-0 tpl:flex-1 tpl:flex-col tpl:gap-0.5 tpl:overflow-y-auto tpl:p-1",
599
- onChoose: E,
600
- onEnd: O
601
- }, {
602
- default: M(() => [(e(!0), v(y, null, o(L.value, (t) => (e(), v("button", {
603
- key: t.type,
604
- type: "button",
605
- "data-palette-type": t.type,
606
- "aria-label": T(i)(T(n).sidebarNav.insertBlock, { block: t.label }),
607
- 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",
608
- style: S({ justifyContent: h.value ? "flex-start" : "center" }),
609
- onClick: (e) => V(t),
610
- onKeydown: (e) => ie(e, t)
611
- }, [_("div", on, [T(Ye)[t.type] ? (e(), C(r(T(Ye)[t.type]), {
612
- key: 0,
613
- size: 20,
614
- "stroke-width": 1.5
615
- })) : t.isCustom ? (e(), C(te, {
616
- key: 1,
617
- icon: t.icon,
618
- size: 20
619
- }, null, 8, ["icon"])) : b("", !0)]), h.value ? (e(), v("span", sn, D(t.label), 1)) : b("", !0)], 44, an))), 128))]),
620
- _: 1
621
- }, 8, ["model-value"])], 44, $t));
622
- }
623
- });
624
- //#endregion
625
- //#region src/composables/useMergeTagField.ts
626
- function ln(e) {
627
- let { modelValue: t, emit: r, elementRef: i } = e, { canRequestMergeTag: a, isRequesting: o, isMergeTagValue: s, getMergeTagLabel: c, requestMergeTag: d, syntax: f } = pt(), p = u(!1), m = !1, h = !1;
628
- l() && w(() => {
629
- h = !0;
630
- });
631
- let _ = g(() => {
632
- let e = t();
633
- if (!e) return [];
634
- let n = [], r = `(${f.value.source}|${f.logic.source})`, i = new RegExp(r, "g"), a = 0, o;
635
- for (; (o = i.exec(e)) !== null;) {
636
- o.index > a && n.push({
637
- type: "text",
638
- value: e.slice(a, o.index)
639
- });
640
- let t = o[0];
641
- s(t) ? n.push({
642
- type: "mergeTag",
643
- value: t,
644
- label: c(t)
645
- }) : F(t, f) ? n.push({
646
- type: "logicMergeTag",
647
- value: t,
648
- keyword: z(t, f)
649
- }) : n.push({
650
- type: "text",
651
- value: t
652
- }), a = o.index + t.length;
653
- }
654
- return a < e.length && n.push({
655
- type: "text",
656
- value: e.slice(a)
657
- }), n;
658
- }), v = g(() => _.value.some((e) => e.type === "mergeTag" || e.type === "logicMergeTag"));
659
- function y() {
660
- p.value = !0, n(() => {
661
- i.value?.focus();
662
- let e = t()?.length || 0;
663
- i.value?.setSelectionRange(e, e);
664
- });
665
- }
666
- function b() {
667
- m || (p.value = !1);
668
- }
669
- function x(e) {
670
- r(e.target.value);
671
- }
672
- function S() {
673
- r("");
674
- }
675
- async function C() {
676
- let e = p.value && i.value ? i.value.selectionStart ?? t().length : t().length;
677
- m = !0;
678
- let a;
679
- try {
680
- a = await d();
681
- } finally {
682
- m = !1;
683
- }
684
- if (!h && a) {
685
- let o = t().slice(0, e), s = t().slice(e);
686
- r(o + a.value + s), p.value = !0, n(() => {
687
- if (h) return;
688
- let t = e + a.value.length;
689
- i.value?.focus(), i.value?.setSelectionRange(t, t);
690
- });
691
- }
692
- }
693
- return {
694
- segments: _,
695
- hasMergeTags: v,
696
- canRequestMergeTag: a,
697
- isRequestingMergeTag: o,
698
- isEditing: p,
699
- startEditing: y,
700
- stopEditing: b,
701
- handleInput: x,
702
- clearValue: S,
703
- insertMergeTag: C
704
- };
705
- }
706
- //#endregion
707
- //#region src/components/MergeTagSegments.vue?vue&type=script&setup=true&lang.ts
708
- var un = ["aria-label", "onKeydown"], dn = ["data-tooltip"], fn = ["data-tooltip"], pn = {
709
- key: 2,
710
- class: "tpl:text-sm tpl:text-[var(--tpl-text)]"
711
- }, mn = ["aria-label", "title"], hn = /* @__PURE__ */ m({
712
- __name: "MergeTagSegments",
713
- props: {
714
- segments: {},
715
- displayClass: {},
716
- pulse: { type: Boolean }
717
- },
718
- emits: ["edit", "clear"],
719
- setup(t, { emit: n }) {
720
- let r = n, { t: i } = H();
721
- function a() {
722
- r("edit");
723
- }
724
- return (n, s) => (e(), v("div", {
725
- role: "button",
726
- tabindex: "0",
727
- "aria-label": T(i).mergeTag.clickToEdit,
728
- class: p([t.displayClass, { "tpl-pulse-fill": t.pulse }]),
729
- onClick: a,
730
- onKeydown: [E(a, ["enter"]), E(h(a, ["prevent"]), ["space"])]
731
- }, [(e(!0), v(y, null, o(t.segments, (t, n) => (e(), v(y, { key: `${t.type}-${n}-${t.value}` }, [t.type === "mergeTag" ? (e(), v("span", {
732
- key: 0,
733
- 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",
734
- "data-tooltip": t.value,
735
- style: {
736
- "background-color": "color-mix(\n in srgb,\n var(--tpl-primary) 20%,\n transparent\n )",
737
- color: "var(--tpl-primary)"
738
- }
739
- }, D(t.label), 9, dn)) : t.type === "logicMergeTag" ? (e(), v("span", {
740
- key: 1,
741
- 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",
742
- "data-tooltip": t.value,
743
- style: {
744
- "background-color": "transparent",
745
- border: "1.5px solid\n color-mix(in srgb, var(--tpl-primary) 50%, transparent)",
746
- color: "var(--tpl-primary)"
747
- }
748
- }, D(t.keyword), 9, fn)) : (e(), v("span", pn, D(t.value), 1))], 64))), 128)), _("button", {
749
- type: "button",
750
- 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",
751
- "aria-label": T(i).mergeTag.remove,
752
- title: T(i).mergeTag.remove,
753
- onClick: s[0] ||= h((e) => r("clear"), ["stop"])
754
- }, [k(T(ut), {
755
- size: 12,
756
- "stroke-width": 2.5
757
- })], 8, mn)], 42, un));
758
- }
759
- }), gn = [
760
- "aria-label",
761
- "title",
762
- "disabled"
763
- ], _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)]", vn = /* @__PURE__ */ m({
764
- __name: "MergeTagInsertButton",
765
- props: { disabled: { type: Boolean } },
766
- emits: ["insert"],
767
- setup(t) {
768
- let { t: n } = H();
769
- return (r, i) => (e(), v("button", {
770
- type: "button",
771
- class: p([_n, "tpl:mt-1.5"]),
772
- "aria-label": T(n).mergeTag.insert,
773
- title: T(n).mergeTag.insert,
774
- disabled: t.disabled,
775
- onClick: i[0] ||= (e) => r.$emit("insert")
776
- }, [k(T(st), {
777
- size: 12,
778
- "stroke-width": 2
779
- }), d(" " + D(T(n).mergeTag.insert), 1)], 10, gn));
780
- }
781
- }), yn = { key: 0 }, bn = { key: 1 }, xn = [
782
- "value",
783
- "placeholder",
784
- "rows"
785
- ], Sn = "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)]", Cn = "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)]", wn = /* @__PURE__ */ m({
786
- __name: "MergeTagTextarea",
787
- props: {
788
- modelValue: {},
789
- placeholder: { default: "" },
790
- rows: { default: 3 }
791
- },
792
- emits: ["update:modelValue"],
793
- setup(t, { emit: n }) {
794
- let r = t, i = n, a = u(null), { segments: o, hasMergeTags: s, canRequestMergeTag: c, isRequestingMergeTag: l, isEditing: d, startEditing: f, stopEditing: m, handleInput: h, clearValue: g, insertMergeTag: y } = ln({
795
- modelValue: () => r.modelValue,
796
- emit: (e) => i("update:modelValue", e),
797
- elementRef: a
798
- });
799
- return (n, r) => T(s) && !T(d) ? (e(), v("div", yn, [k(hn, {
800
- segments: T(o),
801
- "display-class": Cn,
802
- onEdit: T(f),
803
- onClear: T(g)
804
- }, null, 8, [
805
- "segments",
806
- "onEdit",
807
- "onClear"
808
- ]), T(c) ? (e(), C(vn, {
809
- key: 0,
810
- disabled: T(l),
811
- onInsert: T(y)
812
- }, null, 8, ["disabled", "onInsert"])) : b("", !0)])) : (e(), v("div", bn, [_("textarea", {
813
- ref_key: "textareaRef",
814
- ref: a,
815
- class: p(Sn),
816
- value: t.modelValue,
817
- placeholder: t.placeholder,
818
- rows: t.rows,
819
- onInput: r[0] ||= (...e) => T(h) && T(h)(...e),
820
- onBlur: r[1] ||= (...e) => T(m) && T(m)(...e),
821
- onKeydown: r[2] ||= E((...e) => T(m) && T(m)(...e), ["escape"])
822
- }, null, 40, xn), T(c) ? (e(), C(vn, {
823
- key: 0,
824
- disabled: T(l),
825
- onInsert: T(y)
826
- }, null, 8, ["disabled", "onInsert"])) : b("", !0)]));
827
- }
828
- }), Tn = { class: "tpl:flex tpl:w-full tpl:flex-1 tpl:flex-col tpl:bg-[var(--tpl-bg-elevated)]" }, En = { class: "tpl:flex tpl:flex-1 tpl:flex-col tpl:gap-3 tpl:overflow-y-auto tpl:p-4" }, Dn = { class: "tpl:mb-3.5 tpl:flex tpl:items-center tpl:gap-2 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]" }, On = { class: "tpl:mb-3.5" }, kn = { 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)]" }, An = ["onClick"], jn = { class: "tpl:flex tpl:items-stretch" }, Mn = ["value"], Nn = { class: "tpl:mb-3.5 tpl:flex tpl:items-center tpl:gap-2 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]" }, Pn = { class: "tpl:mb-3.5" }, Fn = ["value"], In = ["value"], Ln = { class: "tpl:mb-3.5 tpl:flex tpl:items-center tpl:gap-2 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]" }, Rn = ["value"], zn = { class: "tpl:mt-1 tpl:text-xs tpl:leading-relaxed tpl:text-[var(--tpl-text-dim)]" }, Bn = { class: "tpl:mb-3.5 tpl:flex tpl:items-center tpl:gap-2 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]" }, Vn = { class: "tpl:mt-1 tpl:flex tpl:items-start tpl:justify-between tpl:gap-2" }, Hn = { class: "tpl:text-xs tpl:leading-relaxed tpl:text-[var(--tpl-text-dim)]" }, Un = { class: "tpl:shrink-0 tpl:text-xs tpl:tabular-nums tpl:text-[var(--tpl-text-dim)]" }, Wn = { class: "tpl:rounded-[var(--tpl-radius)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-3" }, Gn = { 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)]" }, Kn = { class: "tpl:m-0 tpl:pl-[18px] tpl:text-xs tpl:leading-relaxed tpl:text-[var(--tpl-text-dim)]" }, qn = { class: "tpl:mb-1 tpl:last:mb-0" }, Jn = { class: "tpl:mb-1 tpl:last:mb-0" }, Yn = { class: "tpl:mb-1 tpl:last:mb-0" }, Xn = 150, Zn = /* @__PURE__ */ m({
829
- __name: "TemplateSettings",
830
- props: { settings: {} },
831
- emits: ["update"],
832
- setup(t, { emit: n }) {
833
- let r = t, i = n, { t: a } = H(), s = Ae(Ie, "TemplateSettings"), c = g(() => s.fonts.value), l = g(() => c.value.some((e) => e.value === r.settings.fontFamily) ? r.settings.fontFamily : s.defaultFont.value), u = [
834
- {
835
- value: 480,
836
- label: "480px"
837
- },
838
- {
839
- value: 600,
840
- label: "600px"
841
- },
842
- {
843
- value: 700,
844
- label: "700px"
845
- },
846
- {
847
- value: 800,
848
- label: "800px"
849
- }
850
- ];
851
- return (n, r) => (e(), v("aside", Tn, [_("div", En, [
852
- _("div", { class: p(T(bt)) }, [
853
- _("div", Dn, [k(T(Lt), {
854
- class: "tpl:text-[var(--tpl-text-muted)]",
855
- size: 14,
856
- "stroke-width": 2
857
- }), _("span", null, D(T(a).templateSettings.layout), 1)]),
858
- _("div", On, [_("label", { class: p(T(G)) }, D(T(a).templateSettings.widthPreset), 3), _("div", kn, [(e(), v(y, null, o(u, (e) => _("button", {
859
- key: e.value,
860
- 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)]",
861
- style: S({
862
- backgroundColor: t.settings.width === e.value ? "var(--tpl-bg)" : "transparent",
863
- color: t.settings.width === e.value ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
864
- boxShadow: t.settings.width === e.value ? "var(--tpl-shadow)" : "none"
865
- }),
866
- onClick: (t) => i("update", { width: e.value })
867
- }, D(e.label), 13, An)), 64))])]),
868
- _("div", null, [_("label", { class: p(T(G)) }, D(T(a).templateSettings.customWidth), 3), _("div", jn, [_("input", {
869
- type: "number",
870
- class: p(T(q)),
871
- value: t.settings.width,
872
- min: "300",
873
- max: "900",
874
- onInput: r[0] ||= (e) => i("update", { width: Number(e.target.value) })
875
- }, null, 42, Mn), _("span", { class: p(T(K)) }, "px", 2)])])
876
- ], 2),
877
- _("div", { class: p(T(bt)) }, [
878
- _("div", Nn, [k(T(Dt), {
879
- class: "tpl:text-[var(--tpl-text-muted)]",
880
- size: 14,
881
- "stroke-width": 2
882
- }), _("span", null, D(T(a).templateSettings.appearance), 1)]),
883
- _("div", Pn, [_("label", { class: p(T(G)) }, D(T(a).templateSettings.backgroundColor), 3), k(J, {
884
- "model-value": t.settings.backgroundColor,
885
- placeholder: T(St),
886
- "onUpdate:modelValue": r[1] ||= (e) => i("update", { backgroundColor: e })
887
- }, null, 8, ["model-value", "placeholder"])]),
888
- _("div", null, [_("label", { class: p(T(G)) }, D(T(a).templateSettings.fontFamily), 3), _("select", {
889
- class: p(T(W)),
890
- value: l.value,
891
- onChange: r[2] ||= (e) => i("update", { fontFamily: e.target.value })
892
- }, [(e(!0), v(y, null, o(c.value, (t) => (e(), v("option", {
893
- key: t.value,
894
- value: t.value
895
- }, D(t.label), 9, In))), 128))], 42, Fn)])
896
- ], 2),
897
- _("div", { class: p(T(bt)) }, [_("div", Ln, [k(T(Ot), {
898
- class: "tpl:text-[var(--tpl-text-muted)]",
899
- size: 14,
900
- "stroke-width": 2
901
- }), _("span", null, D(T(a).templateSettings.language), 1)]), _("div", null, [
902
- _("label", { class: p(T(G)) }, D(T(a).templateSettings.contentLocale), 3),
903
- _("input", {
904
- type: "text",
905
- class: p(T(W)),
906
- value: t.settings.locale ?? "",
907
- placeholder: "en",
908
- spellcheck: "false",
909
- autocapitalize: "off",
910
- autocomplete: "off",
911
- onInput: r[3] ||= (e) => i("update", { locale: e.target.value.trim() || void 0 })
912
- }, null, 42, Rn),
913
- _("p", zn, D(T(a).templateSettings.contentLocaleHint), 1)
914
- ])], 2),
915
- _("div", { class: p(T(bt)) }, [_("div", Bn, [k(T(nt), {
916
- class: "tpl:text-[var(--tpl-text-muted)]",
917
- size: 14,
918
- "stroke-width": 2
919
- }), _("span", null, D(T(a).templateSettings.preheaderText), 1)]), _("div", null, [k(wn, {
920
- "model-value": t.settings.preheaderText ?? "",
921
- placeholder: T(a).templateSettings.preheaderTextPlaceholder,
922
- rows: 2,
923
- "onUpdate:modelValue": r[4] ||= (e) => i("update", { preheaderText: e.replace(/[\r\n]/g, " ") || void 0 })
924
- }, null, 8, ["model-value", "placeholder"]), _("div", Vn, [_("span", Hn, D(T(a).templateSettings.preheaderTextHint), 1), _("span", Un, D((t.settings.preheaderText ?? "").length) + "/" + D(Xn), 1)])])], 2),
925
- _("div", Wn, [_("div", Gn, [k(T(at), {
926
- size: 14,
927
- "stroke-width": 2
928
- }), _("span", null, D(T(a).templateSettings.tips), 1)]), _("ul", Kn, [
929
- _("li", qn, D(T(a).templateSettings.tip1), 1),
930
- _("li", Jn, D(T(a).templateSettings.tip2), 1),
931
- _("li", Yn, D(T(a).templateSettings.tip3), 1)
932
- ])])
933
- ])]));
934
- }
935
- }), Qn = { key: 0 }, $n = { key: 1 }, er = [
936
- "type",
937
- "value",
938
- "placeholder"
939
- ], tr = "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)]", Q = /*#__PURE__*/ dt(/* @__PURE__ */ m({
940
- __name: "MergeTagInput",
941
- props: {
942
- modelValue: {},
943
- type: { default: "text" },
944
- placeholder: { default: "" },
945
- pulse: {
946
- type: Boolean,
947
- default: !1
948
- }
949
- },
950
- emits: ["update:modelValue"],
951
- setup(t, { emit: n }) {
952
- let r = t, i = n, a = u(null), { segments: o, hasMergeTags: s, canRequestMergeTag: c, isRequestingMergeTag: l, isEditing: d, startEditing: f, stopEditing: m, handleInput: h, clearValue: g, insertMergeTag: y } = ln({
953
- modelValue: () => r.modelValue,
954
- emit: (e) => i("update:modelValue", e),
955
- elementRef: a
956
- });
957
- return (n, r) => T(s) && !T(d) ? (e(), v("div", Qn, [k(hn, {
958
- segments: T(o),
959
- "display-class": tr,
960
- pulse: t.pulse,
961
- onEdit: T(f),
962
- onClear: T(g)
963
- }, null, 8, [
964
- "segments",
965
- "pulse",
966
- "onEdit",
967
- "onClear"
968
- ]), T(c) ? (e(), C(vn, {
969
- key: 0,
970
- disabled: T(l),
971
- onInsert: T(y)
972
- }, null, 8, ["disabled", "onInsert"])) : b("", !0)])) : (e(), v("div", $n, [_("input", {
973
- ref_key: "inputRef",
974
- ref: a,
975
- type: t.type,
976
- class: p([T(W), { "tpl-pulse-fill": t.pulse }]),
977
- value: t.modelValue,
978
- placeholder: t.placeholder,
979
- onInput: r[0] ||= (...e) => T(h) && T(h)(...e),
980
- onBlur: r[1] ||= (...e) => T(m) && T(m)(...e),
981
- onKeydown: r[2] ||= E((...e) => T(m) && T(m)(...e), ["escape"])
982
- }, null, 42, er), T(c) ? (e(), C(vn, {
983
- key: 0,
984
- disabled: T(l),
985
- onInsert: T(y)
986
- }, null, 8, ["disabled", "onInsert"])) : b("", !0)]));
987
- }
988
- }), [["__scopeId", "data-v-358207dd"]]), nr = { class: "tpl:mb-3.5" }, rr = ["value"], ir = { value: "" }, ar = ["value"], or = { class: "tpl:mb-3.5" }, sr = { class: "tpl:mb-3.5" }, cr = {
989
- key: 0,
990
- class: "tpl:mt-2 tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:text-[12px] tpl:text-[var(--tpl-text-muted)]"
991
- }, lr = ["checked"], ur = { class: "tpl:mb-3.5" }, dr = { class: "tpl:mb-3.5" }, fr = { class: "tpl:grid tpl:grid-cols-2 tpl:gap-3" }, pr = { class: "tpl:mb-3.5" }, mr = { class: "tpl:flex tpl:items-stretch" }, hr = ["value"], gr = { class: "tpl:mb-3.5" }, _r = { class: "tpl:flex tpl:items-stretch" }, vr = ["value"], yr = { class: "tpl:mb-3.5" }, br = ["value"], xr = { value: "auto" }, Sr = { value: "full" }, Cr = { value: "custom" }, wr = {
992
- key: 0,
993
- class: "tpl:mt-2 tpl:flex tpl:items-stretch"
994
- }, Tr = ["value"], Er = 200, Dr = /* @__PURE__ */ m({
995
- __name: "ButtonToolbar",
996
- props: {
997
- block: {},
998
- fontFamilies: {}
999
- },
1000
- emits: ["update"],
1001
- setup(t, { emit: n }) {
1002
- let r = t, i = n, { t: a } = H(), s = g(() => r.block.width === "full" ? "full" : typeof r.block.width == "number" ? "custom" : "auto");
1003
- function c(e, t) {
1004
- i("update", { [e]: t });
1005
- }
1006
- function l(e) {
1007
- if (e === "full") {
1008
- c("width", "full");
1009
- return;
1010
- }
1011
- if (e === "custom") {
1012
- c("width", typeof r.block.width == "number" ? r.block.width : Er);
1013
- return;
1014
- }
1015
- c("width", void 0);
1016
- }
1017
- function u(e) {
1018
- let t = Number(e);
1019
- !Number.isFinite(t) || t <= 0 || c("width", t);
1020
- }
1021
- return (n, r) => (e(), v(y, null, [
1022
- _("div", nr, [_("label", { class: p(T(G)) }, D(T(a).button.fontFamily), 3), _("select", {
1023
- class: p(T(W)),
1024
- value: t.block.fontFamily || "",
1025
- onChange: r[0] ||= (e) => c("fontFamily", e.target.value || void 0)
1026
- }, [_("option", ir, D(T(a).button.inheritFont), 1), (e(!0), v(y, null, o(t.fontFamilies, (t) => (e(), v("option", {
1027
- key: t.value,
1028
- value: t.value
1029
- }, D(t.label), 9, ar))), 128))], 42, rr)]),
1030
- _("div", or, [_("label", { class: p(T(G)) }, D(T(a).button.text), 3), k(Q, {
1031
- "model-value": t.block.text,
1032
- type: "text",
1033
- "onUpdate:modelValue": r[1] ||= (e) => c("text", e)
1034
- }, null, 8, ["model-value"])]),
1035
- _("div", sr, [
1036
- _("label", { class: p(T(G)) }, D(T(a).button.url), 3),
1037
- k(Q, {
1038
- "model-value": t.block.url,
1039
- type: "url",
1040
- placeholder: T(a).button.urlPlaceholder,
1041
- "onUpdate:modelValue": r[2] ||= (e) => c("url", e)
1042
- }, null, 8, ["model-value", "placeholder"]),
1043
- t.block.url ? (e(), v("label", cr, [_("input", {
1044
- type: "checkbox",
1045
- class: "tpl:size-3.5 tpl:cursor-pointer tpl:accent-[var(--tpl-primary)]",
1046
- checked: t.block.openInNewTab ?? !1,
1047
- onChange: r[3] ||= (e) => c("openInNewTab", e.target.checked)
1048
- }, null, 40, lr), d(" " + D(T(a).button.openInNewTab), 1)])) : b("", !0)
1049
- ]),
1050
- _("div", ur, [_("label", { class: p(T(G)) }, D(T(a).button.background), 3), k(J, {
1051
- "model-value": t.block.backgroundColor,
1052
- "onUpdate:modelValue": r[4] ||= (e) => c("backgroundColor", e)
1053
- }, null, 8, ["model-value"])]),
1054
- _("div", dr, [_("label", { class: p(T(G)) }, D(T(a).button.textColor), 3), k(J, {
1055
- "model-value": t.block.textColor,
1056
- "onUpdate:modelValue": r[5] ||= (e) => c("textColor", e)
1057
- }, null, 8, ["model-value"])]),
1058
- _("div", fr, [_("div", pr, [_("label", { class: p(T(G)) }, D(T(a).button.borderRadius), 3), _("div", mr, [_("input", {
1059
- type: "number",
1060
- class: p(T(q)),
1061
- value: t.block.borderRadius,
1062
- min: "0",
1063
- max: "50",
1064
- onInput: r[6] ||= (e) => c("borderRadius", Number(e.target.value))
1065
- }, null, 42, hr), _("span", { class: p(T(K)) }, "px", 2)])]), _("div", gr, [_("label", { class: p(T(G)) }, D(T(a).button.fontSize), 3), _("div", _r, [_("input", {
1066
- type: "number",
1067
- class: p(T(q)),
1068
- value: t.block.fontSize,
1069
- min: "10",
1070
- max: "36",
1071
- onInput: r[7] ||= (e) => c("fontSize", Number(e.target.value))
1072
- }, null, 42, vr), _("span", { class: p(T(K)) }, "px", 2)])])]),
1073
- _("div", yr, [
1074
- _("label", { class: p(T(G)) }, D(T(a).button.width), 3),
1075
- _("select", {
1076
- class: p(T(W)),
1077
- value: s.value,
1078
- onChange: r[8] ||= (e) => l(e.target.value)
1079
- }, [
1080
- _("option", xr, D(T(a).button.widthAuto), 1),
1081
- _("option", Sr, D(T(a).button.fullWidth), 1),
1082
- _("option", Cr, D(T(a).button.widthCustom), 1)
1083
- ], 42, br),
1084
- s.value === "custom" ? (e(), v("div", wr, [_("input", {
1085
- type: "number",
1086
- class: p(T(q)),
1087
- value: typeof t.block.width == "number" ? t.block.width : Er,
1088
- min: "20",
1089
- onInput: r[9] ||= (e) => u(e.target.value)
1090
- }, null, 42, Tr), _("span", { class: p(T(K)) }, "px", 2)])) : b("", !0)
1091
- ])
1092
- ], 64));
1093
- }
1094
- }), Or = { class: "spacing-control" }, kr = { class: "tpl:mb-2 tpl:block tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-text-muted)]" }, Ar = { class: "tpl:flex tpl:flex-col tpl:items-center tpl:gap-1.5" }, jr = { class: "tpl:flex tpl:items-center" }, Mr = ["aria-label"], Nr = ["value", "aria-label"], Pr = ["aria-label"], Fr = { class: "tpl:flex tpl:items-center tpl:gap-2" }, Ir = { class: "tpl:flex tpl:items-center" }, Lr = ["aria-label"], Rr = ["value", "aria-label"], zr = ["aria-label"], Br = ["aria-label", "title"], Vr = { class: "tpl:flex tpl:items-center" }, Hr = ["aria-label"], Ur = ["value", "aria-label"], Wr = ["aria-label"], Gr = { class: "tpl:flex tpl:items-center" }, Kr = ["aria-label"], qr = ["value", "aria-label"], Jr = ["aria-label"], $ = "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)]", Yr = "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)]", Xr = /*#__PURE__*/ dt(/* @__PURE__ */ m({
1095
- __name: "SpacingControl",
1096
- props: {
1097
- modelValue: {},
1098
- label: {}
1099
- },
1100
- emits: ["update:modelValue"],
1101
- setup(t, { emit: n }) {
1102
- let r = t, i = n, { t: o } = H(), s = g(() => r.modelValue.top === r.modelValue.right && r.modelValue.right === r.modelValue.bottom && r.modelValue.bottom === r.modelValue.left), c = u(s.value);
1103
- a(s, (e) => {
1104
- !e && c.value && (c.value = !1);
1105
- });
1106
- function l(e, t) {
1107
- let n = r.modelValue[e], a = Math.max(0, n + t);
1108
- c.value ? i("update:modelValue", {
1109
- top: a,
1110
- right: a,
1111
- bottom: a,
1112
- left: a
1113
- }) : i("update:modelValue", {
1114
- ...r.modelValue,
1115
- [e]: a
1116
- });
1117
- }
1118
- function d(e, t) {
1119
- let n = Math.max(0, t);
1120
- c.value ? i("update:modelValue", {
1121
- top: n,
1122
- right: n,
1123
- bottom: n,
1124
- left: n
1125
- }) : i("update:modelValue", {
1126
- ...r.modelValue,
1127
- [e]: n
1128
- });
1129
- }
1130
- function f() {
1131
- if (c.value = !c.value, c.value) {
1132
- let e = r.modelValue.top;
1133
- i("update:modelValue", {
1134
- top: e,
1135
- right: e,
1136
- bottom: e,
1137
- left: e
1138
- });
1139
- }
1140
- }
1141
- return (n, r) => (e(), v("div", Or, [_("label", kr, D(t.label), 1), _("div", Ar, [
1142
- _("div", jr, [
1143
- _("button", {
1144
- "aria-label": T(o).spacingControl.decreaseTop,
1145
- class: p([$, "tpl:rounded-l-[var(--tpl-radius-sm)]"]),
1146
- onClick: r[0] ||= (e) => l("top", -1)
1147
- }, [k(T(Ke), {
1148
- size: 12,
1149
- "stroke-width": 2
1150
- })], 10, Mr),
1151
- _("input", {
1152
- type: "number",
1153
- class: p(Yr),
1154
- value: t.modelValue.top,
1155
- "aria-label": T(o).spacingControl.top,
1156
- min: "0",
1157
- onInput: r[1] ||= (e) => d("top", Number(e.target.value))
1158
- }, null, 40, Nr),
1159
- _("button", {
1160
- "aria-label": T(o).spacingControl.increaseTop,
1161
- class: p([$, "tpl:rounded-r-[var(--tpl-radius-sm)]"]),
1162
- onClick: r[2] ||= (e) => l("top", 1)
1163
- }, [k(T(Z), {
1164
- size: 12,
1165
- "stroke-width": 2
1166
- })], 10, Pr)
1167
- ]),
1168
- _("div", Fr, [
1169
- _("div", Ir, [
1170
- _("button", {
1171
- "aria-label": T(o).spacingControl.decreaseLeft,
1172
- class: p([$, "tpl:rounded-l-[var(--tpl-radius-sm)]"]),
1173
- onClick: r[3] ||= (e) => l("left", -1)
1174
- }, [k(T(Ke), {
1175
- size: 12,
1176
- "stroke-width": 2
1177
- })], 10, Lr),
1178
- _("input", {
1179
- type: "number",
1180
- class: p(Yr),
1181
- value: t.modelValue.left,
1182
- "aria-label": T(o).spacingControl.left,
1183
- min: "0",
1184
- onInput: r[4] ||= (e) => d("left", Number(e.target.value))
1185
- }, null, 40, Rr),
1186
- _("button", {
1187
- "aria-label": T(o).spacingControl.increaseLeft,
1188
- class: p([$, "tpl:rounded-r-[var(--tpl-radius-sm)]"]),
1189
- onClick: r[5] ||= (e) => l("left", 1)
1190
- }, [k(T(Z), {
1191
- size: 12,
1192
- "stroke-width": 2
1193
- })], 10, zr)
1194
- ]),
1195
- _("button", {
1196
- class: p(["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)]", c.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)]"]),
1197
- "aria-label": c.value ? T(o).spacingControl.unlock : T(o).spacingControl.lockAll,
1198
- title: c.value ? T(o).spacingControl.unlock : T(o).spacingControl.lockAll,
1199
- onClick: f
1200
- }, [c.value ? (e(), C(T(At), {
1201
- key: 0,
1202
- size: 14,
1203
- "stroke-width": 2
1204
- })) : (e(), C(T(Tt), {
1205
- key: 1,
1206
- size: 14,
1207
- "stroke-width": 2
1208
- }))], 10, Br),
1209
- _("div", Vr, [
1210
- _("button", {
1211
- "aria-label": T(o).spacingControl.decreaseRight,
1212
- class: p([$, "tpl:rounded-l-[var(--tpl-radius-sm)]"]),
1213
- onClick: r[6] ||= (e) => l("right", -1)
1214
- }, [k(T(Ke), {
1215
- size: 12,
1216
- "stroke-width": 2
1217
- })], 10, Hr),
1218
- _("input", {
1219
- type: "number",
1220
- class: p(Yr),
1221
- value: t.modelValue.right,
1222
- "aria-label": T(o).spacingControl.right,
1223
- min: "0",
1224
- onInput: r[7] ||= (e) => d("right", Number(e.target.value))
1225
- }, null, 40, Ur),
1226
- _("button", {
1227
- "aria-label": T(o).spacingControl.increaseRight,
1228
- class: p([$, "tpl:rounded-r-[var(--tpl-radius-sm)]"]),
1229
- onClick: r[8] ||= (e) => l("right", 1)
1230
- }, [k(T(Z), {
1231
- size: 12,
1232
- "stroke-width": 2
1233
- })], 10, Wr)
1234
- ])
1235
- ]),
1236
- _("div", Gr, [
1237
- _("button", {
1238
- "aria-label": T(o).spacingControl.decreaseBottom,
1239
- class: p([$, "tpl:rounded-l-[var(--tpl-radius-sm)]"]),
1240
- onClick: r[9] ||= (e) => l("bottom", -1)
1241
- }, [k(T(Ke), {
1242
- size: 12,
1243
- "stroke-width": 2
1244
- })], 10, Kr),
1245
- _("input", {
1246
- type: "number",
1247
- class: p(Yr),
1248
- value: t.modelValue.bottom,
1249
- "aria-label": T(o).spacingControl.bottom,
1250
- min: "0",
1251
- onInput: r[10] ||= (e) => d("bottom", Number(e.target.value))
1252
- }, null, 40, qr),
1253
- _("button", {
1254
- "aria-label": T(o).spacingControl.increaseBottom,
1255
- class: p([$, "tpl:rounded-r-[var(--tpl-radius-sm)]"]),
1256
- onClick: r[11] ||= (e) => l("bottom", 1)
1257
- }, [k(T(Z), {
1258
- size: 12,
1259
- "stroke-width": 2
1260
- })], 10, Jr)
1261
- ])
1262
- ])]));
1263
- }
1264
- }), [["__scopeId", "data-v-9a9c8a07"]]), Zr = { class: "tpl:mt-3" }, Qr = /* @__PURE__ */ m({
1265
- __name: "CollapsibleSection",
1266
- props: {
1267
- title: {},
1268
- open: { type: Boolean },
1269
- noBorder: { type: Boolean }
1270
- },
1271
- emits: ["toggle"],
1272
- setup(n) {
1273
- return (r, i) => (e(), v("div", { class: p(["tpl:py-3", n.noBorder ? "" : "tpl:border-t tpl:border-[var(--tpl-border)]"]) }, [_("button", {
1274
- type: "button",
1275
- 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)]",
1276
- onClick: i[0] ||= (e) => r.$emit("toggle")
1277
- }, [k(T(tt), {
1278
- class: p(["tpl:transition-transform tpl:duration-200", n.open ? "tpl:rotate-0" : "tpl:-rotate-90"]),
1279
- size: 12,
1280
- "stroke-width": 2
1281
- }, null, 8, ["class"]), _("span", null, D(n.title), 1)]), t(_("div", Zr, [s(r.$slots, "default")], 512), [[x, n.open]])], 2));
1282
- }
1283
- }), $r = { class: "tpl:space-y-2" }, ei = ["checked", "onChange"], ti = { class: "tpl:space-y-2" }, ni = ["value"], ri = { value: "" }, ii = ["label"], ai = ["value"], oi = ["value"], si = {
1284
- key: 0,
1285
- value: "__custom__"
1286
- }, ci = {
1287
- key: 0,
1288
- class: "tpl:space-y-2"
1289
- }, li = { class: "tpl:mb-1 tpl:block tpl:text-[11px] tpl:font-medium tpl:text-[var(--tpl-text-muted)]" }, ui = { class: "tpl:mb-1 tpl:block tpl:text-[11px] tpl:font-medium tpl:text-[var(--tpl-text-muted)]" }, di = { class: "tpl:flex tpl:justify-end" }, fi = ["disabled"], pi = {
1290
- key: 0,
1291
- class: "tpl:text-[11px] tpl:text-[var(--tpl-text-muted)]"
1292
- }, mi = { class: "tpl:space-y-1" }, hi = { 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)]" }, gi = {
1293
- key: 0,
1294
- 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)]"
1295
- }, _i = /* @__PURE__ */ m({
1296
- __name: "CommonBlockSettings",
1297
- props: {
1298
- block: {},
1299
- isFirstSection: { type: Boolean }
1300
- },
1301
- emits: ["update"],
1302
- setup(n, { emit: s }) {
1303
- let c = n, l = s, { t: m } = H(), h = A(Ve, []), x = A(ze, !1), S = i(/* @__PURE__ */ new Set()), w = u(!1), E = u(""), O = u(""), j = [{
1304
- key: "desktop",
1305
- icon: jt,
1306
- labelKey: "showOnDesktop"
1307
- }, {
1308
- key: "mobile",
1309
- icon: It,
1310
- labelKey: "showOnMobile"
1311
- }];
1312
- function N(e) {
1313
- S.has(e) ? S.delete(e) : S.add(e);
1314
- }
1315
- let P = g(() => h.length > 0 || x), F = g(() => c.block.displayCondition ? !h.some((e) => e.label === c.block.displayCondition?.label) : !1);
1316
- function I() {
1317
- w.value = !0, F.value && c.block.displayCondition ? (E.value = c.block.displayCondition.before, O.value = c.block.displayCondition.after ?? "") : (E.value = "", O.value = "");
1318
- }
1319
- function L() {
1320
- E.value.trim() && (l("update", { displayCondition: {
1321
- label: m.blockSettings.customCondition,
1322
- before: E.value.trim(),
1323
- after: O.value.trim()
1324
- } }), w.value = !1, E.value = "", O.value = "");
1325
- }
1326
- a(() => c.block.displayCondition, (e) => {
1327
- if (!e) {
1328
- w.value = !1, E.value = "", O.value = "";
1329
- return;
1330
- }
1331
- F.value && (E.value = e.before, O.value = e.after ?? "");
1332
- }, { immediate: !0 });
1333
- let R = g(() => {
1334
- let e = {};
1335
- for (let t of h) {
1336
- let n = t.group ?? "";
1337
- e[n] || (e[n] = []), e[n].push(t);
1338
- }
1339
- return e;
1340
- });
1341
- function ee(e, t) {
1342
- l("update", { styles: {
1343
- ...c.block.styles,
1344
- [e]: t
1345
- } });
1346
- }
1347
- function z(e) {
1348
- return c.block.visibility?.[e] !== !1;
1349
- }
1350
- function B(e) {
1351
- let t = {
1352
- desktop: z("desktop"),
1353
- mobile: z("mobile")
1354
- };
1355
- t[e] = !t[e], l("update", { visibility: t });
1356
- }
1357
- return (i, a) => (e(), v("div", { class: p(["tpl:flex tpl:flex-col", n.isFirstSection ? "" : "tpl:mt-4"]) }, [
1358
- k(Qr, {
1359
- title: T(m).blockSettings.spacing,
1360
- open: S.has("spacing"),
1361
- "no-border": n.isFirstSection,
1362
- onToggle: a[1] ||= (e) => N("spacing")
1363
- }, {
1364
- default: M(() => [k(Xr, {
1365
- label: T(m).blockSettings.padding,
1366
- "model-value": n.block.styles.padding,
1367
- "onUpdate:modelValue": a[0] ||= (e) => ee("padding", e)
1368
- }, null, 8, ["label", "model-value"])]),
1369
- _: 1
1370
- }, 8, [
1371
- "title",
1372
- "open",
1373
- "no-border"
1374
- ]),
1375
- k(Qr, {
1376
- title: T(m).blockSettings.background,
1377
- open: S.has("bg"),
1378
- onToggle: a[3] ||= (e) => N("bg")
1379
- }, {
1380
- default: M(() => [_("label", { class: p(T(G)) }, D(T(m).blockSettings.color), 3), k(J, {
1381
- "model-value": n.block.styles.backgroundColor ?? "",
1382
- "onUpdate:modelValue": a[2] ||= (e) => ee("backgroundColor", e)
1383
- }, null, 8, ["model-value"])]),
1384
- _: 1
1385
- }, 8, ["title", "open"]),
1386
- k(Qr, {
1387
- title: T(m).blockSettings.display,
1388
- open: S.has("display"),
1389
- onToggle: a[4] ||= (e) => N("display")
1390
- }, {
1391
- default: M(() => [_("div", $r, [(e(), v(y, null, o(j, (t) => _("label", {
1392
- key: t.key,
1393
- class: "tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:text-xs tpl:text-[var(--tpl-text)]"
1394
- }, [
1395
- _("input", {
1396
- type: "checkbox",
1397
- class: "tpl:accent-[var(--tpl-primary)]",
1398
- checked: z(t.key),
1399
- onChange: (e) => B(t.key)
1400
- }, null, 40, ei),
1401
- (e(), C(r(t.icon), {
1402
- size: 14,
1403
- "stroke-width": 1.5
1404
- })),
1405
- d(" " + D(T(m).blockSettings[t.labelKey]), 1)
1406
- ])), 64))])]),
1407
- _: 1
1408
- }, 8, ["title", "open"]),
1409
- P.value ? (e(), C(Qr, {
1410
- key: 0,
1411
- title: T(m).blockSettings.displayCondition,
1412
- open: S.has("condition"),
1413
- onToggle: a[8] ||= (e) => N("condition")
1414
- }, {
1415
- default: M(() => [_("div", ti, [_("select", {
1416
- class: p(["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)]", n.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)]"]),
1417
- value: w.value || F.value ? "__custom__" : n.block.displayCondition?.label ?? "",
1418
- onChange: a[5] ||= (e) => {
1419
- let t = e.target.value;
1420
- if (t === "__custom__") {
1421
- I();
1422
- return;
1423
- }
1424
- if (w.value = !1, !t) {
1425
- l("update", { displayCondition: void 0 });
1426
- return;
1427
- }
1428
- let n = T(h).find((e) => e.label === t);
1429
- n && l("update", { displayCondition: n });
1430
- }
1431
- }, [
1432
- _("option", ri, D(T(m).blockSettings.noCondition), 1),
1433
- (e(!0), v(y, null, o(R.value, (t, n) => (e(), v(y, { key: n }, [n ? (e(), v("optgroup", {
1434
- key: 0,
1435
- label: String(n)
1436
- }, [(e(!0), v(y, null, o(t, (t) => (e(), v("option", {
1437
- key: t.label,
1438
- value: t.label
1439
- }, D(t.label), 9, ai))), 128))], 8, ii)) : (e(!0), v(y, { key: 1 }, o(t, (t) => (e(), v("option", {
1440
- key: t.label,
1441
- value: t.label
1442
- }, D(t.label), 9, oi))), 128))], 64))), 128)),
1443
- T(x) ? (e(), v("option", si, D(T(m).blockSettings.customCondition), 1)) : b("", !0)
1444
- ], 42, ni), w.value || F.value ? (e(), v("div", ci, [
1445
- _("div", null, [_("label", li, D(T(m).blockSettings.customConditionBefore), 1), t(_("textarea", {
1446
- "onUpdate:modelValue": a[6] ||= (e) => E.value = e,
1447
- rows: "2",
1448
- class: p(T(yt))
1449
- }, null, 2), [[f, E.value]])]),
1450
- _("div", null, [_("label", ui, D(T(m).blockSettings.customConditionAfter), 1), t(_("textarea", {
1451
- "onUpdate:modelValue": a[7] ||= (e) => O.value = e,
1452
- rows: "2",
1453
- class: p(T(yt))
1454
- }, null, 2), [[f, O.value]])]),
1455
- _("div", di, [_("button", {
1456
- type: "button",
1457
- 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",
1458
- disabled: !E.value.trim(),
1459
- onClick: L
1460
- }, D(T(m).blockSettings.applyCondition), 9, fi)])
1461
- ])) : n.block.displayCondition && !F.value ? (e(), v(y, { key: 1 }, [n.block.displayCondition.description ? (e(), v("p", pi, D(n.block.displayCondition.description), 1)) : b("", !0), _("div", mi, [_("pre", hi, D(n.block.displayCondition.before), 1), n.block.displayCondition.after ? (e(), v("pre", gi, D(n.block.displayCondition.after), 1)) : b("", !0)])], 64)) : b("", !0)])]),
1462
- _: 1
1463
- }, 8, ["title", "open"])) : b("", !0)
1464
- ], 2));
1465
- }
1466
- }), vi = ["title"], yi = { class: "tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-text-muted)]" }, bi = {
1467
- key: 1,
1468
- class: "tpl:text-[var(--tpl-danger)]"
1469
- }, xi = [
1470
- "aria-checked",
1471
- "aria-label",
1472
- "disabled"
1473
- ], Si = /* @__PURE__ */ m({
1474
- __name: "BooleanField",
1475
- props: {
1476
- field: {},
1477
- modelValue: { type: Boolean },
1478
- readOnly: { type: Boolean }
1479
- },
1480
- emits: ["update:modelValue"],
1481
- setup(t, { emit: n }) {
1482
- let r = n, { t: i } = H();
1483
- return (n, a) => (e(), v("div", {
1484
- class: "tpl:mb-3.5",
1485
- title: t.readOnly ? T(i).customBlocks.dataSource.readOnlyTooltip : void 0
1486
- }, [_("label", { class: p(["tpl:flex tpl:items-center tpl:justify-between tpl:gap-2", t.readOnly ? "tpl:cursor-not-allowed" : "tpl:cursor-pointer"]) }, [_("span", yi, [
1487
- d(D(t.field.label) + " ", 1),
1488
- t.readOnly ? (e(), C(T(At), {
1489
- key: 0,
1490
- size: 12,
1491
- class: "tpl:inline tpl:text-[var(--tpl-text-dim)]"
1492
- })) : b("", !0),
1493
- t.field.required ? (e(), v("span", bi, " * ")) : b("", !0)
1494
- ]), _("button", {
1495
- type: "button",
1496
- role: "switch",
1497
- "aria-checked": t.modelValue,
1498
- "aria-label": t.field.label,
1499
- class: p([
1500
- "tpl:relative tpl:inline-flex tpl:h-5 tpl:w-9 tpl:shrink-0 tpl:rounded-full tpl:border-2 tpl:border-transparent tpl:transition-colors tpl:duration-200",
1501
- t.modelValue ? "tpl:bg-[var(--tpl-primary)]" : "tpl:bg-[var(--tpl-border)]",
1502
- t.readOnly ? "tpl:opacity-60 tpl:cursor-not-allowed" : "tpl:cursor-pointer"
1503
- ]),
1504
- disabled: t.readOnly,
1505
- onClick: a[0] ||= (e) => !t.readOnly && r("update:modelValue", !t.modelValue)
1506
- }, [_("span", { class: p(["tpl:pointer-events-none tpl:inline-block tpl:size-4 tpl:rounded-full tpl:bg-[var(--tpl-bg)] tpl:shadow tpl:transition-transform tpl:duration-200", t.modelValue ? "tpl:translate-x-4" : "tpl:translate-x-0"]) }, null, 2)], 10, xi)], 2)], 8, vi));
1507
- }
1508
- }), Ci = { class: "tpl:mb-3.5" }, wi = {
1509
- key: 1,
1510
- class: "tpl:text-[var(--tpl-danger)]"
1511
- }, Ti = /* @__PURE__ */ m({
1512
- __name: "FieldWrapper",
1513
- props: {
1514
- label: {},
1515
- required: { type: Boolean },
1516
- readOnly: { type: Boolean }
1517
- },
1518
- setup(t) {
1519
- return (n, r) => (e(), v("div", Ci, [_("label", { class: p(T(G)) }, [
1520
- d(D(t.label) + " ", 1),
1521
- t.readOnly ? (e(), C(T(At), {
1522
- key: 0,
1523
- size: 12,
1524
- class: "tpl:inline tpl:text-[var(--tpl-text-dim)]"
1525
- })) : b("", !0),
1526
- t.required ? (e(), v("span", wi, "*")) : b("", !0)
1527
- ], 2), s(n.$slots, "default")]));
1528
- }
1529
- }), Ei = /* @__PURE__ */ m({
1530
- __name: "ColorField",
1531
- props: {
1532
- field: {},
1533
- modelValue: {},
1534
- readOnly: { type: Boolean }
1535
- },
1536
- emits: ["update:modelValue"],
1537
- setup(t, { emit: n }) {
1538
- let r = n, { t: i } = H();
1539
- return (n, a) => (e(), C(Ti, {
1540
- label: t.field.label,
1541
- required: t.field.required,
1542
- "read-only": t.readOnly
1543
- }, {
1544
- default: M(() => [k(J, {
1545
- "model-value": t.modelValue,
1546
- placeholder: t.field.placeholder,
1547
- disabled: t.readOnly,
1548
- title: t.readOnly ? T(i).customBlocks.dataSource.readOnlyTooltip : void 0,
1549
- "onUpdate:modelValue": a[0] ||= (e) => r("update:modelValue", e)
1550
- }, null, 8, [
1551
- "model-value",
1552
- "placeholder",
1553
- "disabled",
1554
- "title"
1555
- ])]),
1556
- _: 1
1557
- }, 8, [
1558
- "label",
1559
- "required",
1560
- "read-only"
1561
- ]));
1562
- }
1563
- }), Di = {
1564
- key: 0,
1565
- 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)]",
1566
- style: { "background-color": "color-mix(in srgb, var(--tpl-bg) 90%, transparent)" }
1567
- }, Oi = [
1568
- "value",
1569
- "placeholder",
1570
- "title"
1571
- ], ki = ["value", "placeholder"], Ai = /* @__PURE__ */ m({
1572
- __name: "ImageField",
1573
- props: {
1574
- field: {},
1575
- modelValue: {},
1576
- readOnly: { type: Boolean }
1577
- },
1578
- emits: ["update:modelValue"],
1579
- setup(t, { emit: n }) {
1580
- let r = t, i = n, { t: a } = H(), o = A(Oe, null), s = mt(), c = g(() => !!o);
1581
- async function l() {
1582
- let e = await o?.({ accept: ["images"] });
1583
- s.alive && e && i("update:modelValue", e.url);
1584
- }
1585
- let f = u(), m = u(!1), h = g(() => c.value && !m.value && !r.readOnly);
1586
- async function x(e) {
1587
- if (o) {
1588
- m.value = !0;
1589
- try {
1590
- let t = await o({
1591
- accept: ["images"],
1592
- files: e
1593
- });
1594
- if (!s.alive) return;
1595
- t && i("update:modelValue", t.url);
1596
- } finally {
1597
- s.alive && (m.value = !1);
1598
- }
1599
- }
1600
- }
1601
- let { isOver: S } = de({
1602
- target: f,
1603
- enabled: h,
1604
- onFiles: x
1605
- });
1606
- return (n, r) => (e(), C(Ti, {
1607
- label: t.field.label,
1608
- required: t.field.required,
1609
- "read-only": t.readOnly
1610
- }, {
1611
- default: M(() => [_("div", {
1612
- ref_key: "dropZoneRef",
1613
- ref: f,
1614
- class: "tpl:relative"
1615
- }, [
1616
- h.value && (T(S) || m.value) ? (e(), v("div", Di, [m.value ? (e(), v(y, { key: 0 }, [k(T(Xe), {
1617
- class: "tpl-spinner",
1618
- size: 18,
1619
- "stroke-width": 2
1620
- }), d(" " + D(T(a).image.uploading), 1)], 64)) : (e(), v(y, { key: 1 }, [k(T(lt), {
1621
- size: 18,
1622
- "stroke-width": 1.5
1623
- }), d(" " + D(T(a).image.dropToUpload), 1)], 64))])) : b("", !0),
1624
- t.readOnly ? (e(), v("input", {
1625
- key: 1,
1626
- type: "url",
1627
- class: p([T(W), "tpl:opacity-60 tpl:cursor-not-allowed"]),
1628
- value: t.modelValue,
1629
- placeholder: t.field.placeholder || "https://...",
1630
- disabled: "",
1631
- title: T(a).customBlocks.dataSource.readOnlyTooltip
1632
- }, null, 10, Oi)) : (e(), v("input", {
1633
- key: 2,
1634
- type: "url",
1635
- class: p(T(W)),
1636
- value: t.modelValue,
1637
- placeholder: t.field.placeholder || "https://...",
1638
- onInput: r[0] ||= (e) => i("update:modelValue", e.target.value)
1639
- }, null, 42, ki)),
1640
- c.value && !t.readOnly ? (e(), v("button", {
1641
- key: 3,
1642
- 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)]",
1643
- onClick: r[1] ||= (e) => l()
1644
- }, [k(T(B), {
1645
- size: 14,
1646
- "stroke-width": 1.5
1647
- }), d(" " + D(T(a).image.browseMedia), 1)])) : b("", !0)
1648
- ], 512)]),
1649
- _: 1
1650
- }, 8, [
1651
- "label",
1652
- "required",
1653
- "read-only"
1654
- ]));
1655
- }
1656
- }), ji = [
1657
- "value",
1658
- "placeholder",
1659
- "min",
1660
- "max",
1661
- "step",
1662
- "disabled",
1663
- "title"
1664
- ], Mi = /* @__PURE__ */ m({
1665
- __name: "NumberField",
1666
- props: {
1667
- field: {},
1668
- modelValue: {},
1669
- readOnly: { type: Boolean }
1670
- },
1671
- emits: ["update:modelValue"],
1672
- setup(t, { emit: n }) {
1673
- let r = n, { t: i } = H();
1674
- return (n, a) => (e(), C(Ti, {
1675
- label: t.field.label,
1676
- required: t.field.required,
1677
- "read-only": t.readOnly
1678
- }, {
1679
- default: M(() => [_("input", {
1680
- type: "number",
1681
- class: p([T(W), t.readOnly && "tpl:opacity-60 tpl:cursor-not-allowed"]),
1682
- value: t.modelValue,
1683
- placeholder: t.field.placeholder,
1684
- min: t.field.min,
1685
- max: t.field.max,
1686
- step: t.field.step,
1687
- disabled: t.readOnly,
1688
- title: t.readOnly ? T(i).customBlocks.dataSource.readOnlyTooltip : void 0,
1689
- onInput: a[0] ||= (e) => !t.readOnly && r("update:modelValue", Number(e.target.value))
1690
- }, null, 42, ji)]),
1691
- _: 1
1692
- }, 8, [
1693
- "label",
1694
- "required",
1695
- "read-only"
1696
- ]));
1697
- }
1698
- }), Ni = { class: "tpl:flex tpl:flex-col tpl:gap-2" }, Pi = { class: "tpl:mb-2 tpl:flex tpl:items-center tpl:justify-between" }, Fi = { class: "tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text-dim)]" }, Ii = ["title", "onClick"], Li = {
1699
- key: 1,
1700
- class: "tpl:m-0 tpl:text-center tpl:text-xs tpl:text-[var(--tpl-text-dim)]"
1701
- }, Ri = /* @__PURE__ */ m({
1702
- __name: "RepeatableField",
1703
- props: {
1704
- field: {},
1705
- modelValue: {},
1706
- readOnly: { type: Boolean }
1707
- },
1708
- emits: ["update:modelValue"],
1709
- setup(t, { emit: n }) {
1710
- let i = t, a = n, { t: s } = H(), c = g(() => i.modelValue || []), l = g(() => !i.field.maxItems || c.value.length < i.field.maxItems), u = g(() => !i.field.minItems || c.value.length > i.field.minItems);
1711
- function f() {
1712
- if (!l.value || i.readOnly) return;
1713
- let e = {};
1714
- for (let t of i.field.fields) e[t.key] = t.default ?? "";
1715
- a("update:modelValue", [...c.value, e]);
1716
- }
1717
- function m(e) {
1718
- if (!u.value || i.readOnly) return;
1719
- let t = [...c.value];
1720
- t.splice(e, 1), a("update:modelValue", t);
1721
- }
1722
- function h(e, t, n) {
1723
- a("update:modelValue", c.value.map((r, i) => i === e ? {
1724
- ...r,
1725
- [t]: n
1726
- } : r));
1727
- }
1728
- return (n, i) => (e(), C(Ti, {
1729
- label: t.field.label,
1730
- required: t.field.required,
1731
- "read-only": t.readOnly
1732
- }, {
1733
- default: M(() => [_("div", Ni, [
1734
- (e(!0), v(y, null, o(c.value, (n, i) => (e(), v("div", {
1735
- key: `${t.field.key}-${i}`,
1736
- class: "tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-hover)] tpl:p-3"
1737
- }, [_("div", Pi, [_("span", Fi, " #" + D(i + 1), 1), u.value && !t.readOnly ? (e(), v("button", {
1738
- key: 0,
1739
- type: "button",
1740
- 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)]",
1741
- title: T(s).customBlocks.fields.removeItem,
1742
- onClick: (e) => m(i)
1743
- }, [k(T(ct), {
1744
- size: 12,
1745
- "stroke-width": 2
1746
- })], 8, Ii)) : b("", !0)]), (e(!0), v(y, null, o(t.field.fields, (a) => (e(), C(r(T(qi)(a.type)), {
1747
- key: a.key,
1748
- field: a,
1749
- "model-value": n[a.key],
1750
- "read-only": t.readOnly,
1751
- "onUpdate:modelValue": (e) => h(i, a.key, e)
1752
- }, null, 8, [
1753
- "field",
1754
- "model-value",
1755
- "read-only",
1756
- "onUpdate:modelValue"
1757
- ]))), 128))]))), 128)),
1758
- l.value && !t.readOnly ? (e(), v("button", {
1759
- key: 0,
1760
- type: "button",
1761
- class: p(T(vt)),
1762
- onClick: f
1763
- }, [k(T(Z), {
1764
- size: 14,
1765
- "stroke-width": 2
1766
- }), d(" " + D(T(s).customBlocks.fields.addItem), 1)], 2)) : b("", !0),
1767
- !l.value && !t.readOnly ? (e(), v("p", Li, D(T(s).customBlocks.fields.maxItemsReached), 1)) : b("", !0)
1768
- ])]),
1769
- _: 1
1770
- }, 8, [
1771
- "label",
1772
- "required",
1773
- "read-only"
1774
- ]));
1775
- }
1776
- }), zi = [
1777
- "value",
1778
- "disabled",
1779
- "title"
1780
- ], Bi = ["value"], Vi = /* @__PURE__ */ m({
1781
- __name: "SelectField",
1782
- props: {
1783
- field: {},
1784
- modelValue: {},
1785
- readOnly: { type: Boolean }
1786
- },
1787
- emits: ["update:modelValue"],
1788
- setup(t, { emit: n }) {
1789
- let r = n, { t: i } = H();
1790
- return (n, a) => (e(), C(Ti, {
1791
- label: t.field.label,
1792
- required: t.field.required,
1793
- "read-only": t.readOnly
1794
- }, {
1795
- default: M(() => [_("select", {
1796
- class: p([T(W), t.readOnly && "tpl:opacity-60 tpl:cursor-not-allowed"]),
1797
- value: t.modelValue,
1798
- disabled: t.readOnly,
1799
- title: t.readOnly ? T(i).customBlocks.dataSource.readOnlyTooltip : void 0,
1800
- onChange: a[0] ||= (e) => !t.readOnly && r("update:modelValue", e.target.value)
1801
- }, [(e(!0), v(y, null, o(t.field.options, (t) => (e(), v("option", {
1802
- key: t.value,
1803
- value: t.value
1804
- }, D(t.label), 9, Bi))), 128))], 42, zi)]),
1805
- _: 1
1806
- }, 8, [
1807
- "label",
1808
- "required",
1809
- "read-only"
1810
- ]));
1811
- }
1812
- }), Hi = [
1813
- "value",
1814
- "placeholder",
1815
- "title"
1816
- ], Ui = /* @__PURE__ */ m({
1817
- __name: "TextField",
1818
- props: {
1819
- field: {},
1820
- modelValue: {},
1821
- readOnly: { type: Boolean }
1822
- },
1823
- emits: ["update:modelValue"],
1824
- setup(t, { emit: n }) {
1825
- let r = n, { t: i } = H();
1826
- return (n, a) => (e(), C(Ti, {
1827
- label: t.field.label,
1828
- required: t.field.required,
1829
- "read-only": t.readOnly
1830
- }, {
1831
- default: M(() => [t.readOnly ? (e(), v("input", {
1832
- key: 0,
1833
- type: "text",
1834
- class: p([T(W), "tpl:opacity-60 tpl:cursor-not-allowed"]),
1835
- value: t.modelValue,
1836
- placeholder: t.field.placeholder,
1837
- disabled: "",
1838
- title: T(i).customBlocks.dataSource.readOnlyTooltip
1839
- }, null, 10, Hi)) : (e(), C(Q, {
1840
- key: 1,
1841
- "model-value": t.modelValue,
1842
- placeholder: t.field.placeholder,
1843
- "onUpdate:modelValue": a[0] ||= (e) => r("update:modelValue", e)
1844
- }, null, 8, ["model-value", "placeholder"]))]),
1845
- _: 1
1846
- }, 8, [
1847
- "label",
1848
- "required",
1849
- "read-only"
1850
- ]));
1851
- }
1852
- }), Wi = [
1853
- "value",
1854
- "placeholder",
1855
- "title"
1856
- ], Gi = "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", Ki = {
1857
- text: Ui,
1858
- textarea: /* @__PURE__ */ m({
1859
- __name: "TextareaField",
1860
- props: {
1861
- field: {},
1862
- modelValue: {},
1863
- readOnly: { type: Boolean }
1864
- },
1865
- emits: ["update:modelValue"],
1866
- setup(t, { emit: n }) {
1867
- let r = n, { t: i } = H();
1868
- return (n, a) => (e(), C(Ti, {
1869
- label: t.field.label,
1870
- required: t.field.required,
1871
- "read-only": t.readOnly
1872
- }, {
1873
- default: M(() => [t.readOnly ? (e(), v("textarea", {
1874
- key: 0,
1875
- value: t.modelValue,
1876
- placeholder: t.field.placeholder,
1877
- rows: "3",
1878
- disabled: "",
1879
- title: T(i).customBlocks.dataSource.readOnlyTooltip,
1880
- class: p(Gi)
1881
- }, null, 8, Wi)) : (e(), C(wn, {
1882
- key: 1,
1883
- "model-value": t.modelValue,
1884
- placeholder: t.field.placeholder,
1885
- "onUpdate:modelValue": a[0] ||= (e) => r("update:modelValue", e)
1886
- }, null, 8, ["model-value", "placeholder"]))]),
1887
- _: 1
1888
- }, 8, [
1889
- "label",
1890
- "required",
1891
- "read-only"
1892
- ]));
1893
- }
1894
- }),
1895
- image: Ai,
1896
- color: Ei,
1897
- number: Mi,
1898
- select: Vi,
1899
- boolean: Si,
1900
- repeatable: Ri
1901
- };
1902
- function qi(e) {
1903
- return Ki[e] ?? Ui;
1904
- }
1905
- //#endregion
1906
- //#region src/components/toolbar/CustomBlockToolbar.vue?vue&type=script&setup=true&lang.ts
1907
- var Ji = {
1908
- key: 0,
1909
- class: "tpl:p-4"
1910
- }, Yi = { class: "tpl:m-0 tpl:text-center tpl:text-sm tpl:text-[var(--tpl-text-muted)]" }, Xi = { key: 1 }, Zi = {
1911
- key: 0,
1912
- class: "tpl:m-0 tpl:mb-3 tpl:text-xs tpl:text-[var(--tpl-text-dim)]"
1913
- }, Qi = {
1914
- key: 1,
1915
- class: "tpl:mb-4"
1916
- }, $i = {
1917
- key: 1,
1918
- class: "tpl:flex tpl:h-[32px] tpl:items-center"
1919
- }, ea = {
1920
- key: 0,
1921
- class: "tpl:w-full tpl:text-center tpl:text-xs tpl:text-[var(--tpl-text-muted)]"
1922
- }, ta = {
1923
- key: 2,
1924
- class: "tpl:m-0 tpl:mt-2 tpl:flex tpl:items-center tpl:gap-1.5 tpl:text-xs tpl:text-[var(--tpl-danger)]"
1925
- }, na = /* @__PURE__ */ m({
1926
- __name: "CustomBlockToolbar",
1927
- props: { block: {} },
1928
- emits: ["updateFieldValues", "updateDataSourceFetched"],
1929
- setup(t, { emit: n }) {
1930
- let i = t, a = n, { t: s } = H(), c = A(Pe, []), l = g(() => c.find((e) => e.type === i.block.customType)), { isFetching: u, fetchError: f, fetch: p, hasDataSource: m, needsFetch: h } = V({
1931
- definition: l,
1932
- block: g(() => i.block),
1933
- onUpdate: (e, t) => {
1934
- a("updateFieldValues", e), a("updateDataSourceFetched", t);
1935
- }
1936
- });
1937
- function x(e) {
1938
- return e.readOnly === !0 && m.value && !!i.block.dataSourceFetched;
1939
- }
1940
- function S(e, t) {
1941
- a("updateFieldValues", {
1942
- ...i.block.fieldValues,
1943
- [e]: t
1944
- });
1945
- }
1946
- return (n, i) => l.value ? (e(), v("div", Xi, [
1947
- l.value.description ? (e(), v("p", Zi, D(l.value.description), 1)) : b("", !0),
1948
- T(m) ? (e(), v("div", Qi, [T(h) && !T(u) ? (e(), v("button", {
1949
- key: 0,
1950
- type: "button",
1951
- 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)]",
1952
- onClick: i[0] ||= (...e) => T(p) && T(p)(...e)
1953
- }, D(l.value?.dataSource?.label || T(s).customBlocks.dataSource.fetchButton), 1)) : (e(), v("div", $i, [T(u) ? (e(), v("div", ea, D(T(s).customBlocks.dataSource.fetching), 1)) : (e(), v("button", {
1954
- key: 1,
1955
- type: "button",
1956
- 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)]",
1957
- onClick: i[1] ||= (...e) => T(p) && T(p)(...e)
1958
- }, [k(T(rt), { size: 12 }), d(" " + D(T(s).customBlocks.dataSource.changeButton), 1)]))])), T(f) ? (e(), v("p", ta, [k(T(Ge), {
1959
- size: 14,
1960
- class: "tpl:shrink-0"
1961
- }), d(" " + D(T(s).customBlocks.dataSource.fetchError), 1)])) : b("", !0)])) : b("", !0),
1962
- (e(!0), v(y, null, o(l.value.fields, (n) => (e(), C(r(T(qi)(n.type)), {
1963
- key: n.key,
1964
- field: n,
1965
- "model-value": t.block.fieldValues[n.key],
1966
- "read-only": x(n),
1967
- "onUpdate:modelValue": (e) => S(n.key, e)
1968
- }, null, 8, [
1969
- "field",
1970
- "model-value",
1971
- "read-only",
1972
- "onUpdate:modelValue"
1973
- ]))), 128))
1974
- ])) : (e(), v("div", Ji, [_("p", Yi, D(T(s).customBlocks.toolbar.noDefinition), 1)]));
1975
- }
1976
- }), ra = { class: "tpl:mb-3.5" }, ia = { class: "tpl:mb-3.5" }, aa = { class: "tpl:mb-3.5" }, oa = { class: "tpl:flex tpl:items-stretch" }, sa = ["value"], ca = /* @__PURE__ */ m({
1977
- __name: "DividerToolbar",
1978
- props: { block: {} },
1979
- emits: ["update"],
1980
- setup(t, { emit: n }) {
1981
- let r = n, { t: i } = H();
1982
- function a(e, t) {
1983
- r("update", { [e]: t });
1984
- }
1985
- return (n, r) => (e(), v(y, null, [
1986
- _("div", ra, [_("label", { class: p(T(G)) }, D(T(i).divider.style), 3), k(X, {
1987
- options: [
1988
- {
1989
- value: "solid",
1990
- label: T(i).divider.solid
1991
- },
1992
- {
1993
- value: "dashed",
1994
- label: T(i).divider.dashed
1995
- },
1996
- {
1997
- value: "dotted",
1998
- label: T(i).divider.dotted
1999
- }
2000
- ],
2001
- "model-value": t.block.lineStyle,
2002
- "onUpdate:modelValue": r[0] ||= (e) => a("lineStyle", e)
2003
- }, null, 8, ["options", "model-value"])]),
2004
- _("div", ia, [_("label", { class: p(T(G)) }, D(T(i).divider.color), 3), k(J, {
2005
- "model-value": t.block.color,
2006
- "onUpdate:modelValue": r[1] ||= (e) => a("color", e)
2007
- }, null, 8, ["model-value"])]),
2008
- _("div", aa, [_("label", { class: p(T(G)) }, D(T(i).divider.thickness), 3), _("div", oa, [_("input", {
2009
- type: "number",
2010
- class: p(T(q)),
2011
- value: t.block.thickness,
2012
- min: "1",
2013
- max: "10",
2014
- onInput: r[2] ||= (e) => a("thickness", Number(e.target.value))
2015
- }, null, 42, sa), _("span", { class: p(T(K)) }, "px", 2)])])
2016
- ], 64));
2017
- }
2018
- }), la = { class: "tpl:mb-3.5" }, ua = ["value"], da = { class: "tpl:mt-1.5 tpl:flex tpl:items-start tpl:gap-1.5 tpl:text-[11px] tpl:text-[var(--tpl-text-dim)]" }, fa = /* @__PURE__ */ m({
2019
- __name: "HtmlToolbar",
2020
- props: { block: {} },
2021
- emits: ["update"],
2022
- setup(t, { emit: n }) {
2023
- let r = n, { t: i } = H();
2024
- return (n, a) => (e(), v("div", la, [
2025
- _("label", { class: p(T(G)) }, D(T(i).html.content), 3),
2026
- _("textarea", {
2027
- value: t.block.content,
2028
- placeholder: "<div>...</div>",
2029
- rows: "10",
2030
- class: p(T(yt)),
2031
- onInput: a[0] ||= (e) => r("update", { content: e.target.value })
2032
- }, null, 42, ua),
2033
- _("p", da, [k(T(at), {
2034
- size: 12,
2035
- class: "tpl:mt-0.5 tpl:shrink-0"
2036
- }), d(" " + D(T(i).html.sanitizationHint), 1)])
2037
- ]));
2038
- }
2039
- }), pa = { class: "tpl:mb-3.5" }, ma = {
2040
- key: 0,
2041
- 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)]",
2042
- style: { "background-color": "color-mix(in srgb, var(--tpl-bg) 90%, transparent)" }
2043
- }, ha = {
2044
- key: 0,
2045
- class: "tpl:mb-3.5"
2046
- }, ga = ["value", "placeholder"], _a = { class: "tpl:mb-3.5" }, va = { class: "tpl:mt-2 tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:text-[12px] tpl:text-[var(--tpl-text-muted)]" }, ya = ["checked"], ba = { class: "tpl:block tpl:text-[var(--tpl-text-dim)]" }, xa = { class: "tpl:mb-3.5" }, Sa = ["value"], Ca = { value: "full" }, wa = { value: "custom" }, Ta = {
2047
- key: 0,
2048
- class: "tpl:mt-2 tpl:flex tpl:items-stretch"
2049
- }, Ea = ["value"], Da = { class: "tpl:mb-3.5" }, Oa = { class: "tpl:mb-3.5" }, ka = {
2050
- key: 0,
2051
- class: "tpl:mt-2 tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:text-[12px] tpl:text-[var(--tpl-text-muted)]"
2052
- }, Aa = ["checked"], ja = 350, Ma = /* @__PURE__ */ m({
2053
- __name: "ImageToolbar",
2054
- props: { block: {} },
2055
- emits: ["update"],
2056
- setup(t, { emit: n }) {
2057
- let r = t, i = n, { t: a } = H(), o = A(Oe, null), s = A(je, L.liquid), c = mt(), l = g(() => !!o), f = u(!1), m = u(!1), { start: h } = Te(() => {
2058
- f.value = !1;
2059
- }, 1e3, { immediate: !1 }), x = [
2060
- 300,
2061
- 400,
2062
- 500
2063
- ], S = g(() => {
2064
- let e = r.block.width;
2065
- return e === "full" ? "full" : x.includes(e) ? String(e) : "custom";
2066
- });
2067
- function C(e, t) {
2068
- i("update", { [e]: t });
2069
- }
2070
- function w(e) {
2071
- if (e === "custom") {
2072
- let e = r.block.width;
2073
- (typeof e != "number" || x.includes(e)) && C("width", ja);
2074
- return;
2075
- }
2076
- C("width", e === "full" ? "full" : Number(e));
2077
- }
2078
- function E(e) {
2079
- let t = Number(e);
2080
- !Number.isFinite(t) || t <= 0 || C("width", t);
2081
- }
2082
- async function O() {
2083
- let e = await o?.({ accept: ["images"] });
2084
- c.alive && e && (C("src", e.url), e.alt && (C("alt", e.alt), m.value = !0), f.value = !0, h());
2085
- }
2086
- let j = u(), M = u(!1), N = g(() => I(r.block.src, s)), P = g(() => l.value && !M.value && !N.value);
2087
- async function F(e) {
2088
- if (o) {
2089
- M.value = !0;
2090
- try {
2091
- let t = await o({
2092
- accept: ["images"],
2093
- files: e
2094
- });
2095
- if (!c.alive) return;
2096
- t && (C("src", t.url), t.alt && (C("alt", t.alt), m.value = !0), f.value = !0, h());
2097
- } finally {
2098
- c.alive && (M.value = !1);
2099
- }
2100
- }
2101
- }
2102
- let { isOver: R } = de({
2103
- target: j,
2104
- enabled: P,
2105
- onFiles: F
2106
- });
2107
- return (n, r) => (e(), v(y, null, [
2108
- _("div", pa, [_("label", { class: p(T(G)) }, D(T(a).image.imageUrl), 3), _("div", {
2109
- ref_key: "dropZoneRef",
2110
- ref: j,
2111
- class: "tpl:relative"
2112
- }, [
2113
- P.value && (T(R) || M.value) ? (e(), v("div", ma, [M.value ? (e(), v(y, { key: 0 }, [k(T(Xe), {
2114
- class: "tpl-spinner",
2115
- size: 18,
2116
- "stroke-width": 2
2117
- }), d(" " + D(T(a).image.uploading), 1)], 64)) : (e(), v(y, { key: 1 }, [k(T(lt), {
2118
- size: 18,
2119
- "stroke-width": 1.5
2120
- }), d(" " + D(T(a).image.dropToUpload), 1)], 64))])) : b("", !0),
2121
- k(Q, {
2122
- "model-value": t.block.src,
2123
- type: "url",
2124
- placeholder: T(a).image.imageUrlPlaceholder,
2125
- pulse: f.value,
2126
- "onUpdate:modelValue": r[0] ||= (e) => C("src", e)
2127
- }, null, 8, [
2128
- "model-value",
2129
- "placeholder",
2130
- "pulse"
2131
- ]),
2132
- l.value ? (e(), v("button", {
2133
- key: 1,
2134
- 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",
2135
- style: {
2136
- "border-color": "var(--tpl-border)",
2137
- color: "var(--tpl-primary)",
2138
- "background-color": "var(--tpl-bg)"
2139
- },
2140
- onClick: O
2141
- }, [k(T(B), {
2142
- size: 14,
2143
- "stroke-width": 1.5
2144
- }), d(" " + D(T(a).image.browseMedia), 1)])) : b("", !0)
2145
- ], 512)]),
2146
- T(I)(t.block.src, T(s)) ? (e(), v("div", ha, [_("label", { class: p(T(G)) }, [d(D(T(a).image.placeholderUrl) + " ", 1), r[9] ||= _("span", { class: "tpl:font-normal tpl:text-[var(--tpl-text-dim)]" }, D("(optional)"), -1)], 2), _("input", {
2147
- type: "url",
2148
- class: p(T(W)),
2149
- value: t.block.placeholderUrl || "",
2150
- placeholder: T(a).image.placeholderUrlPlaceholder,
2151
- onInput: r[1] ||= (e) => C("placeholderUrl", e.target.value)
2152
- }, null, 42, ga)])) : b("", !0),
2153
- _("div", _a, [
2154
- _("label", { class: p(T(G)) }, D(T(a).image.altText), 3),
2155
- k(Q, {
2156
- "model-value": t.block.alt,
2157
- type: "text",
2158
- placeholder: T(a).image.altTextPlaceholder,
2159
- pulse: m.value,
2160
- disabled: t.block.decorative === !0,
2161
- "onUpdate:modelValue": r[2] ||= (e) => C("alt", e)
2162
- }, null, 8, [
2163
- "model-value",
2164
- "placeholder",
2165
- "pulse",
2166
- "disabled"
2167
- ]),
2168
- _("label", va, [_("input", {
2169
- type: "checkbox",
2170
- class: "tpl:size-3.5 tpl:cursor-pointer tpl:accent-[var(--tpl-primary)]",
2171
- checked: t.block.decorative === !0,
2172
- onChange: r[3] ||= (e) => C("decorative", e.target.checked)
2173
- }, null, 40, ya), _("span", null, [d(D(T(a).image.decorative) + " ", 1), _("span", ba, D(T(a).image.decorativeHint), 1)])])
2174
- ]),
2175
- _("div", xa, [
2176
- _("label", { class: p(T(G)) }, D(T(a).image.width), 3),
2177
- _("select", {
2178
- class: p(T(W)),
2179
- value: S.value,
2180
- onChange: r[4] ||= (e) => w(e.target.value)
2181
- }, [
2182
- _("option", Ca, D(T(a).image.fullWidth), 1),
2183
- r[10] ||= _("option", { value: "300" }, "300px", -1),
2184
- r[11] ||= _("option", { value: "400" }, "400px", -1),
2185
- r[12] ||= _("option", { value: "500" }, "500px", -1),
2186
- _("option", wa, D(T(a).image.widthCustom), 1)
2187
- ], 42, Sa),
2188
- S.value === "custom" ? (e(), v("div", Ta, [_("input", {
2189
- type: "number",
2190
- class: p(T(q)),
2191
- value: typeof t.block.width == "number" ? t.block.width : ja,
2192
- min: "20",
2193
- onInput: r[5] ||= (e) => E(e.target.value)
2194
- }, null, 42, Ea), _("span", { class: p(T(K)) }, "px", 2)])) : b("", !0)
2195
- ]),
2196
- _("div", Da, [_("label", { class: p(T(G)) }, D(T(a).title.align), 3), k(X, {
2197
- options: [
2198
- {
2199
- value: "left",
2200
- label: T(a).title.alignLeft
2201
- },
2202
- {
2203
- value: "center",
2204
- label: T(a).title.alignCenter
2205
- },
2206
- {
2207
- value: "right",
2208
- label: T(a).title.alignRight
2209
- }
2210
- ],
2211
- "model-value": t.block.align,
2212
- "onUpdate:modelValue": r[6] ||= (e) => C("align", e)
2213
- }, null, 8, ["options", "model-value"])]),
2214
- _("div", Oa, [
2215
- _("label", { class: p(T(G)) }, D(T(a).image.linkUrl), 3),
2216
- k(Q, {
2217
- "model-value": t.block.linkUrl || "",
2218
- type: "url",
2219
- placeholder: T(a).image.imageUrlPlaceholder,
2220
- "onUpdate:modelValue": r[7] ||= (e) => C("linkUrl", e)
2221
- }, null, 8, ["model-value", "placeholder"]),
2222
- t.block.linkUrl ? (e(), v("label", ka, [_("input", {
2223
- type: "checkbox",
2224
- class: "tpl:size-3.5 tpl:cursor-pointer tpl:accent-[var(--tpl-primary)]",
2225
- checked: t.block.linkOpenInNewTab ?? !1,
2226
- onChange: r[8] ||= (e) => C("linkOpenInNewTab", e.target.checked)
2227
- }, null, 40, Aa), d(" " + D(T(a).image.openInNewTab), 1)])) : b("", !0)
2228
- ])
2229
- ], 64));
2230
- }
2231
- }), Na = { class: "tpl:flex tpl:flex-col tpl:gap-2" }, Pa = { class: "tpl:flex tpl:items-center tpl:gap-2" }, Fa = [
2232
- "value",
2233
- "placeholder",
2234
- "onInput"
2235
- ], Ia = ["title", "onClick"], La = { class: "tpl:flex tpl:items-center tpl:gap-3 tpl:text-xs tpl:text-[var(--tpl-text-muted)]" }, Ra = ["checked", "onChange"], za = { class: "tpl:flex tpl:items-center tpl:gap-2" }, Ba = ["value"], Va = { value: "" }, Ha = ["value"], Ua = ["value"], Wa = /* @__PURE__ */ m({
2236
- __name: "MenuToolbar",
2237
- props: {
2238
- block: {},
2239
- fontFamilies: {}
2240
- },
2241
- emits: ["update"],
2242
- setup(t, { emit: n }) {
2243
- let r = t, i = n, { t: a } = H(), s = g(() => [
2244
- {
2245
- key: "openInNewTab",
2246
- label: a.menu.openInNewTab
2247
- },
2248
- {
2249
- key: "bold",
2250
- label: a.menu.bold
2251
- },
2252
- {
2253
- key: "underline",
2254
- label: a.menu.underline
2255
- }
2256
- ]), c = g(() => [
2257
- {
2258
- value: "left",
2259
- label: a.title.alignLeft,
2260
- icon: et
2261
- },
2262
- {
2263
- value: "center",
2264
- label: a.title.alignCenter,
2265
- icon: $e
2266
- },
2267
- {
2268
- value: "right",
2269
- label: a.title.alignRight,
2270
- icon: Qe
2271
- }
2272
- ]);
2273
- function l(e, t) {
2274
- i("update", { [e]: t });
2275
- }
2276
- function u() {
2277
- let e = {
2278
- id: N(),
2279
- text: "",
2280
- url: "",
2281
- openInNewTab: !1,
2282
- bold: !1,
2283
- underline: !1
2284
- };
2285
- i("update", { items: [...r.block.items, e] });
2286
- }
2287
- function f(e, t, n) {
2288
- i("update", { items: r.block.items.map((r) => r.id === e ? {
2289
- ...r,
2290
- [t]: n
2291
- } : r) });
2292
- }
2293
- function m(e) {
2294
- i("update", { items: r.block.items.filter((t) => t.id !== e) });
2295
- }
2296
- return (n, r) => (e(), v(y, null, [
2297
- k(Y, { label: T(a).menu.items }, {
2298
- default: M(() => [_("div", Na, [(e(!0), v(y, null, o(t.block.items, (n) => (e(), v("div", {
2299
- key: n.id,
2300
- 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"
2301
- }, [
2302
- _("div", Pa, [_("input", {
2303
- type: "text",
2304
- class: p([T(W), "tpl:flex-1"]),
2305
- value: n.text,
2306
- placeholder: T(a).menu.text,
2307
- onInput: (e) => f(n.id, "text", e.target.value)
2308
- }, null, 42, Fa), _("button", {
2309
- class: p(T(_t)),
2310
- title: T(a).menu.removeItem,
2311
- onClick: (e) => m(n.id)
2312
- }, [k(T(ut), {
2313
- size: 14,
2314
- "stroke-width": 2
2315
- })], 10, Ia)]),
2316
- k(Q, {
2317
- "model-value": n.url,
2318
- type: "url",
2319
- placeholder: T(a).menu.urlPlaceholder,
2320
- "onUpdate:modelValue": (e) => f(n.id, "url", e)
2321
- }, null, 8, [
2322
- "model-value",
2323
- "placeholder",
2324
- "onUpdate:modelValue"
2325
- ]),
2326
- _("div", La, [(e(!0), v(y, null, o(s.value, (t) => (e(), v("label", {
2327
- key: t.key,
2328
- class: "tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-1"
2329
- }, [_("input", {
2330
- type: "checkbox",
2331
- checked: n[t.key],
2332
- class: "tpl:accent-[var(--tpl-primary)]",
2333
- onChange: (e) => f(n.id, t.key, e.target.checked)
2334
- }, null, 40, Ra), d(" " + D(t.label), 1)]))), 128))]),
2335
- _("div", za, [_("label", { class: p([T(G), "tpl:!mb-0"]) }, D(T(a).menu.color), 3), k(J, {
2336
- "swatch-only": "",
2337
- "model-value": n.color || t.block.linkColor || t.block.color,
2338
- "onUpdate:modelValue": (e) => f(n.id, "color", e)
2339
- }, null, 8, ["model-value", "onUpdate:modelValue"])])
2340
- ]))), 128)), _("button", {
2341
- class: p(T(vt)),
2342
- onClick: u
2343
- }, [k(T(Z), {
2344
- size: 14,
2345
- "stroke-width": 2
2346
- }), d(" " + D(T(a).menu.addItem), 1)], 2)])]),
2347
- _: 1
2348
- }, 8, ["label"]),
2349
- k(Y, { label: T(a).menu.fontFamily }, {
2350
- default: M(() => [_("select", {
2351
- class: p(T(W)),
2352
- value: t.block.fontFamily || "",
2353
- onChange: r[0] ||= (e) => l("fontFamily", e.target.value || void 0)
2354
- }, [_("option", Va, D(T(a).title.inheritFont), 1), (e(!0), v(y, null, o(t.fontFamilies, (t) => (e(), v("option", {
2355
- key: t.value,
2356
- value: t.value
2357
- }, D(t.label), 9, Ha))), 128))], 42, Ba)]),
2358
- _: 1
2359
- }, 8, ["label"]),
2360
- k(Y, { label: T(a).menu.fontSize }, {
2361
- default: M(() => [k(Ct, {
2362
- "model-value": t.block.fontSize,
2363
- min: 8,
2364
- max: 48,
2365
- suffix: "px",
2366
- "onUpdate:modelValue": r[1] ||= (e) => l("fontSize", e)
2367
- }, null, 8, ["model-value"])]),
2368
- _: 1
2369
- }, 8, ["label"]),
2370
- k(Y, { label: T(a).menu.color }, {
2371
- default: M(() => [k(J, {
2372
- "model-value": t.block.color,
2373
- "onUpdate:modelValue": r[2] ||= (e) => l("color", e)
2374
- }, null, 8, ["model-value"])]),
2375
- _: 1
2376
- }, 8, ["label"]),
2377
- k(Y, { label: T(a).menu.linkColor }, {
2378
- default: M(() => [k(J, {
2379
- "model-value": t.block.linkColor || t.block.color,
2380
- "onUpdate:modelValue": r[3] ||= (e) => l("linkColor", e || void 0)
2381
- }, null, 8, ["model-value"])]),
2382
- _: 1
2383
- }, 8, ["label"]),
2384
- k(Y, { label: T(a).menu.textAlign }, {
2385
- default: M(() => [k(X, {
2386
- options: c.value,
2387
- "model-value": t.block.textAlign,
2388
- "onUpdate:modelValue": r[4] ||= (e) => l("textAlign", e)
2389
- }, null, 8, ["options", "model-value"])]),
2390
- _: 1
2391
- }, 8, ["label"]),
2392
- k(Y, { label: T(a).menu.separator }, {
2393
- default: M(() => [_("input", {
2394
- type: "text",
2395
- class: p(T(W)),
2396
- value: t.block.separator,
2397
- onInput: r[5] ||= (e) => l("separator", e.target.value)
2398
- }, null, 42, Ua)]),
2399
- _: 1
2400
- }, 8, ["label"]),
2401
- k(Y, { label: T(a).menu.separatorColor }, {
2402
- default: M(() => [k(J, {
2403
- "model-value": t.block.separatorColor,
2404
- "onUpdate:modelValue": r[6] ||= (e) => l("separatorColor", e)
2405
- }, null, 8, ["model-value"])]),
2406
- _: 1
2407
- }, 8, ["label"]),
2408
- k(Y, { label: T(a).menu.spacing }, {
2409
- default: M(() => [k(Ct, {
2410
- "model-value": t.block.spacing,
2411
- min: 0,
2412
- max: 50,
2413
- suffix: "px",
2414
- "onUpdate:modelValue": r[7] ||= (e) => l("spacing", e)
2415
- }, null, 8, ["model-value"])]),
2416
- _: 1
2417
- }, 8, ["label"])
2418
- ], 64));
2419
- }
2420
- });
2421
- //#endregion
2422
- //#region src/utils/rebalanceColumnChildren.ts
2423
- function Ga(e) {
2424
- return e === "1" ? 1 : e === "3" ? 3 : 2;
2425
- }
2426
- function Ka(e, t) {
2427
- let n = Ga(t);
2428
- if (e.length === n) return e;
2429
- if (e.length < n) {
2430
- let t = Array.from({ length: n - e.length }, () => []);
2431
- return [...e, ...t];
2432
- }
2433
- let r = e.slice(0, n), i = e.slice(n).flat(), a = [...r[n - 1], ...i];
2434
- return [...r.slice(0, n - 1), a];
2435
- }
2436
- //#endregion
2437
- //#region src/components/toolbar/SectionToolbar.vue?vue&type=script&setup=true&lang.ts
2438
- var qa = { class: "tpl:mb-3.5" }, Ja = ["value"], Ya = ["value"], Xa = /* @__PURE__ */ m({
2439
- __name: "SectionToolbar",
2440
- props: { block: {} },
2441
- emits: ["update"],
2442
- setup(t, { emit: n }) {
2443
- let r = t, i = n, { t: a } = H(), s = g(() => [
2444
- {
2445
- value: "1",
2446
- label: a.section.column1
2447
- },
2448
- {
2449
- value: "2",
2450
- label: a.section.column2
2451
- },
2452
- {
2453
- value: "3",
2454
- label: a.section.column3
2455
- },
2456
- {
2457
- value: "1-2",
2458
- label: a.section.ratio12
2459
- },
2460
- {
2461
- value: "2-1",
2462
- label: a.section.ratio21
2463
- }
2464
- ]);
2465
- function c(e) {
2466
- let t = e.target.value;
2467
- i("update", {
2468
- columns: t,
2469
- children: Ka(r.block.children, t)
2470
- });
2471
- }
2472
- return (n, r) => (e(), v("div", qa, [_("label", { class: p(T(G)) }, D(T(a).section.columns), 3), _("select", {
2473
- class: p(T(W)),
2474
- value: t.block.columns,
2475
- onChange: c
2476
- }, [(e(!0), v(y, null, o(s.value, (t) => (e(), v("option", {
2477
- key: t.value,
2478
- value: t.value
2479
- }, D(t.label), 9, Ya))), 128))], 42, Ja)]));
2480
- }
2481
- }), Za = { class: "tpl:mb-3.5" }, Qa = { class: "tpl:flex tpl:flex-col tpl:gap-2" }, $a = { class: "tpl:flex tpl:items-center tpl:gap-2" }, eo = ["value", "onChange"], to = ["value"], no = ["title", "onClick"], ro = { class: "tpl:mb-3.5" }, io = ["value"], ao = { value: "solid" }, oo = { value: "outlined" }, so = { value: "rounded" }, co = { value: "square" }, lo = { value: "circle" }, uo = { class: "tpl:mb-3.5" }, fo = { class: "tpl:mb-3.5" }, po = { class: "tpl:flex tpl:items-stretch" }, mo = ["value"], ho = { class: "tpl:mb-3.5" }, go = /* @__PURE__ */ m({
2482
- __name: "SocialToolbar",
2483
- props: { block: {} },
2484
- emits: ["update"],
2485
- setup(t, { emit: n }) {
2486
- let r = t, i = n, { t: a } = H();
2487
- function s(e, t) {
2488
- i("update", { [e]: t });
2489
- }
2490
- function c() {
2491
- let e = {
2492
- id: N(),
2493
- platform: "facebook",
2494
- url: ""
2495
- };
2496
- i("update", { icons: [...r.block.icons, e] });
2497
- }
2498
- function l(e, t, n) {
2499
- i("update", { icons: r.block.icons.map((r) => r.id === e ? {
2500
- ...r,
2501
- [t]: n
2502
- } : r) });
2503
- }
2504
- function u(e) {
2505
- i("update", { icons: r.block.icons.filter((t) => t.id !== e) });
2506
- }
2507
- return (n, r) => (e(), v(y, null, [
2508
- _("div", Za, [_("label", { class: p(T(G)) }, D(T(a).social.icons), 3), _("div", Qa, [(e(!0), v(y, null, o(t.block.icons, (t) => (e(), v("div", {
2509
- key: t.id,
2510
- 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"
2511
- }, [_("div", $a, [_("select", {
2512
- "data-testid": "social-platform-select",
2513
- class: p([T(W), "tpl:flex-1"]),
2514
- value: t.platform,
2515
- onChange: (e) => l(t.id, "platform", e.target.value)
2516
- }, [(e(!0), v(y, null, o(T(ve), (t) => (e(), v("option", {
2517
- key: t,
2518
- value: t
2519
- }, D(T(a).social.platforms[t]), 9, to))), 128))], 42, eo), _("button", {
2520
- class: p(T(_t)),
2521
- title: T(a).social.removeIcon,
2522
- onClick: (e) => u(t.id)
2523
- }, [k(T(ut), {
2524
- size: 14,
2525
- "stroke-width": 2
2526
- })], 10, no)]), k(Q, {
2527
- "model-value": t.url,
2528
- type: "url",
2529
- placeholder: T(a).social.urlPlaceholder,
2530
- "onUpdate:modelValue": (e) => l(t.id, "url", e)
2531
- }, null, 8, [
2532
- "model-value",
2533
- "placeholder",
2534
- "onUpdate:modelValue"
2535
- ])]))), 128)), _("button", {
2536
- class: p(T(vt)),
2537
- onClick: c
2538
- }, [k(T(Z), {
2539
- size: 14,
2540
- "stroke-width": 2
2541
- }), d(" " + D(T(a).social.addIcon), 1)], 2)])]),
2542
- _("div", ro, [_("label", { class: p(T(G)) }, D(T(a).social.style), 3), _("select", {
2543
- class: p(T(W)),
2544
- value: t.block.iconStyle,
2545
- onChange: r[0] ||= (e) => s("iconStyle", e.target.value)
2546
- }, [
2547
- _("option", ao, D(T(a).social.styleSolid), 1),
2548
- _("option", oo, D(T(a).social.styleOutlined), 1),
2549
- _("option", so, D(T(a).social.styleRounded), 1),
2550
- _("option", co, D(T(a).social.styleSquare), 1),
2551
- _("option", lo, D(T(a).social.styleCircle), 1)
2552
- ], 42, io)]),
2553
- _("div", uo, [_("label", { class: p(T(G)) }, D(T(a).social.size), 3), k(X, {
2554
- options: [
2555
- {
2556
- value: "small",
2557
- label: T(a).social.sizeSmall
2558
- },
2559
- {
2560
- value: "medium",
2561
- label: T(a).social.sizeMedium
2562
- },
2563
- {
2564
- value: "large",
2565
- label: T(a).social.sizeLarge
2566
- }
2567
- ],
2568
- "model-value": t.block.iconSize,
2569
- "onUpdate:modelValue": r[1] ||= (e) => s("iconSize", e)
2570
- }, null, 8, ["options", "model-value"])]),
2571
- _("div", fo, [_("label", { class: p(T(G)) }, D(T(a).social.spacing), 3), _("div", po, [_("input", {
2572
- type: "number",
2573
- class: p(T(q)),
2574
- value: t.block.spacing,
2575
- min: "0",
2576
- max: "50",
2577
- onInput: r[2] ||= (e) => s("spacing", Number(e.target.value))
2578
- }, null, 42, mo), _("span", { class: p(T(K)) }, "px", 2)])]),
2579
- _("div", ho, [_("label", { class: p(T(G)) }, D(T(a).social.align), 3), k(X, {
2580
- options: [
2581
- {
2582
- value: "left",
2583
- label: T(a).title.alignLeft,
2584
- icon: T(et)
2585
- },
2586
- {
2587
- value: "center",
2588
- label: T(a).title.alignCenter,
2589
- icon: T($e)
2590
- },
2591
- {
2592
- value: "right",
2593
- label: T(a).title.alignRight,
2594
- icon: T(Qe)
2595
- }
2596
- ],
2597
- "model-value": t.block.align,
2598
- "onUpdate:modelValue": r[3] ||= (e) => s("align", e)
2599
- }, null, 8, ["options", "model-value"])])
2600
- ], 64));
2601
- }
2602
- }), _o = { class: "tpl:mb-3.5" }, vo = { class: "tpl:flex tpl:items-stretch" }, yo = ["value"], bo = ["value"], xo = /* @__PURE__ */ m({
2603
- __name: "SpacerToolbar",
2604
- props: { block: {} },
2605
- emits: ["update"],
2606
- setup(t, { emit: n }) {
2607
- let r = n, { t: i } = H();
2608
- return (n, a) => (e(), v("div", _o, [
2609
- _("label", { class: p(T(G)) }, D(T(i).spacer.height), 3),
2610
- _("div", vo, [_("input", {
2611
- type: "number",
2612
- class: p(T(q)),
2613
- value: t.block.height,
2614
- min: "10",
2615
- max: "100",
2616
- onInput: a[0] ||= (e) => r("update", { height: Number(e.target.value) })
2617
- }, null, 42, yo), _("span", { class: p(T(K)) }, "px", 2)]),
2618
- _("input", {
2619
- type: "range",
2620
- class: "tpl:mt-2 tpl:w-full tpl:accent-[var(--tpl-primary)]",
2621
- value: t.block.height,
2622
- min: "10",
2623
- max: "100",
2624
- onInput: a[1] ||= (e) => r("update", { height: Number(e.target.value) })
2625
- }, null, 40, bo)
2626
- ]));
2627
- }
2628
- }), So = { class: "tpl:mb-3.5" }, Co = { class: "tpl:flex tpl:items-center tpl:gap-3" }, wo = { class: "tpl:flex tpl:flex-1 tpl:items-center tpl:gap-1.5" }, To = { class: "tpl:text-xs tpl:text-[var(--tpl-text-muted)]" }, Eo = { class: "tpl:flex tpl:items-center tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)]" }, Do = ["disabled"], Oo = { class: "tpl:min-w-[20px] tpl:text-center tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text)]" }, ko = { class: "tpl:flex tpl:flex-1 tpl:items-center tpl:gap-1.5" }, Ao = { class: "tpl:text-xs tpl:text-[var(--tpl-text-muted)]" }, jo = { class: "tpl:flex tpl:items-center tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)]" }, Mo = ["disabled"], No = { class: "tpl:min-w-[20px] tpl:text-center tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text)]" }, Po = { class: "tpl:mb-3.5" }, Fo = { class: "tpl:mb-1.5 tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text-muted)]" }, Io = ["checked"], Lo = {
2629
- key: 0,
2630
- class: "tpl:mb-3.5"
2631
- }, Ro = { class: "tpl:mb-3.5" }, zo = { class: "tpl:mb-3.5" }, Bo = { class: "tpl:flex tpl:items-stretch" }, Vo = ["value"], Ho = { class: "tpl:mb-3.5" }, Uo = { class: "tpl:flex tpl:items-stretch" }, Wo = ["value"], Go = { class: "tpl:mb-3.5" }, Ko = ["value"], qo = { value: "" }, Jo = ["value"], Yo = { class: "tpl:mb-3.5" }, Xo = { class: "tpl:flex tpl:items-stretch" }, Zo = ["value"], Qo = { class: "tpl:mb-3.5" }, $o = { class: "tpl:mb-3.5" }, es = /* @__PURE__ */ m({
2632
- __name: "TableToolbar",
2633
- props: {
2634
- block: {},
2635
- fontFamilies: {}
2636
- },
2637
- emits: ["update"],
2638
- setup(t, { emit: n }) {
2639
- let r = t, i = n, { t: a } = H(), s = g(() => r.block.rows.length > 0 ? r.block.rows[0].cells.length : 0);
2640
- function c(e, t) {
2641
- i("update", { [e]: t });
2642
- }
2643
- function l() {
2644
- let e = r.block.rows.length > 0 ? r.block.rows[0].cells.length : 3, t = {
2645
- id: N(),
2646
- cells: Array.from({ length: e }, () => ({
2647
- id: N(),
2648
- content: ""
2649
- }))
2650
- };
2651
- i("update", { rows: [...r.block.rows, t] });
2652
- }
2653
- function u(e) {
2654
- i("update", { rows: r.block.rows.filter((t) => t.id !== e) });
2655
- }
2656
- function f() {
2657
- i("update", { rows: r.block.rows.map((e) => ({
2658
- ...e,
2659
- cells: [...e.cells, {
2660
- id: N(),
2661
- content: ""
2662
- }]
2663
- })) });
2664
- }
2665
- function m(e) {
2666
- i("update", { rows: r.block.rows.map((t) => ({
2667
- ...t,
2668
- cells: t.cells.filter((t, n) => n !== e)
2669
- })) });
2670
- }
2671
- return (n, r) => (e(), v(y, null, [
2672
- _("div", So, [_("label", { class: p(T(G)) }, D(T(a).table.dimensions), 3), _("div", Co, [_("div", wo, [_("span", To, D(T(a).table.rows), 1), _("div", Eo, [
2673
- _("button", {
2674
- 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",
2675
- disabled: t.block.rows.length <= 1,
2676
- onClick: r[0] ||= (e) => u(t.block.rows[t.block.rows.length - 1].id)
2677
- }, [k(T(Ke), {
2678
- size: 12,
2679
- "stroke-width": 2
2680
- })], 8, Do),
2681
- _("span", Oo, D(t.block.rows.length), 1),
2682
- _("button", {
2683
- 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)]",
2684
- onClick: l
2685
- }, [k(T(Z), {
2686
- size: 12,
2687
- "stroke-width": 2
2688
- })])
2689
- ])]), _("div", ko, [_("span", Ao, D(T(a).table.columns), 1), _("div", jo, [
2690
- _("button", {
2691
- 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",
2692
- disabled: s.value <= 1,
2693
- onClick: r[1] ||= (e) => m(s.value - 1)
2694
- }, [k(T(Ke), {
2695
- size: 12,
2696
- "stroke-width": 2
2697
- })], 8, Mo),
2698
- _("span", No, D(s.value), 1),
2699
- _("button", {
2700
- 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)]",
2701
- onClick: f
2702
- }, [k(T(Z), {
2703
- size: 12,
2704
- "stroke-width": 2
2705
- })])
2706
- ])])])]),
2707
- _("div", Po, [_("label", Fo, [_("input", {
2708
- type: "checkbox",
2709
- checked: t.block.hasHeaderRow,
2710
- class: "tpl:accent-[var(--tpl-primary)]",
2711
- onChange: r[2] ||= (e) => c("hasHeaderRow", e.target.checked)
2712
- }, null, 40, Io), d(" " + D(T(a).table.hasHeaderRow), 1)])]),
2713
- t.block.hasHeaderRow ? (e(), v("div", Lo, [_("label", { class: p(T(G)) }, D(T(a).table.headerBackgroundColor), 3), k(J, {
2714
- "model-value": t.block.headerBackgroundColor ?? "",
2715
- "seed-color": T(xt),
2716
- placeholder: T(a).table.noHeaderBg,
2717
- "onUpdate:modelValue": r[3] ||= (e) => c("headerBackgroundColor", e || null)
2718
- }, null, 8, [
2719
- "model-value",
2720
- "seed-color",
2721
- "placeholder"
2722
- ])])) : b("", !0),
2723
- _("div", Ro, [_("label", { class: p(T(G)) }, D(T(a).table.borderColor), 3), k(J, {
2724
- "model-value": t.block.borderColor,
2725
- "onUpdate:modelValue": r[4] ||= (e) => c("borderColor", e)
2726
- }, null, 8, ["model-value"])]),
2727
- _("div", zo, [_("label", { class: p(T(G)) }, D(T(a).table.borderWidth), 3), _("div", Bo, [_("input", {
2728
- type: "number",
2729
- class: p(T(q)),
2730
- value: t.block.borderWidth,
2731
- min: "0",
2732
- max: "10",
2733
- onInput: r[5] ||= (e) => c("borderWidth", Number(e.target.value))
2734
- }, null, 42, Vo), _("span", { class: p(T(K)) }, "px", 2)])]),
2735
- _("div", Ho, [_("label", { class: p(T(G)) }, D(T(a).table.cellPadding), 3), _("div", Uo, [_("input", {
2736
- type: "number",
2737
- class: p(T(q)),
2738
- value: t.block.cellPadding,
2739
- min: "0",
2740
- max: "30",
2741
- onInput: r[6] ||= (e) => c("cellPadding", Number(e.target.value))
2742
- }, null, 42, Wo), _("span", { class: p(T(K)) }, "px", 2)])]),
2743
- _("div", Go, [_("label", { class: p(T(G)) }, D(T(a).table.fontFamily), 3), _("select", {
2744
- class: p(T(W)),
2745
- value: t.block.fontFamily || "",
2746
- onChange: r[7] ||= (e) => c("fontFamily", e.target.value || void 0)
2747
- }, [_("option", qo, D(T(a).title.inheritFont), 1), (e(!0), v(y, null, o(t.fontFamilies, (t) => (e(), v("option", {
2748
- key: t.value,
2749
- value: t.value
2750
- }, D(t.label), 9, Jo))), 128))], 42, Ko)]),
2751
- _("div", Yo, [_("label", { class: p(T(G)) }, D(T(a).table.fontSize), 3), _("div", Xo, [_("input", {
2752
- type: "number",
2753
- class: p(T(q)),
2754
- value: t.block.fontSize,
2755
- min: "10",
2756
- max: "32",
2757
- onInput: r[8] ||= (e) => c("fontSize", Number(e.target.value))
2758
- }, null, 42, Zo), _("span", { class: p(T(K)) }, "px", 2)])]),
2759
- _("div", Qo, [_("label", { class: p(T(G)) }, D(T(a).table.color), 3), k(J, {
2760
- "model-value": t.block.color,
2761
- "onUpdate:modelValue": r[9] ||= (e) => c("color", e)
2762
- }, null, 8, ["model-value"])]),
2763
- _("div", $o, [_("label", { class: p(T(G)) }, D(T(a).table.textAlign), 3), k(X, {
2764
- options: [
2765
- {
2766
- value: "left",
2767
- label: T(a).title.alignLeft,
2768
- icon: T(et)
2769
- },
2770
- {
2771
- value: "center",
2772
- label: T(a).title.alignCenter,
2773
- icon: T($e)
2774
- },
2775
- {
2776
- value: "right",
2777
- label: T(a).title.alignRight,
2778
- icon: T(Qe)
2779
- }
2780
- ],
2781
- "model-value": t.block.textAlign,
2782
- "onUpdate:modelValue": r[10] ||= (e) => c("textAlign", e)
2783
- }, null, 8, ["options", "model-value"])])
2784
- ], 64));
2785
- }
2786
- }), ts = { class: "tpl:mb-3.5" }, ns = ["value"], rs = { value: 1 }, is = { value: 2 }, as = { value: 3 }, os = { value: 4 }, ss = { class: "tpl:mb-3.5" }, cs = ["value"], ls = { value: "" }, us = ["value"], ds = { class: "tpl:mb-3.5" }, fs = { class: "tpl:mb-3.5" }, ps = /* @__PURE__ */ m({
2787
- __name: "TitleToolbar",
2788
- props: {
2789
- block: {},
2790
- fontFamilies: {}
2791
- },
2792
- emits: ["update"],
2793
- setup(t, { emit: n }) {
2794
- let r = n, { t: i } = H();
2795
- function a(e, t) {
2796
- r("update", { [e]: t });
2797
- }
2798
- return (n, r) => (e(), v(y, null, [
2799
- _("div", ts, [_("label", { class: p(T(G)) }, D(T(i).title.level), 3), _("select", {
2800
- class: p(T(W)),
2801
- value: t.block.level,
2802
- onChange: r[0] ||= (e) => a("level", Number(e.target.value))
2803
- }, [
2804
- _("option", rs, D(T(i).title.heading1), 1),
2805
- _("option", is, D(T(i).title.heading2), 1),
2806
- _("option", as, D(T(i).title.heading3), 1),
2807
- _("option", os, D(T(i).title.heading4), 1)
2808
- ], 42, ns)]),
2809
- _("div", ss, [_("label", { class: p(T(G)) }, D(T(i).title.fontFamily), 3), _("select", {
2810
- class: p(T(W)),
2811
- value: t.block.fontFamily || "",
2812
- onChange: r[1] ||= (e) => a("fontFamily", e.target.value || void 0)
2813
- }, [_("option", ls, D(T(i).title.inheritFont), 1), (e(!0), v(y, null, o(t.fontFamilies, (t) => (e(), v("option", {
2814
- key: t.value,
2815
- value: t.value
2816
- }, D(t.label), 9, us))), 128))], 42, cs)]),
2817
- _("div", ds, [_("label", { class: p(T(G)) }, D(T(i).title.color), 3), k(J, {
2818
- "model-value": t.block.color,
2819
- "onUpdate:modelValue": r[2] ||= (e) => a("color", e)
2820
- }, null, 8, ["model-value"])]),
2821
- _("div", fs, [_("label", { class: p(T(G)) }, D(T(i).title.align), 3), k(X, {
2822
- options: [
2823
- {
2824
- value: "left",
2825
- label: T(i).title.alignLeft,
2826
- icon: T(et)
2827
- },
2828
- {
2829
- value: "center",
2830
- label: T(i).title.alignCenter,
2831
- icon: T($e)
2832
- },
2833
- {
2834
- value: "right",
2835
- label: T(i).title.alignRight,
2836
- icon: T(Qe)
2837
- }
2838
- ],
2839
- "model-value": t.block.textAlign,
2840
- "onUpdate:modelValue": r[3] ||= (e) => a("textAlign", e)
2841
- }, null, 8, ["options", "model-value"])])
2842
- ], 64));
2843
- }
2844
- }), ms = { class: "tpl:mb-3.5" }, hs = {
2845
- key: 0,
2846
- class: "tpl:mt-2 tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:text-[12px] tpl:text-[var(--tpl-text-muted)]"
2847
- }, gs = ["checked"], _s = {
2848
- key: 0,
2849
- class: "tpl:mb-3.5"
2850
- }, vs = { class: "tpl:font-normal tpl:text-[var(--tpl-text-dim)]" }, ys = [
2851
- "value",
2852
- "placeholder",
2853
- "title"
2854
- ], bs = { class: "tpl:mb-3.5" }, xs = { class: "tpl:font-normal tpl:text-[var(--tpl-text-dim)]" }, Ss = { class: "tpl:mb-3.5" }, Cs = { class: "tpl:mb-3.5" }, ws = ["value"], Ts = { value: "full" }, Es = { class: "tpl:mb-3.5" }, Ds = /* @__PURE__ */ m({
2855
- __name: "VideoToolbar",
2856
- props: { block: {} },
2857
- emits: ["update"],
2858
- setup(t, { emit: n }) {
2859
- let r = t, i = n, { t: a } = H(), o = A(Oe, null), s = A(je, L.liquid), c = mt(), l = g(() => !!o), f = g(() => I(r.block.url, s)), m = u(!1), { start: h } = Te(() => {
2860
- m.value = !1;
2861
- }, 1e3, { immediate: !1 });
2862
- function x(e, t) {
2863
- i("update", { [e]: t });
2864
- }
2865
- async function S() {
2866
- let e = await o?.({ accept: ["images"] });
2867
- c.alive && e && (x("thumbnailUrl", e.url), m.value = !0, h());
2868
- }
2869
- return (n, r) => (e(), v(y, null, [
2870
- _("div", ms, [
2871
- _("label", { class: p(T(G)) }, D(T(a).video.videoUrl), 3),
2872
- k(Q, {
2873
- "model-value": t.block.url,
2874
- type: "url",
2875
- placeholder: T(a).video.videoUrlPlaceholder,
2876
- "onUpdate:modelValue": r[0] ||= (e) => x("url", e)
2877
- }, null, 8, ["model-value", "placeholder"]),
2878
- t.block.url ? (e(), v("label", hs, [_("input", {
2879
- type: "checkbox",
2880
- class: "tpl:size-3.5 tpl:cursor-pointer tpl:accent-[var(--tpl-primary)]",
2881
- checked: t.block.openInNewTab ?? !1,
2882
- onChange: r[1] ||= (e) => x("openInNewTab", e.target.checked)
2883
- }, null, 40, gs), d(" " + D(T(a).video.openInNewTab), 1)])) : b("", !0)
2884
- ]),
2885
- f.value ? (e(), v("div", _s, [_("label", { class: p(T(G)) }, [d(D(T(a).video.placeholderUrl) + " ", 1), _("span", vs, D(T(a).video.optional), 1)], 2), _("input", {
2886
- type: "url",
2887
- class: p(T(W)),
2888
- value: t.block.placeholderUrl || "",
2889
- placeholder: T(a).video.placeholderUrlPlaceholder,
2890
- title: T(a).video.placeholderUrlTooltip,
2891
- onInput: r[2] ||= (e) => x("placeholderUrl", e.target.value)
2892
- }, null, 42, ys)])) : b("", !0),
2893
- _("div", bs, [
2894
- _("label", { class: p(T(G)) }, [d(D(T(a).video.customThumbnail) + " ", 1), _("span", xs, D(T(a).video.optional), 1)], 2),
2895
- k(Q, {
2896
- "model-value": t.block.thumbnailUrl,
2897
- type: "url",
2898
- placeholder: T(a).video.thumbnailPlaceholder,
2899
- pulse: m.value,
2900
- "onUpdate:modelValue": r[3] ||= (e) => x("thumbnailUrl", e)
2901
- }, null, 8, [
2902
- "model-value",
2903
- "placeholder",
2904
- "pulse"
2905
- ]),
2906
- l.value ? (e(), v("button", {
2907
- key: 0,
2908
- 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",
2909
- style: {
2910
- "border-color": "var(--tpl-border)",
2911
- color: "var(--tpl-primary)",
2912
- "background-color": "var(--tpl-bg)"
2913
- },
2914
- onClick: S
2915
- }, [k(T(B), {
2916
- size: 14,
2917
- "stroke-width": 1.5
2918
- }), d(" " + D(T(a).image.browseMedia), 1)])) : b("", !0)
2919
- ]),
2920
- _("div", Ss, [_("label", { class: p(T(G)) }, D(T(a).video.altText), 3), k(Q, {
2921
- "model-value": t.block.alt,
2922
- type: "text",
2923
- placeholder: T(a).video.altTextPlaceholder,
2924
- "onUpdate:modelValue": r[4] ||= (e) => x("alt", e)
2925
- }, null, 8, ["model-value", "placeholder"])]),
2926
- _("div", Cs, [_("label", { class: p(T(G)) }, D(T(a).video.width), 3), _("select", {
2927
- class: p(T(W)),
2928
- value: t.block.width,
2929
- onChange: r[5] ||= (e) => x("width", e.target.value === "full" ? "full" : Number(e.target.value))
2930
- }, [
2931
- _("option", Ts, D(T(a).video.fullWidth), 1),
2932
- r[7] ||= _("option", { value: "300" }, "300px", -1),
2933
- r[8] ||= _("option", { value: "400" }, "400px", -1),
2934
- r[9] ||= _("option", { value: "500" }, "500px", -1)
2935
- ], 42, ws)]),
2936
- _("div", Es, [_("label", { class: p(T(G)) }, D(T(a).title.align), 3), k(X, {
2937
- options: [
2938
- {
2939
- value: "left",
2940
- label: T(a).title.alignLeft
2941
- },
2942
- {
2943
- value: "center",
2944
- label: T(a).title.alignCenter
2945
- },
2946
- {
2947
- value: "right",
2948
- label: T(a).title.alignRight
2949
- }
2950
- ],
2951
- "model-value": t.block.align,
2952
- "onUpdate:modelValue": r[6] ||= (e) => x("align", e)
2953
- }, null, 8, ["options", "model-value"])])
2954
- ], 64));
2955
- }
2956
- }), Os = ["aria-label"], ks = { class: "tpl:flex tpl:items-center tpl:justify-between tpl:border-b tpl:border-[var(--tpl-border)] tpl:px-4 tpl:py-3.5" }, As = { class: "tpl:flex tpl:items-center tpl:gap-2 tpl:text-[var(--tpl-primary)]" }, js = { class: "tpl:m-0 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]" }, Ms = { class: "tpl:flex tpl:gap-1" }, Ns = ["title"], Ps = ["title"], Fs = { class: "tpl:flex-1 tpl:overflow-y-auto tpl:p-4" }, Is = /*#__PURE__*/ dt(/* @__PURE__ */ m({
2957
- __name: "Toolbar",
2958
- props: { block: {} },
2959
- emits: [
2960
- "update",
2961
- "delete",
2962
- "duplicate"
2963
- ],
2964
- setup(t, { emit: n }) {
2965
- let i = j(() => import("./CountdownToolbar-BeII06yJ.js")), a = t, o = n, { t: s } = H(), c = Ae(Ie, "Toolbar"), l = A(Pe, []), u = g(() => a.block.type), d = g(() => P(a.block)), f = g(() => {
2966
- if (d.value) return l.find((e) => e.type === a.block.customType);
2967
- }), p = g(() => d.value ? f.value?.name ?? a.block.customType : re(u.value, s)), m = c.fonts;
2968
- function h(e) {
2969
- o("update", e);
2970
- }
2971
- return (n, a) => (e(), v("aside", {
2972
- "aria-label": T(s).landmarks.blockToolbar,
2973
- class: "tpl:flex tpl:w-full tpl:flex-1 tpl:flex-col tpl:bg-[var(--tpl-bg-elevated)]"
2974
- }, [_("div", ks, [_("div", As, [T(Ye)[u.value] ? (e(), C(r(T(Ye)[u.value]), {
2975
- key: 0,
2976
- size: 16,
2977
- "stroke-width": 1.5
2978
- })) : d.value ? (e(), C(T(ae), {
2979
- key: 1,
2980
- size: 16,
2981
- "stroke-width": 1.5
2982
- })) : b("", !0), _("h3", js, D(p.value), 1)]), _("div", Ms, [_("button", {
2983
- 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)]",
2984
- title: T(s).toolbar.duplicate,
2985
- onClick: a[0] ||= (e) => o("duplicate")
2986
- }, [k(T(ie), {
2987
- size: 14,
2988
- "stroke-width": 2
2989
- })], 8, Ns), _("button", {
2990
- 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)]",
2991
- title: T(s).toolbar.delete,
2992
- onClick: a[1] ||= (e) => o("delete")
2993
- }, [k(T(ct), {
2994
- size: 14,
2995
- "stroke-width": 2
2996
- })], 8, Ps)])]), _("div", Fs, [d.value ? (e(), C(na, {
2997
- key: 0,
2998
- block: t.block,
2999
- onUpdateFieldValues: a[2] ||= (e) => o("update", { fieldValues: e }),
3000
- onUpdateDataSourceFetched: a[3] ||= (e) => o("update", { dataSourceFetched: e })
3001
- }, null, 8, ["block"])) : u.value === "section" ? (e(), C(Xa, {
3002
- key: 1,
3003
- block: t.block,
3004
- onUpdate: h
3005
- }, null, 8, ["block"])) : u.value === "title" ? (e(), C(ps, {
3006
- key: 2,
3007
- block: t.block,
3008
- "font-families": T(m),
3009
- onUpdate: h
3010
- }, null, 8, ["block", "font-families"])) : u.value === "paragraph" ? (e(), v(y, { key: 3 }, [], 64)) : u.value === "image" ? (e(), C(Ma, {
3011
- key: 4,
3012
- block: t.block,
3013
- onUpdate: h
3014
- }, null, 8, ["block"])) : u.value === "video" ? (e(), C(Ds, {
3015
- key: 5,
3016
- block: t.block,
3017
- onUpdate: h
3018
- }, null, 8, ["block"])) : u.value === "button" ? (e(), C(Dr, {
3019
- key: 6,
3020
- block: t.block,
3021
- "font-families": T(m),
3022
- onUpdate: h
3023
- }, null, 8, ["block", "font-families"])) : u.value === "divider" ? (e(), C(ca, {
3024
- key: 7,
3025
- block: t.block,
3026
- onUpdate: h
3027
- }, null, 8, ["block"])) : u.value === "social" ? (e(), C(go, {
3028
- key: 8,
3029
- block: t.block,
3030
- onUpdate: h
3031
- }, null, 8, ["block"])) : u.value === "menu" ? (e(), C(Wa, {
3032
- key: 9,
3033
- block: t.block,
3034
- "font-families": T(m),
3035
- onUpdate: h
3036
- }, null, 8, ["block", "font-families"])) : u.value === "table" ? (e(), C(es, {
3037
- key: 10,
3038
- block: t.block,
3039
- "font-families": T(m),
3040
- onUpdate: h
3041
- }, null, 8, ["block", "font-families"])) : u.value === "spacer" ? (e(), C(xo, {
3042
- key: 11,
3043
- block: t.block,
3044
- onUpdate: h
3045
- }, null, 8, ["block"])) : u.value === "html" ? (e(), C(fa, {
3046
- key: 12,
3047
- block: t.block,
3048
- onUpdate: h
3049
- }, null, 8, ["block"])) : u.value === "countdown" ? (e(), C(T(i), {
3050
- key: 13,
3051
- block: t.block,
3052
- "font-families": T(m),
3053
- onUpdate: h
3054
- }, null, 8, ["block", "font-families"])) : b("", !0), k(_i, {
3055
- block: t.block,
3056
- "is-first-section": u.value === "paragraph",
3057
- onUpdate: h
3058
- }, null, 8, ["block", "is-first-section"])])], 8, Os));
3059
- }
3060
- }), [["__scopeId", "data-v-2ac88283"]]), Ls = ["aria-label"], Rs = {
3061
- role: "tablist",
3062
- 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"
3063
- }, zs = [
3064
- "aria-selected",
3065
- "aria-label",
3066
- "title"
3067
- ], Bs = { key: 0 }, Vs = [
3068
- "aria-selected",
3069
- "aria-label",
3070
- "title"
3071
- ], Hs = { key: 0 }, Us = [
3072
- "aria-selected",
3073
- "aria-label",
3074
- "title"
3075
- ], Ws = { key: 0 }, Gs = {
3076
- key: 1,
3077
- class: "tpl:ml-1 tpl:rounded-full tpl:bg-[var(--tpl-bg-hover)] tpl:px-1.5 tpl:text-[10px]"
3078
- }, Ks = {
3079
- key: 0,
3080
- id: "tpl-tabpanel-content",
3081
- role: "tabpanel",
3082
- "aria-labelledby": "tpl-tab-content",
3083
- class: "tpl:flex tpl:flex-1 tpl:flex-col tpl:overflow-y-auto"
3084
- }, qs = {
3085
- key: 1,
3086
- 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)]"
3087
- }, Js = { class: "tpl:mb-4 tpl:text-[var(--tpl-text-dim)]" }, Ys = { class: "tpl:m-0 tpl:mb-2 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]" }, Xs = { class: "tpl:m-0 tpl:text-sm tpl:leading-normal" }, Zs = {
3088
- key: 1,
3089
- id: "tpl-tabpanel-settings",
3090
- role: "tabpanel",
3091
- "aria-labelledby": "tpl-tab-settings",
3092
- class: "tpl:flex tpl:flex-1 tpl:flex-col tpl:overflow-y-auto"
3093
- }, Qs = {
3094
- key: 2,
3095
- id: "tpl-tabpanel-issues",
3096
- role: "tabpanel",
3097
- "aria-labelledby": "tpl-tab-issues",
3098
- class: "tpl:flex tpl:flex-1 tpl:flex-col tpl:overflow-y-auto"
3099
- }, $s = /* @__PURE__ */ m({
3100
- __name: "RightSidebar",
3101
- props: {
3102
- selectedBlock: {},
3103
- settings: {},
3104
- shiftedLeft: { type: Boolean }
3105
- },
3106
- emits: [
3107
- "update-block",
3108
- "delete-block",
3109
- "duplicate-block",
3110
- "update-settings"
3111
- ],
3112
- setup(t, { emit: n }) {
3113
- let r = j(() => import("./IssuesPanel-I0z6k6-H.js")), i = t, o = n, { t: s } = H(), c = u("content"), l = A(Le, null), d = g(() => l !== null), f = g(() => l?.issues.value.length ?? 0);
3114
- function m(e) {
3115
- return c.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)]";
3116
- }
3117
- function h(e) {
3118
- return c.value === e ? {
3119
- backgroundColor: "var(--tpl-bg)",
3120
- boxShadow: "var(--tpl-shadow-md)"
3121
- } : { backgroundColor: "transparent" };
3122
- }
3123
- return a(() => i.selectedBlock, (e) => {
3124
- e && (c.value = "content");
3125
- }), (n, i) => (e(), v("aside", {
3126
- "aria-label": T(s).landmarks.rightSidebar,
3127
- class: p(["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)]", t.shiftedLeft ? "tpl:right-[360px]" : "tpl:right-0"])
3128
- }, [
3129
- _("div", Rs, [
3130
- _("button", {
3131
- id: "tpl-tab-content",
3132
- role: "tab",
3133
- "aria-selected": c.value === "content",
3134
- "aria-controls": "tpl-tabpanel-content",
3135
- "aria-label": T(s).sidebar.content,
3136
- title: T(s).sidebar.content,
3137
- class: p(["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)]", m("content")]),
3138
- style: S(h("content")),
3139
- onClick: i[0] ||= (e) => c.value = "content"
3140
- }, [k(T(Nt), {
3141
- size: 14,
3142
- "stroke-width": 2
3143
- }), c.value === "content" ? (e(), v("span", Bs, D(T(s).sidebar.content), 1)) : b("", !0)], 14, zs),
3144
- _("button", {
3145
- id: "tpl-tab-settings",
3146
- role: "tab",
3147
- "aria-selected": c.value === "settings",
3148
- "aria-controls": "tpl-tabpanel-settings",
3149
- "aria-label": T(s).sidebar.settings,
3150
- title: T(s).sidebar.settings,
3151
- class: p(["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)]", m("settings")]),
3152
- style: S(h("settings")),
3153
- onClick: i[1] ||= (e) => c.value = "settings"
3154
- }, [k(T(Ft), {
3155
- size: 14,
3156
- "stroke-width": 1.5
3157
- }), c.value === "settings" ? (e(), v("span", Hs, D(T(s).sidebar.settings), 1)) : b("", !0)], 14, Vs),
3158
- d.value ? (e(), v("button", {
3159
- key: 0,
3160
- id: "tpl-tab-issues",
3161
- role: "tab",
3162
- "aria-selected": c.value === "issues",
3163
- "aria-controls": "tpl-tabpanel-issues",
3164
- "aria-label": T(s).issues.panelTabLabel,
3165
- title: T(s).issues.panelTabLabel,
3166
- class: p(["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)]", m("issues")]),
3167
- style: S(h("issues")),
3168
- onClick: i[2] ||= (e) => c.value = "issues"
3169
- }, [
3170
- k(T(ot), {
3171
- size: 14,
3172
- "stroke-width": 1.5
3173
- }),
3174
- c.value === "issues" ? (e(), v("span", Ws, D(T(s).issues.panelTabLabel), 1)) : b("", !0),
3175
- f.value > 0 ? (e(), v("span", Gs, D(f.value), 1)) : b("", !0)
3176
- ], 14, Us)) : b("", !0)
3177
- ]),
3178
- c.value === "content" ? (e(), v("div", Ks, [t.selectedBlock ? (e(), C(Is, {
3179
- key: 0,
3180
- block: t.selectedBlock,
3181
- onUpdate: i[3] ||= (e) => o("update-block", e),
3182
- onDelete: i[4] ||= (e) => o("delete-block"),
3183
- onDuplicate: i[5] ||= (e) => o("duplicate-block")
3184
- }, null, 8, ["block"])) : (e(), v("div", qs, [
3185
- _("div", Js, [k(T(kt), {
3186
- size: 40,
3187
- "stroke-width": 1.5
3188
- })]),
3189
- _("h3", Ys, D(T(s).sidebar.noSelection), 1),
3190
- _("p", Xs, D(T(s).sidebar.noSelectionHint), 1)
3191
- ]))])) : b("", !0),
3192
- c.value === "settings" ? (e(), v("div", Zs, [k(Zn, {
3193
- settings: t.settings,
3194
- onUpdate: i[6] ||= (e) => o("update-settings", e)
3195
- }, null, 8, ["settings"])])) : b("", !0),
3196
- c.value === "issues" && d.value ? (e(), v("div", Qs, [k(T(r))])) : b("", !0)
3197
- ], 10, Ls));
3198
- }
3199
- }), ec = {
3200
- 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)]",
3201
- style: { "z-index": "10001" },
3202
- role: "status",
3203
- "data-testid": "small-screen-notice"
3204
- }, tc = { class: "tpl:text-[var(--tpl-text-dim)]" }, nc = { class: "tpl:m-0 tpl:text-base tpl:font-semibold tpl:text-[var(--tpl-text)]" }, rc = { class: "tpl:m-0 tpl:max-w-sm tpl:text-sm tpl:leading-normal" }, ic = /* @__PURE__ */ m({
3205
- __name: "SmallScreenNotice",
3206
- setup(t) {
3207
- let { t: n } = H();
3208
- return (t, r) => (e(), v("div", ec, [
3209
- _("div", tc, [k(T(jt), {
3210
- size: 48,
3211
- "stroke-width": 1.5
3212
- })]),
3213
- _("h2", nc, D(T(n).smallScreen.title), 1),
3214
- _("p", rc, D(T(n).smallScreen.message), 1)
3215
- ]));
3216
- }
3217
- }), ac = ["aria-label"], oc = [
3218
- "aria-checked",
3219
- "aria-label",
3220
- "title",
3221
- "onClick"
3222
- ], sc = /* @__PURE__ */ m({
3223
- __name: "ViewportToggle",
3224
- props: { viewport: {} },
3225
- emits: ["change"],
3226
- setup(t, { emit: n }) {
3227
- let r = t, i = n, { t: a } = H(), s = g(() => [{
3228
- value: "desktop",
3229
- label: a.viewport.desktop
3230
- }, {
3231
- value: "mobile",
3232
- label: a.viewport.mobile
3233
- }]), c = g(() => `translateX(${s.value.findIndex((e) => e.value === r.viewport) * 100}%)`);
3234
- return (n, r) => (e(), v("div", {
3235
- role: "radiogroup",
3236
- "aria-label": T(a).viewport.label,
3237
- class: "tpl:relative tpl:grid tpl:rounded-[var(--tpl-radius-sm)] tpl:p-1",
3238
- style: S({
3239
- gridTemplateColumns: `repeat(${s.value.length}, 1fr)`,
3240
- backgroundColor: "var(--tpl-bg-hover)"
3241
- })
3242
- }, [_("div", {
3243
- class: "tpl:absolute tpl:inset-y-1 tpl:rounded-[var(--tpl-radius-sm)]",
3244
- style: S({
3245
- left: "4px",
3246
- width: `calc((100% - 8px) / ${s.value.length})`,
3247
- transform: c.value,
3248
- backgroundColor: "var(--tpl-bg)",
3249
- boxShadow: "var(--tpl-shadow)",
3250
- transition: "transform 120ms cubic-bezier(0.16, 1, 0.3, 1)"
3251
- })
3252
- }, null, 4), (e(!0), v(y, null, o(s.value, (n) => (e(), v("button", {
3253
- key: n.value,
3254
- role: "radio",
3255
- "aria-checked": t.viewport === n.value,
3256
- "aria-label": n.label,
3257
- class: "tpl:relative tpl:z-10 tpl:flex tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded-md tpl:border-none tpl:bg-transparent tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium",
3258
- style: S({
3259
- color: t.viewport === n.value ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
3260
- transition: "color 120ms cubic-bezier(0.16, 1, 0.3, 1)"
3261
- }),
3262
- title: n.label,
3263
- onClick: (e) => i("change", n.value)
3264
- }, [n.value === "desktop" ? (e(), C(T(jt), {
3265
- key: 0,
3266
- size: 18,
3267
- "stroke-width": 1.5
3268
- })) : (e(), C(T(It), {
3269
- key: 1,
3270
- size: 18,
3271
- "stroke-width": 1.5
3272
- })), _("span", null, D(n.label), 1)], 12, oc))), 128))], 12, ac));
3273
- }
3274
- }), cc = [
3275
- "aria-label",
3276
- "title",
3277
- "aria-pressed"
3278
- ], lc = /*#__PURE__*/ dt(/* @__PURE__ */ m({
3279
- __name: "PreviewToggle",
3280
- props: { previewMode: { type: Boolean } },
3281
- emits: ["change"],
3282
- setup(t, { emit: n }) {
3283
- let r = n, { t: i } = H();
3284
- return (n, a) => (e(), v("button", {
3285
- 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",
3286
- style: S({
3287
- color: t.previewMode ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
3288
- backgroundColor: t.previewMode ? "var(--tpl-primary-light)" : "transparent"
3289
- }),
3290
- "aria-label": t.previewMode ? T(i).previewMode.disable : T(i).previewMode.enable,
3291
- title: t.previewMode ? T(i).previewMode.disable : T(i).previewMode.enable,
3292
- "aria-pressed": t.previewMode,
3293
- onClick: a[0] ||= (e) => r("change", !t.previewMode)
3294
- }, [k(O, {
3295
- "enter-active-class": "tpl-icon-enter-active",
3296
- "leave-active-class": "tpl-icon-leave-active",
3297
- "enter-from-class": "tpl-icon-enter-from",
3298
- "leave-to-class": "tpl-icon-leave-to",
3299
- mode: "out-in"
3300
- }, {
3301
- default: M(() => [t.previewMode ? (e(), C(T(nt), {
3302
- key: "eye",
3303
- size: 18,
3304
- "stroke-width": 1.5
3305
- })) : (e(), C(T(me), {
3306
- key: "eye-off",
3307
- size: 18,
3308
- "stroke-width": 1.5
3309
- }))]),
3310
- _: 1
3311
- })], 12, cc));
3312
- }
3313
- }), [["__scopeId", "data-v-af87d02a"]]), uc = [
3314
- "aria-label",
3315
- "title",
3316
- "aria-pressed"
3317
- ], dc = /*#__PURE__*/ dt(/* @__PURE__ */ m({
3318
- __name: "DarkModeToggle",
3319
- props: { darkMode: { type: Boolean } },
3320
- emits: ["change"],
3321
- setup(t, { emit: n }) {
3322
- let r = n, { t: i } = H();
3323
- return (n, a) => (e(), v("button", {
3324
- 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",
3325
- style: S({
3326
- color: t.darkMode ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
3327
- backgroundColor: t.darkMode ? "var(--tpl-primary-light)" : "transparent"
3328
- }),
3329
- "aria-label": t.darkMode ? T(i).darkMode.disable : T(i).darkMode.enable,
3330
- title: t.darkMode ? T(i).darkMode.disable : T(i).darkMode.enable,
3331
- "aria-pressed": t.darkMode,
3332
- onClick: a[0] ||= (e) => r("change", !t.darkMode)
3333
- }, [k(O, {
3334
- "enter-active-class": "tpl-icon-enter-active",
3335
- "leave-active-class": "tpl-icon-leave-active",
3336
- "enter-from-class": "tpl-icon-enter-from",
3337
- "leave-to-class": "tpl-icon-leave-to",
3338
- mode: "out-in"
3339
- }, {
3340
- default: M(() => [t.darkMode ? (e(), C(T(Mt), {
3341
- key: "moon",
3342
- size: 18,
3343
- "stroke-width": 1.5
3344
- })) : (e(), C(T(Rt), {
3345
- key: "sun",
3346
- size: 18,
3347
- "stroke-width": 1.5
3348
- }))]),
3349
- _: 1
3350
- })], 12, uc));
3351
- }
3352
- }), [["__scopeId", "data-v-f8694f76"]]), fc = {
3353
- class: "tpl:pointer-events-auto tpl:flex tpl:items-center tpl:gap-1.5 tpl:rounded-tl-lg tpl:p-1",
3354
- style: {
3355
- "background-color": "color-mix(\n in srgb,\n var(--tpl-canvas-bg) 85%,\n transparent\n )",
3356
- "backdrop-filter": "blur(8px)",
3357
- "-webkit-backdrop-filter": "blur(8px)"
3358
- }
3359
- }, pc = {
3360
- href: "https://github.com/templatical/sdk",
3361
- target: "_blank",
3362
- rel: "noopener noreferrer",
3363
- class: "tpl:transition-colors tpl:duration-150 hover:tpl:opacity-80 tpl:text-[var(--tpl-text-dim)]",
3364
- style: { "text-decoration": "none" }
3365
- }, mc = /* @__PURE__ */ m({
3366
- __name: "EditorFooter",
3367
- props: { positionClass: {} },
3368
- setup(t) {
3369
- let { t: n } = H();
3370
- return (r, i) => (e(), v("footer", { class: p(["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)]", t.positionClass]) }, [_("div", fc, [
3371
- _("span", null, D(T(n).footer.poweredBy), 1),
3372
- i[0] ||= _("a", {
3373
- href: "https://templatical.com",
3374
- target: "_blank",
3375
- rel: "noopener noreferrer",
3376
- 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)]",
3377
- style: { "text-decoration": "none" }
3378
- }, [_("img", {
3379
- width: "14",
3380
- height: "14",
3381
- src: "https://templatical.com/logo.svg",
3382
- alt: ""
3383
- }), d(" Templatical ")], -1),
3384
- i[1] ||= _("span", { class: "tpl:text-[var(--tpl-border)]" }, "·", -1),
3385
- _("a", pc, D(T(n).footer.openSource), 1)
3386
- ])], 2));
3387
- }
3388
- }), hc = ["aria-labelledby", "data-tpl-theme"], gc = { 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" }, _c = ["id"], vc = ["aria-label"], yc = { class: "tpl:relative tpl:border-b tpl:border-[var(--tpl-border)] tpl:px-3 tpl:py-2.5" }, bc = [
3389
- "id",
3390
- "placeholder",
3391
- "aria-label",
3392
- "aria-activedescendant"
3393
- ], xc = {
3394
- key: 0,
3395
- 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",
3396
- "data-testid": "merge-tag-picker-group-pills"
3397
- }, Sc = ["data-group-name", "onClick"], Cc = ["aria-label"], wc = {
3398
- key: 0,
3399
- class: "tpl:px-3 tpl:py-6 tpl:text-center tpl:text-xs tpl:text-[var(--tpl-text-dim)]",
3400
- "data-testid": "merge-tag-picker-empty"
3401
- }, Tc = {
3402
- key: 1,
3403
- class: "tpl:px-3 tpl:py-6 tpl:text-center tpl:text-xs tpl:text-[var(--tpl-text-dim)]",
3404
- "data-testid": "merge-tag-picker-empty"
3405
- }, Ec = [
3406
- "aria-expanded",
3407
- "data-group-name",
3408
- "data-group-collapsed",
3409
- "onClick"
3410
- ], Dc = { class: "tpl:ml-1 tpl:font-normal" }, Oc = [
3411
- "id",
3412
- "aria-selected",
3413
- "data-selected",
3414
- "data-merge-tag-index",
3415
- "data-merge-tag-value",
3416
- "title",
3417
- "onMousemove",
3418
- "onClick"
3419
- ], kc = { class: "tpl:text-sm tpl:font-medium" }, Ac = { class: "tpl:line-clamp-2 tpl:font-mono tpl:text-xs tpl:text-ellipsis tpl:break-all tpl:text-[var(--tpl-text-dim)]" }, jc = {
3420
- key: 0,
3421
- class: "tpl:line-clamp-2 tpl:text-xs tpl:text-ellipsis tpl:text-[var(--tpl-text-dim)]"
3422
- }, Mc = "tpl-merge-tag-picker-list", Nc = /* @__PURE__ */ m({
3423
- __name: "MergeTagPickerModal",
3424
- setup(r) {
3425
- let i = Ae(We, "MergeTagPickerModal"), { t: s, format: c } = H(), l = A(De, null), d = A(ke, null), m = u(""), x = Ee(m, 200), w = u(null), O = g(() => x.value.trim().length > 0), j = u(0), N = g(() => i.tags.value.some((e) => !!e.group)), P = u(/* @__PURE__ */ new Set());
3426
- function F(e) {
3427
- return P.value.has(e);
3428
- }
3429
- function I(e) {
3430
- let t = new Set(P.value);
3431
- t.has(e) ? t.delete(e) : t.add(e), P.value = t, j.value = 0;
3432
- }
3433
- let L = g(() => {
3434
- let e = x.value.trim().toLowerCase();
3435
- return e ? i.tags.value.filter((t) => [
3436
- t.label,
3437
- t.value,
3438
- t.description ?? ""
3439
- ].join(" ").toLowerCase().includes(e)) : i.tags.value;
3440
- }), R = g(() => {
3441
- if (!N.value) return [];
3442
- let e = s.mergeTag.picker.otherGroup, t = /* @__PURE__ */ new Set(), n = [];
3443
- for (let r of i.tags.value) {
3444
- let i = r.group ?? e;
3445
- t.has(i) || (t.add(i), n.push(i));
3446
- }
3447
- return n;
3448
- }), ee = g(() => {
3449
- let e = L.value;
3450
- if (!N.value || O.value) return e.map((e, t) => ({
3451
- kind: "tag",
3452
- tag: e,
3453
- index: t
3454
- }));
3455
- let t = s.mergeTag.picker.otherGroup, n = /* @__PURE__ */ new Map(), r = [];
3456
- for (let i of e) {
3457
- let e = i.group ?? t;
3458
- n.has(e) || (n.set(e, []), r.push(e)), n.get(e).push(i);
3459
- }
3460
- let i = [], a = 0;
3461
- for (let e of r) {
3462
- let t = n.get(e);
3463
- if (i.push({
3464
- kind: "header",
3465
- group: e,
3466
- count: t.length
3467
- }), !P.value.has(e)) for (let e of t) i.push({
3468
- kind: "tag",
3469
- tag: e,
3470
- index: a
3471
- }), a++;
3472
- }
3473
- return i;
3474
- }), z = g(() => ee.value.flatMap((e) => e.kind === "tag" ? [e.tag] : []));
3475
- a(() => i.isOpen.value, (e) => {
3476
- e && (m.value = "", j.value = 0, P.value = /* @__PURE__ */ new Set(), n(() => {
3477
- w.value?.focus();
3478
- }));
3479
- }), a(z, (e) => {
3480
- j.value >= e.length && (j.value = Math.max(0, e.length - 1));
3481
- });
3482
- function B(e) {
3483
- i.resolve(e);
3484
- }
3485
- function te() {
3486
- i.resolve(null);
3487
- }
3488
- function ne(e) {
3489
- if (z.value.length === 0) return;
3490
- let t = j.value + e;
3491
- j.value = Math.max(0, Math.min(z.value.length - 1, t)), ae();
3492
- }
3493
- let re = u(null), V = u({});
3494
- function ie(e, t) {
3495
- V.value[e] = t ?? null;
3496
- }
3497
- function ae() {
3498
- n(() => {
3499
- let e = re.value;
3500
- e && e.querySelector(`[data-merge-tag-index="${j.value}"]`)?.scrollIntoView({ block: "nearest" });
3501
- });
3502
- }
3503
- function oe(e) {
3504
- if (P.value.has(e)) {
3505
- let t = new Set(P.value);
3506
- t.delete(e), P.value = t;
3507
- }
3508
- n(() => {
3509
- let t = re.value;
3510
- if (!t) return;
3511
- let n = 0, r = !1;
3512
- for (let i of Array.from(t.children)) {
3513
- if (i.dataset.testid === "merge-tag-picker-group-header" && i.dataset.groupName === e) {
3514
- r = !0;
3515
- break;
3516
- }
3517
- n += i.offsetHeight;
3518
- }
3519
- r && t.scrollTo({
3520
- top: n,
3521
- behavior: "smooth"
3522
- });
3523
- });
3524
- }
3525
- function se(e) {
3526
- if (e.key === "ArrowDown") e.preventDefault(), ne(1);
3527
- else if (e.key === "ArrowUp") e.preventDefault(), ne(-1);
3528
- else if (e.key === "Enter") {
3529
- e.preventDefault();
3530
- let t = z.value[j.value];
3531
- t && B(t);
3532
- }
3533
- }
3534
- function ce() {
3535
- if (z.value.length !== 0) return `${Mc}-opt-${j.value}`;
3536
- }
3537
- function le(e) {
3538
- return `${Mc}-opt-${e}`;
3539
- }
3540
- let ue = g(() => i.tags.value.length === 0), de = g(() => !ue.value && L.value.length === 0), fe = g(() => N.value && R.value.length > 1 && !O.value);
3541
- return (n, r) => (e(), C(wt, {
3542
- visible: T(i).isOpen.value,
3543
- onClose: te,
3544
- onKeydown: se
3545
- }, {
3546
- default: M(() => [_("div", {
3547
- role: "dialog",
3548
- "aria-modal": "true",
3549
- "aria-labelledby": `${Mc}-title`,
3550
- "data-tpl-theme": T(d),
3551
- "data-testid": "merge-tag-picker-modal",
3552
- 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)]",
3553
- style: S(T(l))
3554
- }, [
3555
- _("header", gc, [_("h2", {
3556
- id: `${Mc}-title`,
3557
- class: "tpl:m-0 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]"
3558
- }, D(T(s).mergeTag.picker.title), 9, _c), _("button", {
3559
- type: "button",
3560
- 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)]",
3561
- "aria-label": T(s).mergeTag.picker.close,
3562
- "data-testid": "merge-tag-picker-close",
3563
- onClick: te
3564
- }, [k(T(ut), {
3565
- size: 16,
3566
- "stroke-width": 2
3567
- })], 8, vc)]),
3568
- _("div", yc, [k(T(qe), {
3569
- 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)]",
3570
- size: 14,
3571
- "stroke-width": 2
3572
- }), t(_("input", {
3573
- id: `${Mc}-search`,
3574
- ref_key: "searchInputRef",
3575
- ref: w,
3576
- "onUpdate:modelValue": r[0] ||= (e) => m.value = e,
3577
- type: "text",
3578
- 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)]",
3579
- placeholder: T(s).mergeTag.picker.searchPlaceholder,
3580
- "aria-label": T(s).mergeTag.picker.searchAriaLabel,
3581
- "aria-controls": Mc,
3582
- "aria-activedescendant": ce(),
3583
- "data-testid": "merge-tag-picker-search",
3584
- onKeydown: r[1] ||= E(h(() => {}, ["prevent"]), ["enter"])
3585
- }, null, 40, bc), [[f, m.value]])]),
3586
- fe.value ? (e(), v("div", xc, [(e(!0), v(y, null, o(R.value, (t) => (e(), v("button", {
3587
- key: t,
3588
- type: "button",
3589
- 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)]",
3590
- "data-testid": "merge-tag-picker-group-pill",
3591
- "data-group-name": t,
3592
- onClick: (e) => oe(t)
3593
- }, D(t), 9, Sc))), 128))])) : b("", !0),
3594
- _("div", {
3595
- id: Mc,
3596
- ref_key: "listRef",
3597
- ref: re,
3598
- class: "tpl:relative tpl:max-h-[60vh] tpl:flex-1 tpl:overflow-y-auto",
3599
- role: "listbox",
3600
- "aria-label": T(s).mergeTag.picker.title,
3601
- "data-testid": "merge-tag-picker-list"
3602
- }, [ue.value ? (e(), v("div", wc, D(T(s).mergeTag.picker.empty), 1)) : de.value ? (e(), v("div", Tc, D(T(s).mergeTag.picker.noResults), 1)) : (e(!0), v(y, { key: 2 }, o(ee.value, (t, n) => (e(), v(y, { key: n }, [t.kind === "header" ? (e(), v("button", {
3603
- key: 0,
3604
- ref_for: !0,
3605
- ref: (e) => ie(t.group, e),
3606
- type: "button",
3607
- "aria-expanded": !F(t.group),
3608
- "aria-controls": Mc,
3609
- 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)]",
3610
- "data-testid": "merge-tag-picker-group-header",
3611
- "data-group-name": t.group,
3612
- "data-group-collapsed": F(t.group) ? "true" : "false",
3613
- onClick: (e) => I(t.group)
3614
- }, [
3615
- k(T(tt), {
3616
- size: 12,
3617
- "stroke-width": 2,
3618
- class: p(["tpl:transition-transform", F(t.group) ? "tpl:-rotate-90" : ""])
3619
- }, null, 8, ["class"]),
3620
- _("span", null, D(t.group), 1),
3621
- _("span", Dc, " (" + D(T(c)(T(s).mergeTag.picker.groupCount, { count: t.count })) + ") ", 1)
3622
- ], 8, Ec)) : (e(), v("button", {
3623
- key: 1,
3624
- id: le(t.index),
3625
- type: "button",
3626
- role: "option",
3627
- "aria-selected": t.index === j.value,
3628
- "data-selected": t.index === j.value ? "true" : "false",
3629
- "data-merge-tag-index": t.index,
3630
- "data-merge-tag-value": t.tag.value,
3631
- title: t.tag.description ? `${t.tag.value} — ${t.tag.description}` : t.tag.value,
3632
- class: p(["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", t.index === j.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)]"]),
3633
- "data-testid": "merge-tag-picker-item",
3634
- onMousemove: (e) => j.value = t.index,
3635
- onClick: (e) => B(t.tag)
3636
- }, [
3637
- _("span", kc, D(t.tag.label), 1),
3638
- _("span", Ac, D(t.tag.value), 1),
3639
- t.tag.description ? (e(), v("span", jc, D(t.tag.description), 1)) : b("", !0)
3640
- ], 42, Oc))], 64))), 128))], 8, Cc)
3641
- ], 12, hc)]),
3642
- _: 1
3643
- }, 8, ["visible"]));
3644
- }
3645
- });
3646
- //#endregion
3647
- export { sc as a, cn as c, zt as d, Pt as f, lc as i, Zt as l, mc as n, ic as o, dc as r, $s as s, Nc as t, Xt as u };