Deploy PR #606 preview

docs-preview-606/script/anchor-use.js

@@ -0,0 +1,4 @@
+document.addEventListener('DOMContentLoaded', function(event) {
+  anchors.add('h1[id]:not(div.note h1, div.warning h1, div.tip h1, div.caution h1, div.important h1), h2[id]:not(div.note h2, div.warning h2, div.tip h2, div.caution h2, div.important h2), h3[id]:not(div.note h3, div.warning h3, div.tip h3, div.caution h3, div.important h3), h4[id]:not(div.note h4, div.warning h4, div.tip h4, div.caution h4, div.important h4), h5[id]:not(div.note h5, div.warning h5, div.tip h5, div.caution h5, div.important h5), h6[id]:not(div.note h6, div.warning h6, div.tip h6, div.caution h6, div.important h6)');
+});
+

docs-preview-606/script/search.js

@@ -0,0 +1,58 @@
+document.addEventListener("DOMContentLoaded", () => {
+  if (!window.location.pathname.endsWith("options.html")) return;
+
+  const searchDiv = document.createElement("div");
+  searchDiv.id = "search-bar";
+  searchDiv.innerHTML = `
+    <input type="text" id="search-input" placeholder="Search options by ID..." />
+    <div id="search-results"></div>
+  `;
+  document.body.prepend(searchDiv);
+
+  const dtElements = Array.from(document.querySelectorAll("dt"));
+  const ddElements = Array.from(document.querySelectorAll("dd"));
+  const dtOptionIds = dtElements.map(
+    (dt) => dt.querySelector("a")?.id.toLowerCase() || "",
+  );
+
+  if (dtElements.length === 0 || ddElements.length === 0) {
+    console.warn("Something went wrong, page may be loaded incorrectly.");
+    return;
+  }
+
+  const dtElementsData = dtElements.map((dt, index) => ({
+    element: dt,
+    id: dtOptionIds[index],
+    ddElement: ddElements[index],
+  }));
+
+  const hiddenClass = "hidden";
+  const hiddenStyle = document.createElement("style");
+  hiddenStyle.innerHTML = `.${hiddenClass} { display: none; }`;
+  document.head.appendChild(hiddenStyle);
+
+  let debounceTimeout;
+  document.getElementById("search-input").addEventListener("input", (event) => {
+    clearTimeout(debounceTimeout);
+    debounceTimeout = setTimeout(() => {
+      const query = event.target.value.toLowerCase();
+
+      const matches = [];
+      const nonMatches = [];
+
+      dtElementsData.forEach(({ element, id, ddElement }) => {
+        const isMatch = id.includes(query);
+        if (isMatch) {
+          matches.push(element, ddElement);
+        } else {
+          nonMatches.push(element, ddElement);
+        }
+      });
+
+      requestAnimationFrame(() => {
+        matches.forEach((el) => el?.classList.remove(hiddenClass));
+        nonMatches.forEach((el) => el?.classList.add(hiddenClass));
+      });
+    }, 200);
+  });
+});