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

chore(StyleTypes): add Skeleton styles to types #14522

Merged
merged 1 commit into from
Aug 14, 2020
Merged

chore(StyleTypes): add Skeleton styles to types #14522

merged 1 commit into from
Aug 14, 2020

Conversation

assuncaocharles
Copy link
Contributor

Pull request checklist

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

Description of changes

Add Skeleton and its' variants to style types

Focus areas to test

(optional)

@msft-github-bot msft-github-bot added the Fluent UI react-northstar (v0) Work related to Fluent UI V0 label Aug 14, 2020
@DustyTheBot
Copy link

Warnings
⚠️ There are no updates provided to CHANGELOG. Ensure there are no publicly visible changes introduced by this PR.

Generated by 🚫 dangerJS against e5ab133

@size-auditor
Copy link

size-auditor bot commented Aug 14, 2020

Asset size changes

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

Baseline commit: 79d99c0b79518ff201cd070e7aa597d5ba8d1864 (build)

@msft-github-bot
Copy link
Contributor

Perf Analysis

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
BaseButton mount 933 898 5000
ButtonNext mount 595 602 5000
Checkbox mount 1603 1592 5000
CheckboxBase mount 1286 1328 5000
CheckboxNext mount 1720 1663 5000
ChoiceGroup mount 5097 5101 5000
ComboBox mount 935 946 1000
CommandBar mount 7900 7891 1000
ContextualMenu mount 14242 14376 1000
DefaultButton mount 1136 1159 5000
DetailsRow mount 3570 3683 5000
DetailsRowFast mount 3624 3691 5000
DetailsRowNoStyles mount 3471 3520 5000
Dialog mount 1572 1553 1000
DocumentCardTitle mount 1900 1905 1000
Dropdown mount 2670 2661 5000
FocusZone mount 1846 1904 5000
IconButton mount 1777 1815 5000
Label mount 352 353 5000
Link mount 456 463 5000
LinkNext mount 485 494 5000
MenuButton mount 1472 1492 5000
Nav mount 3334 3288 1000
Panel mount 1509 1524 1000
Persona mount 874 876 1000
Pivot mount 1459 1481 1000
PivotNext mount 1458 1440 1000
PrimaryButton mount 1331 1276 5000
SearchBox mount 1305 1325 5000
SearchBoxNext mount 1321 1354 5000
Slider mount 1509 1545 5000
SliderNext mount 1988 1956 5000
SpinButton mount 5071 5126 5000
SpinButtonNext mount 5259 5202 5000
Spinner mount 442 436 5000
SplitButton mount 3181 3231 5000
Stack mount 530 540 5000
StackWithIntrinsicChildren mount 2144 2088 5000
StackWithTextChildren mount 5270 5252 5000
TagPicker mount 2830 2793 5000
Text mount 441 435 5000
TextField mount 1428 1436 5000
ThemeProvider mount 2993 3126 5000
ThemeProvider virtual-rerender 474 471 5000
Toggle mount 849 852 5000
ToggleNext mount 864 848 5000
button mount 120 108 5000

Perf Analysis (Fluent)

Perf comparison
Status Scenario Fluent TPI Fabric TPI Ratio Iterations Ticks
🎯 Avatar.Fluent 0.46 0.5 0.92:1 2000 926
🦄 Button.Fluent 0.11 0.2 0.55:1 5000 549
🔧 Checkbox.Fluent 0.65 0.36 1.81:1 1000 649
🦄 Dialog.Fluent 0.15 0.23 0.65:1 5000 766
🔧 Dropdown.Fluent 3.09 0.48 6.44:1 1000 3087
🔧 Icon.Fluent 0.15 0.05 3:1 5000 726
🦄 Image.Fluent 0.07 0.11 0.64:1 5000 368
🔧 Slider.Fluent 1.71 0.36 4.75:1 1000 1708
🔧 Text.Fluent 0.07 0.02 3.5:1 5000 334
🦄 Tooltip.Fluent 0.11 18.9 0.01:1 5000 543

🔧 Needs work     🎯 On target     🦄 Amazing

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
PortalMinimalPerf.default 136 122 1.11:1
AlertMinimalPerf.default 316 289 1.09:1
AvatarMinimalPerf.default 500 465 1.08:1
StatusMinimalPerf.default 701 651 1.08:1
TreeWith60ListItems.default 244 229 1.07:1
SegmentMinimalPerf.default 342 324 1.06:1
TreeMinimalPerf.default 927 876 1.06:1
HierarchicalTreeMinimalPerf.default 442 421 1.05:1
RadioGroupMinimalPerf.default 438 416 1.05:1
RefMinimalPerf.default 224 214 1.05:1
Avatar.Fluent 926 879 1.05:1
BoxMinimalPerf.default 352 340 1.04:1
ChatWithPopoverPerf.default 506 486 1.04:1
DividerMinimalPerf.default 355 341 1.04:1
FlexMinimalPerf.default 282 271 1.04:1
FormMinimalPerf.default 404 389 1.04:1
HeaderMinimalPerf.default 363 350 1.04:1
LoaderMinimalPerf.default 779 746 1.04:1
MenuMinimalPerf.default 879 845 1.04:1
ReactionMinimalPerf.default 383 369 1.04:1
Image.Fluent 368 355 1.04:1
ChatMinimalPerf.default 630 609 1.03:1
GridMinimalPerf.default 328 319 1.03:1
ProviderMinimalPerf.default 1003 977 1.03:1
SkeletonMinimalPerf.default 408 397 1.03:1
IconMinimalPerf.default 680 660 1.03:1
TableMinimalPerf.default 401 388 1.03:1
Button.Fluent 549 531 1.03:1
InputMinimalPerf.default 1369 1341 1.02:1
ItemLayoutMinimalPerf.default 1302 1272 1.02:1
ListMinimalPerf.default 467 459 1.02:1
SliderMinimalPerf.default 1702 1674 1.02:1
SplitButtonMinimalPerf.default 3905 3843 1.02:1
TableManyItemsPerf.default 2272 2220 1.02:1
CustomToolbarPrototype.default 3966 3886 1.02:1
ButtonMinimalPerf.default 176 175 1.01:1
ButtonSlotsPerf.default 604 597 1.01:1
CheckboxMinimalPerf.default 2954 2921 1.01:1
TextMinimalPerf.default 346 344 1.01:1
TextAreaMinimalPerf.default 466 460 1.01:1
VideoMinimalPerf.default 646 638 1.01:1
Slider.Fluent 1708 1685 1.01:1
Tooltip.Fluent 543 539 1.01:1
CardMinimalPerf.default 559 560 1:1
DropdownManyItemsPerf.default 775 774 1:1
DropdownMinimalPerf.default 3063 3057 1:1
EmbedMinimalPerf.default 1968 1961 1:1
LabelMinimalPerf.default 399 399 1:1
ListNestedPerf.default 904 902 1:1
MenuButtonMinimalPerf.default 1564 1570 1:1
PopupMinimalPerf.default 688 687 1:1
ProviderMergeThemesPerf.default 2009 2014 1:1
ToolbarMinimalPerf.default 943 940 1:1
TooltipMinimalPerf.default 809 812 1:1
Dropdown.Fluent 3087 3074 1:1
Icon.Fluent 726 728 1:1
AttachmentSlotsPerf.default 1149 1161 0.99:1
ChatDuplicateMessagesPerf.default 433 436 0.99:1
DialogMinimalPerf.default 776 780 0.99:1
LayoutMinimalPerf.default 400 404 0.99:1
ListCommonPerf.default 967 974 0.99:1
Dialog.Fluent 766 773 0.99:1
AttachmentMinimalPerf.default 148 151 0.98:1
HeaderSlotsPerf.default 771 783 0.98:1
ImageMinimalPerf.default 358 364 0.98:1
Checkbox.Fluent 649 661 0.98:1
AccordionMinimalPerf.default 148 152 0.97:1
AnimationMinimalPerf.default 389 400 0.97:1
CarouselMinimalPerf.default 465 481 0.97:1
ListWith60ListItems.default 1109 1145 0.97:1
Text.Fluent 334 355 0.94:1

@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 e5ab133:

Sandbox Source
Fluent UI Button Configuration
microsoft/fluentui: codesandbox-react-next-template Configuration
microsoft/fluentui: codesandbox-react-northstar-template Configuration

@assuncaocharles assuncaocharles merged commit feb91b9 into microsoft:master Aug 14, 2020
@assuncaocharles assuncaocharles deleted the chore/add-skeleton-types branch August 14, 2020 09:18
levithomason pushed a commit to levithomason/fluentui that referenced this pull request Aug 24, 2020
@assuncaocharles @levithomason
chore(StyleTypes): add Skeleton styles to types (microsoft#14522)
a36fcd6
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@pompomon pompomon pompomon approved these changes

@dvdzkwsk dvdzkwsk Awaiting requested review from dvdzkwsk

@dzearing dzearing Awaiting requested review from dzearing

@jurokapsiar jurokapsiar Awaiting requested review from jurokapsiar

@layershifter layershifter Awaiting requested review from layershifter

@levithomason levithomason Awaiting requested review from levithomason

@miroslavstastny miroslavstastny Awaiting requested review from miroslavstastny

@mnajdova mnajdova Awaiting requested review from mnajdova

Assignees

@khmakoto khmakoto

Labels
Fluent UI react-northstar (v0) Work related to Fluent UI V0
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
5 participants
@assuncaocharles @DustyTheBot @msft-github-bot @pompomon @khmakoto