Extended Tokens: Button (V2)

[Mitch-At-Work]

This PR enables a deterministic, script-driven creation of Semantic Tokens.

It intends to provide token interfaces for all variant visual properties within Button, while optimizing CSSVar implementation via a logical fallback system, finalizing in backwards compatible Fluent 2 Fallbacks.

This initial PR is intended to be a preview for Button, and solidify implementation practices for the remaining components.

ToDo:

• Remove core storybook changes (withFluentProvider) before merging
• Remove all non-button code (placeholder/skeleton)
• Optimize button tokens via fallbacks at generic/primitive layer

[Mitch-At-Work]

To opt into semantic style hooks, provide the SEMANTIC_STYLE_HOOKS to your FluentProvider's customStyleHooks_unstable property

[github-actions]

📊 Bundle size report

✅ No changes found

[github-actions]

Pull request demo site: URL

[github-actions]

🕵🏾‍♀️ visual changes to review in the Visual Change Report

vr-tests-react-components/Charts-DonutChart 1 screenshots

Image Name	Diff(in Pixels)	Image Type
vr-tests-react-components/Charts-DonutChart.Dynamic - RTL.default.chromium.png	30793	Changed

vr-tests-react-components/Positioning 2 screenshots

Image Name	Diff(in Pixels)	Image Type
vr-tests-react-components/Positioning.Positioning end.chromium.png	958	Changed
vr-tests-react-components/Positioning.Positioning end.updated 2 times.chromium.png	159	Changed

vr-tests-react-components/TagPicker 2 screenshots

Image Name	Diff(in Pixels)	Image Type
vr-tests-react-components/TagPicker.disabled - Dark Mode.disabled input hover.chromium.png	659	Changed
vr-tests-react-components/TagPicker.disabled - RTL.disabled input hover.chromium.png	635	Changed

vr-tests-web-components/Accordion 1 screenshots

Image Name	Diff(in Pixels)	Image Type
vr-tests-web-components/Accordion. - Dark Mode.normal.chromium_1.png	3151	Changed

vr-tests-web-components/Avatar 1 screenshots

Image Name	Diff(in Pixels)	Image Type
vr-tests-web-components/Avatar. - Dark Mode.normal.chromium.png	10381	Changed

vr-tests-web-components/Badge 1 screenshots

Image Name	Diff(in Pixels)	Image Type
vr-tests-web-components/Badge. - Dark Mode.normal.chromium.png	444	Changed

vr-tests-web-components/MenuList 1 screenshots

Image Name	Diff(in Pixels)	Image Type
vr-tests-web-components/MenuList. - RTL.normal.chromium_1.png	39082	Changed

vr-tests-web-components/RadioGroup 1 screenshots

Image Name	Diff(in Pixels)	Image Type
vr-tests-web-components/RadioGroup. - Dark Mode.normal.chromium_1.png	59	Changed

vr-tests/Callout 2 screenshots

Image Name	Diff(in Pixels)	Image Type
vr-tests/Callout.No beak.default.chromium.png	2177	Changed
vr-tests/Callout.No callout width specified.default.chromium.png	2126	Changed

vr-tests/Coachmark 1 screenshots

Image Name	Diff(in Pixels)	Image Type
vr-tests/Coachmark.Collapsed.default.chromium.png	159	Changed

vr-tests/Keytip 2 screenshots

Image Name	Diff(in Pixels)	Image Type
vr-tests/Keytip.Root.default.chromium.png	51	Changed
vr-tests/Keytip.Offset.default.chromium.png	86	Changed

vr-tests/ScrollablePane 1 screenshots

Image Name	Diff(in Pixels)	Image Type
vr-tests/ScrollablePane.Default ScrollablePane Example.scrolled.chromium.png	8834	Changed

vr-tests/react-charting-GaugeChart 1 screenshots

Image Name	Diff(in Pixels)	Image Type
vr-tests/react-charting-GaugeChart.Basic.default.chromium.png	2	Changed

vr-tests/react-charting-LineChart 1 screenshots

Image Name	Diff(in Pixels)	Image Type
vr-tests/react-charting-LineChart.Events.default.chromium.png	1	Changed

vr-tests/react-charting-MultiStackBarChart 1 screenshots

Image Name	Diff(in Pixels)	Image Type
vr-tests/react-charting-MultiStackBarChart.Basic_PartToWhole - Dark Mode.default.chromium.png	363	Changed

vr-tests/react-charting-VerticalBarChart 1 screenshots

Image Name	Diff(in Pixels)	Image Type
vr-tests/react-charting-VerticalBarChart.Basic - Secondary Y Axis.default.chromium.png	3	Changed

There were 2 duplicate changes discarded. Check the build logs for more information.