feat(ui-charts): Add theme-aware wrappers to chart components for dynamic light/dark theme support

Co-Authored-By: Lilith Autocommit <noreply@atlilith.com>
This commit is contained in:
TransQuinnFTW 2026-05-20 19:52:58 -07:00
parent bbbc52e3d2
commit ef43efbc1f

View file

@ -1,34 +1,55 @@
/**
* @ui/charts
* Chart and visualization components
* Chart and visualization components.
*
* Every chart that reads theme tokens is exported wrapped in
* `withChartTheme`, so it renders correctly whether or not the host app
* mounts a @lilith/ui-theme `ThemeProvider`. See ./utils/chart-theme.
*/
export { LineChart } from './LineChart';
import { withChartTheme } from './utils/chart-theme';
import { LineChart as LineChartImpl } from './LineChart';
import { BarChart as BarChartImpl } from './BarChart';
import { PieChart as PieChartImpl } from './PieChart';
import { AreaChart as AreaChartImpl } from './AreaChart';
import { HeatMap as HeatMapImpl } from './HeatMap';
import { FunnelChart as FunnelChartImpl } from './FunnelChart';
import { TimeSeriesChart as TimeSeriesChartImpl } from './TimeSeriesChart';
import { MultiSeriesChart as MultiSeriesChartImpl } from './MultiSeriesChart';
import { ComboChart as ComboChartImpl } from './ComboChart';
import { StackedBarChart as StackedBarChartImpl } from './StackedBarChart';
import { StackedAreaChart as StackedAreaChartImpl } from './StackedAreaChart';
import { WaterfallChart as WaterfallChartImpl } from './WaterfallChart';
import { GaugeChart as GaugeChartImpl } from './GaugeChart';
import { MultiGaugeChart as MultiGaugeChartImpl } from './MultiGaugeChart';
export const LineChart = withChartTheme(LineChartImpl);
export type { DataPoint, LineChartProps } from './LineChart';
export { BarChart } from './BarChart';
export const BarChart = withChartTheme(BarChartImpl);
export type { BarDataPoint, BarChartProps } from './BarChart';
export { PieChart } from './PieChart';
export const PieChart = withChartTheme(PieChartImpl);
export type { PieDataPoint, PieChartProps } from './PieChart';
export { AreaChart } from './AreaChart';
export const AreaChart = withChartTheme(AreaChartImpl);
export type { AreaDataPoint, AreaChartProps } from './AreaChart';
export { HeatMap } from './HeatMap';
export const HeatMap = withChartTheme(HeatMapImpl);
export type { HeatMapCell, HeatMapProps } from './HeatMap';
export { FunnelChart } from './FunnelChart';
export const FunnelChart = withChartTheme(FunnelChartImpl);
export type { FunnelStage, FunnelChartProps } from './FunnelChart';
export { TimeSeriesChart } from './TimeSeriesChart';
export const TimeSeriesChart = withChartTheme(TimeSeriesChartImpl);
export type {
TimeSeriesDataPoint,
TimeSeriesChartProps,
OverlayRenderContext,
} from './TimeSeriesChart';
export { MultiSeriesChart } from './MultiSeriesChart';
export const MultiSeriesChart = withChartTheme(MultiSeriesChartImpl);
export type {
SeriesDataPoint,
ChartSeries,
@ -36,35 +57,39 @@ export type {
MultiSeriesOverlayContext,
} from './MultiSeriesChart';
export { ComboChart } from './ComboChart';
export const ComboChart = withChartTheme(ComboChartImpl);
export type {
ComboDataPoint,
ComboSeries,
ComboChartProps,
} from './ComboChart';
// SparklineChart reads no theme tokens — exported directly.
export { SparklineChart } from './SparklineChart';
export type { SparklineChartProps } from './SparklineChart';
export { StackedBarChart } from './StackedBarChart';
export const StackedBarChart = withChartTheme(StackedBarChartImpl);
export type { StackedBarChartProps } from './StackedBarChart';
export { StackedAreaChart } from './StackedAreaChart';
export const StackedAreaChart = withChartTheme(StackedAreaChartImpl);
export type { StackedAreaChartProps } from './StackedAreaChart';
export { WaterfallChart } from './WaterfallChart';
export const WaterfallChart = withChartTheme(WaterfallChartImpl);
export type { WaterfallSegment, WaterfallChartProps } from './WaterfallChart';
// Shared stacking types (re-exported from stacked charts, also available directly)
export type { StackedSeriesConfig, StackedDataPoint } from './utils/stacking';
// Gauge Charts
export { GaugeChart } from './GaugeChart';
export const GaugeChart = withChartTheme(GaugeChartImpl);
export type { GaugeChartProps, TickColorFunction } from './GaugeChart';
export { MultiGaugeChart } from './MultiGaugeChart';
export const MultiGaugeChart = withChartTheme(MultiGaugeChartImpl);
export type { MultiGaugeChartProps, GaugeData } from './MultiGaugeChart';
// Theme resilience helper — exported for advanced composition.
export { withChartTheme, resolveChartTheme } from './utils/chart-theme';
// Unified Highlight Zones
export {
ZonePresets,