@nadicodeai/ui 7.1.4 → 8.0.1

package/dist/components/chart-time-series.js

@@ -1,310 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Area, AreaChart, Bar, BarChart, BarStack, CartesianGrid, ComposedChart, Line, Rectangle, Text, XAxis, YAxis, } from "recharts";
-import { cn } from "../lib/utils.js";
-import { timeSeriesLayouts } from "./chart-time-series-layout.js";
-import { ChartContainer, ChartLegend, ChartLegendContent, ChartTooltip, ChartTooltipContent, } from "./chart.js";
-import { CHART_ENTITY_OTHER_COLOR, entityColor, } from "./chart-entity-colors.js";
-/**
- * chart-time-series — stacked time-series, categorical bars, and a
- * bars-plus-line composition for the console chart kit (issue #166), built on
- * the Recharts foundation (ChartContainer / ChartTooltip / ChartLegend; the
- * legend's own marks path is the one seam chart.tsx carries for this kit).
- *
- * Contract highlights (DESIGN.md "Mark specs", "Legends and labels"):
- * - A y-axis is ALWAYS present — never axisless stacks.
- * - Stacked segments keep a surface gap; the whole stack is wrapped in a
- *   Recharts `BarStack` so the 4px rounded data-ends sit on the visible top of
- *   the stack (anchored square at the baseline) even when the last series is
- *   zero-valued — the radius rounds the stack, not one hard-coded series.
- * - The public `valueFormatter` reaches every value surface — the table twin,
- *   the y-axis ticks, and the tooltip value — not only the hidden table cells.
- * - Series and categorical bar colors resolve from the shared page-context
- *   entity-color map, never from array index. Categorical bars run horizontally
- *   with every entity label visible; time-series axes keep their even stride.
- * - Direct labels are not feasible on stacked dailies, so at two or more
- *   series a legend identifies every series; a single series is titled by
- *   the accessible name, not legended.
- * - Every chart names a built-in table alternative: a visually hidden
- *   `<table>` twin renders the same series, and the chart root carries the
- *   accessible name. Recharts' `accessibilityLayer` (ARIA + arrow-key data
- *   navigation) stays enabled, and the focusable chart svg carries its own
- *   `title` so the accessibility tree names the graphic, not just the figure.
- * - `TimeSeriesComposed` draws measures with a different unit against a second
- *   axis: bars for the sums, a line for the rate over them. The shadcn registry
- *   was searched first (`npx shadcn@latest search @shadcn -q chart`, and
- *   `view @shadcn/chart-example`) and holds no composed item, so the composition
- *   is Recharts' `ComposedChart` through this same foundation.
- * - A series may carry a `mark`, printed beside its name in the legend. A model
- *   series uses it for its maker's mark, so color never identifies a model
- *   alone (rule `model-shown-with-logo`); the mark is decorative there, because
- *   the legend's own text names the series.
- */
-/**
- * The stock `ChartContainer` suppresses the Recharts svg outline
- * (`[&_.recharts-surface]:outline-hidden`) so the default browser focus ring
- * never shows, which would leave the `accessibilityLayer` keyboard path with
- * no visible focus — and that utility also beats the global base-layer focus
- * outline. chart.tsx is untouched, so we restore the canonical treatment
- * through the `className` we pass to our own `ChartContainer` instances: this
- * `:focus-visible` override sits on a distinct arbitrary-variant selector (a
- * different tailwind-merge group AND modifier, so `cn()` keeps both) with
- * higher CSS specificity, re-enabling the offset ink outline only while the
- * svg is keyboard-focused. `nc-focus-outline` writes `outline-style: solid`
- * outright, which is what gets past `outline-hidden` — that utility parks
- * `none` in the `--tw-outline-style` variable every Tailwind outline utility
- * reads, so a plain `focus-visible:outline` restates a suppression.
- */
-const CHART_SURFACE_FOCUS_CLASS = "[&_.recharts-surface:focus-visible]:nc-focus-outline " +
-    "[&_.recharts-surface:focus-visible]:outline-ring";
-/**
- * The x ticks land at ONE constant stride across the range, and the stride is
- * the smallest one whose labels still clear each other at the width the chart
- * actually has. Recharts' default `preserveEnd` fitting is greedy on label
- * width, so a 30-day axis draws the narrow early labels daily and then switches
- * to every other day once "Jul 10" is wider than "Jul 1" — the rhythm breaks
- * mid-chart, differently per locale. `equidistantPreserveStart` evaluates one
- * stride against every label and raises it until the whole run fits, so the
- * axis is even by construction AND survives a narrow viewport: a count fixed at
- * the wide case superimposed eight labels into an unreadable smear on a phone,
- * and worse in locales whose date labels run longer.
- */
-const X_AXIS_MIN_TICK_GAP = 48;
-/**
- * How many ticks the y axis draws, ends included. Recharts divides the data's
- * own maximum by this count when it is left to itself, which produces steps of
- * whatever the data happens to reach: one console chart read $0/$5/$10 while the
- * chart beside it read EUR0/9/18/27/36, and the two stopped sharing a numeric
- * register. The domain is rounded up to a step a person counts in instead.
- */
-const Y_AXIS_TICK_COUNT = 5;
-/** The steps a reader counts in, per order of magnitude. */
-const NICE_STEP_MULTIPLES = [1, 2, 2.5, 5, 10];
-function niceStep(rawStep) {
-    if (!Number.isFinite(rawStep) || rawStep <= 0)
-        return 1;
-    const magnitude = 10 ** Math.floor(Math.log10(rawStep));
-    const normalized = rawStep / magnitude;
-    const multiple = NICE_STEP_MULTIPLES.find((candidate) => normalized <= candidate) ?? 10;
-    return multiple * magnitude;
-}
-/**
- * The stacked maximum across the data, rounded up to a whole number of nice
- * steps. Returns `undefined` when there is nothing to bound, so the axis falls
- * back to recharts' own domain rather than pinning itself to zero.
- */
-function niceYDomainMax(data, series) {
-    let max = 0;
-    for (const datum of data) {
-        let total = 0;
-        for (const entry of series) {
-            const value = datum[entry.id];
-            if (typeof value === "number" && Number.isFinite(value))
-                total += value;
-        }
-        if (total > max)
-            max = total;
-    }
-    if (max <= 0)
-        return undefined;
-    const step = niceStep(max / (Y_AXIS_TICK_COUNT - 1));
-    return step * (Y_AXIS_TICK_COUNT - 1);
-}
-/**
- * The largest single value across `series`, rounded up to a whole number of
- * nice steps. A composed plot groups its bars instead of stacking them, so its
- * axis bounds one value rather than a column's sum. `undefined` when there is
- * nothing to bound, or when any value is negative: a diverging read fits its
- * own domain instead of being clipped to a zero-based one.
- */
-function niceSeriesDomainMax(data, series) {
-    let max = 0;
-    for (const datum of data) {
-        for (const entry of series) {
-            const value = datum[entry.id];
-            if (typeof value !== "number" || !Number.isFinite(value))
-                continue;
-            if (value < 0)
-                return undefined;
-            if (value > max)
-                max = value;
-        }
-    }
-    if (max <= 0)
-        return undefined;
-    const step = niceStep(max / (Y_AXIS_TICK_COUNT - 1));
-    return step * (Y_AXIS_TICK_COUNT - 1);
-}
-/**
- * Synthetic id/key for the single aggregated neutral series. Entities past the
- * sixth resolve to the neutral register, and rendering each as its own
- * indistinguishable neutral mark is unreadable, so they fold into ONE "Other"
- * series (values summed per bucket) in the marks, the legend, and the table
- * twin. Unknown to any entity-color map, so `entityColor` resolves it to the
- * neutral register.
- */
-const OTHER_SERIES_ID = "__nc-other-series__";
-function defaultFormat(value) {
-    return value.toLocaleString("en-US");
-}
-/**
- * Route the public `valueFormatter` through the visible tooltip, not only the
- * table twin. The stock shadcn tooltip takes a full-row `formatter`, so this
- * re-renders the stock row shape — entity swatch, series label, formatted
- * value — with each series' own formatter when it declares one and the chart's
- * otherwise, so a rate and a sum in one tooltip each read in their own terms. A
- * marked series prints its mark here too: rule `model-shown-with-logo` names
- * tooltips among the places a model appears, so the row reads swatch, mark,
- * name, value — the legend's order.
- */
-function tooltipRowFormatter(series, valueFormatter) {
-    const byId = new Map(series.map((entry) => [entry.id, entry]));
-    return (value, name, item) => {
-        const entry = byId.get(String(name));
-        const format = entry?.valueFormatter ?? valueFormatter;
-        return (_jsxs(_Fragment, { children: [_jsx("span", { "data-slot": "time-series-tooltip-swatch", className: "size-2.5 shrink-0 rounded-xs", style: { backgroundColor: item.color ?? item.payload?.fill } }), entry?.mark, _jsxs("span", { className: "flex flex-1 items-center justify-between gap-2 leading-none", children: [_jsx("span", { className: "text-muted-foreground", children: entry?.label ?? name }), _jsx("span", { className: "font-mono font-medium text-foreground tabular-nums", children: typeof value === "number" ? format(value) : String(value) })] })] }));
-    };
-}
-/**
- * The chart config the legend and tooltip read: a series' label and its color.
- * A series' mark is identity, not part of this record — both surfaces read the
- * config's label, so an identity placed here would reach both unasked. The
- * legend takes marks through `ChartLegendContent`'s own path instead.
- */
-function seriesChartConfig(series, entityColorMap) {
-    return Object.fromEntries(series.map((entry) => [
-        entry.id,
-        { label: entry.label, color: entityColor(entityColorMap, entry.id) },
-    ]));
-}
-/**
- * Each series' mark by data key, for the legend's marks path. `undefined` when
- * no series carries one, which leaves a chart of customers or accounts on the
- * stock legend.
- */
-function seriesMarks(series) {
-    const marked = series.filter((entry) => entry.mark);
-    return marked.length === 0
-        ? undefined
-        : Object.fromEntries(marked.map((entry) => [entry.id, entry.mark]));
-}
-/**
- * Fold every series whose entity color resolves to the neutral "other"
- * register into ONE aggregated "Other" series (values summed per bucket).
- * Beyond six entities the color map returns the neutral register, and drawing
- * each tail entity as its own indistinguishable neutral mark is unreadable —
- * so the marks, legend, and table twin all show at most one neutral series.
- * Series resolving to a hue pass through unchanged; with no neutral series the
- * inputs return untouched (so ≤6 series are never rewritten).
- */
-function foldNeutralSeries(series, entityColorMap, data, otherLabel) {
-    const isNeutral = (entry) => entityColor(entityColorMap, entry.id) === CHART_ENTITY_OTHER_COLOR;
-    const neutral = series.filter(isNeutral);
-    if (neutral.length === 0) {
-        return { series: [...series], data: [...data] };
-    }
-    const hued = series.filter((entry) => !isNeutral(entry));
-    const foldedSeries = [...hued, { id: OTHER_SERIES_ID, label: otherLabel }];
-    const foldedData = data.map((datum) => {
-        const otherSum = neutral.reduce((sum, entry) => {
-            const value = datum[entry.id];
-            return sum + (typeof value === "number" ? value : 0);
-        }, 0);
-        const next = { ...datum };
-        for (const entry of neutral) {
-            delete next[entry.id];
-        }
-        next[OTHER_SERIES_ID] = otherSum;
-        return next;
-    });
-    return { series: foldedSeries, data: foldedData };
-}
-function TimeSeriesTableAlternative({ data, xKey, xLabel, series, label, valueFormatter, }) {
-    return (_jsxs("table", { className: "sr-only", children: [_jsx("caption", { className: "sr-only", children: label }), _jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { scope: "col", children: xLabel }), series.map((entry) => (_jsx("th", { scope: "col", children: entry.label }, entry.id)))] }) }), _jsx("tbody", { children: data.map((datum, index) => (_jsxs("tr", { children: [_jsx("th", { scope: "row", children: String(datum[xKey] ?? "") }), series.map((entry) => {
-                            const value = datum[entry.id];
-                            return (_jsx("td", { children: typeof value === "number"
-                                    ? (entry.valueFormatter ?? valueFormatter)(value)
-                                    : String(value ?? "") }, entry.id));
-                        })] }, index))) })] }));
-}
-function TimeSeriesFrame({ label, className, children, ...props }) {
-    return (_jsx("figure", { "aria-label": label, className: cn("m-0 flex w-full flex-col", className), ...props, children: children }));
-}
-function TimeSeriesBars({ data, xKey, series, entityColorMap, label, xLabel = "Period", valueFormatter = defaultFormat, yAxisWidth, otherLabel = "Other", barCategoryKey, size = "default", className, ...props }) {
-    if (barCategoryKey) {
-        const config = seriesChartConfig(series, entityColorMap);
-        const coloredData = data.map((datum) => ({
-            ...datum,
-            fill: entityColor(entityColorMap, String(datum[barCategoryKey] ?? "")),
-        }));
-        const domainMax = niceYDomainMax(data, series);
-        return (_jsxs(TimeSeriesFrame, { "data-slot": "categorical-bars", label: label, className: className, ...props, children: [_jsx(ChartContainer, { config: config, className: cn("w-full aspect-auto", CHART_SURFACE_FOCUS_CLASS), style: { height: Math.max(256, data.length * 64 + 40) }, children: _jsxs(BarChart, { accessibilityLayer: true, title: label, data: coloredData, layout: "vertical", children: [_jsx(CartesianGrid, { horizontal: false }), _jsx(XAxis, { type: "number", tickLine: false, axisLine: false, tickCount: 3, ...(domainMax === undefined ? {} : { domain: [0, domainMax] }), tickFormatter: (value) => valueFormatter(Number(value)) }), _jsx(YAxis, { type: "category", dataKey: xKey, width: 120, interval: 0, tickLine: false, axisLine: false, tick: ({ x, y, payload }) => (_jsx(Text, { x: x, y: y, width: 108, breakAll: true, maxLines: 2, "aria-label": String(payload.value), textAnchor: "end", verticalAnchor: "middle", className: "fill-muted-foreground", children: String(payload.value) })) }), _jsx(ChartTooltip, { content: _jsx(ChartTooltipContent, { formatter: (value, name, item) => tooltipRowFormatter(series, valueFormatter)(value, name, {
-                                        ...item,
-                                        color: item.payload?.fill,
-                                    }, 0, []) }) }), series.map((entry) => (_jsx(Bar, { dataKey: entry.id, isAnimationActive: false, maxBarSize: 24, shape: ({ x, y, width, height, originalDataIndex }) => (_jsx(Rectangle, { x: x, y: y, width: width, height: height, radius: [0, 4, 4, 0], fill: coloredData[originalDataIndex]?.fill })) }, entry.id)))] }) }), _jsx(TimeSeriesTableAlternative, { data: data, xKey: xKey, xLabel: xLabel, series: series, label: label, valueFormatter: valueFormatter })] }));
-    }
-    const folded = foldNeutralSeries(series, entityColorMap, data, otherLabel);
-    const config = seriesChartConfig(folded.series, entityColorMap);
-    const marks = seriesMarks(folded.series);
-    const yDomainMax = niceYDomainMax(folded.data, folded.series);
-    return (_jsxs(TimeSeriesFrame, { "data-slot": "time-series-bars", label: label, className: cn(timeSeriesLayouts[size].frame, className), ...props, children: [_jsx(ChartContainer, { config: config, className: cn("w-full aspect-auto", timeSeriesLayouts[size].chart, CHART_SURFACE_FOCUS_CLASS), children: _jsxs(BarChart, { accessibilityLayer: true, title: label, data: folded.data, children: [_jsx(CartesianGrid, { vertical: false }), _jsx(XAxis, { dataKey: xKey, tickLine: false, axisLine: false, tickMargin: 8, interval: "equidistantPreserveStart", minTickGap: X_AXIS_MIN_TICK_GAP }), _jsx(YAxis, { tickLine: false, axisLine: false, width: yAxisWidth ?? "auto", tickCount: Y_AXIS_TICK_COUNT, ...(yDomainMax === undefined ? {} : { domain: [0, yDomainMax] }), tickFormatter: (value) => valueFormatter(Number(value)) }), _jsx(ChartTooltip, { content: _jsx(ChartTooltipContent, { formatter: tooltipRowFormatter(folded.series, valueFormatter) }) }), folded.series.length > 1 ? (_jsx(ChartLegend, { content: _jsx(ChartLegendContent, { marks: marks }) })) : null, _jsx(BarStack, { radius: [4, 4, 0, 0], children: folded.series.map((entry) => (_jsx(Bar, { dataKey: entry.id, isAnimationActive: false, maxBarSize: 24, fill: entityColor(entityColorMap, entry.id), stroke: "var(--background)", strokeWidth: 2 }, entry.id))) })] }) }), _jsx(TimeSeriesTableAlternative, { data: folded.data, xKey: xKey, xLabel: xLabel, series: folded.series, label: label, valueFormatter: valueFormatter })] }));
-}
-function TimeSeriesArea({ data, xKey, series, entityColorMap, label, xLabel = "Period", valueFormatter = defaultFormat, yAxisWidth, otherLabel = "Other", size = "default", className, ...props }) {
-    const folded = foldNeutralSeries(series, entityColorMap, data, otherLabel);
-    const config = seriesChartConfig(folded.series, entityColorMap);
-    const marks = seriesMarks(folded.series);
-    const yDomainMax = niceYDomainMax(folded.data, folded.series);
-    return (_jsxs(TimeSeriesFrame, { "data-slot": "time-series-area", label: label, className: cn(timeSeriesLayouts[size].frame, className), ...props, children: [_jsx(ChartContainer, { config: config, className: cn("w-full aspect-auto", timeSeriesLayouts[size].chart, CHART_SURFACE_FOCUS_CLASS), children: _jsxs(AreaChart, { accessibilityLayer: true, title: label, data: folded.data, margin: { top: 5, right: 20, bottom: 5, left: 20 }, children: [_jsx(CartesianGrid, { vertical: false }), _jsx(XAxis, { dataKey: xKey, tickLine: false, axisLine: false, tickMargin: 8, interval: "equidistantPreserveStart", minTickGap: X_AXIS_MIN_TICK_GAP }), _jsx(YAxis, { tickLine: false, axisLine: false, width: yAxisWidth ?? "auto", tickCount: Y_AXIS_TICK_COUNT, ...(yDomainMax === undefined ? {} : { domain: [0, yDomainMax] }), tickFormatter: (value) => valueFormatter(Number(value)) }), _jsx(ChartTooltip, { content: _jsx(ChartTooltipContent, { formatter: tooltipRowFormatter(folded.series, valueFormatter) }) }), folded.series.length > 1 ? (_jsx(ChartLegend, { content: _jsx(ChartLegendContent, { marks: marks }) })) : null, folded.series.map((entry) => {
-                            const color = entityColor(entityColorMap, entry.id);
-                            return (_jsx(Area, { type: "monotone", dataKey: entry.id, isAnimationActive: false, stackId: "stacked", stroke: color, strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", fill: color, 
-                                // DESIGN.md mark specs: an area fill reads as a light wash
-                                // (roughly 10% opacity) under a full-strength line.
-                                fillOpacity: 0.1, 
-                                // Recharts' default activeDot ring is stroke #fff, which the
-                                // chart foundation remaps to transparent — an explicit surface
-                                // ring keeps the DESIGN.md 2px marker-ring spec on hover/focus.
-                                activeDot: {
-                                    r: 4,
-                                    stroke: "var(--background)",
-                                    strokeWidth: 2,
-                                } }, entry.id));
-                        })] }) }), _jsx(TimeSeriesTableAlternative, { data: folded.data, xKey: xKey, xLabel: xLabel, series: folded.series, label: label, valueFormatter: valueFormatter })] }));
-}
-/**
- * Bars for the measures, a line over them for the rate, and a second axis for
- * the rate's own unit. The shadcn registry holds no composed chart item (see the
- * file header), so this is Recharts' `ComposedChart` through the same
- * foundation, and it keeps the kit's whole contract: a named figure, a
- * `accessibilityLayer` graphic with its own title, a legend at two or more
- * series, an entity-colored pair of marks, and a table twin carrying each
- * series in its own terms.
- */
-function TimeSeriesComposed({ data, xKey, series, entityColorMap, label, xLabel = "Period", valueFormatter = defaultFormat, yAxisWidth, size = "default", className, ...props }) {
-    const config = seriesChartConfig(series, entityColorMap);
-    const marks = seriesMarks(series);
-    const leftSeries = series.filter((entry) => entry.axis !== "right");
-    const rightSeries = series.filter((entry) => entry.axis === "right");
-    const leftDomainMax = niceSeriesDomainMax(data, leftSeries);
-    const rightDomainMax = niceSeriesDomainMax(data, rightSeries);
-    const leftFormatter = leftSeries[0]?.valueFormatter ?? valueFormatter;
-    const rightFormatter = rightSeries[0]?.valueFormatter ?? valueFormatter;
-    return (_jsxs(TimeSeriesFrame, { "data-slot": "time-series-composed", label: label, className: cn(timeSeriesLayouts[size].frame, className), ...props, children: [_jsx(ChartContainer, { config: config, className: cn("w-full aspect-auto", timeSeriesLayouts[size].chart, CHART_SURFACE_FOCUS_CLASS), children: _jsxs(ComposedChart, { accessibilityLayer: true, title: label, data: data, children: [_jsx(CartesianGrid, { vertical: false }), _jsx(XAxis, { dataKey: xKey, tickLine: false, axisLine: false, tickMargin: 8, interval: "equidistantPreserveStart", minTickGap: X_AXIS_MIN_TICK_GAP }), _jsx(YAxis, { yAxisId: "left", tickLine: false, axisLine: false, width: yAxisWidth ?? "auto", tickCount: Y_AXIS_TICK_COUNT, ...(leftDomainMax === undefined
-                                ? {}
-                                : { domain: [0, leftDomainMax] }), tickFormatter: (value) => leftFormatter(Number(value)) }), rightSeries.length > 0 ? (_jsx(YAxis, { yAxisId: "right", orientation: "right", tickLine: false, axisLine: false, width: yAxisWidth ?? "auto", tickCount: Y_AXIS_TICK_COUNT, ...(rightDomainMax === undefined
-                                ? {}
-                                : { domain: [0, rightDomainMax] }), tickFormatter: (value) => rightFormatter(Number(value)) })) : null, _jsx(ChartTooltip, { content: _jsx(ChartTooltipContent, { formatter: tooltipRowFormatter(series, valueFormatter) }) }), series.length > 1 ? (_jsx(ChartLegend, { content: _jsx(ChartLegendContent, { marks: marks }) })) : null, series.map((entry) => {
-                            const color = entityColor(entityColorMap, entry.id);
-                            const yAxisId = entry.axis === "right" ? "right" : "left";
-                            return entry.kind === "bar" ? (_jsx(Bar, { yAxisId: yAxisId, dataKey: entry.id, isAnimationActive: false, maxBarSize: 24, radius: [4, 4, 0, 0], fill: color, fillOpacity: entry.fillOpacity }, entry.id)) : (_jsx(Line, { yAxisId: yAxisId, type: "monotone", dataKey: entry.id, isAnimationActive: false, stroke: color, strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", 
-                                // DESIGN.md mark specs: a point marker runs at least 8px with a
-                                // 2px surface ring, and the marker itself carries the series'
-                                // hue — Recharts fills a dot white, which reads as a hole on the
-                                // light surface and stays white in dark mode. Both markers are
-                                // configured: the active one arrives ringless, because the chart
-                                // foundation maps Recharts' white active stroke to transparent.
-                                dot: entry.dot
-                                    ? { r: 4, fill: color, stroke: "var(--background)", strokeWidth: 2 }
-                                    : false, activeDot: { r: 4, stroke: "var(--background)", strokeWidth: 2 } }, entry.id));
-                        })] }) }), _jsx(TimeSeriesTableAlternative, { data: data, xKey: xKey, xLabel: xLabel, series: series, label: label, valueFormatter: valueFormatter })] }));
-}
-export { TimeSeriesArea, TimeSeriesBars, TimeSeriesComposed };

package/dist/components/stat-block.d.ts

@@ -1,24 +0,0 @@
-import * as React from "react";
-/**
- * stat-block — single statistic fill (replaces the retired `.nc-stat-block`).
- *
- * A large tabular numeral over a mono label. Seam-free canvas fill: it drops into
- * the `StatsBand` grid which owns the hairline dividers (gap-as-seam), so it draws
- * NO border and is square-cornered. `surface="ink"` inverts onto the ink role for
- * a dark band; inside a `StatsBand surface="night"` the ancestor `.dark` class
- * flips the default canvas roles, so a plain `StatBlock` reads dark there.
- * `StatBlockFigureAccent` marks the verde substring of a figure (`text-primary`).
- * Token-only; no `dark:` styling.
- */
-declare function StatBlock({ className, surface, ...props }: React.ComponentProps<"div"> & {
-    surface?: "canvas" | "ink";
-}): React.JSX.Element;
-declare function StatBlockFigure({ className, surface, ...props }: React.ComponentProps<"div"> & {
-    surface?: "canvas" | "ink";
-}): React.JSX.Element;
-declare function StatBlockFigureAccent({ className, ...props }: React.ComponentProps<"span">): React.JSX.Element;
-declare function StatBlockLabel({ className, surface, ...props }: React.ComponentProps<"div"> & {
-    surface?: "canvas" | "ink";
-}): React.JSX.Element;
-export { StatBlock, StatBlockFigure, StatBlockFigureAccent, StatBlockLabel };
-//# sourceMappingURL=stat-block.d.ts.map

package/dist/components/stat-block.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"stat-block.d.ts","sourceRoot":"","sources":["../../src/components/stat-block.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B;;;;;;;;;;GAUG;AAEH,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,OAAkB,EAClB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;CAAE,qBAa9D;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,OAAkB,EAClB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;CAAE,qBAY9D;AAED,iBAAS,qBAAqB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,qBAQnF;AAED,iBAAS,cAAc,CAAC,EACtB,SAAS,EACT,OAAkB,EAClB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;CAAE,qBAY9D;AAED,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,qBAAqB,EAAE,cAAc,EAAE,CAAC"}

package/dist/components/stat-block.js

@@ -1,26 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { cn } from "../lib/utils.js";
-/**
- * stat-block — single statistic fill (replaces the retired `.nc-stat-block`).
- *
- * A large tabular numeral over a mono label. Seam-free canvas fill: it drops into
- * the `StatsBand` grid which owns the hairline dividers (gap-as-seam), so it draws
- * NO border and is square-cornered. `surface="ink"` inverts onto the ink role for
- * a dark band; inside a `StatsBand surface="night"` the ancestor `.dark` class
- * flips the default canvas roles, so a plain `StatBlock` reads dark there.
- * `StatBlockFigureAccent` marks the verde substring of a figure (`text-primary`).
- * Token-only; no `dark:` styling.
- */
-function StatBlock({ className, surface = "canvas", ...props }) {
-    return (_jsx("div", { "data-slot": "stat-block", "data-surface": surface, className: cn("grid min-h-24 content-center gap-1.5 p-6", surface === "ink" ? "bg-primary" : "bg-card", className), ...props }));
-}
-function StatBlockFigure({ className, surface = "canvas", ...props }) {
-    return (_jsx("div", { "data-slot": "stat-block-figure", className: cn("text-[clamp(2rem,3.2vw,2.875rem)] leading-none font-bold tabular-nums", surface === "ink" ? "text-primary-foreground" : "text-foreground", className), ...props }));
-}
-function StatBlockFigureAccent({ className, ...props }) {
-    return (_jsx("span", { "data-slot": "stat-block-figure-accent", className: cn("text-primary", className), ...props }));
-}
-function StatBlockLabel({ className, surface = "canvas", ...props }) {
-    return (_jsx("div", { "data-slot": "stat-block-label", className: cn("font-mono text-xs uppercase", surface === "ink" ? "text-primary-foreground" : "text-muted-foreground", className), ...props }));
-}
-export { StatBlock, StatBlockFigure, StatBlockFigureAccent, StatBlockLabel };

package/dist/components/stats-band.d.ts

@@ -1,22 +0,0 @@
-import * as React from "react";
-/**
- * stats-band — proof row of headline statistics (replaces the retired
- * `sections/stats-band.css` + its coupled `stat-block` cells).
- *
- * SINGLE-OWNER SEAM: the dividers between blocks are owned once by the grid
- * (`gap-px bg-border` = the retired gap-as-seam). Each `StatBlock` is a borderless,
- * square-cornered fill, so no coordinate carries two lines. `surface="ink"` flips
- * the band onto the ink role; only the seam COLOUR changes (the grid background
- * mixes toward the surface), never its weight, so the grid keeps sole ownership.
- *
- * `surface="night"` is the always-dark V5 stats band (B12): rather than a `dark:`
- * utility (forbidden) it sets the `dark` ancestor class on the grid root, so the
- * seam (`bg-border`) and every `StatBlock` role resolve to their dark value while
- * the grid keeps its plain canvas seam. Token-only; no `dark:` styling.
- */
-declare function StatsBand({ className, columns, surface, ...props }: React.ComponentProps<"div"> & {
-    columns?: 2 | 3 | 4 | 5 | 6;
-    surface?: "canvas" | "ink" | "night";
-}): React.JSX.Element;
-export { StatsBand };
-//# sourceMappingURL=stats-band.d.ts.map

package/dist/components/stats-band.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"stats-band.d.ts","sourceRoot":"","sources":["../../src/components/stats-band.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B;;;;;;;;;;;;;;GAcG;AAEH,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,OAAW,EACX,OAAkB,EAClB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC5B,OAAO,CAAC,EAAE,QAAQ,GAAG,KAAK,GAAG,OAAO,CAAC;CACtC,qBAmBA;AAED,OAAO,EAAE,SAAS,EAAE,CAAC"}

package/dist/components/stats-band.js

@@ -1,32 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { cn } from "../lib/utils.js";
-import { SeamGrid } from "./seam-grid.js";
-const STATS_BAND_COLUMNS = {
-    2: "grid-cols-1 sm:grid-cols-2",
-    3: "grid-cols-1 sm:grid-cols-3",
-    4: "grid-cols-2 lg:grid-cols-4",
-    5: "grid-cols-2 lg:grid-cols-5",
-    6: "grid-cols-2 lg:grid-cols-6",
-};
-/**
- * stats-band — proof row of headline statistics (replaces the retired
- * `sections/stats-band.css` + its coupled `stat-block` cells).
- *
- * SINGLE-OWNER SEAM: the dividers between blocks are owned once by the grid
- * (`gap-px bg-border` = the retired gap-as-seam). Each `StatBlock` is a borderless,
- * square-cornered fill, so no coordinate carries two lines. `surface="ink"` flips
- * the band onto the ink role; only the seam COLOUR changes (the grid background
- * mixes toward the surface), never its weight, so the grid keeps sole ownership.
- *
- * `surface="night"` is the always-dark V5 stats band (B12): rather than a `dark:`
- * utility (forbidden) it sets the `dark` ancestor class on the grid root, so the
- * seam (`bg-border`) and every `StatBlock` role resolve to their dark value while
- * the grid keeps its plain canvas seam. Token-only; no `dark:` styling.
- */
-function StatsBand({ className, columns = 4, surface = "canvas", ...props }) {
-    // night carries the plain canvas seam and lets the `dark` root flip its colour;
-    // ink/canvas pass straight through to the surface-driven seam colour.
-    const seamSurface = surface === "night" ? "canvas" : surface;
-    return (_jsx(SeamGrid, { "data-slot": "stats-band", "data-surface": surface, surface: seamSurface, className: cn("h-full", surface === "night" && "dark", STATS_BAND_COLUMNS[columns], className), ...props }));
-}
-export { StatsBand };