diff --git a/src/components/ui/Badge/Badge.tsx b/src/components/ui/Badge/Badge.tsx
index f47f453..5ac1b42 100644
--- a/src/components/ui/Badge/Badge.tsx
+++ b/src/components/ui/Badge/Badge.tsx
@@ -9,23 +9,19 @@ import type {BadgeProps} from "./BadgeProps.ts";
  * @example
  * <Badge text="New" variant="primary" removable onRemove={() => console.log('removed')} />
  */
-export function Badge(props: BadgeProps) {
-	const variant = props.variant ?? 'primary';
-	const removable = props.removable ?? false;
-	// Note: The 'color' prop from BadgeProps is ignored in favor of the 'variant'
-	// prop, which aligns with DaisyUI's class-based styling.
-	const badgeClasses = [
-			'badge',
-			`badge-${variant}`,
-			'gap-2'
-	].join(' ');
+export function Badge(props: Readonly<BadgeProps>) {
+    const variant = props.variant ?? 'primary';
+    const removable = props.removable ?? false;
+    // Note: The 'color' prop from BadgeProps is ignored in favor of the 'variant'
+    // prop, which aligns with DaisyUI's class-based styling.
+    const badgeClasses = ['badge', `badge-${variant}`, 'gap-2'].join(' ');
 
-	return (
-		<div className={badgeClasses}>
-			<span className="whitespace-pre-wrap">{props.text}</span>
-			{removable && (<button onClick={props.onRemove} className="btn btn-ghost btn-xs">
-				✕
-			</button>)}
-		</div>
-	);
+    return (
+        <div className={badgeClasses}>
+            <span className="whitespace-pre-wrap">{props.text}</span>
+            {removable && (<button onClick={props.onRemove} className="btn btn-ghost btn-xs">
+                ✕
+            </button>)}
+        </div>
+    );
 }
\ No newline at end of file