Skip to content

refact: remove mergeProps from react-checkbox#19918

Merged
chpalac merged 12 commits intomicrosoft:masterfrom
chpalac:refact/react-checkbox-mergeprops
Sep 24, 2021
Merged

refact: remove mergeProps from react-checkbox#19918
chpalac merged 12 commits intomicrosoft:masterfrom
chpalac:refact/react-checkbox-mergeprops

Conversation

@chpalac
Copy link
Contributor

@chpalac chpalac commented Sep 22, 2021

Pull request checklist

Description of changes

Use simple prop merging as described in #19678

@fabricteam
Copy link
Collaborator

fabricteam commented Sep 22, 2021

📊 Bundle size report

🤖 This report was generated against 2679874bfb06a6d4edc8ddf33c46a1fd8e075d18

@size-auditor
Copy link

size-auditor bot commented Sep 22, 2021

Asset size changes

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

Baseline commit: 2679874bfb06a6d4edc8ddf33c46a1fd8e075d18 (build)

@fabricteam
Copy link
Collaborator

fabricteam commented Sep 22, 2021

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 978 975 5000
BaseButton mount 954 995 5000
Breadcrumb mount 2636 2599 1000
ButtonNext mount 517 491 5000
Checkbox mount 1795 1708 5000
CheckboxBase mount 1446 1453 5000
ChoiceGroup mount 5034 5222 5000
ComboBox mount 1028 1011 1000
CommandBar mount 10501 10482 1000
ContextualMenu mount 6844 6821 1000
DefaultButton mount 1245 1231 5000
DetailsRow mount 4051 4181 5000
DetailsRowFast mount 4039 3982 5000
DetailsRowNoStyles mount 3763 3747 5000
Dialog mount 2555 2583 1000
DocumentCardTitle mount 156 166 1000
Dropdown mount 3495 3514 5000
FluentProviderNext mount 7477 7429 5000
FluentProviderWithTheme mount 360 366 10
FluentProviderWithTheme virtual-rerender 104 96 10
FluentProviderWithTheme virtual-rerender-with-unmount 502 497 10
FocusTrapZone mount 1904 1815 5000
FocusZone mount 1890 1839 5000
IconButton mount 1966 1961 5000
Label mount 365 367 5000
Layer mount 3199 3217 5000
Link mount 505 506 5000
MakeStyles mount 1839 1818 50000
MenuButton mount 1631 1597 5000
MessageBar mount 2077 2103 5000
Nav mount 3539 3567 1000
OverflowSet mount 1146 1126 5000
Panel mount 1411 2443 1000
Persona mount 868 880 1000
Pivot mount 1520 1502 1000
PrimaryButton mount 1360 1406 5000
Rating mount 8409 8317 5000
SearchBox mount 1439 1475 5000
Shimmer mount 2870 2843 5000
Slider mount 2131 2118 5000
SpinButton mount 5524 5458 5000
Spinner mount 438 442 5000
SplitButton mount 3411 3457 5000
Stack mount 548 566 5000
StackWithIntrinsicChildren mount 1840 1870 5000
StackWithTextChildren mount 5198 5240 5000
SwatchColorPicker mount 11459 11407 5000
Tabs mount 1550 1541 1000
TagPicker mount 2919 2918 5000
TeachingBubble mount 13957 13841 5000
Text mount 462 463 5000
TextField mount 1550 1557 5000
ThemeProvider mount 1265 1248 5000
ThemeProvider virtual-rerender 635 633 5000
ThemeProvider virtual-rerender-with-unmount 2105 2118 5000
Toggle mount 889 887 5000
buttonNative mount 129 122 5000

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
RefMinimalPerf.default 254 233 1.09:1
TreeWith60ListItems.default 215 197 1.09:1
PortalMinimalPerf.default 196 181 1.08:1
ChatWithPopoverPerf.default 435 406 1.07:1
SegmentMinimalPerf.default 404 376 1.07:1
GridMinimalPerf.default 383 360 1.06:1
LabelMinimalPerf.default 438 412 1.06:1
AttachmentSlotsPerf.default 1207 1147 1.05:1
FlexMinimalPerf.default 320 306 1.05:1
HeaderMinimalPerf.default 394 375 1.05:1
AnimationMinimalPerf.default 470 451 1.04:1
ChatDuplicateMessagesPerf.default 336 324 1.04:1
ChatMinimalPerf.default 736 706 1.04:1
DividerMinimalPerf.default 405 389 1.04:1
ListMinimalPerf.default 549 527 1.04:1
ListNestedPerf.default 588 565 1.04:1
RadioGroupMinimalPerf.default 511 490 1.04:1
ReactionMinimalPerf.default 425 408 1.04:1
TableMinimalPerf.default 440 422 1.04:1
TextAreaMinimalPerf.default 570 548 1.04:1
AlertMinimalPerf.default 304 295 1.03:1
CardMinimalPerf.default 635 619 1.03:1
CarouselMinimalPerf.default 516 501 1.03:1
DialogMinimalPerf.default 826 804 1.03:1
FormMinimalPerf.default 462 450 1.03:1
LoaderMinimalPerf.default 740 716 1.03:1
StatusMinimalPerf.default 725 705 1.03:1
BoxMinimalPerf.default 396 389 1.02:1
ButtonOverridesMissPerf.default 1927 1894 1.02:1
InputMinimalPerf.default 1383 1353 1.02:1
MenuMinimalPerf.default 912 893 1.02:1
TooltipMinimalPerf.default 1119 1096 1.02:1
TreeMinimalPerf.default 881 862 1.02:1
AttachmentMinimalPerf.default 185 183 1.01:1
ButtonSlotsPerf.default 614 609 1.01:1
DatepickerMinimalPerf.default 5852 5786 1.01:1
DropdownManyItemsPerf.default 772 767 1.01:1
LayoutMinimalPerf.default 392 388 1.01:1
ListCommonPerf.default 703 695 1.01:1
MenuButtonMinimalPerf.default 1745 1736 1.01:1
SkeletonMinimalPerf.default 379 375 1.01:1
SliderMinimalPerf.default 1727 1704 1.01:1
TableManyItemsPerf.default 2035 2006 1.01:1
ToolbarMinimalPerf.default 1017 1005 1.01:1
AvatarMinimalPerf.default 210 209 1:1
CheckboxMinimalPerf.default 2963 2952 1:1
DropdownMinimalPerf.default 3339 3337 1:1
EmbedMinimalPerf.default 4543 4557 1:1
ImageMinimalPerf.default 420 422 1:1
ListWith60ListItems.default 679 677 1:1
ProviderMergeThemesPerf.default 1796 1788 1:1
ProviderMinimalPerf.default 1196 1192 1:1
SplitButtonMinimalPerf.default 4590 4609 1:1
AccordionMinimalPerf.default 167 169 0.99:1
ItemLayoutMinimalPerf.default 1309 1322 0.99:1
PopupMinimalPerf.default 616 624 0.99:1
IconMinimalPerf.default 669 675 0.99:1
TextMinimalPerf.default 383 385 0.99:1
CustomToolbarPrototype.default 4188 4212 0.99:1
VideoMinimalPerf.default 678 687 0.99:1
RosterPerf.default 1319 1352 0.98:1
ButtonMinimalPerf.default 186 191 0.97:1
HeaderSlotsPerf.default 817 842 0.97:1

Copy link
Contributor

@bsunderhus bsunderhus left a comment

Choose a reason for hiding this comment

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

LGTM only change required is the one in renderCheckbox, you're using the slot element, should probably just keep it as a div for now

@codesandbox-ci
Copy link

codesandbox-ci bot commented Sep 23, 2021

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 43779c2:

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

@bsunderhus bsunderhus force-pushed the refact/react-checkbox-mergeprops branch from 20956a0 to 250871a Compare September 23, 2021 10:27
…d30e2e.json

Co-authored-by: Oleksandr Fediashov <alexander.mcgarret@gmail.com>
Copy link
Member

@khmakoto khmakoto left a comment

Choose a reason for hiding this comment

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

Approved with minor suggestions

chpalac and others added 2 commits September 24, 2021 02:58
Co-authored-by: Makoto Morimoto <Humberto.Morimoto@microsoft.com>
Co-authored-by: Makoto Morimoto <Humberto.Morimoto@microsoft.com>
@chpalac chpalac enabled auto-merge (squash) September 24, 2021 05:59
@chpalac chpalac merged commit 56666da into microsoft:master Sep 24, 2021
@chpalac chpalac deleted the refact/react-checkbox-mergeprops branch September 24, 2021 07:36
mlp73 pushed a commit to mlp73/fluentui that referenced this pull request Jan 17, 2022
* refact: remove mergeprops from react-checkbox

* Change files

* test prop change

* test prop change

* fix type for defaultchecked

* api update

* Updates checkbox types and hook implementation

* Updates API

* Adds skiAsPropsTests

* Update change/@fluentui-react-checkbox-f702f678-e790-45fc-88a7-06ff6ed30e2e.json

Co-authored-by: Oleksandr Fediashov <alexander.mcgarret@gmail.com>

* Update packages/react-checkbox/src/components/Checkbox/Checkbox.types.ts

Co-authored-by: Makoto Morimoto <Humberto.Morimoto@microsoft.com>

* Update packages/react-checkbox/src/components/Checkbox/useCheckbox.tsx

Co-authored-by: Makoto Morimoto <Humberto.Morimoto@microsoft.com>

Co-authored-by: Bernardo Sunderhus <bsunderhus@microsoft.com>
Co-authored-by: Oleksandr Fediashov <alexander.mcgarret@gmail.com>
Co-authored-by: Makoto Morimoto <Humberto.Morimoto@microsoft.com>
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.

@fluentui/react-checkbox: use simplified prop merging

7 participants