From 3631eb7c67425a85f0fd49c23a137c4dc2dc5fe7 Mon Sep 17 00:00:00 2001
From: Cohan Carpentier <cohan.carpentier@gmail.com>
Date: Mon, 14 Oct 2024 05:31:26 -0400
Subject: [PATCH] fix: reduce btn dom size

---
 README.md    |  2 +-
 button.tsx   | 19 ++++++++-----------
 package.json |  2 +-
 3 files changed, 10 insertions(+), 13 deletions(-)

diff --git a/README.md b/README.md
index 21d76d5..e20b87c 100644
--- a/README.md
+++ b/README.md
@@ -18,4 +18,4 @@ https://www.npmjs.com/package/@risc0/ui
 
 | Statements                  | Branches                | Functions                 | Lines             |
 | --------------------------- | ----------------------- | ------------------------- | ----------------- |
-| ![Statements](https://img.shields.io/badge/statements-36.73%25-red.svg?style=flat) | ![Branches](https://img.shields.io/badge/branches-79.51%25-red.svg?style=flat) | ![Functions](https://img.shields.io/badge/functions-72%25-red.svg?style=flat) | ![Lines](https://img.shields.io/badge/lines-36.73%25-red.svg?style=flat) |
+| ![Statements](https://img.shields.io/badge/statements-36.61%25-red.svg?style=flat) | ![Branches](https://img.shields.io/badge/branches-79.26%25-red.svg?style=flat) | ![Functions](https://img.shields.io/badge/functions-72%25-red.svg?style=flat) | ![Lines](https://img.shields.io/badge/lines-36.61%25-red.svg?style=flat) |
diff --git a/button.tsx b/button.tsx
index 9b9a9a4..7f444c4 100644
--- a/button.tsx
+++ b/button.tsx
@@ -4,7 +4,7 @@ import { Loader2Icon } from "lucide-react";
 import { type ButtonHTMLAttributes, type ReactElement, cloneElement, forwardRef } from "react";
 import { cn } from "./cn";
 
-const buttonVariants = cva(
+export const buttonVariants = cva(
   "inline-flex items-center justify-center whitespace-nowrap rounded-md font-bold text-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50",
   {
     variants: {
@@ -30,7 +30,7 @@ const buttonVariants = cva(
   },
 );
 
-const iconVariants = cva(undefined, {
+export const iconVariants = cva(undefined, {
   variants: {
     size: {
       default: "size-4 max-w-4",
@@ -58,16 +58,13 @@ const Button = forwardRef<HTMLButtonElement, ButtonProps>(
 
     return (
       <Component className={cn(buttonVariants({ variant, size, className }))} ref={ref} {...rest}>
-        <Loader2Icon
+        <div
           data-testid="loader-icon"
           aria-hidden={!isLoading}
-          className={cn(
-            !startIcon && "transition-all",
-            isLoading && "mr-2 animate-spin",
-            iconVariants({ size }),
-            !isLoading && "mr-0 max-w-0",
-          )}
-        />
+          className={cn(!startIcon && "transition-all", iconVariants({ size }), "mr-2", !isLoading && "mr-0 max-w-0")}
+        >
+          {isLoading && <Loader2Icon className={cn(iconVariants({ size }), "animate-spin")} />}
+        </div>
         {!isLoading &&
           startIcon &&
           cloneElement(startIcon as ReactElement, {
@@ -85,4 +82,4 @@ const Button = forwardRef<HTMLButtonElement, ButtonProps>(
 
 Button.displayName = "Button";
 
-export { Button, buttonVariants };
+export { Button };
diff --git a/package.json b/package.json
index 1ba913d..a84b9d7 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@risc0/ui",
-  "version": "0.0.190",
+  "version": "0.0.191",
   "private": false,
   "sideEffects": false,
   "type": "module",