diff --git a/frontend/src/ui/button.tsx b/frontend/src/ui/button.tsx index 3afbf0b47..65cd2a5ec 100644 --- a/frontend/src/ui/button.tsx +++ b/frontend/src/ui/button.tsx @@ -1,8 +1,8 @@ -import * as React from "react" -import { Slot } from "@radix-ui/react-slot" -import { cva, type VariantProps } from "class-variance-authority" +import * as React from "react"; +import { Slot } from "@radix-ui/react-slot"; +import { cva, type VariantProps } from "class-variance-authority"; -import { cn } from "@util/helpers" +import { cn } from "@util/helpers"; const buttonVariants = cva( "inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50", @@ -26,32 +26,38 @@ const buttonVariants = cva( lg: "h-10 rounded-md px-8", icon: "h-9 w-9", }, + intent: { + success: "border-green-200 dark:border-green-800 hover:bg-green-800/30", + warning: + "border-orange-200 dark:border-orange-800 hover:bg-orange-800/30", + danger: "border-red-200 dark:border-red-800 hover:bg-red-800/30", + }, }, defaultVariants: { variant: "default", size: "default", }, } -) +); export interface ButtonProps extends React.ButtonHTMLAttributes, VariantProps { - asChild?: boolean + asChild?: boolean; } const Button = React.forwardRef( - ({ className, variant, size, asChild = false, ...props }, ref) => { - const Comp = asChild ? Slot : "button" + ({ className, variant, size, intent, asChild = false, ...props }, ref) => { + const Comp = asChild ? Slot : "button"; return ( - ) + ); } -) -Button.displayName = "Button" +); +Button.displayName = "Button"; -export { Button, buttonVariants } +export { Button, buttonVariants };