@templatical/editor 0.39.2 → 0.39.3

package/dist/cdn/chunks/DesignReferenceSidebar-CtaoY-hl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DesignReferenceSidebar-CtaoY-hl.js","names":[],"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-DdFk-Blf.js → IssuesPanel-C6RlIxoi.js}

@@ -31,7 +31,7 @@ var E = { class: "tpl:flex tpl:flex-col tpl:gap-4 tpl:p-4" }, D = { class: "tpl:
 			f("h3", O, m(a(z).issues.panelTitle), 1),
 			q.value > 0 ? (n(), l("span", {
 				key: 0,
-				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)]",
+				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)]",
 				title: a(B)(a(z).issues.issueCountTooltip, { count: q.value })
 			}, m(q.value), 9, k)) : u("", !0)
 		]), !a(V) || a(V).unavailable.value ? (n(), l("div", A)) : q.value === 0 ? (n(), l("div", j, m(a(z).issues.emptyState), 1)) : (n(!0), l(p, { key: 2 }, t([
@@ -58,7 +58,7 @@ var E = { class: "tpl:flex tpl:flex-col tpl:gap-4 tpl:p-4" }, D = { class: "tpl:
 			}
 		], (e) => (n(), l("section", { key: e.key }, [e.items.length > 0 ? (n(), l("header", {
 			key: 0,
-			class: s(["tpl:mb-2 tpl:flex tpl:items-center tpl:gap-1.5 tpl:text-[11px] tpl:font-semibold tpl:uppercase tpl:tracking-wide", e.tone])
+			class: s(["tpl:mb-2 tpl:flex tpl:items-center tpl:gap-1.5 tpl:text-xs tpl:font-semibold tpl:uppercase tpl:tracking-wide", e.tone])
 		}, [
 			(n(), d(r(e.icon), {
 				size: 12,
@@ -76,7 +76,7 @@ var E = { class: "tpl:flex tpl:flex-col tpl:gap-4 tpl:p-4" }, D = { class: "tpl:
 				key: 0,
 				type: "button",
 				"data-testid": "issue-jump",
-				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)]",
+				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)]",
 				onClick: (t) => J(e)
 			}, [o(a(y), {
 				size: 10,
@@ -84,7 +84,7 @@ var E = { class: "tpl:flex tpl:flex-col tpl:gap-4 tpl:p-4" }, D = { class: "tpl:
 			}), h(" " + m(a(z).issues.jump), 1)], 8, L)) : u("", !0), e.fix ? (n(), l("button", {
 				key: 1,
 				type: "button",
-				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-[var(--tpl-on-primary)]",
+				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)]",
 				title: e.fix.description,
 				onClick: (t) => Y(e)
 			}, [o(a(S), {
@@ -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-DdFk-Blf.js.map
+//# sourceMappingURL=IssuesPanel-C6RlIxoi.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"IssuesPanel-C6RlIxoi.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 { 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-Ba5xh5HD.js → LoadingTrack-_7DH_5aw.js}

@@ -5,8 +5,8 @@ var r = {}, i = { class: "tpl-loading-track" };
 function a(n, r) {
 	return e(), t("div", i);
 }
-var o = /*#__PURE__*/ n(r, [["render", a], ["__scopeId", "data-v-c3d50014"]]);
+var o = /*#__PURE__*/ n(r, [["render", a], ["__scopeId", "data-v-e61f3b63"]]);
 //#endregion
 export { o as t };
 
-//# sourceMappingURL=LoadingTrack-Ba5xh5HD.js.map
+//# sourceMappingURL=LoadingTrack-_7DH_5aw.js.map

package/dist/cdn/chunks/{LoadingTrack-Ba5xh5HD.js.map → LoadingTrack-_7DH_5aw.js.map}

@@ -1 +1 @@
-{"version":3,"file":"LoadingTrack-Ba5xh5HD.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-fill {\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":[],"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"}

package/dist/cdn/chunks/{ParagraphEditor-DO4RzP8l.js → ParagraphEditor-R2ph_UOo.js}

@@ -1,7 +1,7 @@
 import { E as e, F as t, N as n, Q as r, R as i, S as a, at as o, b as s, c, ct as l, d as u, f as d, g as f, h as p, l as m, lt as h, m as g, p as _, q as v, u as y, ut as b, y as x } from "./draggable-IB4x6w2O.js";
 import { R as S } from "./src-Dwgq7hf4.js";
 import { t as C } from "./dist-CXB2_kBa.js";
-import { C as w, S as T, b as E, y as D } from "./useEditorCore-BHmIp1hW.js";
+import { C as w, S as T, b as E, y as D } from "./useEditorCore-CXYI14ux.js";
 import { K as O, T as k, Y as A, Z as j, g as ee, k as M, v as N } from "./keys-dJbD1QPs.js";
 import { t as P } from "./useI18n-DTZ9sIcv.js";
 import { n as F } from "./usePopoverPosition-gB9q-ql7.js";
@@ -122,7 +122,7 @@ var Z = /*#__PURE__*/ L(J, [["render", X]]), Q = [
 			return typeof e == "string" ? e : e.label;
 		}
 		return (r, i) => (n(), f("select", {
-			class: l(["tpl:h-8 tpl:cursor-pointer tpl:rounded tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:px-2 tpl:text-xs tpl:text-[var(--tpl-text)] tpl:outline-none", e.widthClass ?? "tpl:w-20"]),
+			class: l(["tpl:h-8 tpl:cursor-pointer tpl:rounded tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:px-2 tpl:text-xs tpl:text-[var(--tpl-text)] tpl:outline-none tpl:focus:border-[var(--tpl-primary)] tpl:focus:shadow-[var(--tpl-ring)]", e.widthClass ?? "tpl:w-20"]),
 			value: e.modelValue,
 			"aria-label": e.label,
 			title: e.label,
@@ -613,4 +613,4 @@ var Ee = ["data-tpl-theme", "aria-label"], De = { class: "tpl:flex tpl:items-cen
 //#endregion
 export { Pe as default };
 
-//# sourceMappingURL=ParagraphEditor-DO4RzP8l.js.map
+//# sourceMappingURL=ParagraphEditor-R2ph_UOo.js.map

package/dist/cdn/chunks/ParagraphEditor-R2ph_UOo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ParagraphEditor-R2ph_UOo.js","names":[],"sources":["../../../src/components/blocks/EmojiPickerDropdown.vue","../../../src/components/blocks/EmojiPickerDropdown.vue","../../../src/components/toolbar/ToolbarIconButton.vue","../../../src/components/toolbar/ToolbarIconButton.vue","../../../src/components/toolbar/ToolbarSeparator.vue","../../../src/components/toolbar/ToolbarSelect.vue","../../../src/components/toolbar/ToolbarSelect.vue","../../../src/utils/richTextColor.ts","../../../src/components/blocks/ParagraphToolbar.vue","../../../src/components/blocks/ParagraphToolbar.vue","../../../src/components/blocks/ParagraphEditor.vue","../../../src/components/blocks/ParagraphEditor.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useEmoji, useI18n } from \"../../composables\";\nimport { useFocusTrap } from \"../../composables/useFocusTrap\";\nimport { onClickOutside } from \"@vueuse/core\";\nimport { Smile } from \"@lucide/vue\";\nimport { computed, ref } from \"vue\";\n\nconst emit = defineEmits<{\n  (e: \"insert\", emoji: string): void;\n}>();\n\nconst {\n  categories: emojiCategories,\n  isOpen: showEmojiPicker,\n  toggle: toggleEmojiPicker,\n  close: closeEmojiPicker,\n} = useEmoji();\n\nconst { t, format } = useI18n();\n\nconst pickerRef = ref<HTMLElement | null>(null);\nconst rootRef = ref<HTMLElement | null>(null);\n\nconst isOpenRef = computed(() => showEmojiPicker.value);\nuseFocusTrap(pickerRef, isOpenRef);\n\nonClickOutside(rootRef, () => {\n  if (showEmojiPicker.value) {\n    closeEmojiPicker();\n  }\n});\n\nfunction handleInsert(emoji: string): void {\n  emit(\"insert\", emoji);\n  closeEmojiPicker();\n}\n</script>\n\n<template>\n  <div ref=\"rootRef\" class=\"tpl:relative\">\n    <button\n      type=\"button\"\n      class=\"tpl-text-toolbar-btn\"\n      :class=\"{\n        'tpl-text-toolbar-btn--active': showEmojiPicker,\n      }\"\n      :aria-label=\"t.paragraphEditor.insertEmoji\"\n      :title=\"t.paragraphEditor.insertEmoji\"\n      :aria-expanded=\"showEmojiPicker\"\n      aria-haspopup=\"dialog\"\n      aria-controls=\"tpl-emoji-picker\"\n      @click=\"toggleEmojiPicker\"\n    >\n      <Smile :size=\"16\" :stroke-width=\"2\" />\n    </button>\n    <div\n      v-if=\"showEmojiPicker\"\n      id=\"tpl-emoji-picker\"\n      ref=\"pickerRef\"\n      role=\"dialog\"\n      aria-modal=\"false\"\n      :aria-label=\"t.paragraphEditor.insertEmoji\"\n      tabindex=\"-1\"\n      class=\"tpl-emoji-picker tpl:absolute tpl:top-full tpl:left-0 tpl:z-10 tpl:mt-2 tpl:w-72 tpl:rounded-lg tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-2 tpl:shadow-[var(--tpl-shadow-lg)]\"\n      @keydown.esc.stop.prevent=\"closeEmojiPicker\"\n    >\n      <div\n        v-for=\"category in emojiCategories\"\n        :key=\"category.key\"\n        class=\"tpl:mb-2 tpl:last:mb-0\"\n      >\n        <div\n          class=\"tpl:mb-1.5 tpl:text-[10px] tpl:font-medium tpl:tracking-wide tpl:text-[var(--tpl-text-muted)] tpl:uppercase\"\n        >\n          {{ t.emoji[category.key] }}\n        </div>\n        <div class=\"tpl:grid tpl:grid-cols-10 tpl:gap-0.5\">\n          <button\n            v-for=\"emoji in category.emojis\"\n            :key=\"emoji\"\n            type=\"button\"\n            :aria-label=\"format(t.paragraphEditor.emojiItemLabel, { emoji })\"\n            class=\"tpl:flex tpl:size-6 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded tpl:border-none tpl:bg-transparent tpl:text-base tpl:transition-all tpl:hover:scale-125 tpl:hover:bg-[var(--tpl-bg-active)]\"\n            @click=\"handleInsert(emoji)\"\n          >\n            {{ emoji }}\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { useEmoji, useI18n } from \"../../composables\";\nimport { useFocusTrap } from \"../../composables/useFocusTrap\";\nimport { onClickOutside } from \"@vueuse/core\";\nimport { Smile } from \"@lucide/vue\";\nimport { computed, ref } from \"vue\";\n\nconst emit = defineEmits<{\n  (e: \"insert\", emoji: string): void;\n}>();\n\nconst {\n  categories: emojiCategories,\n  isOpen: showEmojiPicker,\n  toggle: toggleEmojiPicker,\n  close: closeEmojiPicker,\n} = useEmoji();\n\nconst { t, format } = useI18n();\n\nconst pickerRef = ref<HTMLElement | null>(null);\nconst rootRef = ref<HTMLElement | null>(null);\n\nconst isOpenRef = computed(() => showEmojiPicker.value);\nuseFocusTrap(pickerRef, isOpenRef);\n\nonClickOutside(rootRef, () => {\n  if (showEmojiPicker.value) {\n    closeEmojiPicker();\n  }\n});\n\nfunction handleInsert(emoji: string): void {\n  emit(\"insert\", emoji);\n  closeEmojiPicker();\n}\n</script>\n\n<template>\n  <div ref=\"rootRef\" class=\"tpl:relative\">\n    <button\n      type=\"button\"\n      class=\"tpl-text-toolbar-btn\"\n      :class=\"{\n        'tpl-text-toolbar-btn--active': showEmojiPicker,\n      }\"\n      :aria-label=\"t.paragraphEditor.insertEmoji\"\n      :title=\"t.paragraphEditor.insertEmoji\"\n      :aria-expanded=\"showEmojiPicker\"\n      aria-haspopup=\"dialog\"\n      aria-controls=\"tpl-emoji-picker\"\n      @click=\"toggleEmojiPicker\"\n    >\n      <Smile :size=\"16\" :stroke-width=\"2\" />\n    </button>\n    <div\n      v-if=\"showEmojiPicker\"\n      id=\"tpl-emoji-picker\"\n      ref=\"pickerRef\"\n      role=\"dialog\"\n      aria-modal=\"false\"\n      :aria-label=\"t.paragraphEditor.insertEmoji\"\n      tabindex=\"-1\"\n      class=\"tpl-emoji-picker tpl:absolute tpl:top-full tpl:left-0 tpl:z-10 tpl:mt-2 tpl:w-72 tpl:rounded-lg tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-2 tpl:shadow-[var(--tpl-shadow-lg)]\"\n      @keydown.esc.stop.prevent=\"closeEmojiPicker\"\n    >\n      <div\n        v-for=\"category in emojiCategories\"\n        :key=\"category.key\"\n        class=\"tpl:mb-2 tpl:last:mb-0\"\n      >\n        <div\n          class=\"tpl:mb-1.5 tpl:text-[10px] tpl:font-medium tpl:tracking-wide tpl:text-[var(--tpl-text-muted)] tpl:uppercase\"\n        >\n          {{ t.emoji[category.key] }}\n        </div>\n        <div class=\"tpl:grid tpl:grid-cols-10 tpl:gap-0.5\">\n          <button\n            v-for=\"emoji in category.emojis\"\n            :key=\"emoji\"\n            type=\"button\"\n            :aria-label=\"format(t.paragraphEditor.emojiItemLabel, { emoji })\"\n            class=\"tpl:flex tpl:size-6 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded tpl:border-none tpl:bg-transparent tpl:text-base tpl:transition-all tpl:hover:scale-125 tpl:hover:bg-[var(--tpl-bg-active)]\"\n            @click=\"handleInsert(emoji)\"\n          >\n            {{ emoji }}\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport type { Component } from \"vue\";\n\ndefineProps<{\n  icon: Component;\n  label: string;\n  active?: boolean;\n  strokeWidth?: number;\n  size?: number;\n}>();\n</script>\n\n<template>\n  <button\n    type=\"button\"\n    class=\"tpl-text-toolbar-btn\"\n    :class=\"{ 'tpl-text-toolbar-btn--active': active }\"\n    :aria-label=\"label\"\n    :title=\"label\"\n    :aria-pressed=\"active ? 'true' : 'false'\"\n  >\n    <component :is=\"icon\" :size=\"size ?? 16\" :stroke-width=\"strokeWidth ?? 2\" />\n  </button>\n</template>\n","<script setup lang=\"ts\">\nimport type { Component } from \"vue\";\n\ndefineProps<{\n  icon: Component;\n  label: string;\n  active?: boolean;\n  strokeWidth?: number;\n  size?: number;\n}>();\n</script>\n\n<template>\n  <button\n    type=\"button\"\n    class=\"tpl-text-toolbar-btn\"\n    :class=\"{ 'tpl-text-toolbar-btn--active': active }\"\n    :aria-label=\"label\"\n    :title=\"label\"\n    :aria-pressed=\"active ? 'true' : 'false'\"\n  >\n    <component :is=\"icon\" :size=\"size ?? 16\" :stroke-width=\"strokeWidth ?? 2\" />\n  </button>\n</template>\n","<template>\n  <span\n    class=\"tpl:mx-1 tpl:h-6 tpl:w-px tpl:bg-[var(--tpl-border)]\"\n    aria-hidden=\"true\"\n  ></span>\n</template>\n","<script setup lang=\"ts\">\ninterface OptionItem {\n  value: string;\n  label: string;\n}\n\ndefineProps<{\n  modelValue: string;\n  options: readonly (string | OptionItem)[];\n  label: string;\n  placeholder?: string;\n  widthClass?: string;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"update:modelValue\", value: string): void;\n}>();\n\nfunction onChange(e: Event): void {\n  emit(\"update:modelValue\", (e.target as HTMLSelectElement).value);\n}\n\nfunction optionValue(opt: string | OptionItem): string {\n  return typeof opt === \"string\" ? opt : opt.value;\n}\n\nfunction optionLabel(opt: string | OptionItem): string {\n  return typeof opt === \"string\" ? opt : opt.label;\n}\n</script>\n\n<template>\n  <select\n    :class=\"[\n      'tpl:h-8 tpl:cursor-pointer tpl:rounded tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:px-2 tpl:text-xs tpl:text-[var(--tpl-text)] tpl:outline-none tpl:focus:border-[var(--tpl-primary)] tpl:focus:shadow-[var(--tpl-ring)]',\n      widthClass ?? 'tpl:w-20',\n    ]\"\n    :value=\"modelValue\"\n    :aria-label=\"label\"\n    :title=\"label\"\n    @change=\"onChange\"\n  >\n    <option value=\"\">{{ placeholder ?? \"\" }}</option>\n    <option\n      v-for=\"opt in options\"\n      :key=\"optionValue(opt)\"\n      :value=\"optionValue(opt)\"\n    >\n      {{ optionLabel(opt) }}\n    </option>\n  </select>\n</template>\n","<script setup lang=\"ts\">\ninterface OptionItem {\n  value: string;\n  label: string;\n}\n\ndefineProps<{\n  modelValue: string;\n  options: readonly (string | OptionItem)[];\n  label: string;\n  placeholder?: string;\n  widthClass?: string;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"update:modelValue\", value: string): void;\n}>();\n\nfunction onChange(e: Event): void {\n  emit(\"update:modelValue\", (e.target as HTMLSelectElement).value);\n}\n\nfunction optionValue(opt: string | OptionItem): string {\n  return typeof opt === \"string\" ? opt : opt.value;\n}\n\nfunction optionLabel(opt: string | OptionItem): string {\n  return typeof opt === \"string\" ? opt : opt.label;\n}\n</script>\n\n<template>\n  <select\n    :class=\"[\n      'tpl:h-8 tpl:cursor-pointer tpl:rounded tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:px-2 tpl:text-xs tpl:text-[var(--tpl-text)] tpl:outline-none tpl:focus:border-[var(--tpl-primary)] tpl:focus:shadow-[var(--tpl-ring)]',\n      widthClass ?? 'tpl:w-20',\n    ]\"\n    :value=\"modelValue\"\n    :aria-label=\"label\"\n    :title=\"label\"\n    @change=\"onChange\"\n  >\n    <option value=\"\">{{ placeholder ?? \"\" }}</option>\n    <option\n      v-for=\"opt in options\"\n      :key=\"optionValue(opt)\"\n      :value=\"optionValue(opt)\"\n    >\n      {{ optionLabel(opt) }}\n    </option>\n  </select>\n</template>\n","import { DEFAULT_TEXT_COLOR } from \"../constants/styleConstants\";\n\n/**\n * The color a rich-text selection actually renders as, for display in the\n * text-color control (issue #373).\n *\n * Priority: an explicit inline text-color mark on the selection wins; otherwise\n * the text inherits the document-level `textColor`; if that too is unset (older\n * content predating document text color), fall back to the built-in default.\n *\n * A native `<input type=\"color\">` can't represent \"no color\", so the control\n * must be handed a concrete value. Resolving the effective color is what keeps\n * that value truthful — the swatch shows the color the text actually renders in,\n * whatever level it comes from. Defaulting to a hard-coded `#000000` instead\n * would both read as an explicit choice and not even match the real inherited\n * color (`#1a1a1a`).\n */\nexport function resolveEffectiveTextColor(\n  explicitColor: string,\n  documentTextColor: string | undefined,\n): string {\n  return explicitColor || documentTextColor || DEFAULT_TEXT_COLOR;\n}\n","<script setup lang=\"ts\">\nimport ColorPicker from \"../ColorPicker.vue\";\nimport EmojiPickerDropdown from \"./EmojiPickerDropdown.vue\";\nimport ToolbarIconButton from \"../toolbar/ToolbarIconButton.vue\";\nimport ToolbarSeparator from \"../toolbar/ToolbarSeparator.vue\";\nimport ToolbarSelect from \"../toolbar/ToolbarSelect.vue\";\nimport { useI18n } from \"../../composables\";\nimport { usePopoverRoot } from \"../../composables/usePopoverRoot\";\nimport type { Editor } from \"@tiptap/core\";\nimport {\n  AlignCenter,\n  AlignJustify,\n  AlignLeft,\n  AlignRight,\n  Bold,\n  Italic,\n  Braces,\n  Link,\n  List,\n  ListOrdered,\n  LoaderCircle,\n  RemoveFormatting,\n  ScanLine,\n  Strikethrough,\n  Subscript,\n  Superscript,\n  Underline,\n} from \"@lucide/vue\";\nimport { computed, inject } from \"vue\";\nimport {\n  EDITOR_KEY,\n  THEME_STYLES_KEY,\n  UI_THEME_KEY,\n  FONTS_MANAGER_KEY,\n  MERGE_TAG_PICKER_KEY,\n  LOGIC_TAG_PICKER_KEY,\n  requireInject,\n} from \"../../keys\";\nimport {\n  DEFAULT_HIGHLIGHT_COLOR,\n  FONT_SIZE_OPTIONS,\n  LINE_HEIGHT_OPTIONS,\n  LETTER_SPACING_OPTIONS,\n} from \"../../constants/styleConstants\";\nimport { resolveEffectiveTextColor } from \"../../utils/richTextColor\";\n\nconst props = defineProps<{\n  editor: Editor | null;\n  toolbarPosition: { top: number; left: number };\n  isLoading: boolean;\n  canRequestMergeTag: boolean;\n  canInsertLogicTag: boolean;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"open-link-dialog\"): void;\n  (e: \"add-merge-tag\"): void;\n  (e: \"add-logic-tag\"): void;\n}>();\n\nconst themeStyles = inject(THEME_STYLES_KEY, null);\nconst tplUiTheme = inject(UI_THEME_KEY, null);\nconst fontsManager = requireInject(FONTS_MANAGER_KEY, \"ParagraphToolbar\");\nconst popoverRoot = usePopoverRoot();\n// Picker may be null in non-editor contexts (e.g. isolated component tests).\n// When it's provided AND open, hide the floating toolbar — leaving it\n// visible behind the modal is visually noisy and the toolbar's Tailwind\n// z-index utility doesn't compile reliably, so it can sometimes paint\n// over the modal backdrop.\nconst picker = inject(MERGE_TAG_PICKER_KEY, null);\nconst logicPicker = inject(LOGIC_TAG_PICKER_KEY, null);\n// Editor may be absent in isolated tests; used only to resolve the inherited\n// document text color for the text-color swatch.\nconst editorReturn = inject(EDITOR_KEY, null);\n// Hide the floating toolbar while either built-in picker modal is open, so it\n// doesn't overlap the dialog.\nconst pickerIsOpen = computed(\n  () => (picker?.isOpen.value ?? false) || (logicPicker?.isOpen.value ?? false),\n);\n\nconst { t } = useI18n();\n\nconst fontFamilies = fontsManager.fonts;\n\nfunction insertEmoji(emoji: string): void {\n  props.editor?.chain().focus().insertContent(emoji).run();\n}\n\nfunction textStyleAttr(attr: string): string {\n  return (props.editor?.getAttributes(\"textStyle\")[attr] as string) || \"\";\n}\n\nfunction setFontFamily(family: string): void {\n  const chain = props.editor?.chain().focus();\n  if (family) chain?.setFontFamily(family).run();\n  else chain?.unsetFontFamily().run();\n}\n\nfunction setFontSize(size: string): void {\n  const chain = props.editor?.chain().focus();\n  if (size) chain?.setFontSize(size).run();\n  else chain?.unsetFontSize().run();\n}\n\n// When the selection is a link, the color control operates on the link itself\n// (its `color` attribute → inline on the `<a>`) so the link's text and underline\n// stay in sync; otherwise it applies a plain inline text-color mark.\nfunction isLinkSelection(): boolean {\n  return props.editor?.isActive(\"link\") ?? false;\n}\n\nfunction linkColorAttr(): string {\n  return (props.editor?.getAttributes(\"link\").color as string) || \"\";\n}\n\n// Set (or clear, when empty) the color of the current selection. On a link the\n// whole link is recolored (extendMarkRange) so it doesn't split into segments.\nfunction setColor(color: string): void {\n  const chain = props.editor?.chain().focus();\n  if (!chain) return;\n  if (isLinkSelection()) {\n    chain.extendMarkRange(\"link\").updateAttributes(\"link\", {\n      color: color || null,\n    });\n    // A per-link color takes absolute priority over any inner text-color: strip\n    // the inline text color on the link range so the `<a>` color alone drives\n    // the glyphs and the underline (mirrors useRichTextLinkDialog.insertLink).\n    // Only when setting a color — clearing leaves the text color untouched.\n    if (color) chain.unsetColor();\n    chain.run();\n  } else if (color) {\n    // A text color applied over a selection that includes a link unifies the\n    // link with it: update the link's own color so the `<a>` (which paints the\n    // underline and is what the dialog/toolbar read) matches the recolored\n    // glyphs. A no-op on a selection with no link. Mirror of the link branch\n    // above — either way a link never ends up with a text color fighting its\n    // own color.\n    chain.setColor(color).updateAttributes(\"link\", { color }).run();\n  } else {\n    chain.unsetColor().run();\n  }\n}\n\n// The color the current selection actually renders in — a link's own color (else\n// the effective document link color: link color, then text color), or for plain\n// text the inline mark else the document text color. Keeps the swatch truthful\n// rather than showing a hard-coded default (issue #373 / per-link color).\nfunction effectiveTextColor(): string {\n  const settings = editorReturn?.content.value.settings;\n  if (isLinkSelection()) {\n    return resolveEffectiveTextColor(\n      linkColorAttr(),\n      settings?.linkColor || settings?.textColor,\n    );\n  }\n  return resolveEffectiveTextColor(textStyleAttr(\"color\"), settings?.textColor);\n}\n\n// The selection's own explicit color: a link's color when on a link, else the\n// inline text-color mark. May be \"\" when the selection only inherits its color\n// — that drives the swatch's set/unset state, while `effectiveTextColor()`\n// seeds the wheel so it still opens on the real rendered color.\nfunction explicitTextColor(): string {\n  return isLinkSelection() ? linkColorAttr() : textStyleAttr(\"color\");\n}\n\nfunction getCurrentLineHeight(): string {\n  return (props.editor?.getAttributes(\"paragraph\").lineHeight as string) || \"\";\n}\n\nfunction setLineHeight(value: string): void {\n  const chain = props.editor?.chain().focus();\n  if (value) chain?.setLineHeight(value).run();\n  else chain?.unsetLineHeight().run();\n}\n\nfunction setLetterSpacing(value: string): void {\n  const chain = props.editor?.chain().focus();\n  if (value && value !== \"normal\") chain?.setLetterSpacing(value).run();\n  else chain?.unsetLetterSpacing().run();\n}\n\nfunction getCurrentHighlight(): string {\n  return (props.editor?.getAttributes(\"highlight\").color as string) || \"\";\n}\n\nfunction setHighlight(color: string): void {\n  const chain = props.editor?.chain().focus();\n  if (color) chain?.setHighlight({ color }).run();\n  else chain?.unsetHighlight().run();\n}\n</script>\n\n<template>\n  <Teleport v-if=\"popoverRoot && !pickerIsOpen\" :to=\"popoverRoot\">\n    <div\n      :data-tpl-theme=\"tplUiTheme\"\n      role=\"toolbar\"\n      :aria-label=\"t.paragraphEditor.toolbar\"\n      class=\"tpl tpl-text-toolbar tpl:absolute tpl:flex tpl:gap-1 tpl:rounded-lg tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:px-3 tpl:py-2 tpl:shadow-[var(--tpl-shadow-lg)]\"\n      :style=\"{\n        ...themeStyles,\n        top: `${toolbarPosition.top}px`,\n        left: `${toolbarPosition.left}px`,\n        transform: 'translateY(-100%)',\n        flexDirection: 'column',\n      }\"\n    >\n      <template v-if=\"!isLoading && editor\">\n        <!-- Row 1: Font family, Font size, Text color, Bold/Italic/Underline/Strikethrough -->\n        <div class=\"tpl:flex tpl:items-center tpl:gap-1\">\n          <ToolbarSelect\n            :model-value=\"textStyleAttr('fontFamily')\"\n            :options=\"fontFamilies\"\n            :label=\"t.paragraphEditor.fontFamily\"\n            :placeholder=\"t.paragraphEditor.defaultFont\"\n            width-class=\"tpl:w-32\"\n            @update:model-value=\"setFontFamily\"\n          />\n          <ToolbarSelect\n            :model-value=\"textStyleAttr('fontSize')\"\n            :options=\"FONT_SIZE_OPTIONS\"\n            :label=\"t.paragraphEditor.fontSize\"\n            :placeholder=\"t.paragraphEditor.defaultSize\"\n            width-class=\"tpl:w-20\"\n            @update:model-value=\"setFontSize\"\n          />\n          <ToolbarSeparator />\n          <ColorPicker\n            swatch-only\n            size=\"sm\"\n            data-testid=\"text-color-picker\"\n            :model-value=\"explicitTextColor()\"\n            :seed-color=\"effectiveTextColor()\"\n            :aria-label=\"t.paragraphEditor.textColor\"\n            @update:model-value=\"setColor\"\n          />\n          <ColorPicker\n            swatch-only\n            size=\"sm\"\n            data-testid=\"highlight-color-picker\"\n            :model-value=\"getCurrentHighlight()\"\n            :seed-color=\"DEFAULT_HIGHLIGHT_COLOR\"\n            :aria-label=\"t.paragraphEditor.highlightColor\"\n            @update:model-value=\"setHighlight\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"Bold\"\n            :label=\"t.paragraphEditor.bold\"\n            :active=\"editor.isActive('bold')\"\n            :stroke-width=\"2.5\"\n            @click=\"editor.chain().focus().toggleBold().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"Italic\"\n            :label=\"t.paragraphEditor.italic\"\n            :active=\"editor.isActive('italic')\"\n            @click=\"editor.chain().focus().toggleItalic().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"Underline\"\n            :label=\"t.paragraphEditor.underline\"\n            :active=\"editor.isActive('underline')\"\n            @click=\"editor.chain().focus().toggleUnderline().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"Strikethrough\"\n            :label=\"t.paragraphEditor.strikethrough\"\n            :active=\"editor.isActive('strike')\"\n            @click=\"editor.chain().focus().toggleStrike().run()\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"Subscript\"\n            :label=\"t.paragraphEditor.subscript\"\n            :active=\"editor.isActive('subscript')\"\n            @click=\"editor.chain().focus().toggleSubscript().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"Superscript\"\n            :label=\"t.paragraphEditor.superscript\"\n            :active=\"editor.isActive('superscript')\"\n            @click=\"editor.chain().focus().toggleSuperscript().run()\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"Link\"\n            :label=\"t.paragraphEditor.addLink\"\n            :active=\"editor.isActive('link')\"\n            @click=\"emit('open-link-dialog')\"\n          />\n        </div>\n        <!-- Row 2: Lists, Alignment, LH, LS, Clear, Emoji, Merge tags -->\n        <div class=\"tpl:flex tpl:items-center tpl:gap-1\">\n          <ToolbarIconButton\n            :icon=\"List\"\n            :label=\"t.paragraphEditor.bulletList\"\n            :active=\"editor.isActive('bulletList')\"\n            @click=\"editor.chain().focus().toggleBulletList().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"ListOrdered\"\n            :label=\"t.paragraphEditor.numberedList\"\n            :active=\"editor.isActive('orderedList')\"\n            @click=\"editor.chain().focus().toggleOrderedList().run()\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"AlignLeft\"\n            :label=\"t.paragraphEditor.alignLeft\"\n            :active=\"editor.isActive({ textAlign: 'left' })\"\n            @click=\"editor.chain().focus().setTextAlign('left').run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"AlignCenter\"\n            :label=\"t.paragraphEditor.alignCenter\"\n            :active=\"editor.isActive({ textAlign: 'center' })\"\n            @click=\"editor.chain().focus().setTextAlign('center').run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"AlignRight\"\n            :label=\"t.paragraphEditor.alignRight\"\n            :active=\"editor.isActive({ textAlign: 'right' })\"\n            @click=\"editor.chain().focus().setTextAlign('right').run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"AlignJustify\"\n            :label=\"t.paragraphEditor.alignJustify\"\n            :active=\"editor.isActive({ textAlign: 'justify' })\"\n            @click=\"editor.chain().focus().setTextAlign('justify').run()\"\n          />\n          <ToolbarSeparator />\n          <ToolbarSelect\n            :model-value=\"getCurrentLineHeight()\"\n            :options=\"LINE_HEIGHT_OPTIONS\"\n            :label=\"t.paragraphEditor.lineHeight\"\n            placeholder=\"LH\"\n            width-class=\"tpl:w-16\"\n            @update:model-value=\"setLineHeight\"\n          />\n          <ToolbarSelect\n            :model-value=\"textStyleAttr('letterSpacing')\"\n            :options=\"LETTER_SPACING_OPTIONS\"\n            :label=\"t.paragraphEditor.letterSpacing\"\n            placeholder=\"LS\"\n            width-class=\"tpl:w-20\"\n            @update:model-value=\"setLetterSpacing\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"RemoveFormatting\"\n            :label=\"t.paragraphEditor.clearFormatting\"\n            @click=\"editor.chain().focus().clearNodes().unsetAllMarks().run()\"\n          />\n          <ToolbarSeparator />\n          <EmojiPickerDropdown @insert=\"insertEmoji\" />\n          <template v-if=\"canRequestMergeTag\">\n            <ToolbarSeparator />\n            <button\n              type=\"button\"\n              class=\"tpl:flex tpl:h-8 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded tpl:border-none tpl:bg-transparent tpl:px-2.5 tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text)] tpl:transition-all tpl:hover:bg-[var(--tpl-bg-active)]\"\n              :aria-label=\"t.mergeTag.insert\"\n              :title=\"t.mergeTag.insert\"\n              @click=\"emit('add-merge-tag')\"\n            >\n              <ScanLine :size=\"16\" :stroke-width=\"2\" />\n              {{ t.mergeTag.insertShort }}\n            </button>\n          </template>\n          <template v-if=\"canInsertLogicTag\">\n            <ToolbarSeparator />\n            <button\n              type=\"button\"\n              class=\"tpl:flex tpl:h-8 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded tpl:border-none tpl:bg-transparent tpl:px-2.5 tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text)] tpl:transition-all tpl:hover:bg-[var(--tpl-bg-active)]\"\n              :aria-label=\"t.logicTag.insert\"\n              :title=\"t.logicTag.insert\"\n              data-testid=\"insert-logic-button\"\n              @click=\"emit('add-logic-tag')\"\n            >\n              <Braces :size=\"16\" :stroke-width=\"2\" />\n              {{ t.logicTag.insertShort }}\n            </button>\n          </template>\n        </div>\n      </template>\n      <template v-else>\n        <div\n          class=\"tpl:flex tpl:items-center tpl:gap-2 tpl:px-2 tpl:text-xs tpl:text-[var(--tpl-text-dim)]\"\n        >\n          <LoaderCircle class=\"tpl-spinner\" :size=\"14\" :stroke-width=\"2\" />\n          {{ t.errors.editorLoading }}\n        </div>\n      </template>\n    </div>\n  </Teleport>\n</template>\n","<script setup lang=\"ts\">\nimport ColorPicker from \"../ColorPicker.vue\";\nimport EmojiPickerDropdown from \"./EmojiPickerDropdown.vue\";\nimport ToolbarIconButton from \"../toolbar/ToolbarIconButton.vue\";\nimport ToolbarSeparator from \"../toolbar/ToolbarSeparator.vue\";\nimport ToolbarSelect from \"../toolbar/ToolbarSelect.vue\";\nimport { useI18n } from \"../../composables\";\nimport { usePopoverRoot } from \"../../composables/usePopoverRoot\";\nimport type { Editor } from \"@tiptap/core\";\nimport {\n  AlignCenter,\n  AlignJustify,\n  AlignLeft,\n  AlignRight,\n  Bold,\n  Italic,\n  Braces,\n  Link,\n  List,\n  ListOrdered,\n  LoaderCircle,\n  RemoveFormatting,\n  ScanLine,\n  Strikethrough,\n  Subscript,\n  Superscript,\n  Underline,\n} from \"@lucide/vue\";\nimport { computed, inject } from \"vue\";\nimport {\n  EDITOR_KEY,\n  THEME_STYLES_KEY,\n  UI_THEME_KEY,\n  FONTS_MANAGER_KEY,\n  MERGE_TAG_PICKER_KEY,\n  LOGIC_TAG_PICKER_KEY,\n  requireInject,\n} from \"../../keys\";\nimport {\n  DEFAULT_HIGHLIGHT_COLOR,\n  FONT_SIZE_OPTIONS,\n  LINE_HEIGHT_OPTIONS,\n  LETTER_SPACING_OPTIONS,\n} from \"../../constants/styleConstants\";\nimport { resolveEffectiveTextColor } from \"../../utils/richTextColor\";\n\nconst props = defineProps<{\n  editor: Editor | null;\n  toolbarPosition: { top: number; left: number };\n  isLoading: boolean;\n  canRequestMergeTag: boolean;\n  canInsertLogicTag: boolean;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"open-link-dialog\"): void;\n  (e: \"add-merge-tag\"): void;\n  (e: \"add-logic-tag\"): void;\n}>();\n\nconst themeStyles = inject(THEME_STYLES_KEY, null);\nconst tplUiTheme = inject(UI_THEME_KEY, null);\nconst fontsManager = requireInject(FONTS_MANAGER_KEY, \"ParagraphToolbar\");\nconst popoverRoot = usePopoverRoot();\n// Picker may be null in non-editor contexts (e.g. isolated component tests).\n// When it's provided AND open, hide the floating toolbar — leaving it\n// visible behind the modal is visually noisy and the toolbar's Tailwind\n// z-index utility doesn't compile reliably, so it can sometimes paint\n// over the modal backdrop.\nconst picker = inject(MERGE_TAG_PICKER_KEY, null);\nconst logicPicker = inject(LOGIC_TAG_PICKER_KEY, null);\n// Editor may be absent in isolated tests; used only to resolve the inherited\n// document text color for the text-color swatch.\nconst editorReturn = inject(EDITOR_KEY, null);\n// Hide the floating toolbar while either built-in picker modal is open, so it\n// doesn't overlap the dialog.\nconst pickerIsOpen = computed(\n  () => (picker?.isOpen.value ?? false) || (logicPicker?.isOpen.value ?? false),\n);\n\nconst { t } = useI18n();\n\nconst fontFamilies = fontsManager.fonts;\n\nfunction insertEmoji(emoji: string): void {\n  props.editor?.chain().focus().insertContent(emoji).run();\n}\n\nfunction textStyleAttr(attr: string): string {\n  return (props.editor?.getAttributes(\"textStyle\")[attr] as string) || \"\";\n}\n\nfunction setFontFamily(family: string): void {\n  const chain = props.editor?.chain().focus();\n  if (family) chain?.setFontFamily(family).run();\n  else chain?.unsetFontFamily().run();\n}\n\nfunction setFontSize(size: string): void {\n  const chain = props.editor?.chain().focus();\n  if (size) chain?.setFontSize(size).run();\n  else chain?.unsetFontSize().run();\n}\n\n// When the selection is a link, the color control operates on the link itself\n// (its `color` attribute → inline on the `<a>`) so the link's text and underline\n// stay in sync; otherwise it applies a plain inline text-color mark.\nfunction isLinkSelection(): boolean {\n  return props.editor?.isActive(\"link\") ?? false;\n}\n\nfunction linkColorAttr(): string {\n  return (props.editor?.getAttributes(\"link\").color as string) || \"\";\n}\n\n// Set (or clear, when empty) the color of the current selection. On a link the\n// whole link is recolored (extendMarkRange) so it doesn't split into segments.\nfunction setColor(color: string): void {\n  const chain = props.editor?.chain().focus();\n  if (!chain) return;\n  if (isLinkSelection()) {\n    chain.extendMarkRange(\"link\").updateAttributes(\"link\", {\n      color: color || null,\n    });\n    // A per-link color takes absolute priority over any inner text-color: strip\n    // the inline text color on the link range so the `<a>` color alone drives\n    // the glyphs and the underline (mirrors useRichTextLinkDialog.insertLink).\n    // Only when setting a color — clearing leaves the text color untouched.\n    if (color) chain.unsetColor();\n    chain.run();\n  } else if (color) {\n    // A text color applied over a selection that includes a link unifies the\n    // link with it: update the link's own color so the `<a>` (which paints the\n    // underline and is what the dialog/toolbar read) matches the recolored\n    // glyphs. A no-op on a selection with no link. Mirror of the link branch\n    // above — either way a link never ends up with a text color fighting its\n    // own color.\n    chain.setColor(color).updateAttributes(\"link\", { color }).run();\n  } else {\n    chain.unsetColor().run();\n  }\n}\n\n// The color the current selection actually renders in — a link's own color (else\n// the effective document link color: link color, then text color), or for plain\n// text the inline mark else the document text color. Keeps the swatch truthful\n// rather than showing a hard-coded default (issue #373 / per-link color).\nfunction effectiveTextColor(): string {\n  const settings = editorReturn?.content.value.settings;\n  if (isLinkSelection()) {\n    return resolveEffectiveTextColor(\n      linkColorAttr(),\n      settings?.linkColor || settings?.textColor,\n    );\n  }\n  return resolveEffectiveTextColor(textStyleAttr(\"color\"), settings?.textColor);\n}\n\n// The selection's own explicit color: a link's color when on a link, else the\n// inline text-color mark. May be \"\" when the selection only inherits its color\n// — that drives the swatch's set/unset state, while `effectiveTextColor()`\n// seeds the wheel so it still opens on the real rendered color.\nfunction explicitTextColor(): string {\n  return isLinkSelection() ? linkColorAttr() : textStyleAttr(\"color\");\n}\n\nfunction getCurrentLineHeight(): string {\n  return (props.editor?.getAttributes(\"paragraph\").lineHeight as string) || \"\";\n}\n\nfunction setLineHeight(value: string): void {\n  const chain = props.editor?.chain().focus();\n  if (value) chain?.setLineHeight(value).run();\n  else chain?.unsetLineHeight().run();\n}\n\nfunction setLetterSpacing(value: string): void {\n  const chain = props.editor?.chain().focus();\n  if (value && value !== \"normal\") chain?.setLetterSpacing(value).run();\n  else chain?.unsetLetterSpacing().run();\n}\n\nfunction getCurrentHighlight(): string {\n  return (props.editor?.getAttributes(\"highlight\").color as string) || \"\";\n}\n\nfunction setHighlight(color: string): void {\n  const chain = props.editor?.chain().focus();\n  if (color) chain?.setHighlight({ color }).run();\n  else chain?.unsetHighlight().run();\n}\n</script>\n\n<template>\n  <Teleport v-if=\"popoverRoot && !pickerIsOpen\" :to=\"popoverRoot\">\n    <div\n      :data-tpl-theme=\"tplUiTheme\"\n      role=\"toolbar\"\n      :aria-label=\"t.paragraphEditor.toolbar\"\n      class=\"tpl tpl-text-toolbar tpl:absolute tpl:flex tpl:gap-1 tpl:rounded-lg tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:px-3 tpl:py-2 tpl:shadow-[var(--tpl-shadow-lg)]\"\n      :style=\"{\n        ...themeStyles,\n        top: `${toolbarPosition.top}px`,\n        left: `${toolbarPosition.left}px`,\n        transform: 'translateY(-100%)',\n        flexDirection: 'column',\n      }\"\n    >\n      <template v-if=\"!isLoading && editor\">\n        <!-- Row 1: Font family, Font size, Text color, Bold/Italic/Underline/Strikethrough -->\n        <div class=\"tpl:flex tpl:items-center tpl:gap-1\">\n          <ToolbarSelect\n            :model-value=\"textStyleAttr('fontFamily')\"\n            :options=\"fontFamilies\"\n            :label=\"t.paragraphEditor.fontFamily\"\n            :placeholder=\"t.paragraphEditor.defaultFont\"\n            width-class=\"tpl:w-32\"\n            @update:model-value=\"setFontFamily\"\n          />\n          <ToolbarSelect\n            :model-value=\"textStyleAttr('fontSize')\"\n            :options=\"FONT_SIZE_OPTIONS\"\n            :label=\"t.paragraphEditor.fontSize\"\n            :placeholder=\"t.paragraphEditor.defaultSize\"\n            width-class=\"tpl:w-20\"\n            @update:model-value=\"setFontSize\"\n          />\n          <ToolbarSeparator />\n          <ColorPicker\n            swatch-only\n            size=\"sm\"\n            data-testid=\"text-color-picker\"\n            :model-value=\"explicitTextColor()\"\n            :seed-color=\"effectiveTextColor()\"\n            :aria-label=\"t.paragraphEditor.textColor\"\n            @update:model-value=\"setColor\"\n          />\n          <ColorPicker\n            swatch-only\n            size=\"sm\"\n            data-testid=\"highlight-color-picker\"\n            :model-value=\"getCurrentHighlight()\"\n            :seed-color=\"DEFAULT_HIGHLIGHT_COLOR\"\n            :aria-label=\"t.paragraphEditor.highlightColor\"\n            @update:model-value=\"setHighlight\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"Bold\"\n            :label=\"t.paragraphEditor.bold\"\n            :active=\"editor.isActive('bold')\"\n            :stroke-width=\"2.5\"\n            @click=\"editor.chain().focus().toggleBold().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"Italic\"\n            :label=\"t.paragraphEditor.italic\"\n            :active=\"editor.isActive('italic')\"\n            @click=\"editor.chain().focus().toggleItalic().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"Underline\"\n            :label=\"t.paragraphEditor.underline\"\n            :active=\"editor.isActive('underline')\"\n            @click=\"editor.chain().focus().toggleUnderline().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"Strikethrough\"\n            :label=\"t.paragraphEditor.strikethrough\"\n            :active=\"editor.isActive('strike')\"\n            @click=\"editor.chain().focus().toggleStrike().run()\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"Subscript\"\n            :label=\"t.paragraphEditor.subscript\"\n            :active=\"editor.isActive('subscript')\"\n            @click=\"editor.chain().focus().toggleSubscript().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"Superscript\"\n            :label=\"t.paragraphEditor.superscript\"\n            :active=\"editor.isActive('superscript')\"\n            @click=\"editor.chain().focus().toggleSuperscript().run()\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"Link\"\n            :label=\"t.paragraphEditor.addLink\"\n            :active=\"editor.isActive('link')\"\n            @click=\"emit('open-link-dialog')\"\n          />\n        </div>\n        <!-- Row 2: Lists, Alignment, LH, LS, Clear, Emoji, Merge tags -->\n        <div class=\"tpl:flex tpl:items-center tpl:gap-1\">\n          <ToolbarIconButton\n            :icon=\"List\"\n            :label=\"t.paragraphEditor.bulletList\"\n            :active=\"editor.isActive('bulletList')\"\n            @click=\"editor.chain().focus().toggleBulletList().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"ListOrdered\"\n            :label=\"t.paragraphEditor.numberedList\"\n            :active=\"editor.isActive('orderedList')\"\n            @click=\"editor.chain().focus().toggleOrderedList().run()\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"AlignLeft\"\n            :label=\"t.paragraphEditor.alignLeft\"\n            :active=\"editor.isActive({ textAlign: 'left' })\"\n            @click=\"editor.chain().focus().setTextAlign('left').run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"AlignCenter\"\n            :label=\"t.paragraphEditor.alignCenter\"\n            :active=\"editor.isActive({ textAlign: 'center' })\"\n            @click=\"editor.chain().focus().setTextAlign('center').run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"AlignRight\"\n            :label=\"t.paragraphEditor.alignRight\"\n            :active=\"editor.isActive({ textAlign: 'right' })\"\n            @click=\"editor.chain().focus().setTextAlign('right').run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"AlignJustify\"\n            :label=\"t.paragraphEditor.alignJustify\"\n            :active=\"editor.isActive({ textAlign: 'justify' })\"\n            @click=\"editor.chain().focus().setTextAlign('justify').run()\"\n          />\n          <ToolbarSeparator />\n          <ToolbarSelect\n            :model-value=\"getCurrentLineHeight()\"\n            :options=\"LINE_HEIGHT_OPTIONS\"\n            :label=\"t.paragraphEditor.lineHeight\"\n            placeholder=\"LH\"\n            width-class=\"tpl:w-16\"\n            @update:model-value=\"setLineHeight\"\n          />\n          <ToolbarSelect\n            :model-value=\"textStyleAttr('letterSpacing')\"\n            :options=\"LETTER_SPACING_OPTIONS\"\n            :label=\"t.paragraphEditor.letterSpacing\"\n            placeholder=\"LS\"\n            width-class=\"tpl:w-20\"\n            @update:model-value=\"setLetterSpacing\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"RemoveFormatting\"\n            :label=\"t.paragraphEditor.clearFormatting\"\n            @click=\"editor.chain().focus().clearNodes().unsetAllMarks().run()\"\n          />\n          <ToolbarSeparator />\n          <EmojiPickerDropdown @insert=\"insertEmoji\" />\n          <template v-if=\"canRequestMergeTag\">\n            <ToolbarSeparator />\n            <button\n              type=\"button\"\n              class=\"tpl:flex tpl:h-8 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded tpl:border-none tpl:bg-transparent tpl:px-2.5 tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text)] tpl:transition-all tpl:hover:bg-[var(--tpl-bg-active)]\"\n              :aria-label=\"t.mergeTag.insert\"\n              :title=\"t.mergeTag.insert\"\n              @click=\"emit('add-merge-tag')\"\n            >\n              <ScanLine :size=\"16\" :stroke-width=\"2\" />\n              {{ t.mergeTag.insertShort }}\n            </button>\n          </template>\n          <template v-if=\"canInsertLogicTag\">\n            <ToolbarSeparator />\n            <button\n              type=\"button\"\n              class=\"tpl:flex tpl:h-8 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded tpl:border-none tpl:bg-transparent tpl:px-2.5 tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text)] tpl:transition-all tpl:hover:bg-[var(--tpl-bg-active)]\"\n              :aria-label=\"t.logicTag.insert\"\n              :title=\"t.logicTag.insert\"\n              data-testid=\"insert-logic-button\"\n              @click=\"emit('add-logic-tag')\"\n            >\n              <Braces :size=\"16\" :stroke-width=\"2\" />\n              {{ t.logicTag.insertShort }}\n            </button>\n          </template>\n        </div>\n      </template>\n      <template v-else>\n        <div\n          class=\"tpl:flex tpl:items-center tpl:gap-2 tpl:px-2 tpl:text-xs tpl:text-[var(--tpl-text-dim)]\"\n        >\n          <LoaderCircle class=\"tpl-spinner\" :size=\"14\" :stroke-width=\"2\" />\n          {{ t.errors.editorLoading }}\n        </div>\n      </template>\n    </div>\n  </Teleport>\n</template>\n","<script setup lang=\"ts\">\nimport { useRichTextEditor } from \"../../composables/useRichTextEditor\";\nimport { usePopoverRoot } from \"../../composables/usePopoverRoot\";\nimport {\n  resolveContentDirection,\n  type ParagraphBlock as ParagraphBlockType,\n} from \"@templatical/types\";\nimport { inject } from \"vue\";\nimport { EDITOR_KEY } from \"../../keys\";\nimport ParagraphToolbar from \"./ParagraphToolbar.vue\";\nimport RichTextLinkDialog from \"./RichTextLinkDialog.vue\";\nimport RichTextEditorContent from \"./RichTextEditorContent.vue\";\nimport { withLinkColor } from \"../../utils/linkColorExtension\";\n\nconst props = defineProps<{\n  block: ParagraphBlockType;\n  toolbarPosition: { top: number; left: number };\n}>();\n\nconst emit = defineEmits<{\n  (e: \"done\"): void;\n}>();\n\nconst popoverRoot = usePopoverRoot();\nconst emailEditor = inject(EDITOR_KEY, null);\nconst defaultAlignment =\n  resolveContentDirection(\n    emailEditor?.content?.value?.settings ?? { locale: \"en\" },\n  ) === \"rtl\"\n    ? \"right\"\n    : \"left\";\n\nconst {\n  editor,\n  EditorContent,\n  isLoading,\n  initError,\n  retry,\n  showLinkDialog,\n  linkUrl,\n  linkColor,\n  linkDialogRef,\n  canRequestMergeTag,\n  canInsertLogicTag,\n  openLinkDialog,\n  insertLink,\n  removeLink,\n  closeLinkDialog,\n  handleLinkKeydown,\n  handleAddMergeTag,\n  handleAddLogicTag,\n} = useRichTextEditor({\n  blockId: () => props.block.id,\n  blockContent: () => props.block.content,\n  onDone: () => emit(\"done\"),\n  editorName: \"ParagraphEditor\",\n  async loadExtensions({\n    mergeTags,\n    syntax,\n    triggerChar,\n    autocompleteEnabled,\n    suggestionEmptyText,\n  }) {\n    const [\n      { Editor: TiptapEditor, EditorContent: EC },\n      { default: StarterKit },\n      { default: LinkExt },\n      { default: UnderlineExt },\n      { default: SubscriptExt },\n      { default: SuperscriptExt },\n      { default: TextAlign },\n      { TextStyle },\n      { default: Color },\n      { default: FontFamily },\n      { default: Highlight },\n      {\n        MergeTagNode,\n        MergeTagSuggestion,\n        LogicMergeTagNode,\n        FontSize,\n        LineHeight,\n        LetterSpacing,\n        LineBoundaryKeys,\n      },\n    ] = await Promise.all([\n      import(\"@tiptap/vue-3\"),\n      import(\"@tiptap/starter-kit\"),\n      import(\"@tiptap/extension-link\"),\n      import(\"@tiptap/extension-underline\"),\n      import(\"@tiptap/extension-subscript\"),\n      import(\"@tiptap/extension-superscript\"),\n      import(\"@tiptap/extension-text-align\"),\n      import(\"@tiptap/extension-text-style\"),\n      import(\"@tiptap/extension-color\"),\n      import(\"@tiptap/extension-font-family\"),\n      import(\"@tiptap/extension-highlight\"),\n      import(\"../../extensions\"),\n    ]);\n\n    return {\n      TiptapEditor,\n      EC,\n      extensions: [\n        StarterKit.configure({\n          heading: false,\n          codeBlock: false,\n          blockquote: false,\n          horizontalRule: false,\n          // StarterKit bundles @tiptap/extension-link (openOnClick: true).\n          // Disable it so the LinkExt below (openOnClick: false) is the only\n          // link extension — otherwise clicking a link while editing opens it.\n          link: false,\n          // StarterKit also bundles @tiptap/extension-underline; the editor\n          // registers its own UnderlineExt below, so disable StarterKit's copy\n          // to avoid a duplicate `underline` extension (and its console warning).\n          underline: false,\n        }),\n        UnderlineExt,\n        SubscriptExt,\n        SuperscriptExt,\n        withLinkColor(LinkExt).configure({\n          openOnClick: false,\n          HTMLAttributes: {\n            target: \"_blank\",\n            rel: \"noopener noreferrer\",\n          },\n        }),\n        TextAlign.configure({\n          types: [\"paragraph\"],\n          defaultAlignment,\n        }),\n        TextStyle,\n        Color,\n        FontFamily,\n        Highlight.configure({ multicolor: true }),\n        FontSize,\n        LineHeight,\n        LetterSpacing,\n        // The getter, not `mergeTags.value`: a snapshot here would pin the\n        // extension to the list as it stood when this block opened.\n        MergeTagNode.configure({ mergeTags: () => mergeTags.value, syntax }),\n        LogicMergeTagNode.configure({ syntax }),\n        LineBoundaryKeys,\n        // Registration is decided here, when the block opens for editing, so a\n        // list that goes from empty to populated enables type-ahead for the\n        // next block opened rather than this one. Deliberate: registering\n        // unconditionally would show the suggestion popup to consumers who\n        // configured no tags at all.\n        ...(autocompleteEnabled && triggerChar && mergeTags.value.length > 0\n          ? [\n              MergeTagSuggestion.configure({\n                mergeTags: () => mergeTags.value,\n                char: triggerChar,\n                emptyText: suggestionEmptyText,\n                popoverRoot,\n              }),\n            ]\n          : []),\n      ],\n    };\n  },\n});\n</script>\n\n<template>\n  <div class=\"tpl-text-editor-wrapper tpl:relative\">\n    <ParagraphToolbar\n      :editor=\"editor\"\n      :toolbar-position=\"toolbarPosition\"\n      :is-loading=\"isLoading\"\n      :can-request-merge-tag=\"canRequestMergeTag\"\n      :can-insert-logic-tag=\"canInsertLogicTag\"\n      @open-link-dialog=\"openLinkDialog\"\n      @add-merge-tag=\"handleAddMergeTag\"\n      @add-logic-tag=\"handleAddLogicTag\"\n    />\n\n    <RichTextEditorContent\n      :editor=\"editor\"\n      :editor-content=\"EditorContent\"\n      :is-loading=\"isLoading\"\n      :init-error=\"initError\"\n      @retry=\"retry\"\n    />\n\n    <RichTextLinkDialog\n      :visible=\"showLinkDialog\"\n      :is-editing-link=\"editor?.isActive('link') ?? false\"\n      v-model:dialog-ref=\"linkDialogRef\"\n      v-model:link-url=\"linkUrl\"\n      v-model:link-color=\"linkColor\"\n      @close=\"closeLinkDialog\"\n      @insert=\"insertLink\"\n      @remove=\"removeLink\"\n      @keydown=\"handleLinkKeydown\"\n    />\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { useRichTextEditor } from \"../../composables/useRichTextEditor\";\nimport { usePopoverRoot } from \"../../composables/usePopoverRoot\";\nimport {\n  resolveContentDirection,\n  type ParagraphBlock as ParagraphBlockType,\n} from \"@templatical/types\";\nimport { inject } from \"vue\";\nimport { EDITOR_KEY } from \"../../keys\";\nimport ParagraphToolbar from \"./ParagraphToolbar.vue\";\nimport RichTextLinkDialog from \"./RichTextLinkDialog.vue\";\nimport RichTextEditorContent from \"./RichTextEditorContent.vue\";\nimport { withLinkColor } from \"../../utils/linkColorExtension\";\n\nconst props = defineProps<{\n  block: ParagraphBlockType;\n  toolbarPosition: { top: number; left: number };\n}>();\n\nconst emit = defineEmits<{\n  (e: \"done\"): void;\n}>();\n\nconst popoverRoot = usePopoverRoot();\nconst emailEditor = inject(EDITOR_KEY, null);\nconst defaultAlignment =\n  resolveContentDirection(\n    emailEditor?.content?.value?.settings ?? { locale: \"en\" },\n  ) === \"rtl\"\n    ? \"right\"\n    : \"left\";\n\nconst {\n  editor,\n  EditorContent,\n  isLoading,\n  initError,\n  retry,\n  showLinkDialog,\n  linkUrl,\n  linkColor,\n  linkDialogRef,\n  canRequestMergeTag,\n  canInsertLogicTag,\n  openLinkDialog,\n  insertLink,\n  removeLink,\n  closeLinkDialog,\n  handleLinkKeydown,\n  handleAddMergeTag,\n  handleAddLogicTag,\n} = useRichTextEditor({\n  blockId: () => props.block.id,\n  blockContent: () => props.block.content,\n  onDone: () => emit(\"done\"),\n  editorName: \"ParagraphEditor\",\n  async loadExtensions({\n    mergeTags,\n    syntax,\n    triggerChar,\n    autocompleteEnabled,\n    suggestionEmptyText,\n  }) {\n    const [\n      { Editor: TiptapEditor, EditorContent: EC },\n      { default: StarterKit },\n      { default: LinkExt },\n      { default: UnderlineExt },\n      { default: SubscriptExt },\n      { default: SuperscriptExt },\n      { default: TextAlign },\n      { TextStyle },\n      { default: Color },\n      { default: FontFamily },\n      { default: Highlight },\n      {\n        MergeTagNode,\n        MergeTagSuggestion,\n        LogicMergeTagNode,\n        FontSize,\n        LineHeight,\n        LetterSpacing,\n        LineBoundaryKeys,\n      },\n    ] = await Promise.all([\n      import(\"@tiptap/vue-3\"),\n      import(\"@tiptap/starter-kit\"),\n      import(\"@tiptap/extension-link\"),\n      import(\"@tiptap/extension-underline\"),\n      import(\"@tiptap/extension-subscript\"),\n      import(\"@tiptap/extension-superscript\"),\n      import(\"@tiptap/extension-text-align\"),\n      import(\"@tiptap/extension-text-style\"),\n      import(\"@tiptap/extension-color\"),\n      import(\"@tiptap/extension-font-family\"),\n      import(\"@tiptap/extension-highlight\"),\n      import(\"../../extensions\"),\n    ]);\n\n    return {\n      TiptapEditor,\n      EC,\n      extensions: [\n        StarterKit.configure({\n          heading: false,\n          codeBlock: false,\n          blockquote: false,\n          horizontalRule: false,\n          // StarterKit bundles @tiptap/extension-link (openOnClick: true).\n          // Disable it so the LinkExt below (openOnClick: false) is the only\n          // link extension — otherwise clicking a link while editing opens it.\n          link: false,\n          // StarterKit also bundles @tiptap/extension-underline; the editor\n          // registers its own UnderlineExt below, so disable StarterKit's copy\n          // to avoid a duplicate `underline` extension (and its console warning).\n          underline: false,\n        }),\n        UnderlineExt,\n        SubscriptExt,\n        SuperscriptExt,\n        withLinkColor(LinkExt).configure({\n          openOnClick: false,\n          HTMLAttributes: {\n            target: \"_blank\",\n            rel: \"noopener noreferrer\",\n          },\n        }),\n        TextAlign.configure({\n          types: [\"paragraph\"],\n          defaultAlignment,\n        }),\n        TextStyle,\n        Color,\n        FontFamily,\n        Highlight.configure({ multicolor: true }),\n        FontSize,\n        LineHeight,\n        LetterSpacing,\n        // The getter, not `mergeTags.value`: a snapshot here would pin the\n        // extension to the list as it stood when this block opened.\n        MergeTagNode.configure({ mergeTags: () => mergeTags.value, syntax }),\n        LogicMergeTagNode.configure({ syntax }),\n        LineBoundaryKeys,\n        // Registration is decided here, when the block opens for editing, so a\n        // list that goes from empty to populated enables type-ahead for the\n        // next block opened rather than this one. Deliberate: registering\n        // unconditionally would show the suggestion popup to consumers who\n        // configured no tags at all.\n        ...(autocompleteEnabled && triggerChar && mergeTags.value.length > 0\n          ? [\n              MergeTagSuggestion.configure({\n                mergeTags: () => mergeTags.value,\n                char: triggerChar,\n                emptyText: suggestionEmptyText,\n                popoverRoot,\n              }),\n            ]\n          : []),\n      ],\n    };\n  },\n});\n</script>\n\n<template>\n  <div class=\"tpl-text-editor-wrapper tpl:relative\">\n    <ParagraphToolbar\n      :editor=\"editor\"\n      :toolbar-position=\"toolbarPosition\"\n      :is-loading=\"isLoading\"\n      :can-request-merge-tag=\"canRequestMergeTag\"\n      :can-insert-logic-tag=\"canInsertLogicTag\"\n      @open-link-dialog=\"openLinkDialog\"\n      @add-merge-tag=\"handleAddMergeTag\"\n      @add-logic-tag=\"handleAddLogicTag\"\n    />\n\n    <RichTextEditorContent\n      :editor=\"editor\"\n      :editor-content=\"EditorContent\"\n      :is-loading=\"isLoading\"\n      :init-error=\"initError\"\n      @retry=\"retry\"\n    />\n\n    <RichTextLinkDialog\n      :visible=\"showLinkDialog\"\n      :is-editing-link=\"editor?.isActive('link') ?? false\"\n      v-model:dialog-ref=\"linkDialogRef\"\n      v-model:link-url=\"linkUrl\"\n      v-model:link-color=\"linkColor\"\n      @close=\"closeLinkDialog\"\n      @insert=\"insertLink\"\n      @remove=\"removeLink\"\n      @keydown=\"handleLinkKeydown\"\n    />\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/cdn/chunks/{RestoreVersionDialog-CzZ_sFnz.js → RestoreVersionDialog-C-dwbb7T.js}

@@ -2,7 +2,7 @@ import { H as e, N as t, S as n, at as r, b as i, ct as a, g as o, h as s, m as
 import { t as f } from "./useI18n-DTZ9sIcv.js";
 import { it as p, u as m } from "./icons-BKkJ-5xF.js";
 import { d as h, v as g, x as _ } from "./styleConstants-C_YAPdQS.js";
-import { t as v } from "./TplModal-DuwS2ifK.js";
+import { t as v } from "./TplModal-BKqDFLq3.js";
 //#region src/components/RestoreVersionDialog.vue?vue&type=script&setup=true&lang.ts
 var y = ["aria-busy"], b = { class: "tpl:flex tpl:items-center tpl:gap-2" }, x = {
 	id: "tpl-restore-version-title",
@@ -84,4 +84,4 @@ var y = ["aria-busy"], b = { class: "tpl:flex tpl:items-center tpl:gap-2" }, x =
 //#endregion
 export { D as default };
 
-//# sourceMappingURL=RestoreVersionDialog-CzZ_sFnz.js.map
+//# sourceMappingURL=RestoreVersionDialog-C-dwbb7T.js.map

package/dist/cdn/chunks/{RestoreVersionDialog-CzZ_sFnz.js.map → RestoreVersionDialog-C-dwbb7T.js.map}

@@ -1 +1 @@
-{"version":3,"file":"RestoreVersionDialog-CzZ_sFnz.js","names":[],"sources":["../../../src/components/RestoreVersionDialog.vue","../../../src/components/RestoreVersionDialog.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  dangerBtnClass,\n  primaryBtnClass,\n  secondaryBtnClass,\n} from \"../constants/styleConstants\";\n/**\n * Confirms a restore that would discard unsaved work.\n *\n * It exists because `confirmRestore()` throws away the pre-preview backup: once\n * a restore lands, anything the user had not saved exists nowhere. The editor\n * does not record a version to cover that — it never authors versions — so the\n * protection is a question asked at the moment of loss, with the option to put\n * the work somewhere real first.\n *\n * `canSave` decides which of the two shapes renders: an offer to save first, or\n * a plain warning when the templates provider withheld `save` (or there is no\n * templates provider at all), because there is then nowhere to put the work.\n */\nimport { AlertTriangle, LoaderCircle } from \"@lucide/vue\";\nimport TplModal from \"./TplModal.vue\";\nimport { useI18n } from \"../composables/useI18n\";\n\ndefineProps<{\n  visible: boolean;\n  /** Whether \"save first\" can be offered rather than only a warning. */\n  canSave: boolean;\n  /** True while either action is in flight — both buttons go inert. */\n  isBusy: boolean;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"cancel\"): void;\n  (e: \"save-and-restore\"): void;\n  (e: \"discard-and-restore\"): void;\n}>();\n\nconst { t } = useI18n();\n</script>\n\n<template>\n  <TplModal :visible=\"visible\" @close=\"emit('cancel')\">\n    <div\n      role=\"alertdialog\"\n      aria-modal=\"true\"\n      :aria-busy=\"isBusy\"\n      aria-labelledby=\"tpl-restore-version-title\"\n      aria-describedby=\"tpl-restore-version-body\"\n      data-testid=\"restore-version-dialog\"\n      class=\"tpl-scale-in tpl:flex tpl:max-h-[90%] tpl:w-full tpl:max-w-md tpl:flex-col tpl:gap-4 tpl:overflow-y-auto tpl:rounded-[var(--tpl-radius-lg)] tpl:p-5\"\n      style=\"\n        background-color: var(--tpl-bg-elevated);\n        box-shadow: var(--tpl-shadow-xl);\n      \"\n    >\n      <div class=\"tpl:flex tpl:items-center tpl:gap-2\">\n        <AlertTriangle\n          :size=\"18\"\n          :stroke-width=\"2\"\n          class=\"tpl:text-[var(--tpl-warning)]\"\n        />\n        <h3\n          id=\"tpl-restore-version-title\"\n          class=\"tpl:m-0 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]\"\n        >\n          {{ t.versionPreview.restoreConfirm.title }}\n        </h3>\n      </div>\n\n      <p\n        id=\"tpl-restore-version-body\"\n        class=\"tpl:m-0 tpl:text-sm tpl:text-[var(--tpl-text-muted)]\"\n      >\n        {{\n          canSave\n            ? t.versionPreview.restoreConfirm.unsavedWithSave\n            : t.versionPreview.restoreConfirm.unsavedNoSave\n        }}\n      </p>\n\n      <div class=\"tpl:flex tpl:justify-end tpl:gap-2\">\n        <button\n          type=\"button\"\n          data-testid=\"restore-version-cancel\"\n          :class=\"secondaryBtnClass\"\n          :disabled=\"isBusy\"\n          @click=\"emit('cancel')\"\n        >\n          {{ t.versionPreview.restoreConfirm.cancel }}\n        </button>\n        <button\n          type=\"button\"\n          data-testid=\"restore-version-discard\"\n          :class=\"dangerBtnClass\"\n          :disabled=\"isBusy\"\n          @click=\"emit('discard-and-restore')\"\n        >\n          {{ t.versionPreview.restoreConfirm.restoreAnyway }}\n        </button>\n        <!-- Only rendered when there is somewhere to save to: an action the\n             editor cannot perform should not look like one you could take. -->\n        <button\n          v-if=\"canSave\"\n          type=\"button\"\n          data-testid=\"restore-version-save-first\"\n          :class=\"primaryBtnClass\"\n          :disabled=\"isBusy\"\n          @click=\"emit('save-and-restore')\"\n        >\n          <LoaderCircle\n            v-if=\"isBusy\"\n            class=\"tpl:animate-spin\"\n            :size=\"12\"\n            :stroke-width=\"2\"\n          />\n          {{ t.versionPreview.restoreConfirm.saveAndRestore }}\n        </button>\n      </div>\n    </div>\n  </TplModal>\n</template>\n","<script setup lang=\"ts\">\nimport {\n  dangerBtnClass,\n  primaryBtnClass,\n  secondaryBtnClass,\n} from \"../constants/styleConstants\";\n/**\n * Confirms a restore that would discard unsaved work.\n *\n * It exists because `confirmRestore()` throws away the pre-preview backup: once\n * a restore lands, anything the user had not saved exists nowhere. The editor\n * does not record a version to cover that — it never authors versions — so the\n * protection is a question asked at the moment of loss, with the option to put\n * the work somewhere real first.\n *\n * `canSave` decides which of the two shapes renders: an offer to save first, or\n * a plain warning when the templates provider withheld `save` (or there is no\n * templates provider at all), because there is then nowhere to put the work.\n */\nimport { AlertTriangle, LoaderCircle } from \"@lucide/vue\";\nimport TplModal from \"./TplModal.vue\";\nimport { useI18n } from \"../composables/useI18n\";\n\ndefineProps<{\n  visible: boolean;\n  /** Whether \"save first\" can be offered rather than only a warning. */\n  canSave: boolean;\n  /** True while either action is in flight — both buttons go inert. */\n  isBusy: boolean;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"cancel\"): void;\n  (e: \"save-and-restore\"): void;\n  (e: \"discard-and-restore\"): void;\n}>();\n\nconst { t } = useI18n();\n</script>\n\n<template>\n  <TplModal :visible=\"visible\" @close=\"emit('cancel')\">\n    <div\n      role=\"alertdialog\"\n      aria-modal=\"true\"\n      :aria-busy=\"isBusy\"\n      aria-labelledby=\"tpl-restore-version-title\"\n      aria-describedby=\"tpl-restore-version-body\"\n      data-testid=\"restore-version-dialog\"\n      class=\"tpl-scale-in tpl:flex tpl:max-h-[90%] tpl:w-full tpl:max-w-md tpl:flex-col tpl:gap-4 tpl:overflow-y-auto tpl:rounded-[var(--tpl-radius-lg)] tpl:p-5\"\n      style=\"\n        background-color: var(--tpl-bg-elevated);\n        box-shadow: var(--tpl-shadow-xl);\n      \"\n    >\n      <div class=\"tpl:flex tpl:items-center tpl:gap-2\">\n        <AlertTriangle\n          :size=\"18\"\n          :stroke-width=\"2\"\n          class=\"tpl:text-[var(--tpl-warning)]\"\n        />\n        <h3\n          id=\"tpl-restore-version-title\"\n          class=\"tpl:m-0 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]\"\n        >\n          {{ t.versionPreview.restoreConfirm.title }}\n        </h3>\n      </div>\n\n      <p\n        id=\"tpl-restore-version-body\"\n        class=\"tpl:m-0 tpl:text-sm tpl:text-[var(--tpl-text-muted)]\"\n      >\n        {{\n          canSave\n            ? t.versionPreview.restoreConfirm.unsavedWithSave\n            : t.versionPreview.restoreConfirm.unsavedNoSave\n        }}\n      </p>\n\n      <div class=\"tpl:flex tpl:justify-end tpl:gap-2\">\n        <button\n          type=\"button\"\n          data-testid=\"restore-version-cancel\"\n          :class=\"secondaryBtnClass\"\n          :disabled=\"isBusy\"\n          @click=\"emit('cancel')\"\n        >\n          {{ t.versionPreview.restoreConfirm.cancel }}\n        </button>\n        <button\n          type=\"button\"\n          data-testid=\"restore-version-discard\"\n          :class=\"dangerBtnClass\"\n          :disabled=\"isBusy\"\n          @click=\"emit('discard-and-restore')\"\n        >\n          {{ t.versionPreview.restoreConfirm.restoreAnyway }}\n        </button>\n        <!-- Only rendered when there is somewhere to save to: an action the\n             editor cannot perform should not look like one you could take. -->\n        <button\n          v-if=\"canSave\"\n          type=\"button\"\n          data-testid=\"restore-version-save-first\"\n          :class=\"primaryBtnClass\"\n          :disabled=\"isBusy\"\n          @click=\"emit('save-and-restore')\"\n        >\n          <LoaderCircle\n            v-if=\"isBusy\"\n            class=\"tpl:animate-spin\"\n            :size=\"12\"\n            :stroke-width=\"2\"\n          />\n          {{ t.versionPreview.restoreConfirm.saveAndRestore }}\n        </button>\n      </div>\n    </div>\n  </TplModal>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;EA+BA,IAAM,IAAO,GAMP,EAAE,SAAM,EAAQ;oBAIpB,EAAA,GAAA,EA8EW,GAAA;GA9EA,SAAS,EAAA;GAAU,SAAK,AAAA,EAAA,QAAA,MAAE,EAAI,QAAA;;GACvC,SAAA,QA4EM,CA5EN,EA4EM,OAAA;IA3EJ,MAAK;IACL,cAAW;IACV,aAAW,EAAA;IACZ,mBAAgB;IAChB,oBAAiB;IACjB,eAAY;IACZ,OAAM;IACN,OAAA;KAAA,oBAAA;KAAA,cAAA;IAAA;;IAKA,EAYM,OAZN,GAYM,CAXJ,EAIE,EAAA,CAAA,GAAA;KAHC,MAAM;KACN,gBAAc;KACf,OAAM;IAER,CAAA,GAAA,EAKK,MALL,GAKK,EADA,EAAA,CAAA,CAAC,CAAC,eAAe,eAAe,KAAK,GAAA,CAAA,CAAA,CAAA;IAI5C,EASI,KATJ,GASI,EAJA,EAAA,UAAsB,EAAA,CAAA,CAAC,CAAC,eAAe,eAAe,kBAA8B,EAAA,CAAA,CAAC,CAAC,eAAe,eAAe,aAAa,GAAA,CAAA;IAMrI,EAqCM,OArCN,GAqCM;KApCJ,EAQS,UAAA;MAPP,MAAK;MACL,eAAY;MACX,OAAK,EAAE,EAAA,CAAA,CAAiB;MACxB,UAAU,EAAA;MACV,SAAK,AAAA,EAAA,QAAA,MAAE,EAAI,QAAA;KAET,GAAA,EAAA,EAAA,CAAA,CAAC,CAAC,eAAe,eAAe,MAAM,GAAA,IAAA,CAAA;KAE3C,EAQS,UAAA;MAPP,MAAK;MACL,eAAY;MACX,OAAK,EAAE,EAAA,CAAA,CAAc;MACrB,UAAU,EAAA;MACV,SAAK,AAAA,EAAA,QAAA,MAAE,EAAI,qBAAA;KAET,GAAA,EAAA,EAAA,CAAA,CAAC,CAAC,eAAe,eAAe,aAAa,GAAA,IAAA,CAAA;KAK1C,EAAA,WADR,EAAA,GAAA,EAeS,UAAA;;MAbP,MAAK;MACL,eAAY;MACX,OAAK,EAAE,EAAA,CAAA,CAAe;MACtB,UAAU,EAAA;MACV,SAAK,AAAA,EAAA,QAAA,MAAE,EAAI,kBAAA;KAGJ,GAAA,CAAA,EAAA,UADR,EAAA,GAAA,EAKE,EAAA,CAAA,GAAA;;MAHA,OAAM;MACL,MAAM;MACN,gBAAc;KACf,CAAA,KAAA,EAAA,IAAA,EAAA,GAAA,EAAA,MACF,EAAG,EAAA,CAAA,CAAC,CAAC,eAAe,eAAe,cAAc,GAAA,CAAA,CAAA,GAAA,IAAA,CAAA,KAAA,EAAA,IAAA,EAAA"}
+{"version":3,"file":"RestoreVersionDialog-C-dwbb7T.js","names":[],"sources":["../../../src/components/RestoreVersionDialog.vue","../../../src/components/RestoreVersionDialog.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  dangerBtnClass,\n  primaryBtnClass,\n  secondaryBtnClass,\n} from \"../constants/styleConstants\";\n/**\n * Confirms a restore that would discard unsaved work.\n *\n * It exists because `confirmRestore()` throws away the pre-preview backup: once\n * a restore lands, anything the user had not saved exists nowhere. The editor\n * does not record a version to cover that — it never authors versions — so the\n * protection is a question asked at the moment of loss, with the option to put\n * the work somewhere real first.\n *\n * `canSave` decides which of the two shapes renders: an offer to save first, or\n * a plain warning when the templates provider withheld `save` (or there is no\n * templates provider at all), because there is then nowhere to put the work.\n */\nimport { AlertTriangle, LoaderCircle } from \"@lucide/vue\";\nimport TplModal from \"./TplModal.vue\";\nimport { useI18n } from \"../composables/useI18n\";\n\ndefineProps<{\n  visible: boolean;\n  /** Whether \"save first\" can be offered rather than only a warning. */\n  canSave: boolean;\n  /** True while either action is in flight — both buttons go inert. */\n  isBusy: boolean;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"cancel\"): void;\n  (e: \"save-and-restore\"): void;\n  (e: \"discard-and-restore\"): void;\n}>();\n\nconst { t } = useI18n();\n</script>\n\n<template>\n  <TplModal :visible=\"visible\" @close=\"emit('cancel')\">\n    <div\n      role=\"alertdialog\"\n      aria-modal=\"true\"\n      :aria-busy=\"isBusy\"\n      aria-labelledby=\"tpl-restore-version-title\"\n      aria-describedby=\"tpl-restore-version-body\"\n      data-testid=\"restore-version-dialog\"\n      class=\"tpl-scale-in tpl:flex tpl:max-h-[90%] tpl:w-full tpl:max-w-md tpl:flex-col tpl:gap-4 tpl:overflow-y-auto tpl:rounded-[var(--tpl-radius-lg)] tpl:p-5\"\n      style=\"\n        background-color: var(--tpl-bg-elevated);\n        box-shadow: var(--tpl-shadow-xl);\n      \"\n    >\n      <div class=\"tpl:flex tpl:items-center tpl:gap-2\">\n        <AlertTriangle\n          :size=\"18\"\n          :stroke-width=\"2\"\n          class=\"tpl:text-[var(--tpl-warning)]\"\n        />\n        <h3\n          id=\"tpl-restore-version-title\"\n          class=\"tpl:m-0 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]\"\n        >\n          {{ t.versionPreview.restoreConfirm.title }}\n        </h3>\n      </div>\n\n      <p\n        id=\"tpl-restore-version-body\"\n        class=\"tpl:m-0 tpl:text-sm tpl:text-[var(--tpl-text-muted)]\"\n      >\n        {{\n          canSave\n            ? t.versionPreview.restoreConfirm.unsavedWithSave\n            : t.versionPreview.restoreConfirm.unsavedNoSave\n        }}\n      </p>\n\n      <div class=\"tpl:flex tpl:justify-end tpl:gap-2\">\n        <button\n          type=\"button\"\n          data-testid=\"restore-version-cancel\"\n          :class=\"secondaryBtnClass\"\n          :disabled=\"isBusy\"\n          @click=\"emit('cancel')\"\n        >\n          {{ t.versionPreview.restoreConfirm.cancel }}\n        </button>\n        <button\n          type=\"button\"\n          data-testid=\"restore-version-discard\"\n          :class=\"dangerBtnClass\"\n          :disabled=\"isBusy\"\n          @click=\"emit('discard-and-restore')\"\n        >\n          {{ t.versionPreview.restoreConfirm.restoreAnyway }}\n        </button>\n        <!-- Only rendered when there is somewhere to save to: an action the\n             editor cannot perform should not look like one you could take. -->\n        <button\n          v-if=\"canSave\"\n          type=\"button\"\n          data-testid=\"restore-version-save-first\"\n          :class=\"primaryBtnClass\"\n          :disabled=\"isBusy\"\n          @click=\"emit('save-and-restore')\"\n        >\n          <LoaderCircle\n            v-if=\"isBusy\"\n            class=\"tpl:animate-spin\"\n            :size=\"12\"\n            :stroke-width=\"2\"\n          />\n          {{ t.versionPreview.restoreConfirm.saveAndRestore }}\n        </button>\n      </div>\n    </div>\n  </TplModal>\n</template>\n","<script setup lang=\"ts\">\nimport {\n  dangerBtnClass,\n  primaryBtnClass,\n  secondaryBtnClass,\n} from \"../constants/styleConstants\";\n/**\n * Confirms a restore that would discard unsaved work.\n *\n * It exists because `confirmRestore()` throws away the pre-preview backup: once\n * a restore lands, anything the user had not saved exists nowhere. The editor\n * does not record a version to cover that — it never authors versions — so the\n * protection is a question asked at the moment of loss, with the option to put\n * the work somewhere real first.\n *\n * `canSave` decides which of the two shapes renders: an offer to save first, or\n * a plain warning when the templates provider withheld `save` (or there is no\n * templates provider at all), because there is then nowhere to put the work.\n */\nimport { AlertTriangle, LoaderCircle } from \"@lucide/vue\";\nimport TplModal from \"./TplModal.vue\";\nimport { useI18n } from \"../composables/useI18n\";\n\ndefineProps<{\n  visible: boolean;\n  /** Whether \"save first\" can be offered rather than only a warning. */\n  canSave: boolean;\n  /** True while either action is in flight — both buttons go inert. */\n  isBusy: boolean;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"cancel\"): void;\n  (e: \"save-and-restore\"): void;\n  (e: \"discard-and-restore\"): void;\n}>();\n\nconst { t } = useI18n();\n</script>\n\n<template>\n  <TplModal :visible=\"visible\" @close=\"emit('cancel')\">\n    <div\n      role=\"alertdialog\"\n      aria-modal=\"true\"\n      :aria-busy=\"isBusy\"\n      aria-labelledby=\"tpl-restore-version-title\"\n      aria-describedby=\"tpl-restore-version-body\"\n      data-testid=\"restore-version-dialog\"\n      class=\"tpl-scale-in tpl:flex tpl:max-h-[90%] tpl:w-full tpl:max-w-md tpl:flex-col tpl:gap-4 tpl:overflow-y-auto tpl:rounded-[var(--tpl-radius-lg)] tpl:p-5\"\n      style=\"\n        background-color: var(--tpl-bg-elevated);\n        box-shadow: var(--tpl-shadow-xl);\n      \"\n    >\n      <div class=\"tpl:flex tpl:items-center tpl:gap-2\">\n        <AlertTriangle\n          :size=\"18\"\n          :stroke-width=\"2\"\n          class=\"tpl:text-[var(--tpl-warning)]\"\n        />\n        <h3\n          id=\"tpl-restore-version-title\"\n          class=\"tpl:m-0 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]\"\n        >\n          {{ t.versionPreview.restoreConfirm.title }}\n        </h3>\n      </div>\n\n      <p\n        id=\"tpl-restore-version-body\"\n        class=\"tpl:m-0 tpl:text-sm tpl:text-[var(--tpl-text-muted)]\"\n      >\n        {{\n          canSave\n            ? t.versionPreview.restoreConfirm.unsavedWithSave\n            : t.versionPreview.restoreConfirm.unsavedNoSave\n        }}\n      </p>\n\n      <div class=\"tpl:flex tpl:justify-end tpl:gap-2\">\n        <button\n          type=\"button\"\n          data-testid=\"restore-version-cancel\"\n          :class=\"secondaryBtnClass\"\n          :disabled=\"isBusy\"\n          @click=\"emit('cancel')\"\n        >\n          {{ t.versionPreview.restoreConfirm.cancel }}\n        </button>\n        <button\n          type=\"button\"\n          data-testid=\"restore-version-discard\"\n          :class=\"dangerBtnClass\"\n          :disabled=\"isBusy\"\n          @click=\"emit('discard-and-restore')\"\n        >\n          {{ t.versionPreview.restoreConfirm.restoreAnyway }}\n        </button>\n        <!-- Only rendered when there is somewhere to save to: an action the\n             editor cannot perform should not look like one you could take. -->\n        <button\n          v-if=\"canSave\"\n          type=\"button\"\n          data-testid=\"restore-version-save-first\"\n          :class=\"primaryBtnClass\"\n          :disabled=\"isBusy\"\n          @click=\"emit('save-and-restore')\"\n        >\n          <LoaderCircle\n            v-if=\"isBusy\"\n            class=\"tpl:animate-spin\"\n            :size=\"12\"\n            :stroke-width=\"2\"\n          />\n          {{ t.versionPreview.restoreConfirm.saveAndRestore }}\n        </button>\n      </div>\n    </div>\n  </TplModal>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;EA+BA,IAAM,IAAO,GAMP,EAAE,SAAM,EAAQ;oBAIpB,EAAA,GAAA,EA8EW,GAAA;GA9EA,SAAS,EAAA;GAAU,SAAK,AAAA,EAAA,QAAA,MAAE,EAAI,QAAA;;GACvC,SAAA,QA4EM,CA5EN,EA4EM,OAAA;IA3EJ,MAAK;IACL,cAAW;IACV,aAAW,EAAA;IACZ,mBAAgB;IAChB,oBAAiB;IACjB,eAAY;IACZ,OAAM;IACN,OAAA;KAAA,oBAAA;KAAA,cAAA;IAAA;;IAKA,EAYM,OAZN,GAYM,CAXJ,EAIE,EAAA,CAAA,GAAA;KAHC,MAAM;KACN,gBAAc;KACf,OAAM;IAER,CAAA,GAAA,EAKK,MALL,GAKK,EADA,EAAA,CAAA,CAAC,CAAC,eAAe,eAAe,KAAK,GAAA,CAAA,CAAA,CAAA;IAI5C,EASI,KATJ,GASI,EAJA,EAAA,UAAsB,EAAA,CAAA,CAAC,CAAC,eAAe,eAAe,kBAA8B,EAAA,CAAA,CAAC,CAAC,eAAe,eAAe,aAAa,GAAA,CAAA;IAMrI,EAqCM,OArCN,GAqCM;KApCJ,EAQS,UAAA;MAPP,MAAK;MACL,eAAY;MACX,OAAK,EAAE,EAAA,CAAA,CAAiB;MACxB,UAAU,EAAA;MACV,SAAK,AAAA,EAAA,QAAA,MAAE,EAAI,QAAA;KAET,GAAA,EAAA,EAAA,CAAA,CAAC,CAAC,eAAe,eAAe,MAAM,GAAA,IAAA,CAAA;KAE3C,EAQS,UAAA;MAPP,MAAK;MACL,eAAY;MACX,OAAK,EAAE,EAAA,CAAA,CAAc;MACrB,UAAU,EAAA;MACV,SAAK,AAAA,EAAA,QAAA,MAAE,EAAI,qBAAA;KAET,GAAA,EAAA,EAAA,CAAA,CAAC,CAAC,eAAe,eAAe,aAAa,GAAA,IAAA,CAAA;KAK1C,EAAA,WADR,EAAA,GAAA,EAeS,UAAA;;MAbP,MAAK;MACL,eAAY;MACX,OAAK,EAAE,EAAA,CAAA,CAAe;MACtB,UAAU,EAAA;MACV,SAAK,AAAA,EAAA,QAAA,MAAE,EAAI,kBAAA;KAGJ,GAAA,CAAA,EAAA,UADR,EAAA,GAAA,EAKE,EAAA,CAAA,GAAA;;MAHA,OAAM;MACL,MAAM;MACN,gBAAc;KACf,CAAA,KAAA,EAAA,IAAA,EAAA,GAAA,EAAA,MACF,EAAG,EAAA,CAAA,CAAC,CAAC,eAAe,eAAe,cAAc,GAAA,CAAA,CAAA,GAAA,IAAA,CAAA,KAAA,EAAA,IAAA,EAAA"}

package/dist/cdn/chunks/{SaveBlockDialog-LgxYrXyx.js → SaveBlockDialog-C_BPjVv6.js}

@@ -1,13 +1,13 @@
 import { A as e, B as t, E as n, F as r, H as i, N as a, Q as o, R as s, S as c, U as l, at as u, b as d, c as f, ct as p, f as m, g as h, h as g, j as _, l as v, lt as y, m as b, o as x, p as S, t as ee, u as C, ut as w, y as T } from "./draggable-IB4x6w2O.js";
 import { o as E } from "./socialIcons-9VrG8X3m.js";
-import "./useEditorCore-BHmIp1hW.js";
+import "./useEditorCore-CXYI14ux.js";
 import { H as D, Z as O, g as k, p as A } from "./keys-dJbD1QPs.js";
 import { t as te } from "./useI18n-DTZ9sIcv.js";
 import { It as j, Nt as M, ht as N, it as P } from "./icons-BKkJ-5xF.js";
 import { v as F } from "./styleConstants-C_YAPdQS.js";
 import { n as I } from "./emailFrameWidth-BmFCN2dp.js";
-import { t as L } from "./TplModal-DuwS2ifK.js";
-import { t as R } from "./BlockPreviewCanvas-lQrAdgG3.js";
+import { t as L } from "./TplModal-BKqDFLq3.js";
+import { t as R } from "./BlockPreviewCanvas-DeS7Sa--.js";
 //#region src/components/SavedBlockPreviewRow.vue?vue&type=script&setup=true&lang.ts
 var z = ["data-block-id"], B = ["aria-label", "title"], V = { class: "tpl:relative tpl:min-w-0 tpl:flex-1" }, H = {
 	key: 0,
@@ -99,7 +99,7 @@ var z = ["data-block-id"], B = ["aria-label", "title"], V = { class: "tpl:relati
 	class: "tpl:mb-1.5 tpl:shrink-0 tpl:text-xs tpl:text-[var(--tpl-text-muted)]"
 }, se = { class: "tpl:text-[var(--tpl-text-dim)]" }, ce = {
 	key: 0,
-	class: "tpl:mb-1.5 tpl:shrink-0 tpl:text-[11px] tpl:text-[var(--tpl-text-dim)]"
+	class: "tpl:mb-1.5 tpl:shrink-0 tpl:text-[10px] tpl:text-[var(--tpl-text-dim)]"
 }, le = {
 	class: "tpl-sr-only",
 	role: "status",
@@ -190,7 +190,7 @@ var z = ["data-block-id"], B = ["aria-label", "title"], V = { class: "tpl:relati
 					type: "text",
 					"data-testid": "saved-blocks-name-input",
 					placeholder: u(_).savedBlocks.namePlaceholder,
-					class: "tpl:h-9 tpl:w-full tpl:rounded-md tpl:border tpl:px-3 tpl:py-1 tpl:text-sm tpl:shadow-[var(--tpl-shadow-sm)] tpl:outline-none tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:text-[var(--tpl-text)]",
+					class: "tpl:h-9 tpl:w-full tpl:rounded-md tpl:border tpl:px-3 tpl:py-1 tpl:text-sm tpl:shadow-[var(--tpl-shadow-sm)] tpl:outline-none tpl:focus:border-[var(--tpl-primary)] tpl:focus:shadow-[var(--tpl-ring)] tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:text-[var(--tpl-text)]",
 					disabled: R.value
 				}, null, 8, X), [[x, N.value]])]),
 				S("div", Z, [
@@ -202,7 +202,7 @@ var z = ["data-block-id"], B = ["aria-label", "title"], V = { class: "tpl:relati
 						"data-testid": "saved-blocks-category-input",
 						list: "tpl-saved-block-categories",
 						placeholder: u(_).savedBlocks.categoryPlaceholder,
-						class: "tpl:h-9 tpl:w-full tpl:rounded-md tpl:border tpl:px-3 tpl:py-1 tpl:text-sm tpl:shadow-[var(--tpl-shadow-sm)] tpl:outline-none tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:text-[var(--tpl-text)]",
+						class: "tpl:h-9 tpl:w-full tpl:rounded-md tpl:border tpl:px-3 tpl:py-1 tpl:text-sm tpl:shadow-[var(--tpl-shadow-sm)] tpl:outline-none tpl:focus:border-[var(--tpl-primary)] tpl:focus:shadow-[var(--tpl-ring)] tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:text-[var(--tpl-text)]",
 						disabled: R.value
 					}, null, 8, re), [[x, I.value]]),
 					S("datalist", ie, [(a(!0), h(C, null, r(u(j).categories.value, (e) => (a(), h("option", {
@@ -262,4 +262,4 @@ var z = ["data-block-id"], B = ["aria-label", "title"], V = { class: "tpl:relati
 //#endregion
 export { Q as default };
 
-//# sourceMappingURL=SaveBlockDialog-LgxYrXyx.js.map
+//# sourceMappingURL=SaveBlockDialog-C_BPjVv6.js.map