Skip to content

(chore) Move react-accordion, react-divider to react-components subfolder #22827

Merged
TristanWatanabe merged 14 commits into
microsoft:masterfrom
TristanWatanabe:move-cxe-coastal-pkgs-batch-2
May 18, 2022
Merged

(chore) Move react-accordion, react-divider to react-components subfolder #22827
TristanWatanabe merged 14 commits into
microsoft:masterfrom
TristanWatanabe:move-cxe-coastal-pkgs-batch-2

Conversation

@TristanWatanabe

@TristanWatanabe TristanWatanabe commented May 4, 2022

Copy link
Copy Markdown
Member

Changes

  • Moves @fluentui/react-accordion, and @fluentui/react-divider to react-components common folder using move-packages nx generator.

Related Issue(s)

Part of #22427

@codesandbox-ci

codesandbox-ci Bot commented May 4, 2022

Copy link
Copy Markdown

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 e6eb958:

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

@size-auditor

size-auditor Bot commented May 4, 2022

Copy link
Copy Markdown

Asset size changes

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

Baseline commit: 8ab3a2ac23ee12d9b5fbd72d3b4593fb3691209b (build)

@fabricteam

fabricteam commented May 4, 2022

Copy link
Copy Markdown
Collaborator

Perf Analysis (@fluentui/react-components)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 1025 1101 5000
Button mount 656 654 5000
FluentProvider mount 2195 2187 5000
FluentProviderWithTheme mount 343 318 10
FluentProviderWithTheme virtual-rerender 298 286 10
FluentProviderWithTheme virtual-rerender-with-unmount 395 399 10
MakeStyles mount 1818 1814 50000

@fabricteam

fabricteam commented May 4, 2022

Copy link
Copy Markdown
Collaborator

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-accordion
Accordion (including children components)
73.834 kB
22.534 kB
73.834 kB
22.533 kB

-1 B
Unchanged fixtures
Package & Exports Size (minified/GZIP)
priority-overflow
createOverflowManager
2.936 kB
1.212 kB
react-avatar
Avatar
45.51 kB
13.25 kB
react-badge
Badge
21.1 kB
6.671 kB
react-badge
CounterBadge
22.015 kB
6.976 kB
react-badge
PresenceBadge
22.346 kB
6.715 kB
react-button
Button
32.591 kB
9.056 kB
react-button
CompoundButton
38.836 kB
10.221 kB
react-button
MenuButton
34.381 kB
9.645 kB
react-button
SplitButton
41.662 kB
10.95 kB
react-button
ToggleButton
43.518 kB
9.984 kB
react-card
Card - All
59.102 kB
16.957 kB
react-card
Card
54.387 kB
15.706 kB
react-card
CardFooter
7.891 kB
3.363 kB
react-card
CardHeader
9.463 kB
3.881 kB
react-card
CardPreview
7.863 kB
3.391 kB
react-combobox
Combobox
60.892 kB
20.814 kB
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
179.74 kB
50.168 kB
react-components
react-components: FluentProvider & webLightTheme
34.178 kB
11.138 kB
react-divider
Divider
15.65 kB
5.636 kB
react-image
Image
10.314 kB
4.06 kB
react-input
Input
22.274 kB
7.336 kB
react-label
Label
8.644 kB
3.614 kB
react-link
Link
11.52 kB
4.69 kB
react-menu
Menu (including children components)
110.335 kB
33.584 kB
react-menu
Menu (including selectable components)
113.51 kB
34.053 kB
react-overflow
hooks only
10.792 kB
4.124 kB
react-popover
Popover
101.258 kB
30.847 kB
react-portal
Portal
6.272 kB
2.17 kB
react-positioning
usePopper
23.21 kB
8.084 kB
react-provider
FluentProvider
14.227 kB
5.336 kB
react-radio
Radio
29.568 kB
10.122 kB
react-radio
RadioGroup
13.751 kB
5.515 kB
react-select
Select
17.176 kB
6.408 kB
react-slider
Slider
25.657 kB
8.302 kB
react-spinbutton
SpinButton
41.985 kB
11.908 kB
react-spinner
Spinner
17.895 kB
5.988 kB
react-switch
Switch
25.539 kB
8.286 kB
react-text
Text - Default
11.002 kB
4.336 kB
react-text
Text - Wrappers
14.324 kB
4.749 kB
react-textarea
Textarea
21.318 kB
7.211 kB
react-theme
Single theme token import
69 B
89 B
react-theme
Teams: all themes
31.363 kB
7.043 kB
react-theme
Teams: Light theme
19.806 kB
5.699 kB
react-tooltip
Tooltip
43.039 kB
14.819 kB
react-utilities
SSRProvider
189 B
161 B
🤖 This report was generated against 8ab3a2ac23ee12d9b5fbd72d3b4593fb3691209b

@fabricteam

fabricteam commented May 4, 2022

Copy link
Copy Markdown
Collaborator

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
AccordionMinimalPerf.default 169 154 1.1:1
RefMinimalPerf.default 254 234 1.09:1
SegmentMinimalPerf.default 399 370 1.08:1
ListWith60ListItems.default 747 699 1.07:1
CardMinimalPerf.default 657 622 1.06:1
LayoutMinimalPerf.default 417 395 1.06:1
ReactionMinimalPerf.default 428 405 1.06:1
AttachmentMinimalPerf.default 175 166 1.05:1
GridMinimalPerf.default 381 362 1.05:1
MenuMinimalPerf.default 967 917 1.05:1
TextAreaMinimalPerf.default 599 572 1.05:1
CarouselMinimalPerf.default 532 510 1.04:1
PortalMinimalPerf.default 173 167 1.04:1
TextMinimalPerf.default 384 368 1.04:1
ToolbarMinimalPerf.default 1107 1067 1.04:1
DropdownManyItemsPerf.default 786 760 1.03:1
HeaderMinimalPerf.default 407 397 1.03:1
LabelMinimalPerf.default 432 420 1.03:1
ListMinimalPerf.default 582 566 1.03:1
IconMinimalPerf.default 718 696 1.03:1
BoxMinimalPerf.default 368 362 1.02:1
ButtonSlotsPerf.default 614 601 1.02:1
DividerMinimalPerf.default 386 378 1.02:1
ImageMinimalPerf.default 423 415 1.02:1
InputMinimalPerf.default 1409 1378 1.02:1
ItemLayoutMinimalPerf.default 1349 1329 1.02:1
ListCommonPerf.default 725 713 1.02:1
ListNestedPerf.default 630 616 1.02:1
MenuButtonMinimalPerf.default 1900 1861 1.02:1
PopupMinimalPerf.default 670 659 1.02:1
ProviderMinimalPerf.default 410 403 1.02:1
SkeletonMinimalPerf.default 382 376 1.02:1
CustomToolbarPrototype.default 2916 2862 1.02:1
DropdownMinimalPerf.default 3257 3231 1.01:1
EmbedMinimalPerf.default 4539 4481 1.01:1
TableManyItemsPerf.default 2183 2170 1.01:1
TooltipMinimalPerf.default 1314 1301 1.01:1
AlertMinimalPerf.default 296 296 1:1
AvatarMinimalPerf.default 205 206 1:1
ChatDuplicateMessagesPerf.default 320 321 1:1
ChatMinimalPerf.default 819 817 1:1
CheckboxMinimalPerf.default 2924 2925 1:1
DatepickerMinimalPerf.default 6185 6168 1:1
FlexMinimalPerf.default 304 303 1:1
RosterPerf.default 1248 1249 1:1
RadioGroupMinimalPerf.default 504 503 1:1
SliderMinimalPerf.default 1852 1846 1:1
StatusMinimalPerf.default 747 750 1:1
TreeMinimalPerf.default 903 904 1:1
ButtonMinimalPerf.default 184 185 0.99:1
ButtonOverridesMissPerf.default 1649 1659 0.99:1
ChatWithPopoverPerf.default 422 427 0.99:1
SplitButtonMinimalPerf.default 4841 4893 0.99:1
TreeWith60ListItems.default 189 191 0.99:1
DialogMinimalPerf.default 822 836 0.98:1
HeaderSlotsPerf.default 856 874 0.98:1
LoaderMinimalPerf.default 738 751 0.98:1
ProviderMergeThemesPerf.default 1293 1325 0.98:1
VideoMinimalPerf.default 732 750 0.98:1
AnimationMinimalPerf.default 583 602 0.97:1
AttachmentSlotsPerf.default 1185 1226 0.97:1
FormMinimalPerf.default 465 483 0.96:1
TableMinimalPerf.default 429 463 0.93:1

@fabricteam

fabricteam commented May 4, 2022

Copy link
Copy Markdown
Collaborator

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
BaseButton mount 945 949 5000
Breadcrumb mount 2796 2806 1000
Checkbox mount 1542 1536 5000
CheckboxBase mount 1328 1347 5000
ChoiceGroup mount 4878 5016 5000
ComboBox mount 1006 1044 1000
CommandBar mount 10894 10893 1000
ContextualMenu mount 11849 11962 1000
DefaultButton mount 1162 1170 5000
DetailsRow mount 3934 4012 5000
DetailsRowFast mount 4076 4020 5000
DetailsRowNoStyles mount 3854 3758 5000
Dialog mount 2345 2272 1000
DocumentCardTitle mount 175 181 1000
Dropdown mount 3422 3364 5000
FocusTrapZone mount 1951 1973 5000
FocusZone mount 1918 1829 5000
IconButton mount 1841 1843 5000
Label mount 367 365 5000
Layer mount 3040 3116 5000
Link mount 496 489 5000
MenuButton mount 1535 1543 5000
MessageBar mount 2249 2169 5000
Nav mount 3444 3468 1000
OverflowSet mount 1120 1109 5000
Panel mount 2282 2382 1000
Persona mount 1041 1043 1000
Pivot mount 1491 1499 1000
PrimaryButton mount 1288 1342 5000
Rating mount 7975 7867 5000
SearchBox mount 1383 1401 5000
Shimmer mount 2539 2542 5000
Slider mount 1995 2004 5000
SpinButton mount 5234 5241 5000
Spinner mount 484 434 5000
SplitButton mount 3334 3306 5000
Stack mount 548 554 5000
StackWithIntrinsicChildren mount 2325 2339 5000
StackWithTextChildren mount 5417 5467 5000
SwatchColorPicker mount 11995 11932 5000
TagPicker mount 2787 2813 5000
TeachingBubble mount 97213 96752 5000
Text mount 446 449 5000
TextField mount 1489 1509 5000
ThemeProvider mount 1263 1234 5000
ThemeProvider virtual-rerender 648 669 5000
ThemeProvider virtual-rerender-with-unmount 1996 2018 5000
Toggle mount 813 816 5000
buttonNative mount 124 124 5000


const first = actual[0];
expect(first.startsWith('../../../react-')).toBeTruthy();
expect(first.startsWith('../../react-')).toBeTruthy();

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This test always results in first being react-accordion therefore the expected path needs to be updated to account for accordion being moved in this PR.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

shame on me :D not the most robust test indeed but there were not many options. ty

@TristanWatanabe TristanWatanabe marked this pull request as ready for review May 4, 2022 16:00
@TristanWatanabe TristanWatanabe changed the title (chore) Move react-accordion, react-badge, react-divider to react-components subfolder (chore) Move react-accordion, react-divider to react-components subfolder May 6, 2022
@TristanWatanabe

Copy link
Copy Markdown
Member Author

Pulling react-badge out from this move because of various active PRs involving it

@TristanWatanabe TristanWatanabe merged commit db18142 into microsoft:master May 18, 2022
@TristanWatanabe TristanWatanabe deleted the move-cxe-coastal-pkgs-batch-2 branch May 18, 2022 14:51
marwan38 pushed a commit to marwan38/fluentui that referenced this pull request Jun 13, 2022
…lder (microsoft#22827)

* move react-divider

* move react-accordion

* move react-badge

* Change Files

* update test to account for react-accordion move

* Change File

* Revert "move react-badge"

This reverts commit ad55b96.

* remove badge changfile

* Revert "move react-divider"

This reverts commit cf8a10b.

* Revert "move react-accordion"

This reverts commit 2259ee3.

* move react-accordion

* move react-divider
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

7 participants