refactor: update checkbox border styles for consistency

Updated border styles for checkbox components to ensure uniform appearance. Added 'group-hover:border-primary' class to CheckboxCards for hover effect.

Author: thevuong

packages/ui/src/components/checkbox-cards.tsx

@@ -47,15 +47,16 @@ const CheckboxCardsItem = forwardRef<
 >(({ children, className, checkboxClassName, ...props }, forwardedRef) => (
   <label
     className={cn(
-      'flex items-center justify-center gap-4 rounded-md border p-4',
+      'group flex items-center justify-center gap-4 rounded-md border p-4',
       className,
     )}
   >
     {children}
     <CheckboxGroupPrimitive.Item
       ref={forwardedRef}
       className={cn(
-        'border-input peer flex size-4 shrink-0 cursor-pointer rounded-sm border shadow-sm',
+        'border-input peer flex size-4 shrink-0 cursor-pointer rounded border shadow-sm',
+        'group-hover:border-primary',
         'aria-checked:border-primary aria-checked:bg-primary aria-checked:text-primary-foreground',
         'focus-visible:outline focus-visible:outline-2 focus-visible:-outline-offset-1',
         'disabled:cursor-default disabled:opacity-50',

packages/ui/src/components/checkbox-group.tsx

@@ -47,7 +47,7 @@ const CheckboxGroupItem = forwardRef<
     ref={forwardedRef}
     className={cn(
       [
-        'border-input peer flex size-4 shrink-0 rounded-sm border shadow-sm',
+        'border-input peer flex size-4 shrink-0 rounded border shadow-sm',
         'hover:border-primary',
         'aria-checked:border-primary aria-checked:bg-primary aria-checked:text-primary-foreground',
         'focus-visible:outline focus-visible:outline-2 focus-visible:-outline-offset-1',

packages/ui/src/components/checkbox.tsx

@@ -19,7 +19,7 @@ const Checkbox = forwardRef<CheckboxElement, CheckboxProps>(
     <CheckboxPrimitive.Root
       ref={forwardedRef}
       className={cn(
-        'border-input peer inline-flex size-4 shrink-0 rounded-sm border shadow-sm',
+        'border-input peer inline-flex size-4 shrink-0 rounded border shadow-sm',
         'hover:border-primary',
         'aria-checked:border-primary aria-checked:bg-primary aria-checked:text-primary-foreground',
         'focus-visible:outline focus-visible:outline-2 focus-visible:-outline-offset-1',