react-spinner: Use shared tokens

[GeoffCoxMSFT]

Changes

• Updated to use stroke width tokens
• Updated to use typography tokens

Issues

Updates #22231

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit a7ffb05:

Sandbox	Source
@fluentui/react 8 starter	Configuration
@fluentui/react-components 9 starter	Configuration

[fabricteam]

📊 Bundle size report

Package & Exports	Baseline (minified/GZIP)	PR	Change
react-spinner Spinner	17.321 kB 5.88 kB	17.782 kB 5.943 kB	461 B 63 B

Unchanged fixtures

Package & Exports	Size (minified/GZIP)
react-components react-components: Accordion, Button, FluentProvider, Image, Menu, Popover	179.701 kB 50.147 kB
react-components react-components: FluentProvider & webLightTheme	34.066 kB 11.089 kB

_{🤖 This report was generated against d1112b254407f0f0c27119326ec86d2112bc6d70}

[fabricteam]

Perf Analysis (@fluentui/react-components)

No significant results to display.

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
Avatar	mount	933	942	5000
Button	mount	564	554	5000
FluentProvider	mount	1769	1785	5000
FluentProviderWithTheme	mount	266	317	10
FluentProviderWithTheme	virtual-rerender	252	215	10
FluentProviderWithTheme	virtual-rerender-with-unmount	275	305	10
MakeStyles	mount	1561	1494	50000

[size-auditor]

Asset size changes

Size Auditor did not detect a change in bundle size for any component!

Baseline commit: d1112b254407f0f0c27119326ec86d2112bc6d70 (build)

[khmakoto]

Screener is showing a bunch of differences, are they intentional?

[miroslavstastny]

Screener is showing a bunch of differences, are they intentional?

I will let Geoff answer this, but I think the new screenshots are correct. Subtitle 1 and Subtitle 2 which are used with size="medium" and bigger should be semibold but font-weight was not set at all before this PR.

[GeoffCoxMSFT]

Screener is showing a bunch of differences, are they intentional?

I will let Geoff answer this, but I think the new screenshots are correct. Subtitle 1 and Subtitle 2 which are used with size="medium" and bigger should be semibold but font-weight was not set at all before this PR.

Yes -the bolder weights at those sizes are in the spinner figma.