@sarimarcus/content-sites-ui 0.38.1 → 0.39.0

package/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 All packages in the platform release in lockstep; entries are per release version.
 
+## 0.39.0 (2026-10-16)
+
+- `layout`: new `AudienceFilters`, the sr-only `audience:<a>` Pagefind filter spans that `EntityDetailShell` and `EventPage` each wrote inline; both now render it, with identical HTML (SLA-3045).
+
 ## 0.38.1 (2026-10-15)
 
 - No changes; lockstep release with tourism (SLA-3125).

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sarimarcus/content-sites-ui",
-  "version": "0.38.1",
+  "version": "0.39.0",
   "description": "Universal Astro UI components, layout shell and design tokens shared by the content sites.",
   "type": "module",
   "license": "MIT",
@@ -50,6 +50,6 @@
     "@lucide/astro": "^1.23.0",
     "astro": "^7.0.6",
     "tailwindcss": "^4.1.18",
-    "@sarimarcus/content-sites-core": "0.38.1"
+    "@sarimarcus/content-sites-core": "0.39.0"
   }
 }

package/src/editorial/EventPage.astro

@@ -18,6 +18,7 @@
  */
 import Container from '../layout/Container.astro';
 import Badge from '../primitives/Badge.astro';
+import AudienceFilters from '../layout/AudienceFilters.astro';
 import BreadcrumbBand from '../layout/BreadcrumbBand.astro';
 import { newTab } from '../primitives/newTab';
 import type { TrustedHtml } from '../types';
@@ -72,7 +73,7 @@ const withClass = (base: string, s?: Section) => (s?.class ? `${base} ${s.class}
 </BreadcrumbBand>
 
 <div data-pagefind-body data-pagefind-meta={`type:${pagefindType}`}>
-  {audiences.map((a) => <span class="sr-only" data-pagefind-filter={`audience:${a}`}>{a}</span>)}<slot name="hero" />
+  <AudienceFilters audiences={audiences} /><slot name="hero" />
 </div>
 
 <main class="pt-6 pb-12 lg:pt-8 lg:pb-20">

package/src/layout/AudienceFilters.astro

@@ -0,0 +1,12 @@
+---
+/**
+ * AudienceFilters — one sr-only `audience:<a>` Pagefind filter span per audience, so a detail page is filterable by who
+ * it is for without showing the list. Rendered inside the page's `data-pagefind-body` wrapper, before the hero.
+ */
+interface Props {
+  audiences?: readonly string[];
+}
+
+const { audiences = [] } = Astro.props;
+---
+{audiences.map((a) => <span class="sr-only" data-pagefind-filter={`audience:${a}`}>{a}</span>)}

package/src/layout/EntityDetailShell.astro

@@ -10,6 +10,7 @@
  * - `column={false}`: the default slot goes into <main> as is, for a body that leaves the column.
  * - `closer`: renders the `closer` slot in a default Container; it defaults to whether that slot was passed.
  */
+import AudienceFilters from './AudienceFilters.astro';
 import BreadcrumbBand from './BreadcrumbBand.astro';
 import Container from './Container.astro';
 
@@ -42,7 +43,7 @@ const wrapsPage = Boolean(pagefindType) && pagefindScope === 'page';
 {/* <main> is spelled out per branch: a dynamic wrapper tag buffers its children and moved hoisted scripts above it. */}
 {wrapsPage ? (
   <div data-pagefind-body data-pagefind-meta={meta}>
-    {audiences.map((a) => <span class="sr-only" data-pagefind-filter={`audience:${a}`}>{a}</span>)}
+    <AudienceFilters audiences={audiences} />
     <slot name="hero" />
     <main class={mainClass}>
       {column ? (
@@ -60,13 +61,11 @@ const wrapsPage = Boolean(pagefindType) && pagefindScope === 'page';
   <Fragment>
     {pagefindType ? (
       <div data-pagefind-body data-pagefind-meta={meta}>
-        {audiences.map((a) => <span class="sr-only" data-pagefind-filter={`audience:${a}`}>{a}</span>)}
+        <AudienceFilters audiences={audiences} />
         <slot name="hero" />
       </div>
     ) : (
-      <Fragment>
-        {audiences.map((a) => <span class="sr-only" data-pagefind-filter={`audience:${a}`}>{a}</span>)}
-        <slot name="hero" />
+      <Fragment><AudienceFilters audiences={audiences} /><slot name="hero" />
       </Fragment>
     )}
     <main class={mainClass}>

package/src/layout/index.ts

@@ -4,6 +4,7 @@ export { default as ContentHero } from './ContentHero.astro';
 export { default as BreadcrumbBand } from './BreadcrumbBand.astro';
 export { default as ListingShell } from './ListingShell.astro';
 export { default as EntityDetailShell } from './EntityDetailShell.astro';
+export { default as AudienceFilters } from './AudienceFilters.astro';
 export { default as AsyncStylesheet } from './AsyncStylesheet.astro';
 export { default as DocumentShell } from './DocumentShell.astro';
 export { default as ConsentAnalytics } from './ConsentAnalytics.astro';