[menu-bar] Tabindex is reset when focused button no longer fits

[web-padawan]

Description

When a button that has tabindex="0" is moved to the "overflow" menu, all the remaining buttons have tabindex="-1". As a result, it's no longer possible to focus the menu-bar using Tab or Shift + Tab, see the recording:

https://user-images.githubusercontent.com/10589913/194274917-cb6c8ed6-5137-4d7e-862e-11771748b6cd.mp4

Expected outcome

I would expect tabindex="0" in this case to be set on the overflow button, which is always visible.

Minimal reproducible example

<vaadin-split-layout style="width: 500px">
  <vaadin-menu-bar></vaadin-menu-bar>
  <div>
    <input placeholder="Input" />
  </div>
</vaadin-split-layout>

<script type="module">
  import '@vaadin/menu-bar';
  import '@vaadin/split-layout';

  const menuBar = document.querySelector('vaadin-menu-bar');
  menuBar.items = [
    { text: 'View' },
    { text: 'Edit' },
    { text: 'Share', },
    {
      text: 'Move',
      children: [{ text: 'To folder' }, { text: 'To trash' }],
    },
    { text: 'Duplicate' }
  ];
</script>

Steps to reproduce

1. Click the "Move" button to open submenu
2. Press Escape to focus the button
3. Focus the input in the right part of the layout
4. Move the splitter to decrease menu-bar witdh
5. Try to focus menu-bar with Shift + Tab

Environment

Vaadin version(s): 14, 22, 23

Browsers

Issue is not browser related