@templatical/editor 0.11.0 → 0.11.1
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.
- package/dist/{AiFeatureMenu-D4D2Sqfk.js → AiFeatureMenu-DBWcfcWl.js} +1 -1
- package/dist/{CloudEditor-CLwyq3kf.js → CloudEditor-C6cSXtcP.js} +155 -154
- package/dist/{CollaboratorBar-DjX-o5Pi.js → CollaboratorBar-B8-AQfG2.js} +1 -1
- package/dist/{ModuleBrowserModal-CVS4Sf7H.js → ModuleBrowserModal-B_tLzFAk.js} +4 -4
- package/dist/{ModulePreviewCanvas-C10YXsL_.js → ModulePreviewCanvas-B7pNpAHM.js} +1 -1
- package/dist/{ParagraphEditor-BKoqcKIt.js → ParagraphEditor-DmA9K7dx.js} +6 -6
- package/dist/{SaveModuleDialog-BMuIjxVn.js → SaveModuleDialog-B8ypoxdj.js} +2 -2
- package/dist/{SnapshotHistory-DZ5_W7e4.js → SnapshotHistory-BTHd7CVP.js} +1 -1
- package/dist/{TestEmailModal-EjpH-F-W.js → TestEmailModal-CBIFMzK6.js} +2 -2
- package/dist/{TitleEditor-Rv1deuV7.js → TitleEditor-C9jDA5lI.js} +1 -1
- package/dist/{TplModal-DSmCQIm4.js → TplModal-ND4fiqOS.js} +1 -1
- package/dist/{blockTypeIcons-OhEkQhYj.js → blockTypeIcons-Bn-_Smlm.js} +4 -4
- package/dist/bundle-stats.json +6 -6
- package/dist/cdn/chunks/{AiFeatureMenu-Dm9CL3u0.js → AiFeatureMenu-BuSO0dXP.js} +8 -8
- package/dist/cdn/chunks/{AiFeatureMenu-Dm9CL3u0.js.map → AiFeatureMenu-BuSO0dXP.js.map} +1 -1
- package/dist/cdn/chunks/{BlockIssueBadge-DjnFAeWq.js → BlockIssueBadge-sv3IZ1Pb.js} +5 -5
- package/dist/cdn/chunks/{BlockIssueBadge-DjnFAeWq.js.map → BlockIssueBadge-sv3IZ1Pb.js.map} +1 -1
- package/dist/cdn/chunks/{CloudEditor-XSmLmdgp.js → CloudEditor-hxoqsTsq.js} +236 -235
- package/dist/cdn/chunks/{CloudEditor-XSmLmdgp.js.map → CloudEditor-hxoqsTsq.js.map} +1 -1
- package/dist/cdn/chunks/{CollaboratorBar-BfoGJhns.js → CollaboratorBar-DFqsaNX0.js} +3 -3
- package/dist/cdn/chunks/{CollaboratorBar-BfoGJhns.js.map → CollaboratorBar-DFqsaNX0.js.map} +1 -1
- package/dist/cdn/chunks/{CountdownBlock-GRio55a1.js → CountdownBlock-PpH3fxAX.js} +2 -2
- package/dist/cdn/chunks/{CountdownBlock-GRio55a1.js.map → CountdownBlock-PpH3fxAX.js.map} +1 -1
- package/dist/cdn/chunks/{CountdownToolbar-Cd1oEopw.js → CountdownToolbar-CZN92Bhz.js} +3 -3
- package/dist/cdn/chunks/{CountdownToolbar-Cd1oEopw.js.map → CountdownToolbar-CZN92Bhz.js.map} +1 -1
- package/dist/cdn/chunks/{IssuesPanel-C-BiFQDQ.js → IssuesPanel-wQjrnuyc.js} +6 -6
- package/dist/cdn/chunks/{IssuesPanel-C-BiFQDQ.js.map → IssuesPanel-wQjrnuyc.js.map} +1 -1
- package/dist/cdn/chunks/{ModuleBrowserModal-Dj7gRT4Q.js → ModuleBrowserModal-348wCgft.js} +8 -8
- package/dist/cdn/chunks/{ModuleBrowserModal-Dj7gRT4Q.js.map → ModuleBrowserModal-348wCgft.js.map} +1 -1
- package/dist/cdn/chunks/{ModulePreviewCanvas-hwdveKb0.js → ModulePreviewCanvas-Cf6DUHml.js} +22 -22
- package/dist/cdn/chunks/{ModulePreviewCanvas-hwdveKb0.js.map → ModulePreviewCanvas-Cf6DUHml.js.map} +1 -1
- package/dist/cdn/chunks/{NumberWithSuffix-bE_6cfiA.js → NumberWithSuffix-Deo8EOSz.js} +2 -2
- package/dist/cdn/chunks/{NumberWithSuffix-bE_6cfiA.js.map → NumberWithSuffix-Deo8EOSz.js.map} +1 -1
- package/dist/cdn/chunks/{ParagraphEditor-y1kGJRBX.js → ParagraphEditor-Cbl_gBYM.js} +40 -40
- package/dist/cdn/chunks/{ParagraphEditor-y1kGJRBX.js.map → ParagraphEditor-Cbl_gBYM.js.map} +1 -1
- package/dist/cdn/chunks/{RichTextEditorContent-DPy9D4hc.js → RichTextEditorContent-TBPzn3RC.js} +4 -4
- package/dist/cdn/chunks/{RichTextEditorContent-DPy9D4hc.js.map → RichTextEditorContent-TBPzn3RC.js.map} +1 -1
- package/dist/cdn/chunks/{SaveModuleDialog-CPu5e2VG.js → SaveModuleDialog-CxdYMutK.js} +4 -4
- package/dist/cdn/chunks/{SaveModuleDialog-CPu5e2VG.js.map → SaveModuleDialog-CxdYMutK.js.map} +1 -1
- package/dist/cdn/chunks/{TitleEditor-CMzzOPye.js → TitleEditor--XulEf7R.js} +6 -6
- package/dist/cdn/chunks/{TitleEditor-CMzzOPye.js.map → TitleEditor--XulEf7R.js.map} +1 -1
- package/dist/cdn/chunks/{blockTypeIcons-BC5qpvuV.js → blockTypeIcons-BJND4L-A.js} +6 -6
- package/dist/cdn/chunks/{blockTypeIcons-BC5qpvuV.js.map → blockTypeIcons-BJND4L-A.js.map} +1 -1
- package/dist/{de-DIAGP7yH.js → cdn/chunks/de-BJMLpg_p.js} +6 -0
- package/dist/cdn/chunks/{de-DIAGP7yH.js.map → de-BJMLpg_p.js.map} +1 -1
- package/dist/{en-nqIW8Q9W.js → cdn/chunks/en-DFMMw7SL.js} +6 -0
- package/dist/cdn/chunks/{en-nqIW8Q9W.js.map → en-DFMMw7SL.js.map} +1 -1
- package/dist/cdn/chunks/{extensions-DH7ESsaz.js → extensions-BtWoLy6E.js} +23 -23
- package/dist/cdn/chunks/{extensions-DH7ESsaz.js.map → extensions-BtWoLy6E.js.map} +1 -1
- package/dist/cdn/chunks/{features-DmUOSthI.js → features-mO5NzwnN.js} +442 -432
- package/dist/cdn/chunks/features-mO5NzwnN.js.map +1 -0
- package/dist/cdn/chunks/{icons-DguD4x_X.js → icons-CuXm6XAT.js} +2 -2
- package/dist/cdn/chunks/{icons-DguD4x_X.js.map → icons-CuXm6XAT.js.map} +1 -1
- package/dist/cdn/chunks/{media-library-ClQUPxRM.js → media-library-BtNzYUTi.js} +525 -525
- package/dist/cdn/chunks/{media-library-ClQUPxRM.js.map → media-library-BtNzYUTi.js.map} +1 -1
- package/dist/cdn/chunks/{pt-BR-DCNnLLx9.js → pt-BR-C-9aWLlR.js} +5 -1
- package/dist/cdn/chunks/{pt-BR-DCNnLLx9.js.map → pt-BR-C-9aWLlR.js.map} +1 -1
- package/dist/cdn/chunks/{quality-CIw_7cXv.js → quality-YKe19zp8.js} +83 -83
- package/dist/cdn/chunks/{quality-CIw_7cXv.js.map → quality-YKe19zp8.js.map} +1 -1
- package/dist/cdn/chunks/{renderer-Bx8I7_Rb.js → renderer-BcOaxCs6.js} +20 -20
- package/dist/cdn/chunks/{renderer-Bx8I7_Rb.js.map → renderer-BcOaxCs6.js.map} +1 -1
- package/dist/cdn/chunks/{src-C-GlM149.js → src-B_ZRmuit.js} +63 -63
- package/dist/cdn/chunks/{src-C-GlM149.js.map → src-B_ZRmuit.js.map} +1 -1
- package/dist/cdn/chunks/{styles-CfqCvq0Z.js → styles-DDBCCJ-l.js} +218 -200
- package/dist/cdn/chunks/styles-DDBCCJ-l.js.map +1 -0
- package/dist/cdn/editor.css +1 -1
- package/dist/cdn/editor.js +105 -104
- package/dist/cdn/editor.js.map +1 -1
- package/dist/{cdn/chunks/de-DIAGP7yH.js → de-BJMLpg_p.js} +4 -2
- package/dist/{cdn/chunks/en-nqIW8Q9W.js → en-DFMMw7SL.js} +4 -2
- package/dist/index.d.ts +32 -0
- package/dist/{pt-BR-DCNnLLx9.js → pt-BR-C-9aWLlR.js} +4 -0
- package/dist/style.css +1 -1
- package/dist/{styles-D_ztiOsh.js → styles-DZcQGzsN.js} +514 -496
- package/dist/templatical-editor.js +117 -116
- package/dist/{useEditorCore-tZGAVvNz.js → useEditorCore-D00QzW07.js} +731 -721
- package/package.json +8 -8
- package/dist/cdn/chunks/features-DmUOSthI.js.map +0 -1
- package/dist/cdn/chunks/styles-CfqCvq0Z.js.map +0 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { M as e, P as t, ct as n, f as r, g as i, h as a, it as o, m as s, p as c, st as l, u, x as d } from "./draggable-iAb7QVJo.js";
|
|
2
|
-
import {
|
|
3
|
-
import { n as p, r as m } from "./icons-
|
|
2
|
+
import { nt as f } from "./features-mO5NzwnN.js";
|
|
3
|
+
import { n as p, r as m } from "./icons-CuXm6XAT.js";
|
|
4
4
|
import { t as h } from "./readableTextColor-f8Kykfnh.js";
|
|
5
5
|
//#region src/cloud/components/CollaboratorBar.vue?vue&type=script&setup=true&lang.ts
|
|
6
6
|
var g = { class: "tpl-collaborator-bar tpl:flex tpl:items-center tpl:gap-2" }, _ = ["title"], v = {
|
|
@@ -48,4 +48,4 @@ var g = { class: "tpl-collaborator-bar tpl:flex tpl:items-center tpl:gap-2" }, _
|
|
|
48
48
|
//#endregion
|
|
49
49
|
export { S as default };
|
|
50
50
|
|
|
51
|
-
//# sourceMappingURL=CollaboratorBar-
|
|
51
|
+
//# sourceMappingURL=CollaboratorBar-DFqsaNX0.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CollaboratorBar-
|
|
1
|
+
{"version":3,"file":"CollaboratorBar-DFqsaNX0.js","names":[],"sources":["../../../src/cloud/components/CollaboratorBar.vue","../../../src/cloud/components/CollaboratorBar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Collaborator } from \"@templatical/types\";\nimport { useCloudI18nStrict } from \"../../composables\";\nimport { Wifi, WifiOff } from \"@lucide/vue\";\nimport { computed } from \"vue\";\nimport { readableTextColor } from \"../../utils/readableTextColor\";\n\nconst props = defineProps<{\n collaborators: Collaborator[];\n isConnected: boolean;\n}>();\n\nconst { t: cloudT } = useCloudI18nStrict();\n\nconst maxVisible = 3;\n\nconst visibleCollaborators = computed(() =>\n props.collaborators.slice(0, maxVisible),\n);\n\nconst overflowCollaborators = computed(() =>\n props.collaborators.slice(maxVisible),\n);\n\nconst overflowCount = computed(() => overflowCollaborators.value.length);\n\nconst overflowNames = computed(() =>\n overflowCollaborators.value.map((c) => c.name).join(\"\\n\"),\n);\n\nfunction getInitials(name: string): string {\n const parts = name.trim().split(/\\s+/);\n if (parts.length >= 2) {\n return (\n parts[0].charAt(0) + parts[parts.length - 1].charAt(0)\n ).toUpperCase();\n }\n return name.charAt(0).toUpperCase();\n}\n</script>\n\n<template>\n <div class=\"tpl-collaborator-bar tpl:flex tpl:items-center tpl:gap-2\">\n <!-- Connection indicator -->\n <div\n class=\"tpl:flex tpl:items-center tpl:gap-1 tpl:text-[11px]\"\n :style=\"{\n color: isConnected ? 'var(--tpl-success)' : 'var(--tpl-text-muted)',\n }\"\n :title=\"\n isConnected\n ? cloudT.collaboration.connected\n : cloudT.collaboration.disconnected\n \"\n >\n <Wifi v-if=\"isConnected\" :size=\"12\" :stroke-width=\"2\" />\n <WifiOff v-else :size=\"12\" :stroke-width=\"2\" />\n </div>\n\n <!-- Avatar stack -->\n <div\n v-if=\"collaborators.length > 0\"\n class=\"tpl:flex tpl:items-center tpl:-space-x-1.5\"\n >\n <div\n v-for=\"collaborator in visibleCollaborators\"\n :key=\"collaborator.id\"\n class=\"tpl-collaborator-avatar tpl:relative tpl:flex tpl:size-6 tpl:items-center tpl:justify-center tpl:rounded-full tpl:border-2 tpl:text-[10px] tpl:font-bold tpl:transition-transform tpl:duration-150 tpl:hover:z-10 tpl:hover:scale-110 tpl:border-[var(--tpl-bg)]\"\n :style=\"{\n backgroundColor: collaborator.color,\n color: readableTextColor(collaborator.color),\n }\"\n :title=\"collaborator.name\"\n >\n {{ getInitials(collaborator.name) }}\n </div>\n <div\n v-if=\"overflowCount > 0\"\n class=\"tpl:relative tpl:flex tpl:size-6 tpl:items-center tpl:justify-center tpl:rounded-full tpl:border-2 tpl:text-[9px] tpl:font-bold tpl:border-[var(--tpl-bg)] tpl:bg-[var(--tpl-bg-hover)] tpl:text-[var(--tpl-text-muted)]\"\n :title=\"overflowNames\"\n >\n +{{ overflowCount }}\n </div>\n </div>\n </div>\n</template>\n","<script setup lang=\"ts\">\nimport type { Collaborator } from \"@templatical/types\";\nimport { useCloudI18nStrict } from \"../../composables\";\nimport { Wifi, WifiOff } from \"@lucide/vue\";\nimport { computed } from \"vue\";\nimport { readableTextColor } from \"../../utils/readableTextColor\";\n\nconst props = defineProps<{\n collaborators: Collaborator[];\n isConnected: boolean;\n}>();\n\nconst { t: cloudT } = useCloudI18nStrict();\n\nconst maxVisible = 3;\n\nconst visibleCollaborators = computed(() =>\n props.collaborators.slice(0, maxVisible),\n);\n\nconst overflowCollaborators = computed(() =>\n props.collaborators.slice(maxVisible),\n);\n\nconst overflowCount = computed(() => overflowCollaborators.value.length);\n\nconst overflowNames = computed(() =>\n overflowCollaborators.value.map((c) => c.name).join(\"\\n\"),\n);\n\nfunction getInitials(name: string): string {\n const parts = name.trim().split(/\\s+/);\n if (parts.length >= 2) {\n return (\n parts[0].charAt(0) + parts[parts.length - 1].charAt(0)\n ).toUpperCase();\n }\n return name.charAt(0).toUpperCase();\n}\n</script>\n\n<template>\n <div class=\"tpl-collaborator-bar tpl:flex tpl:items-center tpl:gap-2\">\n <!-- Connection indicator -->\n <div\n class=\"tpl:flex tpl:items-center tpl:gap-1 tpl:text-[11px]\"\n :style=\"{\n color: isConnected ? 'var(--tpl-success)' : 'var(--tpl-text-muted)',\n }\"\n :title=\"\n isConnected\n ? cloudT.collaboration.connected\n : cloudT.collaboration.disconnected\n \"\n >\n <Wifi v-if=\"isConnected\" :size=\"12\" :stroke-width=\"2\" />\n <WifiOff v-else :size=\"12\" :stroke-width=\"2\" />\n </div>\n\n <!-- Avatar stack -->\n <div\n v-if=\"collaborators.length > 0\"\n class=\"tpl:flex tpl:items-center tpl:-space-x-1.5\"\n >\n <div\n v-for=\"collaborator in visibleCollaborators\"\n :key=\"collaborator.id\"\n class=\"tpl-collaborator-avatar tpl:relative tpl:flex tpl:size-6 tpl:items-center tpl:justify-center tpl:rounded-full tpl:border-2 tpl:text-[10px] tpl:font-bold tpl:transition-transform tpl:duration-150 tpl:hover:z-10 tpl:hover:scale-110 tpl:border-[var(--tpl-bg)]\"\n :style=\"{\n backgroundColor: collaborator.color,\n color: readableTextColor(collaborator.color),\n }\"\n :title=\"collaborator.name\"\n >\n {{ getInitials(collaborator.name) }}\n </div>\n <div\n v-if=\"overflowCount > 0\"\n class=\"tpl:relative tpl:flex tpl:size-6 tpl:items-center tpl:justify-center tpl:rounded-full tpl:border-2 tpl:text-[9px] tpl:font-bold tpl:border-[var(--tpl-bg)] tpl:bg-[var(--tpl-bg-hover)] tpl:text-[var(--tpl-text-muted)]\"\n :title=\"overflowNames\"\n >\n +{{ overflowCount }}\n </div>\n </div>\n </div>\n</template>\n"],"mappings":";;;;;;;;iCAcM,IAAa;;;;;;;EAPnB,IAAM,IAAQ,GAKR,EAAE,GAAG,MAAW,EAAmB,GAInC,IAAuB,QAC3B,EAAM,cAAc,MAAM,GAAG,CAAU,CACzC,GAEM,IAAwB,QAC5B,EAAM,cAAc,MAAM,CAAU,CACtC,GAEM,IAAgB,QAAe,EAAsB,MAAM,MAAM,GAEjE,IAAgB,QACpB,EAAsB,MAAM,KAAK,MAAM,EAAE,IAAI,EAAE,KAAK,IAAI,CAC1D;EAEA,SAAS,EAAY,GAAsB;GACzC,IAAM,IAAQ,EAAK,KAAK,EAAE,MAAM,KAAK;GAMrC,OALI,EAAM,UAAU,KAEhB,EAAM,GAAG,OAAO,CAAC,IAAI,EAAM,EAAM,SAAS,GAAG,OAAO,CAAC,GACrD,YAAY,IAET,EAAK,OAAO,CAAC,EAAE,YAAY;EACpC;yBAIE,EA0CM,OA1CN,GA0CM,CAxCJ,EAaM,OAAA;GAZJ,OAAM;GACL,OAAK,EAAA,EAAA,OAAmB,EAAA,cAAW,uBAAA,wBAAA,CAAA;GAGnC,OAAgB,EAAA,cAAwB,EAAA,CAAA,EAAO,cAAc,YAAsB,EAAA,CAAA,EAAO,cAAc;MAM7F,EAAA,eAAA,EAAA,GAAZ,EAAwD,EAAA,CAAA,GAAA;;GAA9B,MAAM;GAAK,gBAAc;cACnD,EAA+C,EAAA,CAAA,GAAA;;GAA9B,MAAM;GAAK,gBAAc;gBAKpC,EAAA,cAAc,SAAM,KAAA,EAAA,GAD5B,EAuBM,OAvBN,GAuBM,EAAA,EAAA,EAAA,GAnBJ,EAWM,GAAA,MAAA,EAVmB,EAAA,QAAhB,YADT,EAWM,OAAA;GATH,KAAK,EAAa;GACnB,OAAM;GACL,OAAK,EAAA;qBAA+B,EAAa;WAAwB,EAAA,CAAA,EAAkB,EAAa,KAAK;;GAI7G,OAAO,EAAa;OAElB,EAAY,EAAa,IAAI,CAAA,GAAA,IAAA,CAAA,YAG1B,EAAA,QAAa,KAAA,EAAA,GADrB,EAMM,OAAA;;GAJJ,OAAM;GACL,OAAO,EAAA;KACT,OACE,EAAG,EAAA,KAAa,GAAA,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,CAAA"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { n as e } from "./rolldown-runtime-Dqa2HsxW.js";
|
|
2
2
|
import { M as t, P as n, Z as r, ct as i, f as a, g as o, h as s, it as c, p as l, st as u, u as d, x as f } from "./draggable-iAb7QVJo.js";
|
|
3
|
-
import {
|
|
3
|
+
import { It as p, hn as m } from "./features-mO5NzwnN.js";
|
|
4
4
|
//#region src/components/blocks/CountdownBlock.vue?vue&type=script&setup=true&lang.ts
|
|
5
5
|
var h = {
|
|
6
6
|
key: 0,
|
|
@@ -90,4 +90,4 @@ var h = {
|
|
|
90
90
|
//#endregion
|
|
91
91
|
export { y as n, b as t };
|
|
92
92
|
|
|
93
|
-
//# sourceMappingURL=CountdownBlock-
|
|
93
|
+
//# sourceMappingURL=CountdownBlock-PpH3fxAX.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CountdownBlock-GRio55a1.js","names":[],"sources":["../../../src/components/blocks/CountdownBlock.vue","../../../src/components/blocks/CountdownBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type {\n CountdownBlock as CountdownBlockType,\n ViewportSize,\n} from \"@templatical/types\";\nimport { useIntervalFn } from \"@vueuse/core\";\nimport { computed, ref } from \"vue\";\nimport { useI18n } from \"../../composables/useI18n\";\n\nconst props = defineProps<{\n block: CountdownBlockType;\n viewport: ViewportSize;\n}>();\n\nconst { t } = useI18n();\n\nconst now = ref(Date.now());\nuseIntervalFn(() => {\n now.value = Date.now();\n}, 1000);\n\nconst targetTime = computed(() => {\n if (!props.block.targetDate) return null;\n const date = new Date(props.block.targetDate);\n return isNaN(date.getTime()) ? null : date.getTime();\n});\n\nconst isExpired = computed(() => {\n if (!targetTime.value) return false;\n return now.value >= targetTime.value;\n});\n\nconst remaining = computed(() => {\n if (!targetTime.value || isExpired.value) {\n return { days: 0, hours: 0, minutes: 0, seconds: 0 };\n }\n const diff = targetTime.value - now.value;\n const totalSeconds = Math.floor(diff / 1000);\n return {\n days: Math.floor(totalSeconds / 86400),\n hours: Math.floor((totalSeconds % 86400) / 3600),\n minutes: Math.floor((totalSeconds % 3600) / 60),\n seconds: totalSeconds % 60,\n };\n});\n\nconst segments = computed(() => {\n const result: Array<{ value: string; label: string }> = [];\n if (props.block.showDays) {\n result.push({\n value: String(remaining.value.days).padStart(2, \"0\"),\n label: props.block.labelDays,\n });\n }\n if (props.block.showHours) {\n result.push({\n value: String(remaining.value.hours).padStart(2, \"0\"),\n label: props.block.labelHours,\n });\n }\n if (props.block.showMinutes) {\n result.push({\n value: String(remaining.value.minutes).padStart(2, \"0\"),\n label: props.block.labelMinutes,\n });\n }\n if (props.block.showSeconds) {\n result.push({\n value: String(remaining.value.seconds).padStart(2, \"0\"),\n label: props.block.labelSeconds,\n });\n }\n return result;\n});\n\nconst containerStyle = computed(() => ({\n backgroundColor: props.block.backgroundColor,\n fontFamily: props.block.fontFamily || \"inherit\",\n}));\n\nconst digitStyle = computed(() => ({\n fontSize: `${props.block.digitFontSize}px`,\n fontWeight: \"bold\" as const,\n color: props.block.digitColor,\n lineHeight: \"1.2\",\n}));\n\nconst labelStyle = computed(() => ({\n fontSize: `${props.block.labelFontSize}px`,\n color: props.block.labelColor,\n marginTop: \"4px\",\n}));\n\nconst separatorStyle = computed(() => ({\n fontSize: `${props.block.digitFontSize}px`,\n color: props.block.digitColor,\n fontFamily: props.block.fontFamily || \"inherit\",\n}));\n</script>\n\n<template>\n <!-- Empty state: no target date -->\n <div\n v-if=\"!block.targetDate\"\n class=\"tpl:flex tpl:items-center tpl:justify-center tpl:py-8 tpl:text-sm tpl:text-[var(--tpl-text-dim)]\"\n >\n {{ t.countdown.setDate }}\n </div>\n\n <!-- Expired + hidden -->\n <div\n v-else-if=\"isExpired && block.hideOnExpiry\"\n class=\"tpl:flex tpl:items-center tpl:justify-center tpl:py-4 tpl:text-xs tpl:text-[var(--tpl-text-dim)] tpl:opacity-50\"\n >\n {{ t.countdown.hidden }}\n </div>\n\n <!-- Expired with message -->\n <div\n v-else-if=\"isExpired\"\n :style=\"containerStyle\"\n class=\"tpl:py-4 tpl:text-center\"\n >\n <span\n :style=\"{\n fontSize: `${block.digitFontSize}px`,\n color: block.digitColor,\n }\"\n >\n {{ block.expiredMessage }}\n </span>\n </div>\n\n <!-- Active countdown -->\n <div\n v-else\n :style=\"containerStyle\"\n class=\"tpl:flex tpl:items-center tpl:justify-center tpl:gap-2 tpl:py-4\"\n >\n <template v-for=\"(segment, index) in segments\" :key=\"segment.label\">\n <span v-if=\"index > 0\" :style=\"separatorStyle\" class=\"tpl:self-start\">\n {{ block.separator }}\n </span>\n <div class=\"tpl:text-center\">\n <div :style=\"digitStyle\">{{ segment.value }}</div>\n <div :style=\"labelStyle\">{{ segment.label }}</div>\n </div>\n </template>\n </div>\n</template>\n","<script setup lang=\"ts\">\nimport type {\n CountdownBlock as CountdownBlockType,\n ViewportSize,\n} from \"@templatical/types\";\nimport { useIntervalFn } from \"@vueuse/core\";\nimport { computed, ref } from \"vue\";\nimport { useI18n } from \"../../composables/useI18n\";\n\nconst props = defineProps<{\n block: CountdownBlockType;\n viewport: ViewportSize;\n}>();\n\nconst { t } = useI18n();\n\nconst now = ref(Date.now());\nuseIntervalFn(() => {\n now.value = Date.now();\n}, 1000);\n\nconst targetTime = computed(() => {\n if (!props.block.targetDate) return null;\n const date = new Date(props.block.targetDate);\n return isNaN(date.getTime()) ? null : date.getTime();\n});\n\nconst isExpired = computed(() => {\n if (!targetTime.value) return false;\n return now.value >= targetTime.value;\n});\n\nconst remaining = computed(() => {\n if (!targetTime.value || isExpired.value) {\n return { days: 0, hours: 0, minutes: 0, seconds: 0 };\n }\n const diff = targetTime.value - now.value;\n const totalSeconds = Math.floor(diff / 1000);\n return {\n days: Math.floor(totalSeconds / 86400),\n hours: Math.floor((totalSeconds % 86400) / 3600),\n minutes: Math.floor((totalSeconds % 3600) / 60),\n seconds: totalSeconds % 60,\n };\n});\n\nconst segments = computed(() => {\n const result: Array<{ value: string; label: string }> = [];\n if (props.block.showDays) {\n result.push({\n value: String(remaining.value.days).padStart(2, \"0\"),\n label: props.block.labelDays,\n });\n }\n if (props.block.showHours) {\n result.push({\n value: String(remaining.value.hours).padStart(2, \"0\"),\n label: props.block.labelHours,\n });\n }\n if (props.block.showMinutes) {\n result.push({\n value: String(remaining.value.minutes).padStart(2, \"0\"),\n label: props.block.labelMinutes,\n });\n }\n if (props.block.showSeconds) {\n result.push({\n value: String(remaining.value.seconds).padStart(2, \"0\"),\n label: props.block.labelSeconds,\n });\n }\n return result;\n});\n\nconst containerStyle = computed(() => ({\n backgroundColor: props.block.backgroundColor,\n fontFamily: props.block.fontFamily || \"inherit\",\n}));\n\nconst digitStyle = computed(() => ({\n fontSize: `${props.block.digitFontSize}px`,\n fontWeight: \"bold\" as const,\n color: props.block.digitColor,\n lineHeight: \"1.2\",\n}));\n\nconst labelStyle = computed(() => ({\n fontSize: `${props.block.labelFontSize}px`,\n color: props.block.labelColor,\n marginTop: \"4px\",\n}));\n\nconst separatorStyle = computed(() => ({\n fontSize: `${props.block.digitFontSize}px`,\n color: props.block.digitColor,\n fontFamily: props.block.fontFamily || \"inherit\",\n}));\n</script>\n\n<template>\n <!-- Empty state: no target date -->\n <div\n v-if=\"!block.targetDate\"\n class=\"tpl:flex tpl:items-center tpl:justify-center tpl:py-8 tpl:text-sm tpl:text-[var(--tpl-text-dim)]\"\n >\n {{ t.countdown.setDate }}\n </div>\n\n <!-- Expired + hidden -->\n <div\n v-else-if=\"isExpired && block.hideOnExpiry\"\n class=\"tpl:flex tpl:items-center tpl:justify-center tpl:py-4 tpl:text-xs tpl:text-[var(--tpl-text-dim)] tpl:opacity-50\"\n >\n {{ t.countdown.hidden }}\n </div>\n\n <!-- Expired with message -->\n <div\n v-else-if=\"isExpired\"\n :style=\"containerStyle\"\n class=\"tpl:py-4 tpl:text-center\"\n >\n <span\n :style=\"{\n fontSize: `${block.digitFontSize}px`,\n color: block.digitColor,\n }\"\n >\n {{ block.expiredMessage }}\n </span>\n </div>\n\n <!-- Active countdown -->\n <div\n v-else\n :style=\"containerStyle\"\n class=\"tpl:flex tpl:items-center tpl:justify-center tpl:gap-2 tpl:py-4\"\n >\n <template v-for=\"(segment, index) in segments\" :key=\"segment.label\">\n <span v-if=\"index > 0\" :style=\"separatorStyle\" class=\"tpl:self-start\">\n {{ block.separator }}\n </span>\n <div class=\"tpl:text-center\">\n <div :style=\"digitStyle\">{{ segment.value }}</div>\n <div :style=\"labelStyle\">{{ segment.label }}</div>\n </div>\n </template>\n </div>\n</template>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"CountdownBlock-PpH3fxAX.js","names":[],"sources":["../../../src/components/blocks/CountdownBlock.vue","../../../src/components/blocks/CountdownBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type {\n CountdownBlock as CountdownBlockType,\n ViewportSize,\n} from \"@templatical/types\";\nimport { useIntervalFn } from \"@vueuse/core\";\nimport { computed, ref } from \"vue\";\nimport { useI18n } from \"../../composables/useI18n\";\n\nconst props = defineProps<{\n block: CountdownBlockType;\n viewport: ViewportSize;\n}>();\n\nconst { t } = useI18n();\n\nconst now = ref(Date.now());\nuseIntervalFn(() => {\n now.value = Date.now();\n}, 1000);\n\nconst targetTime = computed(() => {\n if (!props.block.targetDate) return null;\n const date = new Date(props.block.targetDate);\n return isNaN(date.getTime()) ? null : date.getTime();\n});\n\nconst isExpired = computed(() => {\n if (!targetTime.value) return false;\n return now.value >= targetTime.value;\n});\n\nconst remaining = computed(() => {\n if (!targetTime.value || isExpired.value) {\n return { days: 0, hours: 0, minutes: 0, seconds: 0 };\n }\n const diff = targetTime.value - now.value;\n const totalSeconds = Math.floor(diff / 1000);\n return {\n days: Math.floor(totalSeconds / 86400),\n hours: Math.floor((totalSeconds % 86400) / 3600),\n minutes: Math.floor((totalSeconds % 3600) / 60),\n seconds: totalSeconds % 60,\n };\n});\n\nconst segments = computed(() => {\n const result: Array<{ value: string; label: string }> = [];\n if (props.block.showDays) {\n result.push({\n value: String(remaining.value.days).padStart(2, \"0\"),\n label: props.block.labelDays,\n });\n }\n if (props.block.showHours) {\n result.push({\n value: String(remaining.value.hours).padStart(2, \"0\"),\n label: props.block.labelHours,\n });\n }\n if (props.block.showMinutes) {\n result.push({\n value: String(remaining.value.minutes).padStart(2, \"0\"),\n label: props.block.labelMinutes,\n });\n }\n if (props.block.showSeconds) {\n result.push({\n value: String(remaining.value.seconds).padStart(2, \"0\"),\n label: props.block.labelSeconds,\n });\n }\n return result;\n});\n\nconst containerStyle = computed(() => ({\n backgroundColor: props.block.backgroundColor,\n fontFamily: props.block.fontFamily || \"inherit\",\n}));\n\nconst digitStyle = computed(() => ({\n fontSize: `${props.block.digitFontSize}px`,\n fontWeight: \"bold\" as const,\n color: props.block.digitColor,\n lineHeight: \"1.2\",\n}));\n\nconst labelStyle = computed(() => ({\n fontSize: `${props.block.labelFontSize}px`,\n color: props.block.labelColor,\n marginTop: \"4px\",\n}));\n\nconst separatorStyle = computed(() => ({\n fontSize: `${props.block.digitFontSize}px`,\n color: props.block.digitColor,\n fontFamily: props.block.fontFamily || \"inherit\",\n}));\n</script>\n\n<template>\n <!-- Empty state: no target date -->\n <div\n v-if=\"!block.targetDate\"\n class=\"tpl:flex tpl:items-center tpl:justify-center tpl:py-8 tpl:text-sm tpl:text-[var(--tpl-text-dim)]\"\n >\n {{ t.countdown.setDate }}\n </div>\n\n <!-- Expired + hidden -->\n <div\n v-else-if=\"isExpired && block.hideOnExpiry\"\n class=\"tpl:flex tpl:items-center tpl:justify-center tpl:py-4 tpl:text-xs tpl:text-[var(--tpl-text-dim)] tpl:opacity-50\"\n >\n {{ t.countdown.hidden }}\n </div>\n\n <!-- Expired with message -->\n <div\n v-else-if=\"isExpired\"\n :style=\"containerStyle\"\n class=\"tpl:py-4 tpl:text-center\"\n >\n <span\n :style=\"{\n fontSize: `${block.digitFontSize}px`,\n color: block.digitColor,\n }\"\n >\n {{ block.expiredMessage }}\n </span>\n </div>\n\n <!-- Active countdown -->\n <div\n v-else\n :style=\"containerStyle\"\n class=\"tpl:flex tpl:items-center tpl:justify-center tpl:gap-2 tpl:py-4\"\n >\n <template v-for=\"(segment, index) in segments\" :key=\"segment.label\">\n <span v-if=\"index > 0\" :style=\"separatorStyle\" class=\"tpl:self-start\">\n {{ block.separator }}\n </span>\n <div class=\"tpl:text-center\">\n <div :style=\"digitStyle\">{{ segment.value }}</div>\n <div :style=\"labelStyle\">{{ segment.label }}</div>\n </div>\n </template>\n </div>\n</template>\n","<script setup lang=\"ts\">\nimport type {\n CountdownBlock as CountdownBlockType,\n ViewportSize,\n} from \"@templatical/types\";\nimport { useIntervalFn } from \"@vueuse/core\";\nimport { computed, ref } from \"vue\";\nimport { useI18n } from \"../../composables/useI18n\";\n\nconst props = defineProps<{\n block: CountdownBlockType;\n viewport: ViewportSize;\n}>();\n\nconst { t } = useI18n();\n\nconst now = ref(Date.now());\nuseIntervalFn(() => {\n now.value = Date.now();\n}, 1000);\n\nconst targetTime = computed(() => {\n if (!props.block.targetDate) return null;\n const date = new Date(props.block.targetDate);\n return isNaN(date.getTime()) ? null : date.getTime();\n});\n\nconst isExpired = computed(() => {\n if (!targetTime.value) return false;\n return now.value >= targetTime.value;\n});\n\nconst remaining = computed(() => {\n if (!targetTime.value || isExpired.value) {\n return { days: 0, hours: 0, minutes: 0, seconds: 0 };\n }\n const diff = targetTime.value - now.value;\n const totalSeconds = Math.floor(diff / 1000);\n return {\n days: Math.floor(totalSeconds / 86400),\n hours: Math.floor((totalSeconds % 86400) / 3600),\n minutes: Math.floor((totalSeconds % 3600) / 60),\n seconds: totalSeconds % 60,\n };\n});\n\nconst segments = computed(() => {\n const result: Array<{ value: string; label: string }> = [];\n if (props.block.showDays) {\n result.push({\n value: String(remaining.value.days).padStart(2, \"0\"),\n label: props.block.labelDays,\n });\n }\n if (props.block.showHours) {\n result.push({\n value: String(remaining.value.hours).padStart(2, \"0\"),\n label: props.block.labelHours,\n });\n }\n if (props.block.showMinutes) {\n result.push({\n value: String(remaining.value.minutes).padStart(2, \"0\"),\n label: props.block.labelMinutes,\n });\n }\n if (props.block.showSeconds) {\n result.push({\n value: String(remaining.value.seconds).padStart(2, \"0\"),\n label: props.block.labelSeconds,\n });\n }\n return result;\n});\n\nconst containerStyle = computed(() => ({\n backgroundColor: props.block.backgroundColor,\n fontFamily: props.block.fontFamily || \"inherit\",\n}));\n\nconst digitStyle = computed(() => ({\n fontSize: `${props.block.digitFontSize}px`,\n fontWeight: \"bold\" as const,\n color: props.block.digitColor,\n lineHeight: \"1.2\",\n}));\n\nconst labelStyle = computed(() => ({\n fontSize: `${props.block.labelFontSize}px`,\n color: props.block.labelColor,\n marginTop: \"4px\",\n}));\n\nconst separatorStyle = computed(() => ({\n fontSize: `${props.block.digitFontSize}px`,\n color: props.block.digitColor,\n fontFamily: props.block.fontFamily || \"inherit\",\n}));\n</script>\n\n<template>\n <!-- Empty state: no target date -->\n <div\n v-if=\"!block.targetDate\"\n class=\"tpl:flex tpl:items-center tpl:justify-center tpl:py-8 tpl:text-sm tpl:text-[var(--tpl-text-dim)]\"\n >\n {{ t.countdown.setDate }}\n </div>\n\n <!-- Expired + hidden -->\n <div\n v-else-if=\"isExpired && block.hideOnExpiry\"\n class=\"tpl:flex tpl:items-center tpl:justify-center tpl:py-4 tpl:text-xs tpl:text-[var(--tpl-text-dim)] tpl:opacity-50\"\n >\n {{ t.countdown.hidden }}\n </div>\n\n <!-- Expired with message -->\n <div\n v-else-if=\"isExpired\"\n :style=\"containerStyle\"\n class=\"tpl:py-4 tpl:text-center\"\n >\n <span\n :style=\"{\n fontSize: `${block.digitFontSize}px`,\n color: block.digitColor,\n }\"\n >\n {{ block.expiredMessage }}\n </span>\n </div>\n\n <!-- Active countdown -->\n <div\n v-else\n :style=\"containerStyle\"\n class=\"tpl:flex tpl:items-center tpl:justify-center tpl:gap-2 tpl:py-4\"\n >\n <template v-for=\"(segment, index) in segments\" :key=\"segment.label\">\n <span v-if=\"index > 0\" :style=\"separatorStyle\" class=\"tpl:self-start\">\n {{ block.separator }}\n </span>\n <div class=\"tpl:text-center\">\n <div :style=\"digitStyle\">{{ segment.value }}</div>\n <div :style=\"labelStyle\">{{ segment.label }}</div>\n </div>\n </template>\n </div>\n</template>\n"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { M as e, P as t, V as n, ct as r, f as i, g as a, it as o, m as s, ot as c, p as l, u, v as d, x as f, y as p } from "./draggable-iAb7QVJo.js";
|
|
2
|
-
import {
|
|
2
|
+
import { It as m } from "./features-mO5NzwnN.js";
|
|
3
3
|
import { f as h } from "./styleConstants-lGobwiLH.js";
|
|
4
|
-
import { i as g, n as _, r as v, t as y } from "./NumberWithSuffix-
|
|
4
|
+
import { i as g, n as _, r as v, t as y } from "./NumberWithSuffix-Deo8EOSz.js";
|
|
5
5
|
//#region src/components/toolbar/CheckboxItem.vue?vue&type=script&setup=true&lang.ts
|
|
6
6
|
var b = { class: "tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:text-[12px] tpl:text-[var(--tpl-text)]" }, x = ["checked"], S = /* @__PURE__ */ f({
|
|
7
7
|
__name: "CheckboxItem",
|
|
@@ -209,4 +209,4 @@ var b = { class: "tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:tex
|
|
|
209
209
|
//#endregion
|
|
210
210
|
export { I as default };
|
|
211
211
|
|
|
212
|
-
//# sourceMappingURL=CountdownToolbar-
|
|
212
|
+
//# sourceMappingURL=CountdownToolbar-CZN92Bhz.js.map
|
package/dist/cdn/chunks/{CountdownToolbar-Cd1oEopw.js.map → CountdownToolbar-CZN92Bhz.js.map}
RENAMED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CountdownToolbar-Cd1oEopw.js","names":[],"sources":["../../../src/components/toolbar/CheckboxItem.vue","../../../src/components/toolbar/CheckboxItem.vue","../../../src/components/toolbar/CountdownToolbar.vue","../../../src/components/toolbar/CountdownToolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\ndefineProps<{\n modelValue: boolean;\n label: string;\n}>();\n\nconst emit = defineEmits<{\n (e: \"update:modelValue\", value: boolean): void;\n}>();\n</script>\n\n<template>\n <label\n class=\"tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:text-[12px] tpl:text-[var(--tpl-text)]\"\n >\n <input\n type=\"checkbox\"\n class=\"tpl:size-3.5 tpl:cursor-pointer tpl:accent-[var(--tpl-primary)]\"\n :checked=\"modelValue\"\n @change=\"\n emit('update:modelValue', ($event.target as HTMLInputElement).checked)\n \"\n />\n {{ label }}\n </label>\n</template>\n","<script setup lang=\"ts\">\ndefineProps<{\n modelValue: boolean;\n label: string;\n}>();\n\nconst emit = defineEmits<{\n (e: \"update:modelValue\", value: boolean): void;\n}>();\n</script>\n\n<template>\n <label\n class=\"tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:text-[12px] tpl:text-[var(--tpl-text)]\"\n >\n <input\n type=\"checkbox\"\n class=\"tpl:size-3.5 tpl:cursor-pointer tpl:accent-[var(--tpl-primary)]\"\n :checked=\"modelValue\"\n @change=\"\n emit('update:modelValue', ($event.target as HTMLInputElement).checked)\n \"\n />\n {{ label }}\n </label>\n</template>\n","<script setup lang=\"ts\">\nimport ColorPicker from \"../ColorPicker.vue\";\nimport SlidingPillSelect from \"../SlidingPillSelect.vue\";\nimport FieldRow from \"./FieldRow.vue\";\nimport CheckboxItem from \"./CheckboxItem.vue\";\nimport NumberWithSuffix from \"./NumberWithSuffix.vue\";\nimport { useI18n } from \"../../composables/useI18n\";\nimport { inputClass } from \"../../constants/styleConstants\";\nimport type { CountdownBlock } from \"@templatical/types\";\nimport { computed } from \"vue\";\n\ndefineProps<{\n block: CountdownBlock;\n fontFamilies: Array<{ value: string; label: string }>;\n}>();\n\nconst emit = defineEmits<{\n (e: \"update\", updates: Partial<CountdownBlock>): void;\n}>();\n\nconst { t } = useI18n();\n\nconst TIMEZONES = [\n \"UTC\",\n \"America/New_York\",\n \"America/Chicago\",\n \"America/Denver\",\n \"America/Los_Angeles\",\n \"Europe/London\",\n \"Europe/Berlin\",\n \"Europe/Paris\",\n \"Europe/Moscow\",\n \"Asia/Dubai\",\n \"Asia/Kolkata\",\n \"Asia/Shanghai\",\n \"Asia/Tokyo\",\n \"Australia/Sydney\",\n \"Pacific/Auckland\",\n];\n\nconst SEPARATORS = [\n { value: \":\", label: \":\" },\n { value: \"-\", label: \"-\" },\n { value: \" \", label: \"␣\" },\n];\n\ntype UnitKey = \"Days\" | \"Hours\" | \"Minutes\" | \"Seconds\";\nconst UNITS: UnitKey[] = [\"Days\", \"Hours\", \"Minutes\", \"Seconds\"];\n\nconst unitItems = computed(() =>\n UNITS.map((unit) => ({\n unit,\n showKey: `show${unit}` as const,\n labelKey: `label${unit}` as const,\n translationKey: unit.toLowerCase() as\n | \"days\"\n | \"hours\"\n | \"minutes\"\n | \"seconds\",\n })),\n);\n\nfunction updateField(field: keyof CountdownBlock, value: unknown): void {\n emit(\"update\", { [field]: value } as Partial<CountdownBlock>);\n}\n</script>\n\n<template>\n <FieldRow :label=\"t.countdown.targetDate\">\n <input\n type=\"datetime-local\"\n :class=\"inputClass\"\n :value=\"block.targetDate\"\n @input=\"\n updateField('targetDate', ($event.target as HTMLInputElement).value)\n \"\n />\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.timezone\">\n <select\n :class=\"inputClass\"\n :value=\"block.timezone\"\n @change=\"\n updateField('timezone', ($event.target as HTMLSelectElement).value)\n \"\n >\n <option v-for=\"tz in TIMEZONES\" :key=\"tz\" :value=\"tz\">{{ tz }}</option>\n </select>\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.display\">\n <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-2\">\n <CheckboxItem\n v-for=\"item in unitItems\"\n :key=\"item.unit\"\n :model-value=\"block[item.showKey]\"\n :label=\"t.countdown[item.translationKey]\"\n @update:model-value=\"updateField(item.showKey, $event)\"\n />\n </div>\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.separator\">\n <SlidingPillSelect\n :options=\"SEPARATORS\"\n :model-value=\"block.separator\"\n @update:model-value=\"updateField('separator', $event)\"\n />\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.fontFamily\">\n <select\n :class=\"inputClass\"\n :value=\"block.fontFamily || ''\"\n @change=\"\n updateField(\n 'fontFamily',\n ($event.target as HTMLSelectElement).value || undefined,\n )\n \"\n >\n <option value=\"\">{{ t.countdown.inheritFont }}</option>\n <option\n v-for=\"font in fontFamilies\"\n :key=\"font.value\"\n :value=\"font.value\"\n >\n {{ font.label }}\n </option>\n </select>\n </FieldRow>\n\n <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-3\">\n <FieldRow :label=\"t.countdown.digitFontSize\">\n <NumberWithSuffix\n :model-value=\"block.digitFontSize\"\n :min=\"12\"\n :max=\"72\"\n suffix=\"px\"\n @update:model-value=\"updateField('digitFontSize', $event)\"\n />\n </FieldRow>\n <FieldRow :label=\"t.countdown.labelFontSize\">\n <NumberWithSuffix\n :model-value=\"block.labelFontSize\"\n :min=\"8\"\n :max=\"24\"\n suffix=\"px\"\n @update:model-value=\"updateField('labelFontSize', $event)\"\n />\n </FieldRow>\n </div>\n\n <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-3\">\n <FieldRow :label=\"t.countdown.digitColor\">\n <ColorPicker\n :model-value=\"block.digitColor\"\n @update:model-value=\"updateField('digitColor', $event)\"\n />\n </FieldRow>\n <FieldRow :label=\"t.countdown.labelColor\">\n <ColorPicker\n :model-value=\"block.labelColor\"\n @update:model-value=\"updateField('labelColor', $event)\"\n />\n </FieldRow>\n </div>\n\n <FieldRow :label=\"t.countdown.background\">\n <ColorPicker\n :model-value=\"block.backgroundColor\"\n @update:model-value=\"updateField('backgroundColor', $event)\"\n />\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.labels\">\n <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-2\">\n <input\n v-for=\"item in unitItems\"\n :key=\"item.unit\"\n type=\"text\"\n :class=\"inputClass\"\n :value=\"block[item.labelKey]\"\n :placeholder=\"t.countdown[item.translationKey]\"\n @input=\"\n updateField(item.labelKey, ($event.target as HTMLInputElement).value)\n \"\n />\n </div>\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.expiry\">\n <input\n type=\"text\"\n :class=\"inputClass\"\n :value=\"block.expiredMessage\"\n :placeholder=\"t.countdown.expiredMessagePlaceholder\"\n @input=\"\n updateField('expiredMessage', ($event.target as HTMLInputElement).value)\n \"\n />\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.expiredImageUrl\">\n <input\n type=\"url\"\n :class=\"inputClass\"\n :value=\"block.expiredImageUrl\"\n placeholder=\"https://...\"\n @input=\"\n updateField(\n 'expiredImageUrl',\n ($event.target as HTMLInputElement).value,\n )\n \"\n />\n </FieldRow>\n\n <CheckboxItem\n :model-value=\"block.hideOnExpiry\"\n :label=\"t.countdown.hideOnExpiry\"\n class=\"tpl:mb-3.5\"\n @update:model-value=\"updateField('hideOnExpiry', $event)\"\n />\n</template>\n","<script setup lang=\"ts\">\nimport ColorPicker from \"../ColorPicker.vue\";\nimport SlidingPillSelect from \"../SlidingPillSelect.vue\";\nimport FieldRow from \"./FieldRow.vue\";\nimport CheckboxItem from \"./CheckboxItem.vue\";\nimport NumberWithSuffix from \"./NumberWithSuffix.vue\";\nimport { useI18n } from \"../../composables/useI18n\";\nimport { inputClass } from \"../../constants/styleConstants\";\nimport type { CountdownBlock } from \"@templatical/types\";\nimport { computed } from \"vue\";\n\ndefineProps<{\n block: CountdownBlock;\n fontFamilies: Array<{ value: string; label: string }>;\n}>();\n\nconst emit = defineEmits<{\n (e: \"update\", updates: Partial<CountdownBlock>): void;\n}>();\n\nconst { t } = useI18n();\n\nconst TIMEZONES = [\n \"UTC\",\n \"America/New_York\",\n \"America/Chicago\",\n \"America/Denver\",\n \"America/Los_Angeles\",\n \"Europe/London\",\n \"Europe/Berlin\",\n \"Europe/Paris\",\n \"Europe/Moscow\",\n \"Asia/Dubai\",\n \"Asia/Kolkata\",\n \"Asia/Shanghai\",\n \"Asia/Tokyo\",\n \"Australia/Sydney\",\n \"Pacific/Auckland\",\n];\n\nconst SEPARATORS = [\n { value: \":\", label: \":\" },\n { value: \"-\", label: \"-\" },\n { value: \" \", label: \"␣\" },\n];\n\ntype UnitKey = \"Days\" | \"Hours\" | \"Minutes\" | \"Seconds\";\nconst UNITS: UnitKey[] = [\"Days\", \"Hours\", \"Minutes\", \"Seconds\"];\n\nconst unitItems = computed(() =>\n UNITS.map((unit) => ({\n unit,\n showKey: `show${unit}` as const,\n labelKey: `label${unit}` as const,\n translationKey: unit.toLowerCase() as\n | \"days\"\n | \"hours\"\n | \"minutes\"\n | \"seconds\",\n })),\n);\n\nfunction updateField(field: keyof CountdownBlock, value: unknown): void {\n emit(\"update\", { [field]: value } as Partial<CountdownBlock>);\n}\n</script>\n\n<template>\n <FieldRow :label=\"t.countdown.targetDate\">\n <input\n type=\"datetime-local\"\n :class=\"inputClass\"\n :value=\"block.targetDate\"\n @input=\"\n updateField('targetDate', ($event.target as HTMLInputElement).value)\n \"\n />\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.timezone\">\n <select\n :class=\"inputClass\"\n :value=\"block.timezone\"\n @change=\"\n updateField('timezone', ($event.target as HTMLSelectElement).value)\n \"\n >\n <option v-for=\"tz in TIMEZONES\" :key=\"tz\" :value=\"tz\">{{ tz }}</option>\n </select>\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.display\">\n <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-2\">\n <CheckboxItem\n v-for=\"item in unitItems\"\n :key=\"item.unit\"\n :model-value=\"block[item.showKey]\"\n :label=\"t.countdown[item.translationKey]\"\n @update:model-value=\"updateField(item.showKey, $event)\"\n />\n </div>\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.separator\">\n <SlidingPillSelect\n :options=\"SEPARATORS\"\n :model-value=\"block.separator\"\n @update:model-value=\"updateField('separator', $event)\"\n />\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.fontFamily\">\n <select\n :class=\"inputClass\"\n :value=\"block.fontFamily || ''\"\n @change=\"\n updateField(\n 'fontFamily',\n ($event.target as HTMLSelectElement).value || undefined,\n )\n \"\n >\n <option value=\"\">{{ t.countdown.inheritFont }}</option>\n <option\n v-for=\"font in fontFamilies\"\n :key=\"font.value\"\n :value=\"font.value\"\n >\n {{ font.label }}\n </option>\n </select>\n </FieldRow>\n\n <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-3\">\n <FieldRow :label=\"t.countdown.digitFontSize\">\n <NumberWithSuffix\n :model-value=\"block.digitFontSize\"\n :min=\"12\"\n :max=\"72\"\n suffix=\"px\"\n @update:model-value=\"updateField('digitFontSize', $event)\"\n />\n </FieldRow>\n <FieldRow :label=\"t.countdown.labelFontSize\">\n <NumberWithSuffix\n :model-value=\"block.labelFontSize\"\n :min=\"8\"\n :max=\"24\"\n suffix=\"px\"\n @update:model-value=\"updateField('labelFontSize', $event)\"\n />\n </FieldRow>\n </div>\n\n <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-3\">\n <FieldRow :label=\"t.countdown.digitColor\">\n <ColorPicker\n :model-value=\"block.digitColor\"\n @update:model-value=\"updateField('digitColor', $event)\"\n />\n </FieldRow>\n <FieldRow :label=\"t.countdown.labelColor\">\n <ColorPicker\n :model-value=\"block.labelColor\"\n @update:model-value=\"updateField('labelColor', $event)\"\n />\n </FieldRow>\n </div>\n\n <FieldRow :label=\"t.countdown.background\">\n <ColorPicker\n :model-value=\"block.backgroundColor\"\n @update:model-value=\"updateField('backgroundColor', $event)\"\n />\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.labels\">\n <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-2\">\n <input\n v-for=\"item in unitItems\"\n :key=\"item.unit\"\n type=\"text\"\n :class=\"inputClass\"\n :value=\"block[item.labelKey]\"\n :placeholder=\"t.countdown[item.translationKey]\"\n @input=\"\n updateField(item.labelKey, ($event.target as HTMLInputElement).value)\n \"\n />\n </div>\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.expiry\">\n <input\n type=\"text\"\n :class=\"inputClass\"\n :value=\"block.expiredMessage\"\n :placeholder=\"t.countdown.expiredMessagePlaceholder\"\n @input=\"\n updateField('expiredMessage', ($event.target as HTMLInputElement).value)\n \"\n />\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.expiredImageUrl\">\n <input\n type=\"url\"\n :class=\"inputClass\"\n :value=\"block.expiredImageUrl\"\n placeholder=\"https://...\"\n @input=\"\n updateField(\n 'expiredImageUrl',\n ($event.target as HTMLInputElement).value,\n )\n \"\n />\n </FieldRow>\n\n <CheckboxItem\n :model-value=\"block.hideOnExpiry\"\n :label=\"t.countdown.hideOnExpiry\"\n class=\"tpl:mb-3.5\"\n @update:model-value=\"updateField('hideOnExpiry', $event)\"\n />\n</template>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"CountdownToolbar-CZN92Bhz.js","names":[],"sources":["../../../src/components/toolbar/CheckboxItem.vue","../../../src/components/toolbar/CheckboxItem.vue","../../../src/components/toolbar/CountdownToolbar.vue","../../../src/components/toolbar/CountdownToolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\ndefineProps<{\n modelValue: boolean;\n label: string;\n}>();\n\nconst emit = defineEmits<{\n (e: \"update:modelValue\", value: boolean): void;\n}>();\n</script>\n\n<template>\n <label\n class=\"tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:text-[12px] tpl:text-[var(--tpl-text)]\"\n >\n <input\n type=\"checkbox\"\n class=\"tpl:size-3.5 tpl:cursor-pointer tpl:accent-[var(--tpl-primary)]\"\n :checked=\"modelValue\"\n @change=\"\n emit('update:modelValue', ($event.target as HTMLInputElement).checked)\n \"\n />\n {{ label }}\n </label>\n</template>\n","<script setup lang=\"ts\">\ndefineProps<{\n modelValue: boolean;\n label: string;\n}>();\n\nconst emit = defineEmits<{\n (e: \"update:modelValue\", value: boolean): void;\n}>();\n</script>\n\n<template>\n <label\n class=\"tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:text-[12px] tpl:text-[var(--tpl-text)]\"\n >\n <input\n type=\"checkbox\"\n class=\"tpl:size-3.5 tpl:cursor-pointer tpl:accent-[var(--tpl-primary)]\"\n :checked=\"modelValue\"\n @change=\"\n emit('update:modelValue', ($event.target as HTMLInputElement).checked)\n \"\n />\n {{ label }}\n </label>\n</template>\n","<script setup lang=\"ts\">\nimport ColorPicker from \"../ColorPicker.vue\";\nimport SlidingPillSelect from \"../SlidingPillSelect.vue\";\nimport FieldRow from \"./FieldRow.vue\";\nimport CheckboxItem from \"./CheckboxItem.vue\";\nimport NumberWithSuffix from \"./NumberWithSuffix.vue\";\nimport { useI18n } from \"../../composables/useI18n\";\nimport { inputClass } from \"../../constants/styleConstants\";\nimport type { CountdownBlock } from \"@templatical/types\";\nimport { computed } from \"vue\";\n\ndefineProps<{\n block: CountdownBlock;\n fontFamilies: Array<{ value: string; label: string }>;\n}>();\n\nconst emit = defineEmits<{\n (e: \"update\", updates: Partial<CountdownBlock>): void;\n}>();\n\nconst { t } = useI18n();\n\nconst TIMEZONES = [\n \"UTC\",\n \"America/New_York\",\n \"America/Chicago\",\n \"America/Denver\",\n \"America/Los_Angeles\",\n \"Europe/London\",\n \"Europe/Berlin\",\n \"Europe/Paris\",\n \"Europe/Moscow\",\n \"Asia/Dubai\",\n \"Asia/Kolkata\",\n \"Asia/Shanghai\",\n \"Asia/Tokyo\",\n \"Australia/Sydney\",\n \"Pacific/Auckland\",\n];\n\nconst SEPARATORS = [\n { value: \":\", label: \":\" },\n { value: \"-\", label: \"-\" },\n { value: \" \", label: \"␣\" },\n];\n\ntype UnitKey = \"Days\" | \"Hours\" | \"Minutes\" | \"Seconds\";\nconst UNITS: UnitKey[] = [\"Days\", \"Hours\", \"Minutes\", \"Seconds\"];\n\nconst unitItems = computed(() =>\n UNITS.map((unit) => ({\n unit,\n showKey: `show${unit}` as const,\n labelKey: `label${unit}` as const,\n translationKey: unit.toLowerCase() as\n | \"days\"\n | \"hours\"\n | \"minutes\"\n | \"seconds\",\n })),\n);\n\nfunction updateField(field: keyof CountdownBlock, value: unknown): void {\n emit(\"update\", { [field]: value } as Partial<CountdownBlock>);\n}\n</script>\n\n<template>\n <FieldRow :label=\"t.countdown.targetDate\">\n <input\n type=\"datetime-local\"\n :class=\"inputClass\"\n :value=\"block.targetDate\"\n @input=\"\n updateField('targetDate', ($event.target as HTMLInputElement).value)\n \"\n />\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.timezone\">\n <select\n :class=\"inputClass\"\n :value=\"block.timezone\"\n @change=\"\n updateField('timezone', ($event.target as HTMLSelectElement).value)\n \"\n >\n <option v-for=\"tz in TIMEZONES\" :key=\"tz\" :value=\"tz\">{{ tz }}</option>\n </select>\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.display\">\n <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-2\">\n <CheckboxItem\n v-for=\"item in unitItems\"\n :key=\"item.unit\"\n :model-value=\"block[item.showKey]\"\n :label=\"t.countdown[item.translationKey]\"\n @update:model-value=\"updateField(item.showKey, $event)\"\n />\n </div>\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.separator\">\n <SlidingPillSelect\n :options=\"SEPARATORS\"\n :model-value=\"block.separator\"\n @update:model-value=\"updateField('separator', $event)\"\n />\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.fontFamily\">\n <select\n :class=\"inputClass\"\n :value=\"block.fontFamily || ''\"\n @change=\"\n updateField(\n 'fontFamily',\n ($event.target as HTMLSelectElement).value || undefined,\n )\n \"\n >\n <option value=\"\">{{ t.countdown.inheritFont }}</option>\n <option\n v-for=\"font in fontFamilies\"\n :key=\"font.value\"\n :value=\"font.value\"\n >\n {{ font.label }}\n </option>\n </select>\n </FieldRow>\n\n <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-3\">\n <FieldRow :label=\"t.countdown.digitFontSize\">\n <NumberWithSuffix\n :model-value=\"block.digitFontSize\"\n :min=\"12\"\n :max=\"72\"\n suffix=\"px\"\n @update:model-value=\"updateField('digitFontSize', $event)\"\n />\n </FieldRow>\n <FieldRow :label=\"t.countdown.labelFontSize\">\n <NumberWithSuffix\n :model-value=\"block.labelFontSize\"\n :min=\"8\"\n :max=\"24\"\n suffix=\"px\"\n @update:model-value=\"updateField('labelFontSize', $event)\"\n />\n </FieldRow>\n </div>\n\n <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-3\">\n <FieldRow :label=\"t.countdown.digitColor\">\n <ColorPicker\n :model-value=\"block.digitColor\"\n @update:model-value=\"updateField('digitColor', $event)\"\n />\n </FieldRow>\n <FieldRow :label=\"t.countdown.labelColor\">\n <ColorPicker\n :model-value=\"block.labelColor\"\n @update:model-value=\"updateField('labelColor', $event)\"\n />\n </FieldRow>\n </div>\n\n <FieldRow :label=\"t.countdown.background\">\n <ColorPicker\n :model-value=\"block.backgroundColor\"\n @update:model-value=\"updateField('backgroundColor', $event)\"\n />\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.labels\">\n <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-2\">\n <input\n v-for=\"item in unitItems\"\n :key=\"item.unit\"\n type=\"text\"\n :class=\"inputClass\"\n :value=\"block[item.labelKey]\"\n :placeholder=\"t.countdown[item.translationKey]\"\n @input=\"\n updateField(item.labelKey, ($event.target as HTMLInputElement).value)\n \"\n />\n </div>\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.expiry\">\n <input\n type=\"text\"\n :class=\"inputClass\"\n :value=\"block.expiredMessage\"\n :placeholder=\"t.countdown.expiredMessagePlaceholder\"\n @input=\"\n updateField('expiredMessage', ($event.target as HTMLInputElement).value)\n \"\n />\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.expiredImageUrl\">\n <input\n type=\"url\"\n :class=\"inputClass\"\n :value=\"block.expiredImageUrl\"\n placeholder=\"https://...\"\n @input=\"\n updateField(\n 'expiredImageUrl',\n ($event.target as HTMLInputElement).value,\n )\n \"\n />\n </FieldRow>\n\n <CheckboxItem\n :model-value=\"block.hideOnExpiry\"\n :label=\"t.countdown.hideOnExpiry\"\n class=\"tpl:mb-3.5\"\n @update:model-value=\"updateField('hideOnExpiry', $event)\"\n />\n</template>\n","<script setup lang=\"ts\">\nimport ColorPicker from \"../ColorPicker.vue\";\nimport SlidingPillSelect from \"../SlidingPillSelect.vue\";\nimport FieldRow from \"./FieldRow.vue\";\nimport CheckboxItem from \"./CheckboxItem.vue\";\nimport NumberWithSuffix from \"./NumberWithSuffix.vue\";\nimport { useI18n } from \"../../composables/useI18n\";\nimport { inputClass } from \"../../constants/styleConstants\";\nimport type { CountdownBlock } from \"@templatical/types\";\nimport { computed } from \"vue\";\n\ndefineProps<{\n block: CountdownBlock;\n fontFamilies: Array<{ value: string; label: string }>;\n}>();\n\nconst emit = defineEmits<{\n (e: \"update\", updates: Partial<CountdownBlock>): void;\n}>();\n\nconst { t } = useI18n();\n\nconst TIMEZONES = [\n \"UTC\",\n \"America/New_York\",\n \"America/Chicago\",\n \"America/Denver\",\n \"America/Los_Angeles\",\n \"Europe/London\",\n \"Europe/Berlin\",\n \"Europe/Paris\",\n \"Europe/Moscow\",\n \"Asia/Dubai\",\n \"Asia/Kolkata\",\n \"Asia/Shanghai\",\n \"Asia/Tokyo\",\n \"Australia/Sydney\",\n \"Pacific/Auckland\",\n];\n\nconst SEPARATORS = [\n { value: \":\", label: \":\" },\n { value: \"-\", label: \"-\" },\n { value: \" \", label: \"␣\" },\n];\n\ntype UnitKey = \"Days\" | \"Hours\" | \"Minutes\" | \"Seconds\";\nconst UNITS: UnitKey[] = [\"Days\", \"Hours\", \"Minutes\", \"Seconds\"];\n\nconst unitItems = computed(() =>\n UNITS.map((unit) => ({\n unit,\n showKey: `show${unit}` as const,\n labelKey: `label${unit}` as const,\n translationKey: unit.toLowerCase() as\n | \"days\"\n | \"hours\"\n | \"minutes\"\n | \"seconds\",\n })),\n);\n\nfunction updateField(field: keyof CountdownBlock, value: unknown): void {\n emit(\"update\", { [field]: value } as Partial<CountdownBlock>);\n}\n</script>\n\n<template>\n <FieldRow :label=\"t.countdown.targetDate\">\n <input\n type=\"datetime-local\"\n :class=\"inputClass\"\n :value=\"block.targetDate\"\n @input=\"\n updateField('targetDate', ($event.target as HTMLInputElement).value)\n \"\n />\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.timezone\">\n <select\n :class=\"inputClass\"\n :value=\"block.timezone\"\n @change=\"\n updateField('timezone', ($event.target as HTMLSelectElement).value)\n \"\n >\n <option v-for=\"tz in TIMEZONES\" :key=\"tz\" :value=\"tz\">{{ tz }}</option>\n </select>\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.display\">\n <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-2\">\n <CheckboxItem\n v-for=\"item in unitItems\"\n :key=\"item.unit\"\n :model-value=\"block[item.showKey]\"\n :label=\"t.countdown[item.translationKey]\"\n @update:model-value=\"updateField(item.showKey, $event)\"\n />\n </div>\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.separator\">\n <SlidingPillSelect\n :options=\"SEPARATORS\"\n :model-value=\"block.separator\"\n @update:model-value=\"updateField('separator', $event)\"\n />\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.fontFamily\">\n <select\n :class=\"inputClass\"\n :value=\"block.fontFamily || ''\"\n @change=\"\n updateField(\n 'fontFamily',\n ($event.target as HTMLSelectElement).value || undefined,\n )\n \"\n >\n <option value=\"\">{{ t.countdown.inheritFont }}</option>\n <option\n v-for=\"font in fontFamilies\"\n :key=\"font.value\"\n :value=\"font.value\"\n >\n {{ font.label }}\n </option>\n </select>\n </FieldRow>\n\n <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-3\">\n <FieldRow :label=\"t.countdown.digitFontSize\">\n <NumberWithSuffix\n :model-value=\"block.digitFontSize\"\n :min=\"12\"\n :max=\"72\"\n suffix=\"px\"\n @update:model-value=\"updateField('digitFontSize', $event)\"\n />\n </FieldRow>\n <FieldRow :label=\"t.countdown.labelFontSize\">\n <NumberWithSuffix\n :model-value=\"block.labelFontSize\"\n :min=\"8\"\n :max=\"24\"\n suffix=\"px\"\n @update:model-value=\"updateField('labelFontSize', $event)\"\n />\n </FieldRow>\n </div>\n\n <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-3\">\n <FieldRow :label=\"t.countdown.digitColor\">\n <ColorPicker\n :model-value=\"block.digitColor\"\n @update:model-value=\"updateField('digitColor', $event)\"\n />\n </FieldRow>\n <FieldRow :label=\"t.countdown.labelColor\">\n <ColorPicker\n :model-value=\"block.labelColor\"\n @update:model-value=\"updateField('labelColor', $event)\"\n />\n </FieldRow>\n </div>\n\n <FieldRow :label=\"t.countdown.background\">\n <ColorPicker\n :model-value=\"block.backgroundColor\"\n @update:model-value=\"updateField('backgroundColor', $event)\"\n />\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.labels\">\n <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-2\">\n <input\n v-for=\"item in unitItems\"\n :key=\"item.unit\"\n type=\"text\"\n :class=\"inputClass\"\n :value=\"block[item.labelKey]\"\n :placeholder=\"t.countdown[item.translationKey]\"\n @input=\"\n updateField(item.labelKey, ($event.target as HTMLInputElement).value)\n \"\n />\n </div>\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.expiry\">\n <input\n type=\"text\"\n :class=\"inputClass\"\n :value=\"block.expiredMessage\"\n :placeholder=\"t.countdown.expiredMessagePlaceholder\"\n @input=\"\n updateField('expiredMessage', ($event.target as HTMLInputElement).value)\n \"\n />\n </FieldRow>\n\n <FieldRow :label=\"t.countdown.expiredImageUrl\">\n <input\n type=\"url\"\n :class=\"inputClass\"\n :value=\"block.expiredImageUrl\"\n placeholder=\"https://...\"\n @input=\"\n updateField(\n 'expiredImageUrl',\n ($event.target as HTMLInputElement).value,\n )\n \"\n />\n </FieldRow>\n\n <CheckboxItem\n :model-value=\"block.hideOnExpiry\"\n :label=\"t.countdown.hideOnExpiry\"\n class=\"tpl:mb-3.5\"\n @update:model-value=\"updateField('hideOnExpiry', $event)\"\n />\n</template>\n"],"mappings":";;;;;;;;;;;;;EAMA,IAAM,IAAO;yBAMX,EAYQ,SAZR,GAYQ,CATN,EAOE,SAAA;GANA,MAAK;GACL,OAAM;GACL,SAAS,EAAA;GACT,UAAM,AAAA,EAAA,QAAA,MAAW,EAAI,qBAAuB,EAAO,OAA4B,OAAO;qBAGvF,MACF,EAAG,EAAA,KAAK,GAAA,CAAA,CAAA,CAAA;;;;;;;;;;;;;;EEPZ,IAAM,IAAO,GAIP,EAAE,SAAM,EAAQ,GAEhB,IAAY;GAChB;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,GAEM,IAAa;GACjB;IAAE,OAAO;IAAK,OAAO;GAAI;GACzB;IAAE,OAAO;IAAK,OAAO;GAAI;GACzB;IAAE,OAAO;IAAK,OAAO;GAAI;EAC3B,GAGM,IAAmB;GAAC;GAAQ;GAAS;GAAW;EAAS,GAEzD,IAAY,QAChB,EAAM,KAAK,OAAU;GACnB;GACA,SAAS,OAAO;GAChB,UAAU,QAAQ;GAClB,gBAAgB,EAAK,YAAY;EAKnC,EAAE,CACJ;EAEA,SAAS,EAAY,GAA6B,GAAsB;GACtE,EAAK,UAAU,GAAG,IAAQ,EAAM,CAA4B;EAC9D;;GAIE,EASW,GAAA,EATA,OAAO,EAAA,CAAA,EAAE,UAAU,WAAA,GAAA;qBAQ1B,CAPF,EAOE,SAAA;KANA,MAAK;KACJ,OAAK,EAAE,EAAA,CAAA,CAAU;KACjB,OAAO,EAAA,MAAM;KACb,SAAK,AAAA,EAAA,QAAA,MAAW,EAAW,cAAgB,EAAO,OAA4B,KAAK;;;;GAMxF,EAUW,GAAA,EAVA,OAAO,EAAA,CAAA,EAAE,UAAU,SAAA,GAAA;qBASnB,CART,EAQS,UAAA;KAPN,OAAK,EAAE,EAAA,CAAA,CAAU;KACjB,OAAO,EAAA,MAAM;KACb,UAAM,AAAA,EAAA,QAAA,MAAW,EAAW,YAAc,EAAO,OAA6B,KAAK;cAIpF,EAAuE,GAAA,MAAA,EAAlD,IAAN,MAAf,EAAuE,UAAA;KAAtC,KAAK;KAAK,OAAO;SAAO,CAAE,GAAA,GAAA,CAAA;;;GAI/D,EAUW,GAAA,EAVA,OAAO,EAAA,CAAA,EAAE,UAAU,QAAA,GAAA;qBAStB,CARN,EAQM,OARN,GAQM,EAAA,EAAA,EAAA,GAPJ,EAME,GAAA,MAAA,EALe,EAAA,QAAR,YADT,EAME,GAAA;KAJC,KAAK,EAAK;KACV,eAAa,EAAA,MAAM,EAAK;KACxB,OAAO,EAAA,CAAA,EAAE,UAAU,EAAK;KACxB,wBAAkB,MAAE,EAAY,EAAK,SAAS,CAAM;;;;;;;;GAK3D,EAMW,GAAA,EANA,OAAO,EAAA,CAAA,EAAE,UAAU,UAAA,GAAA;qBAK1B,CAJF,EAIE,GAAA;KAHC,SAAS;KACT,eAAa,EAAA,MAAM;KACnB,uBAAkB,AAAA,EAAA,QAAA,MAAE,EAAW,aAAc,CAAM;;;;GAIxD,EAoBW,GAAA,EApBA,OAAO,EAAA,CAAA,EAAE,UAAU,WAAA,GAAA;qBAmBnB,CAlBT,EAkBS,UAAA;KAjBN,OAAK,EAAE,EAAA,CAAA,CAAU;KACjB,OAAO,EAAA,MAAM,cAAU;KACvB,UAAM,AAAA,EAAA,QAAA,MAAW,EAAA,cAAgD,EAAO,OAA6B,SAAS,KAAA,CAAA;QAO/G,EAAuD,UAAvD,GAAuD,EAAnC,EAAA,CAAA,EAAE,UAAU,WAAW,GAAA,CAAA,IAAA,EAAA,EAAA,GAC3C,EAMS,GAAA,MAAA,EALQ,EAAA,eAAR,YADT,EAMS,UAAA;KAJN,KAAK,EAAK;KACV,OAAO,EAAK;SAEV,EAAK,KAAK,GAAA,GAAA,CAAA;;;GAKnB,EAmBM,OAnBN,GAmBM,CAlBJ,EAQW,GAAA,EARA,OAAO,EAAA,CAAA,EAAE,UAAU,cAAA,GAAA;qBAO1B,CANF,EAME,GAAA;KALC,eAAa,EAAA,MAAM;KACnB,KAAK;KACL,KAAK;KACN,QAAO;KACN,uBAAkB,AAAA,EAAA,QAAA,MAAE,EAAW,iBAAkB,CAAM;;;qBAG5D,EAQW,GAAA,EARA,OAAO,EAAA,CAAA,EAAE,UAAU,cAAA,GAAA;qBAO1B,CANF,EAME,GAAA;KALC,eAAa,EAAA,MAAM;KACnB,KAAK;KACL,KAAK;KACN,QAAO;KACN,uBAAkB,AAAA,EAAA,QAAA,MAAE,EAAW,iBAAkB,CAAM;;;;GAK9D,EAaM,OAbN,GAaM,CAZJ,EAKW,GAAA,EALA,OAAO,EAAA,CAAA,EAAE,UAAU,WAAA,GAAA;qBAI1B,CAHF,EAGE,GAAA;KAFC,eAAa,EAAA,MAAM;KACnB,uBAAkB,AAAA,EAAA,QAAA,MAAE,EAAW,cAAe,CAAM;;;qBAGzD,EAKW,GAAA,EALA,OAAO,EAAA,CAAA,EAAE,UAAU,WAAA,GAAA;qBAI1B,CAHF,EAGE,GAAA;KAFC,eAAa,EAAA,MAAM;KACnB,uBAAkB,AAAA,EAAA,QAAA,MAAE,EAAW,cAAe,CAAM;;;;GAK3D,EAKW,GAAA,EALA,OAAO,EAAA,CAAA,EAAE,UAAU,WAAA,GAAA;qBAI1B,CAHF,EAGE,GAAA;KAFC,eAAa,EAAA,MAAM;KACnB,uBAAkB,AAAA,EAAA,QAAA,MAAE,EAAW,mBAAoB,CAAM;;;;GAI9D,EAcW,GAAA,EAdA,OAAO,EAAA,CAAA,EAAE,UAAU,OAAA,GAAA;qBAatB,CAZN,EAYM,OAZN,GAYM,EAAA,EAAA,EAAA,GAXJ,EAUE,GAAA,MAAA,EATe,EAAA,QAAR,YADT,EAUE,SAAA;KARC,KAAK,EAAK;KACX,MAAK;KACJ,OAAK,EAAE,EAAA,CAAA,CAAU;KACjB,OAAO,EAAA,MAAM,EAAK;KAClB,aAAa,EAAA,CAAA,EAAE,UAAU,EAAK;KAC9B,UAAK,MAAa,EAAY,EAAK,UAAW,EAAO,OAA4B,KAAK;;;;GAO7F,EAUW,GAAA,EAVA,OAAO,EAAA,CAAA,EAAE,UAAU,OAAA,GAAA;qBAS1B,CARF,EAQE,SAAA;KAPA,MAAK;KACJ,OAAK,EAAE,EAAA,CAAA,CAAU;KACjB,OAAO,EAAA,MAAM;KACb,aAAa,EAAA,CAAA,EAAE,UAAU;KACzB,SAAK,AAAA,EAAA,QAAA,MAAW,EAAW,kBAAoB,EAAO,OAA4B,KAAK;;;;GAM5F,EAaW,GAAA,EAbA,OAAO,EAAA,CAAA,EAAE,UAAU,gBAAA,GAAA;qBAY1B,CAXF,EAWE,SAAA;KAVA,MAAK;KACJ,OAAK,EAAE,EAAA,CAAA,CAAU;KACjB,OAAO,EAAA,MAAM;KACd,aAAY;KACX,SAAK,AAAA,EAAA,SAAA,MAAW,EAAA,mBAAqD,EAAO,OAA4B,KAAA;;;;GAS7G,EAKE,GAAA;IAJC,eAAa,EAAA,MAAM;IACnB,OAAO,EAAA,CAAA,EAAE,UAAU;IACpB,OAAM;IACL,uBAAkB,AAAA,EAAA,SAAA,MAAE,EAAW,gBAAiB,CAAM"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { L as e, M as t, P as n, T as r, ct as i, f as a, g as o, h as s, it as c, m as l, ot as u, p as d, u as f, v as p, x as m, y as h } from "./draggable-iAb7QVJo.js";
|
|
2
|
-
import {
|
|
3
|
-
import { Z as S, t as C, z as w } from "./icons-
|
|
2
|
+
import { It as g, Ot as _, Yt as v, bt as y, ct as b, rn as x } from "./features-mO5NzwnN.js";
|
|
3
|
+
import { Z as S, t as C, z as w } from "./icons-CuXm6XAT.js";
|
|
4
4
|
//#region src/components/sidebar/IssuesPanel.vue?vue&type=script&setup=true&lang.ts
|
|
5
5
|
var T = { class: "tpl:flex tpl:flex-col tpl:gap-4 tpl:p-4" }, E = { class: "tpl:flex tpl:items-center tpl:gap-2" }, D = { class: "tpl:m-0 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]" }, O = ["title"], k = {
|
|
6
6
|
key: 0,
|
|
@@ -14,7 +14,7 @@ var T = { class: "tpl:flex tpl:flex-col tpl:gap-4 tpl:p-4" }, E = { class: "tpl:
|
|
|
14
14
|
}, N = { class: "tpl:m-0 tpl:mb-2 tpl:text-xs tpl:text-[var(--tpl-text)]" }, P = { class: "tpl:m-0 tpl:mb-2 tpl:font-mono tpl:text-[10px] tpl:text-[var(--tpl-text-dim)]" }, F = { class: "tpl:flex tpl:gap-1.5" }, I = ["onClick"], L = ["title", "onClick"], R = /* @__PURE__ */ m({
|
|
15
15
|
__name: "IssuesPanel",
|
|
16
16
|
setup(m) {
|
|
17
|
-
let { t: R, format: z } =
|
|
17
|
+
let { t: R, format: z } = g(), B = r(x, null), V = r(v, null), H = a(() => (B?.issues.value ?? []).filter((e) => e.severity === "error")), U = a(() => (B?.issues.value ?? []).filter((e) => e.severity === "warning")), W = a(() => (B?.issues.value ?? []).filter((e) => e.severity === "info")), G = a(() => H.value.length + U.value.length + W.value.length);
|
|
18
18
|
function K(e) {
|
|
19
19
|
V && e.blockId && V.selectBlock(e.blockId);
|
|
20
20
|
}
|
|
@@ -36,7 +36,7 @@ var T = { class: "tpl:flex tpl:flex-col tpl:gap-4 tpl:p-4" }, E = { class: "tpl:
|
|
|
36
36
|
{
|
|
37
37
|
key: "errors",
|
|
38
38
|
title: c(R).issues.groupErrors,
|
|
39
|
-
icon: c(
|
|
39
|
+
icon: c(_),
|
|
40
40
|
items: H.value,
|
|
41
41
|
tone: "tpl:text-[var(--tpl-danger)]"
|
|
42
42
|
},
|
|
@@ -50,7 +50,7 @@ var T = { class: "tpl:flex tpl:flex-col tpl:gap-4 tpl:p-4" }, E = { class: "tpl:
|
|
|
50
50
|
{
|
|
51
51
|
key: "info",
|
|
52
52
|
title: c(R).issues.groupInfo,
|
|
53
|
-
icon: c(
|
|
53
|
+
icon: c(y),
|
|
54
54
|
items: W.value,
|
|
55
55
|
tone: "tpl:text-[var(--tpl-text-muted)]"
|
|
56
56
|
}
|
|
@@ -94,4 +94,4 @@ var T = { class: "tpl:flex tpl:flex-col tpl:gap-4 tpl:p-4" }, E = { class: "tpl:
|
|
|
94
94
|
//#endregion
|
|
95
95
|
export { R as default };
|
|
96
96
|
|
|
97
|
-
//# sourceMappingURL=IssuesPanel-
|
|
97
|
+
//# sourceMappingURL=IssuesPanel-wQjrnuyc.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IssuesPanel-C-BiFQDQ.js","names":[],"sources":["../../../src/components/sidebar/IssuesPanel.vue","../../../src/components/sidebar/IssuesPanel.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, inject } from \"vue\";\nimport {\n ListChecks,\n AlertCircle,\n AlertTriangle,\n Info,\n ArrowRight,\n Wrench,\n} from \"@lucide/vue\";\nimport { useI18n } from \"../../composables/useI18n\";\nimport { TEMPLATE_LINT_KEY, EDITOR_KEY } from \"../../keys\";\nimport type { LintIssue } from \"../../composables/useTemplateLint\";\n\nconst { t, format } = useI18n();\nconst lint = inject(TEMPLATE_LINT_KEY, null);\nconst editor = inject(EDITOR_KEY, null);\n\nconst errors = computed(() =>\n (lint?.issues.value ?? []).filter((i) => i.severity === \"error\"),\n);\nconst warnings = computed(() =>\n (lint?.issues.value ?? []).filter((i) => i.severity === \"warning\"),\n);\nconst infos = computed(() =>\n (lint?.issues.value ?? []).filter((i) => i.severity === \"info\"),\n);\n\nconst totalCount = computed(\n () => errors.value.length + warnings.value.length + infos.value.length,\n);\n\nfunction jumpTo(issue: LintIssue): void {\n if (!editor) return;\n if (issue.blockId) editor.selectBlock(issue.blockId);\n}\n\nfunction applyFix(issue: LintIssue): void {\n lint?.applyFix(issue);\n}\n</script>\n\n<template>\n <div class=\"tpl:flex tpl:flex-col tpl:gap-4 tpl:p-4\">\n <header class=\"tpl:flex tpl:items-center tpl:gap-2\">\n <ListChecks :size=\"16\" :stroke-width=\"1.5\" />\n <h3\n class=\"tpl:m-0 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]\"\n >\n {{ t.issues.panelTitle }}\n </h3>\n <span\n v-if=\"totalCount > 0\"\n class=\"tpl:ml-auto tpl:rounded-full tpl:bg-[var(--tpl-bg-hover)] tpl:px-2 tpl:py-0.5 tpl:text-[11px] tpl:text-[var(--tpl-text-muted)]\"\n :title=\"format(t.issues.issueCountTooltip, { count: totalCount })\"\n >\n {{ totalCount }}\n </span>\n </header>\n\n <div\n v-if=\"!lint || lint.unavailable.value\"\n class=\"tpl:text-xs tpl:text-[var(--tpl-text-muted)]\"\n >\n <!-- Quality package not available; render nothing visible beyond a hint. -->\n </div>\n\n <div\n v-else-if=\"totalCount === 0\"\n class=\"tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-3 tpl:text-xs tpl:text-[var(--tpl-text-muted)]\"\n >\n {{ t.issues.emptyState }}\n </div>\n\n <template v-else>\n <section\n v-for=\"group in [\n {\n key: 'errors',\n title: t.issues.groupErrors,\n icon: AlertCircle,\n items: errors,\n tone: 'tpl:text-[var(--tpl-danger)]',\n },\n {\n key: 'warnings',\n title: t.issues.groupWarnings,\n icon: AlertTriangle,\n items: warnings,\n tone: 'tpl:text-[var(--tpl-warning)]',\n },\n {\n key: 'info',\n title: t.issues.groupInfo,\n icon: Info,\n items: infos,\n tone: 'tpl:text-[var(--tpl-text-muted)]',\n },\n ]\"\n :key=\"group.key\"\n >\n <header\n v-if=\"group.items.length > 0\"\n class=\"tpl:mb-2 tpl:flex tpl:items-center tpl:gap-1.5 tpl:text-[11px] tpl:font-semibold tpl:uppercase tpl:tracking-wide\"\n :class=\"group.tone\"\n >\n <component :is=\"group.icon\" :size=\"12\" :stroke-width=\"2\" />\n {{ group.title }}\n <span class=\"tpl:ml-auto tpl:font-normal tpl:opacity-70\">\n {{ group.items.length }}\n </span>\n </header>\n <ul\n v-if=\"group.items.length > 0\"\n class=\"tpl:m-0 tpl:mb-3 tpl:flex tpl:list-none tpl:flex-col tpl:gap-2 tpl:p-0\"\n >\n <li\n v-for=\"issue in group.items\"\n :key=\"`${issue.ruleId}-${issue.blockId ?? 'template'}`\"\n class=\"tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-3\"\n >\n <p class=\"tpl:m-0 tpl:mb-2 tpl:text-xs tpl:text-[var(--tpl-text)]\">\n {{ issue.message }}\n </p>\n <p\n class=\"tpl:m-0 tpl:mb-2 tpl:font-mono tpl:text-[10px] tpl:text-[var(--tpl-text-dim)]\"\n >\n {{ issue.ruleId }}\n </p>\n <div class=\"tpl:flex tpl:gap-1.5\">\n <button\n v-if=\"issue.blockId\"\n type=\"button\"\n class=\"tpl:flex tpl:items-center tpl:gap-1 tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-hover)] tpl:px-2 tpl:py-1 tpl:text-[11px] tpl:font-medium tpl:text-[var(--tpl-text)]\"\n @click=\"jumpTo(issue)\"\n >\n <ArrowRight :size=\"10\" :stroke-width=\"2\" />\n {{ t.issues.jump }}\n </button>\n <button\n v-if=\"issue.fix\"\n type=\"button\"\n class=\"tpl:flex tpl:items-center tpl:gap-1 tpl:rounded-md tpl:bg-[var(--tpl-primary)] tpl:px-2 tpl:py-1 tpl:text-[11px] tpl:font-medium tpl:text-white\"\n :title=\"issue.fix.description\"\n @click=\"applyFix(issue)\"\n >\n <Wrench :size=\"10\" :stroke-width=\"2\" />\n {{ t.issues.fix }}\n </button>\n </div>\n </li>\n </ul>\n </section>\n </template>\n </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, inject } from \"vue\";\nimport {\n ListChecks,\n AlertCircle,\n AlertTriangle,\n Info,\n ArrowRight,\n Wrench,\n} from \"@lucide/vue\";\nimport { useI18n } from \"../../composables/useI18n\";\nimport { TEMPLATE_LINT_KEY, EDITOR_KEY } from \"../../keys\";\nimport type { LintIssue } from \"../../composables/useTemplateLint\";\n\nconst { t, format } = useI18n();\nconst lint = inject(TEMPLATE_LINT_KEY, null);\nconst editor = inject(EDITOR_KEY, null);\n\nconst errors = computed(() =>\n (lint?.issues.value ?? []).filter((i) => i.severity === \"error\"),\n);\nconst warnings = computed(() =>\n (lint?.issues.value ?? []).filter((i) => i.severity === \"warning\"),\n);\nconst infos = computed(() =>\n (lint?.issues.value ?? []).filter((i) => i.severity === \"info\"),\n);\n\nconst totalCount = computed(\n () => errors.value.length + warnings.value.length + infos.value.length,\n);\n\nfunction jumpTo(issue: LintIssue): void {\n if (!editor) return;\n if (issue.blockId) editor.selectBlock(issue.blockId);\n}\n\nfunction applyFix(issue: LintIssue): void {\n lint?.applyFix(issue);\n}\n</script>\n\n<template>\n <div class=\"tpl:flex tpl:flex-col tpl:gap-4 tpl:p-4\">\n <header class=\"tpl:flex tpl:items-center tpl:gap-2\">\n <ListChecks :size=\"16\" :stroke-width=\"1.5\" />\n <h3\n class=\"tpl:m-0 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]\"\n >\n {{ t.issues.panelTitle }}\n </h3>\n <span\n v-if=\"totalCount > 0\"\n class=\"tpl:ml-auto tpl:rounded-full tpl:bg-[var(--tpl-bg-hover)] tpl:px-2 tpl:py-0.5 tpl:text-[11px] tpl:text-[var(--tpl-text-muted)]\"\n :title=\"format(t.issues.issueCountTooltip, { count: totalCount })\"\n >\n {{ totalCount }}\n </span>\n </header>\n\n <div\n v-if=\"!lint || lint.unavailable.value\"\n class=\"tpl:text-xs tpl:text-[var(--tpl-text-muted)]\"\n >\n <!-- Quality package not available; render nothing visible beyond a hint. -->\n </div>\n\n <div\n v-else-if=\"totalCount === 0\"\n class=\"tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-3 tpl:text-xs tpl:text-[var(--tpl-text-muted)]\"\n >\n {{ t.issues.emptyState }}\n </div>\n\n <template v-else>\n <section\n v-for=\"group in [\n {\n key: 'errors',\n title: t.issues.groupErrors,\n icon: AlertCircle,\n items: errors,\n tone: 'tpl:text-[var(--tpl-danger)]',\n },\n {\n key: 'warnings',\n title: t.issues.groupWarnings,\n icon: AlertTriangle,\n items: warnings,\n tone: 'tpl:text-[var(--tpl-warning)]',\n },\n {\n key: 'info',\n title: t.issues.groupInfo,\n icon: Info,\n items: infos,\n tone: 'tpl:text-[var(--tpl-text-muted)]',\n },\n ]\"\n :key=\"group.key\"\n >\n <header\n v-if=\"group.items.length > 0\"\n class=\"tpl:mb-2 tpl:flex tpl:items-center tpl:gap-1.5 tpl:text-[11px] tpl:font-semibold tpl:uppercase tpl:tracking-wide\"\n :class=\"group.tone\"\n >\n <component :is=\"group.icon\" :size=\"12\" :stroke-width=\"2\" />\n {{ group.title }}\n <span class=\"tpl:ml-auto tpl:font-normal tpl:opacity-70\">\n {{ group.items.length }}\n </span>\n </header>\n <ul\n v-if=\"group.items.length > 0\"\n class=\"tpl:m-0 tpl:mb-3 tpl:flex tpl:list-none tpl:flex-col tpl:gap-2 tpl:p-0\"\n >\n <li\n v-for=\"issue in group.items\"\n :key=\"`${issue.ruleId}-${issue.blockId ?? 'template'}`\"\n class=\"tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-3\"\n >\n <p class=\"tpl:m-0 tpl:mb-2 tpl:text-xs tpl:text-[var(--tpl-text)]\">\n {{ issue.message }}\n </p>\n <p\n class=\"tpl:m-0 tpl:mb-2 tpl:font-mono tpl:text-[10px] tpl:text-[var(--tpl-text-dim)]\"\n >\n {{ issue.ruleId }}\n </p>\n <div class=\"tpl:flex tpl:gap-1.5\">\n <button\n v-if=\"issue.blockId\"\n type=\"button\"\n class=\"tpl:flex tpl:items-center tpl:gap-1 tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-hover)] tpl:px-2 tpl:py-1 tpl:text-[11px] tpl:font-medium tpl:text-[var(--tpl-text)]\"\n @click=\"jumpTo(issue)\"\n >\n <ArrowRight :size=\"10\" :stroke-width=\"2\" />\n {{ t.issues.jump }}\n </button>\n <button\n v-if=\"issue.fix\"\n type=\"button\"\n class=\"tpl:flex tpl:items-center tpl:gap-1 tpl:rounded-md tpl:bg-[var(--tpl-primary)] tpl:px-2 tpl:py-1 tpl:text-[11px] tpl:font-medium tpl:text-white\"\n :title=\"issue.fix.description\"\n @click=\"applyFix(issue)\"\n >\n <Wrench :size=\"10\" :stroke-width=\"2\" />\n {{ t.issues.fix }}\n </button>\n </div>\n </li>\n </ul>\n </section>\n </template>\n </div>\n</template>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"IssuesPanel-wQjrnuyc.js","names":[],"sources":["../../../src/components/sidebar/IssuesPanel.vue","../../../src/components/sidebar/IssuesPanel.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, inject } from \"vue\";\nimport {\n ListChecks,\n AlertCircle,\n AlertTriangle,\n Info,\n ArrowRight,\n Wrench,\n} from \"@lucide/vue\";\nimport { useI18n } from \"../../composables/useI18n\";\nimport { TEMPLATE_LINT_KEY, EDITOR_KEY } from \"../../keys\";\nimport type { LintIssue } from \"../../composables/useTemplateLint\";\n\nconst { t, format } = useI18n();\nconst lint = inject(TEMPLATE_LINT_KEY, null);\nconst editor = inject(EDITOR_KEY, null);\n\nconst errors = computed(() =>\n (lint?.issues.value ?? []).filter((i) => i.severity === \"error\"),\n);\nconst warnings = computed(() =>\n (lint?.issues.value ?? []).filter((i) => i.severity === \"warning\"),\n);\nconst infos = computed(() =>\n (lint?.issues.value ?? []).filter((i) => i.severity === \"info\"),\n);\n\nconst totalCount = computed(\n () => errors.value.length + warnings.value.length + infos.value.length,\n);\n\nfunction jumpTo(issue: LintIssue): void {\n if (!editor) return;\n if (issue.blockId) editor.selectBlock(issue.blockId);\n}\n\nfunction applyFix(issue: LintIssue): void {\n lint?.applyFix(issue);\n}\n</script>\n\n<template>\n <div class=\"tpl:flex tpl:flex-col tpl:gap-4 tpl:p-4\">\n <header class=\"tpl:flex tpl:items-center tpl:gap-2\">\n <ListChecks :size=\"16\" :stroke-width=\"1.5\" />\n <h3\n class=\"tpl:m-0 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]\"\n >\n {{ t.issues.panelTitle }}\n </h3>\n <span\n v-if=\"totalCount > 0\"\n class=\"tpl:ml-auto tpl:rounded-full tpl:bg-[var(--tpl-bg-hover)] tpl:px-2 tpl:py-0.5 tpl:text-[11px] tpl:text-[var(--tpl-text-muted)]\"\n :title=\"format(t.issues.issueCountTooltip, { count: totalCount })\"\n >\n {{ totalCount }}\n </span>\n </header>\n\n <div\n v-if=\"!lint || lint.unavailable.value\"\n class=\"tpl:text-xs tpl:text-[var(--tpl-text-muted)]\"\n >\n <!-- Quality package not available; render nothing visible beyond a hint. -->\n </div>\n\n <div\n v-else-if=\"totalCount === 0\"\n class=\"tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-3 tpl:text-xs tpl:text-[var(--tpl-text-muted)]\"\n >\n {{ t.issues.emptyState }}\n </div>\n\n <template v-else>\n <section\n v-for=\"group in [\n {\n key: 'errors',\n title: t.issues.groupErrors,\n icon: AlertCircle,\n items: errors,\n tone: 'tpl:text-[var(--tpl-danger)]',\n },\n {\n key: 'warnings',\n title: t.issues.groupWarnings,\n icon: AlertTriangle,\n items: warnings,\n tone: 'tpl:text-[var(--tpl-warning)]',\n },\n {\n key: 'info',\n title: t.issues.groupInfo,\n icon: Info,\n items: infos,\n tone: 'tpl:text-[var(--tpl-text-muted)]',\n },\n ]\"\n :key=\"group.key\"\n >\n <header\n v-if=\"group.items.length > 0\"\n class=\"tpl:mb-2 tpl:flex tpl:items-center tpl:gap-1.5 tpl:text-[11px] tpl:font-semibold tpl:uppercase tpl:tracking-wide\"\n :class=\"group.tone\"\n >\n <component :is=\"group.icon\" :size=\"12\" :stroke-width=\"2\" />\n {{ group.title }}\n <span class=\"tpl:ml-auto tpl:font-normal tpl:opacity-70\">\n {{ group.items.length }}\n </span>\n </header>\n <ul\n v-if=\"group.items.length > 0\"\n class=\"tpl:m-0 tpl:mb-3 tpl:flex tpl:list-none tpl:flex-col tpl:gap-2 tpl:p-0\"\n >\n <li\n v-for=\"issue in group.items\"\n :key=\"`${issue.ruleId}-${issue.blockId ?? 'template'}`\"\n class=\"tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-3\"\n >\n <p class=\"tpl:m-0 tpl:mb-2 tpl:text-xs tpl:text-[var(--tpl-text)]\">\n {{ issue.message }}\n </p>\n <p\n class=\"tpl:m-0 tpl:mb-2 tpl:font-mono tpl:text-[10px] tpl:text-[var(--tpl-text-dim)]\"\n >\n {{ issue.ruleId }}\n </p>\n <div class=\"tpl:flex tpl:gap-1.5\">\n <button\n v-if=\"issue.blockId\"\n type=\"button\"\n class=\"tpl:flex tpl:items-center tpl:gap-1 tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-hover)] tpl:px-2 tpl:py-1 tpl:text-[11px] tpl:font-medium tpl:text-[var(--tpl-text)]\"\n @click=\"jumpTo(issue)\"\n >\n <ArrowRight :size=\"10\" :stroke-width=\"2\" />\n {{ t.issues.jump }}\n </button>\n <button\n v-if=\"issue.fix\"\n type=\"button\"\n class=\"tpl:flex tpl:items-center tpl:gap-1 tpl:rounded-md tpl:bg-[var(--tpl-primary)] tpl:px-2 tpl:py-1 tpl:text-[11px] tpl:font-medium tpl:text-white\"\n :title=\"issue.fix.description\"\n @click=\"applyFix(issue)\"\n >\n <Wrench :size=\"10\" :stroke-width=\"2\" />\n {{ t.issues.fix }}\n </button>\n </div>\n </li>\n </ul>\n </section>\n </template>\n </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, inject } from \"vue\";\nimport {\n ListChecks,\n AlertCircle,\n AlertTriangle,\n Info,\n ArrowRight,\n Wrench,\n} from \"@lucide/vue\";\nimport { useI18n } from \"../../composables/useI18n\";\nimport { TEMPLATE_LINT_KEY, EDITOR_KEY } from \"../../keys\";\nimport type { LintIssue } from \"../../composables/useTemplateLint\";\n\nconst { t, format } = useI18n();\nconst lint = inject(TEMPLATE_LINT_KEY, null);\nconst editor = inject(EDITOR_KEY, null);\n\nconst errors = computed(() =>\n (lint?.issues.value ?? []).filter((i) => i.severity === \"error\"),\n);\nconst warnings = computed(() =>\n (lint?.issues.value ?? []).filter((i) => i.severity === \"warning\"),\n);\nconst infos = computed(() =>\n (lint?.issues.value ?? []).filter((i) => i.severity === \"info\"),\n);\n\nconst totalCount = computed(\n () => errors.value.length + warnings.value.length + infos.value.length,\n);\n\nfunction jumpTo(issue: LintIssue): void {\n if (!editor) return;\n if (issue.blockId) editor.selectBlock(issue.blockId);\n}\n\nfunction applyFix(issue: LintIssue): void {\n lint?.applyFix(issue);\n}\n</script>\n\n<template>\n <div class=\"tpl:flex tpl:flex-col tpl:gap-4 tpl:p-4\">\n <header class=\"tpl:flex tpl:items-center tpl:gap-2\">\n <ListChecks :size=\"16\" :stroke-width=\"1.5\" />\n <h3\n class=\"tpl:m-0 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]\"\n >\n {{ t.issues.panelTitle }}\n </h3>\n <span\n v-if=\"totalCount > 0\"\n class=\"tpl:ml-auto tpl:rounded-full tpl:bg-[var(--tpl-bg-hover)] tpl:px-2 tpl:py-0.5 tpl:text-[11px] tpl:text-[var(--tpl-text-muted)]\"\n :title=\"format(t.issues.issueCountTooltip, { count: totalCount })\"\n >\n {{ totalCount }}\n </span>\n </header>\n\n <div\n v-if=\"!lint || lint.unavailable.value\"\n class=\"tpl:text-xs tpl:text-[var(--tpl-text-muted)]\"\n >\n <!-- Quality package not available; render nothing visible beyond a hint. -->\n </div>\n\n <div\n v-else-if=\"totalCount === 0\"\n class=\"tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-3 tpl:text-xs tpl:text-[var(--tpl-text-muted)]\"\n >\n {{ t.issues.emptyState }}\n </div>\n\n <template v-else>\n <section\n v-for=\"group in [\n {\n key: 'errors',\n title: t.issues.groupErrors,\n icon: AlertCircle,\n items: errors,\n tone: 'tpl:text-[var(--tpl-danger)]',\n },\n {\n key: 'warnings',\n title: t.issues.groupWarnings,\n icon: AlertTriangle,\n items: warnings,\n tone: 'tpl:text-[var(--tpl-warning)]',\n },\n {\n key: 'info',\n title: t.issues.groupInfo,\n icon: Info,\n items: infos,\n tone: 'tpl:text-[var(--tpl-text-muted)]',\n },\n ]\"\n :key=\"group.key\"\n >\n <header\n v-if=\"group.items.length > 0\"\n class=\"tpl:mb-2 tpl:flex tpl:items-center tpl:gap-1.5 tpl:text-[11px] tpl:font-semibold tpl:uppercase tpl:tracking-wide\"\n :class=\"group.tone\"\n >\n <component :is=\"group.icon\" :size=\"12\" :stroke-width=\"2\" />\n {{ group.title }}\n <span class=\"tpl:ml-auto tpl:font-normal tpl:opacity-70\">\n {{ group.items.length }}\n </span>\n </header>\n <ul\n v-if=\"group.items.length > 0\"\n class=\"tpl:m-0 tpl:mb-3 tpl:flex tpl:list-none tpl:flex-col tpl:gap-2 tpl:p-0\"\n >\n <li\n v-for=\"issue in group.items\"\n :key=\"`${issue.ruleId}-${issue.blockId ?? 'template'}`\"\n class=\"tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-3\"\n >\n <p class=\"tpl:m-0 tpl:mb-2 tpl:text-xs tpl:text-[var(--tpl-text)]\">\n {{ issue.message }}\n </p>\n <p\n class=\"tpl:m-0 tpl:mb-2 tpl:font-mono tpl:text-[10px] tpl:text-[var(--tpl-text-dim)]\"\n >\n {{ issue.ruleId }}\n </p>\n <div class=\"tpl:flex tpl:gap-1.5\">\n <button\n v-if=\"issue.blockId\"\n type=\"button\"\n class=\"tpl:flex tpl:items-center tpl:gap-1 tpl:rounded-md tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-hover)] tpl:px-2 tpl:py-1 tpl:text-[11px] tpl:font-medium tpl:text-[var(--tpl-text)]\"\n @click=\"jumpTo(issue)\"\n >\n <ArrowRight :size=\"10\" :stroke-width=\"2\" />\n {{ t.issues.jump }}\n </button>\n <button\n v-if=\"issue.fix\"\n type=\"button\"\n class=\"tpl:flex tpl:items-center tpl:gap-1 tpl:rounded-md tpl:bg-[var(--tpl-primary)] tpl:px-2 tpl:py-1 tpl:text-[11px] tpl:font-medium tpl:text-white\"\n :title=\"issue.fix.description\"\n @click=\"applyFix(issue)\"\n >\n <Wrench :size=\"10\" :stroke-width=\"2\" />\n {{ t.issues.fix }}\n </button>\n </div>\n </li>\n </ul>\n </section>\n </template>\n </div>\n</template>\n"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { H as e, L as t, M as n, P as r, V as ee, Z as i, a as te, b as a, ct as o, f as s, g as c, h as ne, it as l, l as u, m as d, o as re, p as f, st as ie, u as p, x as m, y as h, z as ae } from "./draggable-iAb7QVJo.js";
|
|
2
|
-
import {
|
|
3
|
-
import { A as _, y as pe } from "./icons-
|
|
4
|
-
import { t as v } from "./blockTypeIcons-
|
|
2
|
+
import { It as oe, O as se, Yt as ce, lt as le, nt as ue, on as g, ot as de, tn as fe } from "./features-mO5NzwnN.js";
|
|
3
|
+
import { A as _, y as pe } from "./icons-CuXm6XAT.js";
|
|
4
|
+
import { t as v } from "./blockTypeIcons-BJND4L-A.js";
|
|
5
5
|
//#region src/cloud/components/ModuleBrowserModal.vue?vue&type=script&setup=true&lang.ts
|
|
6
6
|
var me = {
|
|
7
7
|
role: "dialog",
|
|
@@ -40,7 +40,7 @@ var me = {
|
|
|
40
40
|
props: { visible: { type: Boolean } },
|
|
41
41
|
emits: ["close", "insert"],
|
|
42
42
|
setup(m, { emit: B }) {
|
|
43
|
-
let Te = m, V = B, Ee = a(() => import("./ModulePreviewCanvas-
|
|
43
|
+
let Te = m, V = B, Ee = a(() => import("./ModulePreviewCanvas-Cf6DUHml.js")), { t: De } = oe(), { t: H } = ue(), U = g(fe, "ModuleBrowserModal"), W = g(ce, "ModuleBrowserModal"), G = i(""), K = i(null), q = i(null), J = i("end"), Y = s(() => {
|
|
44
44
|
let e = U.modules.value;
|
|
45
45
|
if (!G.value) return e;
|
|
46
46
|
let t = G.value.toLowerCase();
|
|
@@ -102,7 +102,7 @@ var me = {
|
|
|
102
102
|
function Me(e) {
|
|
103
103
|
e.key === "Escape" && $(), e.key === "Enter" && X.value && (e.preventDefault(), Q());
|
|
104
104
|
}
|
|
105
|
-
return (i, a) => (n(), d(
|
|
105
|
+
return (i, a) => (n(), d(se, {
|
|
106
106
|
visible: m.visible,
|
|
107
107
|
onClose: $,
|
|
108
108
|
onKeydown: Me
|
|
@@ -112,7 +112,7 @@ var me = {
|
|
|
112
112
|
"aria-label": l(H).modules.close,
|
|
113
113
|
class: "tpl:cursor-pointer tpl:rounded-md tpl:border-none tpl:bg-transparent tpl:p-1 tpl:transition-colors tpl:duration-100 tpl:text-[var(--tpl-text-dim)]",
|
|
114
114
|
onClick: $
|
|
115
|
-
}, [h(l(
|
|
115
|
+
}, [h(l(de), {
|
|
116
116
|
size: 16,
|
|
117
117
|
"stroke-width": 2
|
|
118
118
|
})], 8, b)]),
|
|
@@ -155,7 +155,7 @@ var me = {
|
|
|
155
155
|
"aria-label": l(H).modules.delete,
|
|
156
156
|
title: l(H).modules.delete,
|
|
157
157
|
onClick: u((t) => q.value = e.id, ["stop"])
|
|
158
|
-
}, [h(l(
|
|
158
|
+
}, [h(l(le), {
|
|
159
159
|
size: 12,
|
|
160
160
|
"stroke-width": 1.5
|
|
161
161
|
})], 8, F))
|
|
@@ -192,4 +192,4 @@ var me = {
|
|
|
192
192
|
//#endregion
|
|
193
193
|
export { B as default };
|
|
194
194
|
|
|
195
|
-
//# sourceMappingURL=ModuleBrowserModal-
|
|
195
|
+
//# sourceMappingURL=ModuleBrowserModal-348wCgft.js.map
|