[ResourceList] Fix persistent Action on MouseOut

[dleroux]

WHY are these changes introduced?

Fixes #2727

WHAT is this pull request doing?

1. Ensures the right position of the Actions is correct.
2. Changes focus state on MouseOut

How to 🎩

🖥 Local development instructions
🗒 General tophatting guidelines
📄 Changelog guidelines

Copy-paste this code in playground/Playground.tsx:

import React from 'react';
import {Page} from '../src';

export function Playground() {
  return (
    <Page title="Playground">
      {/* Add the code you want to test in here */}
    </Page>
  );
}

🎩 checklist

• Tested on mobile
• Tested on multiple browsers
• Tested for accessibility
• Updated the component's README.md with documentation changes
• Tophatted documentation changes in the style guide
• For visual design changes, pinged one of @ HYPD, @ mirualves, @ sarahill, or @ ry5n to update the Polaris UI kit

[github-actions]

🟢 This pull request modifies 4 files and might impact 2 other files.

Details:

All files potentially affected (total: 2)

• /src/components/ResourceItem/ResourceItem.tsx
• /src/components/ResourceList/ResourceList.tsx

📄 UNRELEASED.md (total: 0)

Files potentially affected (total: 0)

🎨 src/components/ResourceItem/ResourceItem.scss (total: 2)

Files potentially affected (total: 2)

• /src/components/ResourceItem/ResourceItem.tsx
• /src/components/ResourceList/ResourceList.tsx

🧩 src/components/ResourceItem/ResourceItem.tsx (total: 1)

Files potentially affected (total: 1)

• /src/components/ResourceList/ResourceList.tsx

🧩 src/components/ResourceItem/tests/ResourceItem.test.tsx (total: 0)

Files potentially affected (total: 0)

[AndrewMusgrave]

LGTM will come back later today for a tophat

[AndrewMusgrave]

cc/ @chloerice

[loic-d]

Nit but you could add each class name into an array and .join(' ') for better readability.

[dleroux]

actually didn't need these in const.

[loic-d]

Code and 🎩 👍

Noticed two little weird behaviours that I can repro on master:

[dleroux]

The first is expected. In a regular resource list clicking the element would navigate the user to that resource.

The second I can't reproduce. Maybe create a separate issue with steps since it's already on master.

[dleroux]

actually didn't need these in const.