aboutsummaryrefslogtreecommitdiff
path: root/src/components/charts/ChartTooltip.tsx
diff options
context:
space:
mode:
authorFuwn <[email protected]>2026-01-24 13:09:50 +0000
committerFuwn <[email protected]>2026-01-24 13:09:50 +0000
commit396acf3bbbe00a192cb0ea0a9ccf91b1d8d2850b (patch)
treeb9df4ca6a70db45cfffbae6fdd7252e20fb8e93c /src/components/charts/ChartTooltip.tsx
downloadumami-396acf3bbbe00a192cb0ea0a9ccf91b1d8d2850b.tar.xz
umami-396acf3bbbe00a192cb0ea0a9ccf91b1d8d2850b.zip
Initial commitHEADmain
Created from https://vercel.com/new
Diffstat (limited to 'src/components/charts/ChartTooltip.tsx')
-rw-r--r--src/components/charts/ChartTooltip.tsx23
1 files changed, 23 insertions, 0 deletions
diff --git a/src/components/charts/ChartTooltip.tsx b/src/components/charts/ChartTooltip.tsx
new file mode 100644
index 0000000..95ba2a2
--- /dev/null
+++ b/src/components/charts/ChartTooltip.tsx
@@ -0,0 +1,23 @@
+import { Column, FloatingTooltip, Row, StatusLight } from '@umami/react-zen';
+import type { ReactNode } from 'react';
+
+export function ChartTooltip({
+ title,
+ color,
+ value,
+}: {
+ title?: string;
+ color?: string;
+ value?: ReactNode;
+}) {
+ return (
+ <FloatingTooltip>
+ <Column gap="3" fontSize="1">
+ {title && <Row alignItems="center">{title}</Row>}
+ <Row alignItems="center">
+ <StatusLight color={color}>{value}</StatusLight>
+ </Row>
+ </Column>
+ </FloatingTooltip>
+ );
+}