feat: comment updates

packages/design-system/lib/components/Button/Button.tsx

@@ -24,24 +24,20 @@ export function Button({
     className,
   })
 
-  let loadingType: LoadingProps['type'] = 'White'
-  if (variant === 'Secondary') {
-    if (color === 'Inverted') {
-      loadingType = 'White'
-    } else {
-      loadingType = 'Dark'
-    }
-  } else {
-    if (color === 'Inverted') {
-      loadingType = 'Dark'
-    } else {
-      loadingType = 'White'
-    }
-  }
-
   return (
     <ButtonRAC {...props} className={classNames}>
-      {({ isPending }) => {
+      {({ isPending, isHovered }) => {
+        let loadingType: LoadingProps['type'] = 'White'
+        if (variant === 'Secondary') {
+          if (isHovered || color !== 'Inverted') {
+            loadingType = 'Dark'
+          }
+        } else {
+          if (color === 'Inverted') {
+            loadingType = 'Dark'
+          }
+        }
+
         return (
           <>
             {children}

packages/design-system/lib/components/Button/button.module.css

@@ -8,9 +8,14 @@
   justify-content: center;
   gap: var(--Space-x05);
 
-  &:disabled {
+  &:disabled,
+  &[data-disabled] {
     cursor: unset;
   }
+
+  &[data-pending] {
+    cursor: progress;
+  }
 }
 
 .size-large {
@@ -172,4 +177,4 @@
   display: flex;
   align-items: center;
   margin-left: var(--Space-x1);
-}
+}