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>
+  );
+}