Charts

Bar chart

Entries by day

  • Cars
  • Motorcycles

Import#

Everything comes from the package root. The example above uses:

your-component.tsx
import { BarChart, ChartCard, SERIES } from "@waveinno/ui";

Props#

Read from the source of this version, so they match the code exactly.

<BarChart>

src/components/charts/bar-chart.tsx
PropTypeDefaultDescription
datarequiredRecord<string, string | number>[]—
xKeyrequiredstring—
seriesrequiredBarSeries[]—
format(v: number) => string(v) => String(v)
stackedboolean—
horizontalboolean—

<ChartCard>

src/components/charts/chart-card.tsx
PropTypeDefaultDescription
titlerequiredstring—
descriptionstring—
seriesSeriesMeta[]—
actionReact.ReactNode—
childrenrequiredReact.ReactNode—
classNamestring—
heightnumber240

Install#

If the project does not have the package yet, add it, then follow the setup for Next.js or Vite once.

$ npm install @waveinno/ui