@templatical/editor 0.42.0 → 0.43.0

package/dist/cdn/chunks/DesignReferenceSidebar-C1-SbE_R.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DesignReferenceSidebar-C1-SbE_R.js","names":["_openBlock","_createBlock","_Transition","_withCtx","_createElementBlock","_unref","_createElementVNode","_createVNode","_toDisplayString","LoadingTrack","_normalizeStyle","_createTextVNode","_withDirectives","_normalizeClass","_vModelText","_createCommentVNode","_sfc_main","onBeforeUnmount","watch","withCtx","openBlock","ref","defineComponent","withDirectives","unref","createVNode","normalizeClass","computed","createElementBlock","createCommentVNode","normalizeStyle","createBlock","Transition","vModelText","createBaseVNode","toDisplayString","createTextVNode","requireInject","EDITOR_KEY","AUTH_MANAGER_KEY","FileImage","CircleAlert","FileText","ImageUp","X","Upload","LoadingTrack_default","_plugin_vue_export_helper_default","useCloudI18nStrict","primaryBtnClass","useDesignReference","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_9","_hoisted_10","_hoisted_11","_hoisted_12","_hoisted_13","_hoisted_14","_hoisted_15","_hoisted_16","_hoisted_17","_hoisted_18","_hoisted_19","_hoisted_20","_hoisted_21","_hoisted_22","_hoisted_23","_hoisted_24","_hoisted_25","_hoisted_26","_hoisted_27","DesignReferenceSidebar_default","__emit","props","__props","emit","cloudT","editor","authManager","designReference","content","fileInput","activeTab","selectedFile","prompt","filePreviewUrl","showConfirmation","isDragging","canGenerate","selectTab","tab","clearFile","handleFileSelect","input","event","file","setFile","handleDragOver","handleDragLeave","handleDrop","handleGenerate","cancelConfirmation","isVisible","_cache","$event"],"sources":["../../../src/cloud/components/DesignReferenceSidebar.vue","../../../src/cloud/components/DesignReferenceSidebar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { MAX_UPLOAD_SIZE_BYTES } from \"../../constants/timeouts\";\nimport { primaryBtnClass } from \"../../constants/styleConstants\";\nimport LoadingTrack from \"../../components/LoadingTrack.vue\";\nimport { useDesignReference } from \"@templatical/core/cloud\";\nimport { EDITOR_KEY, AUTH_MANAGER_KEY, requireInject } from \"../../keys\";\nimport { useCloudI18nStrict } from \"../../composables/useCloudI18n\";\nimport type { TemplateContent } from \"@templatical/types\";\nimport {\n  CircleAlert,\n  FileImage,\n  FileText,\n  ImageUp,\n  Upload,\n  X,\n} from \"@lucide/vue\";\nimport { computed, onBeforeUnmount, ref, watch } from \"vue\";\n\nconst props = defineProps<{\n  visible: boolean;\n  hasExistingBlocks: boolean;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"close\"): void;\n  (e: \"apply\", content: TemplateContent): void;\n}>();\n\nconst { t: cloudT } = useCloudI18nStrict();\nconst editor = requireInject(EDITOR_KEY, \"DesignReferenceSidebar\");\nconst authManager = requireInject(AUTH_MANAGER_KEY, \"DesignReferenceSidebar\");\n\nconst designReference = useDesignReference({\n  authManager,\n  getTemplateId: () => editor.state.template?.id ?? null,\n  onApply: (content) => emit(\"apply\", content),\n});\n\nconst fileInput = ref<HTMLInputElement | null>(null);\n\ntype SourceTab = \"image\" | \"pdf\";\n\nconst activeTab = ref<SourceTab>(\"image\");\nconst selectedFile = ref<File | null>(null);\nconst prompt = ref(\"\");\nconst filePreviewUrl = ref<string | null>(null);\nconst showConfirmation = ref(false);\nconst isDragging = ref(false);\n\nconst canGenerate = computed(() => {\n  if (designReference.isGenerating.value) {\n    return false;\n  }\n\n  return selectedFile.value !== null;\n});\n\nfunction selectTab(tab: SourceTab): void {\n  activeTab.value = tab;\n  clearFile();\n}\n\nfunction handleFileSelect(event: Event): void {\n  const input = event.target as HTMLInputElement;\n  const file = input.files?.[0];\n  if (file) {\n    setFile(file);\n  }\n  // Reset input so same file can be selected again\n  input.value = \"\";\n}\n\nfunction setFile(file: File): void {\n  // Validate file size (10MB)\n  if (file.size > MAX_UPLOAD_SIZE_BYTES) {\n    designReference.error.value = cloudT.designReference.fileTooLarge;\n    return;\n  }\n\n  // Validate file type\n  if (activeTab.value === \"image\") {\n    const validTypes = [\"image/png\", \"image/jpeg\", \"image/jpg\", \"image/webp\"];\n    if (!validTypes.includes(file.type)) {\n      designReference.error.value = cloudT.designReference.invalidFileType;\n      return;\n    }\n  } else if (activeTab.value === \"pdf\") {\n    if (file.type !== \"application/pdf\") {\n      designReference.error.value = cloudT.designReference.invalidFileType;\n      return;\n    }\n  }\n\n  selectedFile.value = file;\n  designReference.error.value = null;\n\n  // Create preview URL for images\n  if (filePreviewUrl.value) {\n    URL.revokeObjectURL(filePreviewUrl.value);\n  }\n  if (file.type.startsWith(\"image/\")) {\n    filePreviewUrl.value = URL.createObjectURL(file);\n  } else {\n    filePreviewUrl.value = null;\n  }\n}\n\nfunction clearFile(): void {\n  if (filePreviewUrl.value) {\n    URL.revokeObjectURL(filePreviewUrl.value);\n    filePreviewUrl.value = null;\n  }\n  selectedFile.value = null;\n}\n\nfunction handleDragOver(event: DragEvent): void {\n  event.preventDefault();\n  isDragging.value = true;\n}\n\nfunction handleDragLeave(): void {\n  isDragging.value = false;\n}\n\nfunction handleDrop(event: DragEvent): void {\n  event.preventDefault();\n  isDragging.value = false;\n\n  const file = event.dataTransfer?.files?.[0];\n  if (file) {\n    setFile(file);\n  }\n}\n\nfunction handleGenerate(): void {\n  if (!canGenerate.value) {\n    return;\n  }\n\n  // Show confirmation if there are existing blocks\n  if (props.hasExistingBlocks && !showConfirmation.value) {\n    showConfirmation.value = true;\n    return;\n  }\n\n  showConfirmation.value = false;\n\n  const input: {\n    prompt?: string;\n    imageUpload?: File;\n    pdfUpload?: File;\n  } = {};\n\n  if (prompt.value.trim()) {\n    input.prompt = prompt.value.trim();\n  }\n\n  if (activeTab.value === \"image\" && selectedFile.value) {\n    input.imageUpload = selectedFile.value;\n  } else if (activeTab.value === \"pdf\" && selectedFile.value) {\n    input.pdfUpload = selectedFile.value;\n  }\n\n  designReference.generate(input);\n}\n\nfunction cancelConfirmation(): void {\n  showConfirmation.value = false;\n}\n\n// Reset state when panel closes\nwatch(\n  () => props.visible,\n  (isVisible) => {\n    if (!isVisible) {\n      showConfirmation.value = false;\n    }\n  },\n);\n\nonBeforeUnmount(() => {\n  if (filePreviewUrl.value) {\n    URL.revokeObjectURL(filePreviewUrl.value);\n    filePreviewUrl.value = null;\n  }\n});\n</script>\n\n<template>\n  <Transition\n    enter-active-class=\"tpl-design-slide-enter-active\"\n    enter-from-class=\"tpl:translate-x-full\"\n    enter-to-class=\"tpl:translate-x-0\"\n    leave-active-class=\"tpl-design-slide-leave-active\"\n    leave-from-class=\"tpl:translate-x-0\"\n    leave-to-class=\"tpl:translate-x-full\"\n  >\n    <div\n      v-if=\"visible\"\n      role=\"complementary\"\n      :aria-label=\"cloudT.designReference.title\"\n      class=\"tpl-design-sidebar tpl:absolute tpl:top-14 tpl:right-0 tpl:bottom-0 tpl:flex tpl:w-[360px] tpl:flex-col tpl:border-l tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-elevated)]\"\n    >\n      <!-- Header -->\n      <div\n        class=\"tpl:flex tpl:items-center tpl:justify-between tpl:border-b tpl:border-[var(--tpl-border)] tpl:px-4 tpl:py-3\"\n      >\n        <div\n          class=\"tpl:flex tpl:items-center tpl:gap-1.5 tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-primary)]\"\n        >\n          <ImageUp :size=\"13\" :stroke-width=\"2\" />\n          <span>{{ cloudT.designReference.title }}</span>\n        </div>\n        <button\n          type=\"button\"\n          class=\"tpl:rounded-md tpl:p-0.5 tpl:transition-colors tpl:text-[var(--tpl-text-muted)]\"\n          :aria-label=\"cloudT.designReference.close\"\n          @click=\"emit('close')\"\n        >\n          <X :size=\"14\" :stroke-width=\"2\" />\n        </button>\n      </div>\n\n      <!-- Content -->\n      <div class=\"tpl:flex-1 tpl:overflow-y-auto tpl:p-4\">\n        <!-- Loading state -->\n        <div\n          v-if=\"designReference.isGenerating.value\"\n          class=\"tpl:flex tpl:h-full tpl:flex-col tpl:items-center tpl:justify-center tpl:gap-3 tpl:text-center\"\n        >\n          <div\n            class=\"tpl:flex tpl:w-full tpl:flex-col tpl:items-center tpl:gap-3\"\n          >\n            <LoadingTrack />\n            <p class=\"tpl:text-sm tpl:text-[var(--tpl-text-muted)]\">\n              {{ cloudT.designReference.generating }}\n            </p>\n          </div>\n        </div>\n\n        <!-- Input form -->\n        <div v-else class=\"tpl:flex tpl:flex-col tpl:gap-4\">\n          <!-- Source tabs -->\n          <div\n            class=\"tpl:flex tpl:gap-1 tpl:rounded-[var(--tpl-radius-sm)] tpl:p-1 tpl:bg-[var(--tpl-bg-hover)]\"\n          >\n            <button\n              class=\"tpl:flex tpl:flex-1 tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded-[var(--tpl-radius-sm)] tpl:px-2 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all\"\n              :style=\"{\n                backgroundColor:\n                  activeTab === 'image' ? 'var(--tpl-bg)' : 'transparent',\n                color:\n                  activeTab === 'image'\n                    ? 'var(--tpl-primary)'\n                    : 'var(--tpl-text-muted)',\n                boxShadow: activeTab === 'image' ? 'var(--tpl-shadow)' : 'none',\n              }\"\n              @click=\"selectTab('image')\"\n            >\n              <FileImage :size=\"12\" :stroke-width=\"2\" />\n              {{ cloudT.designReference.uploadImage }}\n            </button>\n            <button\n              class=\"tpl:flex tpl:flex-1 tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded-[var(--tpl-radius-sm)] tpl:px-2 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all\"\n              :style=\"{\n                backgroundColor:\n                  activeTab === 'pdf' ? 'var(--tpl-bg)' : 'transparent',\n                color:\n                  activeTab === 'pdf'\n                    ? 'var(--tpl-primary)'\n                    : 'var(--tpl-text-muted)',\n                boxShadow: activeTab === 'pdf' ? 'var(--tpl-shadow)' : 'none',\n              }\"\n              @click=\"selectTab('pdf')\"\n            >\n              <FileText :size=\"12\" :stroke-width=\"2\" />\n              {{ cloudT.designReference.uploadPdf }}\n            </button>\n          </div>\n\n          <!-- File upload area (image or pdf) -->\n          <div>\n            <!-- Preview -->\n            <div v-if=\"selectedFile\" class=\"tpl:flex tpl:flex-col tpl:gap-2\">\n              <div\n                class=\"tpl:relative tpl:overflow-hidden tpl:rounded-[var(--tpl-radius)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)]\"\n              >\n                <!-- Image preview -->\n                <img\n                  v-if=\"filePreviewUrl\"\n                  :src=\"filePreviewUrl\"\n                  :alt=\"selectedFile.name\"\n                  class=\"tpl:h-auto tpl:max-h-48 tpl:w-full tpl:object-contain\"\n                />\n                <!-- PDF preview (icon-based) -->\n                <div\n                  v-else\n                  class=\"tpl:flex tpl:h-32 tpl:flex-col tpl:items-center tpl:justify-center tpl:gap-2\"\n                >\n                  <FileText\n                    :size=\"32\"\n                    :stroke-width=\"1.5\"\n                    class=\"tpl:text-[var(--tpl-text-dim)]\"\n                  />\n                  <span class=\"tpl:text-xs tpl:text-[var(--tpl-text-muted)]\">\n                    {{ selectedFile.name }}\n                  </span>\n                </div>\n                <!-- Remove button -->\n                <button\n                  class=\"tpl:absolute tpl:top-2 tpl:right-2 tpl:rounded-full tpl:p-1 tpl:transition-colors tpl:bg-[var(--tpl-bg)] tpl:text-[var(--tpl-text-muted)] tpl:shadow-[var(--tpl-shadow)]\"\n                  @click=\"clearFile\"\n                >\n                  <X :size=\"12\" :stroke-width=\"2\" />\n                </button>\n              </div>\n            </div>\n\n            <!-- Drop zone -->\n            <div\n              v-else\n              class=\"tpl-design-dropzone tpl:flex tpl:cursor-pointer tpl:flex-col tpl:items-center tpl:justify-center tpl:gap-2 tpl:rounded-[var(--tpl-radius)] tpl:border-2 tpl:border-dashed tpl:px-4 tpl:py-8 tpl:transition-colors\"\n              :style=\"{\n                borderColor: isDragging\n                  ? 'var(--tpl-primary)'\n                  : 'var(--tpl-border-light)',\n                backgroundColor: isDragging\n                  ? 'var(--tpl-primary-light)'\n                  : 'var(--tpl-bg)',\n              }\"\n              @click=\"fileInput?.click()\"\n              @dragover=\"handleDragOver\"\n              @dragleave=\"handleDragLeave\"\n              @drop=\"handleDrop\"\n            >\n              <Upload\n                :size=\"24\"\n                :stroke-width=\"1.5\"\n                class=\"tpl:text-[var(--tpl-text-dim)]\"\n              />\n              <span\n                class=\"tpl:text-center tpl:text-xs tpl:text-[var(--tpl-text-muted)]\"\n              >\n                {{ cloudT.designReference.dropHint }}\n              </span>\n              <span\n                class=\"tpl:text-center tpl:text-[10px] tpl:text-[var(--tpl-text-dim)]\"\n              >\n                {{\n                  activeTab === \"image\"\n                    ? cloudT.designReference.acceptedImages\n                    : cloudT.designReference.acceptedPdf\n                }}\n              </span>\n            </div>\n            <input\n              ref=\"fileInput\"\n              type=\"file\"\n              class=\"tpl:hidden\"\n              :accept=\"\n                activeTab === 'image'\n                  ? 'image/png,image/jpeg,image/webp'\n                  : 'application/pdf'\n              \"\n              @change=\"handleFileSelect\"\n            />\n          </div>\n\n          <!-- Prompt textarea -->\n          <div class=\"tpl:flex tpl:flex-col tpl:gap-1.5\">\n            <label\n              class=\"tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text-muted)]\"\n            >\n              {{ cloudT.designReference.promptLabel }}\n            </label>\n            <textarea\n              v-model=\"prompt\"\n              class=\"tpl:min-h-[72px] tpl:w-full tpl:resize-none tpl:rounded-[var(--tpl-radius-sm)] tpl:border tpl:px-3 tpl:py-2 tpl:font-sans tpl:text-sm tpl:outline-none tpl:transition-colors tpl:border-[var(--tpl-border)] tpl:text-[var(--tpl-text)] tpl:bg-[var(--tpl-bg)] tpl:focus:border-[var(--tpl-primary)] tpl:focus:shadow-[var(--tpl-ring)]\"\n              :class=\"['tpl-design-prompt-input']\"\n              :placeholder=\"cloudT.designReference.promptPlaceholder\"\n              rows=\"3\"\n            />\n          </div>\n\n          <!-- Confirmation overlay -->\n          <div\n            v-if=\"showConfirmation\"\n            class=\"tpl:flex tpl:flex-col tpl:gap-2 tpl:rounded-[var(--tpl-radius)] tpl:px-3 tpl:py-3 tpl:bg-[var(--tpl-warning-light)] tpl:border tpl:border-[var(--tpl-warning)]\"\n          >\n            <p class=\"tpl:text-xs tpl:leading-snug tpl:text-[var(--tpl-text)]\">\n              {{ cloudT.designReference.replaceWarning }}\n            </p>\n            <div class=\"tpl:flex tpl:gap-2\">\n              <button\n                class=\"tpl:flex-1 tpl:rounded-[var(--tpl-radius-sm)] tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:text-[var(--tpl-text-muted)] tpl:border tpl:border-[var(--tpl-border)]\"\n                style=\"background-color: transparent\"\n                @click=\"cancelConfirmation\"\n              >\n                {{ cloudT.designReference.replaceCancel }}\n              </button>\n              <button\n                type=\"button\"\n                :class=\"[primaryBtnClass, 'tpl:flex-1']\"\n                @click=\"handleGenerate\"\n              >\n                {{ cloudT.designReference.replaceConfirm }}\n              </button>\n            </div>\n          </div>\n\n          <!-- Error message -->\n          <div\n            v-if=\"designReference.error.value\"\n            class=\"tpl:flex tpl:items-start tpl:gap-2 tpl:rounded-lg tpl:px-3 tpl:py-2 tpl:text-xs tpl:bg-[var(--tpl-danger-light)] tpl:text-[var(--tpl-danger)]\"\n          >\n            <CircleAlert\n              :size=\"14\"\n              :stroke-width=\"2\"\n              class=\"tpl:mt-0.5 tpl:shrink-0\"\n            />\n            <span>{{ cloudT.designReference.error }}</span>\n          </div>\n\n          <!-- Generate button -->\n          <button\n            v-if=\"!showConfirmation\"\n            type=\"button\"\n            :class=\"[primaryBtnClass, 'tpl:w-full']\"\n            :disabled=\"!canGenerate\"\n            @click=\"handleGenerate\"\n          >\n            <ImageUp :size=\"16\" :stroke-width=\"2\" />\n            {{ cloudT.designReference.generate }}\n          </button>\n\n          <!-- AI disclaimer -->\n          <p\n            class=\"tpl:m-0 tpl:pt-1 tpl:text-center tpl:text-[10px] tpl:text-[var(--tpl-text-dim)]\"\n          >\n            {{ cloudT.aiMenu.disclaimer }}\n          </p>\n        </div>\n      </div>\n    </div>\n  </Transition>\n</template>\n\n<style scoped>\n.tpl-design-slide-enter-active {\n  transition: transform 280ms cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.tpl-design-slide-leave-active {\n  transition: transform 200ms cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.tpl-design-prompt-input:focus {\n  border-color: var(--tpl-primary);\n  box-shadow: var(--tpl-ring);\n}\n\n.tpl-design-dropzone:hover {\n  border-color: var(--tpl-primary) !important;\n  background-color: var(--tpl-primary-light) !important;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { MAX_UPLOAD_SIZE_BYTES } from \"../../constants/timeouts\";\nimport { primaryBtnClass } from \"../../constants/styleConstants\";\nimport LoadingTrack from \"../../components/LoadingTrack.vue\";\nimport { useDesignReference } from \"@templatical/core/cloud\";\nimport { EDITOR_KEY, AUTH_MANAGER_KEY, requireInject } from \"../../keys\";\nimport { useCloudI18nStrict } from \"../../composables/useCloudI18n\";\nimport type { TemplateContent } from \"@templatical/types\";\nimport {\n  CircleAlert,\n  FileImage,\n  FileText,\n  ImageUp,\n  Upload,\n  X,\n} from \"@lucide/vue\";\nimport { computed, onBeforeUnmount, ref, watch } from \"vue\";\n\nconst props = defineProps<{\n  visible: boolean;\n  hasExistingBlocks: boolean;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"close\"): void;\n  (e: \"apply\", content: TemplateContent): void;\n}>();\n\nconst { t: cloudT } = useCloudI18nStrict();\nconst editor = requireInject(EDITOR_KEY, \"DesignReferenceSidebar\");\nconst authManager = requireInject(AUTH_MANAGER_KEY, \"DesignReferenceSidebar\");\n\nconst designReference = useDesignReference({\n  authManager,\n  getTemplateId: () => editor.state.template?.id ?? null,\n  onApply: (content) => emit(\"apply\", content),\n});\n\nconst fileInput = ref<HTMLInputElement | null>(null);\n\ntype SourceTab = \"image\" | \"pdf\";\n\nconst activeTab = ref<SourceTab>(\"image\");\nconst selectedFile = ref<File | null>(null);\nconst prompt = ref(\"\");\nconst filePreviewUrl = ref<string | null>(null);\nconst showConfirmation = ref(false);\nconst isDragging = ref(false);\n\nconst canGenerate = computed(() => {\n  if (designReference.isGenerating.value) {\n    return false;\n  }\n\n  return selectedFile.value !== null;\n});\n\nfunction selectTab(tab: SourceTab): void {\n  activeTab.value = tab;\n  clearFile();\n}\n\nfunction handleFileSelect(event: Event): void {\n  const input = event.target as HTMLInputElement;\n  const file = input.files?.[0];\n  if (file) {\n    setFile(file);\n  }\n  // Reset input so same file can be selected again\n  input.value = \"\";\n}\n\nfunction setFile(file: File): void {\n  // Validate file size (10MB)\n  if (file.size > MAX_UPLOAD_SIZE_BYTES) {\n    designReference.error.value = cloudT.designReference.fileTooLarge;\n    return;\n  }\n\n  // Validate file type\n  if (activeTab.value === \"image\") {\n    const validTypes = [\"image/png\", \"image/jpeg\", \"image/jpg\", \"image/webp\"];\n    if (!validTypes.includes(file.type)) {\n      designReference.error.value = cloudT.designReference.invalidFileType;\n      return;\n    }\n  } else if (activeTab.value === \"pdf\") {\n    if (file.type !== \"application/pdf\") {\n      designReference.error.value = cloudT.designReference.invalidFileType;\n      return;\n    }\n  }\n\n  selectedFile.value = file;\n  designReference.error.value = null;\n\n  // Create preview URL for images\n  if (filePreviewUrl.value) {\n    URL.revokeObjectURL(filePreviewUrl.value);\n  }\n  if (file.type.startsWith(\"image/\")) {\n    filePreviewUrl.value = URL.createObjectURL(file);\n  } else {\n    filePreviewUrl.value = null;\n  }\n}\n\nfunction clearFile(): void {\n  if (filePreviewUrl.value) {\n    URL.revokeObjectURL(filePreviewUrl.value);\n    filePreviewUrl.value = null;\n  }\n  selectedFile.value = null;\n}\n\nfunction handleDragOver(event: DragEvent): void {\n  event.preventDefault();\n  isDragging.value = true;\n}\n\nfunction handleDragLeave(): void {\n  isDragging.value = false;\n}\n\nfunction handleDrop(event: DragEvent): void {\n  event.preventDefault();\n  isDragging.value = false;\n\n  const file = event.dataTransfer?.files?.[0];\n  if (file) {\n    setFile(file);\n  }\n}\n\nfunction handleGenerate(): void {\n  if (!canGenerate.value) {\n    return;\n  }\n\n  // Show confirmation if there are existing blocks\n  if (props.hasExistingBlocks && !showConfirmation.value) {\n    showConfirmation.value = true;\n    return;\n  }\n\n  showConfirmation.value = false;\n\n  const input: {\n    prompt?: string;\n    imageUpload?: File;\n    pdfUpload?: File;\n  } = {};\n\n  if (prompt.value.trim()) {\n    input.prompt = prompt.value.trim();\n  }\n\n  if (activeTab.value === \"image\" && selectedFile.value) {\n    input.imageUpload = selectedFile.value;\n  } else if (activeTab.value === \"pdf\" && selectedFile.value) {\n    input.pdfUpload = selectedFile.value;\n  }\n\n  designReference.generate(input);\n}\n\nfunction cancelConfirmation(): void {\n  showConfirmation.value = false;\n}\n\n// Reset state when panel closes\nwatch(\n  () => props.visible,\n  (isVisible) => {\n    if (!isVisible) {\n      showConfirmation.value = false;\n    }\n  },\n);\n\nonBeforeUnmount(() => {\n  if (filePreviewUrl.value) {\n    URL.revokeObjectURL(filePreviewUrl.value);\n    filePreviewUrl.value = null;\n  }\n});\n</script>\n\n<template>\n  <Transition\n    enter-active-class=\"tpl-design-slide-enter-active\"\n    enter-from-class=\"tpl:translate-x-full\"\n    enter-to-class=\"tpl:translate-x-0\"\n    leave-active-class=\"tpl-design-slide-leave-active\"\n    leave-from-class=\"tpl:translate-x-0\"\n    leave-to-class=\"tpl:translate-x-full\"\n  >\n    <div\n      v-if=\"visible\"\n      role=\"complementary\"\n      :aria-label=\"cloudT.designReference.title\"\n      class=\"tpl-design-sidebar tpl:absolute tpl:top-14 tpl:right-0 tpl:bottom-0 tpl:flex tpl:w-[360px] tpl:flex-col tpl:border-l tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-elevated)]\"\n    >\n      <!-- Header -->\n      <div\n        class=\"tpl:flex tpl:items-center tpl:justify-between tpl:border-b tpl:border-[var(--tpl-border)] tpl:px-4 tpl:py-3\"\n      >\n        <div\n          class=\"tpl:flex tpl:items-center tpl:gap-1.5 tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-primary)]\"\n        >\n          <ImageUp :size=\"13\" :stroke-width=\"2\" />\n          <span>{{ cloudT.designReference.title }}</span>\n        </div>\n        <button\n          type=\"button\"\n          class=\"tpl:rounded-md tpl:p-0.5 tpl:transition-colors tpl:text-[var(--tpl-text-muted)]\"\n          :aria-label=\"cloudT.designReference.close\"\n          @click=\"emit('close')\"\n        >\n          <X :size=\"14\" :stroke-width=\"2\" />\n        </button>\n      </div>\n\n      <!-- Content -->\n      <div class=\"tpl:flex-1 tpl:overflow-y-auto tpl:p-4\">\n        <!-- Loading state -->\n        <div\n          v-if=\"designReference.isGenerating.value\"\n          class=\"tpl:flex tpl:h-full tpl:flex-col tpl:items-center tpl:justify-center tpl:gap-3 tpl:text-center\"\n        >\n          <div\n            class=\"tpl:flex tpl:w-full tpl:flex-col tpl:items-center tpl:gap-3\"\n          >\n            <LoadingTrack />\n            <p class=\"tpl:text-sm tpl:text-[var(--tpl-text-muted)]\">\n              {{ cloudT.designReference.generating }}\n            </p>\n          </div>\n        </div>\n\n        <!-- Input form -->\n        <div v-else class=\"tpl:flex tpl:flex-col tpl:gap-4\">\n          <!-- Source tabs -->\n          <div\n            class=\"tpl:flex tpl:gap-1 tpl:rounded-[var(--tpl-radius-sm)] tpl:p-1 tpl:bg-[var(--tpl-bg-hover)]\"\n          >\n            <button\n              class=\"tpl:flex tpl:flex-1 tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded-[var(--tpl-radius-sm)] tpl:px-2 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all\"\n              :style=\"{\n                backgroundColor:\n                  activeTab === 'image' ? 'var(--tpl-bg)' : 'transparent',\n                color:\n                  activeTab === 'image'\n                    ? 'var(--tpl-primary)'\n                    : 'var(--tpl-text-muted)',\n                boxShadow: activeTab === 'image' ? 'var(--tpl-shadow)' : 'none',\n              }\"\n              @click=\"selectTab('image')\"\n            >\n              <FileImage :size=\"12\" :stroke-width=\"2\" />\n              {{ cloudT.designReference.uploadImage }}\n            </button>\n            <button\n              class=\"tpl:flex tpl:flex-1 tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded-[var(--tpl-radius-sm)] tpl:px-2 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all\"\n              :style=\"{\n                backgroundColor:\n                  activeTab === 'pdf' ? 'var(--tpl-bg)' : 'transparent',\n                color:\n                  activeTab === 'pdf'\n                    ? 'var(--tpl-primary)'\n                    : 'var(--tpl-text-muted)',\n                boxShadow: activeTab === 'pdf' ? 'var(--tpl-shadow)' : 'none',\n              }\"\n              @click=\"selectTab('pdf')\"\n            >\n              <FileText :size=\"12\" :stroke-width=\"2\" />\n              {{ cloudT.designReference.uploadPdf }}\n            </button>\n          </div>\n\n          <!-- File upload area (image or pdf) -->\n          <div>\n            <!-- Preview -->\n            <div v-if=\"selectedFile\" class=\"tpl:flex tpl:flex-col tpl:gap-2\">\n              <div\n                class=\"tpl:relative tpl:overflow-hidden tpl:rounded-[var(--tpl-radius)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)]\"\n              >\n                <!-- Image preview -->\n                <img\n                  v-if=\"filePreviewUrl\"\n                  :src=\"filePreviewUrl\"\n                  :alt=\"selectedFile.name\"\n                  class=\"tpl:h-auto tpl:max-h-48 tpl:w-full tpl:object-contain\"\n                />\n                <!-- PDF preview (icon-based) -->\n                <div\n                  v-else\n                  class=\"tpl:flex tpl:h-32 tpl:flex-col tpl:items-center tpl:justify-center tpl:gap-2\"\n                >\n                  <FileText\n                    :size=\"32\"\n                    :stroke-width=\"1.5\"\n                    class=\"tpl:text-[var(--tpl-text-dim)]\"\n                  />\n                  <span class=\"tpl:text-xs tpl:text-[var(--tpl-text-muted)]\">\n                    {{ selectedFile.name }}\n                  </span>\n                </div>\n                <!-- Remove button -->\n                <button\n                  class=\"tpl:absolute tpl:top-2 tpl:right-2 tpl:rounded-full tpl:p-1 tpl:transition-colors tpl:bg-[var(--tpl-bg)] tpl:text-[var(--tpl-text-muted)] tpl:shadow-[var(--tpl-shadow)]\"\n                  @click=\"clearFile\"\n                >\n                  <X :size=\"12\" :stroke-width=\"2\" />\n                </button>\n              </div>\n            </div>\n\n            <!-- Drop zone -->\n            <div\n              v-else\n              class=\"tpl-design-dropzone tpl:flex tpl:cursor-pointer tpl:flex-col tpl:items-center tpl:justify-center tpl:gap-2 tpl:rounded-[var(--tpl-radius)] tpl:border-2 tpl:border-dashed tpl:px-4 tpl:py-8 tpl:transition-colors\"\n              :style=\"{\n                borderColor: isDragging\n                  ? 'var(--tpl-primary)'\n                  : 'var(--tpl-border-light)',\n                backgroundColor: isDragging\n                  ? 'var(--tpl-primary-light)'\n                  : 'var(--tpl-bg)',\n              }\"\n              @click=\"fileInput?.click()\"\n              @dragover=\"handleDragOver\"\n              @dragleave=\"handleDragLeave\"\n              @drop=\"handleDrop\"\n            >\n              <Upload\n                :size=\"24\"\n                :stroke-width=\"1.5\"\n                class=\"tpl:text-[var(--tpl-text-dim)]\"\n              />\n              <span\n                class=\"tpl:text-center tpl:text-xs tpl:text-[var(--tpl-text-muted)]\"\n              >\n                {{ cloudT.designReference.dropHint }}\n              </span>\n              <span\n                class=\"tpl:text-center tpl:text-[10px] tpl:text-[var(--tpl-text-dim)]\"\n              >\n                {{\n                  activeTab === \"image\"\n                    ? cloudT.designReference.acceptedImages\n                    : cloudT.designReference.acceptedPdf\n                }}\n              </span>\n            </div>\n            <input\n              ref=\"fileInput\"\n              type=\"file\"\n              class=\"tpl:hidden\"\n              :accept=\"\n                activeTab === 'image'\n                  ? 'image/png,image/jpeg,image/webp'\n                  : 'application/pdf'\n              \"\n              @change=\"handleFileSelect\"\n            />\n          </div>\n\n          <!-- Prompt textarea -->\n          <div class=\"tpl:flex tpl:flex-col tpl:gap-1.5\">\n            <label\n              class=\"tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text-muted)]\"\n            >\n              {{ cloudT.designReference.promptLabel }}\n            </label>\n            <textarea\n              v-model=\"prompt\"\n              class=\"tpl:min-h-[72px] tpl:w-full tpl:resize-none tpl:rounded-[var(--tpl-radius-sm)] tpl:border tpl:px-3 tpl:py-2 tpl:font-sans tpl:text-sm tpl:outline-none tpl:transition-colors tpl:border-[var(--tpl-border)] tpl:text-[var(--tpl-text)] tpl:bg-[var(--tpl-bg)] tpl:focus:border-[var(--tpl-primary)] tpl:focus:shadow-[var(--tpl-ring)]\"\n              :class=\"['tpl-design-prompt-input']\"\n              :placeholder=\"cloudT.designReference.promptPlaceholder\"\n              rows=\"3\"\n            />\n          </div>\n\n          <!-- Confirmation overlay -->\n          <div\n            v-if=\"showConfirmation\"\n            class=\"tpl:flex tpl:flex-col tpl:gap-2 tpl:rounded-[var(--tpl-radius)] tpl:px-3 tpl:py-3 tpl:bg-[var(--tpl-warning-light)] tpl:border tpl:border-[var(--tpl-warning)]\"\n          >\n            <p class=\"tpl:text-xs tpl:leading-snug tpl:text-[var(--tpl-text)]\">\n              {{ cloudT.designReference.replaceWarning }}\n            </p>\n            <div class=\"tpl:flex tpl:gap-2\">\n              <button\n                class=\"tpl:flex-1 tpl:rounded-[var(--tpl-radius-sm)] tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:text-[var(--tpl-text-muted)] tpl:border tpl:border-[var(--tpl-border)]\"\n                style=\"background-color: transparent\"\n                @click=\"cancelConfirmation\"\n              >\n                {{ cloudT.designReference.replaceCancel }}\n              </button>\n              <button\n                type=\"button\"\n                :class=\"[primaryBtnClass, 'tpl:flex-1']\"\n                @click=\"handleGenerate\"\n              >\n                {{ cloudT.designReference.replaceConfirm }}\n              </button>\n            </div>\n          </div>\n\n          <!-- Error message -->\n          <div\n            v-if=\"designReference.error.value\"\n            class=\"tpl:flex tpl:items-start tpl:gap-2 tpl:rounded-lg tpl:px-3 tpl:py-2 tpl:text-xs tpl:bg-[var(--tpl-danger-light)] tpl:text-[var(--tpl-danger)]\"\n          >\n            <CircleAlert\n              :size=\"14\"\n              :stroke-width=\"2\"\n              class=\"tpl:mt-0.5 tpl:shrink-0\"\n            />\n            <span>{{ cloudT.designReference.error }}</span>\n          </div>\n\n          <!-- Generate button -->\n          <button\n            v-if=\"!showConfirmation\"\n            type=\"button\"\n            :class=\"[primaryBtnClass, 'tpl:w-full']\"\n            :disabled=\"!canGenerate\"\n            @click=\"handleGenerate\"\n          >\n            <ImageUp :size=\"16\" :stroke-width=\"2\" />\n            {{ cloudT.designReference.generate }}\n          </button>\n\n          <!-- AI disclaimer -->\n          <p\n            class=\"tpl:m-0 tpl:pt-1 tpl:text-center tpl:text-[10px] tpl:text-[var(--tpl-text-dim)]\"\n          >\n            {{ cloudT.aiMenu.disclaimer }}\n          </p>\n        </div>\n      </div>\n    </div>\n  </Transition>\n</template>\n\n<style scoped>\n.tpl-design-slide-enter-active {\n  transition: transform 280ms cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.tpl-design-slide-leave-active {\n  transition: transform 200ms cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.tpl-design-prompt-input:focus {\n  border-color: var(--tpl-primary);\n  box-shadow: var(--tpl-ring);\n}\n\n.tpl-design-dropzone:hover {\n  border-color: var(--tpl-primary) !important;\n  background-color: var(--tpl-primary-light) !important;\n}\n</style>\n"],"mappings":"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"}

package/dist/cdn/chunks/{IssuesPanel-L9Gq_T8n.js → IssuesPanel-qKY6UDd-.js}

@@ -1,7 +1,7 @@
 import { E as e, F as t, N as n, R as r, S as i, at as a, b as o, ct as s, f as c, g as l, h as u, m as d, p as f, u as p, ut as m, y as h } from "./draggable-IB4x6w2O.js";
 import { K as g, g as _ } from "./keys-DCWeHkSF.js";
 import { t as v } from "./useI18n-CyO_Nmca.js";
-import { Nt as y, Ut as b, ct as x, d as S, ft as C, r as w } from "./icons-Bad3WZ3G.js";
+import { Nt as y, Ut as b, ct as x, d as S, ft as C, r as w } from "./icons-CQnjugjy.js";
 import { t as T } from "./useScrollToBlock-DgHZJvID.js";
 //#region src/components/sidebar/IssuesPanel.vue?vue&type=script&setup=true&lang.ts
 var E = { class: "tpl:flex tpl:flex-col tpl:gap-4 tpl:p-4" }, D = { class: "tpl:flex tpl:items-center tpl:gap-2" }, O = { class: "tpl:m-0 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]" }, k = ["title"], A = {
@@ -97,4 +97,4 @@ var E = { class: "tpl:flex tpl:flex-col tpl:gap-4 tpl:p-4" }, D = { class: "tpl:
 //#endregion
 export { z as default };
 
-//# sourceMappingURL=IssuesPanel-L9Gq_T8n.js.map
+//# sourceMappingURL=IssuesPanel-qKY6UDd-.js.map

package/dist/cdn/chunks/IssuesPanel-qKY6UDd-.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IssuesPanel-qKY6UDd-.js","names":["_openBlock","_createElementBlock","_createElementVNode","_createVNode","_unref","_toDisplayString","_createCommentVNode","_Fragment","_renderList","AlertCircle","AlertTriangle","_normalizeClass","_createBlock","_resolveDynamicComponent","_createTextVNode","_sfc_main","inject","renderList","openBlock","resolveDynamicComponent","defineComponent","unref","createVNode","normalizeClass","computed","createElementBlock","createCommentVNode","createBlock","createBaseVNode","Fragment","toDisplayString","createTextVNode","TEMPLATE_LINT_KEY","EDITOR_KEY","useI18n","CircleAlert","ArrowRight","ListChecks","TriangleAlert","Info","Wrench","useScrollToBlock","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_9","_hoisted_10","_hoisted_11","_hoisted_12","_hoisted_13","IssuesPanel_default","lint","editor","scrollToBlock","errors","i","warnings","infos","totalCount","jumpTo","issue","applyFix","t","format","group"],"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 { useScrollToBlock } from \"../../composables/useScrollToBlock\";\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);\nconst scrollToBlock = useScrollToBlock();\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) return;\n  editor.selectBlock(issue.blockId);\n  // Selecting is invisible on its own — on a long template the block sits\n  // below the fold and the canvas stays put, so \"Jump\" appears to do nothing.\n  scrollToBlock(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-[10px] 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-xs 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                data-testid=\"issue-jump\"\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-xs 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-xs tpl:font-medium tpl:text-[var(--tpl-on-primary)]\"\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 { useScrollToBlock } from \"../../composables/useScrollToBlock\";\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);\nconst scrollToBlock = useScrollToBlock();\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) return;\n  editor.selectBlock(issue.blockId);\n  // Selecting is invisible on its own — on a long template the block sits\n  // below the fold and the canvas stays put, so \"Jump\" appears to do nothing.\n  scrollToBlock(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-[10px] 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-xs 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                data-testid=\"issue-jump\"\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-xs 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-xs tpl:font-medium tpl:text-[var(--tpl-on-primary)]\"\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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"}

package/dist/cdn/chunks/LoadingTrack-_7DH_5aw.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingTrack-_7DH_5aw.js","names":[],"sources":["../../../src/components/LoadingTrack.vue"],"sourcesContent":["<template>\n  <div class=\"tpl-loading-track\"></div>\n</template>\n\n<style scoped>\n.tpl-loading-track {\n  height: 3px;\n  width: 100%;\n  border-radius: 9999px;\n  background: linear-gradient(\n    90deg,\n    transparent 0%,\n    color-mix(in srgb, var(--tpl-primary) 10%, transparent) 15%,\n    color-mix(in srgb, var(--tpl-primary) 30%, transparent) 30%,\n    var(--tpl-primary) 50%,\n    color-mix(in srgb, var(--tpl-primary) 30%, transparent) 70%,\n    color-mix(in srgb, var(--tpl-primary) 10%, transparent) 85%,\n    transparent 100%\n  );\n  background-size: 200% 100%;\n  animation: tpl-loading-flow 3s ease-in-out infinite;\n}\n\n@keyframes tpl-loading-flow {\n  0% {\n    background-position: 100% 0;\n  }\n  100% {\n    background-position: -100% 0;\n  }\n}\n/* The bar communicates \"working\" by its presence and its amber fill; the sweep\n   is decoration, so reduced motion holds it still rather than removing it. */\n@media (prefers-reduced-motion: reduce) {\n  .tpl-loading-track {\n    animation: none;\n    background-position: 50% 0;\n  }\n}\n</style>\n"],"mappings":";;;YACO,IAAA,EAAA,OAAM,oBAAmB;;CAA9B,OAAA,EAAA,GAAA,EAAqC,OAArC,CAAqC"}
+{"version":3,"file":"LoadingTrack-_7DH_5aw.js","names":["_openBlock","_createElementBlock","openBlock","createElementBlock","_plugin_vue_export_helper_default","_sfc_main","_hoisted_1","_sfc_render","LoadingTrack_default"],"sources":["../../../src/components/LoadingTrack.vue"],"sourcesContent":["<template>\n  <div class=\"tpl-loading-track\"></div>\n</template>\n\n<style scoped>\n.tpl-loading-track {\n  height: 3px;\n  width: 100%;\n  border-radius: 9999px;\n  background: linear-gradient(\n    90deg,\n    transparent 0%,\n    color-mix(in srgb, var(--tpl-primary) 10%, transparent) 15%,\n    color-mix(in srgb, var(--tpl-primary) 30%, transparent) 30%,\n    var(--tpl-primary) 50%,\n    color-mix(in srgb, var(--tpl-primary) 30%, transparent) 70%,\n    color-mix(in srgb, var(--tpl-primary) 10%, transparent) 85%,\n    transparent 100%\n  );\n  background-size: 200% 100%;\n  animation: tpl-loading-flow 3s ease-in-out infinite;\n}\n\n@keyframes tpl-loading-flow {\n  0% {\n    background-position: 100% 0;\n  }\n  100% {\n    background-position: -100% 0;\n  }\n}\n/* The bar communicates \"working\" by its presence and its amber fill; the sweep\n   is decoration, so reduced motion holds it still rather than removing it. */\n@media (prefers-reduced-motion: reduce) {\n  .tpl-loading-track {\n    animation: none;\n    background-position: 50% 0;\n  }\n}\n</style>\n"],"mappings":";;;YACOM,IAAA,EAAA,OAAM,oBAAmB;;CAA9B,OAAAN,EAAA,GAAAC,EAAqC,OAArCK,CAAqC"}

package/dist/cdn/chunks/{LogicTagInsertButton-3pIbVE9p.js → LogicTagInsertButton-CItDS_U1.js}

@@ -4,7 +4,7 @@ import { t as ee } from "./dist-CXB2_kBa.js";
 import { J as te, Y as M, Z as ne, d as re } from "./keys-DCWeHkSF.js";
 import { t as N } from "./useI18n-CyO_Nmca.js";
 import { a as ie, i as ae, n as oe, o as se, r as ce, t as le } from "./usePopoverPosition-DGXjXKjM.js";
-import { F as P, n as ue, q as F, zt as I } from "./icons-Bad3WZ3G.js";
+import { F as P, n as ue, q as F, zt as I } from "./icons-CQnjugjy.js";
 import { t as L } from "./useMergeTag-C5MyHYxJ.js";
 import { t as de } from "./useLogicTag-J_i_hvZg.js";
 import { u as fe } from "./styleConstants-C_YAPdQS.js";
@@ -1056,4 +1056,4 @@ var ft = ["aria-label"], pt = [
 //#endregion
 export { it as a, qe as c, dt as i, St as n, nt as o, yt as r, rt as s, Tt as t };
 
-//# sourceMappingURL=LogicTagInsertButton-3pIbVE9p.js.map
+//# sourceMappingURL=LogicTagInsertButton-CItDS_U1.js.map