DM-44392: Prevent opening/closing GafaelfawrUserMenu on hover.

.changeset/many-moles-join.md

@@ -0,0 +1,5 @@
+---
+'@lsst-sqre/squared': minor
+---
+
+Disable opening and closing the GafaelfawrUserMenu on hover. This is a better UX because it allows for less precise mousing when using the menu.

packages/squared/src/components/GafaelfawrUserMenu/GafaelfawrUserMenu.stories.tsx

@@ -73,7 +73,7 @@ export const Default: Story = {
     <SWRConfig value={{ provider: () => new Map() }}>
       <GafaelfawrUserMenu {...args}>
         <GafaelfawrUserMenu.Link href="#">
-          Account Settings
+          Account settings
         </GafaelfawrUserMenu.Link>
         <GafaelfawrUserMenu.Link href="#">
           Security tokens

packages/squared/src/components/GafaelfawrUserMenu/Menu.tsx

@@ -21,17 +21,28 @@ export const Menu = ({ children, logoutHref, username }: MenuProps) => {
     <MenuRoot>
       <MenuList>
         <RadixNavigationMenu.Item>
-          <MenuTrigger>
+          <MenuTrigger
+            onPointerMove={(event) => event.preventDefault()}
+            onPointerEnter={(event) => event.preventDefault()}
+            onPointerLeave={(event) => event.preventDefault()}
+          >
             {username} <ChevronDown />
           </MenuTrigger>
-          <MenuContent>
+          <MenuContent
+            onPointerMove={(event) => event.preventDefault()}
+            onPointerEnter={(event) => event.preventDefault()}
+            onPointerLeave={(event) => event.preventDefault()}
+          >
             {children}
             <MenuLink href={logoutHref}>Log out</MenuLink>
           </MenuContent>
         </RadixNavigationMenu.Item>
       </MenuList>
       <ViewportContainer>
-        <ContentViewport />
+        <ContentViewport
+          onPointerEnter={(event) => event.preventDefault()}
+          onPointerLeave={(event) => event.preventDefault()}
+        />
       </ViewportContainer>
     </MenuRoot>
   );