Stack: Adding basis prop to mimick flexBasis CSS property

[khmakoto]

Pull request checklist

• Addresses an existing issue: Fixes StackItem does not accept a flexBasis prop #12694
• Include a change request file using $ yarn change

Description of changes

This PR adds a basis prop to the Stack component to allow for functionality based on the flexBasis CSS property.

[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 056da90:

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

[size-auditor]

Asset size changes

Project	Bundle	Baseline Size	New Size	Difference
office-ui-fabric-react	fluentui-react-Stack	39.165 kB	39.209 kB	44 bytes
office-ui-fabric-react	fluentui-react-TeachingBubble	191.939 kB	191.983 kB	44 bytes

 Over Tolerance (1024 B)  Over Baseline  Below Baseline  New   Removed 1 kB = 1000 B

Baseline commit: 956f5731d132a960d313f3a9e794ce4e1c990e68 (build)

[fabricteam]

📊 Bundle size report

_{🤖 This report was generated against 956f5731d132a960d313f3a9e794ce4e1c990e68}

[fabricteam]

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
BaseButton	mount	1088	1040	5000
Breadcrumb	mount	2820	2849	1000
Checkbox	mount	1690	1686	5000
CheckboxBase	mount	1453	1476	5000
ChoiceGroup	mount	5324	5238	5000
ComboBox	mount	1056	1085	1000
CommandBar	mount	10864	10854	1000
ContextualMenu	mount	11997	11953	1000
DefaultButton	mount	1321	1275	5000
DetailsRow	mount	4152	4247	5000
DetailsRowFast	mount	4219	4184	5000
DetailsRowNoStyles	mount	3978	3955	5000
Dialog	mount	2370	2368	1000
DocumentCardTitle	mount	181	175	1000
Dropdown	mount	3682	3734	5000
FocusTrapZone	mount	1947	1914	5000
FocusZone	mount	1921	1956	5000
IconButton	mount	1962	1995	5000
Label	mount	362	378	5000
Layer	mount	3284	3262	5000
Link	mount	525	549	5000
MenuButton	mount	1729	1693	5000
MessageBar	mount	2326	2253	5000
Nav	mount	3653	3631	1000
OverflowSet	mount	1213	1210	5000
Panel	mount	2277	2288	1000
Persona	mount	958	920	1000
Pivot	mount	1562	1600	1000
PrimaryButton	mount	1503	1449	5000
Rating	mount	8729	8723	5000
SearchBox	mount	1522	1499	5000
Shimmer	mount	2778	2817	5000
Slider	mount	2107	2154	5000
SpinButton	mount	5477	5499	5000
Spinner	mount	474	451	5000
SplitButton	mount	3504	3474	5000
Stack	mount	597	586	5000
StackWithIntrinsicChildren	mount	2798	2685	5000
StackWithTextChildren	mount	6207	6106	5000
SwatchColorPicker	mount	12814	12766	5000
TagPicker	mount	3011	3017	5000
TeachingBubble	mount	99696	101027	5000
Text	mount	476	508	5000
TextField	mount	1581	1575	5000
ThemeProvider	mount	1247	1248	5000
ThemeProvider	virtual-rerender	688	700	5000
ThemeProvider	virtual-rerender-with-unmount	2128	2096	5000
Toggle	mount	893	888	5000
buttonNative	mount	146	149	5000

[msft-fluent-ui-bot]

Because this pull request has not had activity for over 150 days, we're automatically closing it for house-keeping purposes.

The pull request will still be available for reference. If it's still relevant to merge at some point, you can reopen or make a new version based on the latest code.

[spmonahan]

If I'm reading the flexBasis types correctly 0 is a valid value for basis which means we cannot set the basis value to 0 (the default is auto).

[khmakoto]

@spmonahan you're completely right, I've updated the PR.