@brandlab-digital/site-next 3.13.0 → 3.14.0

package/dist/ui-kit/primitives/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui-kit/primitives/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EACf,UAAU,EACV,SAAS,EACT,QAAQ,GAWT,MAAM,YAAY,CAAA;AACnB,OAAO,EACL,gBAAgB,EAChB,SAAS,EACT,WAAW,EACX,aAAa,EACb,OAAO,EACP,cAAc,EACd,cAAc,GASf,MAAM,aAAa,CAAA;AACpB,OAAO,EAAE,WAAW,EAAqE,MAAM,mBAAmB,CAAA;AAClH,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,aAAa,EAAmC,MAAM,aAAa,CAAA;AAC9F,OAAO,EAAE,eAAe,EAA+D,MAAM,aAAa,CAAA;AAC1G,OAAO,EACL,wBAAwB,EACxB,oBAAoB,EACpB,oBAAoB,EACpB,iBAAiB,GAGlB,MAAM,gBAAgB,CAAA","sourcesContent":["export {\n  BUTTON_VARIANTS,\n  ButtonLink,\n  PhoneLink,\n  TextLink,\n  type ButtonLinkProps,\n  type ButtonLinkSkin,\n  type ButtonLinkSlot,\n  type ButtonVariant,\n  type PhoneLinkProps,\n  type PhoneLinkSkin,\n  type PhoneLinkSlot,\n  type TextLinkProps,\n  type TextLinkSkin,\n  type TextLinkSlot,\n} from './links.js'\nexport {\n  CONTAINER_WIDTHS,\n  Container,\n  RatingStars,\n  SECTION_TONES,\n  Section,\n  SectionHeading,\n  VisuallyHidden,\n  type ContainerSkin,\n  type ContainerWidth,\n  type SectionHeadingProps,\n  type SectionHeadingSkin,\n  type SectionHeadingSlot,\n  type SectionProps,\n  type SectionSlot,\n  type SectionTone,\n} from './layout.js'\nexport { QuoteButton, type QuoteButtonProps, type QuoteButtonSkin, type QuoteButtonSlot } from './quote-button.js'\nexport { Icon, SocialIcon, UI_ICON_NAMES, type IconProps, type UiIconName } from '../icons.js'\nexport { UI_SOCIAL_KINDS, type UiLink, type UiPhone, type UiSocial, type UiSocialKind } from '../types.js'\nexport {\n  INTENT_PREFETCH_SELECTOR,\n  LINK_PREFETCH_LIMITS,\n  LINK_PREFETCH_POLICY,\n  linkPrefetchProps,\n  type LinkPrefetch,\n  type LinkPrefetchRole,\n} from '../prefetch.js'\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui-kit/primitives/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EACf,UAAU,EACV,SAAS,EACT,QAAQ,GAWT,MAAM,YAAY,CAAA;AACnB,OAAO,EACL,gBAAgB,EAChB,SAAS,EACT,OAAO,EACP,WAAW,EACX,aAAa,EACb,OAAO,EACP,cAAc,EACd,cAAc,GAWf,MAAM,aAAa,CAAA;AACpB,OAAO,EAAE,MAAM,EAAsD,MAAM,aAAa,CAAA;AACxF,OAAO,EAAE,IAAI,EAAiE,MAAM,WAAW,CAAA;AAC/F,OAAO,EAAE,KAAK,EAAE,IAAI,EAAiG,MAAM,YAAY,CAAA;AACvI,OAAO,EAAE,IAAI,EAAgD,MAAM,WAAW,CAAA;AAC9E,OAAO,EACL,eAAe,EACf,QAAQ,EACR,QAAQ,GAYT,MAAM,YAAY,CAAA;AACnB,OAAO,EACL,kBAAkB,EAClB,UAAU,GAMX,MAAM,kBAAkB,CAAA;AACzB,OAAO,EAAE,wBAAwB,EAAE,KAAK,EAAqE,MAAM,YAAY,CAAA;AAC/H,OAAO,EACL,iBAAiB,EACjB,WAAW,EACX,iBAAiB,GAMlB,MAAM,kBAAkB,CAAA;AACzB,OAAO,EAAE,WAAW,EAAqE,MAAM,mBAAmB,CAAA;AAClH,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,aAAa,EAAE,cAAc,EAAE,cAAc,EAAmC,MAAM,aAAa,CAAA;AAC9H,OAAO,EAAE,eAAe,EAAoC,MAAM,mBAAmB,CAAA;AACrF,OAAO,EAAE,eAAe,EAA+D,MAAM,aAAa,CAAA;AAC1G,OAAO,EACL,wBAAwB,EACxB,oBAAoB,EACpB,oBAAoB,EACpB,iBAAiB,GAGlB,MAAM,gBAAgB,CAAA","sourcesContent":["export {\n  BUTTON_VARIANTS,\n  ButtonLink,\n  PhoneLink,\n  TextLink,\n  type ButtonLinkProps,\n  type ButtonLinkSkin,\n  type ButtonLinkSlot,\n  type ButtonVariant,\n  type PhoneLinkProps,\n  type PhoneLinkSkin,\n  type PhoneLinkSlot,\n  type TextLinkProps,\n  type TextLinkSkin,\n  type TextLinkSlot,\n} from './links.js'\nexport {\n  CONTAINER_WIDTHS,\n  Container,\n  Eyebrow,\n  RatingStars,\n  SECTION_TONES,\n  Section,\n  SectionHeading,\n  VisuallyHidden,\n  type ContainerSkin,\n  type ContainerWidth,\n  type EyebrowSkin,\n  type EyebrowSlot,\n  type SectionHeadingProps,\n  type SectionHeadingSkin,\n  type SectionHeadingSlot,\n  type SectionProps,\n  type SectionSlot,\n  type SectionTone,\n} from './layout.js'\nexport { Button, type ButtonProps, type ButtonSkin, type ButtonSlot } from './button.js'\nexport { Card, type CardLayout, type CardProps, type CardSkin, type CardSlot } from './card.js'\nexport { Badge, Chip, type BadgeProps, type BadgeSkin, type BadgeSlot, type ChipProps, type ChipSkin, type ChipSlot } from './badge.js'\nexport { Stat, type StatProps, type StatSkin, type StatSlot } from './stat.js'\nexport {\n  LINK_LIST_KINDS,\n  LinkList,\n  TickList,\n  type LinkListKind,\n  type LinkListLayout,\n  type LinkListProps,\n  type LinkListSkin,\n  type LinkListSlot,\n  type TickItem,\n  type TickListLayout,\n  type TickListProps,\n  type TickListRepeatedSlot,\n  type TickListSkin,\n  type TickListSlot,\n} from './lists.js'\nexport {\n  ILLUSTRATION_LABEL,\n  MediaFrame,\n  type MediaFrameProps,\n  type MediaFrameSizing,\n  type MediaFrameSkin,\n  type MediaFrameSlot,\n  type UiMedia,\n} from './media-frame.js'\nexport { MEDIA_ILLUSTRATION_LABEL, Media, type MediaLayout, type MediaProps, type MediaSkin, type MediaSlot } from './media.js'\nexport {\n  BREADCRUMBS_LABEL,\n  Breadcrumbs,\n  breadcrumbsSchema,\n  type BreadcrumbTrail,\n  type BreadcrumbsProps,\n  type BreadcrumbsRepeatedSlot,\n  type BreadcrumbsSkin,\n  type BreadcrumbsSlot,\n} from './breadcrumbs.js'\nexport { QuoteButton, type QuoteButtonProps, type QuoteButtonSkin, type QuoteButtonSlot } from './quote-button.js'\nexport { Icon, SocialIcon, UI_ICON_NAMES, createSiteIcon, iconSpriteHref, type IconProps, type UiIconName } from '../icons.js'\nexport { defineSiteIcons, type IconGlyph, type SiteIconSet } from '../icon-glyphs.js'\nexport { UI_SOCIAL_KINDS, type UiLink, type UiPhone, type UiSocial, type UiSocialKind } from '../types.js'\nexport {\n  INTENT_PREFETCH_SELECTOR,\n  LINK_PREFETCH_LIMITS,\n  LINK_PREFETCH_POLICY,\n  linkPrefetchProps,\n  type LinkPrefetch,\n  type LinkPrefetchRole,\n} from '../prefetch.js'\n"]}

package/dist/ui-kit/primitives/layout.d.ts

@@ -57,9 +57,21 @@ export interface SectionHeadingProps extends SectionHeadingSkin {
 }
 /** A section's heading block: an optional eyebrow, the H2 and an optional lead paragraph. */
 export declare function SectionHeading({ id, title, eyebrow, lead, layout, classes }: SectionHeadingProps): import("react/jsx-runtime").JSX.Element;
+export type EyebrowSlot = 'root';
+export type EyebrowSkin = SkinEntry<EyebrowSlot>;
+/**
+ * A short label above a site's own heading (3.14.0), for signature sections that don't use `SectionHeading`. At
+ * least 13 px; never the only label for a section. `SectionHeading` and the hero keep their own `eyebrow` slot.
+ */
+export declare function Eyebrow({ children, classes }: EyebrowSkin & {
+    readonly children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
 /**
  * Five stars with one text alternative ("Rated 4.9 out of 5"). The stars use `--bl-color-star`; whole stars only,
  * rounded to the nearest. The rating always comes from the feed, never typed by hand (T4).
+ *
+ * From 3.14.0 the row is one `<svg>` holding five `<use>` references to the sprite's star (`data-slot="star"`,
+ * `data-state="on" | "off"`), not five icons; without the sprite each star is a `<g>` with the glyph inline.
  */
 export declare function RatingStars({ rating, label, className }: {
     readonly rating: number;

package/dist/ui-kit/primitives/layout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../../../src/ui-kit/primitives/layout.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../../../src/ui-kit/primitives/layout.tsx"],"names":[],"mappings":"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"}

package/dist/ui-kit/primitives/layout.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Icon } from '../icons.js';
+import { starGlyph } from '../icons.js';
 import { slot } from '../skin.js';
 export const CONTAINER_WIDTHS = ['default', 'narrow', 'wide'];
 /** One container width shared by the header, the page and the footer (`--bl-container`, `--bl-gutter`). */
@@ -19,13 +19,31 @@ export function Section({ id, labelledBy, tone, variant, classes, decoration, ho
 export function SectionHeading({ id, title, eyebrow, lead, layout, classes }) {
     return (_jsxs("div", { ...slot(classes, 'head'), "data-align": layout?.align ?? 'start', children: [eyebrow ? _jsx("p", { ...slot(classes, 'eyebrow'), children: eyebrow }) : null, _jsx("h2", { id: id, ...slot(classes, 'heading'), children: title }), lead ? _jsx("p", { ...slot(classes, 'lead'), children: lead }) : null] }));
 }
+/**
+ * A short label above a site's own heading (3.14.0), for signature sections that don't use `SectionHeading`. At
+ * least 13 px; never the only label for a section. `SectionHeading` and the hero keep their own `eyebrow` slot.
+ */
+export function Eyebrow({ children, classes }) {
+    return (_jsx("p", { "data-bl": "eyebrow", className: classes?.root, children: children }));
+}
+/** The rating row's geometry: five 20-unit stars, 2 units apart, in one `viewBox`. */
+const STAR_SIZE = 20;
+const STAR_STRIDE = 22;
+const STARS_VIEW_BOX = `0 0 ${STAR_STRIDE * 4 + STAR_SIZE} ${STAR_SIZE}`;
 /**
  * Five stars with one text alternative ("Rated 4.9 out of 5"). The stars use `--bl-color-star`; whole stars only,
  * rounded to the nearest. The rating always comes from the feed, never typed by hand (T4).
+ *
+ * From 3.14.0 the row is one `<svg>` holding five `<use>` references to the sprite's star (`data-slot="star"`,
+ * `data-state="on" | "off"`), not five icons; without the sprite each star is a `<g>` with the glyph inline.
  */
 export function RatingStars({ rating, label, className }) {
     const filled = Math.max(0, Math.min(5, Math.round(rating)));
-    return (_jsx("span", { "data-bl": "stars", role: "img", "aria-label": label ?? `Rated ${rating.toFixed(1)} out of 5`, className: className, children: Array.from({ length: 5 }, (_, index) => (_jsx("span", { "data-slot": "star", "data-state": index < filled ? 'on' : 'off', children: _jsx(Icon, { name: "star" }) }, index))) }));
+    const star = starGlyph();
+    return (_jsx("span", { "data-bl": "stars", role: "img", "aria-label": label ?? `Rated ${rating.toFixed(1)} out of 5`, className: className, children: _jsx("svg", { "aria-hidden": "true", viewBox: STARS_VIEW_BOX, children: Array.from({ length: 5 }, (_, index) => {
+                const state = index < filled ? 'on' : 'off';
+                return star.href ? (_jsx("use", { href: star.href, x: index * STAR_STRIDE, width: STAR_SIZE, height: STAR_SIZE, "data-slot": "star", "data-state": state }, index)) : (_jsx("g", { transform: index === 0 ? undefined : `translate(${index * STAR_STRIDE})`, "data-slot": "star", "data-state": state, dangerouslySetInnerHTML: { __html: star.glyph.body } }, index));
+            }) }) }));
 }
 /** Text for assistive technology only. */
 export function VisuallyHidden({ children }) {

package/dist/ui-kit/primitives/layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"layout.js","sourceRoot":"","sources":["../../../src/ui-kit/primitives/layout.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * Layout primitives: `Container`, `Section`, `SectionHeading`, `Eyebrow`, `RatingStars` and `VisuallyHidden`.\n * Server components. Heading levels come from the page outline (one H1 in the hero or page header, an H2 per\n * section), never from a look.\n */\nimport type { ReactNode } from 'react'\nimport type { PhoneCallPlacement } from '../../analytics.js'\nimport { Icon } from '../icons.js'\nimport { slot, type SkinEntry } from '../skin.js'\n\nexport const CONTAINER_WIDTHS = ['default', 'narrow', 'wide'] as const\nexport type ContainerWidth = (typeof CONTAINER_WIDTHS)[number]\nexport type ContainerSkin = SkinEntry<'root', never, { width?: ContainerWidth }>\n\n/** One container width shared by the header, the page and the footer (`--bl-container`, `--bl-gutter`). */\nexport function Container({ children, layout, classes }: ContainerSkin & { readonly children: ReactNode }) {\n  return (\n    <div data-bl=\"container\" data-width={layout?.width ?? 'default'} className={classes?.root}>\n      {children}\n    </div>\n  )\n}\n\n/** The four section tones `SectionSequence` assigns: two alternating grounds, one optional band, one photo ground. */\nexport const SECTION_TONES = ['canvas', 'surface', 'band', 'photo'] as const\nexport type SectionTone = (typeof SECTION_TONES)[number]\n\nexport type SectionSlot = 'root' | 'inner'\n\nexport interface SectionProps {\n  /** The matrix id, rendered as `data-bl-section` (for example `reviews`, `cta`, `faqs`). */\n  readonly id: string\n  /** The id of the section's H2. A section is a `<section>` labelled by its heading. */\n  readonly labelledBy: string\n  readonly tone?: SectionTone | undefined\n  readonly variant?: string | undefined\n  readonly classes?: Readonly<Partial<Record<SectionSlot, string>>> | undefined\n  /** Signature art, rendered `aria-hidden`. */\n  readonly decoration?: ReactNode\n  /**\n   * Extra layout hooks on the root, for example `{ 'data-columns': '3' }`. They cannot override `data-bl-section`,\n   * `data-variant`, `data-tone` or `data-phone-location`.\n   */\n  readonly hooks?: Readonly<Record<`data-${string}`, string | undefined>>\n  /** The placement a `tel:` link inside the section reports when it has none of its own. */\n  readonly phonePlacement?: PhoneCallPlacement | undefined\n  readonly children: ReactNode\n}\n\n/**\n * The root every section component renders: `<section data-bl-section aria-labelledby>`, its tone and variant, an\n * optional `aria-hidden` decoration and the inner container slot.\n */\nexport function Section({ id, labelledBy, tone, variant, classes, decoration, hooks, phonePlacement, children }: SectionProps) {\n  return (\n    <section\n      {...hooks}\n      data-bl-section={id}\n      data-variant={variant}\n      data-tone={tone}\n      data-phone-location={phonePlacement}\n      aria-labelledby={labelledBy}\n      className={classes?.root}\n    >\n      {decoration ? (\n        <div data-slot=\"decoration\" aria-hidden=\"true\">\n          {decoration}\n        </div>\n      ) : null}\n      <div {...slot(classes, 'inner')}>{children}</div>\n    </section>\n  )\n}\n\nexport type SectionHeadingSlot = 'head' | 'eyebrow' | 'heading' | 'lead'\nexport type SectionHeadingSkin = SkinEntry<SectionHeadingSlot, never, { align?: 'start' | 'center' }>\n\nexport interface SectionHeadingProps extends SectionHeadingSkin {\n  /** The H2's id, which the section's `aria-labelledby` points at. */\n  readonly id: string\n  readonly title: ReactNode\n  /** A short label above the H2 (at least 13 px; never the only label for the section). */\n  readonly eyebrow?: ReactNode\n  readonly lead?: ReactNode\n}\n\n/** A section's heading block: an optional eyebrow, the H2 and an optional lead paragraph. */\nexport function SectionHeading({ id, title, eyebrow, lead, layout, classes }: SectionHeadingProps) {\n  return (\n    <div {...slot(classes, 'head')} data-align={layout?.align ?? 'start'}>\n      {eyebrow ? <p {...slot(classes, 'eyebrow')}>{eyebrow}</p> : null}\n      <h2 id={id} {...slot(classes, 'heading')}>\n        {title}\n      </h2>\n      {lead ? <p {...slot(classes, 'lead')}>{lead}</p> : null}\n    </div>\n  )\n}\n\n/**\n * Five stars with one text alternative (\"Rated 4.9 out of 5\"). The stars use `--bl-color-star`; whole stars only,\n * rounded to the nearest. The rating always comes from the feed, never typed by hand (T4).\n */\nexport function RatingStars({ rating, label, className }: { readonly rating: number; readonly label?: string; readonly className?: string }) {\n  const filled = Math.max(0, Math.min(5, Math.round(rating)))\n  return (\n    <span data-bl=\"stars\" role=\"img\" aria-label={label ?? `Rated ${rating.toFixed(1)} out of 5`} className={className}>\n      {Array.from({ length: 5 }, (_, index) => (\n        <span key={index} data-slot=\"star\" data-state={index < filled ? 'on' : 'off'}>\n          <Icon name=\"star\" />\n        </span>\n      ))}\n    </span>\n  )\n}\n\n/** Text for assistive technology only. */\nexport function VisuallyHidden({ children }: { readonly children: ReactNode }) {\n  return <span data-bl-visually-hidden=\"\">{children}</span>\n}\n"]}
+{"version":3,"file":"layout.js","sourceRoot":"","sources":["../../../src/ui-kit/primitives/layout.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * Layout primitives: `Container`, `Section`, `SectionHeading`, `Eyebrow`, `RatingStars` and `VisuallyHidden`.\n * Server components. Heading levels come from the page outline (one H1 in the hero or page header, an H2 per\n * section), never from a look.\n */\nimport type { ReactNode } from 'react'\nimport type { PhoneCallPlacement } from '../../analytics.js'\nimport { starGlyph } from '../icons.js'\nimport { slot, type SkinEntry } from '../skin.js'\n\nexport const CONTAINER_WIDTHS = ['default', 'narrow', 'wide'] as const\nexport type ContainerWidth = (typeof CONTAINER_WIDTHS)[number]\nexport type ContainerSkin = SkinEntry<'root', never, { width?: ContainerWidth }>\n\n/** One container width shared by the header, the page and the footer (`--bl-container`, `--bl-gutter`). */\nexport function Container({ children, layout, classes }: ContainerSkin & { readonly children: ReactNode }) {\n  return (\n    <div data-bl=\"container\" data-width={layout?.width ?? 'default'} className={classes?.root}>\n      {children}\n    </div>\n  )\n}\n\n/** The four section tones `SectionSequence` assigns: two alternating grounds, one optional band, one photo ground. */\nexport const SECTION_TONES = ['canvas', 'surface', 'band', 'photo'] as const\nexport type SectionTone = (typeof SECTION_TONES)[number]\n\nexport type SectionSlot = 'root' | 'inner'\n\nexport interface SectionProps {\n  /** The matrix id, rendered as `data-bl-section` (for example `reviews`, `cta`, `faqs`). */\n  readonly id: string\n  /** The id of the section's H2. A section is a `<section>` labelled by its heading. */\n  readonly labelledBy: string\n  readonly tone?: SectionTone | undefined\n  readonly variant?: string | undefined\n  readonly classes?: Readonly<Partial<Record<SectionSlot, string>>> | undefined\n  /** Signature art, rendered `aria-hidden`. */\n  readonly decoration?: ReactNode\n  /**\n   * Extra layout hooks on the root, for example `{ 'data-columns': '3' }`. They cannot override `data-bl-section`,\n   * `data-variant`, `data-tone` or `data-phone-location`.\n   */\n  readonly hooks?: Readonly<Record<`data-${string}`, string | undefined>>\n  /** The placement a `tel:` link inside the section reports when it has none of its own. */\n  readonly phonePlacement?: PhoneCallPlacement | undefined\n  readonly children: ReactNode\n}\n\n/**\n * The root every section component renders: `<section data-bl-section aria-labelledby>`, its tone and variant, an\n * optional `aria-hidden` decoration and the inner container slot.\n */\nexport function Section({ id, labelledBy, tone, variant, classes, decoration, hooks, phonePlacement, children }: SectionProps) {\n  return (\n    <section\n      {...hooks}\n      data-bl-section={id}\n      data-variant={variant}\n      data-tone={tone}\n      data-phone-location={phonePlacement}\n      aria-labelledby={labelledBy}\n      className={classes?.root}\n    >\n      {decoration ? (\n        <div data-slot=\"decoration\" aria-hidden=\"true\">\n          {decoration}\n        </div>\n      ) : null}\n      <div {...slot(classes, 'inner')}>{children}</div>\n    </section>\n  )\n}\n\nexport type SectionHeadingSlot = 'head' | 'eyebrow' | 'heading' | 'lead'\nexport type SectionHeadingSkin = SkinEntry<SectionHeadingSlot, never, { align?: 'start' | 'center' }>\n\nexport interface SectionHeadingProps extends SectionHeadingSkin {\n  /** The H2's id, which the section's `aria-labelledby` points at. */\n  readonly id: string\n  readonly title: ReactNode\n  /** A short label above the H2 (at least 13 px; never the only label for the section). */\n  readonly eyebrow?: ReactNode\n  readonly lead?: ReactNode\n}\n\n/** A section's heading block: an optional eyebrow, the H2 and an optional lead paragraph. */\nexport function SectionHeading({ id, title, eyebrow, lead, layout, classes }: SectionHeadingProps) {\n  return (\n    <div {...slot(classes, 'head')} data-align={layout?.align ?? 'start'}>\n      {eyebrow ? <p {...slot(classes, 'eyebrow')}>{eyebrow}</p> : null}\n      <h2 id={id} {...slot(classes, 'heading')}>\n        {title}\n      </h2>\n      {lead ? <p {...slot(classes, 'lead')}>{lead}</p> : null}\n    </div>\n  )\n}\n\nexport type EyebrowSlot = 'root'\nexport type EyebrowSkin = SkinEntry<EyebrowSlot>\n\n/**\n * A short label above a site's own heading (3.14.0), for signature sections that don't use `SectionHeading`. At\n * least 13 px; never the only label for a section. `SectionHeading` and the hero keep their own `eyebrow` slot.\n */\nexport function Eyebrow({ children, classes }: EyebrowSkin & { readonly children: ReactNode }) {\n  return (\n    <p data-bl=\"eyebrow\" className={classes?.root}>\n      {children}\n    </p>\n  )\n}\n\n/** The rating row's geometry: five 20-unit stars, 2 units apart, in one `viewBox`. */\nconst STAR_SIZE = 20\nconst STAR_STRIDE = 22\nconst STARS_VIEW_BOX = `0 0 ${STAR_STRIDE * 4 + STAR_SIZE} ${STAR_SIZE}`\n\n/**\n * Five stars with one text alternative (\"Rated 4.9 out of 5\"). The stars use `--bl-color-star`; whole stars only,\n * rounded to the nearest. The rating always comes from the feed, never typed by hand (T4).\n *\n * From 3.14.0 the row is one `<svg>` holding five `<use>` references to the sprite's star (`data-slot=\"star\"`,\n * `data-state=\"on\" | \"off\"`), not five icons; without the sprite each star is a `<g>` with the glyph inline.\n */\nexport function RatingStars({ rating, label, className }: { readonly rating: number; readonly label?: string; readonly className?: string }) {\n  const filled = Math.max(0, Math.min(5, Math.round(rating)))\n  const star = starGlyph()\n  return (\n    <span data-bl=\"stars\" role=\"img\" aria-label={label ?? `Rated ${rating.toFixed(1)} out of 5`} className={className}>\n      <svg aria-hidden=\"true\" viewBox={STARS_VIEW_BOX}>\n        {Array.from({ length: 5 }, (_, index) => {\n          const state = index < filled ? 'on' : 'off'\n          return star.href ? (\n            <use key={index} href={star.href} x={index * STAR_STRIDE} width={STAR_SIZE} height={STAR_SIZE} data-slot=\"star\" data-state={state} />\n          ) : (\n            <g\n              key={index}\n              transform={index === 0 ? undefined : `translate(${index * STAR_STRIDE})`}\n              data-slot=\"star\"\n              data-state={state}\n              dangerouslySetInnerHTML={{ __html: star.glyph.body }}\n            />\n          )\n        })}\n      </svg>\n    </span>\n  )\n}\n\n/** Text for assistive technology only. */\nexport function VisuallyHidden({ children }: { readonly children: ReactNode }) {\n  return <span data-bl-visually-hidden=\"\">{children}</span>\n}\n"]}

package/dist/ui-kit/primitives/links.d.ts

@@ -4,6 +4,21 @@ import { type UiIconName } from '../icons.js';
 import { type LinkPrefetch } from '../prefetch.js';
 import { type SkinEntry } from '../skin.js';
 import type { UiPhone } from '../types.js';
+/** Data hooks and the skin class for an anchor's root. */
+export type AnchorHooks = {
+    readonly className?: string | undefined;
+} & Readonly<Record<`data-${string}`, string | undefined>>;
+/**
+ * The one anchor every ui-kit link renders (internal; not exported from the subpath): `next/link` with the prefetch
+ * role for internal links, a plain `<a target="_blank" rel="noopener noreferrer">` for external ones.
+ */
+export declare function Anchor({ href, external, prefetch, hooks, children, }: {
+    href: string;
+    external?: boolean | undefined;
+    prefetch?: LinkPrefetch | undefined;
+    hooks: AnchorHooks;
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
 export type ButtonLinkSlot = 'root' | 'label' | 'icon';
 export declare const BUTTON_VARIANTS: readonly ["primary", "secondary", "quiet"];
 export type ButtonVariant = (typeof BUTTON_VARIANTS)[number];

package/dist/ui-kit/primitives/links.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"links.d.ts","sourceRoot":"","sources":["../../../src/ui-kit/primitives/links.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAA;AAC5D,OAAO,EAAQ,KAAK,UAAU,EAAE,MAAM,aAAa,CAAA;AACnD,OAAO,EAAqB,KAAK,YAAY,EAAE,MAAM,gBAAgB,CAAA;AACrE,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,YAAY,CAAA;AACjD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA;AAoC1C,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM,CAAA;AACtD,eAAO,MAAM,eAAe,4CAA6C,CAAA;AACzE,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,CAAA;AAC5D,MAAM,MAAM,cAAc,GAAG,SAAS,CAAC,cAAc,EAAE,aAAa,EAAE;IAAE,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;CAAE,CAAC,CAAA;AAErG,MAAM,WAAW,eAAgB,SAAQ,cAAc;IACrD,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAA;IAC5B,gEAAgE;IAChE,QAAQ,CAAC,IAAI,CAAC,EAAE,UAAU,CAAA;IAC1B,QAAQ,CAAC,YAAY,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;IACvC,2EAA2E;IAC3E,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAC3B;;;OAGG;IACH,QAAQ,CAAC,QAAQ,CAAC,EAAE,YAAY,CAAA;CACjC;AAED,0FAA0F;AAC1F,wBAAgB,UAAU,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,YAAoB,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAmB,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,eAAe,2CAcnJ;AAED,MAAM,MAAM,YAAY,GAAG,MAAM,CAAA;AACjC,MAAM,MAAM,YAAY,GAAG,SAAS,CAAC,YAAY,EAAE,QAAQ,GAAG,YAAY,CAAC,CAAA;AAE3E,MAAM,WAAW,aAAc,SAAQ,YAAY;IACjD,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAA;IAC5B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAC3B;;;OAGG;IACH,QAAQ,CAAC,QAAQ,CAAC,EAAE,YAAY,CAAA;CACjC;AAED,yCAAyC;AACzC,wBAAgB,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAkB,EAAE,OAAO,EAAE,EAAE,aAAa,2CAM1G;AAED,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAA;AAChE,MAAM,MAAM,aAAa,GAAG,SAAS,CAAC,aAAa,EAAE,MAAM,GAAG,QAAQ,CAAC,CAAA;AAEvE,MAAM,WAAW,cAAe,SAAQ,aAAa;IACnD,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAA;IACvB,qFAAqF;IACrF,QAAQ,CAAC,SAAS,EAAE,kBAAkB,CAAA;IACtC,4GAA4G;IAC5G,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,oDAAoD;IACpD,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAC5B;AAED;;;GAGG;AACH,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,QAAgB,EAAE,OAAgB,EAAE,OAAO,EAAE,EAAE,cAAc,2CAgBjH"}
+{"version":3,"file":"links.d.ts","sourceRoot":"","sources":["../../../src/ui-kit/primitives/links.tsx"],"names":[],"mappings":"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"}

package/dist/ui-kit/primitives/links.js

@@ -11,7 +11,11 @@ import { slot } from '../skin.js';
 function isExternal(href) {
     return /^https?:\/\//i.test(href);
 }
-function Anchor({ href, external, prefetch, hooks, children, }) {
+/**
+ * The one anchor every ui-kit link renders (internal; not exported from the subpath): `next/link` with the prefetch
+ * role for internal links, a plain `<a target="_blank" rel="noopener noreferrer">` for external ones.
+ */
+export function Anchor({ href, external, prefetch, hooks, children, }) {
     if (external ?? isExternal(href)) {
         return (_jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", ...hooks, children: children }));
     }

package/dist/ui-kit/primitives/links.js.map

@@ -1 +1 @@
-{"version":3,"file":"links.js","sourceRoot":"","sources":["../../../src/ui-kit/primitives/links.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * Link primitives: `ButtonLink`, `TextLink` and `PhoneLink`. Server components; every link is a real `<a href>`.\n * External links open in a new tab with `rel=\"noopener noreferrer\"`. `PhoneLink` requires a typed placement, which the\n * shared instrumentation reads to send one `phone_link_click` per tap; nothing here emits events itself.\n */\nimport Link from 'next/link'\nimport type { ReactNode } from 'react'\nimport type { PhoneCallPlacement } from '../../analytics.js'\nimport { Icon, type UiIconName } from '../icons.js'\nimport { linkPrefetchProps, type LinkPrefetch } from '../prefetch.js'\nimport { slot, type SkinEntry } from '../skin.js'\nimport type { UiPhone } from '../types.js'\n\nfunction isExternal(href: string) {\n  return /^https?:\\/\\//i.test(href)\n}\n\n/** Data hooks and the skin class for an anchor's root. */\ntype AnchorHooks = { readonly className: string | undefined } & Readonly<Record<`data-${string}`, string | undefined>>\n\nfunction Anchor({\n  href,\n  external,\n  prefetch,\n  hooks,\n  children,\n}: {\n  href: string\n  external?: boolean | undefined\n  prefetch?: LinkPrefetch | undefined\n  hooks: AnchorHooks\n  children: ReactNode\n}) {\n  if (external ?? isExternal(href)) {\n    return (\n      <a href={href} target=\"_blank\" rel=\"noopener noreferrer\" {...hooks}>\n        {children}\n      </a>\n    )\n  }\n  return (\n    <Link href={href} {...linkPrefetchProps(prefetch)} {...hooks}>\n      {children}\n    </Link>\n  )\n}\n\nexport type ButtonLinkSlot = 'root' | 'label' | 'icon'\nexport const BUTTON_VARIANTS = ['primary', 'secondary', 'quiet'] as const\nexport type ButtonVariant = (typeof BUTTON_VARIANTS)[number]\nexport type ButtonLinkSkin = SkinEntry<ButtonLinkSlot, ButtonVariant, { size?: 'regular' | 'large' }>\n\nexport interface ButtonLinkProps extends ButtonLinkSkin {\n  readonly href: string\n  readonly children: ReactNode\n  /** An icon after the label (`arrow`) or before it (`phone`). */\n  readonly icon?: UiIconName\n  readonly iconPosition?: 'start' | 'end'\n  /** Force external handling; by default `http(s)://` links are external. */\n  readonly external?: boolean\n  /**\n   * Prefetch by link role (`LINK_PREFETCH_POLICY`): `auto` (the default, Next's prefetch in view) for a main action,\n   * `intent` for an in-content card link, `false` for footer, area, nearby, map and finder links.\n   */\n  readonly prefetch?: LinkPrefetch\n}\n\n/** A link styled as a button. A primary action is at least 44 px tall (structure.css). */\nexport function ButtonLink({ href, children, icon, iconPosition = 'end', external, prefetch, variant = 'primary', layout, classes }: ButtonLinkProps) {\n  const iconNode = icon ? <span {...slot(classes, 'icon')}><Icon name={icon} /></span> : null\n  return (\n    <Anchor\n      href={href}\n      external={external}\n      prefetch={prefetch}\n      hooks={{ 'data-bl': 'button', 'data-variant': variant, 'data-size': layout?.size ?? 'regular', className: classes?.root }}\n    >\n      {iconPosition === 'start' ? iconNode : null}\n      <span {...slot(classes, 'label')}>{children}</span>\n      {iconPosition === 'end' ? iconNode : null}\n    </Anchor>\n  )\n}\n\nexport type TextLinkSlot = 'root'\nexport type TextLinkSkin = SkinEntry<TextLinkSlot, 'inline' | 'standalone'>\n\nexport interface TextLinkProps extends TextLinkSkin {\n  readonly href: string\n  readonly children: ReactNode\n  readonly external?: boolean\n  /**\n   * Prefetch by link role (`LINK_PREFETCH_POLICY`): `auto` (the default, Next's prefetch in view) for a main action,\n   * `intent` for an in-content card link, `false` for footer, area, nearby, map and finder links.\n   */\n  readonly prefetch?: LinkPrefetch\n}\n\n/** An inline or standalone text link. */\nexport function TextLink({ href, children, external, prefetch, variant = 'inline', classes }: TextLinkProps) {\n  return (\n    <Anchor href={href} external={external} prefetch={prefetch} hooks={{ 'data-bl': 'text-link', 'data-variant': variant, className: classes?.root }}>\n      {children}\n    </Anchor>\n  )\n}\n\nexport type PhoneLinkSlot = 'root' | 'icon' | 'label' | 'number'\nexport type PhoneLinkSkin = SkinEntry<PhoneLinkSlot, 'text' | 'button'>\n\nexport interface PhoneLinkProps extends PhoneLinkSkin {\n  readonly phone: UiPhone\n  /** Where the link sits, for `phone_link_click`. Required: a section sets its own. */\n  readonly placement: PhoneCallPlacement\n  /** Optional words before the number, for example \"Call\". The accessible name is always the visible text. */\n  readonly label?: string\n  /** The phone icon on the left (header and hero). */\n  readonly showIcon?: boolean\n}\n\n/**\n * A `tel:` link. Its accessible name is its visible text, which always includes the number (WCAG 2.5.3). Use it for\n * every call link: a literal `tel:` anywhere else fails lint (K1) and C10 checks the href against the evidence file.\n */\nexport function PhoneLink({ phone, placement, label, showIcon = false, variant = 'text', classes }: PhoneLinkProps) {\n  return (\n    <a href={phone.telHref} data-bl=\"phone-link\" data-variant={variant} data-phone-location={placement} className={classes?.root}>\n      {showIcon ? (\n        <span {...slot(classes, 'icon')}>\n          <Icon name=\"phone\" />\n        </span>\n      ) : null}\n      {label ? (\n        <>\n          <span {...slot(classes, 'label')}>{label}</span>{' '}\n        </>\n      ) : null}\n      <span {...slot(classes, 'number')}>{phone.display}</span>\n    </a>\n  )\n}\n"]}
+{"version":3,"file":"links.js","sourceRoot":"","sources":["../../../src/ui-kit/primitives/links.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * Link primitives: `ButtonLink`, `TextLink` and `PhoneLink`. Server components; every link is a real `<a href>`.\n * External links open in a new tab with `rel=\"noopener noreferrer\"`. `PhoneLink` requires a typed placement, which the\n * shared instrumentation reads to send one `phone_link_click` per tap; nothing here emits events itself.\n */\nimport Link from 'next/link'\nimport type { ReactNode } from 'react'\nimport type { PhoneCallPlacement } from '../../analytics.js'\nimport { Icon, type UiIconName } from '../icons.js'\nimport { linkPrefetchProps, type LinkPrefetch } from '../prefetch.js'\nimport { slot, type SkinEntry } from '../skin.js'\nimport type { UiPhone } from '../types.js'\n\nfunction isExternal(href: string) {\n  return /^https?:\\/\\//i.test(href)\n}\n\n/** Data hooks and the skin class for an anchor's root. */\nexport type AnchorHooks = { readonly className?: string | undefined } & Readonly<Record<`data-${string}`, string | undefined>>\n\n/**\n * The one anchor every ui-kit link renders (internal; not exported from the subpath): `next/link` with the prefetch\n * role for internal links, a plain `<a target=\"_blank\" rel=\"noopener noreferrer\">` for external ones.\n */\nexport function Anchor({\n  href,\n  external,\n  prefetch,\n  hooks,\n  children,\n}: {\n  href: string\n  external?: boolean | undefined\n  prefetch?: LinkPrefetch | undefined\n  hooks: AnchorHooks\n  children: ReactNode\n}) {\n  if (external ?? isExternal(href)) {\n    return (\n      <a href={href} target=\"_blank\" rel=\"noopener noreferrer\" {...hooks}>\n        {children}\n      </a>\n    )\n  }\n  return (\n    <Link href={href} {...linkPrefetchProps(prefetch)} {...hooks}>\n      {children}\n    </Link>\n  )\n}\n\nexport type ButtonLinkSlot = 'root' | 'label' | 'icon'\nexport const BUTTON_VARIANTS = ['primary', 'secondary', 'quiet'] as const\nexport type ButtonVariant = (typeof BUTTON_VARIANTS)[number]\nexport type ButtonLinkSkin = SkinEntry<ButtonLinkSlot, ButtonVariant, { size?: 'regular' | 'large' }>\n\nexport interface ButtonLinkProps extends ButtonLinkSkin {\n  readonly href: string\n  readonly children: ReactNode\n  /** An icon after the label (`arrow`) or before it (`phone`). */\n  readonly icon?: UiIconName\n  readonly iconPosition?: 'start' | 'end'\n  /** Force external handling; by default `http(s)://` links are external. */\n  readonly external?: boolean\n  /**\n   * Prefetch by link role (`LINK_PREFETCH_POLICY`): `auto` (the default, Next's prefetch in view) for a main action,\n   * `intent` for an in-content card link, `false` for footer, area, nearby, map and finder links.\n   */\n  readonly prefetch?: LinkPrefetch\n}\n\n/** A link styled as a button. A primary action is at least 44 px tall (structure.css). */\nexport function ButtonLink({ href, children, icon, iconPosition = 'end', external, prefetch, variant = 'primary', layout, classes }: ButtonLinkProps) {\n  const iconNode = icon ? <span {...slot(classes, 'icon')}><Icon name={icon} /></span> : null\n  return (\n    <Anchor\n      href={href}\n      external={external}\n      prefetch={prefetch}\n      hooks={{ 'data-bl': 'button', 'data-variant': variant, 'data-size': layout?.size ?? 'regular', className: classes?.root }}\n    >\n      {iconPosition === 'start' ? iconNode : null}\n      <span {...slot(classes, 'label')}>{children}</span>\n      {iconPosition === 'end' ? iconNode : null}\n    </Anchor>\n  )\n}\n\nexport type TextLinkSlot = 'root'\nexport type TextLinkSkin = SkinEntry<TextLinkSlot, 'inline' | 'standalone'>\n\nexport interface TextLinkProps extends TextLinkSkin {\n  readonly href: string\n  readonly children: ReactNode\n  readonly external?: boolean\n  /**\n   * Prefetch by link role (`LINK_PREFETCH_POLICY`): `auto` (the default, Next's prefetch in view) for a main action,\n   * `intent` for an in-content card link, `false` for footer, area, nearby, map and finder links.\n   */\n  readonly prefetch?: LinkPrefetch\n}\n\n/** An inline or standalone text link. */\nexport function TextLink({ href, children, external, prefetch, variant = 'inline', classes }: TextLinkProps) {\n  return (\n    <Anchor href={href} external={external} prefetch={prefetch} hooks={{ 'data-bl': 'text-link', 'data-variant': variant, className: classes?.root }}>\n      {children}\n    </Anchor>\n  )\n}\n\nexport type PhoneLinkSlot = 'root' | 'icon' | 'label' | 'number'\nexport type PhoneLinkSkin = SkinEntry<PhoneLinkSlot, 'text' | 'button'>\n\nexport interface PhoneLinkProps extends PhoneLinkSkin {\n  readonly phone: UiPhone\n  /** Where the link sits, for `phone_link_click`. Required: a section sets its own. */\n  readonly placement: PhoneCallPlacement\n  /** Optional words before the number, for example \"Call\". The accessible name is always the visible text. */\n  readonly label?: string\n  /** The phone icon on the left (header and hero). */\n  readonly showIcon?: boolean\n}\n\n/**\n * A `tel:` link. Its accessible name is its visible text, which always includes the number (WCAG 2.5.3). Use it for\n * every call link: a literal `tel:` anywhere else fails lint (K1) and C10 checks the href against the evidence file.\n */\nexport function PhoneLink({ phone, placement, label, showIcon = false, variant = 'text', classes }: PhoneLinkProps) {\n  return (\n    <a href={phone.telHref} data-bl=\"phone-link\" data-variant={variant} data-phone-location={placement} className={classes?.root}>\n      {showIcon ? (\n        <span {...slot(classes, 'icon')}>\n          <Icon name=\"phone\" />\n        </span>\n      ) : null}\n      {label ? (\n        <>\n          <span {...slot(classes, 'label')}>{label}</span>{' '}\n        </>\n      ) : null}\n      <span {...slot(classes, 'number')}>{phone.display}</span>\n    </a>\n  )\n}\n"]}

package/dist/ui-kit/primitives/lists.d.ts

@@ -0,0 +1,43 @@
+import type { LinkPrefetch } from '../prefetch.js';
+import type { RepeatedSlotOf } from '../repeated-slots.js';
+import { type SkinEntry } from '../skin.js';
+import type { UiLink } from '../types.js';
+/** One checklist entry: the fact, and optionally where to check it. */
+export type TickItem = string | {
+    readonly text: string;
+    readonly link?: UiLink;
+};
+export type TickListSlot = 'root' | RepeatedSlotOf<'tickList'>;
+export type TickListRepeatedSlot = RepeatedSlotOf<'tickList'>;
+export interface TickListLayout {
+    /** One column (the default) or two, from the phone breakpoint up. */
+    readonly columns?: 1 | 2;
+    /**
+     * The tick: `icon` (the default) is the sprite's check; `rule` ships no svg, only an empty decorative element the
+     * stylesheet draws as a short rule (`data-tick="rule"` on the list), about 120 bytes less a fact.
+     */
+    readonly tick?: 'icon' | 'rule';
+}
+export type TickListSkin = SkinEntry<TickListSlot, never, TickListLayout, TickListRepeatedSlot>;
+export interface TickListProps extends TickListSkin {
+    readonly items: readonly TickItem[];
+}
+export declare function TickList({ items, layout, classes }: TickListProps): import("react/jsx-runtime").JSX.Element | null;
+/** The `data-bl-links` roles W2 reads: links in these lists never prefetch. */
+export declare const LINK_LIST_KINDS: readonly ["area", "nearby", "map", "finder", "other-services"];
+export type LinkListKind = (typeof LINK_LIST_KINDS)[number];
+export type LinkListSlot = 'root';
+export interface LinkListLayout {
+    /** Columns at the widest width (default 3); phones show one, then two. */
+    readonly columns?: 1 | 2 | 3 | 4;
+}
+export type LinkListSkin = SkinEntry<LinkListSlot, never, LinkListLayout>;
+export interface LinkListProps extends LinkListSkin {
+    readonly links: readonly UiLink[];
+    /** What the list holds, rendered as `data-bl-links` for W2. Leave it out for a list of other destinations. */
+    readonly kind?: LinkListKind;
+    /** Off by default; `intent` only for a short list of in-content destinations. */
+    readonly prefetch?: Exclude<LinkPrefetch, 'auto'>;
+}
+export declare function LinkList({ links, kind, prefetch, layout, classes }: LinkListProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=lists.d.ts.map

package/dist/ui-kit/primitives/lists.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"lists.d.ts","sourceRoot":"","sources":["../../../src/ui-kit/primitives/lists.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAClD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC1D,OAAO,EAAgB,KAAK,SAAS,EAAE,MAAM,YAAY,CAAA;AACzD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAGzC,uEAAuE;AACvE,MAAM,MAAM,QAAQ,GAAG,MAAM,GAAG;IAAE,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,CAAA;AAEjF,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,cAAc,CAAC,UAAU,CAAC,CAAA;AAC9D,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,UAAU,CAAC,CAAA;AAC7D,MAAM,WAAW,cAAc;IAC7B,qEAAqE;IACrE,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,CAAA;IACxB;;;OAGG;IACH,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAChC;AACD,MAAM,MAAM,YAAY,GAAG,SAAS,CAAC,YAAY,EAAE,KAAK,EAAE,cAAc,EAAE,oBAAoB,CAAC,CAAA;AAE/F,MAAM,WAAW,aAAc,SAAQ,YAAY;IACjD,QAAQ,CAAC,KAAK,EAAE,SAAS,QAAQ,EAAE,CAAA;CACpC;AAID,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,aAAa,kDAkCjE;AAED,+EAA+E;AAC/E,eAAO,MAAM,eAAe,gEAAiE,CAAA;AAC7F,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,CAAA;AAE3D,MAAM,MAAM,YAAY,GAAG,MAAM,CAAA;AACjC,MAAM,WAAW,cAAc;IAC7B,0EAA0E;IAC1E,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;CACjC;AACD,MAAM,MAAM,YAAY,GAAG,SAAS,CAAC,YAAY,EAAE,KAAK,EAAE,cAAc,CAAC,CAAA;AAEzE,MAAM,WAAW,aAAc,SAAQ,YAAY;IACjD,QAAQ,CAAC,KAAK,EAAE,SAAS,MAAM,EAAE,CAAA;IACjC,8GAA8G;IAC9G,QAAQ,CAAC,IAAI,CAAC,EAAE,YAAY,CAAA;IAC5B,iFAAiF;IACjF,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC,YAAY,EAAE,MAAM,CAAC,CAAA;CAClD;AAED,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,QAAgB,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,aAAa,kDAazF"}

package/dist/ui-kit/primitives/lists.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * `TickList` and `LinkList` (3.14.0). Server components; both are a real `<ul>`.
+ *
+ * `TickList`: verified facts or the scope of a service, each after a decorative tick (the check icon, or a ruled mark
+ * with `layout.tick: 'rule'`). One or two columns; the hero's trust checklist uses two (Romie, Prestige and Sydney
+ * Waterproofing). An item may end with a link to where the fact can be checked, for example the licence register.
+ *
+ * `LinkList`: a ruled list of destinations (AA's `RuledLinkList`): service areas, nearby suburbs, other services. Lean
+ * by design (cost item 1f): each entry is a plain `<li><a>` with no class, hook or icon, so a 120-suburb hub stays near
+ * 120 bytes a link; a skin draws rules and arrows from `src/site/skin.css`. Its links never prefetch (area and nearby
+ * lists are `false` in `LINK_PREFETCH_POLICY`), and `kind` marks the list for W2 (`data-bl-links`).
+ */
+import { Icon } from '../icons.js';
+import { repeatedSlot } from '../skin.js';
+import { Anchor } from './links.js';
+const itemText = (item) => (typeof item === 'string' ? item : item.text);
+export function TickList({ items, layout, classes }) {
+    if (items.length === 0)
+        return null;
+    const rule = layout?.tick === 'rule';
+    return (_jsx("ul", { role: "list", "data-bl": "tick-list", "data-columns": String(layout?.columns ?? 1), "data-tick": rule ? 'rule' : undefined, className: classes?.root, children: items.map((item) => {
+            const link = typeof item === 'string' ? undefined : item.link;
+            return (_jsxs("li", { ...repeatedSlot('item'), children: [_jsx("span", { ...repeatedSlot('tick'), "aria-hidden": "true", children: rule ? null : _jsx(Icon, { name: "check" }) }), _jsxs("span", { ...repeatedSlot('text'), children: [itemText(item), link ? (_jsxs(_Fragment, { children: [' ', _jsx(Anchor, { href: link.href, prefetch: false, hooks: { 'data-slot': 'link' }, children: link.label })] })) : null] })] }, itemText(item)));
+        }) }));
+}
+/** The `data-bl-links` roles W2 reads: links in these lists never prefetch. */
+export const LINK_LIST_KINDS = ['area', 'nearby', 'map', 'finder', 'other-services'];
+export function LinkList({ links, kind, prefetch = false, layout, classes }) {
+    if (links.length === 0)
+        return null;
+    return (_jsx("ul", { role: "list", "data-bl": "link-list", "data-columns": String(layout?.columns ?? 3), "data-bl-links": kind, className: classes?.root, children: links.map((link) => (_jsx("li", { children: _jsx(Anchor, { href: link.href, prefetch: prefetch, hooks: {}, children: link.label }) }, link.href))) }));
+}
+//# sourceMappingURL=lists.js.map

package/dist/ui-kit/primitives/lists.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"lists.js","sourceRoot":"","sources":["../../../src/ui-kit/primitives/lists.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;GAWG;AACH,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAA;AAGlC,OAAO,EAAE,YAAY,EAAkB,MAAM,YAAY,CAAA;AAEzD,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AAsBnC,MAAM,QAAQ,GAAG,CAAC,IAAc,EAAE,EAAE,CAAC,CAAC,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;AAElF,MAAM,UAAU,QAAQ,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAiB;IAChE,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,IAAI,CAAA;IACnC,MAAM,IAAI,GAAG,MAAM,EAAE,IAAI,KAAK,MAAM,CAAA;IACpC,OAAO,CACL,aACE,IAAI,EAAC,MAAM,aACH,WAAW,kBACL,MAAM,CAAC,MAAM,EAAE,OAAO,IAAI,CAAC,CAAC,eAC/B,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EACpC,SAAS,EAAE,OAAO,EAAE,IAAI,YAEvB,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;YAClB,MAAM,IAAI,GAAG,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAA;YAC7D,OAAO,CACL,iBAA6B,YAAY,CAAC,MAAM,CAAC,aAC/C,kBAAU,YAAY,CAAC,MAAM,CAAC,iBAAc,MAAM,YAC/C,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GAC/B,EACP,mBAAU,YAAY,CAAC,MAAM,CAAC,aAC3B,QAAQ,CAAC,IAAI,CAAC,EACd,IAAI,CAAC,CAAC,CAAC,CACN,8BACG,GAAG,EACJ,KAAC,MAAM,IAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,EAAE,YACrE,IAAI,CAAC,KAAK,GACJ,IACR,CACJ,CAAC,CAAC,CAAC,IAAI,IACH,KAdA,QAAQ,CAAC,IAAI,CAAC,CAelB,CACN,CAAA;QACH,CAAC,CAAC,GACC,CACN,CAAA;AACH,CAAC;AAED,+EAA+E;AAC/E,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,gBAAgB,CAAU,CAAA;AAkB7F,MAAM,UAAU,QAAQ,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,GAAG,KAAK,EAAE,MAAM,EAAE,OAAO,EAAiB;IACxF,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,IAAI,CAAA;IACnC,OAAO,CACL,aAAI,IAAI,EAAC,MAAM,aAAS,WAAW,kBAAe,MAAM,CAAC,MAAM,EAAE,OAAO,IAAI,CAAC,CAAC,mBAAiB,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,YAC1H,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACnB,uBACE,KAAC,MAAM,IAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,YACnD,IAAI,CAAC,KAAK,GACJ,IAHF,IAAI,CAAC,IAAI,CAIb,CACN,CAAC,GACC,CACN,CAAA;AACH,CAAC","sourcesContent":["/**\n * `TickList` and `LinkList` (3.14.0). Server components; both are a real `<ul>`.\n *\n * `TickList`: verified facts or the scope of a service, each after a decorative tick (the check icon, or a ruled mark\n * with `layout.tick: 'rule'`). One or two columns; the hero's trust checklist uses two (Romie, Prestige and Sydney\n * Waterproofing). An item may end with a link to where the fact can be checked, for example the licence register.\n *\n * `LinkList`: a ruled list of destinations (AA's `RuledLinkList`): service areas, nearby suburbs, other services. Lean\n * by design (cost item 1f): each entry is a plain `<li><a>` with no class, hook or icon, so a 120-suburb hub stays near\n * 120 bytes a link; a skin draws rules and arrows from `src/site/skin.css`. Its links never prefetch (area and nearby\n * lists are `false` in `LINK_PREFETCH_POLICY`), and `kind` marks the list for W2 (`data-bl-links`).\n */\nimport { Icon } from '../icons.js'\nimport type { LinkPrefetch } from '../prefetch.js'\nimport type { RepeatedSlotOf } from '../repeated-slots.js'\nimport { repeatedSlot, type SkinEntry } from '../skin.js'\nimport type { UiLink } from '../types.js'\nimport { Anchor } from './links.js'\n\n/** One checklist entry: the fact, and optionally where to check it. */\nexport type TickItem = string | { readonly text: string; readonly link?: UiLink }\n\nexport type TickListSlot = 'root' | RepeatedSlotOf<'tickList'>\nexport type TickListRepeatedSlot = RepeatedSlotOf<'tickList'>\nexport interface TickListLayout {\n  /** One column (the default) or two, from the phone breakpoint up. */\n  readonly columns?: 1 | 2\n  /**\n   * The tick: `icon` (the default) is the sprite's check; `rule` ships no svg, only an empty decorative element the\n   * stylesheet draws as a short rule (`data-tick=\"rule\"` on the list), about 120 bytes less a fact.\n   */\n  readonly tick?: 'icon' | 'rule'\n}\nexport type TickListSkin = SkinEntry<TickListSlot, never, TickListLayout, TickListRepeatedSlot>\n\nexport interface TickListProps extends TickListSkin {\n  readonly items: readonly TickItem[]\n}\n\nconst itemText = (item: TickItem) => (typeof item === 'string' ? item : item.text)\n\nexport function TickList({ items, layout, classes }: TickListProps) {\n  if (items.length === 0) return null\n  const rule = layout?.tick === 'rule'\n  return (\n    <ul\n      role=\"list\"\n      data-bl=\"tick-list\"\n      data-columns={String(layout?.columns ?? 1)}\n      data-tick={rule ? 'rule' : undefined}\n      className={classes?.root}\n    >\n      {items.map((item) => {\n        const link = typeof item === 'string' ? undefined : item.link\n        return (\n          <li key={itemText(item)} {...repeatedSlot('item')}>\n            <span {...repeatedSlot('tick')} aria-hidden=\"true\">\n              {rule ? null : <Icon name=\"check\" />}\n            </span>\n            <span {...repeatedSlot('text')}>\n              {itemText(item)}\n              {link ? (\n                <>\n                  {' '}\n                  <Anchor href={link.href} prefetch={false} hooks={{ 'data-slot': 'link' }}>\n                    {link.label}\n                  </Anchor>\n                </>\n              ) : null}\n            </span>\n          </li>\n        )\n      })}\n    </ul>\n  )\n}\n\n/** The `data-bl-links` roles W2 reads: links in these lists never prefetch. */\nexport const LINK_LIST_KINDS = ['area', 'nearby', 'map', 'finder', 'other-services'] as const\nexport type LinkListKind = (typeof LINK_LIST_KINDS)[number]\n\nexport type LinkListSlot = 'root'\nexport interface LinkListLayout {\n  /** Columns at the widest width (default 3); phones show one, then two. */\n  readonly columns?: 1 | 2 | 3 | 4\n}\nexport type LinkListSkin = SkinEntry<LinkListSlot, never, LinkListLayout>\n\nexport interface LinkListProps extends LinkListSkin {\n  readonly links: readonly UiLink[]\n  /** What the list holds, rendered as `data-bl-links` for W2. Leave it out for a list of other destinations. */\n  readonly kind?: LinkListKind\n  /** Off by default; `intent` only for a short list of in-content destinations. */\n  readonly prefetch?: Exclude<LinkPrefetch, 'auto'>\n}\n\nexport function LinkList({ links, kind, prefetch = false, layout, classes }: LinkListProps) {\n  if (links.length === 0) return null\n  return (\n    <ul role=\"list\" data-bl=\"link-list\" data-columns={String(layout?.columns ?? 3)} data-bl-links={kind} className={classes?.root}>\n      {links.map((link) => (\n        <li key={link.href}>\n          <Anchor href={link.href} prefetch={prefetch} hooks={{}}>\n            {link.label}\n          </Anchor>\n        </li>\n      ))}\n    </ul>\n  )\n}\n"]}

package/dist/ui-kit/primitives/media-frame.d.ts

@@ -0,0 +1,28 @@
+import type { ReactNode } from 'react';
+import { type BrandlabMediaEntry, type BrandlabMediaRatio } from '@brandlab-digital/site-core/media';
+import { type SkinEntry } from '../skin.js';
+/** What a frame needs from a `media.ts` entry; a whole `BrandlabMediaEntry` fits. */
+export type UiMedia = Pick<BrandlabMediaEntry, 'src' | 'width' | 'height' | 'alt' | 'provenance'> & Partial<Pick<BrandlabMediaEntry, 'decorative' | 'focalPoint'>>;
+export type MediaFrameSlot = 'root' | 'img' | 'caption' | 'label';
+export type MediaFrameSkin = SkinEntry<MediaFrameSlot>;
+/** The locked visible label on an AI image (F13; truth wording, not site copy). */
+export declare const ILLUSTRATION_LABEL = "Illustration";
+/** Exactly one sizing: `sizes` with a `vw` part for a fluid image, or `displayWidth` for a fixed-size one. */
+export type MediaFrameSizing = {
+    readonly sizes: string;
+    readonly displayWidth?: never;
+} | {
+    readonly displayWidth: number;
+    readonly sizes?: never;
+};
+export type MediaFrameProps = MediaFrameSkin & MediaFrameSizing & {
+    readonly media: UiMedia;
+    /** Crop to an allowed ratio; by default the frame keeps the image's own shape. */
+    readonly ratio?: BrandlabMediaRatio;
+    /** "{what}, {suburb}, {month year}", only when the photo really shows that job. */
+    readonly caption?: ReactNode;
+    /** The page's largest image: preloaded, high fetch priority, never lazy. */
+    readonly priority?: boolean;
+};
+export declare function MediaFrame(props: MediaFrameProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=media-frame.d.ts.map

package/dist/ui-kit/primitives/media-frame.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"media-frame.d.ts","sourceRoot":"","sources":["../../../src/ui-kit/primitives/media-frame.tsx"],"names":[],"mappings":"AAmBA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,EAAyB,KAAK,kBAAkB,EAAE,KAAK,kBAAkB,EAAE,MAAM,mCAAmC,CAAA;AAC3H,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,YAAY,CAAA;AAEjD,qFAAqF;AACrF,MAAM,MAAM,OAAO,GAAG,IAAI,CAAC,kBAAkB,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,YAAY,CAAC,GAC/F,OAAO,CAAC,IAAI,CAAC,kBAAkB,EAAE,YAAY,GAAG,YAAY,CAAC,CAAC,CAAA;AAEhE,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,KAAK,GAAG,SAAS,GAAG,OAAO,CAAA;AACjE,MAAM,MAAM,cAAc,GAAG,SAAS,CAAC,cAAc,CAAC,CAAA;AAEtD,mFAAmF;AACnF,eAAO,MAAM,kBAAkB,iBAAiB,CAAA;AAEhD,8GAA8G;AAC9G,MAAM,MAAM,gBAAgB,GACxB;IAAE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,YAAY,CAAC,EAAE,KAAK,CAAA;CAAE,GACzD;IAAE,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,KAAK,CAAA;CAAE,CAAA;AAE7D,MAAM,MAAM,eAAe,GAAG,cAAc,GAC1C,gBAAgB,GAAG;IACjB,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAA;IACvB,kFAAkF;IAClF,QAAQ,CAAC,KAAK,CAAC,EAAE,kBAAkB,CAAA;IACnC,mFAAmF;IACnF,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,CAAA;IAC5B,4EAA4E;IAC5E,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAC5B,CAAA;AAUH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CAqDhD"}

package/dist/ui-kit/primitives/media-frame.js

@@ -0,0 +1,58 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * `MediaFrame` (3.14.0, F13): one image from the site's media manifest in a frame of an allowed ratio. Server
+ * component over `next/image`, and the library's one image path: `Media` and the hero render through it, so the
+ * "Illustration" label and the sizing rule below live here only. It is provenance-aware: the root carries
+ * `data-provenance`, and an AI image shows the locked visible label "Illustration" inside the `<figcaption>`, so the
+ * figure's accessible caption names it an illustration too. A caption ("{what}, {suburb}, {month year}") or the label
+ * makes the root a `<figure>`; otherwise it is a `<div>`.
+ *
+ * Sizing (cost item 1g) is one of two kinds, and the type takes exactly one:
+ * - **fluid** (`sizes`, which must have a `vw` part, for example `(min-width: 1024px) 50vw, 100vw`): Next keeps only the
+ *   widths the layout can use.
+ * - **fixed** (`displayWidth`, the CSS width in pixels): no `sizes` at all, so Next emits a 1x and a 2x candidate only.
+ *   A `sizes` without `vw` (for example `sizes="148px"`) makes Next list all 16 widths, which was 28–30% of some pages'
+ *   HTML; it is refused here.
+ *
+ * `priority` is for the page's largest image (the hero): preloaded and fetched with high priority, never lazy. Every
+ * other image loads lazily.
+ */
+import Image from 'next/image';
+import { BRANDLAB_MEDIA_RATIOS } from '@brandlab-digital/site-core/media';
+import { slot } from '../skin.js';
+/** The locked visible label on an AI image (F13; truth wording, not site copy). */
+export const ILLUSTRATION_LABEL = 'Illustration';
+/** Next's own test for a `vw` part in `sizes` (shared/lib/get-img-props). */
+const VIEWPORT_WIDTH = /(^|\s)(1?\d?\d)vw/;
+function ratioOf(ratio) {
+    const [width, height] = ratio.split(':').map(Number);
+    return height / width;
+}
+export function MediaFrame(props) {
+    const { media, ratio, caption, priority = false, classes } = props;
+    if (ratio !== undefined && !BRANDLAB_MEDIA_RATIOS.includes(ratio)) {
+        throw new Error(`MediaFrame ${media.src}: ratio "${ratio}" is not one of ${BRANDLAB_MEDIA_RATIOS.join(', ')}.`);
+    }
+    let width = media.width;
+    let height = media.height;
+    let sizes;
+    if (props.sizes !== undefined) {
+        if (!VIEWPORT_WIDTH.test(props.sizes)) {
+            throw new Error(`MediaFrame ${media.src}: sizes "${props.sizes}" has no vw part, so Next would list every width. Give a fluid image a vw size, or a fixed-size image its displayWidth instead.`);
+        }
+        sizes = props.sizes;
+    }
+    else {
+        if (!Number.isInteger(props.displayWidth) || props.displayWidth <= 0) {
+            throw new Error(`MediaFrame ${media.src}: displayWidth must be the image's CSS width in whole pixels.`);
+        }
+        width = props.displayWidth;
+        height = Math.round(props.displayWidth * (ratio ? ratioOf(ratio) : media.height / media.width));
+    }
+    const illustration = media.provenance === 'illustrative-ai';
+    const hasCaption = caption !== undefined && caption !== null && caption !== '';
+    const Root = illustration || hasCaption ? 'figure' : 'div';
+    const focal = media.focalPoint ? { objectPosition: `${media.focalPoint.x}% ${media.focalPoint.y}%` } : undefined;
+    return (_jsxs(Root, { "data-bl": "media", "data-ratio": ratio, "data-fit": sizes ? 'fluid' : 'fixed', "data-provenance": media.provenance, className: classes?.root, children: [_jsx(Image, { src: media.src, alt: media.decorative ? '' : media.alt, width: width, height: height, sizes: sizes, style: focal, ...(priority ? { preload: true, fetchPriority: 'high' } : { loading: 'lazy' }), ...slot(classes, 'img') }), illustration || hasCaption ? (_jsxs("figcaption", { ...slot(classes, 'caption'), children: [illustration ? _jsx("span", { ...slot(classes, 'label'), children: ILLUSTRATION_LABEL }) : null, illustration && hasCaption ? ' ' : null, hasCaption ? caption : null] })) : null] }));
+}
+//# sourceMappingURL=media-frame.js.map

package/dist/ui-kit/primitives/media-frame.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"media-frame.js","sourceRoot":"","sources":["../../../src/ui-kit/primitives/media-frame.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH,OAAO,KAAK,MAAM,YAAY,CAAA;AAE9B,OAAO,EAAE,qBAAqB,EAAoD,MAAM,mCAAmC,CAAA;AAC3H,OAAO,EAAE,IAAI,EAAkB,MAAM,YAAY,CAAA;AASjD,mFAAmF;AACnF,MAAM,CAAC,MAAM,kBAAkB,GAAG,cAAc,CAAA;AAkBhD,6EAA6E;AAC7E,MAAM,cAAc,GAAG,mBAAmB,CAAA;AAE1C,SAAS,OAAO,CAAC,KAAyB;IACxC,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,MAAM,CAAqB,CAAA;IACxE,OAAO,MAAM,GAAG,KAAK,CAAA;AACvB,CAAC;AAED,MAAM,UAAU,UAAU,CAAC,KAAsB;IAC/C,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,GAAG,KAAK,EAAE,OAAO,EAAE,GAAG,KAAK,CAAA;IAClE,IAAI,KAAK,KAAK,SAAS,IAAI,CAAE,qBAA2C,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC;QACzF,MAAM,IAAI,KAAK,CAAC,cAAc,KAAK,CAAC,GAAG,YAAY,KAAK,mBAAmB,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;IACjH,CAAC;IACD,IAAI,KAAK,GAAG,KAAK,CAAC,KAAK,CAAA;IACvB,IAAI,MAAM,GAAG,KAAK,CAAC,MAAM,CAAA;IACzB,IAAI,KAAyB,CAAA;IAC7B,IAAI,KAAK,CAAC,KAAK,KAAK,SAAS,EAAE,CAAC;QAC9B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;YACtC,MAAM,IAAI,KAAK,CACb,cAAc,KAAK,CAAC,GAAG,YAAY,KAAK,CAAC,KAAK,iIAAiI,CAChL,CAAA;QACH,CAAC;QACD,KAAK,GAAG,KAAK,CAAC,KAAK,CAAA;IACrB,CAAC;SAAM,CAAC;QACN,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,YAAY,CAAC,IAAI,KAAK,CAAC,YAAY,IAAI,CAAC,EAAE,CAAC;YACrE,MAAM,IAAI,KAAK,CAAC,cAAc,KAAK,CAAC,GAAG,+DAA+D,CAAC,CAAA;QACzG,CAAC;QACD,KAAK,GAAG,KAAK,CAAC,YAAY,CAAA;QAC1B,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,YAAY,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAA;IACjG,CAAC;IACD,MAAM,YAAY,GAAG,KAAK,CAAC,UAAU,KAAK,iBAAiB,CAAA;IAC3D,MAAM,UAAU,GAAG,OAAO,KAAK,SAAS,IAAI,OAAO,KAAK,IAAI,IAAI,OAAO,KAAK,EAAE,CAAA;IAC9E,MAAM,IAAI,GAAG,YAAY,IAAI,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAA;IAC1D,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,KAAK,KAAK,CAAC,UAAU,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,SAAS,CAAA;IAChH,OAAO,CACL,MAAC,IAAI,eACK,OAAO,gBACH,KAAK,cACP,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,qBAClB,KAAK,CAAC,UAAU,EACjC,SAAS,EAAE,OAAO,EAAE,IAAI,aAExB,KAAC,KAAK,IACJ,GAAG,EAAE,KAAK,CAAC,GAAG,EACd,GAAG,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,EACtC,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,KACR,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,aAAa,EAAE,MAAe,EAAE,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,MAAe,EAAE,CAAC,KAC7F,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,GACxB,EACD,YAAY,IAAI,UAAU,CAAC,CAAC,CAAC,CAC5B,yBAAgB,IAAI,CAAC,OAAO,EAAE,SAAS,CAAC,aACrC,YAAY,CAAC,CAAC,CAAC,kBAAU,IAAI,CAAC,OAAO,EAAE,OAAO,CAAC,YAAG,kBAAkB,GAAQ,CAAC,CAAC,CAAC,IAAI,EACnF,YAAY,IAAI,UAAU,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,EACvC,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,IACjB,CACd,CAAC,CAAC,CAAC,IAAI,IACH,CACR,CAAA;AACH,CAAC","sourcesContent":["/**\n * `MediaFrame` (3.14.0, F13): one image from the site's media manifest in a frame of an allowed ratio. Server\n * component over `next/image`, and the library's one image path: `Media` and the hero render through it, so the\n * \"Illustration\" label and the sizing rule below live here only. It is provenance-aware: the root carries\n * `data-provenance`, and an AI image shows the locked visible label \"Illustration\" inside the `<figcaption>`, so the\n * figure's accessible caption names it an illustration too. A caption (\"{what}, {suburb}, {month year}\") or the label\n * makes the root a `<figure>`; otherwise it is a `<div>`.\n *\n * Sizing (cost item 1g) is one of two kinds, and the type takes exactly one:\n * - **fluid** (`sizes`, which must have a `vw` part, for example `(min-width: 1024px) 50vw, 100vw`): Next keeps only the\n *   widths the layout can use.\n * - **fixed** (`displayWidth`, the CSS width in pixels): no `sizes` at all, so Next emits a 1x and a 2x candidate only.\n *   A `sizes` without `vw` (for example `sizes=\"148px\"`) makes Next list all 16 widths, which was 28–30% of some pages'\n *   HTML; it is refused here.\n *\n * `priority` is for the page's largest image (the hero): preloaded and fetched with high priority, never lazy. Every\n * other image loads lazily.\n */\nimport Image from 'next/image'\nimport type { ReactNode } from 'react'\nimport { BRANDLAB_MEDIA_RATIOS, type BrandlabMediaEntry, type BrandlabMediaRatio } from '@brandlab-digital/site-core/media'\nimport { slot, type SkinEntry } from '../skin.js'\n\n/** What a frame needs from a `media.ts` entry; a whole `BrandlabMediaEntry` fits. */\nexport type UiMedia = Pick<BrandlabMediaEntry, 'src' | 'width' | 'height' | 'alt' | 'provenance'> &\n  Partial<Pick<BrandlabMediaEntry, 'decorative' | 'focalPoint'>>\n\nexport type MediaFrameSlot = 'root' | 'img' | 'caption' | 'label'\nexport type MediaFrameSkin = SkinEntry<MediaFrameSlot>\n\n/** The locked visible label on an AI image (F13; truth wording, not site copy). */\nexport const ILLUSTRATION_LABEL = 'Illustration'\n\n/** Exactly one sizing: `sizes` with a `vw` part for a fluid image, or `displayWidth` for a fixed-size one. */\nexport type MediaFrameSizing =\n  | { readonly sizes: string; readonly displayWidth?: never }\n  | { readonly displayWidth: number; readonly sizes?: never }\n\nexport type MediaFrameProps = MediaFrameSkin &\n  MediaFrameSizing & {\n    readonly media: UiMedia\n    /** Crop to an allowed ratio; by default the frame keeps the image's own shape. */\n    readonly ratio?: BrandlabMediaRatio\n    /** \"{what}, {suburb}, {month year}\", only when the photo really shows that job. */\n    readonly caption?: ReactNode\n    /** The page's largest image: preloaded, high fetch priority, never lazy. */\n    readonly priority?: boolean\n  }\n\n/** Next's own test for a `vw` part in `sizes` (shared/lib/get-img-props). */\nconst VIEWPORT_WIDTH = /(^|\\s)(1?\\d?\\d)vw/\n\nfunction ratioOf(ratio: BrandlabMediaRatio): number {\n  const [width, height] = ratio.split(':').map(Number) as [number, number]\n  return height / width\n}\n\nexport function MediaFrame(props: MediaFrameProps) {\n  const { media, ratio, caption, priority = false, classes } = props\n  if (ratio !== undefined && !(BRANDLAB_MEDIA_RATIOS as readonly string[]).includes(ratio)) {\n    throw new Error(`MediaFrame ${media.src}: ratio \"${ratio}\" is not one of ${BRANDLAB_MEDIA_RATIOS.join(', ')}.`)\n  }\n  let width = media.width\n  let height = media.height\n  let sizes: string | undefined\n  if (props.sizes !== undefined) {\n    if (!VIEWPORT_WIDTH.test(props.sizes)) {\n      throw new Error(\n        `MediaFrame ${media.src}: sizes \"${props.sizes}\" has no vw part, so Next would list every width. Give a fluid image a vw size, or a fixed-size image its displayWidth instead.`,\n      )\n    }\n    sizes = props.sizes\n  } else {\n    if (!Number.isInteger(props.displayWidth) || props.displayWidth <= 0) {\n      throw new Error(`MediaFrame ${media.src}: displayWidth must be the image's CSS width in whole pixels.`)\n    }\n    width = props.displayWidth\n    height = Math.round(props.displayWidth * (ratio ? ratioOf(ratio) : media.height / media.width))\n  }\n  const illustration = media.provenance === 'illustrative-ai'\n  const hasCaption = caption !== undefined && caption !== null && caption !== ''\n  const Root = illustration || hasCaption ? 'figure' : 'div'\n  const focal = media.focalPoint ? { objectPosition: `${media.focalPoint.x}% ${media.focalPoint.y}%` } : undefined\n  return (\n    <Root\n      data-bl=\"media\"\n      data-ratio={ratio}\n      data-fit={sizes ? 'fluid' : 'fixed'}\n      data-provenance={media.provenance}\n      className={classes?.root}\n    >\n      <Image\n        src={media.src}\n        alt={media.decorative ? '' : media.alt}\n        width={width}\n        height={height}\n        sizes={sizes}\n        style={focal}\n        {...(priority ? { preload: true, fetchPriority: 'high' as const } : { loading: 'lazy' as const })}\n        {...slot(classes, 'img')}\n      />\n      {illustration || hasCaption ? (\n        <figcaption {...slot(classes, 'caption')}>\n          {illustration ? <span {...slot(classes, 'label')}>{ILLUSTRATION_LABEL}</span> : null}\n          {illustration && hasCaption ? ' ' : null}\n          {hasCaption ? caption : null}\n        </figcaption>\n      ) : null}\n    </Root>\n  )\n}\n"]}

package/dist/ui-kit/primitives/media.d.ts

@@ -0,0 +1,38 @@
+/**
+ * `Media` (F13, 3.14.0): one image from the site's media manifest (`src/data/media.ts`, `defineMedia`), rendered through
+ * `MediaFrame`, the library's one image path. Server component. It takes a skin entry with `layout.ratio`, which the
+ * services grid uses for its photos; everything else (provenance, the locked "Illustration" label, the focal point
+ * and the sizing rule) is `MediaFrame`'s.
+ *
+ * - `sizes` is required. A number is a fixed CSS width (logos, avatars, thumbnails, the header's featured image): it
+ *   becomes `MediaFrame`'s `displayWidth`, so the image renders no `sizes` and Next emits only the 1x and 2x candidates
+ *   (cost item 1g). A string is a fluid `sizes` value and must have a `vw` part.
+ * - `preload` is for the page's main (hero) image only: preloaded at high priority and never lazy.
+ * - `layout.ratio` crops to one of the allowed ratios, keeping the entry's focal point in view.
+ */
+import type { ReactNode } from 'react';
+import type { BrandlabMediaEntry, BrandlabMediaRatio } from '@brandlab-digital/site-core/media';
+import type { SkinEntry } from '../skin.js';
+export type MediaSlot = 'root' | 'img' | 'caption' | 'label';
+export interface MediaLayout {
+    /** Crop to one of the allowed ratios (16:9, 4:5, 4:3, 3:2). Left out, the image keeps its own shape. */
+    readonly ratio?: BrandlabMediaRatio;
+}
+export type MediaSkin = SkinEntry<MediaSlot, never, MediaLayout>;
+/** The visible label on an AI image (F13). Locked: a site can't rename or hide it. The same value as `ILLUSTRATION_LABEL`. */
+export declare const MEDIA_ILLUSTRATION_LABEL = "Illustration";
+export interface MediaProps extends MediaSkin {
+    /** The manifest entry, for example `media['castle-hill-gum-removal']`. */
+    readonly media: BrandlabMediaEntry;
+    /**
+     * The rendered width: a whole number of CSS pixels for a fixed-size image (no `sizes`, so 1x and 2x only), or a
+     * fluid `sizes` string with a `vw` part such as `(min-width: 1024px) 50vw, 100vw`.
+     */
+    readonly sizes: number | string;
+    /** The page's main image: preloaded at high priority, never lazy. One per page. */
+    readonly preload?: boolean;
+    /** A visible caption, for example "Gum removal over a pool, Epping, March 2026". */
+    readonly caption?: ReactNode;
+}
+export declare function Media({ media, sizes, preload, caption, layout, classes }: MediaProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=media.d.ts.map

package/dist/ui-kit/primitives/media.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"media.d.ts","sourceRoot":"","sources":["../../../src/ui-kit/primitives/media.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AACH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,KAAK,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAA;AAC/F,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,YAAY,CAAA;AAG3C,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,KAAK,GAAG,SAAS,GAAG,OAAO,CAAA;AAC5D,MAAM,WAAW,WAAW;IAC1B,wGAAwG;IACxG,QAAQ,CAAC,KAAK,CAAC,EAAE,kBAAkB,CAAA;CACpC;AACD,MAAM,MAAM,SAAS,GAAG,SAAS,CAAC,SAAS,EAAE,KAAK,EAAE,WAAW,CAAC,CAAA;AAEhE,8HAA8H;AAC9H,eAAO,MAAM,wBAAwB,iBAAqB,CAAA;AAE1D,MAAM,WAAW,UAAW,SAAQ,SAAS;IAC3C,0EAA0E;IAC1E,QAAQ,CAAC,KAAK,EAAE,kBAAkB,CAAA;IAClC;;;OAGG;IACH,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;IAC/B,mFAAmF;IACnF,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAA;IAC1B,oFAAoF;IACpF,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,CAAA;CAC7B;AAED,wBAAgB,KAAK,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,OAAe,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,UAAU,2CAK5F"}

package/dist/ui-kit/primitives/media.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ILLUSTRATION_LABEL, MediaFrame } from './media-frame.js';
+/** The visible label on an AI image (F13). Locked: a site can't rename or hide it. The same value as `ILLUSTRATION_LABEL`. */
+export const MEDIA_ILLUSTRATION_LABEL = ILLUSTRATION_LABEL;
+export function Media({ media, sizes, preload = false, caption, layout, classes }) {
+    const sizing = typeof sizes === 'number' ? { displayWidth: sizes } : { sizes };
+    return (_jsx(MediaFrame, { media: media, ...sizing, ratio: layout?.ratio, caption: caption, priority: preload, classes: classes }));
+}
+//# sourceMappingURL=media.js.map

package/dist/ui-kit/primitives/media.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"media.js","sourceRoot":"","sources":["../../../src/ui-kit/primitives/media.tsx"],"names":[],"mappings":";AAeA,OAAO,EAAE,kBAAkB,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AASjE,8HAA8H;AAC9H,MAAM,CAAC,MAAM,wBAAwB,GAAG,kBAAkB,CAAA;AAgB1D,MAAM,UAAU,KAAK,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,GAAG,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAc;IAC3F,MAAM,MAAM,GAAG,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,EAAE,YAAY,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAA;IAC9E,OAAO,CACL,KAAC,UAAU,IAAC,KAAK,EAAE,KAAK,KAAM,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,GAAI,CACtH,CAAA;AACH,CAAC","sourcesContent":["/**\n * `Media` (F13, 3.14.0): one image from the site's media manifest (`src/data/media.ts`, `defineMedia`), rendered through\n * `MediaFrame`, the library's one image path. Server component. It takes a skin entry with `layout.ratio`, which the\n * services grid uses for its photos; everything else (provenance, the locked \"Illustration\" label, the focal point\n * and the sizing rule) is `MediaFrame`'s.\n *\n * - `sizes` is required. A number is a fixed CSS width (logos, avatars, thumbnails, the header's featured image): it\n *   becomes `MediaFrame`'s `displayWidth`, so the image renders no `sizes` and Next emits only the 1x and 2x candidates\n *   (cost item 1g). A string is a fluid `sizes` value and must have a `vw` part.\n * - `preload` is for the page's main (hero) image only: preloaded at high priority and never lazy.\n * - `layout.ratio` crops to one of the allowed ratios, keeping the entry's focal point in view.\n */\nimport type { ReactNode } from 'react'\nimport type { BrandlabMediaEntry, BrandlabMediaRatio } from '@brandlab-digital/site-core/media'\nimport type { SkinEntry } from '../skin.js'\nimport { ILLUSTRATION_LABEL, MediaFrame } from './media-frame.js'\n\nexport type MediaSlot = 'root' | 'img' | 'caption' | 'label'\nexport interface MediaLayout {\n  /** Crop to one of the allowed ratios (16:9, 4:5, 4:3, 3:2). Left out, the image keeps its own shape. */\n  readonly ratio?: BrandlabMediaRatio\n}\nexport type MediaSkin = SkinEntry<MediaSlot, never, MediaLayout>\n\n/** The visible label on an AI image (F13). Locked: a site can't rename or hide it. The same value as `ILLUSTRATION_LABEL`. */\nexport const MEDIA_ILLUSTRATION_LABEL = ILLUSTRATION_LABEL\n\nexport interface MediaProps extends MediaSkin {\n  /** The manifest entry, for example `media['castle-hill-gum-removal']`. */\n  readonly media: BrandlabMediaEntry\n  /**\n   * The rendered width: a whole number of CSS pixels for a fixed-size image (no `sizes`, so 1x and 2x only), or a\n   * fluid `sizes` string with a `vw` part such as `(min-width: 1024px) 50vw, 100vw`.\n   */\n  readonly sizes: number | string\n  /** The page's main image: preloaded at high priority, never lazy. One per page. */\n  readonly preload?: boolean\n  /** A visible caption, for example \"Gum removal over a pool, Epping, March 2026\". */\n  readonly caption?: ReactNode\n}\n\nexport function Media({ media, sizes, preload = false, caption, layout, classes }: MediaProps) {\n  const sizing = typeof sizes === 'number' ? { displayWidth: sizes } : { sizes }\n  return (\n    <MediaFrame media={media} {...sizing} ratio={layout?.ratio} caption={caption} priority={preload} classes={classes} />\n  )\n}\n"]}

package/dist/ui-kit/primitives/stat.d.ts

@@ -0,0 +1,25 @@
+/**
+ * `Stat` (3.14.0): one proof figure, set large with its label (AA's proof strip, Astute's work numbers). Server
+ * component. The value comes from a verified fact and is the final text in the server HTML: no count-up and nothing
+ * hidden before scripts run. An optional link says where the figure can be checked (the reviews, the licence register).
+ *
+ * Stats are rendered once per entry of a strip, so their parts take no class (3.14.0 repeated slots): the site styles
+ * `[data-bl="stat"]` once in `src/site/skin.css`.
+ */
+import type { RepeatedSlotOf } from '../repeated-slots.js';
+import { type SkinEntry } from '../skin.js';
+import type { UiLink } from '../types.js';
+export type StatSlot = RepeatedSlotOf<'stat'>;
+export type StatSkin = SkinEntry<StatSlot, never, Record<never, never>, StatSlot>;
+export interface StatProps extends StatSkin {
+    /** The figure itself, for example "1,200+" or "4.9". From a verified fact, never typed for effect. */
+    readonly value: string;
+    /** What it counts, for example "trees removed safely since 2009". */
+    readonly label: string;
+    /** Where to check it, for example `{ label: 'Read the reviews', href: '/reviews' }`. Never prefetched. */
+    readonly link?: UiLink;
+    /** `li` inside a list the caller renders, or `div` (the default). */
+    readonly as?: 'div' | 'li';
+}
+export declare function Stat({ value, label, link, as: Root }: StatProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=stat.d.ts.map

package/dist/ui-kit/primitives/stat.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stat.d.ts","sourceRoot":"","sources":["../../../src/ui-kit/primitives/stat.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC1D,OAAO,EAAgB,KAAK,SAAS,EAAE,MAAM,YAAY,CAAA;AACzD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAGzC,MAAM,MAAM,QAAQ,GAAG,cAAc,CAAC,MAAM,CAAC,CAAA;AAC7C,MAAM,MAAM,QAAQ,GAAG,SAAS,CAAC,QAAQ,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,KAAK,CAAC,EAAE,QAAQ,CAAC,CAAA;AAEjF,MAAM,WAAW,SAAU,SAAQ,QAAQ;IACzC,sGAAsG;IACtG,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,qEAAqE;IACrE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,0GAA0G;IAC1G,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAA;IACtB,qEAAqE;IACrE,QAAQ,CAAC,EAAE,CAAC,EAAE,KAAK,GAAG,IAAI,CAAA;CAC3B;AAED,wBAAgB,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE,IAAY,EAAE,EAAE,SAAS,2CAWvE"}

package/dist/ui-kit/primitives/stat.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { repeatedSlot } from '../skin.js';
+import { Anchor } from './links.js';
+export function Stat({ value, label, link, as: Root = 'div' }) {
+    return (_jsxs(Root, { "data-bl": "stat", children: [_jsx("span", { ...repeatedSlot('value'), children: value }), " ", _jsx("span", { ...repeatedSlot('label'), children: label }), link ? (_jsx(Anchor, { href: link.href, prefetch: false, hooks: { 'data-slot': 'link' }, children: link.label })) : null] }));
+}
+//# sourceMappingURL=stat.js.map

package/dist/ui-kit/primitives/stat.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stat.js","sourceRoot":"","sources":["../../../src/ui-kit/primitives/stat.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,YAAY,EAAkB,MAAM,YAAY,CAAA;AAEzD,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AAgBnC,MAAM,UAAU,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE,IAAI,GAAG,KAAK,EAAa;IACtE,OAAO,CACL,MAAC,IAAI,eAAS,MAAM,aAClB,kBAAU,YAAY,CAAC,OAAO,CAAC,YAAG,KAAK,GAAQ,OAAC,kBAAU,YAAY,CAAC,OAAO,CAAC,YAAG,KAAK,GAAQ,EAC9F,IAAI,CAAC,CAAC,CAAC,CACN,KAAC,MAAM,IAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,EAAE,YACrE,IAAI,CAAC,KAAK,GACJ,CACV,CAAC,CAAC,CAAC,IAAI,IACH,CACR,CAAA;AACH,CAAC","sourcesContent":["/**\n * `Stat` (3.14.0): one proof figure, set large with its label (AA's proof strip, Astute's work numbers). Server\n * component. The value comes from a verified fact and is the final text in the server HTML: no count-up and nothing\n * hidden before scripts run. An optional link says where the figure can be checked (the reviews, the licence register).\n *\n * Stats are rendered once per entry of a strip, so their parts take no class (3.14.0 repeated slots): the site styles\n * `[data-bl=\"stat\"]` once in `src/site/skin.css`.\n */\nimport type { RepeatedSlotOf } from '../repeated-slots.js'\nimport { repeatedSlot, type SkinEntry } from '../skin.js'\nimport type { UiLink } from '../types.js'\nimport { Anchor } from './links.js'\n\nexport type StatSlot = RepeatedSlotOf<'stat'>\nexport type StatSkin = SkinEntry<StatSlot, never, Record<never, never>, StatSlot>\n\nexport interface StatProps extends StatSkin {\n  /** The figure itself, for example \"1,200+\" or \"4.9\". From a verified fact, never typed for effect. */\n  readonly value: string\n  /** What it counts, for example \"trees removed safely since 2009\". */\n  readonly label: string\n  /** Where to check it, for example `{ label: 'Read the reviews', href: '/reviews' }`. Never prefetched. */\n  readonly link?: UiLink\n  /** `li` inside a list the caller renders, or `div` (the default). */\n  readonly as?: 'div' | 'li'\n}\n\nexport function Stat({ value, label, link, as: Root = 'div' }: StatProps) {\n  return (\n    <Root data-bl=\"stat\">\n      <span {...repeatedSlot('value')}>{value}</span> <span {...repeatedSlot('label')}>{label}</span>\n      {link ? (\n        <Anchor href={link.href} prefetch={false} hooks={{ 'data-slot': 'link' }}>\n          {link.label}\n        </Anchor>\n      ) : null}\n    </Root>\n  )\n}\n"]}