echarts-bar-chart

1"use client";
2 
3import {
4  tooltipBaseOption,
5  tooltipIndicatorHtml,
6  tooltipRow,
7  tooltipShell,
8  type TooltipPosition,
9  type TooltipRoundness,
10  type TooltipVariant,
11} from "@/registry/ui/echarts-tooltip";
12import {
13  Brush,
14  buildBrushDataZoom,
15  syncBrushOverlay,
16  type BrushGeometry,
17  type BrushOverlayElements,
18  type BrushProps,
19  type BrushRange,
20} from "@/registry/ui/echarts-brush";
21import {
22  DataZoomComponent,
23  GridComponent,
24  TooltipComponent,
25  type DataZoomComponentOption,
26  type GridComponentOption,
27  type TooltipComponentOption,
28} from "echarts/components";
29import {
30  Children,
31  isValidElement,
32  useCallback,
33  useEffect,
34  useId,
35  useMemo,
36  useRef,
37  useState,
38  type CSSProperties,
39  type FC,
40  type ReactNode,
41} from "react";
42import {
43  buildChartCss,
44  flattenColor,
45  getColorsCount,
46  resolveColors,
47  withAlpha,
48  type ChartConfig,
49  type ResolvedColors,
50} from "@/registry/ui/echarts-chart";
51import { LegendOverlay, type LegendVariant } from "@/registry/ui/echarts-legend";
52import type { ComposeOption, ImagePatternObject } from "echarts/core";
53import { BarChart, type BarSeriesOption } from "echarts/charts";
54import { sampleGradient } from "@/registry/ui/echarts-dot";
55import { motion, useReducedMotion } from "motion/react";
56import { CanvasRenderer } from "echarts/renderers";
57import * as echarts from "echarts/core";
58 
59// Re-export the shared types that were previously declared inline here, so
60// existing consumers/examples keep importing them from the chart module.
61export type { ChartConfig, LegendVariant, TooltipPosition, TooltipRoundness, TooltipVariant };
62 
63// Modular registration keeps the bundle lean — only the pieces this chart needs.
64// `DataZoomComponent` bundles both the slider (brush footer) and inside (wheel/drag)
65// zoom. The brush's frame/handles/labels are raw zrender elements, not the
66// graphic component — see syncBrushOverlay. No LineChart: the main plot, the
67// loading skeleton, and the brush mini chart are ALL bar series.
68echarts.use([BarChart, GridComponent, TooltipComponent, DataZoomComponent, CanvasRenderer]);
69 
70type EChartsInstance = ReturnType<typeof echarts.init>;
71 
72// The exact option surface this chart uses — bar series, grid, tooltip, and
73// dataZoom, plus the axis options they pull in as dependencies. Narrower than
74// echarts' full EChartsOption, so a misspelled key fails the compile instead of
75// silently reaching setOption.
76type EChartsOption = ComposeOption<
77// … truncated