[web-components] Fix tab panel display

[claviska]

Submitting this as requested in microsoft/fast#5171.

[chrisdholt]

Thanks @claviska!

[fabricteam]

📊 Bundle size report

_{🤖 This report was generated against f333709cbc6d43708cce7efaae5bc22b46008965}

[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 27502be:

Sandbox	Source
Fluent UI React Starter	Configuration

[size-auditor]

Asset size changes

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

Baseline commit: f333709cbc6d43708cce7efaae5bc22b46008965 (build)

[fabricteam]

Perf Analysis (@fluentui/react)

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
Panel	mount	2309	1393	1000	Possible regression

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
Avatar	mount	951	891	5000
BaseButton	mount	940	961	5000
Breadcrumb	mount	2638	2560	1000
ButtonNext	mount	487	476	5000
Checkbox	mount	1596	1598	5000
CheckboxBase	mount	1326	1354	5000
ChoiceGroup	mount	4999	4894	5000
ComboBox	mount	1000	978	1000
CommandBar	mount	10043	10067	1000
ContextualMenu	mount	6506	6439	1000
DefaultButton	mount	1161	1166	5000
DetailsRow	mount	3846	3829	5000
DetailsRowFast	mount	3880	3843	5000
DetailsRowNoStyles	mount	3607	3601	5000
Dialog	mount	2429	2453	1000
DocumentCardTitle	mount	150	149	1000
Dropdown	mount	3391	3411	5000
FluentProviderNext	mount	6899	6984	5000
FluentProviderWithTheme	mount	344	345	10
FluentProviderWithTheme	virtual-rerender	81	96	10
FluentProviderWithTheme	virtual-rerender-with-unmount	457	452	10
FocusTrapZone	mount	1815	1782	5000
FocusZone	mount	1802	1759	5000
IconButton	mount	1819	1839	5000
Label	mount	348	338	5000
Layer	mount	3087	3088	5000
Link	mount	472	498	5000
MakeStyles	mount	1833	1762	50000
MenuButton	mount	1539	1533	5000
MessageBar	mount	1996	2024	5000
Nav	mount	3395	3390	1000
OverflowSet	mount	1098	1108	5000
Panel	mount	2309	1393	1000	Possible regression
Persona	mount	858	829	1000
Pivot	mount	1430	1419	1000
PrimaryButton	mount	1328	1315	5000
Rating	mount	8196	8133	5000
SearchBox	mount	1397	1427	5000
Shimmer	mount	2589	2670	5000
Slider	mount	1983	1974	5000
SpinButton	mount	5110	5548	5000
Spinner	mount	420	433	5000
SplitButton	mount	3279	3231	5000
Stack	mount	501	527	5000
StackWithIntrinsicChildren	mount	1658	1630	5000
StackWithTextChildren	mount	4863	4856	5000
SwatchColorPicker	mount	10679	10632	5000
Tabs	mount	1440	1432	1000
TagPicker	mount	2662	2707	5000
TeachingBubble	mount	13262	13311	5000
Text	mount	458	432	5000
TextField	mount	1425	1426	5000
ThemeProvider	mount	1223	1204	5000
ThemeProvider	virtual-rerender	588	619	5000
ThemeProvider	virtual-rerender-with-unmount	2000	2007	5000
Toggle	mount	828	847	5000
buttonNative	mount	109	103	5000

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions

Scenario	Current PR Ticks	Baseline Ticks	Ratio
PortalMinimalPerf.default	187	165	1.13:1
BoxMinimalPerf.default	389	354	1.1:1
AttachmentMinimalPerf.default	171	157	1.09:1
ButtonSlotsPerf.default	596	551	1.08:1
SkeletonMinimalPerf.default	391	362	1.08:1
ButtonMinimalPerf.default	198	185	1.07:1
RadioGroupMinimalPerf.default	500	468	1.07:1
AccordionMinimalPerf.default	172	163	1.06:1
GridMinimalPerf.default	368	347	1.06:1
MenuButtonMinimalPerf.default	1794	1691	1.06:1
TextMinimalPerf.default	383	361	1.06:1
AnimationMinimalPerf.default	436	414	1.05:1
InputMinimalPerf.default	1304	1246	1.05:1
IconMinimalPerf.default	655	625	1.05:1
ButtonOverridesMissPerf.default	1782	1719	1.04:1
CardMinimalPerf.default	595	570	1.04:1
ImageMinimalPerf.default	401	385	1.04:1
AlertMinimalPerf.default	296	287	1.03:1
HeaderMinimalPerf.default	376	366	1.03:1
ListWith60ListItems.default	672	650	1.03:1
MenuMinimalPerf.default	875	847	1.03:1
TextAreaMinimalPerf.default	549	532	1.03:1
AvatarMinimalPerf.default	200	197	1.02:1
CarouselMinimalPerf.default	479	471	1.02:1
ItemLayoutMinimalPerf.default	1282	1259	1.02:1
LayoutMinimalPerf.default	382	375	1.02:1
ListMinimalPerf.default	541	531	1.02:1
RefMinimalPerf.default	241	237	1.02:1
SliderMinimalPerf.default	1616	1582	1.02:1
ToolbarMinimalPerf.default	983	968	1.02:1
VideoMinimalPerf.default	652	638	1.02:1
ChatWithPopoverPerf.default	379	377	1.01:1
DividerMinimalPerf.default	371	368	1.01:1
HeaderSlotsPerf.default	809	804	1.01:1
RosterPerf.default	1263	1251	1.01:1
PopupMinimalPerf.default	603	595	1.01:1
ProviderMinimalPerf.default	1043	1036	1.01:1
ReactionMinimalPerf.default	390	386	1.01:1
SplitButtonMinimalPerf.default	4304	4272	1.01:1
StatusMinimalPerf.default	692	687	1.01:1
TableManyItemsPerf.default	2046	2018	1.01:1
CustomToolbarPrototype.default	3929	3891	1.01:1
DropdownMinimalPerf.default	3126	3132	1:1
EmbedMinimalPerf.default	4188	4196	1:1
ListCommonPerf.default	661	661	1:1
ProviderMergeThemesPerf.default	1647	1641	1:1
TooltipMinimalPerf.default	1038	1033	1:1
TreeWith60ListItems.default	176	176	1:1
ChatDuplicateMessagesPerf.default	291	294	0.99:1
DatepickerMinimalPerf.default	5460	5506	0.99:1
DialogMinimalPerf.default	763	773	0.99:1
DropdownManyItemsPerf.default	701	708	0.99:1
LabelMinimalPerf.default	398	401	0.99:1
LoaderMinimalPerf.default	710	714	0.99:1
SegmentMinimalPerf.default	362	366	0.99:1
AttachmentSlotsPerf.default	1089	1112	0.98:1
FlexMinimalPerf.default	277	284	0.98:1
FormMinimalPerf.default	432	439	0.98:1
CheckboxMinimalPerf.default	2796	2876	0.97:1
TableMinimalPerf.default	410	423	0.97:1
ChatMinimalPerf.default	677	707	0.96:1
TreeMinimalPerf.default	797	859	0.93:1
ListNestedPerf.default	563	611	0.92:1

[msft-fluent-ui-bot]

🎉@fluentui/web-components@v1.4.2 has been released which incorporates this pull request.:tada:

Handy links:

• Release Notes
• Official NPM Release