@reblu/site-blocks 0.27.0 → 0.28.0

package/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @reblu/site-blocks
 
+## 0.28.0
+
+### Minor Changes
+
+- 275adaf: REB-1201: `ArbitrationBadge` drop-in renders the tenant's consumer-arbitration distinctive in the footer — logo at `h-16`, `alt` with the adhesion number («… N.º de adhesión CA00000»), the number as visible text, optional link in a new window. `TrustBadges` knows the new type (heading «Arbitraje de consumo») but leaves it out of its default groups, so a footer with both never shows it twice; opt in with `types`. Any badge with an adhesion number gets it in its `alt`.
+
+### Patch Changes
+
+- Updated dependencies [275adaf]
+  - @reblu/site-contracts@1.28.0
+
 ## 0.27.0
 
 ### Minor Changes

package/README.md

@@ -35,6 +35,7 @@ colour on the red background. See `docs/theming/theming.md`.
 | `PageBlocks`, `FaqAccordion`                                                                                  | `.`        | Registry-block renderer (`PageDetail.blocks`) and native `<details>` FAQ. Server Components. See "Page blocks" below.        |
 | `ProductTrustItems`, `DEFAULT_TRUST_ICONS`                                                                    | `.`        | Store-wide trust messages from `ShopConfig.productTrustItems`. Server Component. See "Product trust items" below.            |
 | `TrustBadges`, `DEFAULT_TRUST_BADGE_HEADINGS`                                                                 | `.`        | The tenant's trust badges from `client.trustBadges.list()`, grouped by type. Server Component. See "Trust badges" below.     |
+| `ArbitrationBadge`                                                                                            | `.`        | The consumer-arbitration distinctive with its adhesion number, for the footer. Server Component. See "Consumer arbitration badge" below. |
 | `buildFaqPageJsonLd`, `collectFaqItems`                                                                       | `./seo`    | schema.org `FAQPage` structured data. Directive-free (also on `.`). See "Page blocks" below.                                 |
 | `useCollection`                                                                                               | `./client` | Headless filterable/sortable/paginated collection hook (facets, category, tag, search). Serves both page and blog indexes.   |
 | `Collection`                                                                                                  | `./client` | Token-driven presentational grid over `useCollection`.                                                                       |
@@ -755,7 +756,11 @@ export async function Footer() {
 - `types` picks which groups render and in what order, e.g. only the funding
   logos: `<TrustBadges badges={badges} types={['SUBVENTION']} />`. To fetch
   only one type, `client.trustBadges.list({ type: 'SUBVENTION' })`.
-- A logo is an `<img>` with `alt` = badge name, rendered only when its URL is
+- `CONSUMER_ARBITRATION` is not in the default groups — render it with
+  `ArbitrationBadge` (below). Opt in with `types` to group it here; its heading
+  is «Arbitraje de consumo».
+- A logo is an `<img>` with `alt` = badge name (plus «N.º de adhesión …» when
+  the badge has an adhesion number), rendered only when its URL is
   http(s) or root-relative (`/logos/x.svg`); any other scheme (`javascript:`,
   `data:`, `//host`) is dropped and the badge shows its name as text, like a
   badge without a logo. A badge `url` (http/https only) opens in a new window
@@ -781,6 +786,46 @@ export async function Footer() {
   `listClassName` and `logoClassName` are layout/sizing slots and still merge
   with `cn`.
 
+## Consumer arbitration badge — `ArbitrationBadge` (REB-1201)
+
+A tenant adhered to the consumer arbitration system shows the official
+distinctive in the footer, visible and accessible, with its adhesion number. In
+nexus › Trust badges create a badge of type «Arbitraje de consumo» with the
+official logo, the «Número de adhesión» (required for that type) and an
+optional link. The API serves it like any other badge, with `adhesionNumber`.
+
+```tsx
+import { ArbitrationBadge, TrustBadges } from '@reblu/site-blocks'
+
+export async function Footer() {
+  const { data: badges } = await client.trustBadges.list().catch(() => ({ data: [] }))
+  return (
+    <footer>
+      {/* … */}
+      <TrustBadges badges={badges} headingLevel={2} />
+      <ArbitrationBadge badges={badges} />
+    </footer>
+  )
+}
+```
+
+- Feed it the whole list: only `CONSUMER_ARBITRATION` badges render, and
+  `TrustBadges` leaves that type out by default, so it never shows twice. To
+  fetch only it, `client.trustBadges.list({ type: 'CONSUMER_ARBITRATION' })`.
+- The logo is an `<img>` at `h-16` (not a tiny icon) with `alt` = «{name}.
+  N.º de adhesión {number}». The number is also shown as visible text under the
+  logo, `aria-hidden` there because the `alt` already says it. Without a usable
+  logo (same http(s)/root-relative rule as `TrustBadges`) the name and number
+  are plain text.
+- `numberLabel` changes «N.º de adhesión» (alt and caption); `showNumber={false}`
+  drops the visible caption, the `alt` keeps the number.
+- A http(s) `url` opens in a new window with `rel="noopener noreferrer"` and a
+  visually hidden `newWindowLabel`.
+- Nothing renders without a named consumer-arbitration badge.
+- Styling hooks: `className` (the `<ul>`), `logoClassName` (merged with
+  `h-16 w-auto object-contain`, e.g. `brightness-0 invert` on a dark footer),
+  `numberClassName`.
+
 ## `ParentPage` (formerly `Specialty`)
 
 `ParentPage` renders a page that groups other pages: the hero and content