ci: fix release script

# [1.8.0](https://github.com/obsqrbtz/goose-highlighter/compare/v1.7.2...v1.8.0) (2025-10-07)

### Features

* add collapsible sections ([a158a30](a158a303b0))
* add websites to exception list ([915add3](915add3a4c))

.github/workflows/publish-extension.yml

@@ -16,13 +16,25 @@ jobs:
       - name: Checkout repository
         uses: actions/checkout@v4
 
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+          cache: 'npm'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build extension
+        run: npm run build
+
       - name: Set version from tag
         id: version
         run: echo "VERSION=${GITHUB_REF#refs/tags/v}" >> $GITHUB_OUTPUT
 
       - name: Create zip package
         run: |
-          zip -r goose-highlighter.zip . -x '*.git*' 'node_modules/*' 'versioning.md' '.releaserc.json' 'package.json' 'package-lock.json' 'README.md'
+          zip -r goose-highlighter.zip . -x '*.git*' 'node_modules/*' 'src/*' 'versioning.md' '.releaserc.json' 'package.json' 'package-lock.json' 'README.md' 'tsconfig.json' 'eslint.config.mjs'
 
       - name: Install webstore upload CLI
         run: npm install -g chrome-webstore-upload-cli

.github/workflows/release.yml

@@ -0,0 +1,103 @@
+name: Create GitHub Release
+
+on:
+  push:
+    tags:
+      - 'v*'
+
+jobs:
+  release:
+    name: Create Release with Extension Files
+    runs-on: ubuntu-latest
+    
+    permissions:
+      contents: write
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+          cache: 'npm'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build extension
+        run: npm run build
+
+      - name: Get version from tag
+        id: version
+        run: echo "VERSION=${GITHUB_REF#refs/tags/v}" >> $GITHUB_OUTPUT
+
+      - name: Update manifest version
+        run: node scripts/update-manifest-version.js ${{ steps.version.outputs.VERSION }}
+
+      - name: Create extension zip
+        run: |
+          zip -r goose-highlighter-${{ steps.version.outputs.VERSION }}.zip . \
+            -x '*.git*' 'node_modules/*' 'src/*' 'versioning.md' '.releaserc.json' \
+               'package.json' 'package-lock.json' 'README.md' 'tsconfig.json' \
+               'eslint.config.mjs' '.github/*' 'CHANGELOG.md' 'PRIVACY.MD'
+
+      - name: Install Chrome extension packaging tool
+        run: npm install -g crx3
+
+      - name: Generate private key for CRX
+        run: |
+          openssl genrsa -out key.pem 2048
+          
+      - name: Create CRX file
+        run: |
+          # Create a temporary directory for the extension
+          mkdir temp_extension
+          
+          # Copy all files except excluded ones to temp directory
+          rsync -av --exclude='.git*' --exclude='node_modules' --exclude='src' \
+                --exclude='versioning.md' --exclude='.releaserc.json' \
+                --exclude='package.json' --exclude='package-lock.json' \
+                --exclude='README.md' --exclude='tsconfig.json' \
+                --exclude='eslint.config.mjs' --exclude='.github' \
+                --exclude='CHANGELOG.md' --exclude='PRIVACY.MD' \
+                --exclude='key.pem' --exclude='temp_extension' \
+                ./ temp_extension/
+          
+          # Create CRX file
+          crx3 temp_extension -o goose-highlighter-${{ steps.version.outputs.VERSION }}.crx -p key.pem
+          
+          # Clean up
+          rm -rf temp_extension key.pem
+
+      - name: Generate release notes
+        id: release_notes
+        run: |
+          if [ -f CHANGELOG.md ]; then
+            # Extract the latest version's changes from CHANGELOG.md
+            awk '/^## \[${{ steps.version.outputs.VERSION }}\]/{flag=1; next} /^## \[/{flag=0} flag' CHANGELOG.md > release_notes.txt
+            if [ -s release_notes.txt ]; then
+              echo "RELEASE_NOTES<<EOF" >> $GITHUB_OUTPUT
+              cat release_notes.txt >> $GITHUB_OUTPUT
+              echo "EOF" >> $GITHUB_OUTPUT
+            else
+              echo "RELEASE_NOTES=Release ${{ steps.version.outputs.VERSION }}" >> $GITHUB_OUTPUT
+            fi
+          else
+            echo "RELEASE_NOTES=Release ${{ steps.version.outputs.VERSION }}" >> $GITHUB_OUTPUT
+          fi
+
+      - name: Create GitHub Release
+        uses: softprops/action-gh-release@v1
+        with:
+          tag_name: ${{ github.ref_name }}
+          name: Release ${{ steps.version.outputs.VERSION }}
+          body: ${{ steps.release_notes.outputs.RELEASE_NOTES }}
+          files: |
+            goose-highlighter-${{ steps.version.outputs.VERSION }}.zip
+            goose-highlighter-${{ steps.version.outputs.VERSION }}.crx
+          draft: false
+          prerelease: false
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.gitignore

@@ -1 +1,3 @@
 node_modules
+
+dist

.releaserc.json

@@ -19,7 +19,7 @@
                     "manifest.json",
                     "CHANGELOG.md"
                 ],
-                "message": "chore(release): ${nextRelease.version} [skip ci]\n\n${nextRelease.notes}"
+                "message": "chore(release): ${nextRelease.version}\n\n${nextRelease.notes}"
             }
         ]
     ]

CHANGELOG.md

@@ -1,3 +1,41 @@
+# [1.8.0](https://github.com/obsqrbtz/goose-highlighter/compare/v1.7.2...v1.8.0) (2025-10-07)
+
+
+### Features
+
+* add collapsible sections ([a158a30](https://github.com/obsqrbtz/goose-highlighter/commit/a158a303b01416f81e69bb137b71d3369904b044))
+* add websites to exception list ([915add3](https://github.com/obsqrbtz/goose-highlighter/commit/915add3a4cdbff390a4d0f7d227a4ece5fa31072))
+
+## [1.7.2](https://github.com/obsqrbtz/goose-highlighter/compare/v1.7.1...v1.7.2) (2025-10-06)
+
+
+### Bug Fixes
+
+* do not create <mark> elements, just wrap found words in <span> and add .css styling ([6ba0d2e](https://github.com/obsqrbtz/goose-highlighter/commit/6ba0d2eb7c7346cdca3921a12d300a714439efa5))
+
+## [1.7.1](https://github.com/obsqrbtz/goose-highlighter/compare/v1.7.0...v1.7.1) (2025-06-27)
+
+
+### Bug Fixes
+
+* unicode support in regex ([ae1cf48](https://github.com/obsqrbtz/goose-highlighter/commit/ae1cf48c53cd42e65279cf2acde1a2860d8a31ee))
+
+# [1.7.0](https://github.com/obsqrbtz/goose-highlighter/compare/v1.6.0...v1.7.0) (2025-06-26)
+
+
+### Bug Fixes
+
+* colorbox styling ([1e704b5](https://github.com/obsqrbtz/goose-highlighter/commit/1e704b51a859845e539224aeb389a4e493d64520))
+* colorbox styling ([08ad7c4](https://github.com/obsqrbtz/goose-highlighter/commit/08ad7c432541ea4240dec05a340ad0b3279ce82f))
+* moved import/export to options section ([fe15965](https://github.com/obsqrbtz/goose-highlighter/commit/fe15965e89e8483f6b96eb779617053664c9d5b1))
+* wordlist scrollbar styling ([b30fac5](https://github.com/obsqrbtz/goose-highlighter/commit/b30fac5deda7941035d8ae23001c998c2584c03e))
+
+
+### Features
+
+* add word search ([80d4bff](https://github.com/obsqrbtz/goose-highlighter/commit/80d4bff0b4ef7c9e97506d1fe43a827bcc4b28fd))
+* added matching flags ([759307f](https://github.com/obsqrbtz/goose-highlighter/commit/759307f9834a2bbb23e963e2042b7d41d5cfda44))
+
 # [1.6.0](https://github.com/obsqrbtz/goose-highlighter/compare/v1.5.0...v1.6.0) (2025-06-25)
 
 

README.md

@@ -8,7 +8,8 @@ Goose Highlighter is a browser extension that allows you to highlight custom wor
 - **Custom Colors:** Set background and foreground for each list and individual word.
 - **Bulk Add:** Paste multiple words at once.
 - **Enable/Disable:** Toggle highlighting globally, per list, or per word.
-- **Import/Export:** Backup or share your highlight lists as JSON files.
+- **Site Exceptions:** Add websites to an exceptions list to disable highlighting on specific sites.
+- **Import/Export:** Backup or share your highlight lists and exceptions as JSON files.
 
 ## Install
 

_locales/de/messages.json

@@ -94,5 +94,29 @@
 },
   "options": { "message": "Optionen" },
   "match_case": { "message": "Groß-/Kleinschreibung beachten" },
-  "match_whole": { "message": "Ganzes Wort übereinstimmen" }
+  "match_whole": { "message": "Ganzes Wort übereinstimmen" },
+  "site_exceptions": {
+    "message": "Website-Ausnahmen"
+  },
+  "add_exception": {
+    "message": "Zu Ausnahmen hinzufügen"
+  },
+  "remove_exception": {
+    "message": "Aus Ausnahmen entfernen"
+  },
+  "manage_exceptions": {
+    "message": "Verwalten"
+  },
+  "exceptions_list": {
+    "message": "Ausnahme-Websites:"
+  },
+  "clear_all": {
+    "message": "Alle löschen"
+  },
+  "confirm_clear_exceptions": {
+    "message": "Möchten Sie wirklich alle Ausnahmen löschen?"
+  },
+  "remove": {
+    "message": "Entfernen"
+  }
 }

_locales/en/messages.json

@@ -100,5 +100,29 @@
   },
   "match_whole": {
     "message": "Match Whole Word"
+  },
+  "site_exceptions": {
+    "message": "Site Exceptions"
+  },
+  "add_exception": {
+    "message": "Add to Exceptions"
+  },
+  "remove_exception": {
+    "message": "Remove from Exceptions"
+  },
+  "manage_exceptions": {
+    "message": "Manage"
+  },
+  "exceptions_list": {
+    "message": "Exception Sites:"
+  },
+  "clear_all": {
+    "message": "Clear All"
+  },
+  "confirm_clear_exceptions": {
+    "message": "Are you sure you want to clear all exceptions?"
+  },
+  "remove": {
+    "message": "Remove"
   }
 }

_locales/es/messages.json

@@ -100,5 +100,29 @@
   },
   "match_whole": {
     "message": "Coincidir palabra completa"
+  },
+  "site_exceptions": {
+    "message": "Excepciones de sitios"
+  },
+  "add_exception": {
+    "message": "Agregar a excepciones"
+  },
+  "remove_exception": {
+    "message": "Quitar de excepciones"
+  },
+  "manage_exceptions": {
+    "message": "Gestionar"
+  },
+  "exceptions_list": {
+    "message": "Sitios de excepción:"
+  },
+  "clear_all": {
+    "message": "Limpiar todo"
+  },
+  "confirm_clear_exceptions": {
+    "message": "¿Estás seguro de que deseas limpiar todas las excepciones?"
+  },
+  "remove": {
+    "message": "Eliminar"
   }
 }

_locales/fr/messages.json

@@ -100,5 +100,29 @@
     },
     "match_whole": {
         "message": "Mot entier seulement"
+    },
+    "site_exceptions": {
+        "message": "Exceptions de sites"
+    },
+    "add_exception": {
+        "message": "Ajouter aux exceptions"
+    },
+    "remove_exception": {
+        "message": "Retirer des exceptions"
+    },
+    "manage_exceptions": {
+        "message": "Gérer"
+    },
+    "exceptions_list": {
+        "message": "Sites d'exception :"
+    },
+    "clear_all": {
+        "message": "Tout effacer"
+    },
+    "confirm_clear_exceptions": {
+        "message": "Êtes-vous sûr de vouloir effacer toutes les exceptions ?"
+    },
+    "remove": {
+        "message": "Supprimer"
     }
 }

_locales/hi/messages.json

@@ -100,5 +100,29 @@
     },
     "match_whole": {
         "message": "पूरा शब्द मिलाएं"
+    },
+    "site_exceptions": {
+        "message": "साइट अपवाद"
+    },
+    "add_exception": {
+        "message": "अपवादों में जोड़ें"
+    },
+    "remove_exception": {
+        "message": "अपवादों से हटाएं"
+    },
+    "manage_exceptions": {
+        "message": "प्रबंधित करें"
+    },
+    "exceptions_list": {
+        "message": "अपवाद साइटें:"
+    },
+    "clear_all": {
+        "message": "सभी साफ करें"
+    },
+    "confirm_clear_exceptions": {
+        "message": "क्या आप वाकई सभी अपवादों को साफ करना चाहते हैं?"
+    },
+    "remove": {
+        "message": "हटाएं"
     }
 }

_locales/it/messages.json

@@ -100,5 +100,29 @@
     },
     "match_whole": {
         "message": "Solo parola intera"
+    },
+    "site_exceptions": {
+        "message": "Eccezioni siti"
+    },
+    "add_exception": {
+        "message": "Aggiungi alle eccezioni"
+    },
+    "remove_exception": {
+        "message": "Rimuovi dalle eccezioni"
+    },
+    "manage_exceptions": {
+        "message": "Gestisci"
+    },
+    "exceptions_list": {
+        "message": "Siti di eccezione:"
+    },
+    "clear_all": {
+        "message": "Cancella tutto"
+    },
+    "confirm_clear_exceptions": {
+        "message": "Sei sicuro di voler cancellare tutte le eccezioni?"
+    },
+    "remove": {
+        "message": "Rimuovi"
     }
 }

_locales/ja/messages.json

@@ -100,5 +100,29 @@
     },
     "match_whole": {
         "message": "完全一致"
+    },
+    "site_exceptions": {
+        "message": "サイト例外"
+    },
+    "add_exception": {
+        "message": "例外に追加"
+    },
+    "remove_exception": {
+        "message": "例外から削除"
+    },
+    "manage_exceptions": {
+        "message": "管理"
+    },
+    "exceptions_list": {
+        "message": "例外サイト:"
+    },
+    "clear_all": {
+        "message": "すべてクリア"
+    },
+    "confirm_clear_exceptions": {
+        "message": "すべての例外をクリアしてもよろしいですか？"
+    },
+    "remove": {
+        "message": "削除"
     }
 }

_locales/ko/messages.json

@@ -100,5 +100,29 @@
     },
     "match_whole": {
         "message": "전체 단어 일치"
+    },
+    "site_exceptions": {
+        "message": "사이트 예외"
+    },
+    "add_exception": {
+        "message": "예외에 추가"
+    },
+    "remove_exception": {
+        "message": "예외에서 제거"
+    },
+    "manage_exceptions": {
+        "message": "관리"
+    },
+    "exceptions_list": {
+        "message": "예외 사이트:"
+    },
+    "clear_all": {
+        "message": "모두 지우기"
+    },
+    "confirm_clear_exceptions": {
+        "message": "모든 예외를 지우시겠습니까?"
+    },
+    "remove": {
+        "message": "제거"
     }
 }

_locales/nl/messages.json

@@ -100,5 +100,29 @@
   },
   "match_whole": {
     "message": "Alleen volledig woord"
+  },
+  "site_exceptions": {
+    "message": "Site-uitzonderingen"
+  },
+  "add_exception": {
+    "message": "Toevoegen aan uitzonderingen"
+  },
+  "remove_exception": {
+    "message": "Verwijderen uit uitzonderingen"
+  },
+  "manage_exceptions": {
+    "message": "Beheren"
+  },
+  "exceptions_list": {
+    "message": "Uitzondering sites:"
+  },
+  "clear_all": {
+    "message": "Alles wissen"
+  },
+  "confirm_clear_exceptions": {
+    "message": "Weet je zeker dat je alle uitzonderingen wilt wissen?"
+  },
+  "remove": {
+    "message": "Verwijderen"
   }
 }

_locales/pl/messages.json

@@ -100,5 +100,29 @@
   },
   "match_whole": {
     "message": "Tylko całe słowo"
+  },
+  "site_exceptions": {
+    "message": "Wyjątki stron"
+  },
+  "add_exception": {
+    "message": "Dodaj do wyjątków"
+  },
+  "remove_exception": {
+    "message": "Usuń z wyjątków"
+  },
+  "manage_exceptions": {
+    "message": "Zarządzaj"
+  },
+  "exceptions_list": {
+    "message": "Strony wyjątków:"
+  },
+  "clear_all": {
+    "message": "Wyczyść wszystko"
+  },
+  "confirm_clear_exceptions": {
+    "message": "Czy na pewno chcesz wyczyścić wszystkie wyjątki?"
+  },
+  "remove": {
+    "message": "Usuń"
   }
 }

_locales/pt_BR/messages.json

@@ -94,5 +94,29 @@
 },
   "options": { "message": "Opções" },
   "match_case": { "message": "Diferenciar maiúsculas/minúsculas" },
-  "match_whole": { "message": "Palavra inteira" }
+  "match_whole": { "message": "Palavra inteira" },
+  "site_exceptions": {
+    "message": "Exceções de sites"
+  },
+  "add_exception": {
+    "message": "Adicionar às exceções"
+  },
+  "remove_exception": {
+    "message": "Remover das exceções"
+  },
+  "manage_exceptions": {
+    "message": "Gerenciar"
+  },
+  "exceptions_list": {
+    "message": "Sites de exceção:"
+  },
+  "clear_all": {
+    "message": "Limpar tudo"
+  },
+  "confirm_clear_exceptions": {
+    "message": "Tem certeza de que deseja limpar todas as exceções?"
+  },
+  "remove": {
+    "message": "Remover"
+  }
 }

_locales/ru/messages.json

@@ -100,5 +100,29 @@
   },
   "match_whole": {
     "message": "Слово целиком"
+  },
+  "site_exceptions": {
+    "message": "Сайты-исключения"
+  },
+  "add_exception": {
+    "message": "Добавить в исключения"
+  },
+  "remove_exception": {
+    "message": "Удалить из исключений"
+  },
+  "manage_exceptions": {
+    "message": "Управление"
+  },
+  "exceptions_list": {
+    "message": "Сайты-исключения:"
+  },
+  "clear_all": {
+    "message": "Очистить все"
+  },
+  "confirm_clear_exceptions": {
+    "message": "Вы уверены, что хотите очистить все исключения?"
+  },
+  "remove": {
+    "message": "Удалить"
   }
 }

_locales/tr/messages.json

@@ -100,5 +100,29 @@
   },
   "match_whole": {
     "message": "Tüm kelimeyle eşleş"
+  },
+  "site_exceptions": {
+    "message": "Site İstisnaları"
+  },
+  "add_exception": {
+    "message": "İstisnalara Ekle"
+  },
+  "remove_exception": {
+    "message": "İstisnalardan Çıkar"
+  },
+  "manage_exceptions": {
+    "message": "Yönet"
+  },
+  "exceptions_list": {
+    "message": "İstisna Siteleri:"
+  },
+  "clear_all": {
+    "message": "Hepsini Temizle"
+  },
+  "confirm_clear_exceptions": {
+    "message": "Tüm istisnaları temizlemek istediğinizden emin misiniz?"
+  },
+  "remove": {
+    "message": "Kaldır"
   }
 }

_locales/zh_CN/messages.json

@@ -100,5 +100,29 @@
   },
   "match_whole": {
     "message": "全词匹配"
+  },
+  "site_exceptions": {
+    "message": "网站例外"
+  },
+  "add_exception": {
+    "message": "添加到例外"
+  },
+  "remove_exception": {
+    "message": "从例外中移除"
+  },
+  "manage_exceptions": {
+    "message": "管理"
+  },
+  "exceptions_list": {
+    "message": "例外网站："
+  },
+  "clear_all": {
+    "message": "清除全部"
+  },
+  "confirm_clear_exceptions": {
+    "message": "您确定要清除所有例外吗？"
+  },
+  "remove": {
+    "message": "移除"
   }
 }

background.js

@@ -1,10 +0,0 @@
-chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
-    if (changeInfo.status === "complete" && /^https?:/.test(tab.url)) {
-        chrome.scripting.executeScript({
-            target: { tabId },
-            files: ["main.js"]
-        }).catch(err => {
-            console.warn("Injection failed:", err);
-        });
-    }
-});

eslint.config.mjs

@@ -0,0 +1,40 @@
+import globals from 'globals';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+import js from '@eslint/js';
+import { FlatCompat } from '@eslint/eslintrc';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const compat = new FlatCompat({
+    baseDirectory: __dirname,
+    recommendedConfig: js.configs.recommended,
+    allConfig: js.configs.all
+});
+
+export default [...compat.extends('eslint:recommended'), {
+    languageOptions: {
+        globals: {
+            ...globals.browser,
+            ...globals.webextensions,
+            chrome: 'readonly',
+        },
+
+        ecmaVersion: 12,
+        sourceType: 'module',
+    },
+
+    rules: {
+        semi: ['error', 'always'],
+        quotes: ['error', 'single'],
+    },
+}, {
+    files: ['scripts/**/*.js'],
+    languageOptions: {
+        globals: {
+            ...globals.node,
+        },
+        ecmaVersion: 12,
+        sourceType: 'module',
+    },
+}];

main.js

@@ -1,146 +0,0 @@
-let currentLists = [];
-let isGlobalHighlightEnabled = true;
-let matchCase = false;
-let matchWhole = false;
-
-function escapeRegex(s) {
-  return s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-}
-
-function clearHighlights() {
-  // Remove all <mark> elements added by the highlighter
-  const marks = document.querySelectorAll('mark[data-gh]');
-  for (const mark of marks) {
-    // Replace the <mark> with its text content
-    const parent = mark.parentNode;
-    if (parent) {
-      parent.replaceChild(document.createTextNode(mark.textContent), mark);
-      parent.normalize(); // Merge adjacent text nodes
-    }
-  }
-}
-
-
-function processNodes() {
-  observer.disconnect();
-  clearHighlights();
-
-  // If global highlighting is disabled, skip processing
-  if (!isGlobalHighlightEnabled) {
-    observer.observe(document.body, {
-      childList: true,
-      subtree: true,
-      characterData: true
-    });
-    return;
-  }
-
-  const textNodes = [];
-  const walker = document.createTreeWalker(document.body, NodeFilter.SHOW_TEXT, {
-    acceptNode: node => {
-      if (node.parentNode && node.parentNode.nodeName === 'MARK') return NodeFilter.FILTER_REJECT;
-      if (node.parentNode && ['SCRIPT', 'STYLE', 'NOSCRIPT', 'IFRAME'].includes(node.parentNode.nodeName)) return NodeFilter.FILTER_REJECT;
-      if (!node.nodeValue.trim()) return NodeFilter.FILTER_SKIP;
-      return NodeFilter.FILTER_ACCEPT;
-    }
-  });
-
-  while (walker.nextNode()) textNodes.push(walker.currentNode);
-
-  const activeWords = [];
-  for (const list of currentLists) {
-    if (!list.active) continue;
-    for (const word of list.words) {
-      if (!word.active) continue;
-      activeWords.push({
-        text: word.wordStr,
-        background: word.background || list.background,
-        foreground: word.foreground || list.foreground
-      });
-    }
-  }
-
-  if (activeWords.length > 0) {
-    const wordMap = new Map();
-    for (const word of activeWords) wordMap.set(word.text.toLowerCase(), word);
-
-    let flags = matchCase ? 'g' : 'gi';
-    let wordsPattern = Array.from(wordMap.keys()).map(escapeRegex).join('|');
-    if (matchWhole) {
-      wordsPattern = `\\b(?:${wordsPattern})\\b`;
-    }
-    const pattern = new RegExp(`(${wordsPattern})`, flags);
-
-    for (const node of textNodes) {
-      if (!pattern.test(node.nodeValue)) continue;
-
-      const span = document.createElement('span');
-      span.innerHTML = node.nodeValue.replace(pattern, match => {
-        const word = wordMap.get(match.toLowerCase()) || { background: '#ffff00', foreground: '#000000' };
-        return `<mark data-gh style="background:${word.background};color:${word.foreground};padding:0 2px;">${match}</mark>`;
-      });
-
-      node.parentNode.replaceChild(span, node);
-    }
-  }
-
-  observer.observe(document.body, {
-    childList: true,
-    subtree: true,
-    characterData: true
-  });
-}
-
-const debouncedProcessNodes = debounce(processNodes, 300);
-
-function setListsAndUpdate(lists) {
-  currentLists = lists;
-  debouncedProcessNodes();
-}
-
-// Debounce helper function
-function debounce(func, wait) {
-  let timeout;
-  return function () {
-    const context = this, args = arguments;
-    clearTimeout(timeout);
-    timeout = setTimeout(() => func.apply(context, args), wait);
-  };
-}
-
-// Initial highlight on load
-chrome.storage.local.get(["lists", "globalHighlightEnabled", "matchCaseEnabled", "matchWholeEnabled"], ({ lists, globalHighlightEnabled, matchCaseEnabled, matchWholeEnabled }) => {
-  if (Array.isArray(lists)) setListsAndUpdate(lists);
-  if (globalHighlightEnabled !== undefined) {
-    isGlobalHighlightEnabled = globalHighlightEnabled;
-  }
-  matchCase = !!matchCaseEnabled;
-  matchWhole = !!matchWholeEnabled;
-  processNodes();
-});
-
-// Listen for updates from the popup and re-apply highlights
-chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
-  if (message.type === "WORD_LIST_UPDATED") {
-    chrome.storage.local.get("lists", ({ lists }) => {
-      if (Array.isArray(lists)) setListsAndUpdate(lists);
-    });
-  } else if (message.type === "GLOBAL_TOGGLE_UPDATED") {
-    isGlobalHighlightEnabled = message.enabled;
-    processNodes();
-  } else if (message.type === "MATCH_OPTIONS_UPDATED") {
-    matchCase = !!message.matchCase;
-    matchWhole = !!message.matchWhole;
-    processNodes();
-  }
-});
-
-// Set up observer and scroll handler
-const observer = new MutationObserver(debouncedProcessNodes);
-observer.observe(document.body, {
-  childList: true,
-  subtree: true,
-  characterData: true
-});
-
-window.addEventListener('scroll', debouncedProcessNodes);

manifest.json

@@ -2,11 +2,12 @@
   "manifest_version": 3,
   "name": "__MSG_extension_name__",
   "description": "__MSG_extension_description__",
-  "version": "1.6.0",
+  "version": "1.8.0",
   "default_locale": "en",
   "permissions": [
     "scripting",
-    "storage"
+    "storage",
+    "tabs"
   ],
   "host_permissions": [
     "<all_urls>"
@@ -16,7 +17,7 @@
     "default_icon": "icons/icon128.png"
   },
   "background": {
-    "service_worker": "background.js"
+    "service_worker": "dist/background.js"
   },
   "icons": {
     "48": "icons/icon48.png",

package.json

@@ -1,11 +1,21 @@
 {
   "devDependencies": {
+    "@eslint/css": "^0.9.0",
+    "@eslint/js": "^9.30.0",
     "@semantic-release/changelog": "^6.0.3",
     "@semantic-release/exec": "^7.1.0",
     "@semantic-release/git": "^10.0.1",
-    "semantic-release": "^24.2.5"
+    "@types/chrome": "^0.0.270",
+    "eslint": "^9.30.0",
+    "globals": "^16.2.0",
+    "semantic-release": "^24.2.5",
+    "typescript": "^5.6.0"
   },
   "scripts": {
-    "prepare": "node scripts/update-manifest-version.js"
+    "build": "tsc",
+    "watch": "tsc --watch",
+    "clean": "rimraf dist",
+    "rebuild": "npm run clean && npm run build",
+    "prepare": "npm run build && node scripts/update-manifest-version.js"
   }
 }

popup/popup.css

@@ -80,6 +80,7 @@ h1 {
   border-radius: var(--border-radius);
   padding: 14px;
   box-shadow: var(--shadow);
+  transition: all 0.2s ease;
 }
 
 .section-header {
@@ -87,6 +88,60 @@ h1 {
   justify-content: space-between;
   align-items: center;
   margin-bottom: 10px;
+  cursor: pointer;
+  padding-left: 8px;
+  padding-right: 8px;
+}
+
+.section-header:hover {
+  background: var(--highlight-tag);
+  border-radius: 6px;
+  transition: background 0.2s ease;
+}
+
+.collapse-toggle {
+  background: none !important;
+  border: none !important;
+  color: var(--text-color) !important;
+  padding: 4px !important;
+  margin: 0 !important;
+  cursor: pointer;
+  border-radius: 4px;
+  transition: all 0.2s ease;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 24px;
+  height: 24px;
+}
+
+.collapse-toggle:hover {
+  background: var(--button-hover) !important;
+  color: var(--accent) !important;
+}
+
+.collapse-toggle i {
+  transition: transform 0.2s ease;
+  font-size: 0.8em;
+}
+
+.section.collapsed .collapse-toggle i {
+  transform: rotate(180deg);
+}
+
+.section-content {
+  overflow: hidden;
+  max-height: 2000px;
+}
+
+.section.collapsed .section-content {
+  max-height: 0;
+  margin-bottom: 0;
+  padding-bottom: 0;
+}
+
+.section.collapsed .section-header {
+  margin-bottom: 0;
 }
 
 .section h2 {
@@ -96,6 +151,7 @@ h1 {
   display: flex;
   align-items: center;
   gap: 8px;
+  flex: 1;
 }
 
 input[type="text"],
@@ -506,3 +562,54 @@ body::-webkit-scrollbar-corner,
 #wordList::-webkit-scrollbar-corner {
   background: var(--scrollbar-bg);
 }
+
+/* Exception Panel Styles */
+.exceptions-panel {
+  margin-top: 10px;
+  padding: 12px;
+  border: 1px solid var(--input-border);
+  border-radius: var(--border-radius);
+  background: var(--input-bg);
+}
+
+.exceptions-list {
+  max-height: 120px;
+  overflow-y: auto;
+  margin: 8px 0;
+  border: 1px solid var(--input-border);
+  border-radius: 6px;
+  background: var(--section-bg);
+}
+
+.exception-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 12px;
+  border-bottom: 1px solid var(--highlight-tag-border);
+  font-size: 12px;
+}
+
+.exception-item:last-child {
+  border-bottom: none;
+}
+
+.exception-domain {
+  flex: 1;
+  word-break: break-all;
+  margin-right: 8px;
+}
+
+.exception-remove {
+  background: var(--danger);
+  color: white;
+  border: none;
+  padding: 4px 8px;
+  border-radius: 4px;
+  cursor: pointer;
+  font-size: 10px;
+}
+
+.exception-remove:hover {
+  background: #d00030;
+}

popup/popup.html

@@ -29,10 +29,34 @@
       </div>
     </div>
 
-    <div class="section">
+    <div class="section" data-section="exceptions">
+      <div class="section-header">
+        <h2><i class="fa-solid fa-ban"></i> <span data-i18n="site_exceptions">Site Exceptions</span></h2>
+        <button class="collapse-toggle" data-target="exceptions">
+          <i class="fa-solid fa-chevron-up"></i>
+        </button>
+      </div>
+      <div class="section-content" id="exceptions-content">
+        <div class="button-row">
+          <button id="toggleExceptionBtn"><i class="fa-solid fa-ban"></i> <span id="exceptionBtnText" data-i18n="add_exception">Add to Exceptions</span></button>
+          <button id="manageExceptionsBtn"><i class="fa-solid fa-list"></i> <span data-i18n="manage_exceptions">Manage</span></button>
+        </div>
+        <div id="exceptionsPanel" class="exceptions-panel" style="display: none;">
+          <h3 data-i18n="exceptions_list">Exception Sites:</h3>
+          <div id="exceptionsList" class="exceptions-list"></div>
+          <button id="clearExceptionsBtn" class="danger"><i class="fa-solid fa-trash"></i> <span data-i18n="clear_all">Clear All</span></button>
+        </div>
+      </div>
+    </div>
+
+    <div class="section" data-section="lists">
       <div class="section-header">
         <h2><i class="fa-solid fa-list"></i> <span data-i18n="highlight_lists">Highlight Lists</span></h2>
+        <button class="collapse-toggle" data-target="lists">
+          <i class="fa-solid fa-chevron-up"></i>
+        </button>
       </div>
+      <div class="section-content" id="lists-content">
         <label for="listSelect" data-i18n="select_list">Select List:</label>
         <select id="listSelect"></select>
         <div class="button-row">
@@ -41,9 +65,16 @@
               data-i18n="delete_list">Delete</span></button>
         </div>
       </div>
+    </div>
 
-    <div class="section">
+    <div class="section" data-section="settings">
+      <div class="section-header">
         <h2><i class="fa-solid fa-gear"></i> <span data-i18n="list_settings">List Settings</span></h2>
+        <button class="collapse-toggle" data-target="settings">
+          <i class="fa-solid fa-chevron-up"></i>
+        </button>
+      </div>
+      <div class="section-content" id="settings-content">
         <label><span data-i18n="list_name">List Name:</span> <input type="text" id="listName" /></label>
         <div class="color-row">
           <div class="color-label">
@@ -60,16 +91,30 @@
           <input type="checkbox" class="switch" id="listActive" />
         </label>
       </div>
+    </div>
 
-    <div class="section">
+    <div class="section" data-section="addwords">
+      <div class="section-header">
         <h2><i class="fa-solid fa-pen"></i> <span data-i18n="add_words">Add Words</span></h2>
+        <button class="collapse-toggle" data-target="addwords">
+          <i class="fa-solid fa-chevron-up"></i>
+        </button>
+      </div>
+      <div class="section-content" id="addwords-content">
         <textarea id="bulkPaste" data-i18n="paste_hint" placeholder="Paste words here..."></textarea>
         <button id="addWordsBtn"><span data-i18n="apply_paste">Add Words</span></button>
       </div>
+    </div>
 
-    <div class="section">
+    <div class="section" data-section="wordlist">
+      <div class="section-header">
         <h2><i class="fa-solid fa-tags"></i> <span data-i18n="word_list">Word List</span>(<span id="wordCount">0</span>)
         </h2>
+        <button class="collapse-toggle" data-target="wordlist">
+          <i class="fa-solid fa-chevron-up"></i>
+        </button>
+      </div>
+      <div class="section-content" id="wordlist-content">
         <div class="button-row wrap">
           <button id="selectAllBtn"><span data-i18n="select_all">Select All</span></button>
           <button id="deselectAllBtn"><span data-i18n="deselect_all">Clear</span></button>
@@ -80,9 +125,16 @@
         <input type="text" id="wordSearch" data-i18n="search_placeholder" placeholder="Search..." />
         <div id="wordList"></div>
       </div>
+    </div>
 
-    <div class="section">
+    <div class="section" data-section="options">
+      <div class="section-header">
         <h2><i class="fa-solid fa-sliders"></i> <span data-i18n="options">Options</span></h2>
+        <button class="collapse-toggle" data-target="options">
+          <i class="fa-solid fa-chevron-up"></i>
+        </button>
+      </div>
+      <div class="section-content" id="options-content">
         <div class="button-row" style="margin-bottom:8px;">
           <label><input type="checkbox" id="matchCase" /> <span data-i18n="match_case">Match Case</span></label>
           <label><input type="checkbox" id="matchWhole" /> <span data-i18n="match_whole">Match Whole Word</span></label>
@@ -94,9 +146,9 @@
         </div>
       </div>
     </div>
+  </div>
 
-  <script src="../storage.js"></script>
-  <script src="popup.js"></script>
+  <script src="../dist/popup/popup.js"></script>
 </body>
 
 </html>

scripts/update-manifest-version.js

@@ -1,13 +1,13 @@
-const fs = require("fs");
+const fs = require('fs');
 
 const version = process.argv[2];
 if (!version) {
-    console.error("❌ No version passed");
-    process.exit(1);
+    console.log('ℹ️ No version passed, skipping manifest update');
+    process.exit(0);
 }
 
-const manifest = JSON.parse(fs.readFileSync("manifest.json", "utf-8"));
+const manifest = JSON.parse(fs.readFileSync('manifest.json', 'utf-8'));
 manifest.version = version;
-fs.writeFileSync("manifest.json", JSON.stringify(manifest, null, 2));
+fs.writeFileSync('manifest.json', JSON.stringify(manifest, null, 2));
 
 console.log(`✅ Updated manifest.json to version ${version}`);

src/background.ts

@@ -0,0 +1,20 @@
+// Handle tab updates to inject content script
+chrome.tabs.onUpdated.addListener((tabId: number, changeInfo: chrome.tabs.TabChangeInfo, tab: chrome.tabs.Tab): void => {
+    if (changeInfo.status === 'complete' && tab.url && /^https?:/.test(tab.url)) {
+        chrome.scripting.executeScript({
+            target: { tabId },
+            files: ['dist/main.js']
+        }).catch((err: unknown) => {
+            console.warn('Injection failed:', err);
+        });
+    }
+});
+
+// Initialize storage on extension install
+chrome.runtime.onInstalled.addListener((): void => {
+    chrome.storage.local.get(['exceptionsList'], (result: any) => {
+        if (!result.exceptionsList) {
+            chrome.storage.local.set({ exceptionsList: [] });
+        }
+    });
+});

src/main.ts

@@ -0,0 +1,205 @@
+// @ts-nocheck
+let currentLists = [];
+let isGlobalHighlightEnabled = true;
+let exceptionsList = [];
+let isCurrentSiteException = false;
+let matchCase = false;
+let matchWhole = false;
+let styleSheet = null;
+let wordStyleMap = new Map();
+
+function escapeRegex(s) {
+  return s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+}
+
+function isCurrentSiteInExceptions() {
+  const currentHostname = window.location.hostname;
+  return exceptionsList.includes(currentHostname);
+}
+
+function initializeStyleSheet() {
+  if (!styleSheet) {
+    const style = document.createElement('style');
+    style.id = 'goose-highlighter-styles';
+    document.head.appendChild(style);
+    styleSheet = style.sheet;
+  }
+}
+
+function updateWordStyles(activeWords) {
+  initializeStyleSheet();
+  
+  while (styleSheet.cssRules.length > 0) {
+    styleSheet.deleteRule(0);
+  }
+  
+  wordStyleMap.clear();
+  const uniqueStyles = new Map();
+  
+  for (const word of activeWords) {
+    const styleKey = `${word.background}-${word.foreground}`;
+    if (!uniqueStyles.has(styleKey)) {
+      const className = `highlighted-word-${uniqueStyles.size}`;
+      uniqueStyles.set(styleKey, className);
+      
+      const rule = `.${className} { background: ${word.background}; color: ${word.foreground}; padding: 0 2px; }`;
+      styleSheet.insertRule(rule, styleSheet.cssRules.length);
+    }
+    
+    const lookup = matchCase ? word.text : word.text.toLowerCase();
+    wordStyleMap.set(lookup, uniqueStyles.get(styleKey));
+  }
+}
+
+function clearHighlights() {
+  const highlightedElements = document.querySelectorAll('[data-gh]');
+  for (const element of highlightedElements) {
+    const parent = element.parentNode;
+    if (parent) {
+      parent.replaceChild(document.createTextNode(element.textContent), element);
+      parent.normalize();
+    }
+  }
+}
+
+
+function processNodes() {
+  observer.disconnect();
+  clearHighlights();
+
+  if (!isGlobalHighlightEnabled || isCurrentSiteException) {
+    observer.observe(document.body, {
+      childList: true,
+      subtree: true,
+      characterData: true
+    });
+    return;
+  }
+
+  const textNodes = [];
+  const walker = document.createTreeWalker(document.body, NodeFilter.SHOW_TEXT, {
+    acceptNode: node => {
+      if (node.parentNode && node.parentNode.hasAttribute('data-gh')) return NodeFilter.FILTER_REJECT;
+      if (node.parentNode && ['SCRIPT', 'STYLE', 'NOSCRIPT', 'IFRAME'].includes(node.parentNode.nodeName)) return NodeFilter.FILTER_REJECT;
+      if (!node.nodeValue.trim()) return NodeFilter.FILTER_SKIP;
+      return NodeFilter.FILTER_ACCEPT;
+    }
+  });
+
+  while (walker.nextNode()) textNodes.push(walker.currentNode);
+
+  const activeWords = [];
+  for (const list of currentLists) {
+    if (!list.active) continue;
+    for (const word of list.words) {
+      if (!word.active) continue;
+      activeWords.push({
+        text: word.wordStr,
+        background: word.background || list.background,
+        foreground: word.foreground || list.foreground
+      });
+    }
+  }
+
+if (activeWords.length > 0) {
+  updateWordStyles(activeWords);
+  
+  const wordMap = new Map();
+  for (const word of activeWords) {
+    wordMap.set(matchCase ? word.text : word.text.toLowerCase(), word);
+  }
+
+  let flags = matchCase ? 'gu' : 'giu';
+  let wordsPattern = Array.from(wordMap.keys()).map(escapeRegex).join('|');
+  
+  if (matchWhole) {
+    wordsPattern = `(?:(?<!\\p{L})|^)(${wordsPattern})(?:(?!\\p{L})|$)`;
+  }
+  
+  try {
+    const pattern = new RegExp(`(${wordsPattern})`, flags);
+
+    for (const node of textNodes) {
+      if (!node.nodeValue || !pattern.test(node.nodeValue)) continue;
+
+      const span = document.createElement('span');
+      span.innerHTML = node.nodeValue.replace(pattern, match => {
+        const lookup = matchCase ? match : match.toLowerCase();
+        const className = wordStyleMap.get(lookup) || 'highlighted-word-0';
+        return `<span data-gh class="${className}">${match}</span>`;
+      });
+
+      node.parentNode.replaceChild(span, node);
+    }
+  } catch (e) {
+    console.error('Regex error:', e);
+  }
+}
+
+  observer.observe(document.body, {
+    childList: true,
+    subtree: true,
+    characterData: true
+  });
+}
+
+const debouncedProcessNodes = debounce(processNodes, 300);
+
+function setListsAndUpdate(lists) {
+  currentLists = lists;
+  debouncedProcessNodes();
+}
+
+function debounce(func, wait) {
+  let timeout;
+  return function () {
+    const context = this, args = arguments;
+    clearTimeout(timeout);
+    timeout = setTimeout(() => func.apply(context, args), wait);
+  };
+}
+
+// Initial highlight on load
+chrome.storage.local.get(['lists', 'globalHighlightEnabled', 'matchCaseEnabled', 'matchWholeEnabled', 'exceptionsList'], ({ lists, globalHighlightEnabled, matchCaseEnabled, matchWholeEnabled, exceptionsList: exceptions }) => {
+  if (Array.isArray(lists)) setListsAndUpdate(lists);
+  if (globalHighlightEnabled !== undefined) {
+    isGlobalHighlightEnabled = globalHighlightEnabled;
+  }
+  matchCase = !!matchCaseEnabled;
+  matchWhole = !!matchWholeEnabled;
+  exceptionsList = Array.isArray(exceptions) ? exceptions : [];
+  isCurrentSiteException = isCurrentSiteInExceptions();
+  processNodes();
+});
+
+// Listen for updates from the popup and re-apply highlights
+chrome.runtime.onMessage.addListener((message) => {
+  if (message.type === 'WORD_LIST_UPDATED') {
+    chrome.storage.local.get('lists', ({ lists }) => {
+      if (Array.isArray(lists)) setListsAndUpdate(lists);
+    });
+  } else if (message.type === 'GLOBAL_TOGGLE_UPDATED') {
+    isGlobalHighlightEnabled = message.enabled;
+    processNodes();
+  } else if (message.type === 'MATCH_OPTIONS_UPDATED') {
+    matchCase = !!message.matchCase;
+    matchWhole = !!message.matchWhole;
+    processNodes();
+  } else if (message.type === 'EXCEPTIONS_LIST_UPDATED') {
+    chrome.storage.local.get('exceptionsList', ({ exceptionsList: exceptions }) => {
+      exceptionsList = Array.isArray(exceptions) ? exceptions : [];
+      isCurrentSiteException = isCurrentSiteInExceptions();
+      processNodes();
+    });
+  }
+});
+
+// Set up observer and scroll handler
+const observer = new MutationObserver(debouncedProcessNodes);
+observer.observe(document.body, {
+  childList: true,
+  subtree: true,
+  characterData: true
+});
+
+window.addEventListener('scroll', debouncedProcessNodes);

src/popup/popup.ts

@@ -1,21 +1,68 @@
-const listSelect = document.getElementById("listSelect");
-const listName = document.getElementById("listName");
-const listBg = document.getElementById("listBg");
-const listFg = document.getElementById("listFg");
-const listActive = document.getElementById("listActive");
-const bulkPaste = document.getElementById("bulkPaste");
-const wordList = document.getElementById("wordList");
-const importInput = document.getElementById("importInput");
-const matchCase = document.getElementById("matchCase");
-const matchWhole = document.getElementById("matchWhole");
+// @ts-nocheck
+const listSelect = document.getElementById('listSelect');
+const listName = document.getElementById('listName');
+const listBg = document.getElementById('listBg');
+const listFg = document.getElementById('listFg');
+const listActive = document.getElementById('listActive');
+const bulkPaste = document.getElementById('bulkPaste');
+const wordList = document.getElementById('wordList');
+const importInput = document.getElementById('importInput');
+const matchCase = document.getElementById('matchCase');
+const matchWhole = document.getElementById('matchWhole');
 let lists = [];
 let currentListIndex = 0;
-let saveTimeout;
 let selectedCheckboxes = new Set();
 let globalHighlightEnabled = true;
-let wordSearchQuery = "";
+let wordSearchQuery = '';
 let matchCaseEnabled = false;
 let matchWholeEnabled = false;
+let exceptionsList = [];
+let currentTabHost = '';
+let sectionStates = {};
+
+function loadSectionStates() {
+  const saved = localStorage.getItem('goose-highlighter-section-states');
+  if (saved) {
+    try {
+      sectionStates = JSON.parse(saved);
+    } catch {
+      sectionStates = {};
+    }
+  }
+}
+
+function saveSectionStates() {
+  localStorage.setItem('goose-highlighter-section-states', JSON.stringify(sectionStates));
+}
+
+function toggleSection(sectionName) {
+  const section = document.querySelector(`[data-section="${sectionName}"]`);
+  if (!section) return;
+  
+  const isCollapsed = section.classList.contains('collapsed');
+  
+  if (isCollapsed) {
+    section.classList.remove('collapsed');
+    sectionStates[sectionName] = false;
+  } else {
+    section.classList.add('collapsed');
+    sectionStates[sectionName] = true;
+  }
+  
+  saveSectionStates();
+}
+
+function initializeSectionStates() {
+  loadSectionStates();
+  
+  // Apply saved states
+  Object.keys(sectionStates).forEach(sectionName => {
+    const section = document.querySelector(`[data-section="${sectionName}"]`);
+    if (section && sectionStates[sectionName]) {
+      section.classList.add('collapsed');
+    }
+  });
+}
 
 function escapeHtml(str) {
   return str.replace(/[&<>"']/g, function (m) {
@@ -24,24 +71,18 @@ function escapeHtml(str) {
       '<': '&lt;',
       '>': '&gt;',
       '"': '&quot;',
-      "'": '&#39;'
+      '\'': '&#39;'
     })[m];
   });
 }
 
-async function debouncedSave() {
-  clearTimeout(saveTimeout);
-  saveTimeout = setTimeout(async () => {
-    await chrome.storage.local.set({ lists });
-  }, 500);
-}
-
 async function save() {
   await chrome.storage.local.set({
     lists: lists,
     globalHighlightEnabled: globalHighlightEnabled,
     matchCaseEnabled,
-    matchWholeEnabled
+    matchWholeEnabled,
+    exceptionsList
   });
   renderLists();
   renderWords();
@@ -49,16 +90,17 @@ async function save() {
   chrome.tabs.query({}, function (tabs) {
     for (let tab of tabs) {
       if (tab.id) {
-        chrome.tabs.sendMessage(tab.id, { type: "WORD_LIST_UPDATED" });
+        chrome.tabs.sendMessage(tab.id, { type: 'WORD_LIST_UPDATED' });
         chrome.tabs.sendMessage(tab.id, {
-          type: "GLOBAL_TOGGLE_UPDATED",
+          type: 'GLOBAL_TOGGLE_UPDATED',
           enabled: globalHighlightEnabled
         });
         chrome.tabs.sendMessage(tab.id, {
-          type: "MATCH_OPTIONS_UPDATED",
+          type: 'MATCH_OPTIONS_UPDATED',
           matchCase: matchCaseEnabled,
           matchWhole: matchWholeEnabled
         });
+        chrome.tabs.sendMessage(tab.id, { type: 'EXCEPTIONS_LIST_UPDATED' });
       }
     }
   });
@@ -70,7 +112,7 @@ async function updateGlobalToggleState() {
     for (let tab of tabs) {
       if (tab.id) {
         chrome.tabs.sendMessage(tab.id, {
-          type: "GLOBAL_TOGGLE_UPDATED",
+          type: 'GLOBAL_TOGGLE_UPDATED',
           enabled: globalHighlightEnabled
         });
       }
@@ -83,35 +125,49 @@ async function load() {
     lists: [],
     globalHighlightEnabled: true,
     matchCaseEnabled: false,
-    matchWholeEnabled: false
+    matchWholeEnabled: false,
+    exceptionsList: []
   });
   lists = res.lists;
   globalHighlightEnabled = res.globalHighlightEnabled !== false;
   matchCaseEnabled = !!res.matchCaseEnabled;
   matchWholeEnabled = !!res.matchWholeEnabled;
+  exceptionsList = res.exceptionsList || [];
   matchCase.checked = matchCaseEnabled;
   matchWhole.checked = matchWholeEnabled;
 
+  try {
+    const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
+    if (tab && tab.url) {
+      const url = new URL(tab.url);
+      currentTabHost = url.hostname;
+      updateExceptionButton();
+    }
+  } catch (e) {
+    console.warn('Could not get current tab:', e);
+  }
+
   if (!lists.length) {
     lists.push({
       id: Date.now(),
-      name: chrome.i18n.getMessage("default_list_name"),
-      background: "#ffff00",
-      foreground: "#000000",
+      name: chrome.i18n.getMessage('default_list_name'),
+      background: '#ffff00',
+      foreground: '#000000',
       active: true,
       words: []
     });
   }
   renderLists();
   renderWords();
+  renderExceptions();
 
-  document.getElementById("globalHighlightToggle").checked = globalHighlightEnabled;
+  document.getElementById('globalHighlightToggle').checked = globalHighlightEnabled;
 }
 
 function renderLists() {
   listSelect.innerHTML = lists.map((list, index) =>
     `<option value="${index}">${escapeHtml(list.name)}</option>`
-  ).join("");
+  ).join('');
   listSelect.value = currentListIndex;
   updateListForm();
 }
@@ -152,7 +208,7 @@ function renderWords() {
   for (let i = startIndex; i < endIndex; i++) {
     const w = filteredWords[i];
     if (!w) continue;
-    const container = document.createElement("div");
+    const container = document.createElement('div');
     container.style.height = `${itemHeight}px`;
     container.style.position = 'absolute';
     container.style.top = `${i * itemHeight}px`;
@@ -169,16 +225,16 @@ function renderWords() {
 
     const realIndex = list.words.indexOf(w);
 
-    const cbSelect = document.createElement("input");
-    cbSelect.type = "checkbox";
-    cbSelect.className = "word-checkbox";
+    const cbSelect = document.createElement('input');
+    cbSelect.type = 'checkbox';
+    cbSelect.className = 'word-checkbox';
     cbSelect.dataset.index = realIndex;
     if (selectedCheckboxes.has(realIndex)) {
       cbSelect.checked = true;
     }
 
-    const inputWord = document.createElement("input");
-    inputWord.type = "text";
+    const inputWord = document.createElement('input');
+    inputWord.type = 'text';
     inputWord.value = w.wordStr;
     inputWord.dataset.wordEdit = realIndex;
     inputWord.style.flexGrow = '1';
@@ -189,34 +245,34 @@ function renderWords() {
     inputWord.style.backgroundColor = 'var(--input-bg)';
     inputWord.style.color = 'var(--text-color)';
 
-    const inputBg = document.createElement("input");
-    inputBg.type = "color";
+    const inputBg = document.createElement('input');
+    inputBg.type = 'color';
     inputBg.value = w.background || list.background;
     inputBg.dataset.bgEdit = realIndex;
     inputBg.style.width = '24px';
     inputBg.style.height = '24px';
     inputBg.style.flexShrink = '0';
 
-    const inputFg = document.createElement("input");
-    inputFg.type = "color";
+    const inputFg = document.createElement('input');
+    inputFg.type = 'color';
     inputFg.value = w.foreground || list.foreground;
     inputFg.dataset.fgEdit = realIndex;
     inputFg.style.width = '24px';
     inputFg.style.height = '24px';
     inputFg.style.flexShrink = '0';
 
-    const activeContainer = document.createElement("label");
-    activeContainer.className = "word-active";
+    const activeContainer = document.createElement('label');
+    activeContainer.className = 'word-active';
     activeContainer.style.display = 'flex';
     activeContainer.style.alignItems = 'center';
     activeContainer.style.gap = '4px';
     activeContainer.style.flexShrink = '0';
 
-    const cbActive = document.createElement("input");
-    cbActive.type = "checkbox";
+    const cbActive = document.createElement('input');
+    cbActive.type = 'checkbox';
     cbActive.checked = w.active !== false;
     cbActive.dataset.activeEdit = realIndex;
-    cbActive.className = "switch";
+    cbActive.className = 'switch';
 
     activeContainer.appendChild(cbActive);
 
@@ -237,9 +293,71 @@ function renderWords() {
   }
 }
 
+function updateExceptionButton() {
+  const toggleBtn = document.getElementById('toggleExceptionBtn');
+  const btnText = document.getElementById('exceptionBtnText');
+  
+  if (!toggleBtn || !btnText || !currentTabHost) return;
+  
+  const isException = exceptionsList.includes(currentTabHost);
+  
+  if (isException) {
+    btnText.textContent = chrome.i18n.getMessage('remove_exception') || 'Remove from Exceptions';
+    toggleBtn.className = 'danger';
+    toggleBtn.querySelector('i').className = 'fa-solid fa-check';
+  } else {
+    btnText.textContent = chrome.i18n.getMessage('add_exception') || 'Add to Exceptions';
+    toggleBtn.className = '';
+    toggleBtn.querySelector('i').className = 'fa-solid fa-ban';
+  }
+}
+
+function renderExceptions() {
+  const container = document.getElementById('exceptionsList');
+  if (!container) return;
+  
+  if (exceptionsList.length === 0) {
+    container.innerHTML = '<div class="exception-item">No exceptions</div>';
+    return;
+  }
+  
+  container.innerHTML = exceptionsList.map(domain => 
+    `<div class="exception-item">
+      <span class="exception-domain">${escapeHtml(domain)}</span>
+      <button class="exception-remove" data-domain="${escapeHtml(domain)}">${chrome.i18n.getMessage('remove')}</button>
+    </div>`
+  ).join('');
+}
+
 document.addEventListener('DOMContentLoaded', () => {
+  initializeSectionStates();
   localizePage();
-  document.getElementById("selectAllBtn").onclick = () => {
+  
+  // Add event listeners for collapse toggles
+  document.querySelectorAll('.collapse-toggle').forEach(button => {
+    button.addEventListener('click', (e) => {
+      e.stopPropagation();
+      const targetSection = button.getAttribute('data-target');
+      toggleSection(targetSection);
+    });
+  });
+  
+  // Also allow clicking section headers to toggle
+  document.querySelectorAll('.section-header').forEach(header => {
+    header.addEventListener('click', (e) => {
+      // Don't toggle if clicking on a button or input within the header
+      if (e.target.tagName === 'BUTTON' || e.target.tagName === 'INPUT' || e.target.closest('button')) {
+        return;
+      }
+      const section = header.closest('.section');
+      const sectionName = section.getAttribute('data-section');
+      if (sectionName) {
+        toggleSection(sectionName);
+      }
+    });
+  });
+
+  document.getElementById('selectAllBtn').onclick = () => {
     const list = lists[currentListIndex];
     list.words.forEach((_, index) => {
       selectedCheckboxes.add(index);
@@ -247,13 +365,13 @@ document.addEventListener('DOMContentLoaded', () => {
     renderWords();
   };
 
-  document.getElementById("globalHighlightToggle").addEventListener('change', function () {
+  document.getElementById('globalHighlightToggle').addEventListener('change', function () {
     globalHighlightEnabled = this.checked;
     updateGlobalToggleState();
   });
 
-  wordList.addEventListener("change", e => {
-    if (e.target.type === "checkbox") {
+  wordList.addEventListener('change', e => {
+    if (e.target.type === 'checkbox') {
       if (e.target.dataset.index != null) {
         if (e.target.checked) {
           selectedCheckboxes.add(+e.target.dataset.index);
@@ -286,12 +404,12 @@ document.addEventListener('DOMContentLoaded', () => {
     updateListForm();
   };
 
-  document.getElementById("newListBtn").onclick = () => {
+  document.getElementById('newListBtn').onclick = () => {
     lists.push({
       id: Date.now(),
-      name: chrome.i18n.getMessage("new_list_name"),
-      background: "#ffff00",
-      foreground: "#000000",
+      name: chrome.i18n.getMessage('new_list_name'),
+      background: '#ffff00',
+      foreground: '#000000',
       active: true,
       words: []
     });
@@ -299,8 +417,8 @@ document.addEventListener('DOMContentLoaded', () => {
     save();
   };
 
-  document.getElementById("deleteListBtn").onclick = () => {
-    if (confirm(chrome.i18n.getMessage("confirm_delete_list"))) {
+  document.getElementById('deleteListBtn').onclick = () => {
+    if (confirm(chrome.i18n.getMessage('confirm_delete_list'))) {
       lists.splice(currentListIndex, 1);
       currentListIndex = Math.max(0, currentListIndex - 1);
       save();
@@ -312,16 +430,16 @@ document.addEventListener('DOMContentLoaded', () => {
   listFg.oninput = () => { lists[currentListIndex].foreground = listFg.value; save(); };
   listActive.onchange = () => { lists[currentListIndex].active = listActive.checked; save(); };
 
-  document.getElementById("addWordsBtn").onclick = () => {
+  document.getElementById('addWordsBtn').onclick = () => {
     const words = bulkPaste.value.split(/\n+/).map(w => w.trim()).filter(Boolean);
     const list = lists[currentListIndex];
-    for (const w of words) list.words.push({ wordStr: w, background: "", foreground: "", active: true });
-    bulkPaste.value = "";
+    for (const w of words) list.words.push({ wordStr: w, background: '', foreground: '', active: true });
+    bulkPaste.value = '';
     save();
   };
 
-  document.getElementById("deleteSelectedBtn").onclick = () => {
-    if (confirm(chrome.i18n.getMessage("confirm_delete_words"))) {
+  document.getElementById('deleteSelectedBtn').onclick = () => {
+    if (confirm(chrome.i18n.getMessage('confirm_delete_words'))) {
       const list = lists[currentListIndex];
       const toDelete = Array.from(selectedCheckboxes);
       lists[currentListIndex].words = list.words.filter((_, i) => !toDelete.includes(i));
@@ -331,7 +449,7 @@ document.addEventListener('DOMContentLoaded', () => {
     }
   };
 
-  document.getElementById("disableSelectedBtn").onclick = () => {
+  document.getElementById('disableSelectedBtn').onclick = () => {
     const list = lists[currentListIndex];
     selectedCheckboxes.forEach(index => {
       list.words[index].active = false;
@@ -340,7 +458,7 @@ document.addEventListener('DOMContentLoaded', () => {
     renderWords();
   };
 
-  document.getElementById("enableSelectedBtn").onclick = () => {
+  document.getElementById('enableSelectedBtn').onclick = () => {
     const list = lists[currentListIndex];
     selectedCheckboxes.forEach(index => {
       list.words[index].active = true;
@@ -349,7 +467,7 @@ document.addEventListener('DOMContentLoaded', () => {
     renderWords();
   };
 
-  wordList.addEventListener("input", e => {
+  wordList.addEventListener('input', e => {
     const index = e.target.dataset.wordEdit ?? e.target.dataset.bgEdit ?? e.target.dataset.fgEdit;
     if (index == null) return;
 
@@ -361,18 +479,22 @@ document.addEventListener('DOMContentLoaded', () => {
     save();
   });
 
-  const exportBtn = document.getElementById("exportBtn");
+  const exportBtn = document.getElementById('exportBtn');
   exportBtn.onclick = () => {
-    const blob = new Blob([JSON.stringify(lists, null, 2)], { type: "application/json" });
+    const exportData = {
+      lists: lists,
+      exceptionsList: exceptionsList
+    };
+    const blob = new Blob([JSON.stringify(exportData, null, 2)], { type: 'application/json' });
     const url = URL.createObjectURL(blob);
-    const a = document.createElement("a");
+    const a = document.createElement('a');
     a.href = url;
-    a.download = "highlight-lists.json";
+    a.download = 'highlight-lists.json';
     a.click();
     URL.revokeObjectURL(url);
   };
 
-  const importBtn = document.getElementById("importBtn");
+  const importBtn = document.getElementById('importBtn');
   importBtn.onclick = () => importInput.click();
 
   importInput.onchange = e => {
@@ -382,13 +504,26 @@ document.addEventListener('DOMContentLoaded', () => {
     reader.onload = e => {
       try {
         const data = JSON.parse(e.target.result);
+        
         if (Array.isArray(data)) {
+          // Old format - just lists
           lists = data;
-          currentListIndex = 0;
-          save();
+        } else if (data && typeof data === 'object') {
+          // New format - object with lists and exceptions
+          if (Array.isArray(data.lists)) {
+            lists = data.lists;
           }
+          if (Array.isArray(data.exceptionsList)) {
+            exceptionsList = data.exceptionsList;
+          }
+        }
+        
+        currentListIndex = 0;
+        updateExceptionButton();
+        renderExceptions();
+        save();
       } catch (err) {
-        alert(chrome.i18n.getMessage("invalid_json_error"));
+        alert(chrome.i18n.getMessage('invalid_json_error:' + err.message));
       }
     };
     reader.readAsText(file);
@@ -435,13 +570,13 @@ document.addEventListener('DOMContentLoaded', () => {
     }
   });
 
-  document.getElementById("deselectAllBtn").onclick = () => {
+  document.getElementById('deselectAllBtn').onclick = () => {
     selectedCheckboxes.clear();
     renderWords();
   };
 
-  const wordSearch = document.getElementById("wordSearch");
-  wordSearch.addEventListener("input", (e) => {
+  const wordSearch = document.getElementById('wordSearch');
+  wordSearch.addEventListener('input', (e) => {
     wordSearchQuery = e.target.value;
     renderWords();
   });
@@ -455,5 +590,49 @@ document.addEventListener('DOMContentLoaded', () => {
     save();
   });
 
+  document.getElementById('toggleExceptionBtn').addEventListener('click', () => {
+    if (!currentTabHost) return;
+    
+    const isException = exceptionsList.includes(currentTabHost);
+    
+    if (isException) {
+      exceptionsList = exceptionsList.filter(domain => domain !== currentTabHost);
+    } else {
+      exceptionsList.push(currentTabHost);
+    }
+    
+    updateExceptionButton();
+    renderExceptions();
+    save();
+  });
+
+  document.getElementById('manageExceptionsBtn').addEventListener('click', () => {
+    const panel = document.getElementById('exceptionsPanel');
+    if (panel.style.display === 'none') {
+      panel.style.display = 'block';
+    } else {
+      panel.style.display = 'none';
+    }
+  });
+
+  document.getElementById('clearExceptionsBtn').addEventListener('click', () => {
+    if (confirm(chrome.i18n.getMessage('confirm_clear_exceptions') || 'Clear all exceptions?')) {
+      exceptionsList = [];
+      updateExceptionButton();
+      renderExceptions();
+      save();
+    }
+  });
+
+  document.getElementById('exceptionsList').addEventListener('click', (e) => {
+    if (e.target.classList.contains('exception-remove')) {
+      const domain = e.target.dataset.domain;
+      exceptionsList = exceptionsList.filter(d => d !== domain);
+      updateExceptionButton();
+      renderExceptions();
+      save();
+    }
+  });
+
   load();
 });

src/types.ts

@@ -0,0 +1,75 @@
+// Type definitions for the Goose Highlighter extension
+
+export interface HighlightWord {
+  wordStr: string;
+  background: string;
+  foreground: string;
+  active: boolean;
+}
+
+export interface HighlightList {
+  id: number;
+  name: string;
+  background: string;
+  foreground: string;
+  active: boolean;
+  words: HighlightWord[];
+}
+
+export interface StorageData {
+  lists: HighlightList[];
+  globalHighlightEnabled: boolean;
+  matchCaseEnabled: boolean;
+  matchWholeEnabled: boolean;
+  exceptionsList: string[];
+}
+
+export interface ActiveWord {
+  text: string;
+  background: string;
+  foreground: string;
+}
+
+export interface MessageData {
+  type: 'WORD_LIST_UPDATED' | 'GLOBAL_TOGGLE_UPDATED' | 'MATCH_OPTIONS_UPDATED' | 'EXCEPTIONS_LIST_UPDATED';
+  enabled?: boolean;
+  matchCase?: boolean;
+  matchWhole?: boolean;
+}
+
+export interface SectionStates {
+  [sectionName: string]: boolean;
+}
+
+export interface ExportData {
+  lists: HighlightList[];
+  exceptionsList: string[];
+}
+
+// DOM element selectors used in popup
+export interface PopupElements {
+  listSelect: HTMLSelectElement;
+  listName: HTMLInputElement;
+  listBg: HTMLInputElement;
+  listFg: HTMLInputElement;
+  listActive: HTMLInputElement;
+  bulkPaste: HTMLTextAreaElement;
+  wordList: HTMLDivElement;
+  importInput: HTMLInputElement;
+  matchCase: HTMLInputElement;
+  matchWhole: HTMLInputElement;
+}
+
+// Default storage values
+export const DEFAULT_STORAGE: Partial<StorageData> = {
+  lists: [],
+  globalHighlightEnabled: true,
+  matchCaseEnabled: false,
+  matchWholeEnabled: false,
+  exceptionsList: []
+};
+
+// Constants
+export const WORD_ITEM_HEIGHT = 32;
+export const DEBOUNCE_DELAY = 300;
+export const SCROLL_THROTTLE = 16; // ~60fps

storage.js

@@ -1,8 +0,0 @@
-async function getLists() {
-    const { lists } = await chrome.storage.local.get("lists");
-    return lists || [];
-}
-
-async function saveLists(lists) {
-    await chrome.storage.local.set({ lists });
-}

tsconfig.json

@@ -0,0 +1,30 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "CommonJS",
+    "lib": ["ES2022", "DOM"],
+    "outDir": "./dist",
+    "rootDir": "./src",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "allowSyntheticDefaultImports": true,
+    "noEmitOnError": false,
+    "noImplicitAny": true,
+    "noImplicitReturns": true,
+    "noUnusedLocals": false,
+    "noUnusedParameters": false,
+    "exactOptionalPropertyTypes": false,
+    "types": ["chrome"]
+  },
+  "include": [
+    "src/**/*"
+  ],
+  "exclude": [
+    "node_modules",
+    "dist"
+  ]
+}