@orangecheck/design 0.7.0 → 0.7.2

package/dist/composites.d.mts

@@ -46,6 +46,20 @@ declare function StatTile({ children, ...item }: StatItem & {
     children?: ReactNode;
 }): react_jsx_runtime.JSX.Element;
 
+interface StatCardProps {
+    label: string;
+    value: ReactNode;
+    sub?: ReactNode;
+    delta?: {
+        value: number;
+        suffix?: string;
+    } | null;
+    tone?: 'default' | 'success' | 'warning' | 'destructive';
+    pad?: 'sm' | 'default';
+    className?: string;
+}
+declare function StatCard({ pad, className, ...stat }: StatCardProps): react_jsx_runtime.JSX.Element;
+
 interface HelpHintProps {
     title?: string;
     children: ReactNode;
@@ -85,4 +99,4 @@ interface DataRowProps {
 }
 declare function DataRow({ children, meta, action, as, className }: DataRowProps): react_jsx_runtime.JSX.Element;
 
-export { Callout, type CalloutProps, type CalloutTone, DataRow, type DataRowProps, type DefinitionItem, DefinitionList, type DefinitionListProps, EmptyState, type EmptyStateCta, type EmptyStateProps, HelpHint, type HelpHintProps, SectionHeader, type SectionHeaderProps, StatGrid, type StatGridProps, type StatItem, StatTile };
+export { Callout, type CalloutProps, type CalloutTone, DataRow, type DataRowProps, type DefinitionItem, DefinitionList, type DefinitionListProps, EmptyState, type EmptyStateCta, type EmptyStateProps, HelpHint, type HelpHintProps, SectionHeader, type SectionHeaderProps, StatCard, type StatCardProps, StatGrid, type StatGridProps, type StatItem, StatTile };

package/dist/composites.d.ts

@@ -46,6 +46,20 @@ declare function StatTile({ children, ...item }: StatItem & {
     children?: ReactNode;
 }): react_jsx_runtime.JSX.Element;
 
+interface StatCardProps {
+    label: string;
+    value: ReactNode;
+    sub?: ReactNode;
+    delta?: {
+        value: number;
+        suffix?: string;
+    } | null;
+    tone?: 'default' | 'success' | 'warning' | 'destructive';
+    pad?: 'sm' | 'default';
+    className?: string;
+}
+declare function StatCard({ pad, className, ...stat }: StatCardProps): react_jsx_runtime.JSX.Element;
+
 interface HelpHintProps {
     title?: string;
     children: ReactNode;
@@ -85,4 +99,4 @@ interface DataRowProps {
 }
 declare function DataRow({ children, meta, action, as, className }: DataRowProps): react_jsx_runtime.JSX.Element;
 
-export { Callout, type CalloutProps, type CalloutTone, DataRow, type DataRowProps, type DefinitionItem, DefinitionList, type DefinitionListProps, EmptyState, type EmptyStateCta, type EmptyStateProps, HelpHint, type HelpHintProps, SectionHeader, type SectionHeaderProps, StatGrid, type StatGridProps, type StatItem, StatTile };
+export { Callout, type CalloutProps, type CalloutTone, DataRow, type DataRowProps, type DefinitionItem, DefinitionList, type DefinitionListProps, EmptyState, type EmptyStateCta, type EmptyStateProps, HelpHint, type HelpHintProps, SectionHeader, type SectionHeaderProps, StatCard, type StatCardProps, StatGrid, type StatGridProps, type StatItem, StatTile };

package/dist/composites.js

@@ -191,6 +191,34 @@ function StatTile({ children, ...item }) {
     children
   ] });
 }
+function StatBlock({ label, value, sub, delta, tone = "default", className }) {
+  const toneClass = tone === "success" ? "text-success" : tone === "warning" ? "text-warning" : tone === "destructive" ? "text-destructive" : "text-foreground";
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-1", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "label-mono text-[10px]", children: label }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("font-display text-2xl leading-none", toneClass), children: value }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline gap-2", children: [
+      sub && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground font-mono text-[11px] tracking-wide lowercase", children: sub }),
+      delta && /* @__PURE__ */ jsxRuntime.jsxs(
+        "span",
+        {
+          className: cn(
+            "font-mono text-[11px] tracking-wide",
+            delta.value > 0 ? "text-success" : delta.value < 0 ? "text-destructive" : "text-muted-foreground"
+          ),
+          children: [
+            delta.value > 0 ? "\u25B2" : delta.value < 0 ? "\u25BC" : "\xB7",
+            " ",
+            Math.abs(delta.value).toFixed(1),
+            delta.suffix ?? "%"
+          ]
+        }
+      )
+    ] })
+  ] });
+}
+function StatCard({ pad = "default", className, ...stat }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("border bg-card", pad === "sm" ? "p-3 md:p-4" : "p-5", className), children: /* @__PURE__ */ jsxRuntime.jsx(StatBlock, { ...stat }) });
+}
 var FRAME = {
   info: "border-primary/30 bg-primary/5",
   warning: "border-warning/40 bg-warning/5",
@@ -262,6 +290,7 @@ exports.DefinitionList = DefinitionList;
 exports.EmptyState = EmptyState;
 exports.HelpHint = HelpHint;
 exports.SectionHeader = SectionHeader;
+exports.StatCard = StatCard;
 exports.StatGrid = StatGrid;
 exports.StatTile = StatTile;
 //# sourceMappingURL=composites.js.map

package/dist/composites.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/tokens/cn.ts","../src/primitives/popover.tsx","../src/composites/help-hint.tsx","../src/composites/section-header.tsx","../src/composites/empty-state.tsx","../src/composites/stat-grid.tsx","../src/composites/callout.tsx","../src/composites/definition-list.tsx","../src/composites/data-row.tsx"],"names":["twMerge","clsx","PopoverPrimitive","jsx","HelpCircle","jsxs","TONE_CLASS","Link","Fragment"],"mappings":"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","file":"composites.js","sourcesContent":["import type { ClassValue } from 'clsx';\n\nimport { clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\n/**\n * Canonical class-name merge for the OrangeCheck family.\n * `clsx` for conditional composition, `tailwind-merge` to resolve\n * conflicting Tailwind utilities (last-wins by property).\n */\nexport function cn(...inputs: ClassValue[]): string {\n    return twMerge(clsx(inputs));\n}\n","'use client';\n\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport * as React from 'react';\n\nimport { cn } from '../tokens/cn';\n\nfunction Popover({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Root>) {\n    return <PopoverPrimitive.Root data-slot=\"popover\" {...props} />;\n}\n\nfunction PopoverTrigger({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {\n    return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />;\n}\n\nfunction PopoverContent({\n    className,\n    align = 'center',\n    sideOffset = 4,\n    ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Content>) {\n    return (\n        <PopoverPrimitive.Portal>\n            <PopoverPrimitive.Content\n                data-slot=\"popover-content\"\n                align={align}\n                sideOffset={sideOffset}\n                className={cn(\n                    'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden',\n                    className\n                )}\n                {...props}\n            />\n        </PopoverPrimitive.Portal>\n    );\n}\n\nfunction PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {\n    return <PopoverPrimitive.Anchor data-slot=\"popover-anchor\" {...props} />;\n}\n\nexport { Popover, PopoverTrigger, PopoverContent, PopoverAnchor };\n","'use client';\n\nimport { HelpCircle } from 'lucide-react';\nimport type { ReactNode } from 'react';\n\nimport { Popover, PopoverContent, PopoverTrigger } from '../primitives/popover';\nimport { cn } from '../tokens/cn';\n\nexport interface HelpHintProps {\n    /** Optional bold heading inside the popover. */\n    title?: string;\n    /** The help body — short prose explaining a term or control. */\n    children: ReactNode;\n    /** Which side the popover opens toward. */\n    side?: 'top' | 'bottom' | 'left' | 'right';\n    /** Accessible label for the trigger (defaults to \"more information\"). */\n    label?: string;\n    className?: string;\n}\n\n/**\n * HelpHint — the inline \"?\" affordance for term-level guidance, lifted from\n * oc-me-web's `me/ui/HelpHint`. Built on Popover (not a hover tooltip) so it\n * works on touch and can hold a title plus a paragraph of prose. This is the\n * keystone that lets SectionHeader carry an optional `hint` without every\n * site re-authoring its own help icon.\n */\nexport function HelpHint({\n    title,\n    children,\n    side = 'bottom',\n    label = 'more information',\n    className,\n}: HelpHintProps) {\n    return (\n        <Popover>\n            <PopoverTrigger\n                aria-label={label}\n                className={cn(\n                    'text-muted-foreground/60 hover:text-foreground inline-flex size-3.5 items-center justify-center align-middle transition-colors outline-none focus-visible:ring-2 focus-visible:ring-ring',\n                    className\n                )}\n            >\n                <HelpCircle className=\"size-3.5\" aria-hidden />\n            </PopoverTrigger>\n            <PopoverContent side={side} className=\"w-72 space-y-1.5\">\n                {title && (\n                    <p className=\"label-mono text-foreground text-[10px]\">{title}</p>\n                )}\n                <div className=\"text-muted-foreground text-xs leading-relaxed\">{children}</div>\n            </PopoverContent>\n        </Popover>\n    );\n}\n","import type { ReactNode } from 'react';\n\nimport { HelpHint } from './help-hint';\n\nexport interface SectionHeaderProps {\n    /** Plain section name — rendered after a \"§ \" glyph in label-mono. */\n    label: string;\n    /** Optional right-side string (count, \"most recent first\"). */\n    meta?: ReactNode;\n    /** When provided, renders an inline HelpHint \"?\" next to the label. */\n    hint?: { title?: string; body: ReactNode; side?: 'top' | 'bottom' | 'left' | 'right' };\n    tone?: 'primary' | 'muted' | 'warning' | 'success' | 'destructive';\n    className?: string;\n}\n\nconst TONE_CLASS = {\n    primary: 'text-primary',\n    muted: 'text-muted-foreground',\n    warning: 'text-warning',\n    success: 'text-success',\n    destructive: 'text-destructive',\n} as const;\n\n/**\n * SectionHeader — the canonical \"§ x\" section header used across every\n * /me, /vault, and /fleet dashboard surface. Lifted from oc-me-web's\n * `me/ui/SectionHeader` so the visual contract stays single-source.\n *\n * Pattern is `label-mono text-primary mb-3` with a \"§ \" glyph followed by\n * the label, plus an optional muted/uppercase right-side meta string.\n */\nexport function SectionHeader({\n    label,\n    meta,\n    hint,\n    tone = 'primary',\n    className = '',\n}: SectionHeaderProps) {\n    return (\n        <div className={`mb-3 flex items-baseline justify-between gap-2 ${className}`}>\n            <div className=\"flex items-center gap-1.5\">\n                <div className={`label-mono ${TONE_CLASS[tone]}`}>§ {label}</div>\n                {hint && (\n                    <HelpHint title={hint.title} side={hint.side ?? 'bottom'}>\n                        {hint.body}\n                    </HelpHint>\n                )}\n            </div>\n            {meta && (\n                <span className=\"text-muted-foreground/70 font-mono text-[10px] tracking-widest uppercase\">\n                    {meta}\n                </span>\n            )}\n        </div>\n    );\n}\n","import Link from 'next/link';\nimport type { ReactNode } from 'react';\n\nexport interface EmptyStateCta {\n    label: string;\n    href: string;\n    /** External links open in a new tab and get a ↗ glyph. */\n    external?: boolean;\n}\n\nexport interface EmptyStateProps {\n    /** Short heading — one mono-uppercased label like \"no entries yet\". */\n    label: string;\n    /** Body — short prose explaining what would appear here and how. */\n    children: ReactNode;\n    cta?: EmptyStateCta;\n    secondary?: EmptyStateCta;\n    tone?: 'info' | 'warning' | 'muted';\n    className?: string;\n}\n\nconst TONE_CLASS = {\n    info: 'border-primary/30 bg-primary/5',\n    warning: 'border-warning/40 bg-warning/5',\n    muted: 'border-border bg-muted/20',\n} as const;\n\nconst LABEL_TONE_CLASS = {\n    info: 'text-primary',\n    warning: 'text-warning',\n    muted: 'text-muted-foreground',\n} as const;\n\n/**\n * EmptyState — the canonical empty-state card used across every /me,\n * /vault, and /fleet dashboard. Empty states should *teach*: explain what\n * would appear, and how to make it appear. Lifted from oc-me-web's\n * `me/ui/EmptyState`.\n */\nexport function EmptyState({\n    label,\n    children,\n    cta,\n    secondary,\n    tone = 'info',\n    className = '',\n}: EmptyStateProps) {\n    return (\n        <div className={`border p-5 md:p-6 ${TONE_CLASS[tone]} ${className}`}>\n            <div className={`label-mono mb-2 ${LABEL_TONE_CLASS[tone]}`}>§ {label}</div>\n            <div className=\"text-foreground/85 max-w-2xl text-sm leading-relaxed\">{children}</div>\n            {(cta || secondary) && (\n                <div className=\"mt-4 flex flex-wrap gap-3\">\n                    {cta && <CtaLink {...cta} variant=\"primary\" />}\n                    {secondary && <CtaLink {...secondary} variant=\"secondary\" />}\n                </div>\n            )}\n        </div>\n    );\n}\n\nfunction CtaLink({\n    label,\n    href,\n    external,\n    variant,\n}: EmptyStateCta & { variant: 'primary' | 'secondary' }) {\n    const cls =\n        variant === 'primary'\n            ? 'bg-primary text-primary-foreground hover:bg-primary/90 inline-flex h-9 items-center justify-center rounded-md px-4 font-mono text-[11px] font-semibold tracking-widest uppercase'\n            : 'text-muted-foreground hover:text-foreground border-input hover:bg-accent inline-flex h-9 items-center justify-center rounded-md border px-4 font-mono text-[11px] tracking-widest uppercase';\n    const text = external ? `${label} ↗` : label;\n    if (external) {\n        return (\n            <a href={href} target=\"_blank\" rel=\"noreferrer\" className={cls}>\n                {text}\n            </a>\n        );\n    }\n    return (\n        <Link href={href} className={cls}>\n            {text}\n        </Link>\n    );\n}\n","import type { ReactNode } from 'react';\n\nexport interface StatItem {\n    /** Short uppercased label rendered in mono. */\n    label: string;\n    /** Primary value · already formatted as a string. */\n    value: string;\n    /** Optional secondary line · USD conversion, \"last 30 days\", etc. */\n    sub?: string;\n    /** When true, value is rendered in primary tone (use for headline metric). */\n    accent?: boolean;\n    /** Optional tone for the value (overrides accent). */\n    tone?: 'default' | 'primary' | 'success' | 'warning' | 'destructive' | 'muted';\n}\n\nexport interface StatGridProps {\n    items: StatItem[];\n    columns?: 1 | 2 | 3 | 4;\n    className?: string;\n}\n\nconst TONE_CLASS = {\n    default: '',\n    primary: 'text-primary',\n    success: 'text-success',\n    warning: 'text-warning',\n    destructive: 'text-destructive',\n    muted: 'text-muted-foreground',\n} as const;\n\nconst COL_CLASS = {\n    1: '',\n    2: 'md:grid-cols-2',\n    3: 'md:grid-cols-3',\n    4: 'md:grid-cols-2 lg:grid-cols-4',\n} as const;\n\n/**\n * StatGrid — the canonical stats row used across family dashboards.\n * Lifted from oc-me-web's `me/ui/StatGrid`. Grid of equal-width tiles\n * separated by 1px borders. Always pre-format the value string —\n * the component does no number formatting.\n */\nexport function StatGrid({ items, columns = 3, className = '' }: StatGridProps) {\n    return (\n        <div className={`bg-border grid gap-px border ${COL_CLASS[columns]} ${className}`}>\n            {items.map((it, i) => (\n                <Tile key={`${it.label}-${i}`} item={it} />\n            ))}\n        </div>\n    );\n}\n\nfunction Tile({ item }: { item: StatItem }) {\n    const tone = item.tone ?? (item.accent ? 'primary' : 'default');\n    return (\n        <div className=\"bg-background p-5\">\n            <div className=\"text-muted-foreground/80 font-mono text-[10px] tracking-widest uppercase\">\n                {item.label}\n            </div>\n            <div\n                className={`font-display mt-1 text-2xl font-bold tabular-nums tracking-tight ${TONE_CLASS[tone]}`}\n            >\n                {item.value}\n            </div>\n            {item.sub && (\n                <div className=\"text-muted-foreground/70 mt-1 font-mono text-[10px] tracking-widest uppercase\">\n                    {item.sub}\n                </div>\n            )}\n        </div>\n    );\n}\n\nexport function StatTile({ children, ...item }: StatItem & { children?: ReactNode }) {\n    return (\n        <div>\n            <Tile item={item} />\n            {children}\n        </div>\n    );\n}\n","import type { ReactNode } from 'react';\n\nimport { cn } from '../tokens/cn';\n\nexport type CalloutTone = 'info' | 'warning' | 'destructive' | 'success' | 'muted';\n\nexport interface CalloutProps {\n    tone?: CalloutTone;\n    /** Optional \"§ \"-prefixed mono header. */\n    label?: string;\n    /** Optional leading icon, sized by the caller (e.g. lucide `size-4`). */\n    icon?: ReactNode;\n    /** Body content. */\n    children: ReactNode;\n    /** Optional trailing action (button / link) pinned to the bottom. */\n    action?: ReactNode;\n    className?: string;\n}\n\nconst FRAME: Record<CalloutTone, string> = {\n    info: 'border-primary/30 bg-primary/5',\n    warning: 'border-warning/40 bg-warning/5',\n    destructive: 'border-destructive/40 bg-destructive/5',\n    success: 'border-success/40 bg-success/5',\n    muted: 'border-border bg-muted/20',\n};\n\nconst LABEL: Record<CalloutTone, string> = {\n    info: 'text-primary',\n    warning: 'text-warning',\n    destructive: 'text-destructive',\n    success: 'text-success',\n    muted: 'text-muted-foreground',\n};\n\n/**\n * Callout — the canonical toned panel (`border-{tone}/40 bg-{tone}/5` + an\n * optional `label-mono` header) reimplemented across stamp, pledge, vote,\n * analytics, and me (HealthBanner / SimulationBanner / FrozenBanner /\n * DangerZone, etc.). One component, five tones. For empty-states with CTAs use\n * EmptyState; for inline term help use HelpHint; this is the general\n * notice/banner frame.\n */\nexport function Callout({ tone = 'info', label, icon, children, action, className }: CalloutProps) {\n    return (\n        <div className={cn('border p-4 md:p-5', FRAME[tone], className)}>\n            {label && (\n                <div className={cn('label-mono mb-2 flex items-center gap-1.5', LABEL[tone])}>\n                    {icon}\n                    <span>§ {label}</span>\n                </div>\n            )}\n            <div className=\"text-foreground/85 text-sm leading-relaxed\">\n                {!label && icon ? (\n                    <span className={cn('mr-2 inline-flex align-middle', LABEL[tone])}>{icon}</span>\n                ) : null}\n                {children}\n            </div>\n            {action && <div className=\"mt-3 flex flex-wrap gap-3\">{action}</div>}\n        </div>\n    );\n}\n","import { Fragment, type ReactNode } from 'react';\n\nimport { cn } from '../tokens/cn';\n\nexport interface DefinitionItem {\n    label: ReactNode;\n    value: ReactNode;\n}\n\nexport interface DefinitionListProps {\n    items: DefinitionItem[];\n    className?: string;\n}\n\n/**\n * DefinitionList — the mono-label / value `<dl>` grid reimplemented in agent's\n * inspector, vote's reveal page, and me (BondAnchorCard, OperatorIdentityCard,\n * FrozenBanner). Labels render in uppercase mono; values align in a second\n * column on wider viewports, stacking on narrow ones. Long values (hashes,\n * addresses) wrap via `break-all`.\n */\nexport function DefinitionList({ items, className }: DefinitionListProps) {\n    return (\n        <dl\n            className={cn(\n                'grid gap-x-5 gap-y-2 text-sm sm:grid-cols-[auto_1fr] sm:items-baseline',\n                className\n            )}\n        >\n            {items.map((item, i) => (\n                <Fragment key={i}>\n                    <dt className=\"label-mono text-muted-foreground text-[10px]\">{item.label}</dt>\n                    <dd className=\"text-foreground font-mono text-xs break-all\">{item.value}</dd>\n                </Fragment>\n            ))}\n        </dl>\n    );\n}\n","import type { ElementType, ReactNode } from 'react';\n\nimport { cn } from '../tokens/cn';\n\nexport interface DataRowProps {\n    /** Primary content (left-aligned, grows to fill). */\n    children: ReactNode;\n    /** Trailing metadata pinned right (timestamp, count, status pill). */\n    meta?: ReactNode;\n    /** Optional action(s) rendered after the meta (button, link). */\n    action?: ReactNode;\n    /** Element to render as — `li` inside a list, `div` otherwise. */\n    as?: ElementType;\n    className?: string;\n}\n\n/**\n * DataRow — the \"content left, meta right, optional action\" list row\n * reimplemented across me (federations, incidents, grants, distributions,\n * fee entries) and other dashboards. Pair inside a `divide-y border` list.\n * On narrow viewports content and meta stack; from `sm` up they sit on one\n * baseline-aligned line.\n */\nexport function DataRow({ children, meta, action, as, className }: DataRowProps) {\n    const Tag = (as ?? 'div') as ElementType;\n    return (\n        <Tag\n            className={cn(\n                'flex flex-col gap-1 py-3 sm:flex-row sm:items-baseline sm:justify-between sm:gap-4',\n                className\n            )}\n        >\n            <div className=\"min-w-0 flex-1\">{children}</div>\n            {(meta || action) && (\n                <div className=\"flex shrink-0 items-center gap-3 sm:justify-end\">\n                    {meta && (\n                        <span className=\"text-muted-foreground font-mono text-[11px] tracking-wide\">\n                            {meta}\n                        </span>\n                    )}\n                    {action}\n                </div>\n            )}\n        </Tag>\n    );\n}\n"]}
+{"version":3,"sources":["../src/tokens/cn.ts","../src/primitives/popover.tsx","../src/composites/help-hint.tsx","../src/composites/section-header.tsx","../src/composites/empty-state.tsx","../src/composites/stat-grid.tsx","../src/primitives/stat-block.tsx","../src/composites/stat-card.tsx","../src/composites/callout.tsx","../src/composites/definition-list.tsx","../src/composites/data-row.tsx"],"names":["twMerge","clsx","PopoverPrimitive","jsx","HelpCircle","jsxs","TONE_CLASS","Link","Fragment"],"mappings":"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","file":"composites.js","sourcesContent":["import type { ClassValue } from 'clsx';\n\nimport { clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\n/**\n * Canonical class-name merge for the OrangeCheck family.\n * `clsx` for conditional composition, `tailwind-merge` to resolve\n * conflicting Tailwind utilities (last-wins by property).\n */\nexport function cn(...inputs: ClassValue[]): string {\n    return twMerge(clsx(inputs));\n}\n","'use client';\n\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport * as React from 'react';\n\nimport { cn } from '../tokens/cn';\n\nfunction Popover({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Root>) {\n    return <PopoverPrimitive.Root data-slot=\"popover\" {...props} />;\n}\n\nfunction PopoverTrigger({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {\n    return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />;\n}\n\nfunction PopoverContent({\n    className,\n    align = 'center',\n    sideOffset = 4,\n    ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Content>) {\n    return (\n        <PopoverPrimitive.Portal>\n            <PopoverPrimitive.Content\n                data-slot=\"popover-content\"\n                align={align}\n                sideOffset={sideOffset}\n                className={cn(\n                    'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden',\n                    className\n                )}\n                {...props}\n            />\n        </PopoverPrimitive.Portal>\n    );\n}\n\nfunction PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {\n    return <PopoverPrimitive.Anchor data-slot=\"popover-anchor\" {...props} />;\n}\n\nexport { Popover, PopoverTrigger, PopoverContent, PopoverAnchor };\n","'use client';\n\nimport { HelpCircle } from 'lucide-react';\nimport type { ReactNode } from 'react';\n\nimport { Popover, PopoverContent, PopoverTrigger } from '../primitives/popover';\nimport { cn } from '../tokens/cn';\n\nexport interface HelpHintProps {\n    /** Optional bold heading inside the popover. */\n    title?: string;\n    /** The help body — short prose explaining a term or control. */\n    children: ReactNode;\n    /** Which side the popover opens toward. */\n    side?: 'top' | 'bottom' | 'left' | 'right';\n    /** Accessible label for the trigger (defaults to \"more information\"). */\n    label?: string;\n    className?: string;\n}\n\n/**\n * HelpHint — the inline \"?\" affordance for term-level guidance, lifted from\n * oc-me-web's `me/ui/HelpHint`. Built on Popover (not a hover tooltip) so it\n * works on touch and can hold a title plus a paragraph of prose. This is the\n * keystone that lets SectionHeader carry an optional `hint` without every\n * site re-authoring its own help icon.\n */\nexport function HelpHint({\n    title,\n    children,\n    side = 'bottom',\n    label = 'more information',\n    className,\n}: HelpHintProps) {\n    return (\n        <Popover>\n            <PopoverTrigger\n                aria-label={label}\n                className={cn(\n                    'text-muted-foreground/60 hover:text-foreground inline-flex size-3.5 items-center justify-center align-middle transition-colors outline-none focus-visible:ring-2 focus-visible:ring-ring',\n                    className\n                )}\n            >\n                <HelpCircle className=\"size-3.5\" aria-hidden />\n            </PopoverTrigger>\n            <PopoverContent side={side} className=\"w-72 space-y-1.5\">\n                {title && (\n                    <p className=\"label-mono text-foreground text-[10px]\">{title}</p>\n                )}\n                <div className=\"text-muted-foreground text-xs leading-relaxed\">{children}</div>\n            </PopoverContent>\n        </Popover>\n    );\n}\n","import type { ReactNode } from 'react';\n\nimport { HelpHint } from './help-hint';\n\nexport interface SectionHeaderProps {\n    /** Plain section name — rendered after a \"§ \" glyph in label-mono. */\n    label: string;\n    /** Optional right-side string (count, \"most recent first\"). */\n    meta?: ReactNode;\n    /** When provided, renders an inline HelpHint \"?\" next to the label. */\n    hint?: { title?: string; body: ReactNode; side?: 'top' | 'bottom' | 'left' | 'right' };\n    tone?: 'primary' | 'muted' | 'warning' | 'success' | 'destructive';\n    className?: string;\n}\n\nconst TONE_CLASS = {\n    primary: 'text-primary',\n    muted: 'text-muted-foreground',\n    warning: 'text-warning',\n    success: 'text-success',\n    destructive: 'text-destructive',\n} as const;\n\n/**\n * SectionHeader — the canonical \"§ x\" section header used across every\n * /me, /vault, and /fleet dashboard surface. Lifted from oc-me-web's\n * `me/ui/SectionHeader` so the visual contract stays single-source.\n *\n * Pattern is `label-mono text-primary mb-3` with a \"§ \" glyph followed by\n * the label, plus an optional muted/uppercase right-side meta string.\n */\nexport function SectionHeader({\n    label,\n    meta,\n    hint,\n    tone = 'primary',\n    className = '',\n}: SectionHeaderProps) {\n    return (\n        <div className={`mb-3 flex items-baseline justify-between gap-2 ${className}`}>\n            <div className=\"flex items-center gap-1.5\">\n                <div className={`label-mono ${TONE_CLASS[tone]}`}>§ {label}</div>\n                {hint && (\n                    <HelpHint title={hint.title} side={hint.side ?? 'bottom'}>\n                        {hint.body}\n                    </HelpHint>\n                )}\n            </div>\n            {meta && (\n                <span className=\"text-muted-foreground/70 font-mono text-[10px] tracking-widest uppercase\">\n                    {meta}\n                </span>\n            )}\n        </div>\n    );\n}\n","import Link from 'next/link';\nimport type { ReactNode } from 'react';\n\nexport interface EmptyStateCta {\n    label: string;\n    href: string;\n    /** External links open in a new tab and get a ↗ glyph. */\n    external?: boolean;\n}\n\nexport interface EmptyStateProps {\n    /** Short heading — one mono-uppercased label like \"no entries yet\". */\n    label: string;\n    /** Body — short prose explaining what would appear here and how. */\n    children: ReactNode;\n    cta?: EmptyStateCta;\n    secondary?: EmptyStateCta;\n    tone?: 'info' | 'warning' | 'muted';\n    className?: string;\n}\n\nconst TONE_CLASS = {\n    info: 'border-primary/30 bg-primary/5',\n    warning: 'border-warning/40 bg-warning/5',\n    muted: 'border-border bg-muted/20',\n} as const;\n\nconst LABEL_TONE_CLASS = {\n    info: 'text-primary',\n    warning: 'text-warning',\n    muted: 'text-muted-foreground',\n} as const;\n\n/**\n * EmptyState — the canonical empty-state card used across every /me,\n * /vault, and /fleet dashboard. Empty states should *teach*: explain what\n * would appear, and how to make it appear. Lifted from oc-me-web's\n * `me/ui/EmptyState`.\n */\nexport function EmptyState({\n    label,\n    children,\n    cta,\n    secondary,\n    tone = 'info',\n    className = '',\n}: EmptyStateProps) {\n    return (\n        <div className={`border p-5 md:p-6 ${TONE_CLASS[tone]} ${className}`}>\n            <div className={`label-mono mb-2 ${LABEL_TONE_CLASS[tone]}`}>§ {label}</div>\n            <div className=\"text-foreground/85 max-w-2xl text-sm leading-relaxed\">{children}</div>\n            {(cta || secondary) && (\n                <div className=\"mt-4 flex flex-wrap gap-3\">\n                    {cta && <CtaLink {...cta} variant=\"primary\" />}\n                    {secondary && <CtaLink {...secondary} variant=\"secondary\" />}\n                </div>\n            )}\n        </div>\n    );\n}\n\nfunction CtaLink({\n    label,\n    href,\n    external,\n    variant,\n}: EmptyStateCta & { variant: 'primary' | 'secondary' }) {\n    const cls =\n        variant === 'primary'\n            ? 'bg-primary text-primary-foreground hover:bg-primary/90 inline-flex h-9 items-center justify-center rounded-md px-4 font-mono text-[11px] font-semibold tracking-widest uppercase'\n            : 'text-muted-foreground hover:text-foreground border-input hover:bg-accent inline-flex h-9 items-center justify-center rounded-md border px-4 font-mono text-[11px] tracking-widest uppercase';\n    const text = external ? `${label} ↗` : label;\n    if (external) {\n        return (\n            <a href={href} target=\"_blank\" rel=\"noreferrer\" className={cls}>\n                {text}\n            </a>\n        );\n    }\n    return (\n        <Link href={href} className={cls}>\n            {text}\n        </Link>\n    );\n}\n","import type { ReactNode } from 'react';\n\nexport interface StatItem {\n    /** Short uppercased label rendered in mono. */\n    label: string;\n    /** Primary value · already formatted as a string. */\n    value: string;\n    /** Optional secondary line · USD conversion, \"last 30 days\", etc. */\n    sub?: string;\n    /** When true, value is rendered in primary tone (use for headline metric). */\n    accent?: boolean;\n    /** Optional tone for the value (overrides accent). */\n    tone?: 'default' | 'primary' | 'success' | 'warning' | 'destructive' | 'muted';\n}\n\nexport interface StatGridProps {\n    items: StatItem[];\n    columns?: 1 | 2 | 3 | 4;\n    className?: string;\n}\n\nconst TONE_CLASS = {\n    default: '',\n    primary: 'text-primary',\n    success: 'text-success',\n    warning: 'text-warning',\n    destructive: 'text-destructive',\n    muted: 'text-muted-foreground',\n} as const;\n\nconst COL_CLASS = {\n    1: '',\n    2: 'md:grid-cols-2',\n    3: 'md:grid-cols-3',\n    4: 'md:grid-cols-2 lg:grid-cols-4',\n} as const;\n\n/**\n * StatGrid — the canonical stats row used across family dashboards.\n * Lifted from oc-me-web's `me/ui/StatGrid`. Grid of equal-width tiles\n * separated by 1px borders. Always pre-format the value string —\n * the component does no number formatting.\n */\nexport function StatGrid({ items, columns = 3, className = '' }: StatGridProps) {\n    return (\n        <div className={`bg-border grid gap-px border ${COL_CLASS[columns]} ${className}`}>\n            {items.map((it, i) => (\n                <Tile key={`${it.label}-${i}`} item={it} />\n            ))}\n        </div>\n    );\n}\n\nfunction Tile({ item }: { item: StatItem }) {\n    const tone = item.tone ?? (item.accent ? 'primary' : 'default');\n    return (\n        <div className=\"bg-background p-5\">\n            <div className=\"text-muted-foreground/80 font-mono text-[10px] tracking-widest uppercase\">\n                {item.label}\n            </div>\n            <div\n                className={`font-display mt-1 text-2xl font-bold tabular-nums tracking-tight ${TONE_CLASS[tone]}`}\n            >\n                {item.value}\n            </div>\n            {item.sub && (\n                <div className=\"text-muted-foreground/70 mt-1 font-mono text-[10px] tracking-widest uppercase\">\n                    {item.sub}\n                </div>\n            )}\n        </div>\n    );\n}\n\nexport function StatTile({ children, ...item }: StatItem & { children?: ReactNode }) {\n    return (\n        <div>\n            <Tile item={item} />\n            {children}\n        </div>\n    );\n}\n","import type { ReactNode } from 'react';\n\nimport { cn } from '../tokens/cn';\n\nexport interface StatBlockProps {\n    label: string;\n    value: ReactNode;\n    sub?: ReactNode;\n    /** Optional \"vs prior period\" delta — arrow + colour. */\n    delta?: { value: number; suffix?: string } | null;\n    tone?: 'default' | 'success' | 'warning' | 'destructive';\n    className?: string;\n}\n\n/**\n * A single labelled value cell — the building block for every counter grid in a\n * dashboard. Optional delta arrow + colour for period-over-period deltas.\n * (Richer than StatTile: carries a delta. Use StatGrid for laid-out grids.)\n */\nexport function StatBlock({ label, value, sub, delta, tone = 'default', className }: StatBlockProps) {\n    const toneClass =\n        tone === 'success'\n            ? 'text-success'\n            : tone === 'warning'\n              ? 'text-warning'\n              : tone === 'destructive'\n                ? 'text-destructive'\n                : 'text-foreground';\n\n    return (\n        <div className={cn('flex flex-col gap-1', className)}>\n            <span className=\"label-mono text-[10px]\">{label}</span>\n            <span className={cn('font-display text-2xl leading-none', toneClass)}>{value}</span>\n            <div className=\"flex items-baseline gap-2\">\n                {sub && (\n                    <span className=\"text-muted-foreground font-mono text-[11px] tracking-wide lowercase\">\n                        {sub}\n                    </span>\n                )}\n                {delta && (\n                    <span\n                        className={cn(\n                            'font-mono text-[11px] tracking-wide',\n                            delta.value > 0\n                                ? 'text-success'\n                                : delta.value < 0\n                                  ? 'text-destructive'\n                                  : 'text-muted-foreground'\n                        )}\n                    >\n                        {delta.value > 0 ? '▲' : delta.value < 0 ? '▼' : '·'}{' '}\n                        {Math.abs(delta.value).toFixed(1)}\n                        {delta.suffix ?? '%'}\n                    </span>\n                )}\n            </div>\n        </div>\n    );\n}\n","import type { ReactNode } from 'react';\n\nimport { StatBlock } from '../primitives/stat-block';\nimport { cn } from '../tokens/cn';\n\nexport interface StatCardProps {\n    label: string;\n    value: ReactNode;\n    sub?: ReactNode;\n    /** Optional period-over-period delta arrow + colour. */\n    delta?: { value: number; suffix?: string } | null;\n    tone?: 'default' | 'success' | 'warning' | 'destructive';\n    /** Padding density — `sm` for dense grids, `default` for standalone cards. */\n    pad?: 'sm' | 'default';\n    className?: string;\n}\n\n/**\n * StatCard — a single stat in a bordered `bg-card` frame. The standalone\n * counterpart to StatBlock (the bare cell) and StatGrid (a laid-out grid):\n * this is the \"one stat in its own card\" shape that fleet (`dashboard/Stat`)\n * and me (`StatCell`, `ParticipationFeeCard` tiles, etc.) each hand-roll.\n * Wraps StatBlock so the inner cell stays single-source.\n */\nexport function StatCard({ pad = 'default', className, ...stat }: StatCardProps) {\n    return (\n        <div className={cn('border bg-card', pad === 'sm' ? 'p-3 md:p-4' : 'p-5', className)}>\n            <StatBlock {...stat} />\n        </div>\n    );\n}\n","import type { ReactNode } from 'react';\n\nimport { cn } from '../tokens/cn';\n\nexport type CalloutTone = 'info' | 'warning' | 'destructive' | 'success' | 'muted';\n\nexport interface CalloutProps {\n    tone?: CalloutTone;\n    /** Optional \"§ \"-prefixed mono header. */\n    label?: string;\n    /** Optional leading icon, sized by the caller (e.g. lucide `size-4`). */\n    icon?: ReactNode;\n    /** Body content. */\n    children: ReactNode;\n    /** Optional trailing action (button / link) pinned to the bottom. */\n    action?: ReactNode;\n    className?: string;\n}\n\nconst FRAME: Record<CalloutTone, string> = {\n    info: 'border-primary/30 bg-primary/5',\n    warning: 'border-warning/40 bg-warning/5',\n    destructive: 'border-destructive/40 bg-destructive/5',\n    success: 'border-success/40 bg-success/5',\n    muted: 'border-border bg-muted/20',\n};\n\nconst LABEL: Record<CalloutTone, string> = {\n    info: 'text-primary',\n    warning: 'text-warning',\n    destructive: 'text-destructive',\n    success: 'text-success',\n    muted: 'text-muted-foreground',\n};\n\n/**\n * Callout — the canonical toned panel (`border-{tone}/40 bg-{tone}/5` + an\n * optional `label-mono` header) reimplemented across stamp, pledge, vote,\n * analytics, and me (HealthBanner / SimulationBanner / FrozenBanner /\n * DangerZone, etc.). One component, five tones. For empty-states with CTAs use\n * EmptyState; for inline term help use HelpHint; this is the general\n * notice/banner frame.\n */\nexport function Callout({ tone = 'info', label, icon, children, action, className }: CalloutProps) {\n    return (\n        <div className={cn('border p-4 md:p-5', FRAME[tone], className)}>\n            {label && (\n                <div className={cn('label-mono mb-2 flex items-center gap-1.5', LABEL[tone])}>\n                    {icon}\n                    <span>§ {label}</span>\n                </div>\n            )}\n            <div className=\"text-foreground/85 text-sm leading-relaxed\">\n                {!label && icon ? (\n                    <span className={cn('mr-2 inline-flex align-middle', LABEL[tone])}>{icon}</span>\n                ) : null}\n                {children}\n            </div>\n            {action && <div className=\"mt-3 flex flex-wrap gap-3\">{action}</div>}\n        </div>\n    );\n}\n","import { Fragment, type ReactNode } from 'react';\n\nimport { cn } from '../tokens/cn';\n\nexport interface DefinitionItem {\n    label: ReactNode;\n    value: ReactNode;\n}\n\nexport interface DefinitionListProps {\n    items: DefinitionItem[];\n    className?: string;\n}\n\n/**\n * DefinitionList — the mono-label / value `<dl>` grid reimplemented in agent's\n * inspector, vote's reveal page, and me (BondAnchorCard, OperatorIdentityCard,\n * FrozenBanner). Labels render in uppercase mono; values align in a second\n * column on wider viewports, stacking on narrow ones. Long values (hashes,\n * addresses) wrap via `break-all`.\n */\nexport function DefinitionList({ items, className }: DefinitionListProps) {\n    return (\n        <dl\n            className={cn(\n                'grid gap-x-5 gap-y-2 text-sm sm:grid-cols-[auto_1fr] sm:items-baseline',\n                className\n            )}\n        >\n            {items.map((item, i) => (\n                <Fragment key={i}>\n                    <dt className=\"label-mono text-muted-foreground text-[10px]\">{item.label}</dt>\n                    <dd className=\"text-foreground font-mono text-xs break-all\">{item.value}</dd>\n                </Fragment>\n            ))}\n        </dl>\n    );\n}\n","import type { ElementType, ReactNode } from 'react';\n\nimport { cn } from '../tokens/cn';\n\nexport interface DataRowProps {\n    /** Primary content (left-aligned, grows to fill). */\n    children: ReactNode;\n    /** Trailing metadata pinned right (timestamp, count, status pill). */\n    meta?: ReactNode;\n    /** Optional action(s) rendered after the meta (button, link). */\n    action?: ReactNode;\n    /** Element to render as — `li` inside a list, `div` otherwise. */\n    as?: ElementType;\n    className?: string;\n}\n\n/**\n * DataRow — the \"content left, meta right, optional action\" list row\n * reimplemented across me (federations, incidents, grants, distributions,\n * fee entries) and other dashboards. Pair inside a `divide-y border` list.\n * On narrow viewports content and meta stack; from `sm` up they sit on one\n * baseline-aligned line.\n */\nexport function DataRow({ children, meta, action, as, className }: DataRowProps) {\n    const Tag = (as ?? 'div') as ElementType;\n    return (\n        <Tag\n            className={cn(\n                'flex flex-col gap-1 py-3 sm:flex-row sm:items-baseline sm:justify-between sm:gap-4',\n                className\n            )}\n        >\n            <div className=\"min-w-0 flex-1\">{children}</div>\n            {(meta || action) && (\n                <div className=\"flex shrink-0 items-center gap-3 sm:justify-end\">\n                    {meta && (\n                        <span className=\"text-muted-foreground font-mono text-[11px] tracking-wide\">\n                            {meta}\n                        </span>\n                    )}\n                    {action}\n                </div>\n            )}\n        </Tag>\n    );\n}\n"]}

package/dist/composites.mjs

@@ -166,6 +166,34 @@ function StatTile({ children, ...item }) {
     children
   ] });
 }
+function StatBlock({ label, value, sub, delta, tone = "default", className }) {
+  const toneClass = tone === "success" ? "text-success" : tone === "warning" ? "text-warning" : tone === "destructive" ? "text-destructive" : "text-foreground";
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-1", className), children: [
+    /* @__PURE__ */ jsx("span", { className: "label-mono text-[10px]", children: label }),
+    /* @__PURE__ */ jsx("span", { className: cn("font-display text-2xl leading-none", toneClass), children: value }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-baseline gap-2", children: [
+      sub && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground font-mono text-[11px] tracking-wide lowercase", children: sub }),
+      delta && /* @__PURE__ */ jsxs(
+        "span",
+        {
+          className: cn(
+            "font-mono text-[11px] tracking-wide",
+            delta.value > 0 ? "text-success" : delta.value < 0 ? "text-destructive" : "text-muted-foreground"
+          ),
+          children: [
+            delta.value > 0 ? "\u25B2" : delta.value < 0 ? "\u25BC" : "\xB7",
+            " ",
+            Math.abs(delta.value).toFixed(1),
+            delta.suffix ?? "%"
+          ]
+        }
+      )
+    ] })
+  ] });
+}
+function StatCard({ pad = "default", className, ...stat }) {
+  return /* @__PURE__ */ jsx("div", { className: cn("border bg-card", pad === "sm" ? "p-3 md:p-4" : "p-5", className), children: /* @__PURE__ */ jsx(StatBlock, { ...stat }) });
+}
 var FRAME = {
   info: "border-primary/30 bg-primary/5",
   warning: "border-warning/40 bg-warning/5",
@@ -231,6 +259,6 @@ function DataRow({ children, meta, action, as, className }) {
   );
 }
 
-export { Callout, DataRow, DefinitionList, EmptyState, HelpHint, SectionHeader, StatGrid, StatTile };
+export { Callout, DataRow, DefinitionList, EmptyState, HelpHint, SectionHeader, StatCard, StatGrid, StatTile };
 //# sourceMappingURL=composites.mjs.map
 //# sourceMappingURL=composites.mjs.map

package/dist/composites.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/tokens/cn.ts","../src/primitives/popover.tsx","../src/composites/help-hint.tsx","../src/composites/section-header.tsx","../src/composites/empty-state.tsx","../src/composites/stat-grid.tsx","../src/composites/callout.tsx","../src/composites/definition-list.tsx","../src/composites/data-row.tsx"],"names":["jsx","jsxs","TONE_CLASS"],"mappings":"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","file":"composites.mjs","sourcesContent":["import type { ClassValue } from 'clsx';\n\nimport { clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\n/**\n * Canonical class-name merge for the OrangeCheck family.\n * `clsx` for conditional composition, `tailwind-merge` to resolve\n * conflicting Tailwind utilities (last-wins by property).\n */\nexport function cn(...inputs: ClassValue[]): string {\n    return twMerge(clsx(inputs));\n}\n","'use client';\n\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport * as React from 'react';\n\nimport { cn } from '../tokens/cn';\n\nfunction Popover({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Root>) {\n    return <PopoverPrimitive.Root data-slot=\"popover\" {...props} />;\n}\n\nfunction PopoverTrigger({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {\n    return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />;\n}\n\nfunction PopoverContent({\n    className,\n    align = 'center',\n    sideOffset = 4,\n    ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Content>) {\n    return (\n        <PopoverPrimitive.Portal>\n            <PopoverPrimitive.Content\n                data-slot=\"popover-content\"\n                align={align}\n                sideOffset={sideOffset}\n                className={cn(\n                    'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden',\n                    className\n                )}\n                {...props}\n            />\n        </PopoverPrimitive.Portal>\n    );\n}\n\nfunction PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {\n    return <PopoverPrimitive.Anchor data-slot=\"popover-anchor\" {...props} />;\n}\n\nexport { Popover, PopoverTrigger, PopoverContent, PopoverAnchor };\n","'use client';\n\nimport { HelpCircle } from 'lucide-react';\nimport type { ReactNode } from 'react';\n\nimport { Popover, PopoverContent, PopoverTrigger } from '../primitives/popover';\nimport { cn } from '../tokens/cn';\n\nexport interface HelpHintProps {\n    /** Optional bold heading inside the popover. */\n    title?: string;\n    /** The help body — short prose explaining a term or control. */\n    children: ReactNode;\n    /** Which side the popover opens toward. */\n    side?: 'top' | 'bottom' | 'left' | 'right';\n    /** Accessible label for the trigger (defaults to \"more information\"). */\n    label?: string;\n    className?: string;\n}\n\n/**\n * HelpHint — the inline \"?\" affordance for term-level guidance, lifted from\n * oc-me-web's `me/ui/HelpHint`. Built on Popover (not a hover tooltip) so it\n * works on touch and can hold a title plus a paragraph of prose. This is the\n * keystone that lets SectionHeader carry an optional `hint` without every\n * site re-authoring its own help icon.\n */\nexport function HelpHint({\n    title,\n    children,\n    side = 'bottom',\n    label = 'more information',\n    className,\n}: HelpHintProps) {\n    return (\n        <Popover>\n            <PopoverTrigger\n                aria-label={label}\n                className={cn(\n                    'text-muted-foreground/60 hover:text-foreground inline-flex size-3.5 items-center justify-center align-middle transition-colors outline-none focus-visible:ring-2 focus-visible:ring-ring',\n                    className\n                )}\n            >\n                <HelpCircle className=\"size-3.5\" aria-hidden />\n            </PopoverTrigger>\n            <PopoverContent side={side} className=\"w-72 space-y-1.5\">\n                {title && (\n                    <p className=\"label-mono text-foreground text-[10px]\">{title}</p>\n                )}\n                <div className=\"text-muted-foreground text-xs leading-relaxed\">{children}</div>\n            </PopoverContent>\n        </Popover>\n    );\n}\n","import type { ReactNode } from 'react';\n\nimport { HelpHint } from './help-hint';\n\nexport interface SectionHeaderProps {\n    /** Plain section name — rendered after a \"§ \" glyph in label-mono. */\n    label: string;\n    /** Optional right-side string (count, \"most recent first\"). */\n    meta?: ReactNode;\n    /** When provided, renders an inline HelpHint \"?\" next to the label. */\n    hint?: { title?: string; body: ReactNode; side?: 'top' | 'bottom' | 'left' | 'right' };\n    tone?: 'primary' | 'muted' | 'warning' | 'success' | 'destructive';\n    className?: string;\n}\n\nconst TONE_CLASS = {\n    primary: 'text-primary',\n    muted: 'text-muted-foreground',\n    warning: 'text-warning',\n    success: 'text-success',\n    destructive: 'text-destructive',\n} as const;\n\n/**\n * SectionHeader — the canonical \"§ x\" section header used across every\n * /me, /vault, and /fleet dashboard surface. Lifted from oc-me-web's\n * `me/ui/SectionHeader` so the visual contract stays single-source.\n *\n * Pattern is `label-mono text-primary mb-3` with a \"§ \" glyph followed by\n * the label, plus an optional muted/uppercase right-side meta string.\n */\nexport function SectionHeader({\n    label,\n    meta,\n    hint,\n    tone = 'primary',\n    className = '',\n}: SectionHeaderProps) {\n    return (\n        <div className={`mb-3 flex items-baseline justify-between gap-2 ${className}`}>\n            <div className=\"flex items-center gap-1.5\">\n                <div className={`label-mono ${TONE_CLASS[tone]}`}>§ {label}</div>\n                {hint && (\n                    <HelpHint title={hint.title} side={hint.side ?? 'bottom'}>\n                        {hint.body}\n                    </HelpHint>\n                )}\n            </div>\n            {meta && (\n                <span className=\"text-muted-foreground/70 font-mono text-[10px] tracking-widest uppercase\">\n                    {meta}\n                </span>\n            )}\n        </div>\n    );\n}\n","import Link from 'next/link';\nimport type { ReactNode } from 'react';\n\nexport interface EmptyStateCta {\n    label: string;\n    href: string;\n    /** External links open in a new tab and get a ↗ glyph. */\n    external?: boolean;\n}\n\nexport interface EmptyStateProps {\n    /** Short heading — one mono-uppercased label like \"no entries yet\". */\n    label: string;\n    /** Body — short prose explaining what would appear here and how. */\n    children: ReactNode;\n    cta?: EmptyStateCta;\n    secondary?: EmptyStateCta;\n    tone?: 'info' | 'warning' | 'muted';\n    className?: string;\n}\n\nconst TONE_CLASS = {\n    info: 'border-primary/30 bg-primary/5',\n    warning: 'border-warning/40 bg-warning/5',\n    muted: 'border-border bg-muted/20',\n} as const;\n\nconst LABEL_TONE_CLASS = {\n    info: 'text-primary',\n    warning: 'text-warning',\n    muted: 'text-muted-foreground',\n} as const;\n\n/**\n * EmptyState — the canonical empty-state card used across every /me,\n * /vault, and /fleet dashboard. Empty states should *teach*: explain what\n * would appear, and how to make it appear. Lifted from oc-me-web's\n * `me/ui/EmptyState`.\n */\nexport function EmptyState({\n    label,\n    children,\n    cta,\n    secondary,\n    tone = 'info',\n    className = '',\n}: EmptyStateProps) {\n    return (\n        <div className={`border p-5 md:p-6 ${TONE_CLASS[tone]} ${className}`}>\n            <div className={`label-mono mb-2 ${LABEL_TONE_CLASS[tone]}`}>§ {label}</div>\n            <div className=\"text-foreground/85 max-w-2xl text-sm leading-relaxed\">{children}</div>\n            {(cta || secondary) && (\n                <div className=\"mt-4 flex flex-wrap gap-3\">\n                    {cta && <CtaLink {...cta} variant=\"primary\" />}\n                    {secondary && <CtaLink {...secondary} variant=\"secondary\" />}\n                </div>\n            )}\n        </div>\n    );\n}\n\nfunction CtaLink({\n    label,\n    href,\n    external,\n    variant,\n}: EmptyStateCta & { variant: 'primary' | 'secondary' }) {\n    const cls =\n        variant === 'primary'\n            ? 'bg-primary text-primary-foreground hover:bg-primary/90 inline-flex h-9 items-center justify-center rounded-md px-4 font-mono text-[11px] font-semibold tracking-widest uppercase'\n            : 'text-muted-foreground hover:text-foreground border-input hover:bg-accent inline-flex h-9 items-center justify-center rounded-md border px-4 font-mono text-[11px] tracking-widest uppercase';\n    const text = external ? `${label} ↗` : label;\n    if (external) {\n        return (\n            <a href={href} target=\"_blank\" rel=\"noreferrer\" className={cls}>\n                {text}\n            </a>\n        );\n    }\n    return (\n        <Link href={href} className={cls}>\n            {text}\n        </Link>\n    );\n}\n","import type { ReactNode } from 'react';\n\nexport interface StatItem {\n    /** Short uppercased label rendered in mono. */\n    label: string;\n    /** Primary value · already formatted as a string. */\n    value: string;\n    /** Optional secondary line · USD conversion, \"last 30 days\", etc. */\n    sub?: string;\n    /** When true, value is rendered in primary tone (use for headline metric). */\n    accent?: boolean;\n    /** Optional tone for the value (overrides accent). */\n    tone?: 'default' | 'primary' | 'success' | 'warning' | 'destructive' | 'muted';\n}\n\nexport interface StatGridProps {\n    items: StatItem[];\n    columns?: 1 | 2 | 3 | 4;\n    className?: string;\n}\n\nconst TONE_CLASS = {\n    default: '',\n    primary: 'text-primary',\n    success: 'text-success',\n    warning: 'text-warning',\n    destructive: 'text-destructive',\n    muted: 'text-muted-foreground',\n} as const;\n\nconst COL_CLASS = {\n    1: '',\n    2: 'md:grid-cols-2',\n    3: 'md:grid-cols-3',\n    4: 'md:grid-cols-2 lg:grid-cols-4',\n} as const;\n\n/**\n * StatGrid — the canonical stats row used across family dashboards.\n * Lifted from oc-me-web's `me/ui/StatGrid`. Grid of equal-width tiles\n * separated by 1px borders. Always pre-format the value string —\n * the component does no number formatting.\n */\nexport function StatGrid({ items, columns = 3, className = '' }: StatGridProps) {\n    return (\n        <div className={`bg-border grid gap-px border ${COL_CLASS[columns]} ${className}`}>\n            {items.map((it, i) => (\n                <Tile key={`${it.label}-${i}`} item={it} />\n            ))}\n        </div>\n    );\n}\n\nfunction Tile({ item }: { item: StatItem }) {\n    const tone = item.tone ?? (item.accent ? 'primary' : 'default');\n    return (\n        <div className=\"bg-background p-5\">\n            <div className=\"text-muted-foreground/80 font-mono text-[10px] tracking-widest uppercase\">\n                {item.label}\n            </div>\n            <div\n                className={`font-display mt-1 text-2xl font-bold tabular-nums tracking-tight ${TONE_CLASS[tone]}`}\n            >\n                {item.value}\n            </div>\n            {item.sub && (\n                <div className=\"text-muted-foreground/70 mt-1 font-mono text-[10px] tracking-widest uppercase\">\n                    {item.sub}\n                </div>\n            )}\n        </div>\n    );\n}\n\nexport function StatTile({ children, ...item }: StatItem & { children?: ReactNode }) {\n    return (\n        <div>\n            <Tile item={item} />\n            {children}\n        </div>\n    );\n}\n","import type { ReactNode } from 'react';\n\nimport { cn } from '../tokens/cn';\n\nexport type CalloutTone = 'info' | 'warning' | 'destructive' | 'success' | 'muted';\n\nexport interface CalloutProps {\n    tone?: CalloutTone;\n    /** Optional \"§ \"-prefixed mono header. */\n    label?: string;\n    /** Optional leading icon, sized by the caller (e.g. lucide `size-4`). */\n    icon?: ReactNode;\n    /** Body content. */\n    children: ReactNode;\n    /** Optional trailing action (button / link) pinned to the bottom. */\n    action?: ReactNode;\n    className?: string;\n}\n\nconst FRAME: Record<CalloutTone, string> = {\n    info: 'border-primary/30 bg-primary/5',\n    warning: 'border-warning/40 bg-warning/5',\n    destructive: 'border-destructive/40 bg-destructive/5',\n    success: 'border-success/40 bg-success/5',\n    muted: 'border-border bg-muted/20',\n};\n\nconst LABEL: Record<CalloutTone, string> = {\n    info: 'text-primary',\n    warning: 'text-warning',\n    destructive: 'text-destructive',\n    success: 'text-success',\n    muted: 'text-muted-foreground',\n};\n\n/**\n * Callout — the canonical toned panel (`border-{tone}/40 bg-{tone}/5` + an\n * optional `label-mono` header) reimplemented across stamp, pledge, vote,\n * analytics, and me (HealthBanner / SimulationBanner / FrozenBanner /\n * DangerZone, etc.). One component, five tones. For empty-states with CTAs use\n * EmptyState; for inline term help use HelpHint; this is the general\n * notice/banner frame.\n */\nexport function Callout({ tone = 'info', label, icon, children, action, className }: CalloutProps) {\n    return (\n        <div className={cn('border p-4 md:p-5', FRAME[tone], className)}>\n            {label && (\n                <div className={cn('label-mono mb-2 flex items-center gap-1.5', LABEL[tone])}>\n                    {icon}\n                    <span>§ {label}</span>\n                </div>\n            )}\n            <div className=\"text-foreground/85 text-sm leading-relaxed\">\n                {!label && icon ? (\n                    <span className={cn('mr-2 inline-flex align-middle', LABEL[tone])}>{icon}</span>\n                ) : null}\n                {children}\n            </div>\n            {action && <div className=\"mt-3 flex flex-wrap gap-3\">{action}</div>}\n        </div>\n    );\n}\n","import { Fragment, type ReactNode } from 'react';\n\nimport { cn } from '../tokens/cn';\n\nexport interface DefinitionItem {\n    label: ReactNode;\n    value: ReactNode;\n}\n\nexport interface DefinitionListProps {\n    items: DefinitionItem[];\n    className?: string;\n}\n\n/**\n * DefinitionList — the mono-label / value `<dl>` grid reimplemented in agent's\n * inspector, vote's reveal page, and me (BondAnchorCard, OperatorIdentityCard,\n * FrozenBanner). Labels render in uppercase mono; values align in a second\n * column on wider viewports, stacking on narrow ones. Long values (hashes,\n * addresses) wrap via `break-all`.\n */\nexport function DefinitionList({ items, className }: DefinitionListProps) {\n    return (\n        <dl\n            className={cn(\n                'grid gap-x-5 gap-y-2 text-sm sm:grid-cols-[auto_1fr] sm:items-baseline',\n                className\n            )}\n        >\n            {items.map((item, i) => (\n                <Fragment key={i}>\n                    <dt className=\"label-mono text-muted-foreground text-[10px]\">{item.label}</dt>\n                    <dd className=\"text-foreground font-mono text-xs break-all\">{item.value}</dd>\n                </Fragment>\n            ))}\n        </dl>\n    );\n}\n","import type { ElementType, ReactNode } from 'react';\n\nimport { cn } from '../tokens/cn';\n\nexport interface DataRowProps {\n    /** Primary content (left-aligned, grows to fill). */\n    children: ReactNode;\n    /** Trailing metadata pinned right (timestamp, count, status pill). */\n    meta?: ReactNode;\n    /** Optional action(s) rendered after the meta (button, link). */\n    action?: ReactNode;\n    /** Element to render as — `li` inside a list, `div` otherwise. */\n    as?: ElementType;\n    className?: string;\n}\n\n/**\n * DataRow — the \"content left, meta right, optional action\" list row\n * reimplemented across me (federations, incidents, grants, distributions,\n * fee entries) and other dashboards. Pair inside a `divide-y border` list.\n * On narrow viewports content and meta stack; from `sm` up they sit on one\n * baseline-aligned line.\n */\nexport function DataRow({ children, meta, action, as, className }: DataRowProps) {\n    const Tag = (as ?? 'div') as ElementType;\n    return (\n        <Tag\n            className={cn(\n                'flex flex-col gap-1 py-3 sm:flex-row sm:items-baseline sm:justify-between sm:gap-4',\n                className\n            )}\n        >\n            <div className=\"min-w-0 flex-1\">{children}</div>\n            {(meta || action) && (\n                <div className=\"flex shrink-0 items-center gap-3 sm:justify-end\">\n                    {meta && (\n                        <span className=\"text-muted-foreground font-mono text-[11px] tracking-wide\">\n                            {meta}\n                        </span>\n                    )}\n                    {action}\n                </div>\n            )}\n        </Tag>\n    );\n}\n"]}
+{"version":3,"sources":["../src/tokens/cn.ts","../src/primitives/popover.tsx","../src/composites/help-hint.tsx","../src/composites/section-header.tsx","../src/composites/empty-state.tsx","../src/composites/stat-grid.tsx","../src/primitives/stat-block.tsx","../src/composites/stat-card.tsx","../src/composites/callout.tsx","../src/composites/definition-list.tsx","../src/composites/data-row.tsx"],"names":["jsx","jsxs","TONE_CLASS"],"mappings":"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","file":"composites.mjs","sourcesContent":["import type { ClassValue } from 'clsx';\n\nimport { clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\n/**\n * Canonical class-name merge for the OrangeCheck family.\n * `clsx` for conditional composition, `tailwind-merge` to resolve\n * conflicting Tailwind utilities (last-wins by property).\n */\nexport function cn(...inputs: ClassValue[]): string {\n    return twMerge(clsx(inputs));\n}\n","'use client';\n\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport * as React from 'react';\n\nimport { cn } from '../tokens/cn';\n\nfunction Popover({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Root>) {\n    return <PopoverPrimitive.Root data-slot=\"popover\" {...props} />;\n}\n\nfunction PopoverTrigger({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {\n    return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />;\n}\n\nfunction PopoverContent({\n    className,\n    align = 'center',\n    sideOffset = 4,\n    ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Content>) {\n    return (\n        <PopoverPrimitive.Portal>\n            <PopoverPrimitive.Content\n                data-slot=\"popover-content\"\n                align={align}\n                sideOffset={sideOffset}\n                className={cn(\n                    'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden',\n                    className\n                )}\n                {...props}\n            />\n        </PopoverPrimitive.Portal>\n    );\n}\n\nfunction PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {\n    return <PopoverPrimitive.Anchor data-slot=\"popover-anchor\" {...props} />;\n}\n\nexport { Popover, PopoverTrigger, PopoverContent, PopoverAnchor };\n","'use client';\n\nimport { HelpCircle } from 'lucide-react';\nimport type { ReactNode } from 'react';\n\nimport { Popover, PopoverContent, PopoverTrigger } from '../primitives/popover';\nimport { cn } from '../tokens/cn';\n\nexport interface HelpHintProps {\n    /** Optional bold heading inside the popover. */\n    title?: string;\n    /** The help body — short prose explaining a term or control. */\n    children: ReactNode;\n    /** Which side the popover opens toward. */\n    side?: 'top' | 'bottom' | 'left' | 'right';\n    /** Accessible label for the trigger (defaults to \"more information\"). */\n    label?: string;\n    className?: string;\n}\n\n/**\n * HelpHint — the inline \"?\" affordance for term-level guidance, lifted from\n * oc-me-web's `me/ui/HelpHint`. Built on Popover (not a hover tooltip) so it\n * works on touch and can hold a title plus a paragraph of prose. This is the\n * keystone that lets SectionHeader carry an optional `hint` without every\n * site re-authoring its own help icon.\n */\nexport function HelpHint({\n    title,\n    children,\n    side = 'bottom',\n    label = 'more information',\n    className,\n}: HelpHintProps) {\n    return (\n        <Popover>\n            <PopoverTrigger\n                aria-label={label}\n                className={cn(\n                    'text-muted-foreground/60 hover:text-foreground inline-flex size-3.5 items-center justify-center align-middle transition-colors outline-none focus-visible:ring-2 focus-visible:ring-ring',\n                    className\n                )}\n            >\n                <HelpCircle className=\"size-3.5\" aria-hidden />\n            </PopoverTrigger>\n            <PopoverContent side={side} className=\"w-72 space-y-1.5\">\n                {title && (\n                    <p className=\"label-mono text-foreground text-[10px]\">{title}</p>\n                )}\n                <div className=\"text-muted-foreground text-xs leading-relaxed\">{children}</div>\n            </PopoverContent>\n        </Popover>\n    );\n}\n","import type { ReactNode } from 'react';\n\nimport { HelpHint } from './help-hint';\n\nexport interface SectionHeaderProps {\n    /** Plain section name — rendered after a \"§ \" glyph in label-mono. */\n    label: string;\n    /** Optional right-side string (count, \"most recent first\"). */\n    meta?: ReactNode;\n    /** When provided, renders an inline HelpHint \"?\" next to the label. */\n    hint?: { title?: string; body: ReactNode; side?: 'top' | 'bottom' | 'left' | 'right' };\n    tone?: 'primary' | 'muted' | 'warning' | 'success' | 'destructive';\n    className?: string;\n}\n\nconst TONE_CLASS = {\n    primary: 'text-primary',\n    muted: 'text-muted-foreground',\n    warning: 'text-warning',\n    success: 'text-success',\n    destructive: 'text-destructive',\n} as const;\n\n/**\n * SectionHeader — the canonical \"§ x\" section header used across every\n * /me, /vault, and /fleet dashboard surface. Lifted from oc-me-web's\n * `me/ui/SectionHeader` so the visual contract stays single-source.\n *\n * Pattern is `label-mono text-primary mb-3` with a \"§ \" glyph followed by\n * the label, plus an optional muted/uppercase right-side meta string.\n */\nexport function SectionHeader({\n    label,\n    meta,\n    hint,\n    tone = 'primary',\n    className = '',\n}: SectionHeaderProps) {\n    return (\n        <div className={`mb-3 flex items-baseline justify-between gap-2 ${className}`}>\n            <div className=\"flex items-center gap-1.5\">\n                <div className={`label-mono ${TONE_CLASS[tone]}`}>§ {label}</div>\n                {hint && (\n                    <HelpHint title={hint.title} side={hint.side ?? 'bottom'}>\n                        {hint.body}\n                    </HelpHint>\n                )}\n            </div>\n            {meta && (\n                <span className=\"text-muted-foreground/70 font-mono text-[10px] tracking-widest uppercase\">\n                    {meta}\n                </span>\n            )}\n        </div>\n    );\n}\n","import Link from 'next/link';\nimport type { ReactNode } from 'react';\n\nexport interface EmptyStateCta {\n    label: string;\n    href: string;\n    /** External links open in a new tab and get a ↗ glyph. */\n    external?: boolean;\n}\n\nexport interface EmptyStateProps {\n    /** Short heading — one mono-uppercased label like \"no entries yet\". */\n    label: string;\n    /** Body — short prose explaining what would appear here and how. */\n    children: ReactNode;\n    cta?: EmptyStateCta;\n    secondary?: EmptyStateCta;\n    tone?: 'info' | 'warning' | 'muted';\n    className?: string;\n}\n\nconst TONE_CLASS = {\n    info: 'border-primary/30 bg-primary/5',\n    warning: 'border-warning/40 bg-warning/5',\n    muted: 'border-border bg-muted/20',\n} as const;\n\nconst LABEL_TONE_CLASS = {\n    info: 'text-primary',\n    warning: 'text-warning',\n    muted: 'text-muted-foreground',\n} as const;\n\n/**\n * EmptyState — the canonical empty-state card used across every /me,\n * /vault, and /fleet dashboard. Empty states should *teach*: explain what\n * would appear, and how to make it appear. Lifted from oc-me-web's\n * `me/ui/EmptyState`.\n */\nexport function EmptyState({\n    label,\n    children,\n    cta,\n    secondary,\n    tone = 'info',\n    className = '',\n}: EmptyStateProps) {\n    return (\n        <div className={`border p-5 md:p-6 ${TONE_CLASS[tone]} ${className}`}>\n            <div className={`label-mono mb-2 ${LABEL_TONE_CLASS[tone]}`}>§ {label}</div>\n            <div className=\"text-foreground/85 max-w-2xl text-sm leading-relaxed\">{children}</div>\n            {(cta || secondary) && (\n                <div className=\"mt-4 flex flex-wrap gap-3\">\n                    {cta && <CtaLink {...cta} variant=\"primary\" />}\n                    {secondary && <CtaLink {...secondary} variant=\"secondary\" />}\n                </div>\n            )}\n        </div>\n    );\n}\n\nfunction CtaLink({\n    label,\n    href,\n    external,\n    variant,\n}: EmptyStateCta & { variant: 'primary' | 'secondary' }) {\n    const cls =\n        variant === 'primary'\n            ? 'bg-primary text-primary-foreground hover:bg-primary/90 inline-flex h-9 items-center justify-center rounded-md px-4 font-mono text-[11px] font-semibold tracking-widest uppercase'\n            : 'text-muted-foreground hover:text-foreground border-input hover:bg-accent inline-flex h-9 items-center justify-center rounded-md border px-4 font-mono text-[11px] tracking-widest uppercase';\n    const text = external ? `${label} ↗` : label;\n    if (external) {\n        return (\n            <a href={href} target=\"_blank\" rel=\"noreferrer\" className={cls}>\n                {text}\n            </a>\n        );\n    }\n    return (\n        <Link href={href} className={cls}>\n            {text}\n        </Link>\n    );\n}\n","import type { ReactNode } from 'react';\n\nexport interface StatItem {\n    /** Short uppercased label rendered in mono. */\n    label: string;\n    /** Primary value · already formatted as a string. */\n    value: string;\n    /** Optional secondary line · USD conversion, \"last 30 days\", etc. */\n    sub?: string;\n    /** When true, value is rendered in primary tone (use for headline metric). */\n    accent?: boolean;\n    /** Optional tone for the value (overrides accent). */\n    tone?: 'default' | 'primary' | 'success' | 'warning' | 'destructive' | 'muted';\n}\n\nexport interface StatGridProps {\n    items: StatItem[];\n    columns?: 1 | 2 | 3 | 4;\n    className?: string;\n}\n\nconst TONE_CLASS = {\n    default: '',\n    primary: 'text-primary',\n    success: 'text-success',\n    warning: 'text-warning',\n    destructive: 'text-destructive',\n    muted: 'text-muted-foreground',\n} as const;\n\nconst COL_CLASS = {\n    1: '',\n    2: 'md:grid-cols-2',\n    3: 'md:grid-cols-3',\n    4: 'md:grid-cols-2 lg:grid-cols-4',\n} as const;\n\n/**\n * StatGrid — the canonical stats row used across family dashboards.\n * Lifted from oc-me-web's `me/ui/StatGrid`. Grid of equal-width tiles\n * separated by 1px borders. Always pre-format the value string —\n * the component does no number formatting.\n */\nexport function StatGrid({ items, columns = 3, className = '' }: StatGridProps) {\n    return (\n        <div className={`bg-border grid gap-px border ${COL_CLASS[columns]} ${className}`}>\n            {items.map((it, i) => (\n                <Tile key={`${it.label}-${i}`} item={it} />\n            ))}\n        </div>\n    );\n}\n\nfunction Tile({ item }: { item: StatItem }) {\n    const tone = item.tone ?? (item.accent ? 'primary' : 'default');\n    return (\n        <div className=\"bg-background p-5\">\n            <div className=\"text-muted-foreground/80 font-mono text-[10px] tracking-widest uppercase\">\n                {item.label}\n            </div>\n            <div\n                className={`font-display mt-1 text-2xl font-bold tabular-nums tracking-tight ${TONE_CLASS[tone]}`}\n            >\n                {item.value}\n            </div>\n            {item.sub && (\n                <div className=\"text-muted-foreground/70 mt-1 font-mono text-[10px] tracking-widest uppercase\">\n                    {item.sub}\n                </div>\n            )}\n        </div>\n    );\n}\n\nexport function StatTile({ children, ...item }: StatItem & { children?: ReactNode }) {\n    return (\n        <div>\n            <Tile item={item} />\n            {children}\n        </div>\n    );\n}\n","import type { ReactNode } from 'react';\n\nimport { cn } from '../tokens/cn';\n\nexport interface StatBlockProps {\n    label: string;\n    value: ReactNode;\n    sub?: ReactNode;\n    /** Optional \"vs prior period\" delta — arrow + colour. */\n    delta?: { value: number; suffix?: string } | null;\n    tone?: 'default' | 'success' | 'warning' | 'destructive';\n    className?: string;\n}\n\n/**\n * A single labelled value cell — the building block for every counter grid in a\n * dashboard. Optional delta arrow + colour for period-over-period deltas.\n * (Richer than StatTile: carries a delta. Use StatGrid for laid-out grids.)\n */\nexport function StatBlock({ label, value, sub, delta, tone = 'default', className }: StatBlockProps) {\n    const toneClass =\n        tone === 'success'\n            ? 'text-success'\n            : tone === 'warning'\n              ? 'text-warning'\n              : tone === 'destructive'\n                ? 'text-destructive'\n                : 'text-foreground';\n\n    return (\n        <div className={cn('flex flex-col gap-1', className)}>\n            <span className=\"label-mono text-[10px]\">{label}</span>\n            <span className={cn('font-display text-2xl leading-none', toneClass)}>{value}</span>\n            <div className=\"flex items-baseline gap-2\">\n                {sub && (\n                    <span className=\"text-muted-foreground font-mono text-[11px] tracking-wide lowercase\">\n                        {sub}\n                    </span>\n                )}\n                {delta && (\n                    <span\n                        className={cn(\n                            'font-mono text-[11px] tracking-wide',\n                            delta.value > 0\n                                ? 'text-success'\n                                : delta.value < 0\n                                  ? 'text-destructive'\n                                  : 'text-muted-foreground'\n                        )}\n                    >\n                        {delta.value > 0 ? '▲' : delta.value < 0 ? '▼' : '·'}{' '}\n                        {Math.abs(delta.value).toFixed(1)}\n                        {delta.suffix ?? '%'}\n                    </span>\n                )}\n            </div>\n        </div>\n    );\n}\n","import type { ReactNode } from 'react';\n\nimport { StatBlock } from '../primitives/stat-block';\nimport { cn } from '../tokens/cn';\n\nexport interface StatCardProps {\n    label: string;\n    value: ReactNode;\n    sub?: ReactNode;\n    /** Optional period-over-period delta arrow + colour. */\n    delta?: { value: number; suffix?: string } | null;\n    tone?: 'default' | 'success' | 'warning' | 'destructive';\n    /** Padding density — `sm` for dense grids, `default` for standalone cards. */\n    pad?: 'sm' | 'default';\n    className?: string;\n}\n\n/**\n * StatCard — a single stat in a bordered `bg-card` frame. The standalone\n * counterpart to StatBlock (the bare cell) and StatGrid (a laid-out grid):\n * this is the \"one stat in its own card\" shape that fleet (`dashboard/Stat`)\n * and me (`StatCell`, `ParticipationFeeCard` tiles, etc.) each hand-roll.\n * Wraps StatBlock so the inner cell stays single-source.\n */\nexport function StatCard({ pad = 'default', className, ...stat }: StatCardProps) {\n    return (\n        <div className={cn('border bg-card', pad === 'sm' ? 'p-3 md:p-4' : 'p-5', className)}>\n            <StatBlock {...stat} />\n        </div>\n    );\n}\n","import type { ReactNode } from 'react';\n\nimport { cn } from '../tokens/cn';\n\nexport type CalloutTone = 'info' | 'warning' | 'destructive' | 'success' | 'muted';\n\nexport interface CalloutProps {\n    tone?: CalloutTone;\n    /** Optional \"§ \"-prefixed mono header. */\n    label?: string;\n    /** Optional leading icon, sized by the caller (e.g. lucide `size-4`). */\n    icon?: ReactNode;\n    /** Body content. */\n    children: ReactNode;\n    /** Optional trailing action (button / link) pinned to the bottom. */\n    action?: ReactNode;\n    className?: string;\n}\n\nconst FRAME: Record<CalloutTone, string> = {\n    info: 'border-primary/30 bg-primary/5',\n    warning: 'border-warning/40 bg-warning/5',\n    destructive: 'border-destructive/40 bg-destructive/5',\n    success: 'border-success/40 bg-success/5',\n    muted: 'border-border bg-muted/20',\n};\n\nconst LABEL: Record<CalloutTone, string> = {\n    info: 'text-primary',\n    warning: 'text-warning',\n    destructive: 'text-destructive',\n    success: 'text-success',\n    muted: 'text-muted-foreground',\n};\n\n/**\n * Callout — the canonical toned panel (`border-{tone}/40 bg-{tone}/5` + an\n * optional `label-mono` header) reimplemented across stamp, pledge, vote,\n * analytics, and me (HealthBanner / SimulationBanner / FrozenBanner /\n * DangerZone, etc.). One component, five tones. For empty-states with CTAs use\n * EmptyState; for inline term help use HelpHint; this is the general\n * notice/banner frame.\n */\nexport function Callout({ tone = 'info', label, icon, children, action, className }: CalloutProps) {\n    return (\n        <div className={cn('border p-4 md:p-5', FRAME[tone], className)}>\n            {label && (\n                <div className={cn('label-mono mb-2 flex items-center gap-1.5', LABEL[tone])}>\n                    {icon}\n                    <span>§ {label}</span>\n                </div>\n            )}\n            <div className=\"text-foreground/85 text-sm leading-relaxed\">\n                {!label && icon ? (\n                    <span className={cn('mr-2 inline-flex align-middle', LABEL[tone])}>{icon}</span>\n                ) : null}\n                {children}\n            </div>\n            {action && <div className=\"mt-3 flex flex-wrap gap-3\">{action}</div>}\n        </div>\n    );\n}\n","import { Fragment, type ReactNode } from 'react';\n\nimport { cn } from '../tokens/cn';\n\nexport interface DefinitionItem {\n    label: ReactNode;\n    value: ReactNode;\n}\n\nexport interface DefinitionListProps {\n    items: DefinitionItem[];\n    className?: string;\n}\n\n/**\n * DefinitionList — the mono-label / value `<dl>` grid reimplemented in agent's\n * inspector, vote's reveal page, and me (BondAnchorCard, OperatorIdentityCard,\n * FrozenBanner). Labels render in uppercase mono; values align in a second\n * column on wider viewports, stacking on narrow ones. Long values (hashes,\n * addresses) wrap via `break-all`.\n */\nexport function DefinitionList({ items, className }: DefinitionListProps) {\n    return (\n        <dl\n            className={cn(\n                'grid gap-x-5 gap-y-2 text-sm sm:grid-cols-[auto_1fr] sm:items-baseline',\n                className\n            )}\n        >\n            {items.map((item, i) => (\n                <Fragment key={i}>\n                    <dt className=\"label-mono text-muted-foreground text-[10px]\">{item.label}</dt>\n                    <dd className=\"text-foreground font-mono text-xs break-all\">{item.value}</dd>\n                </Fragment>\n            ))}\n        </dl>\n    );\n}\n","import type { ElementType, ReactNode } from 'react';\n\nimport { cn } from '../tokens/cn';\n\nexport interface DataRowProps {\n    /** Primary content (left-aligned, grows to fill). */\n    children: ReactNode;\n    /** Trailing metadata pinned right (timestamp, count, status pill). */\n    meta?: ReactNode;\n    /** Optional action(s) rendered after the meta (button, link). */\n    action?: ReactNode;\n    /** Element to render as — `li` inside a list, `div` otherwise. */\n    as?: ElementType;\n    className?: string;\n}\n\n/**\n * DataRow — the \"content left, meta right, optional action\" list row\n * reimplemented across me (federations, incidents, grants, distributions,\n * fee entries) and other dashboards. Pair inside a `divide-y border` list.\n * On narrow viewports content and meta stack; from `sm` up they sit on one\n * baseline-aligned line.\n */\nexport function DataRow({ children, meta, action, as, className }: DataRowProps) {\n    const Tag = (as ?? 'div') as ElementType;\n    return (\n        <Tag\n            className={cn(\n                'flex flex-col gap-1 py-3 sm:flex-row sm:items-baseline sm:justify-between sm:gap-4',\n                className\n            )}\n        >\n            <div className=\"min-w-0 flex-1\">{children}</div>\n            {(meta || action) && (\n                <div className=\"flex shrink-0 items-center gap-3 sm:justify-end\">\n                    {meta && (\n                        <span className=\"text-muted-foreground font-mono text-[11px] tracking-wide\">\n                            {meta}\n                        </span>\n                    )}\n                    {action}\n                </div>\n            )}\n        </Tag>\n    );\n}\n"]}

package/dist/index.d.mts

@@ -1,6 +1,6 @@
 export { DEFAULT_OC_THEME, OC_DEFAULT_ACCENT, OC_SKIN_COOKIE, OC_THEMES, OcAppearanceMenu, OcAppearanceMenuProps, OcTheme, OcThemeBridge, OcThemeId, OcThemePicker, OcThemePickerProps, OcThemeProvider, OcThemeProviderProps, accentFor, cn, getOcThemeInitScript, isKnownTheme, resolveTheme, useOcSkin } from './tokens.mjs';
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AlertWithAction, AlertWithActionProps, AlertWithCountdown, AlertWithCountdownProps, Badge, Bar, BarProps, BitcoinAddress, BitcoinAddressProps, Button, Card, CardProps, Checkbox, ConfirmHost, ConfirmOptions, CopyButton, CopyButtonProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, ErrorBoundary, Input, Label, Modal, ModalProps, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PromptHost, PromptOptions, QrCode, QrCodeProps, RadioGroup, RadioGroupItem, SatsAmount, SatsAmountProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, SkeletonProps, Sparkline, SparklineProps, StatBlock, StatBlockProps, StatusPill, StatusPillProps, StatusPillSpec, StatusTone, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Working, WorkingPanel, WorkingProps, badgeVariants, buttonVariants, confirm, makeStatusPill, prompt } from './primitives.mjs';
-export { Callout, CalloutProps, CalloutTone, DataRow, DataRowProps, DefinitionItem, DefinitionList, DefinitionListProps, EmptyState, EmptyStateCta, EmptyStateProps, HelpHint, HelpHintProps, SectionHeader, SectionHeaderProps, StatGrid, StatGridProps, StatItem, StatTile } from './composites.mjs';
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AlertWithAction, AlertWithActionProps, AlertWithCountdown, AlertWithCountdownProps, Badge, Bar, BarProps, BitcoinAddress, BitcoinAddressProps, Button, Card, CardProps, Checkbox, ConfirmHost, ConfirmOptions, CopyButton, CopyButtonProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, ErrorBoundary, Input, Label, Modal, ModalProps, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PromptHost, PromptOptions, QrCode, QrCodeProps, RadioGroup, RadioGroupItem, SatsAmount, SatsAmountProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, SkeletonProps, Sparkline, SparklineProps, StatBlock, StatBlockProps, StatusPill, StatusPillProps, StatusPillSpec, StatusPillVariant, StatusTone, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Working, WorkingPanel, WorkingProps, badgeVariants, buttonVariants, confirm, makeStatusPill, prompt } from './primitives.mjs';
+export { Callout, CalloutProps, CalloutTone, DataRow, DataRowProps, DefinitionItem, DefinitionList, DefinitionListProps, EmptyState, EmptyStateCta, EmptyStateProps, HelpHint, HelpHintProps, SectionHeader, SectionHeaderProps, StatCard, StatCardProps, StatGrid, StatGridProps, StatItem, StatTile } from './composites.mjs';
 export { AppShell, AppShellProps, EcosystemSlug, EcosystemSwitcher, EcosystemSwitcherProps, FAMILY_PROPERTIES, FamilyCategory, FamilyProperty, LayoutSubHeader, LayoutSubHeaderProps, LayoutSubHeaderTag, OcAccountMenu, OcAccountMenuBuildInfo, OcAccountMenuItem, OcAccountMenuProps, OcAccountMenuSession, OcAccountMenuView, OcAccountMenuViewProps, OcDashboardHub, OcDashboardHubProps, OcDashboardShell, OcDashboardShellProps, OcDashboardTool, OcLogoDropdown, OcLogoDropdownProps, OcPrimaryNav, OcPrimaryNavLink, OcPrimaryNavProps, SITE_STATE_LABEL, SiteState, findFamilyProperty } from './chrome.mjs';
 export { ExplorerNetwork, ExplorerTarget, REFERENCE_BTC_USD, explorerUrl, formatSats, formatSatsCompact, priceBoth, relativeTime, satsToUsd, shortenAddress, usdToSats } from './format.mjs';
 import 'clsx';

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 export { DEFAULT_OC_THEME, OC_DEFAULT_ACCENT, OC_SKIN_COOKIE, OC_THEMES, OcAppearanceMenu, OcAppearanceMenuProps, OcTheme, OcThemeBridge, OcThemeId, OcThemePicker, OcThemePickerProps, OcThemeProvider, OcThemeProviderProps, accentFor, cn, getOcThemeInitScript, isKnownTheme, resolveTheme, useOcSkin } from './tokens.js';
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AlertWithAction, AlertWithActionProps, AlertWithCountdown, AlertWithCountdownProps, Badge, Bar, BarProps, BitcoinAddress, BitcoinAddressProps, Button, Card, CardProps, Checkbox, ConfirmHost, ConfirmOptions, CopyButton, CopyButtonProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, ErrorBoundary, Input, Label, Modal, ModalProps, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PromptHost, PromptOptions, QrCode, QrCodeProps, RadioGroup, RadioGroupItem, SatsAmount, SatsAmountProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, SkeletonProps, Sparkline, SparklineProps, StatBlock, StatBlockProps, StatusPill, StatusPillProps, StatusPillSpec, StatusTone, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Working, WorkingPanel, WorkingProps, badgeVariants, buttonVariants, confirm, makeStatusPill, prompt } from './primitives.js';
-export { Callout, CalloutProps, CalloutTone, DataRow, DataRowProps, DefinitionItem, DefinitionList, DefinitionListProps, EmptyState, EmptyStateCta, EmptyStateProps, HelpHint, HelpHintProps, SectionHeader, SectionHeaderProps, StatGrid, StatGridProps, StatItem, StatTile } from './composites.js';
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AlertWithAction, AlertWithActionProps, AlertWithCountdown, AlertWithCountdownProps, Badge, Bar, BarProps, BitcoinAddress, BitcoinAddressProps, Button, Card, CardProps, Checkbox, ConfirmHost, ConfirmOptions, CopyButton, CopyButtonProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, ErrorBoundary, Input, Label, Modal, ModalProps, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PromptHost, PromptOptions, QrCode, QrCodeProps, RadioGroup, RadioGroupItem, SatsAmount, SatsAmountProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, SkeletonProps, Sparkline, SparklineProps, StatBlock, StatBlockProps, StatusPill, StatusPillProps, StatusPillSpec, StatusPillVariant, StatusTone, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Working, WorkingPanel, WorkingProps, badgeVariants, buttonVariants, confirm, makeStatusPill, prompt } from './primitives.js';
+export { Callout, CalloutProps, CalloutTone, DataRow, DataRowProps, DefinitionItem, DefinitionList, DefinitionListProps, EmptyState, EmptyStateCta, EmptyStateProps, HelpHint, HelpHintProps, SectionHeader, SectionHeaderProps, StatCard, StatCardProps, StatGrid, StatGridProps, StatItem, StatTile } from './composites.js';
 export { AppShell, AppShellProps, EcosystemSlug, EcosystemSwitcher, EcosystemSwitcherProps, FAMILY_PROPERTIES, FamilyCategory, FamilyProperty, LayoutSubHeader, LayoutSubHeaderProps, LayoutSubHeaderTag, OcAccountMenu, OcAccountMenuBuildInfo, OcAccountMenuItem, OcAccountMenuProps, OcAccountMenuSession, OcAccountMenuView, OcAccountMenuViewProps, OcDashboardHub, OcDashboardHubProps, OcDashboardShell, OcDashboardShellProps, OcDashboardTool, OcLogoDropdown, OcLogoDropdownProps, OcPrimaryNav, OcPrimaryNavLink, OcPrimaryNavProps, SITE_STATE_LABEL, SiteState, findFamilyProperty } from './chrome.js';
 export { ExplorerNetwork, ExplorerTarget, REFERENCE_BTC_USD, explorerUrl, formatSats, formatSatsCompact, priceBoth, relativeTime, satsToUsd, shortenAddress, usdToSats } from './format.js';
 import 'clsx';

package/dist/index.js

@@ -1818,7 +1818,37 @@ var TONE = {
   primary: "text-primary",
   info: "text-info"
 };
-function StatusPill({ label, tone = "muted", icon, className }) {
+var BORDER_TONE = {
+  success: "border-success/40 text-success",
+  warning: "border-warning/40 text-warning",
+  destructive: "border-destructive/40 text-destructive",
+  muted: "border-muted-foreground/40 text-muted-foreground",
+  primary: "border-primary/40 text-primary",
+  info: "border-info/40 text-info"
+};
+function StatusPill({
+  label,
+  tone = "muted",
+  variant = "plain",
+  icon,
+  className
+}) {
+  if (variant === "bordered") {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "span",
+      {
+        className: cn(
+          "inline-flex items-center gap-1.5 border px-1.5 py-0.5 font-mono text-[9px] tracking-widest uppercase",
+          BORDER_TONE[tone],
+          className
+        ),
+        children: [
+          icon,
+          label
+        ]
+      }
+    );
+  }
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "span",
     {
@@ -1834,15 +1864,18 @@ function StatusPill({ label, tone = "muted", icon, className }) {
     }
   );
 }
-function makeStatusPill(map) {
+function makeStatusPill(map, options) {
+  const variant = options?.variant ?? "plain";
+  const fallbackTone = options?.fallbackTone ?? "muted";
   function DomainStatusPill({ status, className }) {
     const spec = map[status];
     return /* @__PURE__ */ jsxRuntime.jsx(
       StatusPill,
       {
-        tone: spec?.tone ?? "muted",
+        tone: spec?.tone ?? fallbackTone,
         label: spec?.label ?? status,
         icon: spec?.icon,
+        variant,
         className
       }
     );
@@ -2184,6 +2217,9 @@ function StatTile({ children, ...item }) {
     children
   ] });
 }
+function StatCard({ pad = "default", className, ...stat }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("border bg-card", pad === "sm" ? "p-3 md:p-4" : "p-5", className), children: /* @__PURE__ */ jsxRuntime.jsx(StatBlock, { ...stat }) });
+}
 var FRAME = {
   info: "border-primary/30 bg-primary/5",
   warning: "border-warning/40 bg-warning/5",
@@ -3939,6 +3975,7 @@ exports.SheetTrigger = SheetTrigger;
 exports.Skeleton = Skeleton;
 exports.Sparkline = Sparkline;
 exports.StatBlock = StatBlock;
+exports.StatCard = StatCard;
 exports.StatGrid = StatGrid;
 exports.StatTile = StatTile;
 exports.StatusPill = StatusPill;