@hyperpackai/hyperui 0.1.0

package/dist/components/charts.js

@@ -0,0 +1,435 @@
+/**
+ * HyperUI Chart Components
+ * LineChart · BarChart · PieChart · Sparkline
+ */
+import { injectCSS, cn, h } from "../theme/index.js";
+const CHART_CSS = `
+.hu-chart {
+  display: flex; flex-direction: column; gap: var(--hu-space-3);
+  padding: var(--hu-space-4); border: 1px solid var(--hu-border);
+  border-radius: var(--hu-radius-md); background: var(--hu-bg); color: var(--hu-text);
+}
+.hu-chart__header { display: flex; align-items: baseline; justify-content: space-between; gap: var(--hu-space-3); }
+.hu-chart__title { font-size: var(--hu-font-size-sm); font-weight: var(--hu-font-weight-semibold); color: var(--hu-text); }
+.hu-chart__meta { font-size: var(--hu-font-size-xs); color: var(--hu-text-2); }
+.hu-chart svg { display: block; width: 100%; height: auto; overflow: visible; }
+.hu-chart__axis { stroke: var(--hu-border-2); stroke-width: 1; }
+.hu-chart__grid { stroke: var(--hu-border); stroke-width: 1; opacity: .7; }
+.hu-chart__label { fill: var(--hu-text-2); font-size: 11px; font-family: var(--hu-font-sans); }
+.hu-chart__line { fill: none; stroke-width: 2.5; vector-effect: non-scaling-stroke; }
+.hu-chart__area { opacity: .16; }
+.hu-chart__point { stroke: var(--hu-bg); stroke-width: 2; }
+.hu-chart__bar { rx: 3; transition: opacity var(--hu-duration) var(--hu-ease); }
+.hu-chart__bar:hover, .hu-chart__slice:hover, .hu-chart__heat-cell:hover { opacity: .86; }
+.hu-chart__slice { stroke: var(--hu-bg); stroke-width: 2; }
+.hu-chart__radar-shape { fill-opacity: .16; stroke-width: 2; vector-effect: non-scaling-stroke; }
+.hu-chart__heat-cell { rx: 3; transition: opacity var(--hu-duration) var(--hu-ease); }
+.hu-chart__gauge-track { fill: none; stroke: var(--hu-bg-3); stroke-width: 18; stroke-linecap: round; }
+.hu-chart__gauge-value { fill: none; stroke-width: 18; stroke-linecap: round; }
+.hu-chart__gauge-label { fill: var(--hu-text); font-size: 28px; font-weight: var(--hu-font-weight-semibold); font-family: var(--hu-font-sans); }
+.hu-chart__candle-wick { stroke-width: 1.5; vector-effect: non-scaling-stroke; }
+.hu-chart__candle-body { rx: 2; }
+.hu-chart__volume { opacity: .22; }
+.hu-sparkline { display: inline-flex; color: var(--hu-primary); }
+.hu-sparkline svg { display: block; width: 100%; height: 100%; }
+`;
+const DEFAULT_CHART_COLORS = [
+    "var(--hu-primary)",
+    "var(--hu-success)",
+    "var(--hu-warning)",
+    "var(--hu-error)",
+    "var(--hu-info)",
+    "var(--hu-text-2)"
+];
+export function LineChart(props) {
+    injectCSS("hu-charts", CHART_CSS);
+    const width = props.width ?? 640;
+    const height = props.height ?? 320;
+    const padding = { top: 20, right: 24, bottom: 38, left: 44 };
+    const bounds = getPlotBounds(width, height, padding);
+    const points = props.series.flatMap((series) => series.data);
+    const xValues = uniqueValues(points.map((point) => point.x));
+    const yExtent = getExtent(points.map((point) => point.y));
+    const colors = props.colors ?? DEFAULT_CHART_COLORS;
+    return h("section", { class: cn("hu-chart", props.class), "aria-label": props.title ?? "Line chart" }, chartHeader(props.title, props.description ?? `${props.series.length} series`), h("svg", { viewBox: `0 0 ${width} ${height}`, role: "img", "aria-label": props.title ?? "Line chart" }, props.showGrid !== false && chartGrid(bounds, 4), h("line", { class: "hu-chart__axis", x1: bounds.x, y1: bounds.y2, x2: bounds.x2, y2: bounds.y2 }), h("line", { class: "hu-chart__axis", x1: bounds.x, y1: bounds.y, x2: bounds.x, y2: bounds.y2 }), ...props.series.map((series, index) => {
+        const color = series.color ?? colors[index % colors.length];
+        const path = series.data.map((point, pointIndex) => {
+            const x = scaleBand(point.x, xValues, bounds.x, bounds.x2);
+            const y = scaleLinear(point.y, yExtent.min, yExtent.max, bounds.y2, bounds.y);
+            return `${pointIndex === 0 ? "M" : "L"} ${x} ${y}`;
+        }).join(" ");
+        return h("g", { key: series.id, "aria-label": series.label }, h("path", { class: "hu-chart__line", d: path, stroke: color }), ...series.data.map((point) => h("circle", {
+            class: "hu-chart__point",
+            key: `${series.id}-${point.x}`,
+            cx: scaleBand(point.x, xValues, bounds.x, bounds.x2),
+            cy: scaleLinear(point.y, yExtent.min, yExtent.max, bounds.y2, bounds.y),
+            r: 3,
+            fill: color
+        })));
+    }), props.xLabel && h("text", { class: "hu-chart__label", x: width / 2, y: height - 4, "text-anchor": "middle" }, props.xLabel), props.yLabel && h("text", {
+        class: "hu-chart__label",
+        x: 12,
+        y: height / 2,
+        transform: `rotate(-90 12 ${height / 2})`,
+        "text-anchor": "middle"
+    }, props.yLabel)));
+}
+export function BarChart(props) {
+    injectCSS("hu-charts", CHART_CSS);
+    const width = props.width ?? 640;
+    const height = props.height ?? 320;
+    const horizontal = props.orientation === "horizontal";
+    const padding = { top: 20, right: 24, bottom: 38, left: horizontal ? 96 : 44 };
+    const bounds = getPlotBounds(width, height, padding);
+    const max = Math.max(1, ...props.data.map((datum) => datum.value));
+    const bandSize = horizontal ? bounds.height / Math.max(1, props.data.length) : bounds.width / Math.max(1, props.data.length);
+    const color = props.color ?? "var(--hu-primary)";
+    return h("section", { class: cn("hu-chart", props.class), "aria-label": props.title ?? "Bar chart" }, chartHeader(props.title, props.description ?? `${props.data.length} bars`), h("svg", { viewBox: `0 0 ${width} ${height}`, role: "img", "aria-label": props.title ?? "Bar chart" }, props.showGrid !== false && chartGrid(bounds, 4), h("line", { class: "hu-chart__axis", x1: bounds.x, y1: bounds.y2, x2: bounds.x2, y2: bounds.y2 }), h("line", { class: "hu-chart__axis", x1: bounds.x, y1: bounds.y, x2: bounds.x, y2: bounds.y2 }), ...props.data.map((datum, index) => {
+        const fill = datum.color ?? color;
+        if (horizontal) {
+            const barWidth = scaleLinear(datum.value, 0, max, 0, bounds.width);
+            return h("rect", {
+                key: datum.label,
+                class: "hu-chart__bar",
+                x: bounds.x,
+                y: bounds.y + index * bandSize + 4,
+                width: barWidth,
+                height: Math.max(4, bandSize - 8),
+                fill,
+                "aria-label": `${datum.label}: ${datum.value}`
+            });
+        }
+        const barHeight = scaleLinear(datum.value, 0, max, 0, bounds.height);
+        return h("rect", {
+            key: datum.label,
+            class: "hu-chart__bar",
+            x: bounds.x + index * bandSize + 4,
+            y: bounds.y2 - barHeight,
+            width: Math.max(4, bandSize - 8),
+            height: barHeight,
+            fill,
+            "aria-label": `${datum.label}: ${datum.value}`
+        });
+    })));
+}
+export function PieChart(props) {
+    injectCSS("hu-charts", CHART_CSS);
+    const width = props.width ?? 360;
+    const height = props.height ?? 300;
+    const radius = Math.min(width, height) / 2 - 20;
+    const innerRadius = props.donut ? radius * .58 : 0;
+    const cx = width / 2;
+    const cy = height / 2;
+    const total = props.data.reduce((sum, datum) => sum + Math.max(0, datum.value), 0);
+    const colors = props.colors ?? DEFAULT_CHART_COLORS;
+    let angle = -90;
+    return h("section", { class: cn("hu-chart", props.class), "aria-label": props.title ?? "Pie chart" }, chartHeader(props.title, props.description ?? `${props.data.length} slices`), h("svg", { viewBox: `0 0 ${width} ${height}`, role: "img", "aria-label": props.title ?? "Pie chart" }, ...props.data.map((datum, index) => {
+        const value = Math.max(0, datum.value);
+        const sweep = total > 0 ? value / total * 360 : 0;
+        const path = describeArc(cx, cy, radius, innerRadius, angle, angle + sweep);
+        angle += sweep;
+        return h("path", {
+            key: datum.label,
+            class: "hu-chart__slice",
+            d: path,
+            fill: datum.color ?? colors[index % colors.length],
+            "aria-label": `${datum.label}: ${datum.value}`
+        });
+    })));
+}
+export function AreaChart(props) {
+    injectCSS("hu-charts", CHART_CSS);
+    const width = props.width ?? 640;
+    const height = props.height ?? 320;
+    const padding = { top: 20, right: 24, bottom: 38, left: 44 };
+    const bounds = getPlotBounds(width, height, padding);
+    const points = props.series.flatMap((series) => series.data);
+    const xValues = uniqueValues(points.map((point) => point.x));
+    const yExtent = getExtent(points.map((point) => point.y));
+    const colors = props.colors ?? DEFAULT_CHART_COLORS;
+    return h("section", { class: cn("hu-chart", props.class), "aria-label": props.title ?? "Area chart" }, chartHeader(props.title, props.description ?? `${props.series.length} series`), h("svg", { viewBox: `0 0 ${width} ${height}`, role: "img", "aria-label": props.title ?? "Area chart" }, props.showGrid !== false && chartGrid(bounds, 4), h("line", { class: "hu-chart__axis", x1: bounds.x, y1: bounds.y2, x2: bounds.x2, y2: bounds.y2 }), h("line", { class: "hu-chart__axis", x1: bounds.x, y1: bounds.y, x2: bounds.x, y2: bounds.y2 }), ...props.series.map((series, index) => {
+        const color = series.color ?? colors[index % colors.length];
+        const linePoints = series.data.map((point) => ({
+            x: scaleBand(point.x, xValues, bounds.x, bounds.x2),
+            y: scaleLinear(point.y, yExtent.min, yExtent.max, bounds.y2, bounds.y)
+        }));
+        const linePath = linePoints.map((point, pointIndex) => `${pointIndex === 0 ? "M" : "L"} ${point.x} ${point.y}`).join(" ");
+        const areaPath = linePoints.length === 0
+            ? ""
+            : `${linePath} L ${linePoints[linePoints.length - 1].x} ${bounds.y2} L ${linePoints[0].x} ${bounds.y2} Z`;
+        return h("g", { key: series.id, "aria-label": series.label }, h("path", { class: "hu-chart__area", d: areaPath, fill: color }), h("path", { class: "hu-chart__line", d: linePath, stroke: color }));
+    }), props.xLabel && h("text", { class: "hu-chart__label", x: width / 2, y: height - 4, "text-anchor": "middle" }, props.xLabel), props.yLabel && h("text", {
+        class: "hu-chart__label",
+        x: 12,
+        y: height / 2,
+        transform: `rotate(-90 12 ${height / 2})`,
+        "text-anchor": "middle"
+    }, props.yLabel)));
+}
+export function RadarChart(props) {
+    injectCSS("hu-charts", CHART_CSS);
+    const width = props.width ?? 420;
+    const height = props.height ?? 360;
+    const cx = width / 2;
+    const cy = height / 2;
+    const radius = Math.min(width, height) / 2 - 42;
+    const levels = props.levels ?? 4;
+    const colors = props.colors ?? DEFAULT_CHART_COLORS;
+    return h("section", { class: cn("hu-chart", props.class), "aria-label": props.title ?? "Radar chart" }, chartHeader(props.title, props.description ?? `${props.series.length} series`), h("svg", { viewBox: `0 0 ${width} ${height}`, role: "img", "aria-label": props.title ?? "Radar chart" }, ...Array.from({ length: levels }, (_, levelIndex) => {
+        const levelRadius = radius * (levelIndex + 1) / levels;
+        return h("polygon", {
+            key: `level-${levelIndex}`,
+            class: "hu-chart__grid",
+            points: props.axes.map((_, axisIndex) => radarPoint(cx, cy, levelRadius, axisIndex, props.axes.length)).join(" "),
+            fill: "none"
+        });
+    }), ...props.axes.map((axis, axisIndex) => {
+        const end = radarPointObject(cx, cy, radius, axisIndex, props.axes.length);
+        const label = radarPointObject(cx, cy, radius + 24, axisIndex, props.axes.length);
+        return h("g", { key: axis.key }, h("line", { class: "hu-chart__axis", x1: cx, y1: cy, x2: end.x, y2: end.y }), h("text", { class: "hu-chart__label", x: label.x, y: label.y, "text-anchor": "middle" }, axis.label));
+    }), ...props.series.map((series, seriesIndex) => {
+        const color = series.color ?? colors[seriesIndex % colors.length];
+        const points = props.axes.map((axis, axisIndex) => {
+            const max = axis.max ?? Math.max(1, ...props.series.map((item) => item.values[axis.key] ?? 0));
+            const value = Math.max(0, Math.min(max, series.values[axis.key] ?? 0));
+            return radarPoint(cx, cy, radius * value / max, axisIndex, props.axes.length);
+        }).join(" ");
+        return h("polygon", {
+            key: series.id,
+            class: "hu-chart__radar-shape",
+            points,
+            fill: color,
+            stroke: color,
+            "aria-label": series.label
+        });
+    })));
+}
+export function HeatMap(props) {
+    injectCSS("hu-charts", CHART_CSS);
+    const width = props.width ?? 640;
+    const height = props.height ?? 320;
+    const padding = { top: 20, right: 20, bottom: 40, left: 72 };
+    const bounds = getPlotBounds(width, height, padding);
+    const xValues = uniqueValues(props.data.map((datum) => datum.x));
+    const yValues = uniqueValues(props.data.map((datum) => datum.y));
+    const extent = getExtent(props.data.map((datum) => datum.value));
+    const min = props.min ?? extent.min;
+    const max = props.max ?? extent.max;
+    const colors = props.colors ?? ["var(--hu-primary-bg)", "var(--hu-primary)"];
+    const cellWidth = bounds.width / Math.max(1, xValues.length);
+    const cellHeight = bounds.height / Math.max(1, yValues.length);
+    return h("section", { class: cn("hu-chart", props.class), "aria-label": props.title ?? "Heat map" }, chartHeader(props.title, props.description ?? `${props.data.length} cells`), h("svg", { viewBox: `0 0 ${width} ${height}`, role: "img", "aria-label": props.title ?? "Heat map" }, ...props.data.map((datum) => {
+        const xIndex = xValues.findIndex((value) => value === datum.x);
+        const yIndex = yValues.findIndex((value) => value === datum.y);
+        return h("rect", {
+            key: `${datum.x}-${datum.y}`,
+            class: "hu-chart__heat-cell",
+            x: bounds.x + xIndex * cellWidth + 2,
+            y: bounds.y + yIndex * cellHeight + 2,
+            width: Math.max(4, cellWidth - 4),
+            height: Math.max(4, cellHeight - 4),
+            fill: colors[1],
+            opacity: scaleLinear(datum.value, min, max, .18, 1),
+            "aria-label": `${datum.x} ${datum.y}: ${datum.value}`
+        });
+    }), ...xValues.map((value, index) => h("text", { key: `x-${value}`, class: "hu-chart__label", x: bounds.x + index * cellWidth + cellWidth / 2, y: height - 12, "text-anchor": "middle" }, value)), ...yValues.map((value, index) => h("text", { key: `y-${value}`, class: "hu-chart__label", x: bounds.x - 8, y: bounds.y + index * cellHeight + cellHeight / 2, "text-anchor": "end", "dominant-baseline": "middle" }, value))));
+}
+export function GaugeChart(props) {
+    injectCSS("hu-charts", CHART_CSS);
+    const width = props.width ?? 360;
+    const height = props.height ?? 220;
+    const min = props.min ?? 0;
+    const max = props.max ?? 100;
+    const value = Math.max(min, Math.min(max, props.value));
+    const ratio = max === min ? 0 : (value - min) / (max - min);
+    const cx = width / 2;
+    const cy = height - 28;
+    const radius = Math.min(width / 2 - 32, height - 54);
+    const startAngle = -90;
+    const endAngle = 90;
+    const valueAngle = startAngle + ratio * (endAngle - startAngle);
+    return h("section", { class: cn("hu-chart", props.class), "aria-label": props.title ?? "Gauge chart" }, chartHeader(props.title, props.description ?? `${value} of ${max}`), h("svg", { viewBox: `0 0 ${width} ${height}`, role: "img", "aria-label": props.title ?? "Gauge chart" }, h("path", { class: "hu-chart__gauge-track", d: describeOpenArc(cx, cy, radius, startAngle, endAngle) }), h("path", {
+        class: "hu-chart__gauge-value",
+        d: describeOpenArc(cx, cy, radius, startAngle, valueAngle),
+        stroke: props.color ?? "var(--hu-primary)",
+        "aria-label": `${value}`
+    }), h("text", { class: "hu-chart__gauge-label", x: cx, y: cy - 16, "text-anchor": "middle" }, props.label ?? String(value)), h("text", { class: "hu-chart__label", x: 32, y: cy + 24, "text-anchor": "middle" }, String(min)), h("text", { class: "hu-chart__label", x: width - 32, y: cy + 24, "text-anchor": "middle" }, String(max))));
+}
+export function FinancialChart(props) {
+    injectCSS("hu-charts", CHART_CSS);
+    const width = props.width ?? 720;
+    const height = props.height ?? 340;
+    const padding = { top: 20, right: 24, bottom: 38, left: 56 };
+    const bounds = getPlotBounds(width, height, padding);
+    const metric = props.metric ?? "close";
+    const values = props.data.map((datum) => datum[metric]);
+    const extent = getExtent(values);
+    const xValues = props.data.map((datum) => datum.date);
+    const color = props.color ?? "var(--hu-primary)";
+    const volumeColor = props.volumeColor ?? "var(--hu-text-2)";
+    const maxVolume = Math.max(1, ...props.data.map((datum) => datum.volume ?? 0));
+    const volumeHeight = props.showVolume ? bounds.height * .22 : 0;
+    const path = props.data.map((datum, index) => {
+        const x = scaleBand(datum.date, xValues, bounds.x, bounds.x2);
+        const y = scaleLinear(datum[metric], extent.min, extent.max, bounds.y2 - volumeHeight, bounds.y);
+        return `${index === 0 ? "M" : "L"} ${x} ${y}`;
+    }).join(" ");
+    return h("section", { class: cn("hu-chart", props.class), "aria-label": props.title ?? "Financial chart" }, chartHeader(props.title, props.description ?? `${props.data.length} points · ${metric}`), h("svg", { viewBox: `0 0 ${width} ${height}`, role: "img", "aria-label": props.title ?? "Financial chart" }, props.showGrid !== false && chartGrid(bounds, 4), props.showVolume && volumeBars(props.data, xValues, bounds, maxVolume, volumeColor), h("line", { class: "hu-chart__axis", x1: bounds.x, y1: bounds.y2, x2: bounds.x2, y2: bounds.y2 }), h("line", { class: "hu-chart__axis", x1: bounds.x, y1: bounds.y, x2: bounds.x, y2: bounds.y2 }), h("path", { class: "hu-chart__line", d: path, stroke: color }), ...props.data.map((datum) => h("circle", {
+        class: "hu-chart__point",
+        key: String(datum.date),
+        cx: scaleBand(datum.date, xValues, bounds.x, bounds.x2),
+        cy: scaleLinear(datum[metric], extent.min, extent.max, bounds.y2 - volumeHeight, bounds.y),
+        r: 3,
+        fill: color,
+        "aria-label": `${datum.date}: ${datum[metric]}`
+    }))));
+}
+export function CandlestickChart(props) {
+    injectCSS("hu-charts", CHART_CSS);
+    const width = props.width ?? 720;
+    const height = props.height ?? 360;
+    const padding = { top: 20, right: 24, bottom: 38, left: 56 };
+    const bounds = getPlotBounds(width, height, padding);
+    const xValues = props.data.map((datum) => datum.date);
+    const priceExtent = getExtent(props.data.flatMap((datum) => [datum.high, datum.low]));
+    const upColor = props.upColor ?? "var(--hu-success)";
+    const downColor = props.downColor ?? "var(--hu-error)";
+    const volumeColor = props.volumeColor ?? "var(--hu-text-2)";
+    const maxVolume = Math.max(1, ...props.data.map((datum) => datum.volume ?? 0));
+    const volumeHeight = props.showVolume ? bounds.height * .2 : 0;
+    const bandSize = bounds.width / Math.max(1, props.data.length);
+    const candleWidth = Math.max(4, Math.min(14, bandSize * .56));
+    return h("section", { class: cn("hu-chart", props.class), "aria-label": props.title ?? "Candlestick chart" }, chartHeader(props.title, props.description ?? `${props.data.length} candles`), h("svg", { viewBox: `0 0 ${width} ${height}`, role: "img", "aria-label": props.title ?? "Candlestick chart" }, props.showGrid !== false && chartGrid(bounds, 4), props.showVolume && volumeBars(props.data, xValues, bounds, maxVolume, volumeColor), h("line", { class: "hu-chart__axis", x1: bounds.x, y1: bounds.y2, x2: bounds.x2, y2: bounds.y2 }), h("line", { class: "hu-chart__axis", x1: bounds.x, y1: bounds.y, x2: bounds.x, y2: bounds.y2 }), ...props.data.map((datum) => {
+        const x = scaleBand(datum.date, xValues, bounds.x, bounds.x2);
+        const high = scaleLinear(datum.high, priceExtent.min, priceExtent.max, bounds.y2 - volumeHeight, bounds.y);
+        const low = scaleLinear(datum.low, priceExtent.min, priceExtent.max, bounds.y2 - volumeHeight, bounds.y);
+        const open = scaleLinear(datum.open, priceExtent.min, priceExtent.max, bounds.y2 - volumeHeight, bounds.y);
+        const close = scaleLinear(datum.close, priceExtent.min, priceExtent.max, bounds.y2 - volumeHeight, bounds.y);
+        const rising = datum.close >= datum.open;
+        const color = rising ? upColor : downColor;
+        return h("g", { key: String(datum.date), "aria-label": `${datum.date}: open ${datum.open}, high ${datum.high}, low ${datum.low}, close ${datum.close}` }, h("line", { class: "hu-chart__candle-wick", x1: x, y1: high, x2: x, y2: low, stroke: color }), h("rect", {
+            class: "hu-chart__candle-body",
+            x: x - candleWidth / 2,
+            y: Math.min(open, close),
+            width: candleWidth,
+            height: Math.max(2, Math.abs(close - open)),
+            fill: color
+        }));
+    })));
+}
+export function Sparkline(props) {
+    injectCSS("hu-charts", CHART_CSS);
+    const width = props.width ?? 160;
+    const height = props.height ?? 40;
+    const extent = getExtent(props.data);
+    const path = props.data.map((value, index) => {
+        const x = props.data.length <= 1 ? width / 2 : index / (props.data.length - 1) * width;
+        const y = scaleLinear(value, extent.min, extent.max, height - 2, 2);
+        return `${index === 0 ? "M" : "L"} ${x} ${y}`;
+    }).join(" ");
+    return h("span", { class: cn("hu-sparkline", props.class), "aria-label": props.label ?? "Sparkline" }, h("svg", { viewBox: `0 0 ${width} ${height}`, role: "img", "aria-label": props.label ?? "Sparkline" }, h("path", {
+        class: "hu-chart__line",
+        d: path,
+        stroke: props.color ?? "currentColor",
+        "stroke-width": props.strokeWidth ?? 2
+    })));
+}
+function chartHeader(title, meta) {
+    return Boolean(title || meta) && h("div", { class: "hu-chart__header" }, title && h("div", { class: "hu-chart__title" }, title), meta && h("div", { class: "hu-chart__meta" }, meta));
+}
+function chartGrid(bounds, lines) {
+    return Array.from({ length: lines + 1 }, (_, index) => {
+        const y = bounds.y + index / lines * bounds.height;
+        return h("line", { key: `grid-${index}`, class: "hu-chart__grid", x1: bounds.x, y1: y, x2: bounds.x2, y2: y });
+    });
+}
+function volumeBars(data, xValues, bounds, maxVolume, color) {
+    const bandSize = bounds.width / Math.max(1, data.length);
+    const maxHeight = bounds.height * .18;
+    return data.map((datum) => {
+        const barHeight = scaleLinear(datum.volume ?? 0, 0, maxVolume, 0, maxHeight);
+        return h("rect", {
+            key: `volume-${datum.date}`,
+            class: "hu-chart__volume",
+            x: scaleBand(datum.date, xValues, bounds.x, bounds.x2) - Math.max(3, bandSize * .25),
+            y: bounds.y2 - barHeight,
+            width: Math.max(3, bandSize * .5),
+            height: barHeight,
+            fill: color,
+            "aria-label": `${datum.date} volume: ${datum.volume ?? 0}`
+        });
+    });
+}
+function getPlotBounds(width, height, padding) {
+    const x = padding.left;
+    const y = padding.top;
+    const x2 = width - padding.right;
+    const y2 = height - padding.bottom;
+    return { x, y, x2, y2, width: x2 - x, height: y2 - y };
+}
+function getExtent(values) {
+    if (values.length === 0)
+        return { min: 0, max: 1 };
+    const min = Math.min(...values);
+    const max = Math.max(...values);
+    return min === max ? { min: min - 1, max: max + 1 } : { min, max };
+}
+function uniqueValues(values) {
+    return [...new Set(values)];
+}
+function scaleLinear(value, domainMin, domainMax, rangeMin, rangeMax) {
+    if (domainMax === domainMin)
+        return (rangeMin + rangeMax) / 2;
+    const ratio = (value - domainMin) / (domainMax - domainMin);
+    return rangeMin + ratio * (rangeMax - rangeMin);
+}
+function scaleBand(value, values, rangeMin, rangeMax) {
+    if (values.length <= 1)
+        return (rangeMin + rangeMax) / 2;
+    const index = Math.max(0, values.findIndex((item) => item === value));
+    return rangeMin + index / (values.length - 1) * (rangeMax - rangeMin);
+}
+function polarToCartesian(cx, cy, radius, angleInDegrees) {
+    const angleInRadians = (angleInDegrees - 90) * Math.PI / 180;
+    return {
+        x: cx + radius * Math.cos(angleInRadians),
+        y: cy + radius * Math.sin(angleInRadians)
+    };
+}
+function describeArc(cx, cy, radius, innerRadius, startAngle, endAngle) {
+    const safeEnd = endAngle - startAngle >= 360 ? endAngle - .001 : endAngle;
+    const start = polarToCartesian(cx, cy, radius, safeEnd);
+    const end = polarToCartesian(cx, cy, radius, startAngle);
+    const largeArcFlag = safeEnd - startAngle <= 180 ? "0" : "1";
+    if (innerRadius <= 0) {
+        return [
+            `M ${cx} ${cy}`,
+            `L ${start.x} ${start.y}`,
+            `A ${radius} ${radius} 0 ${largeArcFlag} 0 ${end.x} ${end.y}`,
+            "Z"
+        ].join(" ");
+    }
+    const innerStart = polarToCartesian(cx, cy, innerRadius, safeEnd);
+    const innerEnd = polarToCartesian(cx, cy, innerRadius, startAngle);
+    return [
+        `M ${start.x} ${start.y}`,
+        `A ${radius} ${radius} 0 ${largeArcFlag} 0 ${end.x} ${end.y}`,
+        `L ${innerEnd.x} ${innerEnd.y}`,
+        `A ${innerRadius} ${innerRadius} 0 ${largeArcFlag} 1 ${innerStart.x} ${innerStart.y}`,
+        "Z"
+    ].join(" ");
+}
+function radarPoint(cx, cy, radius, index, total) {
+    const point = radarPointObject(cx, cy, radius, index, total);
+    return `${point.x},${point.y}`;
+}
+function radarPointObject(cx, cy, radius, index, total) {
+    const angle = -90 + index / Math.max(1, total) * 360;
+    return polarToCartesian(cx, cy, radius, angle + 90);
+}
+function describeOpenArc(cx, cy, radius, startAngle, endAngle) {
+    const start = polarToCartesian(cx, cy, radius, endAngle);
+    const end = polarToCartesian(cx, cy, radius, startAngle);
+    const largeArcFlag = Math.abs(endAngle - startAngle) <= 180 ? "0" : "1";
+    return `M ${start.x} ${start.y} A ${radius} ${radius} 0 ${largeArcFlag} 0 ${end.x} ${end.y}`;
+}

package/dist/components/data.d.ts

@@ -0,0 +1,192 @@
+/**
+ * HyperUI Data Components
+ * VirtualTable · AdvancedFilters · SearchBuilder
+ */
+import { type VNode } from "../theme/index.js";
+import { type SelectOption } from "./Select/index.js";
+export interface VirtualTableColumn<T extends Record<string, unknown> = Record<string, unknown>> {
+    key: keyof T & string;
+    header: string;
+    width?: string | number;
+    align?: "left" | "center" | "right";
+    render?: (row: T, index: number) => unknown;
+}
+export interface VirtualTableProps<T extends Record<string, unknown> = Record<string, unknown>> {
+    columns: Array<VirtualTableColumn<T>>;
+    rows: T[];
+    rowHeight?: number;
+    height?: number | string;
+    startIndex?: number;
+    visibleCount?: number;
+    rowKey?: (row: T, index: number) => string;
+    emptyMessage?: string;
+    class?: string;
+    onRowClick?: (row: T, index: number) => void;
+}
+export declare function VirtualTable<T extends Record<string, unknown>>(props: VirtualTableProps<T>): VNode;
+export type FilterOperator = "equals" | "notEquals" | "contains" | "startsWith" | "endsWith" | "greaterThan" | "lessThan" | "between" | "isEmpty" | "isNotEmpty";
+export interface FilterField {
+    key: string;
+    label: string;
+    type?: "text" | "number" | "date" | "select";
+    options?: SelectOption[];
+}
+export interface FilterRule {
+    id: string;
+    field: string;
+    operator: FilterOperator;
+    value?: string;
+}
+export interface AdvancedFiltersProps {
+    fields: FilterField[];
+    rules?: FilterRule[];
+    title?: string;
+    class?: string;
+    onAddRule?: () => void;
+    onRemoveRule?: (id: string) => void;
+    onRuleChange?: (rule: FilterRule) => void;
+}
+export declare function AdvancedFilters(props: AdvancedFiltersProps): VNode;
+export interface SearchToken {
+    key: string;
+    label: string;
+    value: string;
+}
+export interface SearchBuilderProps {
+    query?: string;
+    tokens?: SearchToken[];
+    placeholder?: string;
+    class?: string;
+    onQueryChange?: (query: string) => void;
+    onSearch?: (query: string, tokens: SearchToken[]) => void;
+    onRemoveToken?: (key: string) => void;
+}
+export declare function SearchBuilder(props: SearchBuilderProps): VNode;
+export interface DataGridColumn<T extends Record<string, unknown> = Record<string, unknown>> extends VirtualTableColumn<T> {
+    visible?: boolean;
+    searchable?: boolean;
+}
+export interface DataGridProps<T extends Record<string, unknown> = Record<string, unknown>> {
+    columns: Array<DataGridColumn<T>>;
+    rows: T[];
+    rowKey?: (row: T, index: number) => string;
+    query?: string;
+    filters?: FilterRule[];
+    filterFields?: FilterField[];
+    selectedRows?: string[];
+    page?: number;
+    pageSize?: number;
+    totalRows?: number;
+    height?: string | number;
+    rowHeight?: number;
+    visibleStartIndex?: number;
+    visibleCount?: number;
+    showColumnControls?: boolean;
+    toolbarActions?: unknown;
+    class?: string;
+    onQueryChange?: (query: string) => void;
+    onFilterAdd?: () => void;
+    onFilterRemove?: (id: string) => void;
+    onFilterChange?: (rule: FilterRule) => void;
+    onSelectedRowsChange?: (keys: string[]) => void;
+    onColumnVisibilityChange?: (key: string, visible: boolean) => void;
+    onPageChange?: (page: number) => void;
+    onRowClick?: (row: T, index: number) => void;
+}
+export declare function DataGrid<T extends Record<string, unknown>>(props: DataGridProps<T>): VNode;
+export type DataExportFormat = "csv" | "json";
+export interface DataExportColumn<T extends Record<string, unknown> = Record<string, unknown>> {
+    key: keyof T & string;
+    header: string;
+    selected?: boolean;
+}
+export interface DataExportPayload<T extends Record<string, unknown> = Record<string, unknown>> {
+    format: DataExportFormat;
+    filename: string;
+    rows: T[];
+    columns: Array<DataExportColumn<T>>;
+    content: string;
+}
+export interface DataExporterProps<T extends Record<string, unknown> = Record<string, unknown>> {
+    rows: T[];
+    columns: Array<DataExportColumn<T>>;
+    format?: DataExportFormat;
+    filename?: string;
+    includeHeaders?: boolean;
+    selectedColumns?: string[];
+    title?: string;
+    description?: string;
+    class?: string;
+    onFormatChange?: (format: DataExportFormat) => void;
+    onFilenameChange?: (filename: string) => void;
+    onColumnToggle?: (key: string, selected: boolean) => void;
+    onExport?: (payload: DataExportPayload<T>) => void;
+}
+export declare function DataExporter<T extends Record<string, unknown>>(props: DataExporterProps<T>): VNode;
+export type DataImportFormat = "csv" | "json";
+export type DataImportStatus = "idle" | "ready" | "parsing" | "success" | "error";
+export interface DataImportColumn<T extends Record<string, unknown> = Record<string, unknown>> {
+    key: keyof T & string;
+    header: string;
+    required?: boolean;
+    mappedTo?: string;
+}
+export interface DataImporterProps<T extends Record<string, unknown> = Record<string, unknown>> {
+    columns?: Array<DataImportColumn<T>>;
+    previewRows?: T[];
+    format?: DataImportFormat;
+    accept?: string;
+    multiple?: boolean;
+    fileName?: string;
+    maxFileSize?: number;
+    status?: DataImportStatus;
+    title?: string;
+    description?: string;
+    error?: string;
+    class?: string;
+    onFormatChange?: (format: DataImportFormat) => void;
+    onFileSelect?: (file: File, e: Event) => void;
+    onImport?: (rows: T[]) => void;
+    onClear?: () => void;
+}
+export declare function DataImporter<T extends Record<string, unknown>>(props: DataImporterProps<T>): VNode;
+export interface TreeGridRow<T extends Record<string, unknown> = Record<string, unknown>> {
+    id: string;
+    data: T;
+    children?: Array<TreeGridRow<T>>;
+    disabled?: boolean;
+}
+export interface TreeGridProps<T extends Record<string, unknown> = Record<string, unknown>> {
+    columns: Array<DataGridColumn<T>>;
+    rows: Array<TreeGridRow<T>>;
+    expanded?: string[];
+    selected?: string;
+    rowHeight?: number;
+    height?: string | number;
+    emptyMessage?: string;
+    class?: string;
+    onToggle?: (id: string, expanded: boolean) => void;
+    onRowClick?: (row: TreeGridRow<T>) => void;
+}
+export declare function TreeGrid<T extends Record<string, unknown>>(props: TreeGridProps<T>): VNode;
+export type PivotAggregation = "sum" | "count" | "avg" | "min" | "max";
+export interface PivotGridField<T extends Record<string, unknown> = Record<string, unknown>> {
+    key: keyof T & string;
+    header: string;
+}
+export interface PivotGridProps<T extends Record<string, unknown> = Record<string, unknown>> {
+    rows: T[];
+    rowFields: Array<PivotGridField<T>>;
+    columnField: PivotGridField<T>;
+    valueField: PivotGridField<T>;
+    aggregation?: PivotAggregation;
+    title?: string;
+    class?: string;
+    formatValue?: (value: number, context: {
+        rowKey: string;
+        columnKey: string;
+        aggregation: PivotAggregation;
+    }) => unknown;
+}
+export declare function PivotGrid<T extends Record<string, unknown>>(props: PivotGridProps<T>): VNode;
+//# sourceMappingURL=data.d.ts.map

package/dist/components/data.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"data.d.ts","sourceRoot":"","sources":["../../src/components/data.ts"],"names":[],"mappings":"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"}