accessify-widget 0.2.19 → 0.2.21

package/dist/{index-B2FUEI0d.js → index-DlEXo7aY.js}

@@ -4760,8 +4760,8 @@ const deJson = {
   "feature.tts.desc": "Text per Klick vorlesen lassen",
   "feature.textSimplify": "Text vereinfachen",
   "feature.textSimplify.desc": "Text in Einfache Sprache umwandeln",
-  "feature.altText": "Alt-Text erzeugen",
-  "feature.altText.desc": "Bildbeschreibungen automatisch erstellen",
+  "feature.altText": "Bildbeschreibung",
+  "feature.altText.desc": "Bilder per Klick beschreiben lassen",
   "feature.autoScan": "WCAG-Prüfung",
   "feature.autoScan.desc": "Seite auf Barrierefreiheit prüfen",
   "feature.saturation": "Sättigung",
@@ -4849,8 +4849,8 @@ const enJson = {
   "feature.tts.desc": "Click any text to hear it spoken",
   "feature.textSimplify": "Simplify Text",
   "feature.textSimplify.desc": "Simplify text for easier understanding",
-  "feature.altText": "Alt-Text Generator",
-  "feature.altText.desc": "Auto-generate image descriptions",
+  "feature.altText": "Image Description",
+  "feature.altText.desc": "Click images to get AI descriptions",
   "feature.autoScan": "WCAG Scan",
   "feature.autoScan.desc": "Scan page for accessibility issues",
   "feature.saturation": "Saturation",
@@ -4997,7 +4997,7 @@ const locales = {
     "feature.pageStructure": "页面结构",
     "feature.tts": "朗读",
     "feature.textSimplify": "简化文本",
-    "feature.altText": "生成替代文本",
+    "feature.altText": "图片描述",
     "feature.autoScan": "WCAG 扫描"
   }),
   hi: withEnglish({
@@ -5040,7 +5040,7 @@ const locales = {
     "feature.pageStructure": "पेज संरचना",
     "feature.tts": "जोर से पढ़ें",
     "feature.textSimplify": "टेक्स्ट सरल करें",
-    "feature.altText": "ऑल्ट-टेक्स्ट बनाएँ",
+    "feature.altText": "चित्र विवरण",
     "feature.autoScan": "WCAG स्कैन"
   }),
   es: withEnglish({
@@ -5083,7 +5083,7 @@ const locales = {
     "feature.pageStructure": "Estructura de pagina",
     "feature.tts": "Lectura en voz alta",
     "feature.textSimplify": "Simplificar texto",
-    "feature.altText": "Generar texto alternativo",
+    "feature.altText": "Descripcion de imagen",
     "feature.autoScan": "Escaneo WCAG"
   }),
   fr: withEnglish({
@@ -5126,7 +5126,7 @@ const locales = {
     "feature.pageStructure": "Structure de page",
     "feature.tts": "Lecture audio",
     "feature.textSimplify": "Simplifier le texte",
-    "feature.altText": "Generer un texte alternatif",
+    "feature.altText": "Description d'image",
     "feature.autoScan": "Analyse WCAG"
   }),
   ar: withEnglish({
@@ -5169,7 +5169,7 @@ const locales = {
     "feature.pageStructure": "بنية الصفحة",
     "feature.tts": "القراءة بصوت عالٍ",
     "feature.textSimplify": "تبسيط النص",
-    "feature.altText": "إنشاء نص بديل",
+    "feature.altText": "وصف الصورة",
     "feature.autoScan": "فحص WCAG"
   }),
   bn: withEnglish({
@@ -5211,7 +5211,7 @@ const locales = {
     "feature.pageStructure": "পেজ স্ট্রাকচার",
     "feature.tts": "জোরে পড়া",
     "feature.textSimplify": "টেক্সট সহজ করুন",
-    "feature.altText": "অল্ট-টেক্সট তৈরি",
+    "feature.altText": "ছবির বিবরণ",
     "feature.autoScan": "WCAG স্ক্যান"
   }),
   pt: withEnglish({
@@ -5254,7 +5254,7 @@ const locales = {
     "feature.pageStructure": "Estrutura da pagina",
     "feature.tts": "Leitura em voz alta",
     "feature.textSimplify": "Simplificar texto",
-    "feature.altText": "Gerar texto alternativo",
+    "feature.altText": "Descricao da imagem",
     "feature.autoScan": "Varredura WCAG"
   }),
   ru: withEnglish({
@@ -5297,7 +5297,7 @@ const locales = {
     "feature.pageStructure": "Структура страницы",
     "feature.tts": "Озвучивание",
     "feature.textSimplify": "Упростить текст",
-    "feature.altText": "Создать alt-текст",
+    "feature.altText": "Описание изображения",
     "feature.autoScan": "Проверка WCAG"
   }),
   ur: withEnglish({
@@ -5339,7 +5339,7 @@ const locales = {
     "feature.pageStructure": "صفحہ ساخت",
     "feature.tts": "بلند آواز میں پڑھیں",
     "feature.textSimplify": "متن آسان کریں",
-    "feature.altText": "آلٹ ٹیکسٹ بنائیں",
+    "feature.altText": "تصویر کی تفصیل",
     "feature.autoScan": "WCAG اسکین"
   }),
   id: withEnglish({
@@ -5381,7 +5381,7 @@ const locales = {
     "feature.pageStructure": "Struktur halaman",
     "feature.tts": "Bacakan",
     "feature.textSimplify": "Sederhanakan teks",
-    "feature.altText": "Buat alt-text",
+    "feature.altText": "Deskripsi gambar",
     "feature.autoScan": "Pindai WCAG"
   }),
   ja: withEnglish({
@@ -5424,7 +5424,7 @@ const locales = {
     "feature.pageStructure": "ページ構造",
     "feature.tts": "読み上げ",
     "feature.textSimplify": "文章を簡単にする",
-    "feature.altText": "代替テキスト生成",
+    "feature.altText": "画像の説明",
     "feature.autoScan": "WCAG スキャン"
   }),
   pcm: withEnglish({
@@ -5466,7 +5466,7 @@ const locales = {
     "feature.pageStructure": "Page structure",
     "feature.tts": "Read aloud",
     "feature.textSimplify": "Simplify text",
-    "feature.altText": "Generate alt-text",
+    "feature.altText": "Image Description",
     "feature.autoScan": "WCAG scan"
   }),
   mr: withEnglish({
@@ -5508,7 +5508,7 @@ const locales = {
     "feature.pageStructure": "पृष्ठरचना",
     "feature.tts": "मोठ्याने वाचा",
     "feature.textSimplify": "मजकूर सोपा करा",
-    "feature.altText": "alt-text तयार करा",
+    "feature.altText": "चित्र वर्णन",
     "feature.autoScan": "WCAG स्कॅन"
   }),
   te: withEnglish({
@@ -5550,7 +5550,7 @@ const locales = {
     "feature.pageStructure": "పేజీ నిర్మాణం",
     "feature.tts": "గట్టిగా చదవండి",
     "feature.textSimplify": "టెక్స్ట్ సులభతరం చేయి",
-    "feature.altText": "alt-text రూపొందించు",
+    "feature.altText": "చిత్ర వివరణ",
     "feature.autoScan": "WCAG స్కాన్"
   }),
   tr: withEnglish({
@@ -5593,7 +5593,7 @@ const locales = {
     "feature.pageStructure": "Sayfa yapisi",
     "feature.tts": "Sesli oku",
     "feature.textSimplify": "Metni sadeletir",
-    "feature.altText": "Alt metin olustur",
+    "feature.altText": "Resim aciklamasi",
     "feature.autoScan": "WCAG taramasi"
   }),
   ta: withEnglish({
@@ -5635,7 +5635,7 @@ const locales = {
     "feature.pageStructure": "பக்க அமைப்பு",
     "feature.tts": "சத்தமாக வாசி",
     "feature.textSimplify": "உரையை எளிமைப்படுத்து",
-    "feature.altText": "alt-text உருவாக்கு",
+    "feature.altText": "பட விளக்கம்",
     "feature.autoScan": "WCAG ஸ்கேன்"
   }),
   vi: withEnglish({
@@ -5677,7 +5677,7 @@ const locales = {
     "feature.pageStructure": "Cau truc trang",
     "feature.tts": "Doc thanh tieng",
     "feature.textSimplify": "Don gian hoa van ban",
-    "feature.altText": "Tao alt-text",
+    "feature.altText": "Mo ta hinh anh",
     "feature.autoScan": "Quet WCAG"
   }),
   ko: withEnglish({
@@ -5720,7 +5720,7 @@ const locales = {
     "feature.pageStructure": "페이지 구조",
     "feature.tts": "소리 내어 읽기",
     "feature.textSimplify": "텍스트 단순화",
-    "feature.altText": "대체 텍스트 생성",
+    "feature.altText": "이미지 설명",
     "feature.autoScan": "WCAG 검사"
   })
 };
@@ -6078,6 +6078,20 @@ function createProxyService(siteKey, proxyUrl) {
       }
       const data = await res.json();
       return data.result || "";
+    },
+    async describeImage(imageUrl, lang) {
+      const res = await fetch(`${base}/v1/ai/describe-image`, {
+        method: "POST",
+        headers,
+        body: JSON.stringify({ imageUrl, lang })
+      });
+      if (!res.ok) {
+        const err = await res.json().catch(() => ({ error: `HTTP ${res.status}` }));
+        if (res.status === 429) throw new RateLimitError(err.error || "Rate limit reached");
+        throw new Error(err.error || `AI proxy error: ${res.status}`);
+      }
+      const data = await res.json();
+      return data.result || "";
     }
   };
 }
@@ -6156,6 +6170,33 @@ function createDirectService(config2) {
       }
       const data = await response.json();
       return extractContent(data);
+    },
+    async describeImage(imageUrl, lang) {
+      const langInstruction = lang && lang.startsWith("de") ? " Beschreibe auf Deutsch." : "";
+      const response = await fetch(`${OPENROUTER_BASE}/chat/completions`, {
+        method: "POST",
+        headers,
+        body: JSON.stringify({
+          model: config2.visionModel || DEFAULTS.visionModel,
+          messages: [{
+            role: "user",
+            content: [
+              {
+                type: "text",
+                text: `Describe what is shown in this image. 2-3 sentences, easy to understand.${langInstruction} Return ONLY the description.`
+              },
+              { type: "image_url", image_url: { url: imageUrl } }
+            ]
+          }],
+          max_tokens: 500
+        })
+      });
+      if (!response.ok) {
+        if (response.status === 429) throw new RateLimitError("Rate limit reached. Please try again later.");
+        throw new Error(`AI vision error: ${response.status}`);
+      }
+      const data = await response.json();
+      return extractContent(data);
     }
   };
 }
@@ -6310,14 +6351,14 @@ function FeatureGrid($$anchor, $$props) {
   const FEATURE_LOADERS = {
     contrast: () => import("./contrast-CqsICAkU.js"),
     "text-size": () => import("./text-size-C6OFhCGi.js"),
-    "keyboard-nav": () => import("./keyboard-nav-B49dNgy3.js"),
+    "keyboard-nav": () => import("./keyboard-nav-CZma_qRC.js"),
     "link-highlight": () => import("./link-highlight-DBGm067Y.js"),
     "reading-guide": () => import("./reading-guide-VT8NciIL.js"),
     "reading-mask": () => import("./reading-mask-BABChuCz.js"),
     "animation-stop": () => import("./animation-stop-C0MwseK0.js"),
     "hide-images": () => import("./hide-images-B_LeCBcd.js"),
     "big-cursor": () => import("./big-cursor-B2UKu9dQ.js"),
-    "page-structure": () => import("./page-structure-C9pDJKyf.js"),
+    "page-structure": () => import("./page-structure-DTIVV243.js"),
     tts: () => import("./tts-CjszLRnb.js"),
     "text-simplify": () => import("./text-simplify-Cvhpio7g.js"),
     "alt-text": () => Promise.resolve().then(() => altText)
@@ -7587,7 +7628,6 @@ function createWidgetStyles(config2) {
 }
 const IDB_NAME = "accessify-alt-text-cache";
 const IDB_STORE = "alt-texts";
-const IDB_REPORT_STORE = "alt-text-reports";
 const IDB_VERSION = 2;
 function hashSrc(src) {
   let hash = 5381;
@@ -7598,6 +7638,20 @@ function hashSrc(src) {
   }
   return Math.abs(hash).toString(36);
 }
+function normalizeImageUrl(url) {
+  try {
+    const u = new URL(url);
+    u.searchParams.delete("width");
+    u.searchParams.delete("height");
+    u.searchParams.delete("scale-down-to");
+    return u.href;
+  } catch {
+    return url;
+  }
+}
+function getImageSrc(img) {
+  return img.currentSrc || img.src;
+}
 function openCache() {
   return new Promise((resolve) => {
     try {
@@ -7605,7 +7659,7 @@ function openCache() {
       req.onupgradeneeded = () => {
         const db = req.result;
         if (!db.objectStoreNames.contains(IDB_STORE)) db.createObjectStore(IDB_STORE, { keyPath: "key" });
-        if (!db.objectStoreNames.contains(IDB_REPORT_STORE)) db.createObjectStore(IDB_REPORT_STORE, { keyPath: "key" });
+        if (!db.objectStoreNames.contains("alt-text-reports")) db.createObjectStore("alt-text-reports", { keyPath: "key" });
       };
       req.onsuccess = () => resolve(req.result);
       req.onerror = () => resolve(null);
@@ -7623,8 +7677,7 @@ async function getAllCachedAltTexts() {
       const tx = db.transaction(IDB_STORE, "readonly");
       const req = tx.objectStore(IDB_STORE).getAll();
       req.onsuccess = () => {
-        const results = req.result;
-        for (const r of results) {
+        for (const r of req.result) {
           map.set(r.src, r.altText);
         }
         resolve(map);
@@ -7641,9 +7694,23 @@ async function getCachedAltText(src) {
   return new Promise((resolve) => {
     try {
       const tx = db.transaction(IDB_STORE, "readonly");
-      const req = tx.objectStore(IDB_STORE).get(hashSrc(src));
-      req.onsuccess = () => resolve(req.result?.altText || null);
-      req.onerror = () => resolve(null);
+      const store = tx.objectStore(IDB_STORE);
+      const req1 = store.get(hashSrc(src));
+      req1.onsuccess = () => {
+        if (req1.result?.altText) {
+          resolve(req1.result.altText);
+          return;
+        }
+        const norm = normalizeImageUrl(src);
+        if (norm !== src) {
+          const req2 = store.get(hashSrc(norm));
+          req2.onsuccess = () => resolve(req2.result?.altText || null);
+          req2.onerror = () => resolve(null);
+        } else {
+          resolve(null);
+        }
+      };
+      req1.onerror = () => resolve(null);
     } catch {
       resolve(null);
     }
@@ -7663,41 +7730,6 @@ async function setCachedAltText(src, altText2, langCode) {
     }
   });
 }
-async function saveReport(src, altText2, langCode) {
-  const db = await openCache();
-  if (!db) return;
-  return new Promise((resolve) => {
-    try {
-      const tx = db.transaction(IDB_REPORT_STORE, "readwrite");
-      tx.objectStore(IDB_REPORT_STORE).put({
-        key: hashSrc(src) + "_" + Date.now(),
-        src,
-        pageUrl: window.location.href,
-        altText: altText2,
-        lang: langCode,
-        reportedAt: Date.now()
-      });
-      tx.oncomplete = () => resolve();
-      tx.onerror = () => resolve();
-    } catch {
-      resolve();
-    }
-  });
-}
-async function removeCachedAltText(src) {
-  const db = await openCache();
-  if (!db) return;
-  return new Promise((resolve) => {
-    try {
-      const tx = db.transaction(IDB_STORE, "readwrite");
-      tx.objectStore(IDB_STORE).delete(hashSrc(src));
-      tx.oncomplete = () => resolve();
-      tx.onerror = () => resolve();
-    } catch {
-      resolve();
-    }
-  });
-}
 const DEFAULT_API_BASE = "https://accessify-api.accessify.workers.dev";
 async function fetchServerAltTexts(siteKey, proxyUrl, lang) {
   const map = /* @__PURE__ */ new Map();
@@ -7712,9 +7744,7 @@ async function fetchServerAltTexts(siteKey, proxyUrl, lang) {
     const data = await res.json();
     if (data.blocks) {
       for (const block2 of data.blocks) {
-        if (block2.selector && block2.result) {
-          map.set(block2.selector, block2.result);
-        }
+        if (block2.selector && block2.result) map.set(block2.selector, block2.result);
       }
     }
   } catch {
@@ -7751,62 +7781,33 @@ async function autoApplyCachedAltTexts(widgetConfig) {
     }
   }
   const localCache = await getAllCachedAltTexts();
-  const localOnly = [];
   for (const [url, alt] of localCache) {
-    if (!cache.has(url)) {
-      cache.set(url, alt);
-      localOnly.push({ imageUrl: url, altText: alt });
-    }
-  }
-  if (siteKey && localOnly.length > 0) {
-    try {
-      const base = proxyUrl || DEFAULT_API_BASE;
-      const pageUrl = window.location.origin + window.location.pathname;
-      fetch(`${base}/v1/cache/batch-persist-alt-text`, {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({
-          siteKey,
-          pageUrl,
-          entries: localOnly.map((e) => ({ ...e, lang: pageLang }))
-        })
-      }).catch(() => {
-      });
-    } catch {
-    }
+    if (!cache.has(url)) cache.set(url, alt);
   }
   if (cache.size === 0) return 0;
-  let applied = 0;
-  const images = document.querySelectorAll("img");
-  images.forEach((img) => {
-    if (img.closest("#accessify-root") || img.closest("accessify-widget")) return;
+  function applyToImg(img) {
+    if (img.closest("#accessify-root") || img.closest("accessify-widget")) return false;
     const alt = img.getAttribute("alt");
-    if (alt !== null && alt.trim() !== "") return;
-    const src = img.currentSrc || img.src;
-    const cached = cache.get(src) || cache.get(img.src);
+    if (alt !== null && alt.trim() !== "") return false;
+    const src = getImageSrc(img);
+    const cached = cache.get(src) || cache.get(normalizeImageUrl(src)) || cache.get(img.src);
     if (cached) {
       img.setAttribute("alt", cached);
       img.setAttribute("title", cached);
       img.setAttribute("data-accessify-alt", "auto");
-      applied++;
+      return true;
     }
+    return false;
+  }
+  let applied = 0;
+  document.querySelectorAll("img").forEach((img) => {
+    if (applyToImg(img)) applied++;
   });
   const observer2 = new MutationObserver((mutations) => {
     for (const m of mutations) {
       for (const node of m.addedNodes) {
         const imgs = node instanceof HTMLImageElement ? [node] : node instanceof HTMLElement ? Array.from(node.querySelectorAll("img")) : [];
-        for (const img of imgs) {
-          if (img.closest("#accessify-root") || img.closest("accessify-widget")) continue;
-          const a = img.getAttribute("alt");
-          if (a !== null && a.trim() !== "") continue;
-          const src = img.currentSrc || img.src;
-          const c = cache.get(src) || cache.get(img.src);
-          if (c) {
-            img.setAttribute("alt", c);
-            img.setAttribute("title", c);
-            img.setAttribute("data-accessify-alt", "auto");
-          }
-        }
+        for (const img of imgs) applyToImg(img);
       }
     }
   });
@@ -7820,12 +7821,13 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
   let enabled = false;
   let styleEl = null;
   let badgeEl = null;
+  let tooltipEl = null;
+  let domObserver = null;
+  let autoGenerating = false;
   let missingAltImages = [];
   const processedImages = /* @__PURE__ */ new Map();
-  let autoGenerating = false;
-  let tooltipEl = null;
-  const infoButtons = /* @__PURE__ */ new Map();
-  let reportPanelEl = null;
+  let describeClickHandler = null;
+  let describeEscHandler = null;
   function lang() {
     return getCurrentWidgetLang() || initialLang;
   }
@@ -7834,14 +7836,12 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
   }
   const STYLE_ID = "accessify-alt-text-styles";
   const HIGHLIGHT_CLASS = "accessify-alt-missing";
-  const BADGE_CLASS = "accessify-alt-badge";
   function getStyles() {
     return `
       .${HIGHLIGHT_CLASS} {
         outline: 3px dashed #e63946 !important;
         outline-offset: 3px !important;
         position: relative !important;
-        transition: outline-color 0.2s ease !important;
       }
       .${HIGHLIGHT_CLASS}.accessify-alt-generating::after {
         content: '\\2026';
@@ -7867,93 +7867,65 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
         content: none;
       }
 
-      .accessify-alt-tooltip {
+      img[data-a11y-describable="true"] {
+        cursor: help !important;
+      }
+
+      .accessify-describe-tooltip {
         position: fixed;
         z-index: 2147483647;
-        max-width: 320px;
-        padding: 8px 12px;
+        max-width: 340px;
+        padding: 14px 18px;
         background: #1a1a2e;
         color: #e0e0e0;
-        border-radius: 8px;
-        box-shadow: 0 4px 20px rgba(0,0,0,0.4);
+        border-radius: 10px;
+        box-shadow: 0 6px 24px rgba(0,0,0,0.45);
         font-family: system-ui, -apple-system, sans-serif;
-        font-size: 13px;
-        line-height: 1.5;
-        pointer-events: none;
+        font-size: 14px;
+        line-height: 1.6;
         word-break: break-word;
-        opacity: 1;
+        animation: accessify-fade-in 0.15s ease;
       }
-
-      .accessify-alt-info-btn {
+      .accessify-describe-tooltip .accessify-describe-close {
         position: absolute;
         top: 6px;
-        right: 6px;
-        z-index: 10;
-        width: 22px;
-        height: 22px;
-        padding: 0;
+        right: 8px;
+        background: none;
         border: none;
-        border-radius: 50%;
-        background: rgba(0,0,0,0.6);
-        color: #ccc;
-        font-family: system-ui, -apple-system, sans-serif;
-        font-size: 13px;
-        font-weight: 600;
-        line-height: 22px;
-        text-align: center;
+        color: #888;
+        font-size: 16px;
         cursor: pointer;
-        opacity: 0;
-        transition: opacity 0.15s ease;
-        backdrop-filter: blur(4px);
-      }
-      .${HIGHLIGHT_CLASS}.accessify-alt-done:hover + .accessify-alt-info-btn,
-      .accessify-alt-info-btn:hover {
-        opacity: 1;
+        padding: 2px 6px;
+        line-height: 1;
       }
-      .accessify-alt-info-btn:hover {
-        background: rgba(0,0,0,0.8);
+      .accessify-describe-tooltip .accessify-describe-close:hover {
         color: #fff;
       }
-
-      .accessify-alt-report-panel {
-        position: fixed;
-        z-index: 2147483646;
-        width: 240px;
-        padding: 12px;
-        background: #1a1a2e;
-        color: #f0f0f0;
-        border-radius: 10px;
-        box-shadow: 0 8px 32px rgba(0,0,0,0.4);
-        font-family: system-ui, -apple-system, sans-serif;
-        font-size: 12px;
-        line-height: 1.5;
-      }
-      .accessify-alt-report-panel p {
-        margin: 0 0 8px 0;
+      .accessify-describe-loading {
+        display: flex;
+        align-items: center;
+        gap: 8px;
         color: #aaa;
+        font-style: italic;
+      }
+      .accessify-describe-loading::before {
+        content: '';
+        width: 14px;
+        height: 14px;
+        border: 2px solid #555;
+        border-top-color: #aaa;
+        border-radius: 50%;
+        animation: accessify-spin 0.8s linear infinite;
       }
-      .accessify-alt-report-btn {
-        display: inline-flex;
-        align-items: center;
-        gap: 4px;
-        padding: 5px 10px;
-        border: 1px solid rgba(220,53,69,0.3);
-        border-radius: 6px;
-        background: rgba(220,53,69,0.08);
-        color: #f0a0a8;
-        font-size: 11px;
-        cursor: pointer;
-        transition: background 0.15s ease;
+      @keyframes accessify-spin {
+        to { transform: rotate(360deg); }
       }
-      .accessify-alt-report-btn:hover { background: rgba(220,53,69,0.2); }
-      .accessify-alt-report-btn.reported {
-        border-color: rgba(42,157,143,0.3);
-        background: rgba(42,157,143,0.1);
-        color: #2a9d8f;
-        cursor: default;
+      @keyframes accessify-fade-in {
+        from { opacity: 0; transform: translateY(4px); }
+        to { opacity: 1; transform: translateY(0); }
       }
 
-      .${BADGE_CLASS} {
+      .accessify-alt-badge {
         position: fixed;
         top: 12px;
         right: 12px;
@@ -7970,7 +7942,7 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
         font-size: 13px;
         user-select: none;
       }
-      .${BADGE_CLASS}-count {
+      .accessify-alt-badge-count {
         display: inline-flex;
         align-items: center;
         justify-content: center;
@@ -7997,100 +7969,128 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
     styleEl = null;
     document.getElementById(STYLE_ID)?.remove();
   }
-  function showTooltip(img) {
-    const text = img.getAttribute("alt") || processedImages.get(img)?.generatedAlt;
-    if (!text) return;
-    hideTooltip();
+  function showDescribeTooltip(text, rect, loading = false) {
+    hideDescribeTooltip();
     const tip = document.createElement("div");
-    tip.className = "accessify-alt-tooltip";
-    tip.textContent = text;
+    tip.className = "accessify-describe-tooltip";
+    const closeBtn = document.createElement("button");
+    closeBtn.className = "accessify-describe-close";
+    closeBtn.textContent = "×";
+    closeBtn.setAttribute("aria-label", "Close");
+    closeBtn.addEventListener("click", (e) => {
+      e.stopPropagation();
+      hideDescribeTooltip();
+    });
+    tip.appendChild(closeBtn);
+    if (loading) {
+      const loadingEl = document.createElement("div");
+      loadingEl.className = "accessify-describe-loading";
+      loadingEl.textContent = isDE() ? "Bild wird analysiert…" : "Analyzing image…";
+      tip.appendChild(loadingEl);
+    } else {
+      const textEl = document.createElement("div");
+      textEl.textContent = text;
+      tip.appendChild(textEl);
+    }
     document.body.appendChild(tip);
     tooltipEl = tip;
-    const rect = img.getBoundingClientRect();
     const tipRect = tip.getBoundingClientRect();
-    let top = rect.top - tipRect.height - 8;
-    if (top < 4) top = rect.bottom + 8;
+    let top = rect.bottom + 8;
+    if (top + tipRect.height > window.innerHeight - 8) {
+      top = rect.top - tipRect.height - 8;
+    }
+    if (top < 4) top = 4;
     let left = rect.left + (rect.width - tipRect.width) / 2;
-    left = Math.max(4, Math.min(left, window.innerWidth - tipRect.width - 4));
+    left = Math.max(8, Math.min(left, window.innerWidth - tipRect.width - 8));
     tip.style.top = `${top}px`;
     tip.style.left = `${left}px`;
   }
-  function hideTooltip() {
+  function hideDescribeTooltip() {
     tooltipEl?.remove();
     tooltipEl = null;
   }
-  function onMouseEnter(e) {
-    showTooltip(e.currentTarget);
-  }
-  function onMouseLeave() {
-    hideTooltip();
-  }
-  function addInfoButton(img) {
-    if (infoButtons.has(img)) return;
-    const parent = img.parentElement;
-    if (parent) {
-      const pos = getComputedStyle(parent).position;
-      if (pos === "static") parent.style.position = "relative";
+  async function handleImageClick(img) {
+    const rect = img.getBoundingClientRect();
+    const cached = img.dataset.accessifyDescription;
+    if (cached) {
+      showDescribeTooltip(cached, rect);
+      return;
     }
-    const btn = document.createElement("button");
-    btn.className = "accessify-alt-info-btn";
-    btn.textContent = "i";
-    btn.setAttribute("aria-label", isDE() ? "Alt-Text melden" : "Report alt text");
-    btn.addEventListener("click", (e) => {
-      e.preventDefault();
-      e.stopPropagation();
-      showReportPanel(img, btn);
-    });
-    img.insertAdjacentElement("afterend", btn);
-    infoButtons.set(img, btn);
-  }
-  function removeInfoButtons() {
-    infoButtons.forEach((btn) => btn.remove());
-    infoButtons.clear();
-  }
-  function showReportPanel(img, anchor) {
-    closeReportPanel();
-    const altText2 = img.getAttribute("alt") || "";
-    const panel = document.createElement("div");
-    panel.className = "accessify-alt-report-panel";
-    const btnRect = anchor.getBoundingClientRect();
-    panel.style.top = `${btnRect.bottom + 6}px`;
-    panel.style.left = `${Math.min(btnRect.left, window.innerWidth - 260)}px`;
-    const desc = document.createElement("p");
-    desc.textContent = isDE() ? "Alt-Text falsch? Melden Sie den Fehler." : "Alt text wrong? Report the error.";
-    panel.appendChild(desc);
-    const reportBtn = document.createElement("button");
-    reportBtn.className = "accessify-alt-report-btn";
-    reportBtn.textContent = isDE() ? "⚠ Fehler melden" : "⚠ Report error";
-    reportBtn.addEventListener("click", async () => {
-      await saveReport(img.src, altText2, lang());
-      await removeCachedAltText(img.src);
-      reportBtn.textContent = isDE() ? "✓ Gemeldet" : "✓ Reported";
-      reportBtn.classList.add("reported");
+    const existingAlt = img.getAttribute("alt");
+    showDescribeTooltip("", rect, true);
+    try {
+      if (!aiService) {
+        showDescribeTooltip(
+          existingAlt || (isDE() ? "Kein API-Key konfiguriert" : "No API key configured"),
+          rect
+        );
+        return;
+      }
+      const src = getImageSrc(img);
+      const description = await aiService.describeImage(src, lang());
+      if (!enabled) return;
+      img.dataset.accessifyDescription = description;
+      showDescribeTooltip(description, rect);
+      const currentAlt = img.getAttribute("alt");
+      if (!currentAlt || !currentAlt.trim()) {
+        try {
+          const ctx = gatherImageContext(img);
+          const altText2 = await aiService.generateAltText(src, ctx, lang());
+          if (altText2) {
+            img.setAttribute("alt", altText2);
+            img.setAttribute("title", altText2);
+            setCachedAltText(src, altText2, lang()).catch(() => {
+            });
+            if (siteKey) persistAltTextToServer(siteKey, proxyUrl, src, altText2, lang());
+          }
+        } catch {
+        }
+      }
+    } catch (err) {
+      console.warn("[Accessify] Image description failed:", err);
+      showDescribeTooltip(
+        existingAlt || (isDE() ? "Beschreibung konnte nicht geladen werden" : "Could not load description"),
+        rect
+      );
+    }
+  }
+  function enableClickToDescribe() {
+    document.querySelectorAll("img").forEach((img) => {
+      if (img.closest("#accessify-root") || img.closest("accessify-widget")) return;
+      if (img.complete && img.naturalWidth > 0 && (img.naturalWidth < 20 || img.naturalHeight < 20)) return;
+      img.dataset.a11yDescribable = "true";
     });
-    panel.appendChild(reportBtn);
-    document.body.appendChild(panel);
-    reportPanelEl = panel;
-    setTimeout(() => {
-      const handleOutside = (e) => {
-        if (!panel.contains(e.target) && e.target !== anchor) {
-          closeReportPanel();
-          document.removeEventListener("click", handleOutside);
+    describeClickHandler = (e) => {
+      const img = e.target.closest("img[data-a11y-describable]");
+      if (!img) {
+        if (tooltipEl && !e.target.closest(".accessify-describe-tooltip")) {
+          hideDescribeTooltip();
         }
-      };
-      document.addEventListener("click", handleOutside);
-    }, 50);
-    const handleEsc = (e) => {
-      if (e.key === "Escape") {
-        closeReportPanel();
-        document.removeEventListener("keydown", handleEsc);
+        return;
       }
+      e.preventDefault();
+      e.stopPropagation();
+      handleImageClick(img);
+    };
+    document.addEventListener("click", describeClickHandler, true);
+    describeEscHandler = (e) => {
+      if (e.key === "Escape") hideDescribeTooltip();
     };
-    document.addEventListener("keydown", handleEsc);
+    document.addEventListener("keydown", describeEscHandler);
   }
-  function closeReportPanel() {
-    reportPanelEl?.remove();
-    reportPanelEl = null;
+  function disableClickToDescribe() {
+    if (describeClickHandler) {
+      document.removeEventListener("click", describeClickHandler, true);
+      describeClickHandler = null;
+    }
+    if (describeEscHandler) {
+      document.removeEventListener("keydown", describeEscHandler);
+      describeEscHandler = null;
+    }
+    hideDescribeTooltip();
+    document.querySelectorAll("img[data-a11y-describable]").forEach((img) => {
+      delete img.dataset.a11yDescribable;
+    });
   }
   function isGenericAlt(alt) {
     if (!alt.trim()) return true;
@@ -8099,47 +8099,54 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
     if (/\.(jpg|jpeg|png|gif|webp|svg|avif)$/i.test(alt)) return true;
     return false;
   }
+  function isDecorativeImage(img) {
+    const role = img.getAttribute("role");
+    if (role === "presentation" || role === "none") return true;
+    if (img.complete && img.naturalWidth > 0 && (img.naturalWidth < 50 || img.naturalHeight < 50)) return true;
+    return false;
+  }
+  function needsAltText(img) {
+    if (img.closest("#accessify-root") || img.closest("accessify-widget")) return false;
+    if (img.complete && img.naturalWidth > 0 && (img.naturalWidth < 20 || img.naturalHeight < 20)) return false;
+    const alt = img.getAttribute("alt");
+    if (alt === null) return true;
+    if (isGenericAlt(alt)) return true;
+    if (alt === "" && !isDecorativeImage(img)) return true;
+    return false;
+  }
   function scanForMissingAlt() {
     const missing = [];
     document.querySelectorAll("img").forEach((img) => {
-      if (img.closest("#accessify-root") || img.closest("accessify-widget")) return;
-      if (img.complete && img.naturalWidth > 0 && (img.naturalWidth < 20 || img.naturalHeight < 20)) return;
-      const alt = img.getAttribute("alt");
-      if (alt === "") return;
-      if (alt === null || isGenericAlt(alt)) missing.push(img);
+      if (needsAltText(img)) missing.push(img);
     });
     document.querySelectorAll("picture").forEach((picture) => {
       if (picture.closest("#accessify-root") || picture.closest("accessify-widget")) return;
       const img = picture.querySelector("img");
-      if (img && !missing.includes(img)) {
-        const alt = img.getAttribute("alt");
-        if (alt === null || isGenericAlt(alt)) {
-          missing.push(img);
-        }
-      }
-    });
-    document.querySelectorAll("*").forEach((el) => {
-      if (el.closest("#accessify-root") || el.closest("accessify-widget")) return;
-      if (el.tagName === "SCRIPT" || el.tagName === "STYLE") return;
-      const bg = window.getComputedStyle(el).backgroundImage;
-      if (!bg || bg === "none" || !bg.startsWith("url(")) return;
-      const src = bg.match(/url\(["']?(.+?)["']?\)/)?.[1];
-      if (!src || src.includes("data:") || src.includes("gradient")) return;
-      if (el.textContent?.trim() || el.getAttribute("aria-label")) return;
-      if (!el.dataset.accessifyBgSrc) {
-        el.dataset.accessifyBgSrc = src;
+      if (img && !missing.includes(img) && needsAltText(img)) {
+        missing.push(img);
       }
     });
     return missing;
   }
-  function scanAutoApplied() {
-    const images = document.querySelectorAll('img[data-accessify-alt="auto"]');
-    const applied = [];
-    images.forEach((img) => {
-      if (img.closest("#accessify-root")) return;
-      if (!processedImages.has(img)) applied.push(img);
-    });
-    return applied;
+  function gatherImageContext(img) {
+    const parts = [];
+    try {
+      const url = new URL(getImageSrc(img), window.location.href);
+      const filename = url.pathname.split("/").pop();
+      if (filename) parts.push(`Filename: ${filename}`);
+    } catch {
+    }
+    const figure = img.closest("figure");
+    if (figure) {
+      const caption = figure.querySelector("figcaption");
+      if (caption?.textContent?.trim()) parts.push(`Caption: ${caption.textContent.trim()}`);
+    }
+    const container = img.parentElement?.parentElement || img.parentElement;
+    if (container) {
+      const heading = container.querySelector("h1, h2, h3, h4, h5, h6");
+      if (heading?.textContent?.trim()) parts.push(`Nearby heading: ${heading.textContent.trim()}`);
+    }
+    return parts.join(". ");
   }
   function applyAltText(img, altText2) {
     img.setAttribute("alt", altText2);
@@ -8148,12 +8155,7 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
     if (enabled) {
       img.classList.add("accessify-alt-done");
       img.classList.remove("accessify-alt-generating");
-      addInfoButton(img);
     }
-    img.removeEventListener("mouseenter", onMouseEnter);
-    img.removeEventListener("mouseleave", onMouseLeave);
-    img.addEventListener("mouseenter", onMouseEnter);
-    img.addEventListener("mouseleave", onMouseLeave);
   }
   async function generateAll() {
     if (autoGenerating || !enabled || !aiService) return;
@@ -8162,7 +8164,8 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
     const uncached = [];
     for (const img of missingAltImages) {
       if (processedImages.has(img)) continue;
-      const cached = await getCachedAltText(img.src);
+      const src = getImageSrc(img);
+      const cached = await getCachedAltText(src);
       if (cached) {
         applyAltText(img, cached);
       } else {
@@ -8181,16 +8184,17 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
       await Promise.all(batch.map(async (img) => {
         if (!enabled) return;
         try {
+          const src = getImageSrc(img);
           const ctx = gatherImageContext(img);
-          const alt = await aiService.generateAltText(img.src, ctx, lang());
+          const alt = await aiService.generateAltText(src, ctx, lang());
           if (alt && enabled) {
             applyAltText(img, alt);
-            setCachedAltText(img.src, alt, lang()).catch(() => {
+            setCachedAltText(src, alt, lang()).catch(() => {
             });
-            if (siteKey) persistAltTextToServer(siteKey, proxyUrl, img.src, alt, lang());
+            if (siteKey) persistAltTextToServer(siteKey, proxyUrl, src, alt, lang());
           }
         } catch (err) {
-          console.warn("[Accessify] Alt-text generation failed:", img.src, err);
+          console.warn("[Accessify] Alt-text generation failed:", getImageSrc(img), err);
           img.classList.remove("accessify-alt-generating");
         }
       }));
@@ -8200,7 +8204,8 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
   }
   async function generateSingle(img) {
     if (!aiService || !enabled) return;
-    const cached = await getCachedAltText(img.src);
+    const src = getImageSrc(img);
+    const cached = await getCachedAltText(src);
     if (cached) {
       applyAltText(img, cached);
       updateBadge();
@@ -8209,16 +8214,16 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
     img.classList.add("accessify-alt-generating");
     try {
       const ctx = gatherImageContext(img);
-      const alt = await aiService.generateAltText(img.src, ctx, lang());
+      const alt = await aiService.generateAltText(src, ctx, lang());
       if (alt && enabled) {
         applyAltText(img, alt);
-        setCachedAltText(img.src, alt, lang()).catch(() => {
+        setCachedAltText(src, alt, lang()).catch(() => {
         });
-        if (siteKey) persistAltTextToServer(siteKey, proxyUrl, img.src, alt, lang());
+        if (siteKey) persistAltTextToServer(siteKey, proxyUrl, src, alt, lang());
         updateBadge();
       }
     } catch (err) {
-      console.warn("[Accessify] Alt-text generation failed:", img.src, err);
+      console.warn("[Accessify] Alt-text generation failed:", src, err);
       img.classList.remove("accessify-alt-generating");
     }
   }
@@ -8226,26 +8231,35 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
     removeBadge();
     const remaining = missingAltImages.filter((img) => !processedImages.has(img)).length;
     const generating = missingAltImages.filter((img) => img.classList.contains("accessify-alt-generating")).length;
-    if (remaining === 0 && missingAltImages.length > 0) {
-      showBadge(isDE() ? `✓ ${missingAltImages.length} Alt-Texte gesetzt` : `✓ ${missingAltImages.length} alt texts applied`, "#2a9d8f", 0);
-      setTimeout(() => removeBadge(), 5e3);
-      return;
-    }
-    if (remaining === 0) return;
     if (generating > 0) {
       showBadge(isDE() ? `${generating} Bilder werden analysiert…` : `Analyzing ${generating} images…`, "#f77f00", generating);
-    } else {
-      showBadge(isDE() ? `${remaining} Bilder ohne Alt-Text` : `${remaining} images missing alt text`, "#e63946", remaining);
+      return;
+    }
+    if (remaining === 0 && processedImages.size > 0) {
+      showBadge(
+        isDE() ? `✓ ${processedImages.size} Bildbeschreibungen erstellt` : `✓ ${processedImages.size} descriptions generated`,
+        "#2a9d8f",
+        0
+      );
+      setTimeout(() => removeBadge(), 6e3);
+      return;
+    }
+    if (remaining > 0) {
+      showBadge(
+        isDE() ? `${remaining} Bilder ohne Beschreibung` : `${remaining} images without description`,
+        "#e63946",
+        remaining
+      );
     }
   }
   function showBadge(text, color, count) {
     const badge = document.createElement("div");
-    badge.className = BADGE_CLASS;
+    badge.className = "accessify-alt-badge";
     badge.setAttribute("role", "status");
     badge.setAttribute("aria-live", "polite");
     if (count > 0) {
       const c = document.createElement("span");
-      c.className = `${BADGE_CLASS}-count`;
+      c.className = "accessify-alt-badge-count";
       c.style.background = color;
       c.textContent = String(count);
       badge.appendChild(c);
@@ -8260,41 +8274,15 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
     badgeEl?.remove();
     badgeEl = null;
   }
-  function gatherImageContext(img) {
-    const parts = [];
-    try {
-      const url = new URL(img.src, window.location.href);
-      const filename = url.pathname.split("/").pop();
-      if (filename) parts.push(`Filename: ${filename}`);
-    } catch {
-    }
-    const figure = img.closest("figure");
-    if (figure) {
-      const caption = figure.querySelector("figcaption");
-      if (caption?.textContent?.trim()) parts.push(`Caption: ${caption.textContent.trim()}`);
-    }
-    const parent = img.parentElement;
-    if (parent) {
-      const heading = parent.querySelector("h1, h2, h3, h4, h5, h6");
-      if (heading?.textContent?.trim()) parts.push(`Nearby heading: ${heading.textContent.trim()}`);
-    }
-    const describedBy = img.getAttribute("aria-describedby");
-    if (describedBy) {
-      const descEl = document.getElementById(describedBy);
-      if (descEl?.textContent?.trim()) parts.push(`Description: ${descEl.textContent.trim()}`);
-    }
-    return parts.join(". ");
-  }
-  let domObserver = null;
   function tryRegisterImage(img) {
     if (!enabled) return;
     if (img.closest("#accessify-root")) return;
     if (missingAltImages.includes(img)) return;
-    const alt = img.getAttribute("alt");
-    if (alt !== null && alt.trim() !== "") return;
     function addIfValid() {
       if (!enabled || missingAltImages.includes(img)) return;
-      if (img.naturalWidth >= 20 && img.naturalHeight >= 20) {
+      if (img.naturalWidth < 20 || img.naturalHeight < 20) return;
+      img.dataset.a11yDescribable = "true";
+      if (needsAltText(img)) {
         img.classList.add(HIGHLIGHT_CLASS);
         missingAltImages.push(img);
         updateBadge();
@@ -8308,36 +8296,45 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
     if (enabled) return;
     enabled = true;
     injectStyles();
-    const alreadyApplied = scanAutoApplied();
-    for (const img of alreadyApplied) {
-      const alt = img.getAttribute("alt");
-      processedImages.set(img, { generatedAlt: alt });
-      missingAltImages.push(img);
-      img.classList.add(HIGHLIGHT_CLASS, "accessify-alt-done");
-      addInfoButton(img);
-      img.removeEventListener("mouseenter", onMouseEnter);
-      img.removeEventListener("mouseleave", onMouseLeave);
-      img.addEventListener("mouseenter", onMouseEnter);
-      img.addEventListener("mouseleave", onMouseLeave);
-    }
+    const alreadyApplied = document.querySelectorAll('img[data-accessify-alt="auto"]');
+    alreadyApplied.forEach((img) => {
+      if (img.closest("#accessify-root")) return;
+      if (!processedImages.has(img)) {
+        processedImages.set(img, { generatedAlt: img.getAttribute("alt") || "" });
+        missingAltImages.push(img);
+        img.classList.add(HIGHLIGHT_CLASS, "accessify-alt-done");
+      }
+    });
     const missing = scanForMissingAlt();
     for (const img of missing) {
-      missingAltImages.push(img);
-      img.classList.add(HIGHLIGHT_CLASS);
+      if (!missingAltImages.includes(img)) {
+        missingAltImages.push(img);
+        img.classList.add(HIGHLIGHT_CLASS);
+      }
     }
     updateBadge();
     generateAll();
+    enableClickToDescribe();
     document.querySelectorAll("img").forEach((img) => {
       if (!img.complete) tryRegisterImage(img);
     });
     setTimeout(() => {
-      if (enabled) document.querySelectorAll("img").forEach(tryRegisterImage);
+      if (enabled) {
+        document.querySelectorAll("img").forEach(tryRegisterImage);
+      }
     }, 2e3);
     domObserver = new MutationObserver((mutations) => {
       for (const m of mutations) {
         for (const node of m.addedNodes) {
           if (node instanceof HTMLImageElement) tryRegisterImage(node);
-          else if (node instanceof HTMLElement) node.querySelectorAll("img").forEach(tryRegisterImage);
+          else if (node instanceof HTMLElement) {
+            node.querySelectorAll("img").forEach(tryRegisterImage);
+            node.querySelectorAll("img").forEach((img) => {
+              if (!img.closest("#accessify-root") && !img.closest("accessify-widget")) {
+                img.dataset.a11yDescribable = "true";
+              }
+            });
+          }
         }
       }
     });
@@ -8348,9 +8345,7 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
     autoGenerating = false;
     domObserver?.disconnect();
     domObserver = null;
-    hideTooltip();
-    closeReportPanel();
-    removeInfoButtons();
+    disableClickToDescribe();
     removeBadge();
     missingAltImages.forEach((img) => {
       img.classList.remove(HIGHLIGHT_CLASS, "accessify-alt-done", "accessify-alt-generating");
@@ -8362,8 +8357,8 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
   });
   return {
     id: "alt-text",
-    name: () => isDE() ? "Alt-Text erzeugen" : "Alt-Text Generator",
-    description: isDE() ? "Bildbeschreibungen automatisch erstellen" : "Auto-generate image descriptions",
+    name: () => isDE() ? "Bildbeschreibung" : "Image Description",
+    description: isDE() ? "Bilder per Klick beschreiben lassen" : "Click images to get AI descriptions",
     icon: "alt-text",
     category: "ai",
     activate,
@@ -8372,7 +8367,7 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
       id: "alt-text",
       enabled,
       value: {
-        missingCount: missingAltImages.length,
+        missingCount: missingAltImages.filter((img) => !processedImages.has(img)).length,
         processedCount: processedImages.size
       }
     })
@@ -8569,4 +8564,4 @@ export {
   init as i,
   t
 };
-//# sourceMappingURL=index-B2FUEI0d.js.map
+//# sourceMappingURL=index-DlEXo7aY.js.map