accessify-widget 0.2.18 → 0.2.20

package/dist/accessify.mjs

@@ -1,4 +1,4 @@
-import { d, i } from "./index-DvpENReS.js";
+import { d, i } from "./index-DwxnT3JK.js";
 export {
   d as destroy,
   i as init

package/dist/{index-DvpENReS.js → index-DwxnT3JK.js}

@@ -1673,7 +1673,7 @@ function derived(fn) {
   return signal;
 }
 // @__NO_SIDE_EFFECTS__
-function async_derived(fn, label, location) {
+function async_derived(fn, label, location2) {
   let parent = (
     /** @type {Effect | null} */
     active_effect
@@ -6310,14 +6310,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-BLkj3Uzc.js"),
+    "keyboard-nav": () => import("./keyboard-nav-BtZsDcZQ.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-D88y-Y7V.js"),
+    "page-structure": () => import("./page-structure-DTKpsB5y.js"),
     tts: () => import("./tts-CjszLRnb.js"),
     "text-simplify": () => import("./text-simplify-Cvhpio7g.js"),
     "alt-text": () => Promise.resolve().then(() => altText)
@@ -6630,6 +6630,8 @@ let currentTranslateLang = null;
 let translating = false;
 let observer = null;
 let observerPaused = false;
+let navigationHandler = null;
+let lastUrl = "";
 const TRANSLATABLE_ATTRS = [
   "aria-label",
   "aria-description",
@@ -6773,10 +6775,23 @@ async function translatePage(targetLang) {
 }
 function setupObserver(targetLang) {
   if (observer) observer.disconnect();
+  lastUrl = location.href;
   const debouncedTranslate = debounce(() => {
     if (!currentTranslateLang || observerPaused) return;
     translatePage(currentTranslateLang);
   }, 300);
+  const onNavigation = () => {
+    if (!currentTranslateLang || observerPaused) return;
+    const newUrl = location.href;
+    if (newUrl !== lastUrl) {
+      lastUrl = newUrl;
+      savedTextNodes = [];
+      savedAttrs = [];
+      setTimeout(() => {
+        if (currentTranslateLang) translatePage(currentTranslateLang);
+      }, 500);
+    }
+  };
   observer = new MutationObserver((mutations) => {
     if (observerPaused || !currentTranslateLang) return;
     let hasRelevantChange = false;
@@ -6790,17 +6805,36 @@ function setupObserver(targetLang) {
         break;
       }
     }
-    if (hasRelevantChange) debouncedTranslate();
+    if (hasRelevantChange) {
+      onNavigation();
+      debouncedTranslate();
+    }
   });
   observer.observe(document.body, {
     childList: true,
     subtree: true,
     characterData: true
   });
+  navigationHandler = onNavigation;
+  window.addEventListener("popstate", navigationHandler);
+  const origPush = history.pushState;
+  const origReplace = history.replaceState;
+  history.pushState = function(...args) {
+    origPush.apply(this, args);
+    onNavigation();
+  };
+  history.replaceState = function(...args) {
+    origReplace.apply(this, args);
+    onNavigation();
+  };
 }
 function teardownObserver() {
   observer?.disconnect();
   observer = null;
+  if (navigationHandler) {
+    window.removeEventListener("popstate", navigationHandler);
+    navigationHandler = null;
+  }
 }
 function getElId(el) {
   return el.id || el.getAttribute("data-a11y-id") || (el.setAttribute("data-a11y-id", Math.random().toString(36).substr(2, 9)), el.getAttribute("data-a11y-id"));
@@ -7787,6 +7821,7 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
   let styleEl = null;
   let badgeEl = null;
   let missingAltImages = [];
+  let existingAltImages = [];
   const processedImages = /* @__PURE__ */ new Map();
   let autoGenerating = false;
   let tooltipEl = null;
@@ -7800,6 +7835,7 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
   }
   const STYLE_ID = "accessify-alt-text-styles";
   const HIGHLIGHT_CLASS = "accessify-alt-missing";
+  const HAS_ALT_CLASS = "accessify-alt-existing";
   const BADGE_CLASS = "accessify-alt-badge";
   function getStyles() {
     return `
@@ -7833,6 +7869,12 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
         content: none;
       }
 
+      .${HAS_ALT_CLASS} {
+        outline: 3px solid #2a9d8f !important;
+        outline-offset: 3px !important;
+        position: relative !important;
+      }
+
       .accessify-alt-tooltip {
         position: fixed;
         z-index: 2147483647;
@@ -8071,7 +8113,13 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
       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 === "") {
+        const role = img.getAttribute("role");
+        if (role === "presentation" || role === "none") return;
+        if (img.complete && img.naturalWidth > 0 && (img.naturalWidth < 50 || img.naturalHeight < 50)) return;
+        missing.push(img);
+        return;
+      }
       if (alt === null || isGenericAlt(alt)) missing.push(img);
     });
     document.querySelectorAll("picture").forEach((picture) => {
@@ -8098,6 +8146,20 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
     });
     return missing;
   }
+  function scanWithExistingAlt(excludeMissing) {
+    const existing = [];
+    const missingSet = new Set(excludeMissing);
+    document.querySelectorAll("img").forEach((img) => {
+      if (img.closest("#accessify-root") || img.closest("accessify-widget")) return;
+      if (missingSet.has(img)) return;
+      if (img.complete && img.naturalWidth > 0 && (img.naturalWidth < 20 || img.naturalHeight < 20)) return;
+      const alt = img.getAttribute("alt");
+      if (alt && alt.trim() && !isGenericAlt(alt)) {
+        existing.push(img);
+      }
+    });
+    return existing;
+  }
   function scanAutoApplied() {
     const images = document.querySelectorAll('img[data-accessify-alt="auto"]');
     const applied = [];
@@ -8192,16 +8254,28 @@ 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;
+    const generated = processedImages.size;
+    const withExisting = existingAltImages.length;
+    const totalImages = missingAltImages.length + withExisting;
     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 && totalImages > 0) {
+      const parts = [];
+      if (withExisting > 0) parts.push(isDE() ? `${withExisting} ✓` : `${withExisting} ✓`);
+      if (generated > 0) parts.push(isDE() ? `${generated} erzeugt` : `${generated} generated`);
+      const summary = `${totalImages} ${isDE() ? "Bilder" : "images"}: ${parts.join(", ")}`;
+      showBadge(summary, "#2a9d8f", 0);
+      setTimeout(() => removeBadge(), 8e3);
+      return;
+    }
+    if (remaining > 0) {
+      const statusParts = [];
+      if (withExisting > 0) statusParts.push(`${withExisting} ✓`);
+      statusParts.push(isDE() ? `${remaining} ohne Alt-Text` : `${remaining} missing`);
+      const text = `${totalImages} ${isDE() ? "Bilder" : "images"}: ${statusParts.join(", ")}`;
+      showBadge(text, "#e63946", remaining);
     }
   }
   function showBadge(text, color, count) {
@@ -8255,21 +8329,36 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
   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;
+    if (missingAltImages.includes(img) || existingAltImages.includes(img)) return;
     function addIfValid() {
-      if (!enabled || missingAltImages.includes(img)) return;
-      if (img.naturalWidth >= 20 && img.naturalHeight >= 20) {
+      if (!enabled || missingAltImages.includes(img) || existingAltImages.includes(img)) return;
+      if (img.naturalWidth < 20 || img.naturalHeight < 20) return;
+      const alt = img.getAttribute("alt");
+      const isMissing = alt === null || isGenericAlt(alt) || alt === "" && !isDecorativeImage(img);
+      if (isMissing) {
         img.classList.add(HIGHLIGHT_CLASS);
         missingAltImages.push(img);
         updateBadge();
         generateSingle(img);
+      } else if (alt && alt.trim()) {
+        existingAltImages.push(img);
+        img.classList.add(HAS_ALT_CLASS);
+        img.removeEventListener("mouseenter", onMouseEnter);
+        img.removeEventListener("mouseleave", onMouseLeave);
+        img.addEventListener("mouseenter", onMouseEnter);
+        img.addEventListener("mouseleave", onMouseLeave);
+        updateBadge();
       }
     }
     if (img.complete && img.naturalWidth > 0) addIfValid();
     else img.addEventListener("load", addIfValid, { once: true });
   }
+  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 activate() {
     if (enabled) return;
     enabled = true;
@@ -8291,6 +8380,15 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
       missingAltImages.push(img);
       img.classList.add(HIGHLIGHT_CLASS);
     }
+    const withAlt = scanWithExistingAlt(missingAltImages);
+    for (const img of withAlt) {
+      existingAltImages.push(img);
+      img.classList.add(HAS_ALT_CLASS);
+      img.removeEventListener("mouseenter", onMouseEnter);
+      img.removeEventListener("mouseleave", onMouseLeave);
+      img.addEventListener("mouseenter", onMouseEnter);
+      img.addEventListener("mouseleave", onMouseLeave);
+    }
     updateBadge();
     generateAll();
     document.querySelectorAll("img").forEach((img) => {
@@ -8322,6 +8420,10 @@ function createAltTextModule(aiService, initialLang = "de", serverConfig) {
       img.classList.remove(HIGHLIGHT_CLASS, "accessify-alt-done", "accessify-alt-generating");
     });
     missingAltImages = [];
+    existingAltImages.forEach((img) => {
+      img.classList.remove(HAS_ALT_CLASS);
+    });
+    existingAltImages = [];
     removeStyles();
   }
   autoApplyCachedAltTexts({ siteKey, proxyUrl, lang: initialLang }).catch(() => {
@@ -8535,4 +8637,4 @@ export {
   init as i,
   t
 };
-//# sourceMappingURL=index-DvpENReS.js.map
+//# sourceMappingURL=index-DwxnT3JK.js.map