From c55ce3ad77bf7f73564731395f6c6a41f77dc368 Mon Sep 17 00:00:00 2001
From: Matthew Ellison <m_ellison@ymail.com>
Date: Thu, 26 Feb 2026 21:29:17 -0500
Subject: [PATCH] Update drag and drop hover classes

---
 README.md                                         | 4 ++++
 lib/component/input/file/DragAndDropFileInput.tsx | 7 +++++--
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 7f13206..f078084 100644
--- a/README.md
+++ b/README.md
@@ -1 +1,5 @@
+# Mattrixwv React Components
+
+[![Quality Gate Status](https://sonarqube.mattrixwv.com/api/project_badges/measure?project=MattrixwvReactComponents&metric=alert_status&token=sqb_e8b5362c32319b0612536e683cdbe2a77ec5bb32)](https://sonarqube.mattrixwv.com/dashboard?id=MattrixwvReactComponents)
+
 Under Construction
diff --git a/lib/component/input/file/DragAndDropFileInput.tsx b/lib/component/input/file/DragAndDropFileInput.tsx
index 8aa3838..375fccf 100644
--- a/lib/component/input/file/DragAndDropFileInput.tsx
+++ b/lib/component/input/file/DragAndDropFileInput.tsx
@@ -27,12 +27,15 @@ export default function DragAndDropFileInput({
 		<label
 			className={clsx(
 				"flex flex-col items-center justify-center border-2 rounded-lg cursor-pointer",
-				//TODO: Make hover classes
+				"data-drag:border-primary data-drag:text-primary",
 				className
 			)}
-			onDragOver={(e) => e.preventDefault()}
+			onDragOver={(e) => { e.preventDefault(); e.currentTarget.dataset.drag = "true"; }}
+			onDragLeave={(e) => { e.preventDefault(); delete e.currentTarget.dataset.drag; }}
 			onDrop={(e) => {
 				e.preventDefault();
+				delete e.currentTarget.dataset.drag;
+
 				const currentFile = e.dataTransfer.files[0];
 				setFile(currentFile);