Merge fdd2a9abe8 into 252de984cc

assets/js/offline-search.js

@@ -1,164 +0,0 @@
-/*
-Copyright 2026 The Matrix.org Foundation C.I.C.
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-    http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
-*/
-
-/*
-Adapted from [1] to combine Docsy's built-in search UI with the Pagefind
-search backend.
-
-  [1]: https://github.com/matrix-org/docsy/blob/71d103ebb20ace3d528178c4b6d92b6cc4f7fd53/assets/js/offline-search.js
-*/
-
-(function ($) {
-  'use strict';
-
-  $(document).ready(async function () {
-    const pagefind = await import("/pagefind/pagefind.js");
-    const $searchInput = $('.td-search input');
-
-    //
-    // Lazily initialise Pagefind only when the user is about to start a search.
-    //
-
-    $searchInput.focus(() => {
-      pagefind.init();
-    });
-
-    //
-    // Register handler
-    //
-
-    $searchInput.on('change', (event) => {
-      render($(event.target));
-
-      // Hide keyboard on mobile browser
-      $searchInput.blur();
-    });
-
-    // Prevent reloading page by enter key on sidebar search.
-    $searchInput.closest('form').on('submit', () => {
-      return false;
-    });
-
-    //
-    // Pagefind
-    //
-
-    const render = async ($targetSearchInput) => {
-      //
-      // Dispose existing popover
-      //
-
-      {
-        let popover = bootstrap.Popover.getInstance($targetSearchInput[0]);
-        if (popover !== null) {
-          popover.dispose();
-        }
-      }
-
-      //
-      // Search
-      //
-
-      const searchQuery = $targetSearchInput.val();
-      if (searchQuery === '') {
-        return;
-      }
-
-      const search = await pagefind.debouncedSearch(searchQuery);
-      if (search === null) {
-        // A more recent search call has been made, nothing to do.
-        return;
-      }
-      const results = await Promise.all(search.results.slice(0, 20).map(r => r.data()));
-
-      //
-      // Make result html
-      //
-
-      const $html = $('<div>');
-
-      $html.append(
-        $('<div>')
-          .css({
-            display: 'flex',
-            justifyContent: 'space-between',
-            marginBottom: '1em',
-          })
-          .append(
-            $('<span>').text('Search results').css({ fontWeight: 'bold' })
-          )
-          .append(
-            $('<span>').addClass('td-offline-search-results__close-button')
-          )
-      );
-
-      const $searchResultBody = $('<div>').css({
-        maxHeight: `calc(100vh - ${
-          $targetSearchInput.offset().top - $(window).scrollTop() + 180
-        }px)`,
-        overflowY: 'auto',
-      });
-      $html.append($searchResultBody);
-
-      if (results.length === 0) {
-        $searchResultBody.append(
-          $('<p>').text(`No results found for query "${searchQuery}"`)
-        );
-      } else {
-        results.forEach((r) => {
-          r.sub_results.forEach((s) => {
-            const href = s.url;
-
-            const $entry = $('<div>').addClass('mt-4');
-
-            $entry.append(
-              $('<small>').addClass('d-block text-body-secondary').text(r.meta.title)
-            );
-
-            $entry.append(
-              $('<a>')
-                .addClass('d-block')
-                .css({
-                  fontSize: '1.2rem',
-                })
-                .attr('href', href)
-                .text(s.title)
-            );
-
-            $entry.append($('<p>').html(s.excerpt));
-
-            $searchResultBody.append($entry);
-          });
-        });
-      }
-
-      $targetSearchInput.one('shown.bs.popover', () => {
-        $('.td-offline-search-results__close-button').on('click', () => {
-          $targetSearchInput.val('');
-          $targetSearchInput.trigger('change');
-        });
-      });
-
-      const popover = new bootstrap.Popover($targetSearchInput, {
-        content: $html[0],
-        html: true,
-        customClass: 'td-offline-search-results',
-        placement: 'bottom',
-      });
-      popover.show();
-    };
-  });
-})(jQuery);

assets/scss/_styles_project.scss

@@ -662,7 +662,8 @@ dd {
   }
 }
 
-/* Style for the page search widget */
+/* Style for page search */
-.td-offline-search-results {
+#search {
-  max-width: 460px;
+  display: none;
+  padding-bottom: 1rem;
 }

changelogs/client_server/newsfragments/2328.feature

@@ -1 +1 @@
-Add the `is_animated` flag to the `info` object of the `m.image` msgtype and the `m.sticker` event, as per [MSC4230](https://github.com/matrix-org/matrix-spec-proposals/pull/4230).
+Add the `is_animated` flag to the `info` object of the `m.image` msgtype and the `m.sticker` event, as per [MSC4230](https://github.com/matrix-org/matrix-spec-proposals/pull/423O).

changelogs/client_server/newsfragments/2337.clarification

@@ -1 +0,0 @@
-Fix various typos throughout the specification.

changelogs/client_server/newsfragments/2338.feature

@@ -1 +0,0 @@
-Add the `is_animated` flag to the `info` object of the `m.image` msgtype and the `m.sticker` event, as per [MSC4230](https://github.com/matrix-org/matrix-spec-proposals/pull/4230).

changelogs/server_server/newsfragments/2338.clarification

@@ -1 +0,0 @@
-Fix various typos throughout the specification.

config/_default/hugo.toml

@@ -66,7 +66,6 @@ description = "Home of the Matrix specification for decentralised communication"
 
 [params]
 copyright = "The Matrix.org Foundation C.I.C."
-offlineSearch = true
 
 [params.version]
 # must be one of "unstable", "current", "historical"
@@ -152,8 +151,7 @@ sidebar_menu_compact = true
   [server.headers.values]
     # `style-src 'unsafe-inline'` is needed to correctly render the maths in the Olm spec:
     # https://github.com/KaTeX/KaTeX/issues/4096
-    # TODO: Figure out CSP to allow loading the Pagefind Wasm
+    Content-Security-Policy = "default-src 'self'; style-src 'self' 'unsafe-inline'; script-src 'self'; img-src 'self' data:; connect-src 'self'; font-src 'self' data:; media-src 'self'; child-src 'self'; form-action 'self'; object-src 'self'"
-    #Content-Security-Policy = "default-src 'self'; style-src 'self' 'unsafe-inline'; script-src 'self'; img-src 'self' data:; connect-src 'self'; font-src 'self' data:; media-src 'self'; child-src 'self'; form-action 'self'; object-src 'self'"
     X-XSS-Protection = "1; mode=block"
     X-Content-Type-Options = "nosniff"
     # Strict-Transport-Security = "max-age=31536000; includeSubDomains; preload"

content/client-server-api/modules/end_to_end_encryption.md

@@ -637,7 +637,7 @@ request.
 
 The prompt for Bob to accept/reject Alice's request (or the unsupported method
 prompt) should be automatically dismissed 10 minutes after the `timestamp` (in
-the case of to-device messages) or `origin_server_ts` (in the case of in-room
+the case of to-device messages) or `origin_ts` (in the case of in-room
 messages) field or 2 minutes after Bob's client receives the message, whichever
 comes first, if Bob does not interact with the prompt. The prompt should
 additionally be hidden if an appropriate `m.key.verification.cancel` message is

layouts/_partials/hooks/head-end.html

@@ -16,3 +16,7 @@
 {{ $inter := resources.Get "css/fonts/Inter.css" -}}
 <link rel="preload" href="{{ $inter.RelPermalink }}" as="style">
 <link rel="stylesheet" href="{{ $inter.RelPermalink }}">
+
+{{/* Load Pagefind stuff to power the page search. */}}
+<link href="/pagefind/pagefind-ui.css" rel="stylesheet">
+<script src="/pagefind/pagefind-ui.js"></script>

layouts/_partials/navbar.html

@@ -61,6 +61,28 @@
         </a>
       </li>
       {{ end -}}
+      <li class="nav-item" id="search-button">
+        <a class="nav-link" href="#" role="button">Search</a>
+      </li>
+      <script>
+        document.querySelector("#search-button").addEventListener("click", (event) => {
+          const search = document.querySelector("#search");
+
+          if (search.style.display === "block") {
+            // Hide the search widget.
+            search.style.display = "none";
+          } else {
+            // Initialise the search widget if needed.
+            if (!search.innerHTML.length) {
+              new PagefindUI({ element: "#search", showSubResults: true });
+            }
+
+            // Unhide and focus the search widget.
+            search.style.display = "block";
+            search.querySelector("input").focus();
+          }
+        });
+      </script>
       {{ if .Site.Params.versions -}}
       <li class="nav-item dropdown d-none d-lg-block td-navbar__version-menu">
         {{ partial "navbar-version-selector.html" . -}}

layouts/_partials/search-input.html

@@ -1,10 +0,0 @@
-<div class="td-search td-search--offline">
-  <div class="td-search__icon"></div>
-  <input
-    type="search"
-    class="td-search__input form-control"
-    placeholder="{{ T "ui_search" }}"
-    aria-label="{{ T "ui_search" }}"
-    autocomplete="off"
-  >
-</div>

layouts/docs/baseof.html

@@ -49,6 +49,7 @@
           </aside>
           <main class="col-12 col-md-9 col-xl-8 ps-md-5" role="main">
             {{ partial "version-banner.html" . }}
+            <div id="search"></div>
             {{ if not (.Param "ui.breadcrumb_disable") -}}
               {{ partial "breadcrumb.html" . -}}
             {{ end -}}