@arbidocs/blocks 0.3.185 → 0.4.1

package/dist/components/PageHeader.d.ts

@@ -0,0 +1,15 @@
+import type { ReactNode } from 'react';
+export interface PageHeaderProps {
+    title: ReactNode;
+    eyebrow?: ReactNode;
+    description?: ReactNode;
+    /** Before the title block: a back button, an avatar or an icon. */
+    leading?: ReactNode;
+    actions?: ReactNode;
+    /** Under the whole header: a tab strip or segmented control. */
+    tabs?: ReactNode;
+    className?: string;
+    testId?: string;
+}
+/** Standard page title block: leading + eyebrow + title + description + actions, then tabs. */
+export declare function PageHeader({ title, eyebrow, description, leading, actions, tabs, className, testId, }: PageHeaderProps): import("react").JSX.Element;

package/dist/components/PricingTable.d.ts

@@ -0,0 +1,19 @@
+export interface PricingPlan {
+    name: string;
+    price: string;
+    period?: string;
+    description?: string;
+    features?: string[];
+    cta?: {
+        label?: string;
+        href?: string;
+    };
+    /** Highlight this plan as the recommended one. */
+    featured?: boolean;
+}
+export interface PricingTableProps {
+    plans: PricingPlan[];
+    testId?: string;
+}
+/** A row of pricing plan cards with feature lists and a CTA per plan. */
+export declare function PricingTable({ plans, testId }: PricingTableProps): import("react").JSX.Element;

package/dist/components/RichTextBlock.d.ts

@@ -0,0 +1,10 @@
+export interface RichTextBlockProps {
+    content: string;
+    testId?: string;
+}
+/**
+ * Prose block. Reuses the shared markdown renderer (`AiMarkdown`) so long-form copy
+ * gets the one house style for headings, lists, tables and emphasis — token-clean
+ * and themeable per host.
+ */
+export declare function RichTextBlock({ content, testId }: RichTextBlockProps): import("react").JSX.Element;

package/dist/components/SectionHeading.d.ts

@@ -0,0 +1,11 @@
+/** Editorial heading block for marketing sections: eyebrow + title + lead. */
+export declare function SectionHeading({ eyebrow, title, lead, align, className, invert, eyebrowClassName, }: {
+    eyebrow?: string;
+    title: string;
+    lead?: string;
+    align?: 'left' | 'center';
+    className?: string;
+    invert?: boolean;
+    /** Override the eyebrow styling (e.g. a host brand accent). Default: token classes. */
+    eyebrowClassName?: string;
+}): import("react").JSX.Element;

package/dist/components/Spacer.d.ts

@@ -0,0 +1,7 @@
+export type SpacerSize = 'sm' | 'md' | 'lg' | 'xl';
+export interface SpacerProps {
+    size?: SpacerSize;
+    testId?: string;
+}
+/** Vertical whitespace. */
+export declare function Spacer({ size, testId }: SpacerProps): import("react").JSX.Element;

package/dist/components/StatGroup.d.ts

@@ -0,0 +1,12 @@
+export interface StatItem {
+    value: string;
+    label: string;
+    /** Optional caption under the label (e.g. a qualifier or unit). */
+    sub?: string;
+}
+export interface StatGroupProps {
+    items: StatItem[];
+    testId?: string;
+}
+/** Big-number stat group — headline metrics with captions. */
+export declare function StatGroup({ items, testId }: StatGroupProps): import("react").JSX.Element;

package/dist/components/Steps.d.ts

@@ -0,0 +1,12 @@
+export interface StepItem {
+    title: string;
+    description?: string;
+}
+export interface StepsProps {
+    steps: StepItem[];
+    /** `timeline` draws a connected vertical rail; `numbered` is a horizontal grid. */
+    variant?: 'numbered' | 'timeline';
+    testId?: string;
+}
+/** A process / how-it-works sequence, as numbered cards or a vertical timeline. */
+export declare function Steps({ steps, variant, testId }: StepsProps): import("react").JSX.Element;

package/dist/components/Tabs.d.ts

@@ -0,0 +1,15 @@
+import { type ReactNode } from 'react';
+export interface TabItem {
+    label: string;
+    content: ReactNode;
+}
+export interface TabsProps {
+    items: TabItem[];
+    testId?: string;
+}
+/**
+ * A tabbed panel: a row of tabs over the active tab's content. Radix Tabs gives the full WAI-ARIA
+ * pattern: one tab stop, arrow keys / Home / End move between tabs, `aria-controls` and
+ * `aria-labelledby` pair each tab with its panel.
+ */
+export declare function Tabs({ items, testId }: TabsProps): import("react").JSX.Element;

package/dist/components/TeamGrid.d.ts

@@ -0,0 +1,30 @@
+import type { ReactNode } from 'react';
+import { type BlockLinkComponent } from './blockLink';
+export interface TeamMember {
+    name: string;
+    role?: string;
+    /** An accent line under the role (practice, team). */
+    kicker?: string;
+    bio?: string;
+    avatarUrl?: string;
+    /** When set, the card becomes a link to this person's detail page. */
+    href?: string;
+    /** Overrides this card's test id (default `{testId}-item-{index}`). */
+    testId?: string;
+}
+export interface TeamGridProps {
+    members: TeamMember[];
+    columns?: '2' | '3' | '4';
+    /**
+     * `centered`: the stacked, centred card. `profile`: the start-aligned editorial card
+     * (`ProfileCard`: clamped bio, meta pinned to the foot, arrow on linked cards).
+     */
+    variant?: 'centered' | 'profile';
+    /** Per-member content under the bio (practice chips, focus areas, links). */
+    renderMeta?: (member: TeamMember, index: number) => ReactNode;
+    /** Inject a router link (adapted to `href`) so linked cards navigate in-SPA. */
+    linkComponent?: BlockLinkComponent;
+    testId?: string;
+}
+/** A grid of people cards: avatar, name, role and an optional short bio and meta slot. */
+export declare function TeamGrid({ members, columns, variant, renderMeta, linkComponent, testId, }: TeamGridProps): import("react").JSX.Element;

package/dist/components/Testimonial.d.ts

@@ -0,0 +1,9 @@
+export interface TestimonialProps {
+    quote: string;
+    author?: string;
+    role?: string;
+    avatarUrl?: string;
+    testId?: string;
+}
+/** A single pull-quote testimonial with an author and optional avatar. */
+export declare function Testimonial({ quote, author, role, avatarUrl, testId }: TestimonialProps): import("react").JSX.Element;

package/dist/components/TestimonialGrid.d.ts

@@ -0,0 +1,13 @@
+export interface TestimonialItem {
+    quote: string;
+    author?: string;
+    role?: string;
+    avatarUrl?: string;
+}
+export interface TestimonialGridProps {
+    items: TestimonialItem[];
+    columns?: '2' | '3';
+    testId?: string;
+}
+/** A grid of multiple pull-quote testimonials. */
+export declare function TestimonialGrid({ items, columns, testId }: TestimonialGridProps): import("react").JSX.Element;

package/dist/components/ToneBadge.d.ts

@@ -0,0 +1,18 @@
+import type { HTMLAttributes, ReactNode } from 'react';
+import { type Tone } from './tones';
+export type { Tone };
+export interface ToneBadgeProps extends HTMLAttributes<HTMLSpanElement> {
+    tone?: Tone;
+    /** Leading glyph or dot. */
+    icon?: ReactNode;
+    children: ReactNode;
+}
+/** A small tinted label. The host decides the tone and the words (status, level, priority...). */
+export declare function ToneBadge({ tone, icon, children, className, ...rest }: ToneBadgeProps): import("react").JSX.Element;
+export interface DotProps extends HTMLAttributes<HTMLSpanElement> {
+    tone?: Tone;
+    /** Accessible name; without it the dot is decorative (`aria-hidden`). */
+    label?: string;
+}
+/** A solid status dot in a tone. */
+export declare function Dot({ tone, label, className, ...rest }: DotProps): import("react").JSX.Element;

package/dist/components/Toolbar.d.ts

@@ -0,0 +1,11 @@
+import type { ReactNode } from 'react';
+/** Search + filter bar used above every list view. */
+export declare function Toolbar({ search, onSearch, searchPlaceholder, filters, actions, className, testId, }: {
+    search?: string;
+    onSearch?: (v: string) => void;
+    searchPlaceholder?: string;
+    filters?: ReactNode;
+    actions?: ReactNode;
+    className?: string;
+    testId?: string;
+}): import("react").JSX.Element;

package/dist/components/UsageMeter.d.ts

@@ -0,0 +1,21 @@
+import type { LucideIcon } from 'lucide-react';
+/**
+ * One labelled quota meter: icon + label on the left, used-of-limit on the
+ * right, a thin bar underneath. The bar's tone follows pressure with the shared
+ * green → yellow → red gradation — green while there's room, yellow past the
+ * halfway mark, red at the limit — so a stack of meters reads at a glance which
+ * quota is the one to think about.
+ */
+export declare function UsageMeter({ icon: Icon, label, value, pct, hint, className, testId, }: {
+    icon?: LucideIcon;
+    label: string;
+    /** Formatted used-of-limit text, e.g. "1,200 / 25,000" or "40 / 500 MB". */
+    value: string;
+    /** Fill percentage, 0–100 (values are clamped). */
+    pct: number;
+    /** Inline parenthetical after the label, e.g. "resets May 31, 2025" —
+     *  same font as the label, so the meter never grows an extra row. */
+    hint?: string;
+    className?: string;
+    testId?: string;
+}): import("react").JSX.Element;

package/dist/components/VideoEmbed.d.ts

@@ -0,0 +1,16 @@
+export type VideoAspect = '16:9' | '4:3' | '1:1';
+export interface VideoEmbedProps {
+    /** A YouTube / Vimeo / Loom page URL, or a direct video file URL. */
+    url: string;
+    title?: string;
+    aspect?: VideoAspect;
+    rounded?: boolean;
+    testId?: string;
+}
+/**
+ * Resolve a shareable video URL to an embeddable iframe src. Supports YouTube,
+ * Vimeo and Loom; returns null for anything else (rendered as a `<video>`).
+ */
+export declare function toEmbedUrl(url: string): string | null;
+/** Embed a video from a YouTube/Vimeo/Loom link or a direct file, in a set aspect. */
+export declare function VideoEmbed({ url, title, aspect, rounded, testId, }: VideoEmbedProps): import("react").JSX.Element;

package/dist/components/assetImage.d.ts

@@ -0,0 +1,16 @@
+import type { AssetRenderProps } from './assetResolver';
+/**
+ * Resolve an asset ext_id to a displayable image src.
+ *
+ * Prefer the cheap thumbnail endpoint, but fall back to downloading the actual
+ * bytes as an object URL when there's no thumbnail — AI-generated (and freshly
+ * uploaded) images have no thumbnail yet, so the thumbnail-only path renders a
+ * broken `<img>`. The bytes always exist (it's a stored document), so the editor
+ * shows the real image immediately instead of waiting on async thumbnailing.
+ */
+export declare function useAssetImage(docId: string): string | undefined;
+/**
+ * Resolve a single asset ext_id and render it as an `<img>`. This is the
+ * `AssetRenderer` the Studio injects; it satisfies `AssetRenderProps`.
+ */
+export declare function AssetThumb({ docId, alt, className, testId }: AssetRenderProps): import("react").JSX.Element;

package/dist/components/assetResolver.d.ts

@@ -0,0 +1,57 @@
+/**
+ * Asset resolution for the editor canvas — the SDK-free half.
+ *
+ * An image block's stored `src` is one of three things: a **workspace asset ref**
+ * while authoring (an `asset:<docId>` string), a plain URL, or — once published —
+ * an inlined `data:` URI (see the studio publish/materialize step). Only inside
+ * the authenticated Studio can an asset ref be resolved to displayable bytes (via
+ * the thumbnail endpoint).
+ *
+ * So the resolver is **injected, not imported**. This module knows only that
+ * *some* component can turn a `docId` into pixels; the Studio supplies
+ * `AssetThumb` from `./assetImage`, which is where the SDK and React Query live.
+ * Everywhere else — the pure coverage guard, the unauthenticated public renderer,
+ * a marketing site importing `@arbidocs/blocks/site` — the context is empty and
+ * `src` renders verbatim. Importing the resolver here instead would drag the SDK
+ * into every website block: a dead code path still pins the module graph, because
+ * neither kit package declares `sideEffects`.
+ *
+ * Refs are **explicitly prefixed** (`asset:`) rather than bare ext_ids so the
+ * publish walk can distinguish an image source from any other token-like prop
+ * (block ids, `"left"`, icon names…) with zero false positives.
+ */
+import { type ComponentType, type ReactNode } from 'react';
+/** Marks a stored image value as a workspace asset ref rather than a URL. */
+export declare const ASSET_REF_PREFIX = "asset:";
+/** Wrap a workspace document ext_id as a storable asset ref. */
+export declare function asAssetRef(docId: string): string;
+/** The workspace document ext_id behind an asset ref (`asset:doc-1` → `doc-1`). */
+export declare function assetRefId(src: string): string;
+/** What a resolver component receives. `AssetThumb` in `./assetImage` implements it. */
+export interface AssetRenderProps {
+    docId: string;
+    alt?: string;
+    className?: string;
+    testId?: string;
+}
+/** Renders a workspace asset ext_id as an image. */
+export type AssetRenderer = ComponentType<AssetRenderProps>;
+/**
+ * The injected resolver, or `null` where asset refs cannot be resolved (the
+ * public renderer, tests, any unauthenticated page).
+ */
+export declare const AssetResolverContext: import("react").Context<AssetRenderer | null>;
+export declare function AssetResolverProvider({ render, children, }: {
+    /** Typically `AssetThumb` from `./assetImage`. */
+    render: AssetRenderer;
+    children: ReactNode;
+}): import("react").JSX.Element;
+/** The active resolver, or `null` when asset refs must render verbatim. */
+export declare function useAssetRenderer(): AssetRenderer | null;
+/** True only where a bare asset ext_id can be resolved (the authenticated Studio). */
+export declare function useAssetResolverActive(): boolean;
+/**
+ * Is `src` a workspace asset ref (`asset:<docId>`) rather than an already-
+ * renderable URL / `data:` URI? Only prefixed refs need resolution.
+ */
+export declare function isAssetRef(src: string | undefined): src is string;

package/dist/components/blockLink.d.ts

@@ -0,0 +1,26 @@
+import type { AnchorHTMLAttributes, ComponentType, ReactNode } from 'react';
+/**
+ * Firm-agnostic link injection for marketing blocks. A card that navigates to a
+ * detail page renders an internal `<a href>` by default, but a consuming app can
+ * inject its router's link (e.g. react-router's `Link`, adapted to `href`) via
+ * `linkComponent` so navigation stays in-SPA. When no `href` is given the block
+ * renders its children unwrapped, so this is fully opt-in and backward compatible.
+ */
+export type BlockLinkRenderProps = Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href'> & {
+    href: string;
+    className?: string;
+    children: ReactNode;
+};
+/**
+ * The host's link. Interactive blocks (nav rows, tiles, cards) pass anchor attributes beyond
+ * `href` (`onClick`, `aria-current`, `data-*`, a `ref`), so an adapter should forward unknown
+ * props to its anchor, as react-router's `Link` does.
+ */
+export type BlockLinkComponent = ComponentType<BlockLinkRenderProps>;
+export interface BlockLinkProps {
+    href?: string;
+    linkComponent?: BlockLinkComponent;
+    className?: string;
+    children: ReactNode;
+}
+export declare function BlockLink({ href, linkComponent: Link, className, children }: BlockLinkProps): import("react").JSX.Element;

package/dist/components/editorial/ArticleList.d.ts

@@ -0,0 +1,32 @@
+import type { ReactNode } from 'react';
+import { type BlockLinkComponent } from '../blockLink';
+export interface ArticleItem {
+    title: ReactNode;
+    summary?: ReactNode;
+    /** Category or type, shown as an accent label. */
+    kicker?: ReactNode;
+    /** Short facts joined with a middle dot: author, date, reading time. */
+    meta?: ReactNode[];
+    href?: string;
+    imageUrl?: string;
+    imageAlt?: string;
+    testId?: string;
+}
+export interface ArticleListProps {
+    items: ArticleItem[];
+    /**
+     * `cards`: a grid of cards. `rows`: ruled rows (kicker and meta beside the title), best for an
+     * archive.
+     */
+    layout?: 'cards' | 'rows';
+    /** `cards` only: the first item is a large card beside a column of the rest from `lg`. */
+    featureFirst?: boolean;
+    columns?: 2 | 3;
+    linkComponent?: BlockLinkComponent;
+    /** Rendered instead of the list when `items` is empty. */
+    empty?: ReactNode;
+    className?: string;
+    testId?: string;
+}
+/** Article, insight or news items as cards (optionally with a lead card) or ruled archive rows. */
+export declare function ArticleList({ items, layout, featureFirst, columns, linkComponent, empty, className, testId, }: ArticleListProps): import("react").JSX.Element | null;

package/dist/components/editorial/Bands.d.ts

@@ -0,0 +1,29 @@
+import type { ReactNode } from 'react';
+import { type EditorialSurface } from './EditorialHero';
+export interface ProofStripProps {
+    /** The lead statement (an icon and a sentence). */
+    lead?: ReactNode;
+    /** Short labels: standards, memberships, clients. */
+    items: ReactNode[];
+    /** Accessible name of the label list. */
+    label?: string;
+    surface?: EditorialSurface;
+    className?: string;
+    testId?: string;
+}
+/** A thin band of proof points: a lead statement and a row of short uppercase labels. */
+export declare function ProofStrip({ lead, items, label, surface, className, testId, }: ProofStripProps): import("react").JSX.Element;
+export interface CtaBandProps {
+    title: ReactNode;
+    lead?: ReactNode;
+    /** Buttons or links. */
+    actions?: ReactNode;
+    /** Decoration behind the copy (image, texture), hidden from assistive tech. */
+    backdrop?: ReactNode;
+    /** Default `inverse`: a dark closing band. */
+    surface?: EditorialSurface;
+    className?: string;
+    testId?: string;
+}
+/** Closing call-to-action band: centred heading, lead and actions over an optional backdrop. */
+export declare function CtaBand({ title, lead, actions, backdrop, surface, className, testId, }: CtaBandProps): import("react").JSX.Element;

package/dist/components/editorial/EditorialHeading.d.ts

@@ -0,0 +1,17 @@
+import type { ReactNode } from 'react';
+import { type EditorialTone } from './tone';
+export interface EditorialHeadingProps {
+    eyebrow?: ReactNode;
+    /** Section number or label shown with the eyebrow. */
+    index?: number | string;
+    title: ReactNode;
+    lead?: ReactNode;
+    /** Heading element level (default 2). */
+    level?: 1 | 2 | 3;
+    align?: 'start' | 'center';
+    tone?: EditorialTone;
+    className?: string;
+    testId?: string;
+}
+/** Section heading: numbered or labelled eyebrow, display title and lead. */
+export declare function EditorialHeading({ eyebrow, index, title, lead, level, align, tone, className, testId, }: EditorialHeadingProps): import("react").JSX.Element;

package/dist/components/editorial/EditorialHero.d.ts

@@ -0,0 +1,46 @@
+import type { ReactNode } from 'react';
+import { type EditorialTone } from './tone';
+export type EditorialSurface = 'plain' | 'muted' | 'inverse';
+export interface EditorialHeroTestIds {
+    root: string;
+    eyebrow: string;
+    title: string;
+    lede: string;
+    actions: string;
+    aside: string;
+}
+export interface EditorialHeroProps {
+    eyebrow?: ReactNode;
+    /** Show the accent rule before the eyebrow. */
+    eyebrowRule?: boolean;
+    /** The headline: text or any node. */
+    title: ReactNode;
+    /** A phrase inside a string `title` set in the italic accent. */
+    emphasis?: string;
+    /** The paragraph under the headline. */
+    lede?: ReactNode;
+    /** Buttons or links under the lede. */
+    actions?: ReactNode;
+    /** Anything under the actions (badges, a trust line). */
+    footer?: ReactNode;
+    /** The figure beside (below on phones) the copy: an image frame, a card, a media slot. */
+    aside?: ReactNode;
+    /** Decoration behind the copy (texture, wash, background image). Hidden from assistive tech. */
+    backdrop?: ReactNode;
+    /** `start` copy, or `center` (no aside). */
+    align?: 'start' | 'center';
+    /** `page`: a page-opening header band. `cover`: the larger home-page hero. */
+    size?: 'page' | 'cover';
+    surface?: EditorialSurface;
+    className?: string;
+    testId?: string;
+    testIds?: Partial<EditorialHeroTestIds>;
+}
+export declare const SURFACE_CLASS: Record<EditorialSurface, string>;
+export declare const SURFACE_TONE: Record<EditorialSurface, EditorialTone>;
+/**
+ * Editorial opening band: eyebrow, display headline with an italic accent phrase, lede, actions
+ * and an optional aside (image, card). Covers a page header (no aside, `size="page"`), a split
+ * hero (aside) and a centred landing hero (`align="center"`, `size="cover"`).
+ */
+export declare function EditorialHero({ eyebrow, eyebrowRule, title, emphasis, lede, actions, footer, aside, backdrop, align, size, surface, className, testId, testIds, }: EditorialHeroProps): import("react").JSX.Element;

package/dist/components/editorial/EditorialSection.d.ts

@@ -0,0 +1,47 @@
+import type { ReactNode } from 'react';
+import { type EditorialSurface } from './EditorialHero';
+export interface EditorialSectionProps {
+    id?: string;
+    eyebrow?: ReactNode;
+    /** Section number or label: `1` renders `01`. */
+    index?: number | string;
+    title?: ReactNode;
+    lead?: ReactNode;
+    /** Sits beside the heading from `sm` up (a "see all" link or button). */
+    action?: ReactNode;
+    /**
+     * `stacked`: heading above the content. `split`: heading column beside the content from `lg`.
+     * `split-wide`: the same with a wider content column.
+     */
+    layout?: 'stacked' | 'split' | 'split-wide';
+    /** `plain`, `muted` (tinted band) or `inverse` (dark band on a light theme). */
+    surface?: EditorialSurface;
+    /** Hairline above and below the band. */
+    bordered?: boolean;
+    /** Vertical rhythm. */
+    spacing?: 'md' | 'lg';
+    /** Backdrop behind the content (texture, image), hidden from assistive tech. */
+    backdrop?: ReactNode;
+    /** Accessible name when there is no `title`. */
+    'aria-label'?: string;
+    children?: ReactNode;
+    className?: string;
+    testId?: string;
+}
+/**
+ * A page band: numbered or labelled heading, optional action, and content stacked below or in a
+ * second column. Sets the tone for the parts inside it, so the same list or panel grid reads on
+ * a plain, tinted or inverse band.
+ */
+export declare function EditorialSection({ id, eyebrow, index, title, lead, action, layout, surface, bordered, spacing, backdrop, 'aria-label': ariaLabel, children, className, testId, }: EditorialSectionProps): import("react").JSX.Element;
+export interface EditorialProseProps {
+    /** One entry per paragraph. */
+    paragraphs: ReactNode[];
+    /** Two columns from `md` up (paragraphs never split across columns). */
+    columns?: 1 | 2;
+    size?: 'base' | 'lg';
+    className?: string;
+    testId?: string;
+}
+/** Long-form paragraphs set at a readable measure, in one or two columns. */
+export declare function EditorialProse({ paragraphs, columns, size, className, testId, }: EditorialProseProps): import("react").JSX.Element;

package/dist/components/editorial/Eyebrow.d.ts

@@ -0,0 +1,14 @@
+import type { ReactNode } from 'react';
+import { type EditorialTone } from './tone';
+export interface EyebrowProps {
+    children: ReactNode;
+    /** A number or label before the text: `1` renders `01`. */
+    index?: number | string;
+    /** A short accent rule before the text. */
+    rule?: boolean;
+    tone?: EditorialTone;
+    className?: string;
+    testId?: string;
+}
+/** Small uppercase label above a heading: optional index and accent rule. */
+export declare function Eyebrow({ children, index, rule, tone, className, testId }: EyebrowProps): import("react").JSX.Element;

package/dist/components/editorial/PanelGrid.d.ts

@@ -0,0 +1,45 @@
+import type { ReactNode } from 'react';
+import { type BlockLinkComponent } from '../blockLink';
+import { type EditorialTone } from './tone';
+export interface PanelItem {
+    title: ReactNode;
+    body?: ReactNode;
+    /** Icon in a bordered tile. */
+    icon?: ReactNode;
+    /** Explicit number or label; with `numbered` on the grid it defaults to the position. */
+    index?: number | string;
+    /** A small label above the title (category). */
+    kicker?: ReactNode;
+    /** Bulleted points under the body. */
+    points?: ReactNode[];
+    /** Chips at the foot. */
+    tags?: string[];
+    /** Anything at the foot (a meta line, a link). */
+    footer?: ReactNode;
+    /** Makes the whole panel a link. */
+    href?: string;
+    testId?: string;
+}
+export interface PanelGridProps {
+    items: PanelItem[];
+    columns?: 2 | 3 | 4;
+    /** `cards`: separate bordered panels. `joined`: one hairline-ruled table of cells. */
+    variant?: 'cards' | 'joined';
+    /** Number the panels 01, 02, ... */
+    numbered?: boolean;
+    /** Fade each panel in on scroll, staggered. */
+    reveal?: boolean;
+    /** Router link for panels with an `href`. */
+    linkComponent?: BlockLinkComponent;
+    /** Heading level of the panel titles (default 3). */
+    headingLevel?: 2 | 3 | 4;
+    tone?: EditorialTone;
+    className?: string;
+    testId?: string;
+}
+/**
+ * Icon, title and body panels: principles, process steps, capability cards, security pillars,
+ * practice areas. Cards or a joined hairline table, optional numbers, bullet points, chips and
+ * a link per panel.
+ */
+export declare function PanelGrid({ items, columns, variant, numbered, reveal, linkComponent, headingLevel, tone, className, testId, }: PanelGridProps): import("react").JSX.Element;

package/dist/components/editorial/ProfileCard.d.ts

@@ -0,0 +1,27 @@
+import type { ReactNode } from 'react';
+import { type BlockLinkComponent } from '../blockLink';
+export interface ProfileCardProps {
+    name: string;
+    role?: string;
+    /** An accent line under the role (practice, team). */
+    kicker?: string;
+    bio?: string;
+    avatarUrl?: string;
+    /** Replaces the avatar (a photo frame, a monogram). */
+    avatar?: ReactNode;
+    /** Extra classes of the avatar fallback, e.g. a host tint. */
+    avatarClassName?: string;
+    /** Chips, links or stats under the bio, pinned to the card foot. */
+    meta?: ReactNode;
+    /** Makes the whole card a link to the profile. */
+    href?: string;
+    linkComponent?: BlockLinkComponent;
+    /** Lines of bio shown before truncation (0 shows it all). */
+    bioLines?: 0 | 2 | 3 | 4;
+    /** Heading level of the name (default 3). */
+    headingLevel?: 2 | 3 | 4;
+    className?: string;
+    testId?: string;
+}
+/** A person's card: avatar, name, role, kicker, clamped bio and a meta slot. */
+export declare function ProfileCard({ name, role, kicker, bio, avatarUrl, avatar, avatarClassName, meta, href, linkComponent, bioLines, headingLevel, className, testId, }: ProfileCardProps): import("react").JSX.Element;

package/dist/components/editorial/PullQuote.d.ts

@@ -0,0 +1,17 @@
+import type { ReactNode } from 'react';
+export interface PullQuoteProps {
+    quote: ReactNode;
+    /** Who said it. */
+    attribution?: {
+        name: ReactNode;
+        role?: ReactNode;
+    };
+    /** Link to the source. */
+    cite?: string;
+    align?: 'start' | 'center';
+    size?: 'md' | 'lg';
+    className?: string;
+    testId?: string;
+}
+/** A large display quotation with an accent rule and attribution. */
+export declare function PullQuote({ quote, attribution, cite, align, size, className, testId, }: PullQuoteProps): import("react").JSX.Element;

package/dist/components/editorial/Reveal.d.ts

@@ -0,0 +1,15 @@
+import { type ReactNode } from 'react';
+export interface RevealProps {
+    children: ReactNode;
+    /** Delay in ms before the reveal starts (stagger siblings with `index * 90`). */
+    delay?: number;
+    className?: string;
+    testId?: string;
+}
+/**
+ * Fade-and-rise on first scroll into view. Content is fully visible until the part has mounted
+ * and found an `IntersectionObserver`, so server rendering, no-JS and jsdom show everything; the
+ * hidden state and transition live in `blocks.css` (`[data-reveal]`) and collapse under
+ * `prefers-reduced-motion`.
+ */
+export declare function Reveal({ children, delay, className, testId }: RevealProps): import("react").JSX.Element;