From 0e33627996db22abf841f5d2edc29faf8e41fbc0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fredrik=20Adel=C3=B6w?= <freben@gmail.com>
Date: Wed, 11 Jan 2023 13:34:14 +0100
Subject: [PATCH] remove usage of span
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Fredrik Adelöw <freben@gmail.com>
---
 .changeset/selfish-seas-push.md                      |  5 +++++
 .../EntityPeekAheadPopover.tsx                       | 12 ++++++++----
 2 files changed, 13 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/selfish-seas-push.md

diff --git a/.changeset/selfish-seas-push.md b/.changeset/selfish-seas-push.md
new file mode 100644
index 0000000000..f3db605843
--- /dev/null
+++ b/.changeset/selfish-seas-push.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-catalog-react': patch
+---
+
+Remove usage of raw span
diff --git a/plugins/catalog-react/src/components/EntityPeekAheadPopover/EntityPeekAheadPopover.tsx b/plugins/catalog-react/src/components/EntityPeekAheadPopover/EntityPeekAheadPopover.tsx
index 05a818fa1f..d6c1e6e59a 100644
--- a/plugins/catalog-react/src/components/EntityPeekAheadPopover/EntityPeekAheadPopover.tsx
+++ b/plugins/catalog-react/src/components/EntityPeekAheadPopover/EntityPeekAheadPopover.tsx
@@ -125,11 +125,15 @@ export const EntityPeekAheadPopover = (props: EntityPeekAheadPopoverProps) => {
 
   return (
     <>
-      <span onMouseEnter={debouncedHandleMouseEnter}>
-        <span data-testid="trigger" {...bindHover(popupState)}>
+      <Typography component="span" onMouseEnter={debouncedHandleMouseEnter}>
+        <Typography
+          component="span"
+          data-testid="trigger"
+          {...bindHover(popupState)}
+        >
           {children}
-        </span>
-      </span>
+        </Typography>
+      </Typography>
       {isHovered && (
         <HoverPopover
           PaperProps={{