update

_site/site_libs/quarto-listing/quarto-listing.js

@@ -2,6 +2,8 @@ const kProgressiveAttr = "data-src";
 let categoriesLoaded = false;
 
 window.quartoListingCategory = (category) => {
+  // category is URI encoded in EJS template for UTF-8 support
+  category = decodeURIComponent(atob(category));
   if (categoriesLoaded) {
     activateCategory(category);
     setCategoryHash(category);
@@ -15,7 +17,9 @@ window["quarto-listing-loaded"] = () => {
   if (hash) {
     // If there is a category, switch to that
     if (hash.category) {
-      activateCategory(hash.category);
+      // category hash are URI encoded so we need to decode it before processing
+      // so that we can match it with the category element processed in JS
+      activateCategory(decodeURIComponent(hash.category));
     }
     // Paginate a specific listing
     const listingIds = Object.keys(window["quarto-listings"]);
@@ -58,7 +62,10 @@ window.document.addEventListener("DOMContentLoaded", function (_event) {
   );
 
   for (const categoryEl of categoryEls) {
-    const category = categoryEl.getAttribute("data-category");
+    // category needs to support non ASCII characters
+    const category = decodeURIComponent(
+      atob(categoryEl.getAttribute("data-category"))
+    );
     categoryEl.onclick = () => {
       activateCategory(category);
       setCategoryHash(category);
@@ -208,7 +215,9 @@ function activateCategory(category) {
 
   // Activate this category
   const categoryEl = window.document.querySelector(
-    `.quarto-listing-category .category[data-category='${category}'`
+    `.quarto-listing-category .category[data-category='${btoa(
+      encodeURIComponent(category)
+    )}']`
   );
   if (categoryEl) {
     categoryEl.classList.add("active");
@@ -231,7 +240,9 @@ function filterListingCategory(category) {
         list.filter(function (item) {
           const itemValues = item.values();
           if (itemValues.categories !== null) {
-            const categories = itemValues.categories.split(",");
+            const categories = decodeURIComponent(
+              atob(itemValues.categories)
+            ).split(",");
             return categories.includes(category);
           } else {
             return false;