Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix createTheme when theme is inverted #16484

Merged
merged 2 commits into from
Jan 14, 2021
Merged

Fix createTheme when theme is inverted #16484

merged 2 commits into from
Jan 14, 2021

Conversation

xugao
Copy link
Contributor

@xugao xugao commented Jan 14, 2021

Pull request checklist

  • Addresses an existing issue: Fixes #0000
  • Include a change request file using $ yarn change

Description of changes

createTheme was not respecting theme.inverted

Focus areas to test

(optional)

@xugao xugao requested a review from dzearing as a code owner January 14, 2021 22:33
@xugao xugao requested review from yiminwu and phkuo January 14, 2021 22:33
@xugao xugao mentioned this pull request Jan 14, 2021
Merged
2 tasks
@codesandbox-ci
Copy link

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 96da22a:

Sandbox Source
Fluent UI Button Configuration
codesandbox-react-template Configuration
codesandbox-react-northstar-template Configuration

@fabricteam
Copy link
Collaborator

Perf Analysis

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 820 812 5000
BaseButtonCompat mount 887 887 5000
Breadcrumb mount 42372 42585 5000
Checkbox mount 1442 1450 5000
CheckboxBase mount 1196 1230 5000
ChoiceGroup mount 4694 4600 5000
ComboBox mount 958 935 1000
CommandBar mount 10103 9993 1000
ContextualMenu mount 6023 6022 1000
DefaultButtonCompat mount 1130 1087 5000
DetailsRow mount 3592 3595 5000
DetailsRowFast mount 3655 3632 5000
DetailsRowNoStyles mount 3443 3381 5000
Dialog mount 1457 1460 1000
DocumentCardTitle mount 1796 1805 1000
Dropdown mount 3291 3258 5000
FocusTrapZone mount 1830 1859 5000
FocusZone mount 1833 1873 5000
IconButtonCompat mount 1690 1736 5000
Label mount 340 340 5000
Layer mount 1734 1720 5000
Link mount 460 452 5000
MakeStyles mount 1927 1937 50000
MenuButtonCompat mount 1448 1438 5000
MessageBar mount 1997 1945 5000
Nav mount 3121 3196 1000
OverflowSet mount 1004 1020 5000
Panel mount 1390 1443 1000
Persona mount 831 844 1000
Pivot mount 1381 1377 1000
PrimaryButtonCompat mount 1274 1276 5000
Rating mount 7289 7423 5000
SearchBox mount 1274 1240 5000
Shimmer mount 2488 2441 5000
Slider mount 1834 1862 5000
SpinButton mount 4861 4946 5000
Spinner mount 413 414 5000
SplitButtonCompat mount 3067 3089 5000
Stack mount 482 495 5000
StackWithIntrinsicChildren mount 1514 1479 5000
StackWithTextChildren mount 4433 4347 5000
SwatchColorPicker mount 9968 10013 5000
Tabs mount 1404 1350 1000
TagPicker mount 2739 2877 5000
TeachingBubble mount 11373 11494 5000
Text mount 403 420 5000
TextField mount 1367 1360 5000
ThemeProvider mount 2115 2155 5000
ThemeProvider virtual-rerender 633 628 5000
Toggle mount 782 786 5000
button mount 646 679 5000
buttonNative mount 100 106 5000

Perf Analysis (Fluent)

Perf comparison
Status Scenario Fluent TPI Fabric TPI Ratio Iterations Ticks
🦄 Avatar.Fluent 0.17 0.5 0.34:1 2000 332
🦄 Button.Fluent 0.11 0.19 0.58:1 5000 555
🔧 Checkbox.Fluent 0.65 0.35 1.86:1 1000 647
🎯 Dialog.Fluent 0.16 0.21 0.76:1 5000 788
🔧 Dropdown.Fluent 2.96 0.39 7.59:1 1000 2960
🔧 Icon.Fluent 0.13 0.06 2.17:1 5000 664
🦄 Image.Fluent 0.08 0.13 0.62:1 5000 392
🔧 Slider.Fluent 1.55 0.43 3.6:1 1000 1551
🔧 Text.Fluent 0.08 0.03 2.67:1 5000 375
🦄 Tooltip.Fluent 0.11 0.87 0.13:1 5000 565

🔧 Needs work     🎯 On target     🦄 Amazing

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
ReactionMinimalPerf.default 425 391 1.09:1
AttachmentMinimalPerf.default 169 156 1.08:1
SegmentMinimalPerf.default 380 356 1.07:1
TableMinimalPerf.default 434 405 1.07:1
TreeWith60ListItems.default 175 163 1.07:1
ListNestedPerf.default 587 555 1.06:1
Text.Fluent 375 354 1.06:1
AvatarMinimalPerf.default 208 198 1.05:1
FormMinimalPerf.default 437 415 1.05:1
GridMinimalPerf.default 367 348 1.05:1
AccordionMinimalPerf.default 163 157 1.04:1
CarouselMinimalPerf.default 459 441 1.04:1
MenuButtonMinimalPerf.default 1604 1549 1.04:1
TextMinimalPerf.default 369 354 1.04:1
AnimationMinimalPerf.default 422 409 1.03:1
BoxMinimalPerf.default 374 363 1.03:1
ChatDuplicateMessagesPerf.default 372 361 1.03:1
HeaderMinimalPerf.default 384 374 1.03:1
InputMinimalPerf.default 1336 1294 1.03:1
LayoutMinimalPerf.default 428 414 1.03:1
AlertMinimalPerf.default 297 292 1.02:1
ButtonSlotsPerf.default 583 570 1.02:1
DialogMinimalPerf.default 787 773 1.02:1
DividerMinimalPerf.default 392 384 1.02:1
DropdownMinimalPerf.default 3022 2967 1.02:1
ImageMinimalPerf.default 395 387 1.02:1
ListWith60ListItems.default 645 633 1.02:1
LoaderMinimalPerf.default 720 709 1.02:1
RadioGroupMinimalPerf.default 452 442 1.02:1
SliderMinimalPerf.default 1564 1526 1.02:1
StatusMinimalPerf.default 743 728 1.02:1
VideoMinimalPerf.default 637 625 1.02:1
Checkbox.Fluent 647 635 1.02:1
Dialog.Fluent 788 773 1.02:1
Tooltip.Fluent 565 552 1.02:1
AttachmentSlotsPerf.default 1193 1178 1.01:1
ButtonOverridesMissPerf.default 1666 1656 1.01:1
ButtonUseCssPerf.default 818 813 1.01:1
ChatMinimalPerf.default 633 629 1.01:1
CheckboxMinimalPerf.default 2857 2822 1.01:1
DropdownManyItemsPerf.default 747 740 1.01:1
FlexMinimalPerf.default 321 317 1.01:1
LabelMinimalPerf.default 436 433 1.01:1
PopupMinimalPerf.default 701 697 1.01:1
SkeletonMinimalPerf.default 376 374 1.01:1
CustomToolbarPrototype.default 3696 3664 1.01:1
ToolbarMinimalPerf.default 947 941 1.01:1
TreeMinimalPerf.default 808 798 1.01:1
Dropdown.Fluent 2960 2943 1.01:1
Image.Fluent 392 387 1.01:1
ButtonUseCssNestingPerf.default 1074 1076 1:1
DatepickerMinimalPerf.default 45651 45853 1:1
HeaderSlotsPerf.default 790 787 1:1
ListMinimalPerf.default 488 487 1:1
MenuMinimalPerf.default 878 878 1:1
ProviderMergeThemesPerf.default 1582 1577 1:1
SplitButtonMinimalPerf.default 3728 3721 1:1
TooltipMinimalPerf.default 819 815 1:1
Avatar.Fluent 332 331 1:1
Icon.Fluent 664 664 1:1
CardMinimalPerf.default 577 581 0.99:1
ItemLayoutMinimalPerf.default 1212 1224 0.99:1
RefMinimalPerf.default 238 240 0.99:1
IconMinimalPerf.default 672 680 0.99:1
TableManyItemsPerf.default 2001 2023 0.99:1
ButtonMinimalPerf.default 179 183 0.98:1
EmbedMinimalPerf.default 4067 4137 0.98:1
ListCommonPerf.default 642 656 0.98:1
ProviderMinimalPerf.default 926 942 0.98:1
ChatWithPopoverPerf.default 418 433 0.97:1
TextAreaMinimalPerf.default 484 500 0.97:1
Button.Fluent 555 571 0.97:1
Slider.Fluent 1551 1596 0.97:1
PortalMinimalPerf.default 158 165 0.96:1
RosterPerf.default 1111 1217 0.91:1

@size-auditor
Copy link

size-auditor bot commented Jan 14, 2021

Asset size changes

Project Bundle Baseline Size New Size Difference
office-ui-fabric-react fluentui-react-ActivityItem 69.03 kB 69.049 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Coachmark 87.889 kB 87.908 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Keytip 75.174 kB 75.193 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-KeytipLayer 95.598 kB 95.617 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Keytips 98.596 kB 98.615 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Label 37.887 kB 37.906 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Layer 45.332 kB 45.351 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Link 37.48 kB 37.499 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-MarqueeSelection 69.862 kB 69.881 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Icons 66.271 kB 66.29 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-MessageBar 177.453 kB 177.472 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Modal 90.278 kB 90.297 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Nav 178.06 kB 178.079 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-ChoiceGroupOption 57.025 kB 57.044 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Overlay 40.241 kB 40.26 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Panel 189.279 kB 189.298 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Image 45.206 kB 45.225 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Icon 50.19 kB 50.209 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-DatePicker 170.91 kB 170.929 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-ExtendedPicker 91.035 kB 91.054 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-DetailsList 211.179 kB 211.198 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Dialog 198.563 kB 198.582 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-CommandBar 189.778 kB 189.797 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-DocumentCard 203.816 kB 203.835 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-ComboBox 234.028 kB 234.047 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Dropdown 220.002 kB 220.021 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Fabric 41.676 kB 41.695 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-HoverCard 91.867 kB 91.886 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Facepile 198.567 kB 198.586 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-FloatingPicker 228.639 kB 228.658 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-ColorPicker 88.248 kB 88.267 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-FocusZone 53.733 kB 53.752 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Grid 170.089 kB 170.108 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-GroupedList 120.724 kB 120.743 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Persona 106.79 kB 106.809 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-PersonaCoin 106.79 kB 106.809 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-PersonaPresence 56.424 kB 56.443 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Text 36.63 kB 36.649 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Spinner 41.14 kB 41.159 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Stack 40.253 kB 40.272 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Sticky 33.067 kB 33.086 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Styling 45.661 kB 45.68 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-SwatchColorPicker 179.602 kB 179.621 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-TeachingBubble 193.486 kB 193.505 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-TextField 77.365 kB 77.384 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Pickers 271.676 kB 271.695 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Theme 48.779 kB 48.798 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Breadcrumb 188.207 kB 188.226 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Toggle 44.472 kB 44.491 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Tooltip 80.124 kB 80.143 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-WeeklyDayPicker 96.942 kB 96.961 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Announced 37.96 kB 37.979 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-SpinButton 180.607 kB 180.626 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Slider 53.268 kB 53.287 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-ShimmeredDetailsList 221.49 kB 221.509 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Shimmer 48.404 kB 48.423 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Pivot 177.963 kB 177.982 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-ChoiceGroup 61.104 kB 61.123 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Checkbox 57.234 kB 57.253 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-PositioningContainer 69.062 kB 69.081 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-ProgressIndicator 38.401 kB 38.42 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Rating 75.865 kB 75.884 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Check 51.511 kB 51.53 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-ScrollablePane 54.731 kB 54.75 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-SearchBox 176.515 kB 176.534 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Callout 79.236 kB 79.255 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-SelectedItemsList 217.895 kB 217.914 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Calendar 115.515 kB 115.534 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-Button 183.507 kB 183.526 kB ExceedsBaseline     19 bytes
office-ui-fabric-react fluentui-react-ContextualMenu 146.595 kB 146.614 kB ExceedsBaseline     19 bytes

ExceedsTolerance Over Tolerance (1024 B) ExceedsBaseline Over Baseline BelowBaseline Below Baseline New New Deleted  Removed 1 kB = 1000 B

Baseline commit: b34c91c65ddf7dcc8bceafae0a0a1715a5ef1e72 (build)

@xugao xugao merged commit 326fa5b into microsoft:master Jan 14, 2021
@msft-fluent-ui-bot
Copy link
Collaborator

🎉@fluentui/theme@v2.0.0-beta.11 has been released which incorporates this pull request.:tada:

Handy links:

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@yiminwu yiminwu yiminwu approved these changes

@dzearing dzearing Awaiting requested review from dzearing dzearing is a code owner

@phkuo phkuo Awaiting requested review from phkuo

Assignees

@layershifter layershifter

Labels
Area: Theming
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
5 participants
@xugao @fabricteam @msft-fluent-ui-bot @yiminwu @layershifter