feat(text): add static classes

[layershifter]

Pull request checklist

• Addresses an existing issue: Related to v9: Each component should have classname? #19937
• Include a change request file using $ yarn change

Description of changes

✅ Extracted from #20383, these changes passed conformance test on that PR

This PR adds static classes to components @fluentui/react-text.

• All classes follow fui-ComponentName
• All classes are publicly exported as componentNameClassName
• Snapshots were updated

Classes that are added to DOM are "chained" if they are composed:

<span class="fui-Title3 fui-Text"></span>

But as we discussed in offline it's not a problem.

[fabricteam]

📊 Bundle size report

Package & Exports	Baseline (minified/GZIP)	PR	Change
react-text Text - Default	11.351 kB 4.424 kB	11.362 kB 4.431 kB	11 B 7 B
react-text Text - Wrappers	14.42 kB 4.729 kB	14.665 kB 4.779 kB	245 B 50 B

Unchanged fixtures

Package & Exports	Size (minified/GZIP)
react-card Card - All	49.008 kB 14.564 kB
react-card Card	44.495 kB 13.343 kB
react-card CardFooter	8.141 kB 3.43 kB
react-card CardHeader	9.461 kB 3.883 kB
react-card CardPreview	8.434 kB 3.604 kB
react-components react-components: Accordion, Button, FluentProvider, Image, Menu, Popover	169.429 kB 48.08 kB
react-components react-components: FluentProvider & webLightTheme	32.201 kB 10.665 kB

_{🤖 This report was generated against 08bd47e97c2a14080793f78ccb57ebfb798c32eb}

[size-auditor]

Asset size changes

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

Baseline commit: 08bd47e97c2a14080793f78ccb57ebfb798c32eb (build)

[fabricteam]

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
Avatar	mount	715	774	5000
BaseButton	mount	777	788	5000
Breadcrumb	mount	2344	2288	1000
ButtonNext	mount	444	450	5000
Checkbox	mount	1291	1339	5000
CheckboxBase	mount	1086	1130	5000
ChoiceGroup	mount	3938	3911	5000
ComboBox	mount	813	810	1000
CommandBar	mount	8642	8586	1000
ContextualMenu	mount	5528	5173	1000
DefaultButton	mount	986	913	5000
DetailsRow	mount	2995	3213	5000
DetailsRowFast	mount	3238	3034	5000
DetailsRowNoStyles	mount	3035	3033	5000
Dialog	mount	2175	2226	1000
DocumentCardTitle	mount	144	132	1000
Dropdown	mount	2781	2557	5000
FluentProviderNext	mount	2836	2903	5000
FluentProviderWithTheme	mount	184	189	10
FluentProviderWithTheme	virtual-rerender	91	88	10
FluentProviderWithTheme	virtual-rerender-with-unmount	206	191	10
FocusTrapZone	mount	1501	1536	5000
FocusZone	mount	1415	1541	5000
IconButton	mount	1358	1483	5000
Label	mount	312	311	5000
Layer	mount	2519	2449	5000
Link	mount	414	410	5000
MakeStyles	mount	1600	1468	50000
MenuButton	mount	1261	1213	5000
MessageBar	mount	1727	1656	5000
Nav	mount	2874	2720	1000
OverflowSet	mount	930	964	5000
Panel	mount	2202	2011	1000
Persona	mount	739	744	1000
Pivot	mount	1246	1335	1000
PrimaryButton	mount	1016	1110	5000
Rating	mount	6331	6511	5000
SearchBox	mount	1152	1154	5000
Shimmer	mount	2172	2177	5000
Slider	mount	1689	1693	5000
SpinButton	mount	4131	4211	5000
Spinner	mount	344	392	5000
SplitButton	mount	2571	2680	5000
Stack	mount	446	454	5000
StackWithIntrinsicChildren	mount	1370	1480	5000
StackWithTextChildren	mount	3826	3901	5000
SwatchColorPicker	mount	8935	9084	5000
TagPicker	mount	2267	2069	5000
TeachingBubble	mount	11159	11053	5000
Text	mount	366	368	5000
TextField	mount	1193	1174	5000
ThemeProvider	mount	997	1035	5000
ThemeProvider	virtual-rerender	527	540	5000
ThemeProvider	virtual-rerender-with-unmount	1627	1563	5000
Toggle	mount	707	715	5000
buttonNative	mount	116	119	5000

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions

Scenario	Current PR Ticks	Baseline Ticks	Ratio
AttachmentMinimalPerf.default	148	119	1.24:1
BoxMinimalPerf.default	308	260	1.18:1
ReactionMinimalPerf.default	324	276	1.17:1
ButtonMinimalPerf.default	158	136	1.16:1
DividerMinimalPerf.default	311	267	1.16:1
LabelMinimalPerf.default	338	295	1.15:1
LoaderMinimalPerf.default	603	526	1.15:1
PortalMinimalPerf.default	160	139	1.15:1
ListWith60ListItems.default	564	494	1.14:1
GridMinimalPerf.default	296	263	1.13:1
TextMinimalPerf.default	303	271	1.12:1
ProviderMergeThemesPerf.default	1473	1344	1.1:1
CardMinimalPerf.default	441	416	1.06:1
TreeWith60ListItems.default	167	158	1.06:1
EmbedMinimalPerf.default	3641	3465	1.05:1
AlertMinimalPerf.default	235	227	1.04:1
DropdownMinimalPerf.default	2730	2619	1.04:1
MenuButtonMinimalPerf.default	1383	1327	1.04:1
ProviderMinimalPerf.default	953	913	1.04:1
CustomToolbarPrototype.default	3528	3406	1.04:1
MenuMinimalPerf.default	722	702	1.03:1
PopupMinimalPerf.default	524	507	1.03:1
StatusMinimalPerf.default	580	561	1.03:1
ButtonOverridesMissPerf.default	1526	1491	1.02:1
ChatMinimalPerf.default	567	557	1.02:1
ChatWithPopoverPerf.default	332	327	1.02:1
DropdownManyItemsPerf.default	590	577	1.02:1
InputMinimalPerf.default	1124	1107	1.02:1
ListCommonPerf.default	541	531	1.02:1
ListNestedPerf.default	470	462	1.02:1
RadioGroupMinimalPerf.default	386	380	1.02:1
SkeletonMinimalPerf.default	305	300	1.02:1
DialogMinimalPerf.default	646	637	1.01:1
HeaderMinimalPerf.default	307	304	1.01:1
SplitButtonMinimalPerf.default	3579	3540	1.01:1
TableMinimalPerf.default	312	308	1.01:1
VideoMinimalPerf.default	558	553	1.01:1
ButtonSlotsPerf.default	462	462	1:1
CarouselMinimalPerf.default	355	354	1:1
DatepickerMinimalPerf.default	4936	4926	1:1
HeaderSlotsPerf.default	644	643	1:1
LayoutMinimalPerf.default	316	317	1:1
TextAreaMinimalPerf.default	426	427	1:1
TreeMinimalPerf.default	618	619	1:1
SegmentMinimalPerf.default	301	304	0.99:1
AttachmentSlotsPerf.default	897	911	0.98:1
RosterPerf.default	1000	1017	0.98:1
RefMinimalPerf.default	210	214	0.98:1
AccordionMinimalPerf.default	124	128	0.97:1
AnimationMinimalPerf.default	310	319	0.97:1
ChatDuplicateMessagesPerf.default	254	263	0.97:1
CheckboxMinimalPerf.default	2229	2299	0.97:1
ImageMinimalPerf.default	294	304	0.97:1
SliderMinimalPerf.default	1382	1423	0.97:1
FlexMinimalPerf.default	237	246	0.96:1
ListMinimalPerf.default	416	432	0.96:1
TableManyItemsPerf.default	1536	1604	0.96:1
TooltipMinimalPerf.default	854	887	0.96:1
ItemLayoutMinimalPerf.default	969	1024	0.95:1
FormMinimalPerf.default	298	321	0.93:1
ToolbarMinimalPerf.default	709	798	0.89:1
AvatarMinimalPerf.default	150	170	0.88:1
IconMinimalPerf.default	473	541	0.87:1

[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 0386831:

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

[tringakrasniqi]

LGTM :)