diff --git a/CHANGELOG.md b/CHANGELOG.md
index d6cf38a032..c9e51a6f84 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -121,7 +121,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
* Documenter now generates a `.documenter-siteinfo.json` file in the HTML build, that contains some metadata about the build. ([#2181])
-* The client-side search engine has been changed from LunrJs to MinisearchJs. Additionally, the search results will now contain additional context and have an improved UI. ([#2141])
+* The search UI has had a complete overhaul, with a fresh new modal UI with better context for search results and a filter mechanism to remove unwanted results. The client-side search engine has been changed from LunrJs to MinisearchJs. ([#1437], [#2141], [#2147], [#2202])
### Fixed
@@ -1411,6 +1411,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
[#1428]: https://github.com/JuliaDocs/Documenter.jl/issues/1428
[#1430]: https://github.com/JuliaDocs/Documenter.jl/issues/1430
[#1435]: https://github.com/JuliaDocs/Documenter.jl/issues/1435
+[#1437]: https://github.com/JuliaDocs/Documenter.jl/issues/1437
[#1438]: https://github.com/JuliaDocs/Documenter.jl/issues/1438
[#1440]: https://github.com/JuliaDocs/Documenter.jl/issues/1440
[#1441]: https://github.com/JuliaDocs/Documenter.jl/issues/1441
@@ -1626,6 +1627,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
[#2141]: https://github.com/JuliaDocs/Documenter.jl/issues/2141
[#2142]: https://github.com/JuliaDocs/Documenter.jl/issues/2142
[#2145]: https://github.com/JuliaDocs/Documenter.jl/issues/2145
+[#2147]: https://github.com/JuliaDocs/Documenter.jl/issues/2147
[#2153]: https://github.com/JuliaDocs/Documenter.jl/issues/2153
[#2157]: https://github.com/JuliaDocs/Documenter.jl/issues/2157
[#2169]: https://github.com/JuliaDocs/Documenter.jl/issues/2169
@@ -1634,6 +1636,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
[#2187]: https://github.com/JuliaDocs/Documenter.jl/issues/2187
[#2191]: https://github.com/JuliaDocs/Documenter.jl/issues/2191
[#2194]: https://github.com/JuliaDocs/Documenter.jl/issues/2194
+[#2202]: https://github.com/JuliaDocs/Documenter.jl/issues/2202
[#2205]: https://github.com/JuliaDocs/Documenter.jl/issues/2205
[#2213]: https://github.com/JuliaDocs/Documenter.jl/issues/2213
[#2214]: https://github.com/JuliaDocs/Documenter.jl/issues/2214
diff --git a/assets/html/js/shortcut.js b/assets/html/js/shortcut.js
index ea7b6feb74..e0c348781f 100644
--- a/assets/html/js/shortcut.js
+++ b/assets/html/js/shortcut.js
@@ -1,18 +1,100 @@
-let searchbox = document.querySelector("#documenter-search-query");
-let sidebar = document.querySelector(".docs-sidebar");
+// libraries: jquery
+// arguments: $
+
+let search_modal_header = `
+
+
+ `;
+
+ return filter_html;
+}
+
+/**
+ * Make the result component given a minisearch result data object and the value of the search input as queryString.
+ * To view the result object structure, refer: https://lucaong.github.io/minisearch/modules/_minisearch_.html#searchresult
+ *
+ * @param {object} result
+ * @param {string} querystring
+ * @returns string
+ */
+function make_search_result(result, querystring) {
+ let search_divider = ``;
+ let display_link =
+ result.location.slice(Math.max(0), Math.min(50, result.location.length)) +
+ (result.location.length > 30 ? "..." : ""); // To cut-off the link because it messes with the overflow of the whole div
+
+ if (result.page !== "") {
+ display_link += ` (${result.page})`;
}
- function make_search_result(result, querystring) {
- let display_link =
- result.location.slice(Math.max(0), Math.min(50, result.location.length)) +
- (result.location.length > 30 ? "..." : "");
-
- let textindex = new RegExp(`\\b${querystring}\\b`, "i").exec(result.text);
- let text =
- textindex !== null
- ? result.text.slice(
- Math.max(textindex.index - 100, 0),
- Math.min(
- textindex.index + querystring.length + 100,
- result.text.length
- )
+ let textindex = new RegExp(`\\b${querystring}\\b`, "i").exec(result.text);
+ let text =
+ textindex !== null
+ ? result.text.slice(
+ Math.max(textindex.index - 100, 0),
+ Math.min(
+ textindex.index + querystring.length + 100,
+ result.text.length
)
- : "";
-
- let display_result = text.length
- ? "..." +
- text.replace(
- new RegExp(`\\b${querystring}\\b`, "i"), // For first occurrence
- '$&'
- ) +
- "..."
- : "";
-
- let result_div = `
- $&'
+ ) +
+ "..."
+ : ""; // highlights the match
+
+ let in_code = false;
+ if (!["page", "section"].includes(result.category.toLowerCase())) {
+ in_code = true;
+ }
+
+ // We encode the full url to escape some special characters which can lead to broken links
+ let result_div = `
+
-