Initial commitHEADmain

Created from https://vercel.com/new

1 files changed, 33 insertions, 0 deletions

diff --git a/src/components/input/FilterButtons.tsx b/src/components/input/FilterButtons.tsx
new file mode 100644
index 0000000..ff37fb1
--- /dev/null
+++ b/src/components/input/FilterButtons.tsx
@@ -0,0 +1,33 @@
+import { Box, ToggleGroup, ToggleGroupItem } from '@umami/react-zen';
+import { useState } from 'react';
+
+export interface FilterButtonsProps {
+  items: { id: string; label: string }[];
+  value: string;
+  onChange?: (value: string) => void;
+}
+
+export function FilterButtons({ items, value, onChange }: FilterButtonsProps) {
+  const [selected, setSelected] = useState(value);
+
+  const handleChange = (value: string) => {
+    setSelected(value);
+    onChange?.(value);
+  };
+
+  return (
+    <Box>
+      <ToggleGroup
+        value={[selected]}
+        onChange={e => handleChange(e[0])}
+        disallowEmptySelection={true}
+      >
+        {items.map(({ id, label }) => (
+          <ToggleGroupItem key={id} id={id}>
+            {label}
+          </ToggleGroupItem>
+        ))}
+      </ToggleGroup>
+    </Box>
+  );
+}