bindSettingsEvents function domain

function bindSettingsEvents(): void {
  const debouncedSaveGeneral = debounce(() => {
    void saveGeneralSettings();
  }, 300);
  const debouncedSaveFieldIcon = debounce(() => {
    void saveFieldIconSettings();
  }, 300);

  // General settings — auto-save on any change
  for (const id of [
    "setting-auto-fill",
    "setting-highlight",
    "setting-cache-enabled",
    "setting-show-panel",
    "setting-fill-empty-only",
    "setting-debug-log",
    "setting-log-level",
    "setting-log-max-entries",
    "setting-strategy",
    "setting-locale",
  ]) {
    document
      .getElementById(id)
      ?.addEventListener("change", debouncedSaveGeneral);
  }

  // Field icon — auto-save on any change
  document
    .getElementById("setting-show-field-icon")
    ?.addEventListener("change", debouncedSaveFieldIcon);
  document
    .getElementById("setting-field-icon-position")
    ?.addEventListener("change", debouncedSaveFieldIcon);

  // Watcher — auto-save on any change
  const debouncedSaveWatcher = debounce(() => {
    void saveWatcherSettings();
  }, 300);
  for (const id of [
    "setting-watcher-enabled",
    "setting-watcher-auto-refill",
    "setting-watcher-shadow-dom",
    "setting-watcher-debounce",
  ]) {
    const el = document.getElementById(id);
    el?.addEventListener("change", debouncedSaveWatcher);
    if (el?.tagName === "INPUT" && (el as HTMLInputElement).type === "number") {
      el.addEventListener("input", debouncedSaveWatcher);
    }
  }

  // AI feedback — auto-save on any change
  const debouncedSaveAi = debounce(() => {
    void saveAiSettings();
  }, 300);
  for (const id of [
    "setting-show-fill-toast",
    "setting-show-ai-badge",
    "setting-ai-timeout",
  ]) {
    const el = document.getElementById(id);
    el?.addEventListener("change", debouncedSaveAi);
    if (el?.tagName === "INPUT" && (el as HTMLInputElement).type === "number") {
      el.addEventListener("input", debouncedSaveAi);
    }
  }

  // UI language — dedicated handler that re-localises the page
  document
    .getElementById("setting-ui-language")
    ?.addEventListener("change", async (e) => {
      const lang = (e.target as HTMLSelectElement)
        .value as Settings["uiLanguage"];
      await chrome.runtime.sendMessage({
        type: "SAVE_SETTINGS",
        payload: { uiLanguage: lang } as Partial<Settings>,
      });
      await initI18n(lang);
      localizeHTML();
      void loadSettings(); // re-render strategy list and other dynamic content
      showToast(t("uiLanguageChanged"));
    });

  document
    .getElementById("btn-download-chrome-ai")
    ?.addEventListener("click", async () => {
      // eslint-disable-next-line @typescript-eslint/no-explicit-any
      const LanguageModel = (globalThis as any).LanguageModel as
        | {
            create?: (opts?: {
              expectedOutputs?: { type: string; languages?: string[] }[];
            }) => Promise<unknown>;
          }
        | undefined;
      if (!LanguageModel?.create) return;
      try {
        await LanguageModel.create({
          expectedOutputs: [{ type: "text", languages: ["en"] }],
        });
        void checkChromeAiStatus();
        showToast(t("chromeAiDownloadStart"));
      } catch (err) {
        showToast(
          t("chromeAiDownloadError", [
            err instanceof Error ? err.message : String(err),
          ]),
          "error",
        );
      }
    });
}