Magnet input: keydown

This commit is contained in:
Igor Katson 2023-12-14 12:42:22 +00:00
parent 5a30b3fb0c
commit 74ae3cfca2
No known key found for this signature in database
GPG key ID: B4EC22B66D61A3F5
9 changed files with 59 additions and 49 deletions

View file

@ -1,19 +1,18 @@
import { ReactNode } from "react";
export const Button: React.FC<{
onClick: React.MouseEventHandler<HTMLButtonElement>;
onClick: () => void;
variant?: "cancel" | "primary" | "secondary" | "danger" | "none";
className?: string;
disabled?: boolean;
children: ReactNode;
}> = ({ onClick, children, className, disabled, variant }) => {
let variantClassNames = {
secondary:
"hover:bg-blue-600 transition-colors duration-100 hover:text-white",
secondary: "hover:bg-blue-500 transition-colors hover:text-white",
danger:
"bg-red-500 text-white border-green-50 hover:border-red-700 hover:bg-red-600",
primary: "bg-blue-400 text-white hover:bg-blue-600",
cancel: "bg-slate-50 hover:bg-slate-200",
"bg-red-400 text-white border-green-50 hover:border-red-700 hover:bg-red-600",
primary: "bg-blue-600 text-white hover:bg-blue-800 disabled:bg-blue-200",
cancel: "hover:bg-slate-200",
none: "",
}[variant ?? "secondary"];
return (
@ -21,7 +20,7 @@ export const Button: React.FC<{
disabled={disabled}
onClick={(e) => {
e.preventDefault();
onClick(e);
onClick();
}}
className={`flex inline-flex items-center gap-1 border rounded-lg border disabled:cursor-not-allowed px-2 py-1 transition-colors duration-300 ${variantClassNames} ${className}`}
>