Formatting

src/components/buttons/ActionButton.tsx

@@ -39,14 +39,14 @@ const ActionButton: FC<ActionButtonProps> = ({
   const getButtonVariant = (): ButtonVariant => {
     // For uninstall actions, use danger variant
     if (isInstalled) return 'danger'
-    // For install actions, use success variant 
+    // For install actions, use success variant
     return 'success'
   }
 
   // Select appropriate icon based on action type and state
   const getIconInfo = () => {
     const isCream = action.includes('cream')
-    
+
     if (isInstalled) {
       // Uninstall actions
       return { name: layers, variant: 'bold' }
@@ -66,17 +66,13 @@ const ActionButton: FC<ActionButtonProps> = ({
       disabled={disabled || isWorking}
       fullWidth
       className={`action-button ${className}`}
-      leftIcon={isWorking ? undefined : (
-        <Icon
-          name={iconInfo.name}
-          variant={iconInfo.variant}
-          size="md"
-        />
-      )}
+      leftIcon={
+        isWorking ? undefined : <Icon name={iconInfo.name} variant={iconInfo.variant} size="md" />
+      }
     >
       {getButtonText()}
     </Button>
   )
 }
 
-export default ActionButton
+export default ActionButton

src/components/buttons/AnimatedCheckbox.tsx

@@ -1,11 +1,11 @@
 import { Icon, check } from '@/components/icons'
 
 interface AnimatedCheckboxProps {
-  checked: boolean;
-  onChange: () => void;
-  label?: string;
-  sublabel?: string;
-  className?: string;
+  checked: boolean
+  onChange: () => void
+  label?: string
+  sublabel?: string
+  className?: string
 }
 
 /**
@@ -20,24 +20,12 @@ const AnimatedCheckbox = ({
 }: AnimatedCheckboxProps) => {
   return (
     <label className={`animated-checkbox ${className}`}>
-      <input 
-        type="checkbox" 
-        checked={checked} 
-        onChange={onChange} 
-        className="checkbox-original"
-      />
-      
+      <input type="checkbox" checked={checked} onChange={onChange} className="checkbox-original" />
+
       <span className={`checkbox-custom ${checked ? 'checked' : ''}`}>
-        {checked && (
-          <Icon
-            name={check}
-            variant="bold"
-            size="sm"
-            className="checkbox-icon"
-          />
-        )}
+        {checked && <Icon name={check} variant="bold" size="sm" className="checkbox-icon" />}
       </span>
-      
+
       {(label || sublabel) && (
         <div className="checkbox-content">
           {label && <span className="checkbox-label">{label}</span>}
@@ -48,4 +36,4 @@ const AnimatedCheckbox = ({
   )
 }
 
-export default AnimatedCheckbox
+export default AnimatedCheckbox

src/components/buttons/Button.tsx

@@ -1,15 +1,15 @@
-import { FC, ButtonHTMLAttributes } from 'react';
+import { FC, ButtonHTMLAttributes } from 'react'
 
-export type ButtonVariant = 'primary' | 'secondary' | 'danger' | 'success' | 'warning';
-export type ButtonSize = 'small' | 'medium' | 'large';
+export type ButtonVariant = 'primary' | 'secondary' | 'danger' | 'success' | 'warning'
+export type ButtonSize = 'small' | 'medium' | 'large'
 
 interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
-  variant?: ButtonVariant;
-  size?: ButtonSize;
-  isLoading?: boolean;
-  leftIcon?: React.ReactNode;
-  rightIcon?: React.ReactNode;
-  fullWidth?: boolean;
+  variant?: ButtonVariant
+  size?: ButtonSize
+  isLoading?: boolean
+  leftIcon?: React.ReactNode
+  rightIcon?: React.ReactNode
+  fullWidth?: boolean
 }
 
 /**
@@ -32,7 +32,7 @@ const Button: FC<ButtonProps> = ({
     small: 'btn-sm',
     medium: 'btn-md',
     large: 'btn-lg',
-  }[size];
+  }[size]
 
   // Variant class mapping
   const variantClass = {
@@ -41,7 +41,7 @@ const Button: FC<ButtonProps> = ({
     danger: 'btn-danger',
     success: 'btn-success',
     warning: 'btn-warning',
-  }[variant];
+  }[variant]
 
   return (
     <button
@@ -56,12 +56,12 @@ const Button: FC<ButtonProps> = ({
           <span className="spinner"></span>
         </span>
       )}
-      
+
       {leftIcon && !isLoading && <span className="btn-icon btn-icon-left">{leftIcon}</span>}
       <span className="btn-text">{children}</span>
       {rightIcon && !isLoading && <span className="btn-icon btn-icon-right">{rightIcon}</span>}
     </button>
-  );
-};
+  )
+}
 
-export default Button;
+export default Button

src/components/buttons/index.ts

@@ -1,8 +1,8 @@
 // Export all button components
-export { default as Button } from './Button';
-export { default as ActionButton } from './ActionButton';
-export { default as AnimatedCheckbox } from './AnimatedCheckbox';
+export { default as Button } from './Button'
+export { default as ActionButton } from './ActionButton'
+export { default as AnimatedCheckbox } from './AnimatedCheckbox'
 
 // Export types
-export type { ButtonVariant, ButtonSize } from './Button';
-export type { ActionType } from './ActionButton';
+export type { ButtonVariant, ButtonSize } from './Button'
+export type { ActionType } from './ActionButton'