feat: add rounded button variants

oxen-io · Jul 2, 2024 · 4c9f7c5 · 4c9f7c5
1 parent 4813dd8
commit 4c9f7c5
Showing 1 changed file with 9 additions and 2 deletions.
diff --git a/packages/ui/components/ui/button.tsx b/packages/ui/components/ui/button.tsx
@@ -24,10 +24,17 @@ const buttonVariants = cva(
         lg: 'h-11 px-8',
         icon: 'h-10 w-10',
       },
+      rounded: {
+        full: 'rounded-full',
+        lg: 'rounded-lg',
+        md: 'rounded-md',
+        sm: 'rounded-sm',
+      },
     },
     defaultVariants: {
       variant: 'default',
       size: 'md',
+      rounded: 'full',
     },
   }
 );
@@ -42,11 +49,11 @@ export interface ButtonProps
 }
 
 const Button = forwardRef<HTMLButtonElement, ButtonProps>(
-  ({ className, variant, size, asChild = false, ...props }, ref) => {
+  ({ className, variant, size, rounded, asChild = false, ...props }, ref) => {
     const Comp = asChild ? Slot : 'button';
     return (
       <Comp
-        className={cn(buttonVariants({ variant, size, className }))}
+        className={cn(buttonVariants({ variant, size, rounded, className }))}
         ref={ref}
         {...props}
         data-testid={props['data-testid'] ?? BaseDataTestId.Button}