[tabs] The tablist "active" composite item changes based on the `activateOnFocus` prop

[ciampo]

Bug report

Current behavior

The tab that receives focus when tabbing into the tablist can change depending on the value of the activateOnFocus prop

This can be seen when the selected tab is not the first tab:

• when the tab list has the activateOnFocus prop set to false, the first tab receives focus (even if not selected)
• when the tab list has the activateOnFocus prop set to true, the selected tab received focus

The inconsistency in the behavior could deteriorate the user experience.

Expected behavior

The selected tab should always receive focus. If there's no selected tab, the first tab should receive focus.

Reproducible example

https://codesandbox.io/p/sandbox/mystifying-ben-87xhcr

Change the value of the activateOnFocus prop and observe how a different tab gets focused when tabbing into the tablist.

Base UI version

1.0.0-beta.0

Which browser are you using?

Chrome

Which OS are you using?

Mac OS

Which assistive tech are you using (if applicable)?

N/A

Additional context

I understand this could be an opinionated take, and not a strict bug per se.

[atomiks]

Looks to be fixed by #2093: https://codesandbox.io/p/sandbox/dry-thunder-hkd9nv?file=%2Fsrc%2FApp.tsx%3A5%2C40

[github-actions]

This fix will be available in the next npm release of Base UI.

In the meantime, you can try it out on our Canary release channel:

npm i https://pkg.pr.new/@base-ui-components/react@2093