@bongos/core 1.19.444 → 1.19.446

package/modules/hall-ui/public/sessions.html

@@ -8,7 +8,6 @@
   <link rel="icon" href="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><text x='16' y='24' font-size='24' text-anchor='middle' font-family='sans-serif'>⌂</text></svg>">
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
   <link rel="stylesheet" href="/builders/style.css?v=2026-06-04-sessions">
   <link rel="stylesheet" href="/builders/sessions.css">
 </head>
@@ -22,7 +21,7 @@
     <div class="app-content">
       <div class="page-head"><p class="page-head__sub" id="ledger-sub">Loading sessions…</p></div>
 
-      <main>
+      <main id="hall-main">
         <!-- Access notice — shown by sessions.js when the viewer is not an Archon. -->
         <section class="scroll" id="gate-scroll" aria-labelledby="gate-h" hidden>
           <h2 id="gate-h" class="scroll__h">Archons only</h2>

package/modules/hall-ui/public/settings.html

@@ -8,7 +8,6 @@
   <link rel="icon" href="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><text x='16' y='24' font-size='24' text-anchor='middle' font-family='sans-serif'>⌂</text></svg>">
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
   <link rel="stylesheet" href="/builders/style.css?v=2026-07-02-shell1">
   <!-- Page-local styles (task 2172) — extracted from the old inline <style>
        block per the hall placement rules; the rail comes from style.css's
@@ -25,7 +24,7 @@
     <div class="app-content">
       <div class="page-head"><p class="page-head__sub" id="settings-sub">Loading your preferences…</p></div>
 
-      <main>
+      <main id="hall-main">
         <!-- Not-signed-in notice — shown by settings.js before it redirects, and
              as a fallback if reading the viewer fails. Deliberately OUTSIDE the
              grouped layout: full-width, ungrouped. -->

package/modules/hall-ui/public/shell.js

@@ -259,13 +259,23 @@
           ' title="' + esc(it.label) + '" hidden>' + icon(it.icon) +
           '<span class="nav-item__label">' + esc(it.label) + '</span></a>';
       }).join('');
+      // task 1003303: aria-controls names the region the head discloses. The
+      // frozen markup carried aria-expanded pointing at nothing, which is an
+      // accessibility gap a screen reader cannot recover from. The items get a
+      // wrapper to be that region; its class deliberately does NOT begin with
+      // "nav-group", because tests/hall_nav.mjs splits the sidebar on that
+      // string to find groups and a matching wrapper would parse as a phantom
+      // one. `data-gate` stays immediately after the class for the same reason.
       var head = g.group
-        ? '<button type="button" class="nav-group__head" data-gate="' + (g.gate || 'always') + '" data-group="' + esc(groupId) + '" aria-expanded="' + (collapsed ? 'false' : 'true') + '" hidden>' +
+        ? '<button type="button" class="nav-group__head" data-gate="' + (g.gate || 'always') + '" data-group="' + esc(groupId) + '" aria-expanded="' + (collapsed ? 'false' : 'true') + '" aria-controls="nav-items-' + esc(groupId) + '" hidden>' +
             '<span class="nav-group__head-label">' + esc(g.group) + '</span>' + chevronIcon() +
           '</button>'
         : '';
+      var body = collapsible
+        ? '<div class="nav-items" id="nav-items-' + esc(groupId) + '">' + items + '</div>'
+        : items;
       return '<div class="nav-group' + (collapsible ? ' nav-group--collapsible' : '') + (collapsed ? ' nav-group--collapsed' : '') + '"' +
-        (collapsible ? ' data-group="' + esc(groupId) + '"' : '') + '>' + head + items + '</div>';
+        (collapsible ? ' data-group="' + esc(groupId) + '"' : '') + '>' + head + body + '</div>';
     }).join('');
 
     el.innerHTML =
@@ -423,6 +433,28 @@
     history.replaceState(null, '', window.location.pathname + rest + window.location.hash);
   }
 
+  // task 1003303: the skip link, rendered once here rather than pasted into 27
+  // heads. The hall had none, which is a platform floor (DESIGN.md
+  // §Accessibility Floors) and, with the sidebar first in the DOM, meant a
+  // keyboard reader walked the whole nav before reaching the page on every
+  // page. It is the first focusable thing in the document and it targets a
+  // <main> made focusable but never ringed, so focus actually lands there.
+  function renderSkipLink() {
+    // Both mounts are looked up BY ID, not by selector: every hall page carries
+    // #app-sidebar and gives its <main> id="hall-main" for exactly this, and
+    // getElementById is the only lookup the hall's vm test stubs implement.
+    var main = document.getElementById('hall-main');
+    var sidebar = document.getElementById('app-sidebar');
+    if (!main || !sidebar || !sidebar.parentNode) return;
+    main.setAttribute('tabindex', '-1');
+    var a = document.createElement('a');
+    a.className = 'skip';
+    a.href = '#hall-main';
+    a.textContent = 'Skip to content';
+    // Before the sidebar, so it is the first focusable thing in the document.
+    sidebar.parentNode.insertBefore(a, sidebar);
+  }
+
   function renderFoot() {
     var el = document.getElementById('app-foot');
     if (!el) return;
@@ -676,6 +708,7 @@
 
   // ---------- boot (defer = DOM parsed; render synchronously) ----------
 
+  renderSkipLink();
   renderSidebar();
   renderTopbar();
   renderDeniedNotice();