[Tabs][base] TabList should only process children with role tab

[siriwatknp]

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Summary 💡

I want to leverage the divider in Joy but doing this does not work:

<TabList>
  <Tab>...</Tab>
  <ListDivider role="none" />
  <Tab>...</Tab>
  <ListDivider role="none" />
  <Tab>...</Tab>
</TabList>

Then I found out that TabList process the children and attach some values to them.

Does it make sense to only process the children with role="tab"? It would make it easy for customization and extension.

Or we can flip it the other way around. Ignore the child that has role="none".

Examples 🌈

No response

Motivation 🔦

No response

[michaldudak]

Thanks for the feedback. I think we could make it work similarly to how SelectUnstyled or MenuUnstyled work with their children - not updating them directly but providing a context which they can interpret on their own.

[michaldudak]

This will be fixed by #36400. The method of determining tabs was changed in that PR. The TabList won't traverse its children, but the inner Tabs will register themselves with the TabList. This will allow the TabList to host other types of children components as well.