cursedbelt 0.0.0

package/dist/react/charts/ChartTooltip.d.ts

@@ -0,0 +1,35 @@
+import type { ReactNode } from 'react';
+import { type ChartTokens } from './tokens';
+type TooltipItem = {
+    name?: ReactNode;
+    value?: number | string;
+    color?: string;
+    dataKey?: string | number;
+};
+export type ChartTooltipProps = {
+    active?: boolean;
+    payload?: ReadonlyArray<TooltipItem>;
+    label?: string | number;
+    tokens?: ChartTokens;
+    /** Format the tooltip header (the x value). */
+    labelFormatter?: (label: string | number) => ReactNode;
+    /** Format each row's value. */
+    valueFormatter?: (value: number, name?: string) => ReactNode;
+};
+/**
+ * A themed recharts tooltip content renderer. Background is the popover Surface (a
+ * lighter elevation in dark mode), with border + text from the tokens. Charts pass it
+ * via `tooltipContent(tokens)`; standalone it falls back to the dark token set.
+ */
+export declare function ChartTooltip({ active, payload, label, tokens, labelFormatter, valueFormatter, }: ChartTooltipProps): import("react").JSX.Element | null;
+/**
+ * Build a `<Tooltip content={…}>` renderer bound to the chart's live tokens. recharts
+ * hands the content fn loosely-typed props; we narrow to ChartTooltip's shape.
+ */
+export declare const tooltipContent: (tokens: ChartTokens, labelFormatter?: ChartTooltipProps["labelFormatter"], valueFormatter?: ChartTooltipProps["valueFormatter"]) => (p: {
+    active?: boolean;
+    payload?: unknown;
+    label?: string | number;
+}) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=ChartTooltip.d.ts.map

package/dist/react/charts/ChartTooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTooltip.d.ts","sourceRoot":"","sources":["../../../src/react/charts/ChartTooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,KAAK,WAAW,EAAmB,MAAM,UAAU,CAAC;AAE7D,KAAK,WAAW,GAAG;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,aAAa,CAAC,WAAW,CAAC,CAAC;IACrC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,+CAA+C;IAC/C,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,SAAS,CAAC;IACvD,+BAA+B;IAC/B,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,KAAK,SAAS,CAAC;CAC9D,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,EAC3B,MAAM,EACN,OAAO,EACP,KAAK,EACL,MAAwB,EACxB,cAAc,EACd,cAAc,GACf,EAAE,iBAAiB,sCAoCnB;AAED;;;GAGG;AACH,eAAO,MAAM,cAAc,GAEvB,QAAQ,WAAW,EACnB,iBAAiB,iBAAiB,CAAC,gBAAgB,CAAC,EACpD,iBAAiB,iBAAiB,CAAC,gBAAgB,CAAC,MAErD,GAAG;IAAE,MAAM,CAAC,EAAE,OAAO,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,gCASnE,CAAC"}

package/dist/react/charts/ChartTooltip.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { FALLBACK_TOKENS } from './tokens';
+/**
+ * A themed recharts tooltip content renderer. Background is the popover Surface (a
+ * lighter elevation in dark mode), with border + text from the tokens. Charts pass it
+ * via `tooltipContent(tokens)`; standalone it falls back to the dark token set.
+ */
+export function ChartTooltip({ active, payload, label, tokens = FALLBACK_TOKENS, labelFormatter, valueFormatter, }) {
+    if (!active || !payload?.length)
+        return null;
+    return (_jsxs("div", { className: 'rounded-lg px-3 py-2 text-xs shadow-[var(--shadow-popover)]', style: {
+            backgroundColor: tokens.surface,
+            border: `1px solid ${tokens.border}`,
+            color: tokens.foreground,
+        }, children: [label !== undefined && label !== '' && (_jsx("div", { className: 'mb-1 font-medium', children: labelFormatter ? labelFormatter(label) : String(label) })), _jsx("div", { className: 'flex flex-col gap-0.5', children: payload.map((entry, i) => {
+                    const name = typeof entry.name === 'string' ? entry.name : undefined;
+                    const numeric = typeof entry.value === 'number' ? entry.value : Number(entry.value ?? 0);
+                    return (_jsxs("div", { className: 'flex items-center gap-2', children: [_jsx("span", { className: 'inline-block h-2 w-2 shrink-0 rounded-full', style: { backgroundColor: entry.color } }), entry.name != null && _jsx("span", { className: 'opacity-70', children: entry.name }), _jsx("span", { className: 'ml-auto pl-3 font-semibold tabular-nums', children: valueFormatter ? valueFormatter(numeric, name) : numeric })] }, String(entry.dataKey ?? name ?? i)));
+                }) })] }));
+}
+/**
+ * Build a `<Tooltip content={…}>` renderer bound to the chart's live tokens. recharts
+ * hands the content fn loosely-typed props; we narrow to ChartTooltip's shape.
+ */
+export const tooltipContent = (tokens, labelFormatter, valueFormatter) => (p) => (_jsx(ChartTooltip, { active: p.active, payload: p.payload, label: p.label, tokens: tokens, labelFormatter: labelFormatter, valueFormatter: valueFormatter }));
+//# sourceMappingURL=ChartTooltip.js.map

package/dist/react/charts/ChartTooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTooltip.js","sourceRoot":"","sources":["../../../src/react/charts/ChartTooltip.tsx"],"names":[],"mappings":";AACA,OAAO,EAAoB,eAAe,EAAE,MAAM,UAAU,CAAC;AAoB7D;;;;GAIG;AACH,MAAM,UAAU,YAAY,CAAC,EAC3B,MAAM,EACN,OAAO,EACP,KAAK,EACL,MAAM,GAAG,eAAe,EACxB,cAAc,EACd,cAAc,GACI;IAClB,IAAI,CAAC,MAAM,IAAI,CAAC,OAAO,EAAE,MAAM;QAAE,OAAO,IAAI,CAAC;IAC7C,OAAO,CACL,eACE,SAAS,EAAC,6DAA6D,EACvE,KAAK,EAAE;YACL,eAAe,EAAE,MAAM,CAAC,OAAO;YAC/B,MAAM,EAAE,aAAa,MAAM,CAAC,MAAM,EAAE;YACpC,KAAK,EAAE,MAAM,CAAC,UAAU;SACzB,aAEA,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,EAAE,IAAI,CACtC,cAAK,SAAS,EAAC,kBAAkB,YAC9B,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GACnD,CACP,EACD,cAAK,SAAS,EAAC,uBAAuB,YACnC,OAAO,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;oBACxB,MAAM,IAAI,GAAG,OAAO,KAAK,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC;oBACrE,MAAM,OAAO,GAAG,OAAO,KAAK,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC;oBACzF,OAAO,CACL,eAA8C,SAAS,EAAC,yBAAyB,aAC/E,eACE,SAAS,EAAC,4CAA4C,EACtD,KAAK,EAAE,EAAE,eAAe,EAAE,KAAK,CAAC,KAAK,EAAE,GACvC,EACD,KAAK,CAAC,IAAI,IAAI,IAAI,IAAI,eAAM,SAAS,EAAC,YAAY,YAAE,KAAK,CAAC,IAAI,GAAQ,EACvE,eAAM,SAAS,EAAC,yCAAyC,YACtD,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,OAAO,GACpD,KARC,MAAM,CAAC,KAAK,CAAC,OAAO,IAAI,IAAI,IAAI,CAAC,CAAC,CAStC,CACP,CAAC;gBACJ,CAAC,CAAC,GACE,IACF,CACP,CAAC;AACJ,CAAC;AAED;;;GAGG;AACH,MAAM,CAAC,MAAM,cAAc,GACzB,CACE,MAAmB,EACnB,cAAoD,EACpD,cAAoD,EACpD,EAAE,CACJ,CAAC,CAAmE,EAAE,EAAE,CAAC,CACvE,KAAC,YAAY,IACX,MAAM,EAAE,CAAC,CAAC,MAAM,EAChB,OAAO,EAAE,CAAC,CAAC,OAAuC,EAClD,KAAK,EAAE,CAAC,CAAC,KAAK,EACd,MAAM,EAAE,MAAM,EACd,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,cAAc,GAC9B,CACH,CAAC"}

package/dist/react/charts/DivergingBars.d.ts

@@ -0,0 +1,16 @@
+export type DivergingDatum = {
+    label: string;
+    left: number;
+    right: number;
+};
+type Props = {
+    data: DivergingDatum[];
+    leftLabel?: string;
+    rightLabel?: string;
+    labelClassName?: string;
+    valueFormatter?: (n: number) => string;
+    emptyHint?: string;
+};
+export declare const DivergingBars: ({ data, leftLabel, rightLabel, labelClassName, valueFormatter, emptyHint, }: Props) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=DivergingBars.d.ts.map

package/dist/react/charts/DivergingBars.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DivergingBars.d.ts","sourceRoot":"","sources":["../../../src/react/charts/DivergingBars.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,cAAc,GAAG;IAE3B,KAAK,EAAE,MAAM,CAAC;IAEd,IAAI,EAAE,MAAM,CAAC;IAEb,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,cAAc,EAAE,CAAC;IAEvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAOF,eAAO,MAAM,aAAa,GAAI,6EAO3B,KAAK,gCAoDP,CAAC"}

package/dist/react/charts/DivergingBars.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cx } from '../styling';
+// A horizontal diverging ("tornado") bar list: each row's `left` magnitude grows
+// leftward from a center axis (rose) and `right` grows rightward (emerald), both
+// scaled to the largest single magnitude so the longest bar fills its half. Used
+// for two-sided comparisons — commits behind/ahead of a branch, over/under budget,
+// loss/gain. Pure layout (no recharts); wrap it in your own card + title.
+export const DivergingBars = ({ data, leftLabel, rightLabel, labelClassName = 'w-32', valueFormatter = String, emptyHint = 'No data', }) => {
+    if (!data.length)
+        return _jsx("div", { className: 'text-sm text-gray-400', children: emptyHint });
+    const max = Math.max(1, ...data.map((d) => Math.max(d.left, d.right)));
+    return (_jsxs("div", { className: 'flex flex-col gap-2', children: [(leftLabel || rightLabel) && (_jsxs("div", { className: 'flex justify-end text-xs text-gray-400', children: [leftLabel && _jsx("span", { className: 'text-rose-500', children: leftLabel }), " \u2190 | \u2192", ' ', rightLabel && _jsx("span", { className: 'text-emerald-500', children: rightLabel })] })), _jsx("div", { className: 'flex flex-col gap-1', children: data.map((d) => (_jsxs("div", { className: 'flex items-center gap-2 text-xs', children: [_jsx("span", { className: cx('shrink-0 truncate text-right text-gray-600 dark:text-gray-300', labelClassName), title: d.label, children: d.label }), _jsxs("div", { className: 'flex flex-1 items-center', children: [_jsx("div", { className: 'flex flex-1 justify-end', children: d.left > 0 && (_jsx("div", { className: 'h-3 rounded-l bg-rose-500/80', style: { width: `${(d.left / max) * 100}%` } })) }), _jsx("div", { className: 'h-3.5 w-px bg-gray-300 dark:bg-gray-600' }), _jsx("div", { className: 'flex flex-1 justify-start', children: d.right > 0 && (_jsx("div", { className: 'h-3 rounded-r bg-emerald-500/80', style: { width: `${(d.right / max) * 100}%` } })) })] }), _jsxs("span", { className: 'w-20 shrink-0 tabular-nums text-gray-400', children: [d.left > 0 && _jsxs("span", { className: 'text-rose-500', children: ["-", valueFormatter(d.left)] }), d.left > 0 && d.right > 0 && ' ', d.right > 0 && _jsxs("span", { className: 'text-emerald-500', children: ["+", valueFormatter(d.right)] })] })] }, d.label))) })] }));
+};
+//# sourceMappingURL=DivergingBars.js.map

package/dist/react/charts/DivergingBars.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DivergingBars.js","sourceRoot":"","sources":["../../../src/react/charts/DivergingBars.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,YAAY,CAAC;AAuBhC,iFAAiF;AACjF,iFAAiF;AACjF,iFAAiF;AACjF,mFAAmF;AACnF,0EAA0E;AAC1E,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAC5B,IAAI,EACJ,SAAS,EACT,UAAU,EACV,cAAc,GAAG,MAAM,EACvB,cAAc,GAAG,MAAM,EACvB,SAAS,GAAG,SAAS,GACf,EAAE,EAAE;IACV,IAAI,CAAC,IAAI,CAAC,MAAM;QAAE,OAAO,cAAK,SAAS,EAAC,uBAAuB,YAAE,SAAS,GAAO,CAAC;IAClF,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;IACvE,OAAO,CACL,eAAK,SAAS,EAAC,qBAAqB,aACjC,CAAC,SAAS,IAAI,UAAU,CAAC,IAAI,CAC5B,eAAK,SAAS,EAAC,wCAAwC,aACpD,SAAS,IAAI,eAAM,SAAS,EAAC,eAAe,YAAE,SAAS,GAAQ,sBAAQ,GAAG,EAC1E,UAAU,IAAI,eAAM,SAAS,EAAC,kBAAkB,YAAE,UAAU,GAAQ,IACjE,CACP,EACD,cAAK,SAAS,EAAC,qBAAqB,YACjC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CACf,eAAmB,SAAS,EAAC,iCAAiC,aAC5D,eACE,SAAS,EAAE,EAAE,CACX,+DAA+D,EAC/D,cAAc,CACf,EACD,KAAK,EAAE,CAAC,CAAC,KAAK,YAEb,CAAC,CAAC,KAAK,GACH,EACP,eAAK,SAAS,EAAC,0BAA0B,aACvC,cAAK,SAAS,EAAC,yBAAyB,YACrC,CAAC,CAAC,IAAI,GAAG,CAAC,IAAI,CACb,cACE,SAAS,EAAC,8BAA8B,EACxC,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,CAAC,CAAC,CAAC,IAAI,GAAG,GAAG,CAAC,GAAG,GAAG,GAAG,EAAE,GAC5C,CACH,GACG,EACN,cAAK,SAAS,EAAC,yCAAyC,GAAG,EAC3D,cAAK,SAAS,EAAC,2BAA2B,YACvC,CAAC,CAAC,KAAK,GAAG,CAAC,IAAI,CACd,cACE,SAAS,EAAC,iCAAiC,EAC3C,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,CAAC,CAAC,CAAC,KAAK,GAAG,GAAG,CAAC,GAAG,GAAG,GAAG,EAAE,GAC7C,CACH,GACG,IACF,EACN,gBAAM,SAAS,EAAC,0CAA0C,aACvD,CAAC,CAAC,IAAI,GAAG,CAAC,IAAI,gBAAM,SAAS,EAAC,eAAe,kBAAG,cAAc,CAAC,CAAC,CAAC,IAAI,CAAC,IAAQ,EAC9E,CAAC,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,CAAC,KAAK,GAAG,CAAC,IAAI,GAAG,EAChC,CAAC,CAAC,KAAK,GAAG,CAAC,IAAI,gBAAM,SAAS,EAAC,kBAAkB,kBAAG,cAAc,CAAC,CAAC,CAAC,KAAK,CAAC,IAAQ,IAC/E,KAjCC,CAAC,CAAC,KAAK,CAkCX,CACP,CAAC,GACE,IACF,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/react/charts/DonutChart.d.ts

@@ -0,0 +1,10 @@
+type Props = {
+    data: {
+        label: string;
+        value: number;
+    }[];
+    height?: number;
+};
+export declare const DonutChart: ({ data, height }: Props) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=DonutChart.d.ts.map

package/dist/react/charts/DonutChart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DonutChart.d.ts","sourceRoot":"","sources":["../../../src/react/charts/DonutChart.tsx"],"names":[],"mappings":"AAKA,KAAK,KAAK,GAAG;IACX,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACzC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAIF,eAAO,MAAM,UAAU,GAAI,kBAAwB,KAAK,gCAsCvD,CAAC"}

package/dist/react/charts/DonutChart.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Cell, Pie, PieChart, ResponsiveContainer, Tooltip } from 'recharts';
+import { ChartTooltip } from './ChartTooltip';
+import { useChartTheme } from './chartTheme';
+import { formatNumber } from './format';
+// A generic category donut with the total in the center — slice colors from the
+// shared multi-series palette. Used by the layout engine's "donut" widget.
+export const DonutChart = ({ data, height = 160 }) => {
+    const theme = useChartTheme();
+    const items = data.filter((d) => d.value > 0).slice(0, 8);
+    const total = items.reduce((s, d) => s + d.value, 0);
+    if (items.length === 0)
+        return _jsx("span", { className: 'text-sm text-gray-400', children: "\u2014" });
+    return (_jsxs("div", { className: 'relative', style: { height }, children: [_jsx(ResponsiveContainer, { width: '100%', height: '100%', children: _jsxs(PieChart, { children: [_jsx(Pie, { data: items, dataKey: 'value', nameKey: 'label', innerRadius: '58%', outerRadius: '85%', paddingAngle: 2, stroke: 'none', children: items.map((d, i) => (_jsx(Cell, { fill: theme.palette[i % theme.palette.length] }, d.label))) }), _jsx(Tooltip, { content: (p) => (_jsx(ChartTooltip, { ...p, theme: theme, valueFormatter: (v) => formatNumber(v) })) })] }) }), _jsxs("div", { className: 'pointer-events-none absolute inset-0 flex flex-col items-center justify-center', children: [_jsx("span", { className: 'text-lg font-bold tabular-nums text-gray-900 dark:text-gray-100', children: formatNumber(total) }), _jsx("span", { className: 'text-[10px] uppercase tracking-wide text-gray-400', children: "total" })] })] }));
+};
+//# sourceMappingURL=DonutChart.js.map

package/dist/react/charts/DonutChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DonutChart.js","sourceRoot":"","sources":["../../../src/react/charts/DonutChart.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,QAAQ,EAAE,mBAAmB,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAC7E,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAOxC,gFAAgF;AAChF,2EAA2E;AAC3E,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EAAE,IAAI,EAAE,MAAM,GAAG,GAAG,EAAS,EAAE,EAAE;IAC1D,MAAM,KAAK,GAAG,aAAa,EAAE,CAAC;IAC9B,MAAM,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IAC1D,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IACrD,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,eAAM,SAAS,EAAC,uBAAuB,uBAAS,CAAC;IAEhF,OAAO,CACL,eAAK,SAAS,EAAC,UAAU,EAAC,KAAK,EAAE,EAAE,MAAM,EAAE,aACzC,KAAC,mBAAmB,IAAC,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,MAAM,YAC7C,MAAC,QAAQ,eACP,KAAC,GAAG,IACF,IAAI,EAAE,KAAK,EACX,OAAO,EAAC,OAAO,EACf,OAAO,EAAC,OAAO,EACf,WAAW,EAAC,KAAK,EACjB,WAAW,EAAC,KAAK,EACjB,YAAY,EAAE,CAAC,EACf,MAAM,EAAC,MAAM,YAEZ,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACnB,KAAC,IAAI,IAAe,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,IAAtD,CAAC,CAAC,KAAK,CAAmD,CACtE,CAAC,GACE,EACN,KAAC,OAAO,IACN,OAAO,EAAE,CAAC,CAAM,EAAE,EAAE,CAAC,CACnB,KAAC,YAAY,OAAK,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC,GAAI,CAC9E,GACD,IACO,GACS,EACtB,eAAK,SAAS,EAAC,gFAAgF,aAC7F,eAAM,SAAS,EAAC,iEAAiE,YAC9E,YAAY,CAAC,KAAK,CAAC,GACf,EACP,eAAM,SAAS,EAAC,mDAAmD,sBAAa,IAC5E,IACF,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/react/charts/LabeledSeriesChart.d.ts

@@ -0,0 +1,25 @@
+export type LabeledSeries = {
+    key: string;
+    name: string;
+    color?: string;
+    kind?: 'area' | 'line';
+    stackId?: string;
+};
+type Props = {
+    data: any[];
+    series: LabeledSeries[];
+    xKey?: string;
+    height?: number;
+    valueFormatter?: (n: number) => string;
+    labelFormatter?: (label: string | number) => string;
+    reference?: {
+        y: number;
+        label?: string;
+        color?: string;
+    };
+    showLegend?: boolean;
+    emptyHint?: string;
+};
+export declare const LabeledSeriesChart: ({ data, series, xKey, height, valueFormatter, labelFormatter, reference, showLegend, emptyHint, }: Props) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=LabeledSeriesChart.d.ts.map

package/dist/react/charts/LabeledSeriesChart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LabeledSeriesChart.d.ts","sourceRoot":"","sources":["../../../src/react/charts/LabeledSeriesChart.tsx"],"names":[],"mappings":"AAiBA,MAAM,MAAM,aAAa,GAAG;IAC1B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAEvB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,MAAM,EAAE,aAAa,EAAE,CAAC;IAExB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IAEvC,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,MAAM,CAAC;IACpD,SAAS,CAAC,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC1D,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAKF,eAAO,MAAM,kBAAkB,GAAI,mGAUhC,KAAK,gCAkGP,CAAC"}

package/dist/react/charts/LabeledSeriesChart.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useId } from 'react';
+import { Area, CartesianGrid, ComposedChart, Legend, Line, ReferenceLine, ResponsiveContainer, Tooltip, XAxis, YAxis, } from 'recharts';
+import { ChartTooltip } from './ChartTooltip';
+import { useChartTheme } from './chartTheme';
+import { formatNumber } from './format';
+// A multi-series chart over a categorical/label x-axis (dates already formatted to
+// strings, spend levels, etc.) — the finance counterpart to the dashboard's
+// epoch-ms TimeSeriesChart. Mixes stacked areas and lines via ComposedChart.
+export const LabeledSeriesChart = ({ data, series, xKey = 'label', height = 240, valueFormatter = formatNumber, labelFormatter, reference, showLegend = false, emptyHint = 'Not enough data to chart yet.', }) => {
+    const theme = useChartTheme();
+    const gradId = useId().replace(/:/g, '');
+    if (data.length < 2) {
+        return _jsx("p", { className: 'py-8 text-center text-sm text-gray-500 dark:text-gray-400', children: emptyHint });
+    }
+    return (_jsx(ResponsiveContainer, { width: '100%', height: height, children: _jsxs(ComposedChart, { data: data, margin: { top: 8, right: 8, bottom: 0, left: 0 }, children: [_jsx("defs", { children: series.map((s, i) => {
+                        const color = s.color ?? theme.palette[i % theme.palette.length];
+                        return (_jsxs("linearGradient", { id: `${gradId}-${s.key}`, x1: '0', y1: '0', x2: '0', y2: '1', children: [_jsx("stop", { offset: '0%', stopColor: color, stopOpacity: 0.35 }), _jsx("stop", { offset: '100%', stopColor: color, stopOpacity: 0.04 })] }, s.key));
+                    }) }), _jsx(CartesianGrid, { strokeDasharray: '3 3', stroke: theme.grid, vertical: false }), _jsx(XAxis, { dataKey: xKey, stroke: theme.axis, tick: { fill: theme.axis, fontSize: 11 }, tickLine: false, axisLine: { stroke: theme.grid }, minTickGap: 24 }), _jsx(YAxis, { tickFormatter: (v) => valueFormatter(v), stroke: theme.axis, tick: { fill: theme.axis, fontSize: 11 }, tickLine: false, axisLine: false, width: 52 }), _jsx(Tooltip, { isAnimationActive: false, content: (p) => (_jsx(ChartTooltip, { ...p, theme: theme, labelFormatter: labelFormatter, valueFormatter: (v) => valueFormatter(v) })) }), showLegend && (_jsx(Legend, { wrapperStyle: { fontSize: 11, color: theme.axis }, iconType: 'plainline' })), reference && (_jsx(ReferenceLine, { y: reference.y, stroke: reference.color ?? theme.axis, strokeDasharray: '4 4', label: reference.label
+                        ? { value: reference.label, fill: theme.axis, fontSize: 10, position: 'right' }
+                        : undefined })), series.map((s, i) => {
+                    const color = s.color ?? theme.palette[i % theme.palette.length];
+                    if (s.kind === 'line') {
+                        return (_jsx(Line, { type: 'monotone', dataKey: s.key, name: s.name, stroke: color, strokeWidth: 2, dot: false, isAnimationActive: false }, s.key));
+                    }
+                    return (_jsx(Area, { type: 'monotone', dataKey: s.key, name: s.name, stackId: s.stackId, stroke: color, strokeWidth: 2, fill: `url(#${gradId}-${s.key})`, isAnimationActive: false }, s.key));
+                })] }) }));
+};
+//# sourceMappingURL=LabeledSeriesChart.js.map

package/dist/react/charts/LabeledSeriesChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LabeledSeriesChart.js","sourceRoot":"","sources":["../../../src/react/charts/LabeledSeriesChart.tsx"],"names":[],"mappings":"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"}

package/dist/react/charts/LineChart.d.ts

@@ -0,0 +1,25 @@
+import { type ChartDatum, type ChartSeries } from './shared';
+export type LineChartProps = {
+    data: ChartDatum[];
+    /** Key for the x-axis category/value in each datum. */
+    xKey: string;
+    series: ChartSeries[];
+    /** Human label for the chart's `role="img"` wrapper (SVG a11y). */
+    ariaLabel: string;
+    height?: number;
+    /** Smooth (monotone) vs straight segments. Default true. */
+    smooth?: boolean;
+    /** Show the legend. Default: true when more than one series. */
+    legend?: boolean;
+    /** Show the cartesian grid. Default true. */
+    grid?: boolean;
+    /** Reserved width for the y-axis labels. */
+    yWidth?: number;
+    xTickFormatter?: (value: string | number) => string;
+    valueFormatter?: (value: number) => string;
+    /** Format the tooltip header. */
+    labelFormatter?: (label: string | number) => string;
+};
+/** Multi-series line chart. Colors come from the tokens; callers pass no color props. */
+export declare function LineChart({ data, xKey, series, ariaLabel, height, smooth, legend, grid, yWidth, xTickFormatter, valueFormatter, labelFormatter, }: LineChartProps): import("react").JSX.Element;
+//# sourceMappingURL=LineChart.d.ts.map

package/dist/react/charts/LineChart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LineChart.d.ts","sourceRoot":"","sources":["../../../src/react/charts/LineChart.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAa,KAAK,UAAU,EAAE,KAAK,WAAW,EAAe,MAAM,UAAU,CAAC;AAErF,MAAM,MAAM,cAAc,GAAG;IAC3B,IAAI,EAAE,UAAU,EAAE,CAAC;IACnB,uDAAuD;IACvD,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,WAAW,EAAE,CAAC;IACtB,mEAAmE;IACnE,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,4DAA4D;IAC5D,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,gEAAgE;IAChE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,6CAA6C;IAC7C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,4CAA4C;IAC5C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,MAAM,CAAC;IACpD,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC3C,iCAAiC;IACjC,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,MAAM,CAAC;CACrD,CAAC;AAEF,yFAAyF;AACzF,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,SAAS,EACT,MAAM,EACN,MAAa,EACb,MAAM,EACN,IAAW,EACX,MAAW,EACX,cAAc,EACd,cAAc,EACd,cAAc,GACf,EAAE,cAAc,+BA6ChB"}

package/dist/react/charts/LineChart.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { CartesianGrid, Legend, Line, LineChart as RLineChart, Tooltip, XAxis, YAxis, } from 'recharts';
+import { ChartFrame } from './ChartFrame';
+import { legendContent } from './ChartLegend';
+import { tooltipContent } from './ChartTooltip';
+import { axisProps, seriesColor } from './shared';
+/** Multi-series line chart. Colors come from the tokens; callers pass no color props. */
+export function LineChart({ data, xKey, series, ariaLabel, height, smooth = true, legend, grid = true, yWidth = 44, xTickFormatter, valueFormatter, labelFormatter, }) {
+    const showLegend = legend ?? series.length > 1;
+    return (_jsx(ChartFrame, { ariaLabel: ariaLabel, height: height, children: (t) => (_jsxs(RLineChart, { data: data, margin: { top: 8, right: 12, bottom: 0, left: 0 }, children: [grid && (_jsx(CartesianGrid, { strokeDasharray: '3 3', stroke: t.foregroundMuted, strokeOpacity: 0.3, vertical: false })), _jsx(XAxis, { dataKey: xKey, ...axisProps(t), tickFormatter: xTickFormatter, interval: 'preserveStartEnd', minTickGap: 24 }), _jsx(YAxis, { ...axisProps(t), tickFormatter: valueFormatter, width: yWidth, axisLine: false }), _jsx(Tooltip, { content: tooltipContent(t, labelFormatter, valueFormatter), cursor: { stroke: t.foregroundMuted, strokeWidth: 1, strokeOpacity: 0.5 }, isAnimationActive: false }), showLegend && _jsx(Legend, { content: legendContent(t) }), series.map((s, i) => (_jsx(Line, { type: smooth ? 'monotone' : 'linear', dataKey: s.dataKey, name: s.name ?? s.dataKey, stroke: seriesColor(t, s, i), strokeWidth: 2, dot: false, activeDot: { r: 3 }, isAnimationActive: false }, s.dataKey)))] })) }));
+}
+//# sourceMappingURL=LineChart.js.map

package/dist/react/charts/LineChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LineChart.js","sourceRoot":"","sources":["../../../src/react/charts/LineChart.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,aAAa,EACb,MAAM,EACN,IAAI,EACJ,SAAS,IAAI,UAAU,EACvB,OAAO,EACP,KAAK,EACL,KAAK,GACN,MAAM,UAAU,CAAC;AAClB,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAqC,WAAW,EAAE,MAAM,UAAU,CAAC;AAwBrF,yFAAyF;AACzF,MAAM,UAAU,SAAS,CAAC,EACxB,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,SAAS,EACT,MAAM,EACN,MAAM,GAAG,IAAI,EACb,MAAM,EACN,IAAI,GAAG,IAAI,EACX,MAAM,GAAG,EAAE,EACX,cAAc,EACd,cAAc,EACd,cAAc,GACC;IACf,MAAM,UAAU,GAAG,MAAM,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/C,OAAO,CACL,KAAC,UAAU,IAAC,SAAS,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,YAC7C,CAAC,CAAC,EAAE,EAAE,CAAC,CACN,MAAC,UAAU,IAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,aACtE,IAAI,IAAI,CACP,KAAC,aAAa,IACZ,eAAe,EAAC,KAAK,EACrB,MAAM,EAAE,CAAC,CAAC,eAAe,EACzB,aAAa,EAAE,GAAG,EAClB,QAAQ,EAAE,KAAK,GACf,CACH,EACD,KAAC,KAAK,IACJ,OAAO,EAAE,IAAI,KACT,SAAS,CAAC,CAAC,CAAC,EAChB,aAAa,EAAE,cAAc,EAC7B,QAAQ,EAAC,kBAAkB,EAC3B,UAAU,EAAE,EAAE,GACd,EACF,KAAC,KAAK,OAAK,SAAS,CAAC,CAAC,CAAC,EAAE,aAAa,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,GAAI,EAC1F,KAAC,OAAO,IACN,OAAO,EAAE,cAAc,CAAC,CAAC,EAAE,cAAc,EAAE,cAAc,CAAC,EAC1D,MAAM,EAAE,EAAE,MAAM,EAAE,CAAC,CAAC,eAAe,EAAE,WAAW,EAAE,CAAC,EAAE,aAAa,EAAE,GAAG,EAAE,EACzE,iBAAiB,EAAE,KAAK,GACxB,EACD,UAAU,IAAI,KAAC,MAAM,IAAC,OAAO,EAAE,aAAa,CAAC,CAAC,CAAC,GAAI,EACnD,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACpB,KAAC,IAAI,IAEH,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,EACpC,OAAO,EAAE,CAAC,CAAC,OAAO,EAClB,IAAI,EAAE,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,OAAO,EACzB,MAAM,EAAE,WAAW,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAC5B,WAAW,EAAE,CAAC,EACd,GAAG,EAAE,KAAK,EACV,SAAS,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,EACnB,iBAAiB,EAAE,KAAK,IARnB,CAAC,CAAC,OAAO,CASd,CACH,CAAC,IACS,CACd,GACU,CACd,CAAC;AACJ,CAAC"}

package/dist/react/charts/MiniBarChart.d.ts

@@ -0,0 +1,14 @@
+type Datum = {
+    label: string;
+    count: number;
+    color?: string;
+};
+type Props = {
+    data: Datum[];
+    height?: number;
+    colorByIndex?: boolean;
+    valueFormatter?: (n: number) => string;
+};
+export declare const MiniBarChart: ({ data, height, colorByIndex, valueFormatter, }: Props) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=MiniBarChart.d.ts.map

package/dist/react/charts/MiniBarChart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MiniBarChart.d.ts","sourceRoot":"","sources":["../../../src/react/charts/MiniBarChart.tsx"],"names":[],"mappings":"AAcA,KAAK,KAAK,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAC9D,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,KAAK,EAAE,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;CACxC,CAAC;AAGF,eAAO,MAAM,YAAY,GAAI,iDAK1B,KAAK,gCAoDP,CAAC"}

package/dist/react/charts/MiniBarChart.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Bar, BarChart, CartesianGrid, Cell, ResponsiveContainer, Tooltip, XAxis, YAxis, } from 'recharts';
+import { ChartTooltip } from './ChartTooltip';
+import { useChartTheme } from './chartTheme';
+import { formatNumber } from './format';
+// A compact categorical bar chart — latency histograms, method/status breakdowns.
+export const MiniBarChart = ({ data, height = 220, colorByIndex = false, valueFormatter = formatNumber, }) => {
+    const theme = useChartTheme();
+    if (!data.length) {
+        return (_jsx("div", { className: 'flex items-center justify-center text-sm text-gray-400', style: { height }, children: "No data in range" }));
+    }
+    return (_jsx(ResponsiveContainer, { width: '100%', height: height, children: _jsxs(BarChart, { data: data, margin: { top: 8, right: 8, bottom: 0, left: 0 }, children: [_jsx(CartesianGrid, { strokeDasharray: '3 3', stroke: theme.grid, vertical: false }), _jsx(XAxis, { dataKey: 'label', stroke: theme.axis, tick: { fill: theme.axis, fontSize: 11 }, tickLine: false, axisLine: { stroke: theme.grid }, interval: 0, angle: data.length > 6 ? -25 : 0, textAnchor: data.length > 6 ? 'end' : 'middle', height: data.length > 6 ? 48 : 24 }), _jsx(YAxis, { tickFormatter: (v) => valueFormatter(v), stroke: theme.axis, tick: { fill: theme.axis, fontSize: 11 }, tickLine: false, axisLine: false, width: 40 }), _jsx(Tooltip, { isAnimationActive: false, cursor: { fill: theme.grid, opacity: 0.4 }, content: (p) => (_jsx(ChartTooltip, { ...p, theme: theme, valueFormatter: (v) => valueFormatter(v) })) }), _jsx(Bar, { dataKey: 'count', name: 'Count', radius: [4, 4, 0, 0], isAnimationActive: false, children: data.map((d, i) => (_jsx(Cell, { fill: d.color ?? (colorByIndex ? theme.palette[i % theme.palette.length] : theme.accent) }, d.label))) })] }) }));
+};
+//# sourceMappingURL=MiniBarChart.js.map

package/dist/react/charts/MiniBarChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MiniBarChart.js","sourceRoot":"","sources":["../../../src/react/charts/MiniBarChart.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,GAAG,EACH,QAAQ,EACR,aAAa,EACb,IAAI,EACJ,mBAAmB,EACnB,OAAO,EACP,KAAK,EACL,KAAK,GACN,MAAM,UAAU,CAAC;AAClB,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAWxC,kFAAkF;AAClF,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAC3B,IAAI,EACJ,MAAM,GAAG,GAAG,EACZ,YAAY,GAAG,KAAK,EACpB,cAAc,GAAG,YAAY,GACvB,EAAE,EAAE;IACV,MAAM,KAAK,GAAG,aAAa,EAAE,CAAC;IAC9B,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;QACjB,OAAO,CACL,cAAK,SAAS,EAAC,wDAAwD,EAAC,KAAK,EAAE,EAAE,MAAM,EAAE,iCAEnF,CACP,CAAC;IACJ,CAAC;IACD,OAAO,CACL,KAAC,mBAAmB,IAAC,KAAK,EAAC,MAAM,EAAC,MAAM,EAAE,MAAM,YAC9C,MAAC,QAAQ,IAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,aACpE,KAAC,aAAa,IAAC,eAAe,EAAC,KAAK,EAAC,MAAM,EAAE,KAAK,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,GAAI,EAC5E,KAAC,KAAK,IACJ,OAAO,EAAC,OAAO,EACf,MAAM,EAAE,KAAK,CAAC,IAAI,EAClB,IAAI,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,EACxC,QAAQ,EAAE,KAAK,EACf,QAAQ,EAAE,EAAE,MAAM,EAAE,KAAK,CAAC,IAAI,EAAE,EAChC,QAAQ,EAAE,CAAC,EACX,KAAK,EAAE,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAChC,UAAU,EAAE,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,EAC9C,MAAM,EAAE,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,GACjC,EACF,KAAC,KAAK,IACJ,aAAa,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC,EACvC,MAAM,EAAE,KAAK,CAAC,IAAI,EAClB,IAAI,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,EACxC,QAAQ,EAAE,KAAK,EACf,QAAQ,EAAE,KAAK,EACf,KAAK,EAAE,EAAE,GACT,EACF,KAAC,OAAO,IACN,iBAAiB,EAAE,KAAK,EACxB,MAAM,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,OAAO,EAAE,GAAG,EAAE,EAC1C,OAAO,EAAE,CAAC,CAAM,EAAE,EAAE,CAAC,CACnB,KAAC,YAAY,OAAK,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC,GAAI,CAChF,GACD,EACF,KAAC,GAAG,IAAC,OAAO,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAC,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,iBAAiB,EAAE,KAAK,YAC7E,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAClB,KAAC,IAAI,IAEH,IAAI,EACF,CAAC,CAAC,KAAK,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,IAF/E,CAAC,CAAC,KAAK,CAIZ,CACH,CAAC,GACE,IACG,GACS,CACvB,CAAC;AACJ,CAAC,CAAC"}

package/dist/react/charts/PieChart.d.ts

@@ -0,0 +1,25 @@
+import type { ChartTone } from './tokens';
+export type PieDatum = {
+    name: string;
+    value: number;
+    tone?: ChartTone;
+};
+export type PieChartProps = {
+    data: PieDatum[];
+    /** Human label for the chart's `role="img"` wrapper (SVG a11y). */
+    ariaLabel: string;
+    height?: number;
+    /** Render as a donut (inner radius cut out). */
+    donut?: boolean;
+    /** Show the legend below. Default true. */
+    legend?: boolean;
+    /** Draw slice labels (name + value) with leader lines. Default false. */
+    labels?: boolean;
+    valueFormatter?: (value: number) => string;
+};
+/** Pie / donut chart. Slice colors come from the tokens (or per-datum semantic tone). */
+export declare function PieChart({ data, ariaLabel, height, donut, legend, labels, valueFormatter, }: PieChartProps): import("react").JSX.Element;
+export type DonutChartProps = Omit<PieChartProps, 'donut'>;
+/** A donut is a Pie with the center cut out — the dashboard default for part-of-whole. */
+export declare function DonutChart(props: DonutChartProps): import("react").JSX.Element;
+//# sourceMappingURL=PieChart.d.ts.map

package/dist/react/charts/PieChart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PieChart.d.ts","sourceRoot":"","sources":["../../../src/react/charts/PieChart.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAE1C,MAAM,MAAM,QAAQ,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,SAAS,CAAA;CAAE,CAAC;AAEzE,MAAM,MAAM,aAAa,GAAG;IAC1B,IAAI,EAAE,QAAQ,EAAE,CAAC;IACjB,mEAAmE;IACnE,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,gDAAgD;IAChD,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,2CAA2C;IAC3C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,yEAAyE;IACzE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CAC5C,CAAC;AAEF,yFAAyF;AACzF,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,SAAS,EACT,MAAY,EACZ,KAAa,EACb,MAAa,EACb,MAAc,EACd,cAAc,GACf,EAAE,aAAa,+BAmCf;AAED,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,aAAa,EAAE,OAAO,CAAC,CAAC;AAE3D,0FAA0F;AAC1F,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,+BAEhD"}

package/dist/react/charts/PieChart.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Cell, Legend, Pie, PieChart as RPieChart, Tooltip } from 'recharts';
+import { ChartFrame } from './ChartFrame';
+import { legendContent } from './ChartLegend';
+import { tooltipContent } from './ChartTooltip';
+import { seriesColor } from './shared';
+/** Pie / donut chart. Slice colors come from the tokens (or per-datum semantic tone). */
+export function PieChart({ data, ariaLabel, height = 240, donut = false, legend = true, labels = false, valueFormatter, }) {
+    return (_jsx(ChartFrame, { ariaLabel: ariaLabel, height: height, children: (t) => (_jsxs(RPieChart, { margin: { top: 8, right: 8, bottom: 8, left: 8 }, children: [_jsx(Pie, { data: data, dataKey: 'value', nameKey: 'name', innerRadius: donut ? '58%' : 0, outerRadius: '80%', paddingAngle: donut ? 2 : 0, stroke: t.background, strokeWidth: 2, labelLine: labels, label: labels
+                        ? (p) => `${p.name ?? ''} · ${valueFormatter ? valueFormatter(p.value ?? 0) : (p.value ?? 0)}`
+                        : false, children: data.map((d, i) => (_jsx(Cell, { fill: seriesColor(t, d, i) }, d.name))) }), _jsx(Tooltip, { content: tooltipContent(t, undefined, valueFormatter), isAnimationActive: false }), legend && _jsx(Legend, { content: legendContent(t) })] })) }));
+}
+/** A donut is a Pie with the center cut out — the dashboard default for part-of-whole. */
+export function DonutChart(props) {
+    return _jsx(PieChart, { ...props, donut: true });
+}
+//# sourceMappingURL=PieChart.js.map

package/dist/react/charts/PieChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PieChart.js","sourceRoot":"","sources":["../../../src/react/charts/PieChart.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,QAAQ,IAAI,SAAS,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAC7E,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAmBvC,yFAAyF;AACzF,MAAM,UAAU,QAAQ,CAAC,EACvB,IAAI,EACJ,SAAS,EACT,MAAM,GAAG,GAAG,EACZ,KAAK,GAAG,KAAK,EACb,MAAM,GAAG,IAAI,EACb,MAAM,GAAG,KAAK,EACd,cAAc,GACA;IACd,OAAO,CACL,KAAC,UAAU,IAAC,SAAS,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,YAC7C,CAAC,CAAC,EAAE,EAAE,CAAC,CACN,MAAC,SAAS,IAAC,MAAM,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,aACzD,KAAC,GAAG,IACF,IAAI,EAAE,IAAI,EACV,OAAO,EAAC,OAAO,EACf,OAAO,EAAC,MAAM,EACd,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAC9B,WAAW,EAAC,KAAK,EACjB,YAAY,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAC3B,MAAM,EAAE,CAAC,CAAC,UAAU,EACpB,WAAW,EAAE,CAAC,EACd,SAAS,EAAE,MAAM,EACjB,KAAK,EACH,MAAM;wBACJ,CAAC,CAAC,CAAC,CAA6C,EAAE,EAAE,CAChD,GAAG,CAAC,CAAC,IAAI,IAAI,EAAE,MAAM,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,EAAE;wBACzF,CAAC,CAAC,KAAK,YAGV,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAClB,KAAC,IAAI,IAAc,IAAI,EAAE,WAAW,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,IAAlC,CAAC,CAAC,IAAI,CAAgC,CAClD,CAAC,GACE,EACN,KAAC,OAAO,IACN,OAAO,EAAE,cAAc,CAAC,CAAC,EAAE,SAAS,EAAE,cAAc,CAAC,EACrD,iBAAiB,EAAE,KAAK,GACxB,EACD,MAAM,IAAI,KAAC,MAAM,IAAC,OAAO,EAAE,aAAa,CAAC,CAAC,CAAC,GAAI,IACtC,CACb,GACU,CACd,CAAC;AACJ,CAAC;AAID,0FAA0F;AAC1F,MAAM,UAAU,UAAU,CAAC,KAAsB;IAC/C,OAAO,KAAC,QAAQ,OAAK,KAAK,EAAE,KAAK,SAAG,CAAC;AACvC,CAAC"}

package/dist/react/charts/RadialBarChart.d.ts

@@ -0,0 +1,24 @@
+import { type ChartTone } from './tokens';
+export type RadialDatum = {
+    name: string;
+    value: number;
+    tone?: ChartTone;
+};
+export type RadialBarChartProps = {
+    data: RadialDatum[];
+    /** Human label for the chart's `role="img"` wrapper (SVG a11y). */
+    ariaLabel: string;
+    height?: number;
+    /** Domain max for the angular scale; defaults to the largest value. */
+    max?: number;
+    /** Show the legend below. Default true. */
+    legend?: boolean;
+    valueFormatter?: (value: number) => string;
+};
+/**
+ * Concentric radial bars (one ring per datum) — progress/breakdown gauges. recharts v3
+ * derives no usable legend payload for this, so the legend is rendered with cursedbelt's
+ * own ChartLegend below the SVG (which also keeps it out of the responsive sizing box).
+ */
+export declare function RadialBarChart({ data, ariaLabel, height, max, legend, valueFormatter, }: RadialBarChartProps): import("react").JSX.Element;
+//# sourceMappingURL=RadialBarChart.d.ts.map

package/dist/react/charts/RadialBarChart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadialBarChart.d.ts","sourceRoot":"","sources":["../../../src/react/charts/RadialBarChart.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,KAAK,SAAS,EAAkB,MAAM,UAAU,CAAC;AAE1D,MAAM,MAAM,WAAW,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,SAAS,CAAA;CAAE,CAAC;AAE5E,MAAM,MAAM,mBAAmB,GAAG;IAChC,IAAI,EAAE,WAAW,EAAE,CAAC;IACpB,mEAAmE;IACnE,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,uEAAuE;IACvE,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,2CAA2C;IAC3C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CAC5C,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,EAC7B,IAAI,EACJ,SAAS,EACT,MAAY,EACZ,GAAG,EACH,MAAa,EACb,cAAc,GACf,EAAE,mBAAmB,+BAsCrB"}

package/dist/react/charts/RadialBarChart.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef } from 'react';
+import { PolarAngleAxis, RadialBar, ResponsiveContainer, RadialBarChart as RRadialBarChart, Tooltip, } from 'recharts';
+import { ChartLegend } from './ChartLegend';
+import { tooltipContent } from './ChartTooltip';
+import { seriesColor } from './shared';
+import { useChartTokens } from './tokens';
+/**
+ * Concentric radial bars (one ring per datum) — progress/breakdown gauges. recharts v3
+ * derives no usable legend payload for this, so the legend is rendered with cursedbelt's
+ * own ChartLegend below the SVG (which also keeps it out of the responsive sizing box).
+ */
+export function RadialBarChart({ data, ariaLabel, height = 240, max, legend = true, valueFormatter, }) {
+    const ref = useRef(null);
+    const tokens = useChartTokens(ref);
+    const rings = data.map((d, i) => ({ ...d, fill: seriesColor(tokens, d, i) }));
+    const domainMax = max ?? Math.max(1, ...data.map((d) => d.value));
+    return (_jsxs("div", { ref: ref, role: 'img', "aria-label": ariaLabel, className: 'w-full', children: [_jsx(ResponsiveContainer, { width: '100%', height: height, children: _jsxs(RRadialBarChart, { data: rings, innerRadius: '30%', outerRadius: '100%', startAngle: 90, endAngle: -270, margin: { top: 8, right: 8, bottom: 8, left: 8 }, children: [_jsx(PolarAngleAxis, { type: 'number', domain: [0, domainMax], tick: false }), _jsx(RadialBar, { dataKey: 'value', background: { fill: tokens.foregroundMuted, fillOpacity: 0.12 }, cornerRadius: 6, isAnimationActive: true }), _jsx(Tooltip, { content: tooltipContent(tokens, undefined, valueFormatter), cursor: false, isAnimationActive: false })] }) }), legend && (_jsx(ChartLegend, { tokens: tokens, payload: rings.map((d) => ({ value: d.name, color: d.fill, dataKey: d.name })) }))] }));
+}
+//# sourceMappingURL=RadialBarChart.js.map

package/dist/react/charts/RadialBarChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadialBarChart.js","sourceRoot":"","sources":["../../../src/react/charts/RadialBarChart.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,cAAc,EACd,SAAS,EACT,mBAAmB,EACnB,cAAc,IAAI,eAAe,EACjC,OAAO,GACR,MAAM,UAAU,CAAC;AAClB,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EAAkB,cAAc,EAAE,MAAM,UAAU,CAAC;AAgB1D;;;;GAIG;AACH,MAAM,UAAU,cAAc,CAAC,EAC7B,IAAI,EACJ,SAAS,EACT,MAAM,GAAG,GAAG,EACZ,GAAG,EACH,MAAM,GAAG,IAAI,EACb,cAAc,GACM;IACpB,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzC,MAAM,MAAM,GAAG,cAAc,CAAC,GAAG,CAAC,CAAC;IACnC,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,IAAI,EAAE,WAAW,CAAC,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IAC9E,MAAM,SAAS,GAAG,GAAG,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC;IAClE,OAAO,CACL,eAAK,GAAG,EAAE,GAAG,EAAE,IAAI,EAAC,KAAK,gBAAa,SAAS,EAAE,SAAS,EAAC,QAAQ,aACjE,KAAC,mBAAmB,IAAC,KAAK,EAAC,MAAM,EAAC,MAAM,EAAE,MAAM,YAC9C,MAAC,eAAe,IACd,IAAI,EAAE,KAAK,EACX,WAAW,EAAC,KAAK,EACjB,WAAW,EAAC,MAAM,EAClB,UAAU,EAAE,EAAE,EACd,QAAQ,EAAE,CAAC,GAAG,EACd,MAAM,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,aAEhD,KAAC,cAAc,IAAC,IAAI,EAAC,QAAQ,EAAC,MAAM,EAAE,CAAC,CAAC,EAAE,SAAS,CAAC,EAAE,IAAI,EAAE,KAAK,GAAI,EACrE,KAAC,SAAS,IACR,OAAO,EAAC,OAAO,EACf,UAAU,EAAE,EAAE,IAAI,EAAE,MAAM,CAAC,eAAe,EAAE,WAAW,EAAE,IAAI,EAAE,EAC/D,YAAY,EAAE,CAAC,EACf,iBAAiB,SACjB,EACF,KAAC,OAAO,IACN,OAAO,EAAE,cAAc,CAAC,MAAM,EAAE,SAAS,EAAE,cAAc,CAAC,EAC1D,MAAM,EAAE,KAAK,EACb,iBAAiB,EAAE,KAAK,GACxB,IACc,GACE,EACrB,MAAM,IAAI,CACT,KAAC,WAAW,IACV,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,CAAC,CAAC,IAAI,EAAE,OAAO,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,GAC9E,CACH,IACG,CACP,CAAC;AACJ,CAAC"}

package/dist/react/charts/Sparkline.d.ts

@@ -0,0 +1,20 @@
+import { type ChartTone } from './tokens';
+export type SparklineProps = {
+    /** The values to plot, oldest → newest. */
+    data: number[];
+    /** Human label for the chart's `role="img"` wrapper (SVG a11y). */
+    ariaLabel: string;
+    /** Semantic color. Default 'accent'. */
+    tone?: ChartTone;
+    height?: number;
+    /** Fixed width in px; omit to fill the container (100%). */
+    width?: number;
+    /** Gradient area fill under the line. Default true. */
+    fill?: boolean;
+};
+/**
+ * A tiny axis-less, chrome-less line+area for stat tiles — just the recent shape of a
+ * metric. Defaults to the accent tone, so it re-colors with the brand.
+ */
+export declare function Sparkline({ data, ariaLabel, tone, height, width, fill, }: SparklineProps): import("react").JSX.Element;
+//# sourceMappingURL=Sparkline.d.ts.map

package/dist/react/charts/Sparkline.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sparkline.d.ts","sourceRoot":"","sources":["../../../src/react/charts/Sparkline.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAAkB,MAAM,UAAU,CAAC;AAE1D,MAAM,MAAM,cAAc,GAAG;IAC3B,2CAA2C;IAC3C,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,mEAAmE;IACnE,SAAS,EAAE,MAAM,CAAC;IAClB,wCAAwC;IACxC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,4DAA4D;IAC5D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uDAAuD;IACvD,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF;;;GAGG;AACH,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,SAAS,EACT,IAAe,EACf,MAAW,EACX,KAAK,EACL,IAAW,GACZ,EAAE,cAAc,+BAqChB"}

package/dist/react/charts/Sparkline.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef } from 'react';
+import { Area, AreaChart as RAreaChart, ResponsiveContainer } from 'recharts';
+import { cn } from '../lib/cn';
+import { seriesColor, useGradientId } from './shared';
+import { useChartTokens } from './tokens';
+/**
+ * A tiny axis-less, chrome-less line+area for stat tiles — just the recent shape of a
+ * metric. Defaults to the accent tone, so it re-colors with the brand.
+ */
+export function Sparkline({ data, ariaLabel, tone = 'accent', height = 40, width, fill = true, }) {
+    const ref = useRef(null);
+    const tokens = useChartTokens(ref);
+    const gradId = useGradientId();
+    const color = seriesColor(tokens, { tone }, 0);
+    const series = data.map((v, i) => ({ i, v }));
+    return (_jsx("div", { ref: ref, role: 'img', "aria-label": ariaLabel, className: cn(!width && 'w-full'), style: { width, height }, children: series.length >= 2 && (_jsx(ResponsiveContainer, { width: width ?? '100%', height: height, children: _jsxs(RAreaChart, { data: series, margin: { top: 2, right: 0, bottom: 0, left: 0 }, children: [_jsx("defs", { children: _jsxs("linearGradient", { id: gradId, x1: '0', y1: '0', x2: '0', y2: '1', children: [_jsx("stop", { offset: '0%', stopColor: color, stopOpacity: fill ? 0.35 : 0 }), _jsx("stop", { offset: '100%', stopColor: color, stopOpacity: 0 })] }) }), _jsx(Area, { type: 'monotone', dataKey: 'v', stroke: color, strokeWidth: 1.5, fill: `url(#${gradId})`, dot: false, isAnimationActive: false })] }) })) }));
+}
+//# sourceMappingURL=Sparkline.js.map

package/dist/react/charts/Sparkline.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sparkline.js","sourceRoot":"","sources":["../../../src/react/charts/Sparkline.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,IAAI,EAAE,SAAS,IAAI,UAAU,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAC9E,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AACtD,OAAO,EAAkB,cAAc,EAAE,MAAM,UAAU,CAAC;AAgB1D;;;GAGG;AACH,MAAM,UAAU,SAAS,CAAC,EACxB,IAAI,EACJ,SAAS,EACT,IAAI,GAAG,QAAQ,EACf,MAAM,GAAG,EAAE,EACX,KAAK,EACL,IAAI,GAAG,IAAI,GACI;IACf,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzC,MAAM,MAAM,GAAG,cAAc,CAAC,GAAG,CAAC,CAAC;IACnC,MAAM,MAAM,GAAG,aAAa,EAAE,CAAC;IAC/B,MAAM,KAAK,GAAG,WAAW,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC;IAC/C,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAC9C,OAAO,CACL,cACE,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,KAAK,gBACE,SAAS,EACrB,SAAS,EAAE,EAAE,CAAC,CAAC,KAAK,IAAI,QAAQ,CAAC,EACjC,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,YAEvB,MAAM,CAAC,MAAM,IAAI,CAAC,IAAI,CACrB,KAAC,mBAAmB,IAAC,KAAK,EAAE,KAAK,IAAI,MAAM,EAAE,MAAM,EAAE,MAAM,YACzD,MAAC,UAAU,IAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,aACxE,yBACE,0BAAgB,EAAE,EAAE,MAAM,EAAE,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,aACrD,eAAM,MAAM,EAAC,IAAI,EAAC,SAAS,EAAE,KAAK,EAAE,WAAW,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,GAAI,EACpE,eAAM,MAAM,EAAC,MAAM,EAAC,SAAS,EAAE,KAAK,EAAE,WAAW,EAAE,CAAC,GAAI,IACzC,GACZ,EACP,KAAC,IAAI,IACH,IAAI,EAAC,UAAU,EACf,OAAO,EAAC,GAAG,EACX,MAAM,EAAE,KAAK,EACb,WAAW,EAAE,GAAG,EAChB,IAAI,EAAE,QAAQ,MAAM,GAAG,EACvB,GAAG,EAAE,KAAK,EACV,iBAAiB,EAAE,KAAK,GACxB,IACS,GACO,CACvB,GACG,CACP,CAAC;AACJ,CAAC"}

package/dist/react/charts/StackedBars.d.ts

@@ -0,0 +1,18 @@
+export type StackSeries = {
+    key: string;
+    name: string;
+    color?: string;
+};
+type Props = {
+    data: any[];
+    series: StackSeries[];
+    xKey?: string;
+    height?: number;
+    valueFormatter?: (n: number) => string;
+    stacked?: boolean;
+    showLegend?: boolean;
+    emptyHint?: string;
+};
+export declare const StackedBars: ({ data, series, xKey, height, valueFormatter, stacked, showLegend, emptyHint, }: Props) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=StackedBars.d.ts.map

package/dist/react/charts/StackedBars.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StackedBars.d.ts","sourceRoot":"","sources":["../../../src/react/charts/StackedBars.tsx"],"names":[],"mappings":"AAcA,MAAM,MAAM,WAAW,GAAG;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAExE,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,MAAM,EAAE,WAAW,EAAE,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IAEvC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAIF,eAAO,MAAM,WAAW,GAAI,iFASzB,KAAK,gCAwDP,CAAC"}

package/dist/react/charts/StackedBars.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Bar, BarChart, CartesianGrid, Legend, ResponsiveContainer, Tooltip, XAxis, YAxis, } from 'recharts';
+import { ChartTooltip } from './ChartTooltip';
+import { useChartTheme } from './chartTheme';
+import { formatNumber } from './format';
+// A grouped/stacked categorical bar chart (e.g. premium + care cost per plan). The
+// per-category breakdown the single-value CategoryBars can't express.
+export const StackedBars = ({ data, series, xKey = 'label', height = 240, valueFormatter = formatNumber, stacked = true, showLegend = true, emptyHint = 'No data', }) => {
+    const theme = useChartTheme();
+    if (!data.length) {
+        return (_jsx("div", { className: 'flex items-center justify-center text-sm text-gray-400', style: { height }, children: emptyHint }));
+    }
+    return (_jsx(ResponsiveContainer, { width: '100%', height: height, children: _jsxs(BarChart, { data: data, margin: { top: 8, right: 8, bottom: 0, left: 0 }, children: [_jsx(CartesianGrid, { strokeDasharray: '3 3', stroke: theme.grid, vertical: false }), _jsx(XAxis, { dataKey: xKey, stroke: theme.axis, tick: { fill: theme.axis, fontSize: 11 }, tickLine: false, axisLine: { stroke: theme.grid }, interval: 0, angle: data.length > 6 ? -25 : 0, textAnchor: data.length > 6 ? 'end' : 'middle', height: data.length > 6 ? 48 : 24 }), _jsx(YAxis, { tickFormatter: (v) => valueFormatter(v), stroke: theme.axis, tick: { fill: theme.axis, fontSize: 11 }, tickLine: false, axisLine: false, width: 52 }), _jsx(Tooltip, { isAnimationActive: false, cursor: { fill: theme.grid, opacity: 0.4 }, content: (p) => (_jsx(ChartTooltip, { ...p, theme: theme, valueFormatter: (v) => valueFormatter(v) })) }), showLegend && (_jsx(Legend, { wrapperStyle: { fontSize: 11, color: theme.axis }, iconType: 'square' })), series.map((s, i) => (_jsx(Bar, { dataKey: s.key, name: s.name, stackId: stacked ? 'a' : undefined, fill: s.color ?? theme.palette[i % theme.palette.length], radius: stacked && i < series.length - 1 ? 0 : [4, 4, 0, 0], isAnimationActive: false }, s.key)))] }) }));
+};
+//# sourceMappingURL=StackedBars.js.map

package/dist/react/charts/StackedBars.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StackedBars.js","sourceRoot":"","sources":["../../../src/react/charts/StackedBars.tsx"],"names":[],"mappings":"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"}

package/dist/react/charts/StatusDonut.d.ts

@@ -0,0 +1,7 @@
+type Props = {
+    byClass: Record<string, number>;
+    height?: number;
+};
+export declare const StatusDonut: ({ byClass, height }: Props) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=StatusDonut.d.ts.map

package/dist/react/charts/StatusDonut.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusDonut.d.ts","sourceRoot":"","sources":["../../../src/react/charts/StatusDonut.tsx"],"names":[],"mappings":"AAKA,KAAK,KAAK,GAAG;IAEX,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAMF,eAAO,MAAM,WAAW,GAAI,qBAA2B,KAAK,gCAmD3D,CAAC"}

package/dist/react/charts/StatusDonut.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Cell, Pie, PieChart, ResponsiveContainer, Tooltip } from 'recharts';
+import { ChartTooltip } from './ChartTooltip';
+import { useChartTheme } from './chartTheme';
+import { formatNumber } from './format';
+const ORDER = ['2xx', '3xx', '4xx', '5xx', 'other'];
+// A status-class donut with the total in the center — the at-a-glance "is the site
+// healthy" widget. Slice colors come from the shared status palette.
+export const StatusDonut = ({ byClass, height = 220 }) => {
+    const theme = useChartTheme();
+    const data = ORDER.filter((k) => (byClass[k] ?? 0) > 0).map((k) => ({
+        name: k,
+        value: byClass[k] ?? 0,
+        color: theme.status[k] ?? theme.status.other,
+    }));
+    const total = data.reduce((sum, d) => sum + d.value, 0);
+    if (total === 0) {
+        return (_jsx("div", { className: 'flex items-center justify-center text-sm text-gray-400', style: { height }, children: "No requests in range" }));
+    }
+    return (_jsxs("div", { className: 'relative', style: { height }, children: [_jsx(ResponsiveContainer, { width: '100%', height: '100%', children: _jsxs(PieChart, { children: [_jsx(Pie, { data: data, dataKey: 'value', nameKey: 'name', innerRadius: '62%', outerRadius: '90%', paddingAngle: 2, stroke: 'none', isAnimationActive: false, children: data.map((d) => (_jsx(Cell, { fill: d.color }, d.name))) }), _jsx(Tooltip, { isAnimationActive: false, content: (p) => (_jsx(ChartTooltip, { ...p, theme: theme, valueFormatter: (v) => formatNumber(v) })) })] }) }), _jsxs("div", { className: 'pointer-events-none absolute inset-0 flex flex-col items-center justify-center', children: [_jsx("span", { className: 'text-2xl font-semibold tabular-nums text-gray-900 dark:text-gray-100', children: formatNumber(total) }), _jsx("span", { className: 'text-xs text-gray-500 dark:text-gray-400', children: "requests" })] })] }));
+};
+//# sourceMappingURL=StatusDonut.js.map