Files
web/src/components/DeviceSelectorButton.tsx
Sacha Weatherstone 7fb2da396f update deps & lint
2024-01-06 10:15:49 +10:00

25 lines
583 B
TypeScript

export interface DeviceSelectorButtonProps {
active: boolean;
onClick: () => void;
children?: React.ReactNode;
}
export const DeviceSelectorButton = ({
active,
onClick,
children,
}: DeviceSelectorButtonProps): JSX.Element => (
<li
className="aspect-w-1 aspect-h-1 relative w-full"
onClick={onClick}
onKeyDown={onClick}
>
{active && (
<div className="absolute -left-2 h-10 w-1.5 rounded-full bg-accent" />
)}
<div className="flex aspect-square cursor-pointer flex-col items-center justify-center">
{children}
</div>
</li>
);