[Material][TabBar][Breaking Change Request] Rename Material TabBar styles to match Material Design 3 specs

[kazo0]

Material Toolkit currently defines many different TabBar styles:

Control	Style Key
utu:TabBar	BottomTabBarStyle
utu:TabBar	TopTabBarStyle
utu:TabBar	ColoredTopTabBarStyle
utu:TabBar	VerticalTabBarStyle
utu:TabBarItem	BottomFabTabBarItemStyle
utu:TabBarItem	BottomTabBarItemStyle
utu:TabBarItem	VerticalTabBarItemStyle

In Material Design 3, our "top" tabs are now what is referred to as "Secondary" tabs and our Vertical and Bottom tab bar is what is now called Primary

We should re-structure our TabBar styles to simply have a PrimaryTabBarStyle and SecondaryTabBarStyle

As can be seen in the Material specs:

[NVLudwig]

@kazo0 Aren't these neither Primary nor Secondary in Material 3 spec but rather related to these NavigationBars?

So could we have Something like TabBar -----Style -------Navigation ----------Vertical ----------VerticalFAB ----------Horizontal ----------HorizontalFAB -------Primary -------Secondary

      Also our Primary and Secondary Tab styling is not M3 compliant at the moment, let me know if you think we could close both issues at the same time.

[kazo0]

Ah yes I forgot that our "Bottom" TabBar is technically the Material Design "NavigationBar"

In that case we should just have

Control	Style Key
TabBar	PrimaryTabBarStyle
TabBar	SecondaryTabBarStyle
TabBar	NavigationTabBarStyle

And TabBar itself has a property on it to drive Orientation, so it shouldn't be dictated by a specific style

[kazo0]

Looking at the Tabs guidelines, there isn't much difference between Primary and Secondary except for the selection indicator size. So both should be using a similar TabBarItemStyle.

In fact, we shouldn't be exposing the Item styles publicly, the 3 main TabBar Styles have specific Item styles that they use and that's that. If you want to create your own ItemContainerStyle you can but we shouldn't be mixing them with each other

[kazo0]

Coming back to this

• The default style for TabBar in Material Toolkit should be TabBarStyle which looks like the M3 Primary Tabs
• There would be a SecondaryTabBarStyle that bases itself on TabBarStyle but simply toggles a few properties to change the appearance of the active indicator and Icon placement/visiblity. It should not re-define the template coming from TabBarStyle. This should allow for the appearance of the M3 Secondary Tabs
• There will be a NavigationTabBarStyle that matches the style of the M3 NavigationBar. The NavigationTabBarStyle's template should handle the Orientation property of the TabBar to be able to be displayed vertically and look like the M3 NavigationRail
• We should introduce an IconPlacement property on the TabBarItem, with values of Stacked or Inline, maybe? To define whether or not the Icon will be placed above the Content or beside it

For TabBar we would have

Control	Style Key
TabBar	TabBarStyle
TabBar	SecondaryTabBarStyle
TabBar	NavigationTabBarStyle

For TabBarItem we would have

Control	Style Key
TabBarItem	TabBarItemStyle
TabBarItem	SecondaryTabBarItemStyle
TabBarItem	NavigationTabBarItemStyle

Where SecondaryTabBarItemStyle simply inherits from the TabBarItemStyle and does not re-template the TabBarItem but has a few properties changed, such as IconPlacement.Inline