@cronos-labs/ui 0.7.2 → 0.8.1

package/README.md

@@ -95,15 +95,16 @@ test: {
 
 ### Components
 
-| Export                        | Purpose                                                                                                                          |
-| ----------------------------- | -------------------------------------------------------------------------------------------------------------------------------- |
-| `Header`                      | Site header: brand wordmark, nav with dropdowns, mobile drawer, locale selector, waitlist CTA                                    |
-| `Footer`                      | Site footer: link columns, legal links, cookie-preferences hook, disclaimer copy                                                 |
-| `Seo`                         | Renders nothing; imperatively upserts `<title>`, meta and canonical tags. Creates tags that are absent rather than skipping them |
-| `LocaleSelector`              | Locale dropdown, shared by `Header` and `Footer`                                                                                 |
-| `SectionAnchorNav`            | In-page anchor nav that tracks the active section                                                                                |
-| `SearchField`                 | Labelled search input with optional clear button and status text                                                                 |
-| `PillButton`, `FilterPillRow` | Filter pill primitives                                                                                                           |
+| Export                          | Purpose                                                                                                                                                                                                    |
+| ------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `Header`                        | Site header: brand wordmark, nav with dropdowns, mobile drawer, locale selector, waitlist CTA                                                                                                              |
+| `Footer`                        | Site footer: link columns, legal links, cookie-preferences hook, disclaimer copy                                                                                                                           |
+| `HeaderStatic` / `FooterStatic` | Router-free variants for statically rendered pages (Astro). Take `locale` and `pathname` as props, force document navigation, and never import `react-router-dom`, so the island needs no `<MemoryRouter>` |
+| `Seo`                           | Renders nothing; imperatively upserts `<title>`, meta and canonical tags. Creates tags that are absent rather than skipping them                                                                           |
+| `LocaleSelector`                | Locale dropdown, shared by `Header` and `Footer`                                                                                                                                                           |
+| `SectionAnchorNav`              | In-page anchor nav that tracks the active section                                                                                                                                                          |
+| `SearchField`                   | Labelled search input with optional clear button and status text                                                                                                                                           |
+| `PillButton`, `FilterPillRow`   | Filter pill primitives                                                                                                                                                                                     |
 
 Header and Footer are driven entirely by props — no data fetching, no
 router coupling beyond `react-router-dom`. Their content strings arrive
@@ -190,7 +191,27 @@ and React Refresh plugins, and disables rules Prettier owns.
 
 ## Local development
 
+The toolchain is pinned, so every machine and CI resolve identically:
+
+| Pinned by | File                               | Value                |
+| --------- | ---------------------------------- | -------------------- |
+| Node      | `.nvmrc`                           | 24.21.0 (active LTS) |
+| npm       | `packageManager` in `package.json` | 11.19.0              |
+
+Use a version manager that reads `.nvmrc` (nvm, fnm, asdf) and enable Corepack
+once — it ships with Node and resolves the npm named above.
+
+This package deliberately publishes **no `engines` field**. The Node floor the
+dev toolchain needs comes from a dev dependency, not from anything the library
+does at runtime — it ships as bundled ESM and runs wherever its consumer runs.
+Publishing that floor would impose a constraint that is not real, and every
+consuming site sets `engine-strict=true`, so a wrong floor here would hard-fail
+their `npm ci`. Pin the toolchain for contributors, impose nothing on
+consumers.
+
 ```bash
+nvm use          # or: fnm use
+corepack enable
 npm ci
 npm run lint
 npm run typecheck
@@ -199,6 +220,12 @@ npm run build
 npm run format:check
 ```
 
+Use `npm ci`, not `npm install`, unless you are deliberately changing a
+dependency: `packageManager` fixes the npm version because two npm majors
+disagree about which optional peer entries belong in `package-lock.json`, and
+a lockfile written by one and installed by the other fails `npm ci`. The
+release workflow publishes with the same pinned npm.
+
 `build` compiles `src/` to `dist/` with `tsc`, then rewrites every relative
 specifier in `dist/**/*.js` and `dist/**/*.d.ts` to point at the concrete
 emitted file. `tsc` emits extensionless specifiers under
@@ -216,9 +243,11 @@ Styled React units use `ComponentName/index.tsx` for the component and
 
 ## Releasing
 
-Releases are cut by tag. Publishing happens in CI so the tarball is always
-built on the same Node 22 runner consumers' pipelines use, rather than
-whatever happens to be on a laptop.
+Releases are staged by tag and promoted by a human. The tarball is always
+built on the pinned runner rather than whatever happens to be on a laptop,
+and no credential in this repository can make a version live on its own: the
+CI token is a granular **stage-only** token, so the most it can do is put a
+build in front of a maintainer.
 
 1. Land your change on `main` through a PR.
 2. Bump `version` in `package.json` (semver).
@@ -229,11 +258,26 @@ whatever happens to be on a laptop.
    git push origin ui-v<version>
    ```
 
-The release workflow refuses to publish if the tag and `package.json`
-disagree on the version. `prepack` rebuilds `dist/` as part of packing, so
-a stale build can never ship.
+   The workflow refuses to continue if the tag and `package.json` disagree on
+   the version. `prepack` rebuilds `dist/` as part of packing, so a stale
+   build cannot ship.
+
+4. CI runs `npm stage publish .`. The version is now staged and **not yet
+   installable** — `npm view @cronos-labs/ui version` still reports the
+   previous release.
+
+5. A maintainer with 2FA promotes it. The run log prints the stage id:
+
+   ```bash
+   npm stage list @cronos-labs/ui
+   npm stage view <stage-id>       # inspect before shipping
+   npm stage download <stage-id>   # or pull the tarball and check it
+   npm stage approve <stage-id>    # publish
+   npm stage reject <stage-id>     # discard
+   ```
 
-Consumers then bump their range and run `npm install`.
+Consumers then bump their range and run `npm install`. A patch or minor
+inside their existing caret range needs no bump — `npm install` picks it up.
 
 ## License
 

package/dist/Footer/index.d.ts

@@ -1,35 +1,7 @@
-export interface FooterLinkItem {
-    label: string;
-    target: string;
-    external: boolean;
-    localizeTarget?: boolean;
-}
-export interface FooterLinkGroup {
-    group: string;
-    links: FooterLinkItem[];
-}
-export interface FooterLegalLinkItem {
-    label: string;
-    target: string;
-    external: boolean;
-    disabled?: boolean;
-    isCookiePreferences?: boolean;
-}
-export interface FooterContent {
-    localeSelectorAriaLabel: string;
-    legalNavLabel: string;
-    copyrightText: string;
-    disclaimer: string[];
-}
-interface FooterProps {
-    /** Overrides the wordmark from `<BrandProvider>`. Optional when one is present. */
-    brandWordmarkSrc?: string;
-    columns: FooterLinkGroup[];
-    content: FooterContent;
-    forceDocumentNavigation?: boolean;
-    legalLinks: FooterLegalLinkItem[];
-    onOpenCookiePreferences: () => void;
-    waitlistSlot?: ((legalMeta: React.ReactNode | undefined) => React.ReactNode) | undefined;
-}
-export declare function Footer({ brandWordmarkSrc, columns, content, forceDocumentNavigation, legalLinks, onOpenCookiePreferences, waitlistSlot, }: FooterProps): React.JSX.Element;
-export {};
+import type { FooterProps } from './types.js';
+export type { FooterContent, FooterLegalLinkItem, FooterLinkGroup, FooterLinkItem, FooterProps, } from './types.js';
+/**
+ * The site footer for apps with a react-router `<Router>` above it. Static
+ * sites without a router render `FooterStatic` instead.
+ */
+export declare function Footer(props: FooterProps): React.JSX.Element;

package/dist/Footer/index.js

@@ -1,61 +1,10 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Fragment, useEffect, useState } from 'react';
-import { LocaleSelector } from '../LocaleSelector/index.js';
-import { buildLocalizedPath } from '../locale/routes.js';
-import { useCurrentLocale } from '../locale/hooks.js';
-import { desktopViewportQuery } from '../tokens.js';
-import { useOptionalBrand } from '../brand/index.js';
-import { FooterColumn, FooterColumnHeading, FooterContainer, FooterCopyright, FooterColumnsGrid, FooterDesktopLocaleSlot, FooterDisclaimer, FooterDisclaimerStack, FooterGrid, FooterLegalButton, FooterLegalDivider, FooterLegalLink as FooterLegalLinkStyled, FooterLegalMeta, FooterLegalNav, FooterLegalText, FooterLocaleSlot, FooterLink as FooterLinkStyled, FooterLinkList, FooterMobileCopyright, FooterMobileDivider, FooterMobileLegalDividerTrack, FooterMobileLegalMeta, FooterMobileLegalNav, FooterShell, FooterWaitlistSlot, FooterWordmark, FooterWordmarkImage, } from './styles.js';
-const buildFooterHref = (target, locale, localize = true) => {
-    if (target.startsWith('/') && localize) {
-        return buildLocalizedPath(target, locale);
-    }
-    return target;
-};
-const getExternalLinkProps = (external) => {
-    if (!external) {
-        return {};
-    }
-    return { target: '_blank', rel: 'noreferrer' };
-};
-export function Footer({ brandWordmarkSrc, columns, content, forceDocumentNavigation = false, legalLinks, onOpenCookiePreferences, waitlistSlot, }) {
-    const brand = useOptionalBrand();
-    const wordmarkSrc = brandWordmarkSrc ?? brand?.wordmarkSrc;
-    if (wordmarkSrc === undefined) {
-        throw new Error('<Footer> needs a brandWordmarkSrc prop or a <BrandProvider>.');
-    }
-    const locale = useCurrentLocale();
-    const [isDesktopFooterLayout, setIsDesktopFooterLayout] = useState(true);
-    useEffect(() => {
-        const desktopMediaQuery = window.matchMedia(desktopViewportQuery);
-        const handleChange = (event) => {
-            setIsDesktopFooterLayout(event.matches);
-        };
-        setIsDesktopFooterLayout(desktopMediaQuery.matches);
-        desktopMediaQuery.addEventListener('change', handleChange);
-        return () => {
-            desktopMediaQuery.removeEventListener('change', handleChange);
-        };
-    }, []);
-    const renderFooterLink = (link) => {
-        return (_jsx(FooterLinkStyled, { href: buildFooterHref(link.target, locale, link.localizeTarget ?? true), ...getExternalLinkProps(link.external), children: _jsx("span", { children: link.label }) }, link.target));
-    };
-    const renderLegalLink = (link) => {
-        if (link.isCookiePreferences) {
-            // Deliberately not OneTrust's `#ot-sdk-btn.ot-sdk-show-settings` hook:
-            // the SDK rewrites any element carrying it with the label configured in
-            // the OneTrust admin ("Cookies Settings"), replacing the localized copy
-            // and, on the Astro sites, changing the server-rendered text before the
-            // island hydrates — React then throws a hydration error and re-renders
-            // the whole tree on the client. `onOpenCookiePreferences` already opens
-            // the preference centre through the OneTrust API directly.
-            return (_jsx(FooterLegalButton, { type: "button", onClick: onOpenCookiePreferences, children: link.label }));
-        }
-        if (link.disabled) {
-            return _jsx(FooterLegalText, { "aria-disabled": "true", children: link.label });
-        }
-        return (_jsx(FooterLegalLinkStyled, { href: buildFooterHref(link.target, locale), ...getExternalLinkProps(link.external), children: link.label }));
-    };
-    const legalMeta = isDesktopFooterLayout ? (_jsxs(FooterLegalMeta, { children: [_jsx(FooterCopyright, { children: content.copyrightText }), _jsx(FooterLegalNav, { "aria-label": content.legalNavLabel, children: legalLinks.map((link, index) => (_jsxs("span", { children: [index > 0 ? _jsx(FooterLegalDivider, { "aria-hidden": "true" }) : null, renderLegalLink(link)] }, link.target))) })] })) : undefined;
-    return (_jsx(FooterShell, { children: _jsxs(FooterContainer, { children: [_jsxs(FooterGrid, { children: [_jsx(FooterWaitlistSlot, { children: waitlistSlot?.(legalMeta) }), _jsx(FooterMobileDivider, { "aria-hidden": "true" }), _jsxs(FooterColumnsGrid, { children: [columns.map((group) => (_jsxs(FooterColumn, { children: [_jsx(FooterColumnHeading, { children: group.group }), _jsx(FooterLinkList, { children: group.links.map((link) => renderFooterLink(link)) })] }, group.group))), _jsxs(FooterDisclaimerStack, { children: [isDesktopFooterLayout ? (_jsx(FooterDesktopLocaleSlot, { children: _jsx(LocaleSelector, { ariaLabel: content.localeSelectorAriaLabel, forceDocumentNavigation: forceDocumentNavigation }) })) : null, _jsx(FooterDisclaimer, { children: content.disclaimer.map((paragraph) => (_jsx("p", { children: paragraph }, paragraph))) })] })] }), !isDesktopFooterLayout ? (_jsxs(FooterMobileLegalMeta, { children: [_jsx(FooterLocaleSlot, { children: _jsx(LocaleSelector, { ariaLabel: content.localeSelectorAriaLabel, forceDocumentNavigation: forceDocumentNavigation }) }), _jsx(FooterMobileCopyright, { children: content.copyrightText }), _jsx(FooterMobileLegalNav, { "aria-label": content.legalNavLabel, children: legalLinks.map((link, index) => (_jsxs(Fragment, { children: [index > 0 ? (_jsx(FooterMobileLegalDividerTrack, { children: _jsx(FooterLegalDivider, { "aria-hidden": "true" }) })) : null, renderLegalLink(link)] }, link.target))) })] })) : null] }), _jsx(FooterWordmark, { "aria-hidden": "true", children: _jsx(FooterWordmarkImage, { src: wordmarkSrc, alt: "" }) })] }) }));
+import { jsx as _jsx } from "react/jsx-runtime";
+import { RouterNavigationProvider } from '../navigation/router.js';
+import { FooterView } from './view.js';
+/**
+ * The site footer for apps with a react-router `<Router>` above it. Static
+ * sites without a router render `FooterStatic` instead.
+ */
+export function Footer(props) {
+    return (_jsx(RouterNavigationProvider, { children: _jsx(FooterView, { ...props }) }));
 }

package/dist/Footer/static.d.ts

@@ -0,0 +1,16 @@
+import type { AppLocale } from '../locale/types.js';
+import type { FooterProps } from './types.js';
+export interface FooterStaticProps extends Omit<FooterProps, 'forceDocumentNavigation'> {
+    /** The page's locale, resolved by the host (Astro) rather than a router param. */
+    locale: AppLocale;
+    /** The page's pathname, used to build the locale selector's targets. */
+    pathname: string;
+    search?: string | undefined;
+    hash?: string | undefined;
+}
+/**
+ * The site footer for statically rendered pages with no client router. The
+ * locale selector performs a document navigation, so this variant never
+ * imports react-router and needs no `<MemoryRouter>` around the island.
+ */
+export declare function FooterStatic({ locale, pathname, search, hash, ...props }: FooterStaticProps): React.JSX.Element;

package/dist/Footer/static.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { StaticNavigationProvider } from '../navigation/static.js';
+import { FooterView } from './view.js';
+/**
+ * The site footer for statically rendered pages with no client router. The
+ * locale selector performs a document navigation, so this variant never
+ * imports react-router and needs no `<MemoryRouter>` around the island.
+ */
+export function FooterStatic({ locale, pathname, search, hash, ...props }) {
+    return (_jsx(StaticNavigationProvider, { locale: locale, pathname: pathname, search: search, hash: hash, children: _jsx(FooterView, { ...props, forceDocumentNavigation: true }) }));
+}

package/dist/Footer/styles.d.ts

@@ -40,6 +40,12 @@ export declare const FooterLinkList: import("styled-components/dist/types").ISty
 export declare const FooterLink: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "style"> & {
     style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
 }> & string;
+export declare const FooterLinkDisabled: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "style"> & {
+    style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
+}> & string;
+export declare const FooterLinkBadge: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "style"> & {
+    style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
+}> & string;
 export declare const FooterLegalMeta: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "style"> & {
     style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
 }> & string;
@@ -92,6 +98,6 @@ export declare const FooterWordmark: import("styled-components/dist/types").ISty
 }> & string;
 export declare const FooterWordmarkImage: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<Omit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "style"> & {
     style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
-}, "property" | "title" | "slot" | "style" | "dir" | "content" | "rel" | "ref" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "draggable" | "enterKeyHint" | "hidden" | "id" | "lang" | "nonce" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popover" | "popoverTargetAction" | "popoverTarget" | "inert" | "inputMode" | "is" | "exportparts" | "part" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onScrollEnd" | "onScrollEndCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onToggle" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture" | "referrerPolicy" | "alt" | "crossOrigin" | "decoding" | "fetchPriority" | "height" | "loading" | "sizes" | "src" | "srcSet" | "useMap" | "width"> & Partial<Pick<Omit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "style"> & {
+}, "property" | "title" | "slot" | "style" | "dir" | "content" | "rel" | "children" | "ref" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "draggable" | "enterKeyHint" | "hidden" | "id" | "lang" | "nonce" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popover" | "popoverTargetAction" | "popoverTarget" | "inert" | "inputMode" | "is" | "exportparts" | "part" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onScrollEnd" | "onScrollEndCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onToggle" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture" | "referrerPolicy" | "alt" | "crossOrigin" | "decoding" | "fetchPriority" | "height" | "loading" | "sizes" | "src" | "srcSet" | "useMap" | "width"> & Partial<Pick<Omit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "style"> & {
     style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
-}, "property" | "title" | "slot" | "style" | "dir" | "content" | "rel" | "ref" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "draggable" | "enterKeyHint" | "hidden" | "id" | "lang" | "nonce" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popover" | "popoverTargetAction" | "popoverTarget" | "inert" | "inputMode" | "is" | "exportparts" | "part" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onScrollEnd" | "onScrollEndCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onToggle" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture" | "referrerPolicy" | "alt" | "crossOrigin" | "decoding" | "fetchPriority" | "height" | "loading" | "sizes" | "src" | "srcSet" | "useMap" | "width">>> & string;
+}, "property" | "title" | "slot" | "style" | "dir" | "content" | "rel" | "children" | "ref" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "draggable" | "enterKeyHint" | "hidden" | "id" | "lang" | "nonce" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popover" | "popoverTargetAction" | "popoverTarget" | "inert" | "inputMode" | "is" | "exportparts" | "part" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onScrollEnd" | "onScrollEndCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onToggle" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture" | "referrerPolicy" | "alt" | "crossOrigin" | "decoding" | "fetchPriority" | "height" | "loading" | "sizes" | "src" | "srcSet" | "useMap" | "width">>> & string;

package/dist/Footer/styles.js

@@ -89,7 +89,12 @@ export const FooterDisclaimerStack = styled.div `
   }
 `;
 export const FooterDesktopLocaleSlot = styled.div `
-  width: 197px;
+  display: none;
+
+  ${({ theme }) => theme.mediaQueries.lg} {
+    display: block;
+    width: 197px;
+  }
 `;
 export const FooterDisclaimer = styled.div `
   display: grid;
@@ -172,13 +177,49 @@ export const FooterLink = styled.a `
     font-size: ${({ theme }) => theme.typography.fontSize.body};
   }
 `;
-export const FooterLegalMeta = styled.div `
-  display: flex;
-  flex-wrap: wrap;
+/* A greyed column link: the link's type, dimmed, with no hover. */
+export const FooterLinkDisabled = styled.span `
+  display: inline-flex;
   align-items: center;
-  gap: 12px;
+  gap: 8px;
+  width: fit-content;
+  color: ${({ theme }) => theme.colors.ink};
+  font-size: 0.875rem;
+  font-weight: ${({ theme }) => theme.fontWeight.medium};
+  line-height: 1.5;
+  opacity: 0.5;
+  cursor: default;
 
   ${({ theme }) => theme.mediaQueries.lg} {
+    font-size: ${({ theme }) => theme.typography.fontSize.body};
+  }
+`;
+export const FooterLinkBadge = styled.span `
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  height: 18px;
+  padding: 0 8px;
+  border-radius: ${({ theme }) => theme.borderRadius.pill};
+  background: rgb(0 0 0 / 0.1);
+  color: currentColor;
+  font-size: 0.6875rem;
+  font-weight: ${({ theme }) => theme.fontWeight.black};
+  letter-spacing: 0.1em;
+  line-height: 1;
+  text-transform: uppercase;
+  white-space: nowrap;
+`;
+// Desktop-only: below the breakpoint FooterMobileLegalMeta carries the same
+// copyright and legal links, so this block is hidden by CSS rather than left
+// out of the tree (see Footer/view.tsx).
+export const FooterLegalMeta = styled.div `
+  display: none;
+
+  ${({ theme }) => theme.mediaQueries.lg} {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
     gap: 10px 12px;
   }
 `;
@@ -227,30 +268,24 @@ export const FooterLegalLink = styled.a `
     line-height: 1.3333;
   }
 `;
-// The `!important`s below date from when this button carried OneTrust's
-// `#ot-sdk-btn.ot-sdk-show-settings` hook and had to beat the SDK's own
-// button styles. The hook is gone (see Footer/index.tsx); they are kept for
-// now so this change stays limited to the label/hydration fix.
 export const FooterLegalButton = styled.button `
-  display: inline !important;
-  min-width: 0 !important;
-  min-height: 0 !important;
-  padding: 0 !important;
-  border: 0 !important;
-  background: transparent !important;
-  color: ${({ theme }) => theme.colors.footerTextMuted} !important;
+  display: inline;
+  min-width: 0;
+  min-height: 0;
+  padding: 0;
+  border: 0;
+  background: transparent;
+  color: ${({ theme }) => theme.colors.footerTextMuted};
   cursor: pointer;
   font: inherit;
-  font-size: 0.6875rem !important;
-  font-weight: ${({ theme }) => theme.fontWeight.default} !important;
-  line-height: 1.2727 !important;
-  text-decoration: none !important;
-  white-space: nowrap !important;
+  font-size: 0.6875rem;
+  font-weight: ${({ theme }) => theme.fontWeight.default};
+  line-height: 1.2727;
+  text-decoration: none;
+  white-space: nowrap;
 
   &:hover {
-    background: transparent !important;
-    color: ${({ theme }) => theme.colors.footerTextMuted} !important;
-    text-decoration: underline !important;
+    text-decoration: underline;
   }
 
   &:focus-visible {
@@ -259,8 +294,8 @@ export const FooterLegalButton = styled.button `
   }
 
   ${({ theme }) => theme.mediaQueries.lg} {
-    font-size: 0.75rem !important;
-    line-height: 1.3333 !important;
+    font-size: 0.75rem;
+    line-height: 1.3333;
   }
 `;
 export const FooterLegalText = styled.span `

package/dist/Footer/types.d.ts

@@ -0,0 +1,41 @@
+export interface FooterLinkItem {
+    label: string;
+    target: string;
+    external: boolean;
+    localizeTarget?: boolean;
+    /** Renders the link greyed and non-interactive, with `badge` beside it if given. */
+    disabled?: boolean;
+    badge?: string;
+}
+export interface FooterLinkGroup {
+    group: string;
+    links: FooterLinkItem[];
+}
+export interface FooterLegalLinkItem {
+    label: string;
+    target: string;
+    external: boolean;
+    disabled?: boolean;
+    isCookiePreferences?: boolean;
+}
+export interface FooterContent {
+    localeSelectorAriaLabel: string;
+    legalNavLabel: string;
+    copyrightText: string;
+    disclaimer: string[];
+}
+export interface FooterProps {
+    /** Overrides the wordmark from `<BrandProvider>`. Optional when one is present. */
+    brandWordmarkSrc?: string;
+    columns: FooterLinkGroup[];
+    content: FooterContent;
+    forceDocumentNavigation?: boolean;
+    legalLinks: FooterLegalLinkItem[];
+    onOpenCookiePreferences: () => void;
+    /**
+     * Renders the footer's CTA column. Receives the copyright + legal-links
+     * block, which is hidden below the desktop breakpoint by CSS, so render it
+     * unconditionally and let the footer's own mobile legal block take over.
+     */
+    waitlistSlot?: ((legalMeta: React.ReactNode) => React.ReactNode) | undefined;
+}

package/dist/Footer/types.js

@@ -0,0 +1 @@
+export {};

package/dist/Footer/view.d.ts

@@ -0,0 +1,2 @@
+import type { FooterProps } from './types.js';
+export declare function FooterView({ brandWordmarkSrc, columns, content, forceDocumentNavigation, legalLinks, onOpenCookiePreferences, waitlistSlot, }: FooterProps): React.JSX.Element;

package/dist/Footer/view.js

@@ -0,0 +1,55 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment } from 'react';
+import { LocaleSelectorView } from '../LocaleSelector/view.js';
+import { buildLocalizedPath } from '../locale/routes.js';
+import { useNavigationLocation } from '../navigation/context.js';
+import { useOptionalBrand } from '../brand/index.js';
+import { FooterColumn, FooterColumnHeading, FooterContainer, FooterCopyright, FooterColumnsGrid, FooterDesktopLocaleSlot, FooterDisclaimer, FooterDisclaimerStack, FooterGrid, FooterLegalButton, FooterLegalDivider, FooterLegalLink as FooterLegalLinkStyled, FooterLegalMeta, FooterLegalNav, FooterLegalText, FooterLocaleSlot, FooterLink as FooterLinkStyled, FooterLinkBadge, FooterLinkDisabled, FooterLinkList, FooterMobileCopyright, FooterMobileDivider, FooterMobileLegalDividerTrack, FooterMobileLegalMeta, FooterMobileLegalNav, FooterShell, FooterWaitlistSlot, FooterWordmark, FooterWordmarkImage, } from './styles.js';
+const buildFooterHref = (target, locale, localize = true) => {
+    if (target.startsWith('/') && localize) {
+        return buildLocalizedPath(target, locale);
+    }
+    return target;
+};
+const getExternalLinkProps = (external) => {
+    if (!external) {
+        return {};
+    }
+    return { target: '_blank', rel: 'noreferrer' };
+};
+export function FooterView({ brandWordmarkSrc, columns, content, forceDocumentNavigation = false, legalLinks, onOpenCookiePreferences, waitlistSlot, }) {
+    const brand = useOptionalBrand();
+    const wordmarkSrc = brandWordmarkSrc ?? brand?.wordmarkSrc;
+    if (wordmarkSrc === undefined) {
+        throw new Error('<Footer> needs a brandWordmarkSrc prop or a <BrandProvider>.');
+    }
+    const { locale } = useNavigationLocation();
+    const renderFooterLink = (link) => {
+        if (link.disabled) {
+            return (_jsxs(FooterLinkDisabled, { "aria-disabled": "true", "aria-label": `${link.label} ${link.badge ?? ''}`.trim(), children: [_jsx("span", { children: link.label }), link.badge ? _jsx(FooterLinkBadge, { children: link.badge }) : null] }, link.target));
+        }
+        return (_jsx(FooterLinkStyled, { href: buildFooterHref(link.target, locale, link.localizeTarget ?? true), ...getExternalLinkProps(link.external), children: _jsx("span", { children: link.label }) }, link.target));
+    };
+    const renderLegalLink = (link) => {
+        if (link.isCookiePreferences) {
+            // Deliberately not OneTrust's `#ot-sdk-btn.ot-sdk-show-settings` hook:
+            // the SDK rewrites any element carrying it with the label configured in
+            // the OneTrust admin ("Cookies Settings"), replacing the localized copy
+            // and, on the Astro sites, changing the server-rendered text before the
+            // island hydrates — React then throws a hydration error and re-renders
+            // the whole tree on the client. `onOpenCookiePreferences` already opens
+            // the preference centre through the OneTrust API directly.
+            return (_jsx(FooterLegalButton, { type: "button", onClick: onOpenCookiePreferences, children: link.label }));
+        }
+        if (link.disabled) {
+            return _jsx(FooterLegalText, { "aria-disabled": "true", children: link.label });
+        }
+        return (_jsx(FooterLegalLinkStyled, { href: buildFooterHref(link.target, locale), ...getExternalLinkProps(link.external), children: link.label }));
+    };
+    // Both the desktop legal block (handed to waitlistSlot) and the mobile one
+    // are always rendered and swapped by CSS media queries, so the server and
+    // the first client render agree at every viewport and nothing re-lays out
+    // after hydration.
+    const legalMeta = (_jsxs(FooterLegalMeta, { children: [_jsx(FooterCopyright, { children: content.copyrightText }), _jsx(FooterLegalNav, { "aria-label": content.legalNavLabel, children: legalLinks.map((link, index) => (_jsxs("span", { children: [index > 0 ? _jsx(FooterLegalDivider, { "aria-hidden": "true" }) : null, renderLegalLink(link)] }, link.target))) })] }));
+    return (_jsx(FooterShell, { children: _jsxs(FooterContainer, { children: [_jsxs(FooterGrid, { children: [_jsx(FooterWaitlistSlot, { children: waitlistSlot?.(legalMeta) }), _jsx(FooterMobileDivider, { "aria-hidden": "true" }), _jsxs(FooterColumnsGrid, { children: [columns.map((group) => (_jsxs(FooterColumn, { children: [_jsx(FooterColumnHeading, { children: group.group }), _jsx(FooterLinkList, { children: group.links.map((link) => renderFooterLink(link)) })] }, group.group))), _jsxs(FooterDisclaimerStack, { children: [_jsx(FooterDesktopLocaleSlot, { children: _jsx(LocaleSelectorView, { ariaLabel: content.localeSelectorAriaLabel, forceDocumentNavigation: forceDocumentNavigation }) }), _jsx(FooterDisclaimer, { children: content.disclaimer.map((paragraph) => (_jsx("p", { children: paragraph }, paragraph))) })] })] }), _jsxs(FooterMobileLegalMeta, { children: [_jsx(FooterLocaleSlot, { children: _jsx(LocaleSelectorView, { ariaLabel: content.localeSelectorAriaLabel, forceDocumentNavigation: forceDocumentNavigation }) }), _jsx(FooterMobileCopyright, { children: content.copyrightText }), _jsx(FooterMobileLegalNav, { "aria-label": content.legalNavLabel, children: legalLinks.map((link, index) => (_jsxs(Fragment, { children: [index > 0 ? (_jsx(FooterMobileLegalDividerTrack, { children: _jsx(FooterLegalDivider, { "aria-hidden": "true" }) })) : null, renderLegalLink(link)] }, link.target))) })] })] }), _jsx(FooterWordmark, { "aria-hidden": "true", children: _jsx(FooterWordmarkImage, { src: wordmarkSrc, alt: "" }) })] }) }));
+}

package/dist/Header/NavDropdown.d.ts

@@ -1,11 +1,15 @@
-import type { HeaderPresentationVariant } from './index.js';
+import type { HeaderPresentationVariant } from './types.js';
 export interface NavDropdownItem {
     key: string;
     label: string;
-    href: string;
+    /** Absent on a disabled item. */
+    href?: string | undefined;
     ariaLabel?: string | undefined;
     external?: boolean | undefined;
     onClick?: ((event: React.MouseEvent<HTMLAnchorElement>) => void) | undefined;
+    /** Greyed and non-interactive, with `badge` beside the label if given. */
+    disabled?: boolean | undefined;
+    badge?: string | undefined;
 }
 interface NavDropdownProps {
     label: string;