js/webawesome
1
0
Fork 0
mirror of https://github.com/shoelace-style/webawesome.git synced 2026-01-12 04:09:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

[reference] Update outline links when searching

Browse Source
This commit is contained in:
Lea Verou
2024-12-02 20:11:41 -05:00
parent be387992e6
commit 7b3e572d25
1 changed files with 18 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
docs/docs/components/reference.njk
View File

@@ -12,7 +12,15 @@ table code {
<wa-input type=search label="Filter by name:" clearable id="name_search"></wa-input>
<script>
{
let url = new URL(location);
if (url.searchParams.get("name")) {
name_search.value = url.searchParams.get("name");
}
}
</script>
<script type=module>
let url = new URL(location);
let pushedURL = false;
function filterByName (value) {
let previousFilter = url.searchParams.get("name") || "";
@@ -43,21 +51,20 @@ table code {
let table = h2.nextElementSibling;
let visibleRows = table.querySelectorAll("tbody tr:not([hidden])").length;
count.textContent = visibleRows;
let outlineLink = document.querySelector(`#outline-standard a[href="#${ h2.id }"]`);
if (outlineLink) {
// Why not just = h2.textContent? To skip the "Jump to heading" link
outlineLink.textContent = "";
outlineLink.append(...[...h2.childNodes].slice(0, 3).map(n => n.cloneNode(true)));
}
}
}
let url = new URL(location);
if (url.searchParams.get("name")) {
filterByName(name_search.value = url.searchParams.get("name"));
if (name_search.value) {
filterByName(name_search.value);
}
let pushedURL = false;
name_search.addEventListener("wa-input", e => {
filterByName(e.target.value);
});
}
name_search.addEventListener("wa-input", e => filterByName(e.target.value));
</script>
{% for type, all in componentsBy -%}