accessify-widget 0.1.0

package/dist/page-structure-2X8mOSpC.js

@@ -0,0 +1,166 @@
+function createPageStructureModule() {
+  let enabled = false;
+  let panelEl = null;
+  const PANEL_ID = "accessify-page-structure";
+  function collectHeadings() {
+    const results = [];
+    const headings = document.querySelectorAll("h1, h2, h3, h4, h5, h6");
+    headings.forEach((el) => {
+      if (el.closest("#accessify-root")) return;
+      const text = el.textContent?.trim() || "";
+      if (text) results.push({ tag: el.tagName.toLowerCase(), text, el });
+    });
+    return results;
+  }
+  function collectLandmarks() {
+    const results = [];
+    const selectors = [
+      "main",
+      "nav",
+      "aside",
+      "header",
+      "footer",
+      "section[aria-label]",
+      "section[aria-labelledby]",
+      '[role="main"]',
+      '[role="navigation"]',
+      '[role="complementary"]',
+      '[role="banner"]',
+      '[role="contentinfo"]',
+      '[role="search"]'
+    ];
+    const els = document.querySelectorAll(selectors.join(","));
+    els.forEach((el) => {
+      if (el.closest("#accessify-root")) return;
+      const role = el.getAttribute("role") || el.tagName.toLowerCase();
+      const label = el.getAttribute("aria-label") || el.getAttribute("aria-labelledby") || role;
+      results.push({ role, label, el });
+    });
+    return results;
+  }
+  function buildPanel() {
+    panelEl = document.createElement("div");
+    panelEl.id = PANEL_ID;
+    panelEl.setAttribute("role", "dialog");
+    panelEl.setAttribute("aria-label", "Page Structure");
+    const headings = collectHeadings();
+    const landmarks = collectLandmarks();
+    const indent = {
+      h1: "0",
+      h2: "12px",
+      h3: "24px",
+      h4: "36px",
+      h5: "48px",
+      h6: "60px"
+    };
+    let html = `
+      <style>
+        #${PANEL_ID} {
+          position: fixed; top: 50%; left: 50%;
+          transform: translate(-50%, -50%);
+          z-index: 999998;
+          background: #fff; color: #1a1a1a;
+          border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,0.2);
+          padding: 24px; width: 400px; max-height: 80vh;
+          overflow-y: auto; font-family: system-ui, sans-serif;
+          font-size: 14px; line-height: 1.5;
+        }
+        #${PANEL_ID} h3 { margin: 0 0 12px; font-size: 16px; }
+        #${PANEL_ID} .ps-section { margin-bottom: 16px; }
+        #${PANEL_ID} .ps-label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; color: #888; margin-bottom: 6px; }
+        #${PANEL_ID} .ps-item {
+          display: block; width: 100%; text-align: left;
+          padding: 6px 8px; border: none; background: none;
+          cursor: pointer; border-radius: 6px; font-size: 13px;
+          color: #1a1a1a; font-family: inherit;
+        }
+        #${PANEL_ID} .ps-item:hover { background: #f0f0f2; }
+        #${PANEL_ID} .ps-item:focus-visible { outline: 2px solid #0055CC; outline-offset: 1px; }
+        #${PANEL_ID} .ps-tag { color: #888; font-size: 11px; margin-right: 6px; }
+        #${PANEL_ID} .ps-close {
+          position: absolute; top: 12px; right: 12px;
+          background: none; border: none; cursor: pointer;
+          font-size: 18px; color: #888; padding: 4px 8px; border-radius: 4px;
+        }
+        #${PANEL_ID} .ps-close:hover { background: #f0f0f2; }
+        @media (prefers-color-scheme: dark) {
+          #${PANEL_ID} { background: #1a1a1a; color: #f0f0f0; }
+          #${PANEL_ID} .ps-item { color: #f0f0f0; }
+          #${PANEL_ID} .ps-item:hover { background: #2a2a2e; }
+          #${PANEL_ID} .ps-close { color: #aaa; }
+          #${PANEL_ID} .ps-close:hover { background: #2a2a2e; }
+        }
+      </style>
+      <button class="ps-close" aria-label="Close">&times;</button>
+      <h3>Page Structure</h3>
+    `;
+    if (headings.length > 0) {
+      html += '<div class="ps-section"><div class="ps-label">Headings</div>';
+      headings.forEach((h, i) => {
+        html += `<button class="ps-item" data-type="heading" data-index="${i}" style="padding-left:${indent[h.tag] || "0"}">
+          <span class="ps-tag">${h.tag}</span>${escapeHtml(h.text.slice(0, 80))}
+        </button>`;
+      });
+      html += "</div>";
+    }
+    if (landmarks.length > 0) {
+      html += '<div class="ps-section"><div class="ps-label">Landmarks</div>';
+      landmarks.forEach((lm, i) => {
+        html += `<button class="ps-item" data-type="landmark" data-index="${i}">
+          <span class="ps-tag">${escapeHtml(lm.role)}</span>${escapeHtml(lm.label.slice(0, 60))}
+        </button>`;
+      });
+      html += "</div>";
+    }
+    if (headings.length === 0 && landmarks.length === 0) {
+      html += '<p style="color:#888">No headings or landmarks found on this page.</p>';
+    }
+    panelEl.innerHTML = html;
+    panelEl.addEventListener("click", (e) => {
+      const btn = e.target.closest(".ps-item");
+      if (btn) {
+        const type = btn.dataset.type;
+        const idx = parseInt(btn.dataset.index || "0", 10);
+        let target;
+        if (type === "heading") target = headings[idx]?.el;
+        else if (type === "landmark") target = landmarks[idx]?.el;
+        if (target) {
+          target.scrollIntoView({ behavior: "smooth", block: "center" });
+          target.focus({ preventScroll: true });
+        }
+      }
+      if (e.target.closest(".ps-close")) {
+        deactivate();
+      }
+    });
+    document.body.appendChild(panelEl);
+    const firstBtn = panelEl.querySelector(".ps-item, .ps-close");
+    firstBtn?.focus();
+  }
+  function escapeHtml(str) {
+    return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+  }
+  function activate() {
+    enabled = true;
+    buildPanel();
+  }
+  function deactivate() {
+    enabled = false;
+    panelEl?.remove();
+    panelEl = null;
+  }
+  return {
+    id: "page-structure",
+    name: () => "Page Structure",
+    description: "View headings and landmarks for quick navigation",
+    icon: "page-structure",
+    category: "motor",
+    activate,
+    deactivate,
+    getState: () => ({ id: "page-structure", enabled })
+  };
+}
+export {
+  createPageStructureModule as default
+};
+//# sourceMappingURL=page-structure-2X8mOSpC.js.map

package/dist/page-structure-2X8mOSpC.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-structure-2X8mOSpC.js","sources":["../src/features/page-structure.ts"],"sourcesContent":["import type { FeatureModule, FeatureState } from '../types';\n\nexport default function createPageStructureModule(): FeatureModule {\n  let enabled = false;\n  let panelEl: HTMLElement | null = null;\n  const PANEL_ID = 'accessify-page-structure';\n\n  function collectHeadings(): Array<{ tag: string; text: string; el: HTMLElement }> {\n    const results: Array<{ tag: string; text: string; el: HTMLElement }> = [];\n    const headings = document.querySelectorAll<HTMLElement>('h1, h2, h3, h4, h5, h6');\n    headings.forEach((el) => {\n      if (el.closest('#accessify-root')) return;\n      const text = el.textContent?.trim() || '';\n      if (text) results.push({ tag: el.tagName.toLowerCase(), text, el });\n    });\n    return results;\n  }\n\n  function collectLandmarks(): Array<{ role: string; label: string; el: HTMLElement }> {\n    const results: Array<{ role: string; label: string; el: HTMLElement }> = [];\n    const selectors = [\n      'main', 'nav', 'aside', 'header', 'footer', 'section[aria-label]',\n      'section[aria-labelledby]', '[role=\"main\"]', '[role=\"navigation\"]',\n      '[role=\"complementary\"]', '[role=\"banner\"]', '[role=\"contentinfo\"]',\n      '[role=\"search\"]',\n    ];\n    const els = document.querySelectorAll<HTMLElement>(selectors.join(','));\n    els.forEach((el) => {\n      if (el.closest('#accessify-root')) return;\n      const role = el.getAttribute('role') || el.tagName.toLowerCase();\n      const label = el.getAttribute('aria-label') || el.getAttribute('aria-labelledby') || role;\n      results.push({ role, label, el });\n    });\n    return results;\n  }\n\n  function buildPanel() {\n    panelEl = document.createElement('div');\n    panelEl.id = PANEL_ID;\n    panelEl.setAttribute('role', 'dialog');\n    panelEl.setAttribute('aria-label', 'Page Structure');\n\n    const headings = collectHeadings();\n    const landmarks = collectLandmarks();\n\n    const indent: Record<string, string> = {\n      h1: '0', h2: '12px', h3: '24px', h4: '36px', h5: '48px', h6: '60px',\n    };\n\n    let html = `\n      <style>\n        #${PANEL_ID} {\n          position: fixed; top: 50%; left: 50%;\n          transform: translate(-50%, -50%);\n          z-index: 999998;\n          background: #fff; color: #1a1a1a;\n          border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,0.2);\n          padding: 24px; width: 400px; max-height: 80vh;\n          overflow-y: auto; font-family: system-ui, sans-serif;\n          font-size: 14px; line-height: 1.5;\n        }\n        #${PANEL_ID} h3 { margin: 0 0 12px; font-size: 16px; }\n        #${PANEL_ID} .ps-section { margin-bottom: 16px; }\n        #${PANEL_ID} .ps-label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; color: #888; margin-bottom: 6px; }\n        #${PANEL_ID} .ps-item {\n          display: block; width: 100%; text-align: left;\n          padding: 6px 8px; border: none; background: none;\n          cursor: pointer; border-radius: 6px; font-size: 13px;\n          color: #1a1a1a; font-family: inherit;\n        }\n        #${PANEL_ID} .ps-item:hover { background: #f0f0f2; }\n        #${PANEL_ID} .ps-item:focus-visible { outline: 2px solid #0055CC; outline-offset: 1px; }\n        #${PANEL_ID} .ps-tag { color: #888; font-size: 11px; margin-right: 6px; }\n        #${PANEL_ID} .ps-close {\n          position: absolute; top: 12px; right: 12px;\n          background: none; border: none; cursor: pointer;\n          font-size: 18px; color: #888; padding: 4px 8px; border-radius: 4px;\n        }\n        #${PANEL_ID} .ps-close:hover { background: #f0f0f2; }\n        @media (prefers-color-scheme: dark) {\n          #${PANEL_ID} { background: #1a1a1a; color: #f0f0f0; }\n          #${PANEL_ID} .ps-item { color: #f0f0f0; }\n          #${PANEL_ID} .ps-item:hover { background: #2a2a2e; }\n          #${PANEL_ID} .ps-close { color: #aaa; }\n          #${PANEL_ID} .ps-close:hover { background: #2a2a2e; }\n        }\n      </style>\n      <button class=\"ps-close\" aria-label=\"Close\">&times;</button>\n      <h3>Page Structure</h3>\n    `;\n\n    if (headings.length > 0) {\n      html += '<div class=\"ps-section\"><div class=\"ps-label\">Headings</div>';\n      headings.forEach((h, i) => {\n        html += `<button class=\"ps-item\" data-type=\"heading\" data-index=\"${i}\" style=\"padding-left:${indent[h.tag] || '0'}\">\n          <span class=\"ps-tag\">${h.tag}</span>${escapeHtml(h.text.slice(0, 80))}\n        </button>`;\n      });\n      html += '</div>';\n    }\n\n    if (landmarks.length > 0) {\n      html += '<div class=\"ps-section\"><div class=\"ps-label\">Landmarks</div>';\n      landmarks.forEach((lm, i) => {\n        html += `<button class=\"ps-item\" data-type=\"landmark\" data-index=\"${i}\">\n          <span class=\"ps-tag\">${escapeHtml(lm.role)}</span>${escapeHtml(lm.label.slice(0, 60))}\n        </button>`;\n      });\n      html += '</div>';\n    }\n\n    if (headings.length === 0 && landmarks.length === 0) {\n      html += '<p style=\"color:#888\">No headings or landmarks found on this page.</p>';\n    }\n\n    panelEl.innerHTML = html;\n\n    // Event delegation\n    panelEl.addEventListener('click', (e) => {\n      const btn = (e.target as HTMLElement).closest<HTMLElement>('.ps-item');\n      if (btn) {\n        const type = btn.dataset.type;\n        const idx = parseInt(btn.dataset.index || '0', 10);\n        let target: HTMLElement | undefined;\n        if (type === 'heading') target = headings[idx]?.el;\n        else if (type === 'landmark') target = landmarks[idx]?.el;\n        if (target) {\n          target.scrollIntoView({ behavior: 'smooth', block: 'center' });\n          target.focus({ preventScroll: true });\n        }\n      }\n      if ((e.target as HTMLElement).closest('.ps-close')) {\n        deactivate();\n      }\n    });\n\n    document.body.appendChild(panelEl);\n    const firstBtn = panelEl.querySelector<HTMLElement>('.ps-item, .ps-close');\n    firstBtn?.focus();\n  }\n\n  function escapeHtml(str: string): string {\n    return str.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');\n  }\n\n  function activate() {\n    enabled = true;\n    buildPanel();\n  }\n\n  function deactivate() {\n    enabled = false;\n    panelEl?.remove();\n    panelEl = null;\n  }\n\n  return {\n    id: 'page-structure',\n    name: () => 'Page Structure',\n    description: 'View headings and landmarks for quick navigation',\n    icon: 'page-structure',\n    category: 'motor',\n    activate,\n    deactivate,\n    getState: (): FeatureState => ({ id: 'page-structure', enabled }),\n  };\n}\n"],"names":[],"mappings":"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"}

package/dist/reading-guide-VT8NciIL.js

@@ -0,0 +1,122 @@
+const DEFAULT_OPTIONS$1 = {
+  height: 8,
+  opacity: 0.3
+};
+function createReadingGuideModule() {
+  let enabled = false;
+  let guideEl = null;
+  let currentY = 0;
+  let options = { ...DEFAULT_OPTIONS$1 };
+  const STORAGE_KEY = "accessify-reading-guide";
+  const GUIDE_ID = "accessify-reading-guide";
+  function handleMouseMove(e) {
+    currentY = e.clientY;
+    updateGuidePosition();
+  }
+  function handleTouchMove(e) {
+    if (e.touches.length > 0) {
+      currentY = e.touches[0].clientY;
+      updateGuidePosition();
+    }
+  }
+  function handleKeyDown(e) {
+    if (!enabled || !guideEl) return;
+    const STEP = 10;
+    if (e.key === "ArrowUp") {
+      e.preventDefault();
+      currentY = Math.max(0, currentY - STEP);
+      updateGuidePosition();
+    } else if (e.key === "ArrowDown") {
+      e.preventDefault();
+      currentY = Math.min(window.innerHeight, currentY + STEP);
+      updateGuidePosition();
+    }
+  }
+  function updateGuidePosition() {
+    if (!guideEl) return;
+    const halfHeight = options.height / 2;
+    guideEl.style.top = `${currentY - halfHeight}px`;
+  }
+  function createGuideElement() {
+    const el = document.createElement("div");
+    el.id = GUIDE_ID;
+    el.setAttribute("role", "presentation");
+    el.setAttribute("aria-hidden", "true");
+    Object.assign(el.style, {
+      position: "fixed",
+      left: "0",
+      width: "100%",
+      height: `${options.height}px`,
+      backgroundColor: `rgba(255, 255, 0, ${options.opacity})`,
+      pointerEvents: "none",
+      zIndex: "2147483646",
+      top: "50%",
+      transition: "top 0.05s linear",
+      boxShadow: "0 0 4px rgba(0,0,0,0.2)"
+    });
+    return el;
+  }
+  function activate() {
+    enabled = true;
+    const saved = localStorage.getItem(STORAGE_KEY);
+    if (saved) {
+      try {
+        const parsed = JSON.parse(saved);
+        options = {
+          height: Math.min(60, Math.max(2, parsed.height ?? DEFAULT_OPTIONS$1.height)),
+          opacity: Math.min(1, Math.max(0.1, parsed.opacity ?? DEFAULT_OPTIONS$1.opacity))
+        };
+      } catch {
+        options = { ...DEFAULT_OPTIONS$1 };
+      }
+    }
+    guideEl = createGuideElement();
+    document.documentElement.appendChild(guideEl);
+    currentY = window.innerHeight / 2;
+    updateGuidePosition();
+    document.addEventListener("mousemove", handleMouseMove, { passive: true });
+    document.addEventListener("touchmove", handleTouchMove, { passive: true });
+    document.addEventListener("keydown", handleKeyDown);
+  }
+  function deactivate() {
+    enabled = false;
+    document.removeEventListener("mousemove", handleMouseMove);
+    document.removeEventListener("touchmove", handleTouchMove);
+    document.removeEventListener("keydown", handleKeyDown);
+    if (guideEl) {
+      guideEl.remove();
+      guideEl = null;
+    }
+    localStorage.removeItem(STORAGE_KEY);
+  }
+  return {
+    id: "reading-guide",
+    name: () => "Reading Guide",
+    description: "Horizontal ruler that follows your cursor for easier reading",
+    icon: "reading-guide",
+    category: "cognitive",
+    activate,
+    deactivate,
+    getState: () => ({
+      id: "reading-guide",
+      enabled,
+      value: { ...options }
+    }),
+    setState: (newOptions) => {
+      options = {
+        height: Math.min(60, Math.max(2, newOptions.height ?? options.height)),
+        opacity: Math.min(1, Math.max(0.1, newOptions.opacity ?? options.opacity))
+      };
+      localStorage.setItem(STORAGE_KEY, JSON.stringify(options));
+      if (guideEl) {
+        guideEl.style.height = `${options.height}px`;
+        guideEl.style.backgroundColor = `rgba(255, 255, 0, ${options.opacity})`;
+        updateGuidePosition();
+      }
+    }
+  };
+}
+export {
+  createReadingGuideModule as default
+};
+//# sourceMappingURL=reading-guide-VT8NciIL.js.map

package/dist/reading-guide-VT8NciIL.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reading-guide-VT8NciIL.js","sources":["../src/features/reading-guide.ts"],"sourcesContent":["import type { FeatureModule, FeatureState } from '../types';\n\ninterface ReadingGuideOptions {\n  height: number;\n  opacity: number;\n}\n\nconst DEFAULT_OPTIONS: ReadingGuideOptions = {\n  height: 8,\n  opacity: 0.3,\n};\n\nexport default function createReadingGuideModule(): FeatureModule {\n  let enabled = false;\n  let guideEl: HTMLDivElement | null = null;\n  let currentY = 0;\n  let options: ReadingGuideOptions = { ...DEFAULT_OPTIONS };\n  const STORAGE_KEY = 'accessify-reading-guide';\n  const GUIDE_ID = 'accessify-reading-guide';\n\n  function handleMouseMove(e: MouseEvent) {\n    currentY = e.clientY;\n    updateGuidePosition();\n  }\n\n  function handleTouchMove(e: TouchEvent) {\n    if (e.touches.length > 0) {\n      currentY = e.touches[0].clientY;\n      updateGuidePosition();\n    }\n  }\n\n  function handleKeyDown(e: KeyboardEvent) {\n    if (!enabled || !guideEl) return;\n    const STEP = 10;\n    if (e.key === 'ArrowUp') {\n      e.preventDefault();\n      currentY = Math.max(0, currentY - STEP);\n      updateGuidePosition();\n    } else if (e.key === 'ArrowDown') {\n      e.preventDefault();\n      currentY = Math.min(window.innerHeight, currentY + STEP);\n      updateGuidePosition();\n    }\n  }\n\n  function updateGuidePosition() {\n    if (!guideEl) return;\n    const halfHeight = options.height / 2;\n    guideEl.style.top = `${currentY - halfHeight}px`;\n  }\n\n  function createGuideElement(): HTMLDivElement {\n    const el = document.createElement('div');\n    el.id = GUIDE_ID;\n    el.setAttribute('role', 'presentation');\n    el.setAttribute('aria-hidden', 'true');\n    Object.assign(el.style, {\n      position: 'fixed',\n      left: '0',\n      width: '100%',\n      height: `${options.height}px`,\n      backgroundColor: `rgba(255, 255, 0, ${options.opacity})`,\n      pointerEvents: 'none',\n      zIndex: '2147483646',\n      top: '50%',\n      transition: 'top 0.05s linear',\n      boxShadow: '0 0 4px rgba(0,0,0,0.2)',\n    });\n    return el;\n  }\n\n  function activate() {\n    enabled = true;\n    const saved = localStorage.getItem(STORAGE_KEY);\n    if (saved) {\n      try {\n        const parsed = JSON.parse(saved);\n        options = {\n          height: Math.min(60, Math.max(2, parsed.height ?? DEFAULT_OPTIONS.height)),\n          opacity: Math.min(1, Math.max(0.1, parsed.opacity ?? DEFAULT_OPTIONS.opacity)),\n        };\n      } catch {\n        options = { ...DEFAULT_OPTIONS };\n      }\n    }\n\n    guideEl = createGuideElement();\n    document.documentElement.appendChild(guideEl);\n\n    currentY = window.innerHeight / 2;\n    updateGuidePosition();\n\n    document.addEventListener('mousemove', handleMouseMove, { passive: true });\n    document.addEventListener('touchmove', handleTouchMove, { passive: true });\n    document.addEventListener('keydown', handleKeyDown);\n  }\n\n  function deactivate() {\n    enabled = false;\n    document.removeEventListener('mousemove', handleMouseMove);\n    document.removeEventListener('touchmove', handleTouchMove);\n    document.removeEventListener('keydown', handleKeyDown);\n\n    if (guideEl) {\n      guideEl.remove();\n      guideEl = null;\n    }\n    localStorage.removeItem(STORAGE_KEY);\n  }\n\n  return {\n    id: 'reading-guide',\n    name: () => 'Reading Guide',\n    description: 'Horizontal ruler that follows your cursor for easier reading',\n    icon: 'reading-guide',\n    category: 'cognitive',\n    activate,\n    deactivate,\n    getState: (): FeatureState => ({\n      id: 'reading-guide',\n      enabled,\n      value: { ...options },\n    }),\n    setState: (newOptions: Partial<ReadingGuideOptions>) => {\n      options = {\n        height: Math.min(60, Math.max(2, newOptions.height ?? options.height)),\n        opacity: Math.min(1, Math.max(0.1, newOptions.opacity ?? options.opacity)),\n      };\n      localStorage.setItem(STORAGE_KEY, JSON.stringify(options));\n\n      if (guideEl) {\n        guideEl.style.height = `${options.height}px`;\n        guideEl.style.backgroundColor = `rgba(255, 255, 0, ${options.opacity})`;\n        updateGuidePosition();\n      }\n    },\n  };\n}\n"],"names":["DEFAULT_OPTIONS"],"mappings":"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"}

package/dist/reading-mask-BABChuCz.js

@@ -0,0 +1,76 @@
+function createReadingMaskModule() {
+  let enabled = false;
+  let maskTop = null;
+  let maskBottom = null;
+  let viewportHeight = 120;
+  function createOverlays() {
+    maskTop = document.createElement("div");
+    maskBottom = document.createElement("div");
+    const baseStyle = `
+      position: fixed; left: 0; right: 0; z-index: 999990;
+      background: rgba(0, 0, 0, 0.65); pointer-events: none;
+      transition: top 80ms ease, bottom 80ms ease, height 80ms ease;
+    `;
+    maskTop.setAttribute("style", baseStyle + "top: 0;");
+    maskTop.setAttribute("aria-hidden", "true");
+    maskTop.id = "accessify-mask-top";
+    maskBottom.setAttribute("style", baseStyle + "bottom: 0;");
+    maskBottom.setAttribute("aria-hidden", "true");
+    maskBottom.id = "accessify-mask-bottom";
+    document.body.appendChild(maskTop);
+    document.body.appendChild(maskBottom);
+  }
+  function handleMouseMove(e) {
+    if (!maskTop || !maskBottom) return;
+    const y = e.clientY;
+    const half = viewportHeight / 2;
+    const topH = Math.max(0, y - half);
+    const bottomH = Math.max(0, window.innerHeight - y - half);
+    maskTop.style.height = topH + "px";
+    maskBottom.style.height = bottomH + "px";
+  }
+  function handleKeyDown(e) {
+    if (!maskTop || !maskBottom) return;
+    if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+      const active = document.activeElement;
+      if (!active) return;
+      const rect = active.getBoundingClientRect();
+      const y = rect.top + rect.height / 2;
+      const half = viewportHeight / 2;
+      maskTop.style.height = Math.max(0, y - half) + "px";
+      maskBottom.style.height = Math.max(0, window.innerHeight - y - half) + "px";
+    }
+  }
+  function activate() {
+    enabled = true;
+    createOverlays();
+    document.addEventListener("mousemove", handleMouseMove);
+    document.addEventListener("keydown", handleKeyDown);
+  }
+  function deactivate() {
+    enabled = false;
+    document.removeEventListener("mousemove", handleMouseMove);
+    document.removeEventListener("keydown", handleKeyDown);
+    maskTop?.remove();
+    maskBottom?.remove();
+    maskTop = null;
+    maskBottom = null;
+  }
+  return {
+    id: "reading-mask",
+    name: () => "Reading Mask",
+    description: "Focus window that dims surrounding content",
+    icon: "reading-mask",
+    category: "motor",
+    activate,
+    deactivate,
+    getState: () => ({ id: "reading-mask", enabled, value: viewportHeight }),
+    setState: (height) => {
+      viewportHeight = Math.min(400, Math.max(60, height));
+    }
+  };
+}
+export {
+  createReadingMaskModule as default
+};
+//# sourceMappingURL=reading-mask-BABChuCz.js.map

package/dist/reading-mask-BABChuCz.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reading-mask-BABChuCz.js","sources":["../src/features/reading-mask.ts"],"sourcesContent":["import type { FeatureModule, FeatureState } from '../types';\n\nexport default function createReadingMaskModule(): FeatureModule {\n  let enabled = false;\n  let maskTop: HTMLElement | null = null;\n  let maskBottom: HTMLElement | null = null;\n  let viewportHeight = 120;\n\n  const STORAGE_KEY = 'accessify-reading-mask';\n\n  function createOverlays() {\n    maskTop = document.createElement('div');\n    maskBottom = document.createElement('div');\n\n    const baseStyle = `\n      position: fixed; left: 0; right: 0; z-index: 999990;\n      background: rgba(0, 0, 0, 0.65); pointer-events: none;\n      transition: top 80ms ease, bottom 80ms ease, height 80ms ease;\n    `;\n    maskTop.setAttribute('style', baseStyle + 'top: 0;');\n    maskTop.setAttribute('aria-hidden', 'true');\n    maskTop.id = 'accessify-mask-top';\n    maskBottom.setAttribute('style', baseStyle + 'bottom: 0;');\n    maskBottom.setAttribute('aria-hidden', 'true');\n    maskBottom.id = 'accessify-mask-bottom';\n\n    document.body.appendChild(maskTop);\n    document.body.appendChild(maskBottom);\n  }\n\n  function handleMouseMove(e: MouseEvent) {\n    if (!maskTop || !maskBottom) return;\n    const y = e.clientY;\n    const half = viewportHeight / 2;\n    const topH = Math.max(0, y - half);\n    const bottomH = Math.max(0, window.innerHeight - y - half);\n    maskTop.style.height = topH + 'px';\n    maskBottom.style.height = bottomH + 'px';\n  }\n\n  function handleKeyDown(e: KeyboardEvent) {\n    if (!maskTop || !maskBottom) return;\n    if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n      const active = document.activeElement as HTMLElement | null;\n      if (!active) return;\n      const rect = active.getBoundingClientRect();\n      const y = rect.top + rect.height / 2;\n      const half = viewportHeight / 2;\n      maskTop.style.height = Math.max(0, y - half) + 'px';\n      maskBottom.style.height = Math.max(0, window.innerHeight - y - half) + 'px';\n    }\n  }\n\n  function activate() {\n    enabled = true;\n    createOverlays();\n    document.addEventListener('mousemove', handleMouseMove);\n    document.addEventListener('keydown', handleKeyDown);\n  }\n\n  function deactivate() {\n    enabled = false;\n    document.removeEventListener('mousemove', handleMouseMove);\n    document.removeEventListener('keydown', handleKeyDown);\n    maskTop?.remove();\n    maskBottom?.remove();\n    maskTop = null;\n    maskBottom = null;\n  }\n\n  return {\n    id: 'reading-mask',\n    name: () => 'Reading Mask',\n    description: 'Focus window that dims surrounding content',\n    icon: 'reading-mask',\n    category: 'motor',\n    activate,\n    deactivate,\n    getState: (): FeatureState => ({ id: 'reading-mask', enabled, value: viewportHeight }),\n    setState: (height: number) => {\n      viewportHeight = Math.min(400, Math.max(60, height));\n    },\n  };\n}\n"],"names":[],"mappings":"AAEA,SAAwB,0BAAyC;AAC/D,MAAI,UAAU;AACd,MAAI,UAA8B;AAClC,MAAI,aAAiC;AACrC,MAAI,iBAAiB;AAIrB,WAAS,iBAAiB;AACxB,cAAU,SAAS,cAAc,KAAK;AACtC,iBAAa,SAAS,cAAc,KAAK;AAEzC,UAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAKlB,YAAQ,aAAa,SAAS,YAAY,SAAS;AACnD,YAAQ,aAAa,eAAe,MAAM;AAC1C,YAAQ,KAAK;AACb,eAAW,aAAa,SAAS,YAAY,YAAY;AACzD,eAAW,aAAa,eAAe,MAAM;AAC7C,eAAW,KAAK;AAEhB,aAAS,KAAK,YAAY,OAAO;AACjC,aAAS,KAAK,YAAY,UAAU;AAAA,EACtC;AAEA,WAAS,gBAAgB,GAAe;AACtC,QAAI,CAAC,WAAW,CAAC,WAAY;AAC7B,UAAM,IAAI,EAAE;AACZ,UAAM,OAAO,iBAAiB;AAC9B,UAAM,OAAO,KAAK,IAAI,GAAG,IAAI,IAAI;AACjC,UAAM,UAAU,KAAK,IAAI,GAAG,OAAO,cAAc,IAAI,IAAI;AACzD,YAAQ,MAAM,SAAS,OAAO;AAC9B,eAAW,MAAM,SAAS,UAAU;AAAA,EACtC;AAEA,WAAS,cAAc,GAAkB;AACvC,QAAI,CAAC,WAAW,CAAC,WAAY;AAC7B,QAAI,EAAE,QAAQ,aAAa,EAAE,QAAQ,aAAa;AAChD,YAAM,SAAS,SAAS;AACxB,UAAI,CAAC,OAAQ;AACb,YAAM,OAAO,OAAO,sBAAA;AACpB,YAAM,IAAI,KAAK,MAAM,KAAK,SAAS;AACnC,YAAM,OAAO,iBAAiB;AAC9B,cAAQ,MAAM,SAAS,KAAK,IAAI,GAAG,IAAI,IAAI,IAAI;AAC/C,iBAAW,MAAM,SAAS,KAAK,IAAI,GAAG,OAAO,cAAc,IAAI,IAAI,IAAI;AAAA,IACzE;AAAA,EACF;AAEA,WAAS,WAAW;AAClB,cAAU;AACV,mBAAA;AACA,aAAS,iBAAiB,aAAa,eAAe;AACtD,aAAS,iBAAiB,WAAW,aAAa;AAAA,EACpD;AAEA,WAAS,aAAa;AACpB,cAAU;AACV,aAAS,oBAAoB,aAAa,eAAe;AACzD,aAAS,oBAAoB,WAAW,aAAa;AACrD,aAAS,OAAA;AACT,gBAAY,OAAA;AACZ,cAAU;AACV,iBAAa;AAAA,EACf;AAEA,SAAO;AAAA,IACL,IAAI;AAAA,IACJ,MAAM,MAAM;AAAA,IACZ,aAAa;AAAA,IACb,MAAM;AAAA,IACN,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,UAAU,OAAqB,EAAE,IAAI,gBAAgB,SAAS,OAAO;IACrE,UAAU,CAAC,WAAmB;AAC5B,uBAAiB,KAAK,IAAI,KAAK,KAAK,IAAI,IAAI,MAAM,CAAC;AAAA,IACrD;AAAA,EAAA;AAEJ;"}

package/dist/saturation-D8ZXpWAN.js

@@ -0,0 +1,59 @@
+function createSaturationModule() {
+  let currentMode = "off";
+  const STYLE_ID = "accessify-saturation";
+  const STORAGE_KEY = "accessify-saturation-mode";
+  function getStyles(mode) {
+    switch (mode) {
+      case "low":
+        return "html { filter: saturate(0.3) !important; }";
+      case "grayscale":
+        return "html { filter: grayscale(1) !important; }";
+      case "high":
+        return "html { filter: saturate(1.8) !important; }";
+      default:
+        return "";
+    }
+  }
+  function applyStyles(mode) {
+    let styleEl = document.getElementById(STYLE_ID);
+    if (mode === "off") {
+      styleEl?.remove();
+      return;
+    }
+    if (!styleEl) {
+      styleEl = document.createElement("style");
+      styleEl.id = STYLE_ID;
+      document.head.appendChild(styleEl);
+    }
+    styleEl.textContent = getStyles(mode);
+  }
+  function activate() {
+    const saved = localStorage.getItem(STORAGE_KEY);
+    currentMode = saved || "grayscale";
+    applyStyles(currentMode);
+  }
+  function deactivate() {
+    currentMode = "off";
+    applyStyles("off");
+    localStorage.removeItem(STORAGE_KEY);
+  }
+  return {
+    id: "saturation",
+    name: () => "Saturation",
+    description: "Adjust color saturation or grayscale",
+    icon: "saturation",
+    category: "visual",
+    activate,
+    deactivate,
+    getState: () => ({ id: "saturation", enabled: currentMode !== "off", value: currentMode }),
+    setState: (mode) => {
+      currentMode = mode;
+      applyStyles(mode);
+      localStorage.setItem(STORAGE_KEY, mode);
+    }
+  };
+}
+export {
+  createSaturationModule as default
+};
+//# sourceMappingURL=saturation-D8ZXpWAN.js.map

package/dist/saturation-D8ZXpWAN.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"saturation-D8ZXpWAN.js","sources":["../src/features/saturation.ts"],"sourcesContent":["import type { FeatureModule, FeatureState } from '../types';\n\ntype SaturationMode = 'off' | 'low' | 'grayscale' | 'high';\n\nexport default function createSaturationModule(): FeatureModule {\n  let currentMode: SaturationMode = 'off';\n  const STYLE_ID = 'accessify-saturation';\n  const STORAGE_KEY = 'accessify-saturation-mode';\n\n  function getStyles(mode: SaturationMode): string {\n    switch (mode) {\n      case 'low':\n        return 'html { filter: saturate(0.3) !important; }';\n      case 'grayscale':\n        return 'html { filter: grayscale(1) !important; }';\n      case 'high':\n        return 'html { filter: saturate(1.8) !important; }';\n      default:\n        return '';\n    }\n  }\n\n  function applyStyles(mode: SaturationMode) {\n    let styleEl = document.getElementById(STYLE_ID);\n    if (mode === 'off') {\n      styleEl?.remove();\n      return;\n    }\n    if (!styleEl) {\n      styleEl = document.createElement('style');\n      styleEl.id = STYLE_ID;\n      document.head.appendChild(styleEl);\n    }\n    styleEl.textContent = getStyles(mode);\n  }\n\n  function activate() {\n    const saved = localStorage.getItem(STORAGE_KEY) as SaturationMode;\n    currentMode = saved || 'grayscale';\n    applyStyles(currentMode);\n  }\n\n  function deactivate() {\n    currentMode = 'off';\n    applyStyles('off');\n    localStorage.removeItem(STORAGE_KEY);\n  }\n\n  return {\n    id: 'saturation',\n    name: () => 'Saturation',\n    description: 'Adjust color saturation or grayscale',\n    icon: 'saturation',\n    category: 'visual',\n    activate,\n    deactivate,\n    getState: (): FeatureState => ({ id: 'saturation', enabled: currentMode !== 'off', value: currentMode }),\n    setState: (mode: SaturationMode) => {\n      currentMode = mode;\n      applyStyles(mode);\n      localStorage.setItem(STORAGE_KEY, mode);\n    },\n  };\n}\n"],"names":[],"mappings":"AAIA,SAAwB,yBAAwC;AAC9D,MAAI,cAA8B;AAClC,QAAM,WAAW;AACjB,QAAM,cAAc;AAEpB,WAAS,UAAU,MAA8B;AAC/C,YAAQ,MAAA;AAAA,MACN,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT;AACE,eAAO;AAAA,IAAA;AAAA,EAEb;AAEA,WAAS,YAAY,MAAsB;AACzC,QAAI,UAAU,SAAS,eAAe,QAAQ;AAC9C,QAAI,SAAS,OAAO;AAClB,eAAS,OAAA;AACT;AAAA,IACF;AACA,QAAI,CAAC,SAAS;AACZ,gBAAU,SAAS,cAAc,OAAO;AACxC,cAAQ,KAAK;AACb,eAAS,KAAK,YAAY,OAAO;AAAA,IACnC;AACA,YAAQ,cAAc,UAAU,IAAI;AAAA,EACtC;AAEA,WAAS,WAAW;AAClB,UAAM,QAAQ,aAAa,QAAQ,WAAW;AAC9C,kBAAc,SAAS;AACvB,gBAAY,WAAW;AAAA,EACzB;AAEA,WAAS,aAAa;AACpB,kBAAc;AACd,gBAAY,KAAK;AACjB,iBAAa,WAAW,WAAW;AAAA,EACrC;AAEA,SAAO;AAAA,IACL,IAAI;AAAA,IACJ,MAAM,MAAM;AAAA,IACZ,aAAa;AAAA,IACb,MAAM;AAAA,IACN,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,UAAU,OAAqB,EAAE,IAAI,cAAc,SAAS,gBAAgB,OAAO,OAAO;IAC1F,UAAU,CAAC,SAAyB;AAClC,oBAAc;AACd,kBAAY,IAAI;AAChB,mBAAa,QAAQ,aAAa,IAAI;AAAA,IACxC;AAAA,EAAA;AAEJ;"}

package/dist/spacing-DENai3JU.js

@@ -0,0 +1,106 @@
+const DEFAULT_VALUES = {
+  lineHeight: 1.5,
+  paragraphSpacing: 2,
+  letterSpacing: 0.12,
+  wordSpacing: 0.16
+};
+const MAX_VALUES = {
+  lineHeight: 2.5,
+  paragraphSpacing: 4,
+  letterSpacing: 0.24,
+  wordSpacing: 0.32
+};
+function createSpacingModule() {
+  let enabled = false;
+  let currentValues = { ...DEFAULT_VALUES };
+  const STYLE_ID = "accessify-spacing";
+  const STORAGE_KEY = "accessify-spacing";
+  function applySpacing(values) {
+    const root = document.documentElement;
+    root.style.setProperty("--accessify-line-height", String(values.lineHeight));
+    root.style.setProperty("--accessify-paragraph-spacing", `${values.paragraphSpacing}em`);
+    root.style.setProperty("--accessify-letter-spacing", `${values.letterSpacing}em`);
+    root.style.setProperty("--accessify-word-spacing", `${values.wordSpacing}em`);
+    let styleEl = document.getElementById(STYLE_ID);
+    if (!styleEl) {
+      styleEl = document.createElement("style");
+      styleEl.id = STYLE_ID;
+      document.head.appendChild(styleEl);
+    }
+    styleEl.textContent = `
+      /* accessify WCAG 1.4.12 text spacing adjustments */
+      * {
+        line-height: var(--accessify-line-height) !important;
+        letter-spacing: var(--accessify-letter-spacing) !important;
+        word-spacing: var(--accessify-word-spacing) !important;
+      }
+      p {
+        margin-bottom: var(--accessify-paragraph-spacing) !important;
+      }
+      p + p {
+        margin-top: var(--accessify-paragraph-spacing) !important;
+      }
+    `;
+  }
+  function removeSpacing() {
+    const root = document.documentElement;
+    root.style.removeProperty("--accessify-line-height");
+    root.style.removeProperty("--accessify-paragraph-spacing");
+    root.style.removeProperty("--accessify-letter-spacing");
+    root.style.removeProperty("--accessify-word-spacing");
+    const styleEl = document.getElementById(STYLE_ID);
+    styleEl?.remove();
+  }
+  function clampValues(values) {
+    return {
+      lineHeight: Math.min(MAX_VALUES.lineHeight, Math.max(DEFAULT_VALUES.lineHeight, values.lineHeight ?? currentValues.lineHeight)),
+      paragraphSpacing: Math.min(MAX_VALUES.paragraphSpacing, Math.max(DEFAULT_VALUES.paragraphSpacing, values.paragraphSpacing ?? currentValues.paragraphSpacing)),
+      letterSpacing: Math.min(MAX_VALUES.letterSpacing, Math.max(DEFAULT_VALUES.letterSpacing, values.letterSpacing ?? currentValues.letterSpacing)),
+      wordSpacing: Math.min(MAX_VALUES.wordSpacing, Math.max(DEFAULT_VALUES.wordSpacing, values.wordSpacing ?? currentValues.wordSpacing))
+    };
+  }
+  function activate() {
+    enabled = true;
+    const saved = localStorage.getItem(STORAGE_KEY);
+    if (saved) {
+      try {
+        currentValues = clampValues(JSON.parse(saved));
+      } catch {
+        currentValues = { ...DEFAULT_VALUES };
+      }
+    } else {
+      currentValues = { ...DEFAULT_VALUES };
+    }
+    applySpacing(currentValues);
+  }
+  function deactivate() {
+    enabled = false;
+    removeSpacing();
+    localStorage.removeItem(STORAGE_KEY);
+    currentValues = { ...DEFAULT_VALUES };
+  }
+  return {
+    id: "spacing",
+    name: () => "Text Spacing",
+    description: "Adjust line height, letter spacing, word spacing and paragraph spacing (WCAG 1.4.12)",
+    icon: "spacing",
+    category: "visual",
+    activate,
+    deactivate,
+    getState: () => ({
+      id: "spacing",
+      enabled,
+      value: { ...currentValues }
+    }),
+    setState: (values) => {
+      currentValues = clampValues(values);
+      applySpacing(currentValues);
+      localStorage.setItem(STORAGE_KEY, JSON.stringify(currentValues));
+      enabled = true;
+    }
+  };
+}
+export {
+  createSpacingModule as default
+};
+//# sourceMappingURL=spacing-DENai3JU.js.map

package/dist/spacing-DENai3JU.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"spacing-DENai3JU.js","sources":["../src/features/spacing.ts"],"sourcesContent":["import type { FeatureModule, FeatureState } from '../types';\n\ninterface SpacingValues {\n  lineHeight: number;\n  paragraphSpacing: number;\n  letterSpacing: number;\n  wordSpacing: number;\n}\n\nconst DEFAULT_VALUES: SpacingValues = {\n  lineHeight: 1.5,\n  paragraphSpacing: 2,\n  letterSpacing: 0.12,\n  wordSpacing: 0.16,\n};\n\nconst MAX_VALUES: SpacingValues = {\n  lineHeight: 2.5,\n  paragraphSpacing: 4,\n  letterSpacing: 0.24,\n  wordSpacing: 0.32,\n};\n\nexport default function createSpacingModule(): FeatureModule {\n  let enabled = false;\n  let currentValues: SpacingValues = { ...DEFAULT_VALUES };\n  const STYLE_ID = 'accessify-spacing';\n  const STORAGE_KEY = 'accessify-spacing';\n\n  function applySpacing(values: SpacingValues) {\n    const root = document.documentElement;\n    root.style.setProperty('--accessify-line-height', String(values.lineHeight));\n    root.style.setProperty('--accessify-paragraph-spacing', `${values.paragraphSpacing}em`);\n    root.style.setProperty('--accessify-letter-spacing', `${values.letterSpacing}em`);\n    root.style.setProperty('--accessify-word-spacing', `${values.wordSpacing}em`);\n\n    let styleEl = document.getElementById(STYLE_ID);\n    if (!styleEl) {\n      styleEl = document.createElement('style');\n      styleEl.id = STYLE_ID;\n      document.head.appendChild(styleEl);\n    }\n    styleEl.textContent = `\n      /* accessify WCAG 1.4.12 text spacing adjustments */\n      * {\n        line-height: var(--accessify-line-height) !important;\n        letter-spacing: var(--accessify-letter-spacing) !important;\n        word-spacing: var(--accessify-word-spacing) !important;\n      }\n      p {\n        margin-bottom: var(--accessify-paragraph-spacing) !important;\n      }\n      p + p {\n        margin-top: var(--accessify-paragraph-spacing) !important;\n      }\n    `;\n  }\n\n  function removeSpacing() {\n    const root = document.documentElement;\n    root.style.removeProperty('--accessify-line-height');\n    root.style.removeProperty('--accessify-paragraph-spacing');\n    root.style.removeProperty('--accessify-letter-spacing');\n    root.style.removeProperty('--accessify-word-spacing');\n    const styleEl = document.getElementById(STYLE_ID);\n    styleEl?.remove();\n  }\n\n  function clampValues(values: Partial<SpacingValues>): SpacingValues {\n    return {\n      lineHeight: Math.min(MAX_VALUES.lineHeight, Math.max(DEFAULT_VALUES.lineHeight, values.lineHeight ?? currentValues.lineHeight)),\n      paragraphSpacing: Math.min(MAX_VALUES.paragraphSpacing, Math.max(DEFAULT_VALUES.paragraphSpacing, values.paragraphSpacing ?? currentValues.paragraphSpacing)),\n      letterSpacing: Math.min(MAX_VALUES.letterSpacing, Math.max(DEFAULT_VALUES.letterSpacing, values.letterSpacing ?? currentValues.letterSpacing)),\n      wordSpacing: Math.min(MAX_VALUES.wordSpacing, Math.max(DEFAULT_VALUES.wordSpacing, values.wordSpacing ?? currentValues.wordSpacing)),\n    };\n  }\n\n  function activate() {\n    enabled = true;\n    const saved = localStorage.getItem(STORAGE_KEY);\n    if (saved) {\n      try {\n        currentValues = clampValues(JSON.parse(saved));\n      } catch {\n        currentValues = { ...DEFAULT_VALUES };\n      }\n    } else {\n      currentValues = { ...DEFAULT_VALUES };\n    }\n    applySpacing(currentValues);\n  }\n\n  function deactivate() {\n    enabled = false;\n    removeSpacing();\n    localStorage.removeItem(STORAGE_KEY);\n    currentValues = { ...DEFAULT_VALUES };\n  }\n\n  return {\n    id: 'spacing',\n    name: () => 'Text Spacing',\n    description: 'Adjust line height, letter spacing, word spacing and paragraph spacing (WCAG 1.4.12)',\n    icon: 'spacing',\n    category: 'visual',\n    activate,\n    deactivate,\n    getState: (): FeatureState => ({\n      id: 'spacing',\n      enabled,\n      value: { ...currentValues },\n    }),\n    setState: (values: Partial<SpacingValues>) => {\n      currentValues = clampValues(values);\n      applySpacing(currentValues);\n      localStorage.setItem(STORAGE_KEY, JSON.stringify(currentValues));\n      enabled = true;\n    },\n  };\n}\n"],"names":[],"mappings":"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"}

package/dist/text-align-BDRPqPvl.js

@@ -0,0 +1,51 @@
+function createTextAlignModule() {
+  let currentMode = "off";
+  const STYLE_ID = "accessify-text-align";
+  const STORAGE_KEY = "accessify-text-align-mode";
+  function applyStyles(mode) {
+    let styleEl = document.getElementById(STYLE_ID);
+    if (mode === "off") {
+      styleEl?.remove();
+      return;
+    }
+    if (!styleEl) {
+      styleEl = document.createElement("style");
+      styleEl.id = STYLE_ID;
+      document.head.appendChild(styleEl);
+    }
+    styleEl.textContent = `
+      body, body * {
+        text-align: ${mode} !important;
+      }
+    `;
+  }
+  function activate() {
+    const saved = localStorage.getItem(STORAGE_KEY);
+    currentMode = saved || "left";
+    applyStyles(currentMode);
+  }
+  function deactivate() {
+    currentMode = "off";
+    applyStyles("off");
+    localStorage.removeItem(STORAGE_KEY);
+  }
+  return {
+    id: "text-align",
+    name: () => "Text Align",
+    description: "Change text alignment across the page",
+    icon: "text-align",
+    category: "visual",
+    activate,
+    deactivate,
+    getState: () => ({ id: "text-align", enabled: currentMode !== "off", value: currentMode }),
+    setState: (mode) => {
+      currentMode = mode;
+      applyStyles(mode);
+      localStorage.setItem(STORAGE_KEY, mode);
+    }
+  };
+}
+export {
+  createTextAlignModule as default
+};
+//# sourceMappingURL=text-align-BDRPqPvl.js.map