website refactor

apps/website/ui/SimpleCheckbox.tsx

@@ -0,0 +1,36 @@
+'use client';
+
+import React from 'react';
+import { Box } from './Box';
+
+interface CheckboxProps {
+  checked: boolean;
+  onChange: (checked: boolean) => void;
+  disabled?: boolean;
+  'aria-label'?: string;
+}
+
+/**
+ * SimpleCheckbox
+ * 
+ * A checkbox without a label for use in tables.
+ */
+export function SimpleCheckbox({ checked, onChange, disabled, 'aria-label': ariaLabel }: CheckboxProps) {
+  return (
+    <Box
+      as="input"
+      type="checkbox"
+      checked={checked}
+      onChange={(e: React.ChangeEvent<HTMLInputElement>) => onChange(e.target.checked)}
+      disabled={disabled}
+      w="4"
+      h="4"
+      bg="bg-deep-graphite"
+      border
+      borderColor="border-charcoal-outline"
+      rounded="sm"
+      aria-label={ariaLabel}
+      className="text-primary-blue focus:ring-primary-blue"
+    />
+  );
+}