@corbits/react-ui 0.1.0 → 0.2.0

package/dist/ui/block-card.js

@@ -8,59 +8,21 @@ import { cn } from "../lib/utils.js";
  * can tell "the agent made this" at a glance. Lifted out of a consumer app
  * unchanged; see `RiskBadge` below for the tone it pairs with inside
  * `children`.
- */ export function BlockCard({ title, children, className }) {
-    return /*#__PURE__*/ _jsxs("div", {
-        "data-slot": "block-card",
-        className: cn("overflow-hidden rounded-none border border-border bg-card", className),
-        children: [
-            /*#__PURE__*/ _jsxs("div", {
-                "data-slot": "block-card-header",
-                className: "flex items-center gap-2 border-b border-border px-3.5 py-2.5 text-xs font-bold tracking-[0.02em] text-primary-emphasis",
-                children: [
-                    /*#__PURE__*/ _jsx("span", {
-                        "aria-hidden": true,
-                        className: "size-1.5 shrink-0 rounded-none bg-current [animation:corbits-block-pulse_1.6s_ease_infinite]"
-                    }),
-                    /*#__PURE__*/ _jsx("span", {
-                        "data-slot": "block-card-title",
-                        children: title
-                    })
-                ]
-            }),
-            /*#__PURE__*/ _jsx("div", {
-                "data-slot": "block-card-body",
-                className: "p-4",
-                children: children
-            })
-        ]
-    });
+ */
+export function BlockCard({ title, children, className }) {
+    return (_jsxs("div", { "data-slot": "block-card", className: cn("overflow-hidden rounded-none border border-border bg-card", className), children: [_jsxs("div", { "data-slot": "block-card-header", className: "flex items-center gap-2 border-b border-border px-3.5 py-2.5 text-xs font-bold tracking-[0.02em] text-primary-emphasis", children: [_jsx("span", { "aria-hidden": true, className: "size-1.5 shrink-0 rounded-none bg-current [animation:corbits-block-pulse_1.6s_ease_infinite]" }), _jsx("span", { "data-slot": "block-card-title", children: title })] }), _jsx("div", { "data-slot": "block-card-body", className: "p-4", children: children })] }));
 }
 const RISK_TONE_CLASS = {
     low: "text-muted-foreground",
     medium: "text-warn",
-    high: "text-destructive"
+    high: "text-destructive",
 };
 /**
  * A risk callout for a block whose action carries consequence — approve this
  * order cancellation, run this migration. `level` drives colour only; the
  * `label` is what actually says what the risk is, so the badge is never a
  * bare colour dot.
- */ export function RiskBadge({ level, label, note, className }) {
-    return /*#__PURE__*/ _jsxs("span", {
-        "data-slot": "risk-badge",
-        "data-risk": level,
-        className: cn("inline-flex items-center gap-1.5 text-xs font-bold [&_svg]:size-3.5", RISK_TONE_CLASS[level], className),
-        children: [
-            /*#__PURE__*/ _jsx(TriangleAlert, {
-                "aria-hidden": true
-            }),
-            /*#__PURE__*/ _jsx("span", {
-                children: label
-            }),
-            note === undefined ? null : /*#__PURE__*/ _jsx("span", {
-                className: "font-medium text-muted-foreground",
-                children: note
-            })
-        ]
-    });
+ */
+export function RiskBadge({ level, label, note, className }) {
+    return (_jsxs("span", { "data-slot": "risk-badge", "data-risk": level, className: cn("inline-flex items-center gap-1.5 text-xs font-bold [&_svg]:size-3.5", RISK_TONE_CLASS[level], className), children: [_jsx(TriangleAlert, { "aria-hidden": true }), _jsx("span", { children: label }), note === undefined ? null : (_jsx("span", { className: "font-medium text-muted-foreground", children: note }))] }));
 }

package/dist/ui/boot-screen.d.ts

@@ -20,4 +20,4 @@ export type BootScreenProps = {
  * to a still frame under the theme's reduced-motion rule with nothing to do
  * here.
  */
-export declare function BootScreen({ message, brand, footer, className }: BootScreenProps): import("react").JSX.Element;
+export declare function BootScreen({ message, brand, footer, className, }: BootScreenProps): import("react").JSX.Element;

package/dist/ui/boot-screen.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useId } from "react";
 import { cn } from "../lib/utils.js";
@@ -12,38 +13,8 @@ import { cn } from "../lib/utils.js";
  * No spinner: the pulsing bar is decorative and `aria-hidden`, and it collapses
  * to a still frame under the theme's reduced-motion rule with nothing to do
  * here.
- */ export function BootScreen({ message, brand, footer, className }) {
+ */
+export function BootScreen({ message, brand, footer, className, }) {
     const messageId = useId();
-    return /*#__PURE__*/ _jsxs("div", {
-        role: "status",
-        "aria-labelledby": messageId,
-        className: cn("absolute inset-0 overflow-hidden bg-background text-foreground", className),
-        children: [
-            brand === undefined ? null : /*#__PURE__*/ _jsx("div", {
-                className: "absolute top-6 left-7",
-                children: brand
-            }),
-            /*#__PURE__*/ _jsxs("div", {
-                className: "absolute inset-0 flex flex-col items-center justify-center gap-4 p-6",
-                children: [
-                    /*#__PURE__*/ _jsx("span", {
-                        "aria-hidden": true,
-                        className: "h-0.5 w-24 overflow-hidden rounded-full bg-muted",
-                        children: /*#__PURE__*/ _jsx("span", {
-                            className: "block h-full w-1/3 rounded-full bg-primary [animation:corbits-boot-sweep_1.4s_ease-in-out_infinite]"
-                        })
-                    }),
-                    /*#__PURE__*/ _jsx("p", {
-                        id: messageId,
-                        className: "max-w-[32ch] text-center text-xs leading-relaxed text-muted-foreground",
-                        children: message
-                    })
-                ]
-            }),
-            footer === undefined ? null : /*#__PURE__*/ _jsx("div", {
-                className: "absolute bottom-6 left-7 font-mono text-[11px] text-muted-foreground",
-                children: footer
-            })
-        ]
-    });
+    return (_jsxs("div", { role: "status", "aria-labelledby": messageId, className: cn("absolute inset-0 overflow-hidden bg-background text-foreground", className), children: [brand === undefined ? null : (_jsx("div", { className: "absolute top-6 left-7", children: brand })), _jsxs("div", { className: "absolute inset-0 flex flex-col items-center justify-center gap-4 p-6", children: [_jsx("span", { "aria-hidden": true, className: "h-0.5 w-24 overflow-hidden rounded-full bg-muted", children: _jsx("span", { className: "block h-full w-1/3 rounded-full bg-primary [animation:corbits-boot-sweep_1.4s_ease-in-out_infinite]" }) }), _jsx("p", { id: messageId, className: "max-w-[32ch] text-center text-xs leading-relaxed text-muted-foreground", children: message })] }), footer === undefined ? null : (_jsx("div", { className: "absolute bottom-6 left-7 font-mono text-[11px] text-muted-foreground", children: footer }))] }));
 }

package/dist/ui/bulk-action-bar.d.ts

@@ -34,4 +34,4 @@ export type BulkActionBarProps = {
  * already handled its own Escape wins instead of also clearing the
  * selection underneath it.
  */
-export declare function BulkActionBar({ count, onClear, children, label, className }: BulkActionBarProps): import("react").JSX.Element | null;
+export declare function BulkActionBar({ count, onClear, children, label, className, }: BulkActionBarProps): import("react").JSX.Element | null;

package/dist/ui/bulk-action-bar.js

@@ -1,4 +1,5 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+"use client";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import { useEffect } from "react";
 import { cn } from "../lib/utils.js";
 /**
@@ -26,39 +27,19 @@ import { cn } from "../lib/utils.js";
  * `event.defaultPrevented`, so a dialog or input stacked above the bar that
  * already handled its own Escape wins instead of also clearing the
  * selection underneath it.
- */ export function BulkActionBar({ count, onClear, children, label = "Bulk actions", className }) {
-    useEffect(()=>{
-        if (count === 0) return;
+ */
+export function BulkActionBar({ count, onClear, children, label = "Bulk actions", className, }) {
+    useEffect(() => {
+        if (count === 0)
+            return;
         function onKeyDown(event) {
-            if (event.key === "Escape" && !event.defaultPrevented) onClear();
+            if (event.key === "Escape" && !event.defaultPrevented)
+                onClear();
         }
         window.addEventListener("keydown", onKeyDown);
-        return ()=>window.removeEventListener("keydown", onKeyDown);
-    }, [
-        count,
-        onClear
-    ]);
-    if (count === 0) return null;
-    return /*#__PURE__*/ _jsx("div", {
-        className: cn("fixed bottom-6 left-1/2 z-40 -translate-x-1/2", className),
-        children: /*#__PURE__*/ _jsxs("div", {
-            role: "group",
-            "aria-label": label,
-            className: cn("flex items-center gap-3 rounded-full border border-border bg-card px-4 py-2 shadow-lg", "motion-safe:[animation:corbits-bulk-action-bar-in_220ms_var(--ease-out)_both]"),
-            children: [
-                /*#__PURE__*/ _jsxs("span", {
-                    "aria-live": "polite",
-                    className: "text-sm font-medium whitespace-nowrap",
-                    children: [
-                        count,
-                        " selected"
-                    ]
-                }),
-                /*#__PURE__*/ _jsx("div", {
-                    className: "flex items-center gap-2",
-                    children: children
-                })
-            ]
-        })
-    });
+        return () => window.removeEventListener("keydown", onKeyDown);
+    }, [count, onClear]);
+    if (count === 0)
+        return null;
+    return (_jsx("div", { className: cn("fixed bottom-6 left-1/2 z-40 -translate-x-1/2", className), children: _jsxs("div", { role: "group", "aria-label": label, className: cn("flex items-center gap-3 rounded-full border border-border bg-card px-4 py-2 shadow-lg", "motion-safe:[animation:corbits-bulk-action-bar-in_220ms_var(--ease-out)_both]"), children: [_jsxs("span", { "aria-live": "polite", className: "text-sm font-medium whitespace-nowrap", children: [count, " selected"] }), _jsx("div", { className: "flex items-center gap-2", children: children })] }) }));
 }

package/dist/ui/button.js

@@ -10,7 +10,8 @@ import { cn } from "../lib/utils.js";
 // orange primary. That measures 2.69:1, a hard AA failure. `text-primary-
 // foreground` resolves to ink in light (5.53:1) and black in dark (5.34:1),
 // which is correct. DESIGN.md is wrong; do not "fix" this back.
-const buttonVariantsBase = cva(// active:brightness-95 is the press state for every variant: it darkens the
+const buttonVariantsBase = cva(
+// active:brightness-95 is the press state for every variant: it darkens the
 // rendered fill whatever that fill is, so it needs no per-variant pressed
 // token. Deliberately outside `transition-colors` — a press should land on
 // the frame the pointer goes down, not ease in. The scale feedback gets its
@@ -24,33 +25,25 @@ const buttonVariantsBase = cva(// active:brightness-95 is the press state for ev
             outline: "border border-input bg-transparent hover:bg-muted",
             ghost: "hover:bg-muted",
             link: "text-primary-emphasis underline-offset-4 hover:underline",
-            destructive: "bg-destructive text-destructive-foreground hover:opacity-90"
+            destructive: "bg-destructive text-destructive-foreground hover:opacity-90",
         },
         size: {
             sm: "h-8 px-3",
             md: "h-9 px-4",
             lg: "h-10 px-6",
-            icon: "size-9"
-        }
+            icon: "size-9",
+        },
     },
     // link reads as inline text, not a control — it opts out of every size's
     // fixed height/padding rather than getting a box of its own.
     compoundVariants: [
         {
             variant: "link",
-            size: [
-                "sm",
-                "md",
-                "lg",
-                "icon"
-            ],
-            class: "h-auto px-0"
-        }
+            size: ["sm", "md", "lg", "icon"],
+            class: "h-auto px-0",
+        },
     ],
-    defaultVariants: {
-        variant: "primary",
-        size: "md"
-    }
+    defaultVariants: { variant: "primary", size: "md" },
 });
 // cva concatenates variant, size, and compound-variant classes as plain
 // strings with no dedup, so the compound override above only wins once
@@ -61,13 +54,6 @@ function buttonVariants(props) {
 }
 export function Button({ className, variant, size, asChild = false, ...props }) {
     const Comp = asChild ? Slot : "button";
-    return /*#__PURE__*/ _jsx(Comp, {
-        "data-slot": "button",
-        className: cn(buttonVariants({
-            variant,
-            size
-        }), className),
-        ...props
-    });
+    return (_jsx(Comp, { "data-slot": "button", className: cn(buttonVariants({ variant, size }), className), ...props }));
 }
 export { buttonVariants };

package/dist/ui/card.js

@@ -1,37 +1,17 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cn } from "../lib/utils.js";
 export function Card({ className, ...props }) {
-    return /*#__PURE__*/ _jsx("div", {
-        "data-slot": "card",
-        className: cn("flex flex-col gap-4 rounded-lg border border-border bg-card p-6 text-card-foreground", className),
-        ...props
-    });
+    return (_jsx("div", { "data-slot": "card", className: cn("flex flex-col gap-4 rounded-lg border border-border bg-card p-6 text-card-foreground", className), ...props }));
 }
 export function CardHeader({ className, ...props }) {
-    return /*#__PURE__*/ _jsx("div", {
-        "data-slot": "card-header",
-        className: cn("flex flex-col gap-1", className),
-        ...props
-    });
+    return (_jsx("div", { "data-slot": "card-header", className: cn("flex flex-col gap-1", className), ...props }));
 }
 export function CardTitle({ className, ...props }) {
-    return /*#__PURE__*/ _jsx("h3", {
-        "data-slot": "card-title",
-        className: cn("text-base leading-none font-semibold", className),
-        ...props
-    });
+    return (_jsx("h3", { "data-slot": "card-title", className: cn("text-base leading-none font-semibold", className), ...props }));
 }
 export function CardDescription({ className, ...props }) {
-    return /*#__PURE__*/ _jsx("p", {
-        "data-slot": "card-description",
-        className: cn("text-sm text-muted-foreground", className),
-        ...props
-    });
+    return (_jsx("p", { "data-slot": "card-description", className: cn("text-sm text-muted-foreground", className), ...props }));
 }
 export function CardFooter({ className, ...props }) {
-    return /*#__PURE__*/ _jsx("div", {
-        "data-slot": "card-footer",
-        className: cn("flex items-center gap-2", className),
-        ...props
-    });
+    return (_jsx("div", { "data-slot": "card-footer", className: cn("flex items-center gap-2", className), ...props }));
 }

package/dist/ui/category-bars.js

@@ -6,64 +6,19 @@ import { ChartFrame } from "./chart-frame.js";
  * Dense horizontal category ranking for cost-by-model / calls-by-tool
  * style tables. Bars share one series colour; length encodes magnitude.
  * Absent secondary labels stay empty rather than inventing a zero.
- */ export function CategoryBars({ title, description, data, valueLabel = "Value", format = formatCompact, className }) {
-    const max = Math.max(0, ...data.map((d)=>d.value));
+ */
+export function CategoryBars({ title, description, data, valueLabel = "Value", format = formatCompact, className, }) {
+    const max = Math.max(0, ...data.map((d) => d.value));
     const axisMax = max === 0 ? 1 : max;
-    return /*#__PURE__*/ _jsx(ChartFrame, {
-        title: title,
-        ...description === undefined ? {} : {
-            description
-        },
-        table: {
-            columns: [
-                "Category",
-                valueLabel,
-                "Detail"
-            ],
-            rows: data.map((datum)=>[
-                    datum.label,
-                    format(datum.value),
-                    datum.secondaryLabel ?? "—"
-                ])
-        },
-        className: className,
-        children: /*#__PURE__*/ _jsx("div", {
-            className: "flex flex-col gap-2",
-            role: "presentation",
-            children: data.map((datum)=>{
-                const pct = datum.value / axisMax * 100;
-                return /*#__PURE__*/ _jsxs("div", {
-                    className: "grid grid-cols-[minmax(6rem,10rem)_1fr_auto] items-center gap-2",
-                    children: [
-                        /*#__PURE__*/ _jsx("p", {
-                            className: "truncate text-xs font-medium",
-                            children: datum.label
-                        }),
-                        /*#__PURE__*/ _jsx("div", {
-                            className: "h-3 w-full bg-muted",
-                            children: /*#__PURE__*/ _jsx("div", {
-                                className: cn("h-full bg-primary-emphasis"),
-                                style: {
-                                    width: `${pct}%`
-                                }
-                            })
-                        }),
-                        /*#__PURE__*/ _jsxs("div", {
-                            className: "min-w-[3.5rem] text-right font-mono text-[11px] leading-tight",
-                            children: [
-                                /*#__PURE__*/ _jsx("p", {
-                                    className: "font-semibold",
-                                    children: format(datum.value)
-                                }),
-                                datum.secondaryLabel === undefined ? null : /*#__PURE__*/ _jsx("p", {
-                                    className: "text-muted-foreground",
-                                    children: datum.secondaryLabel
-                                })
-                            ]
-                        })
-                    ]
-                }, datum.label);
-            })
-        })
-    });
+    return (_jsx(ChartFrame, { title: title, ...(description === undefined ? {} : { description }), table: {
+            columns: ["Category", valueLabel, "Detail"],
+            rows: data.map((datum) => [
+                datum.label,
+                format(datum.value),
+                datum.secondaryLabel ?? "—",
+            ]),
+        }, className: className, children: _jsx("div", { className: "flex flex-col gap-2", role: "presentation", children: data.map((datum) => {
+                const pct = (datum.value / axisMax) * 100;
+                return (_jsxs("div", { className: "grid grid-cols-[minmax(6rem,10rem)_1fr_auto] items-center gap-2", children: [_jsx("p", { className: "truncate text-xs font-medium", children: datum.label }), _jsx("div", { className: "h-3 w-full bg-muted", children: _jsx("div", { className: cn("h-full bg-primary-emphasis"), style: { width: `${pct}%` } }) }), _jsxs("div", { className: "min-w-[3.5rem] text-right font-mono text-[11px] leading-tight", children: [_jsx("p", { className: "font-semibold", children: format(datum.value) }), datum.secondaryLabel === undefined ? null : (_jsx("p", { className: "text-muted-foreground", children: datum.secondaryLabel }))] })] }, datum.label));
+            }) }) }));
 }

package/dist/ui/chart-frame.d.ts

@@ -29,7 +29,7 @@ export type ChartFrameProps = {
     readonly table: ChartTable;
     /** The plot itself — an `<svg>`. */
     readonly children: ReactNode;
-    readonly className?: string;
+    readonly className?: string | undefined;
 };
 /**
  * The frame every chart here sits in: a caption, a legend, the plot, and the
@@ -51,4 +51,4 @@ export type ChartFrameProps = {
  * cross-reference. Text never wears the series colour: a mid-lightness hue that
  * is correct for a 24px bar is unreadable at 12px.
  */
-export declare function ChartFrame({ title, description, legend, table, children, className }: ChartFrameProps): import("react").JSX.Element;
+export declare function ChartFrame({ title, description, legend, table, children, className, }: ChartFrameProps): import("react").JSX.Element;

package/dist/ui/chart-frame.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { cn } from "../lib/utils.js";
-import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "./table.js";
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from "./table.js";
 /**
  * The frame every chart here sits in: a caption, a legend, the plot, and the
  * same data as a table.
@@ -20,89 +20,10 @@ import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from ".
  * swatch with text — the text is the identity channel, the swatch is the
  * cross-reference. Text never wears the series colour: a mid-lightness hue that
  * is correct for a 24px bar is unreadable at 12px.
- */ export function ChartFrame({ title, description, legend, table, children, className }) {
+ */
+export function ChartFrame({ title, description, legend, table, children, className, }) {
     const showLegend = legend !== undefined && legend.length > 1;
-    return /*#__PURE__*/ _jsxs("figure", {
-        className: cn("flex flex-col gap-3", className),
-        children: [
-            /*#__PURE__*/ _jsxs("figcaption", {
-                className: "flex flex-col gap-0.5",
-                children: [
-                    /*#__PURE__*/ _jsx("span", {
-                        className: "text-sm font-semibold",
-                        children: title
-                    }),
-                    description === undefined ? null : /*#__PURE__*/ _jsx("span", {
-                        className: "text-xs text-muted-foreground",
-                        children: description
-                    })
-                ]
-            }),
-            showLegend ? /*#__PURE__*/ _jsx("ul", {
-                className: "flex flex-wrap items-center gap-x-4 gap-y-1",
-                children: legend.map((entry)=>/*#__PURE__*/ _jsxs("li", {
-                        className: "flex items-center gap-1.5 text-xs text-muted-foreground",
-                        children: [
-                            entry.dash === undefined ? /*#__PURE__*/ _jsx("span", {
-                                "aria-hidden": true,
-                                className: "size-2.5 shrink-0 rounded-xs",
-                                style: {
-                                    backgroundColor: entry.color
-                                }
-                            }) : /*#__PURE__*/ _jsx("svg", {
-                                "aria-hidden": true,
-                                viewBox: "0 0 20 4",
-                                className: "h-1 w-5 shrink-0 overflow-visible",
-                                children: /*#__PURE__*/ _jsx("line", {
-                                    x1: 0,
-                                    y1: 2,
-                                    x2: 20,
-                                    y2: 2,
-                                    stroke: entry.color,
-                                    strokeWidth: 2.5,
-                                    strokeLinecap: "butt",
-                                    strokeDasharray: entry.dash
-                                })
-                            }),
-                            entry.label
-                        ]
-                    }, entry.label))
-            }) : null,
-            children,
-            /*#__PURE__*/ _jsxs("details", {
-                className: "text-xs",
-                children: [
-                    /*#__PURE__*/ _jsx("summary", {
-                        className: "cursor-pointer text-muted-foreground hover:text-foreground",
-                        children: "Show the data"
-                    }),
-                    /*#__PURE__*/ _jsx("div", {
-                        className: "mt-2",
-                        children: /*#__PURE__*/ _jsxs(Table, {
-                            "aria-label": `${title} — data`,
-                            children: [
-                                /*#__PURE__*/ _jsx(TableHeader, {
-                                    children: /*#__PURE__*/ _jsx(TableRow, {
-                                        children: table.columns.map((column, index)=>/*#__PURE__*/ _jsx(TableHead, {
-                                                scope: "col",
-                                                className: index === 0 ? undefined : "text-right",
-                                                children: column
-                                            }, column))
-                                    })
-                                }),
-                                /*#__PURE__*/ _jsx(TableBody, {
-                                    children: table.rows.map((row, rowIndex)=>/*#__PURE__*/ _jsx(TableRow, {
-                                            children: row.map((cell, cellIndex)=>/*#__PURE__*/ _jsx(TableCell, {
-                                                    className: cellIndex === 0 ? undefined : "text-right font-mono tabular-nums",
-                                                    children: cell
-                                                }, cellIndex))
-                                        }, rowIndex))
-                                })
-                            ]
-                        })
-                    })
-                ]
-            })
-        ]
-    });
+    return (_jsxs("figure", { className: cn("flex flex-col gap-3", className), children: [_jsxs("figcaption", { className: "flex flex-col gap-0.5", children: [_jsx("span", { className: "text-sm font-semibold", children: title }), description === undefined ? null : (_jsx("span", { className: "text-xs text-muted-foreground", children: description }))] }), showLegend ? (_jsx("ul", { className: "flex flex-wrap items-center gap-x-4 gap-y-1", children: legend.map((entry) => (_jsxs("li", { className: "flex items-center gap-1.5 text-xs text-muted-foreground", children: [entry.dash === undefined ? (_jsx("span", { "aria-hidden": true, className: "size-2.5 shrink-0 rounded-xs", style: { backgroundColor: entry.color } })) : (_jsx("svg", { "aria-hidden": true, viewBox: "0 0 20 4", className: "h-1 w-5 shrink-0 overflow-visible", children: _jsx("line", { x1: 0, y1: 2, x2: 20, y2: 2, stroke: entry.color, strokeWidth: 2.5, strokeLinecap: "butt", strokeDasharray: entry.dash }) })), entry.label] }, entry.label))) })) : null, children, _jsxs("details", { className: "text-xs", children: [_jsx("summary", { className: "cursor-pointer text-muted-foreground hover:text-foreground", children: "Show the data" }), _jsx("div", { className: "mt-2", children: _jsxs(Table, { "aria-label": `${title} — data`, children: [_jsx(TableHeader, { children: _jsx(TableRow, { children: table.columns.map((column, index) => (_jsx(TableHead, { scope: "col", className: index === 0 ? undefined : "text-right", children: column }, column))) }) }), _jsx(TableBody, { children: table.rows.map((row, rowIndex) => (_jsx(TableRow, { children: row.map((cell, cellIndex) => (_jsx(TableCell, { className: cellIndex === 0
+                                                ? undefined
+                                                : "text-right font-mono tabular-nums", children: cell }, cellIndex))) }, rowIndex))) })] }) })] })] }));
 }

package/dist/ui/chat-composer.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useRef } from "react";
 import { useDelayedAutofocus } from "../hooks/use-delayed-autofocus.js";
@@ -10,23 +11,10 @@ import { QuickReplyChips } from "./quick-reply-chips.js";
  * always-on, because a suggestion list next to ten prior turns is not a
  * suggestion anymore — it is clutter competing with what the user already
  * said.
- */ export function ChatComposer({ suggestions = [], onSuggestionSelect, busy = false, autoFocusOn = false, className, ...inputProps }) {
+ */
+export function ChatComposer({ suggestions = [], onSuggestionSelect, busy = false, autoFocusOn = false, className, ...inputProps }) {
     const textareaRef = useRef(null);
     useDelayedAutofocus(textareaRef, autoFocusOn);
     const showSuggestions = suggestions.length > 0 && onSuggestionSelect !== undefined;
-    return /*#__PURE__*/ _jsxs("div", {
-        className: cn("flex flex-col gap-2", className),
-        children: [
-            showSuggestions ? /*#__PURE__*/ _jsx(QuickReplyChips, {
-                replies: suggestions,
-                onSelect: onSuggestionSelect
-            }) : null,
-            /*#__PURE__*/ _jsx(ChatInput, {
-                ...inputProps,
-                working: busy,
-                disabled: busy,
-                textareaRef: textareaRef
-            })
-        ]
-    });
+    return (_jsxs("div", { className: cn("flex flex-col gap-2", className), children: [showSuggestions ? (_jsx(QuickReplyChips, { replies: suggestions, onSelect: onSuggestionSelect })) : null, _jsx(ChatInput, { ...inputProps, working: busy, disabled: busy, textareaRef: textareaRef })] }));
 }

package/dist/ui/chat-dock-timing.js

@@ -2,10 +2,14 @@
  * The dock's one source of truth for motion timing. Every duration that has
  * to line up with another — the entrance pop, the scrim fade, the autofocus
  * delay — lives here so fixing one never means hunting the others down.
- */ /** How long the closed→docked entrance pop takes, in milliseconds. */ export const CHAT_DOCK_ENTRANCE_MS = 280;
-/** The scrim's own fade, coordinated to finish alongside the entrance. */ export const CHAT_DOCK_SCRIM_MS = CHAT_DOCK_ENTRANCE_MS;
+ */
+/** How long the closed→docked entrance pop takes, in milliseconds. */
+export const CHAT_DOCK_ENTRANCE_MS = 280;
+/** The scrim's own fade, coordinated to finish alongside the entrance. */
+export const CHAT_DOCK_SCRIM_MS = CHAT_DOCK_ENTRANCE_MS;
 /**
  * The composer's autofocus delay. Must be `>=` the entrance duration — focus
  * landing before the panel has finished animating steals the caret out from
  * under a still-moving element.
- */ export const CHAT_DOCK_AUTOFOCUS_DELAY_MS = CHAT_DOCK_ENTRANCE_MS;
+ */
+export const CHAT_DOCK_AUTOFOCUS_DELAY_MS = CHAT_DOCK_ENTRANCE_MS;