feat(ui): port dashboard components to react
This commit is contained in:
parent
a71d66b1b8
commit
73abcc1b69
33 changed files with 1304 additions and 182 deletions
27
src/lib/ui/components/LineChart.tsx
Normal file
27
src/lib/ui/components/LineChart.tsx
Normal file
|
|
@ -0,0 +1,27 @@
|
|||
import "uplot/dist/uPlot.min.css";
|
||||
import type { UiSeverity } from "../types";
|
||||
|
||||
export interface LineChartProps {
|
||||
values?: number[];
|
||||
severity?: UiSeverity;
|
||||
label?: string;
|
||||
}
|
||||
|
||||
export function LineChart({
|
||||
values = [],
|
||||
severity = "neutral",
|
||||
label = "Telemetry trend",
|
||||
}: LineChartProps) {
|
||||
return (
|
||||
<div
|
||||
className="line-chart"
|
||||
data-chart-library="uplot"
|
||||
data-severity={severity}
|
||||
data-values={values.join(",")}
|
||||
role="img"
|
||||
aria-label={label}
|
||||
>
|
||||
<div className="line-chart__canvas" aria-hidden="true" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue