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.

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

chore(react-image): migrate to new SB controlls setup #18972

Merged

Conversation

Hotell
Copy link
Contributor

@Hotell Hotell commented Jul 16, 2021

Pull request checklist

  • ~[ ] Addresses an existing issue: ~
  • Include a change request file using $ yarn change

Description of changes

react-image-default-storybook.mov

Focus areas to test

(optional)

@Hotell Hotell added this to In progress in CXE Prague - @microsoft/cxe-prg via automation Jul 16, 2021
@Hotell Hotell added this to the July Project Cycle Q2 2021 milestone Jul 16, 2021
@Hotell Hotell requested review from a team July 16, 2021 10:29
Default.argTypes = {
alt: {
control: 'text',
defaultValue: 'Image placeholder',
Copy link
Contributor Author

Choose a reason for hiding this comment

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

alt and src doesn't have any @defaultValue which is what we want, so in order to get proper playground we need to specify those manually (override-ing typescript generated controls)

@codesandbox-ci
Copy link

codesandbox-ci bot commented Jul 16, 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 6486e70:

Sandbox Source
Fluent UI React Starter Configuration

@fabricteam
Copy link
Collaborator

fabricteam commented Jul 16, 2021

📊 Bundle size report

Unchanged fixtures
Package & Exports Size (minified/GZIP)
react-image
Image
10.642 kB
4.264 kB
🤖 This report was generated against 91e053b6cfb80ed71f99957fc1e6b92f67920ab3

@size-auditor
Copy link

size-auditor bot commented Jul 16, 2021

Asset size changes

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

Baseline commit: 91e053b6cfb80ed71f99957fc1e6b92f67920ab3 (build)

@fabricteam
Copy link
Collaborator

fabricteam commented Jul 16, 2021

Perf Analysis (@fluentui/react)

Scenario Render type Master Ticks PR Ticks Iterations Status
Panel mount 2105 1329 1000 Possible regression
All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 803 792 5000
BaseButton mount 898 884 5000
Breadcrumb mount 2660 2680 1000
ButtonNext mount 522 546 5000
Checkbox mount 1506 1488 5000
CheckboxBase mount 1313 1320 5000
ChoiceGroup mount 4741 4705 5000
ComboBox mount 982 986 1000
CommandBar mount 10240 10153 1000
ContextualMenu mount 6346 6290 1000
DefaultButton mount 1152 1139 5000
DetailsRow mount 3678 3741 5000
DetailsRowFast mount 3702 3750 5000
DetailsRowNoStyles mount 3584 3526 5000
Dialog mount 2161 2112 1000
DocumentCardTitle mount 132 151 1000
Dropdown mount 3273 3234 5000
FluentProviderNext mount 7366 7304 5000
FocusTrapZone mount 1842 1810 5000
FocusZone mount 1822 1838 5000
IconButton mount 1764 1771 5000
Label mount 333 343 5000
Layer mount 1794 1771 5000
Link mount 450 460 5000
MakeStyles mount 1861 1864 50000
MenuButton mount 1452 1466 5000
MessageBar mount 2034 2063 5000
Nav mount 3280 3216 1000
OverflowSet mount 1046 1034 5000
Panel mount 2105 1329 1000 Possible regression
Persona mount 839 837 1000
Pivot mount 1386 1417 1000
PrimaryButton mount 1293 1313 5000
Rating mount 7630 7684 5000
SearchBox mount 1311 1299 5000
Shimmer mount 2542 2518 5000
Slider mount 1936 1942 5000
SpinButton mount 4998 4949 5000
Spinner mount 417 428 5000
SplitButton mount 3196 3147 5000
Stack mount 494 493 5000
StackWithIntrinsicChildren mount 1531 1487 5000
StackWithTextChildren mount 4448 4462 5000
SwatchColorPicker mount 10244 10227 5000
Tabs mount 1385 1406 1000
TagPicker mount 2455 2426 5000
TeachingBubble mount 11899 11920 5000
Text mount 416 408 5000
TextField mount 1375 1363 5000
ThemeProvider mount 1188 1167 5000
ThemeProvider virtual-rerender 596 593 5000
Toggle mount 787 785 5000
buttonNative mount 116 120 5000

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
AttachmentMinimalPerf.default 167 147 1.14:1
ChatDuplicateMessagesPerf.default 300 278 1.08:1
FormMinimalPerf.default 407 376 1.08:1
ListNestedPerf.default 557 527 1.06:1
LoaderMinimalPerf.default 713 681 1.05:1
AccordionMinimalPerf.default 150 144 1.04:1
ButtonMinimalPerf.default 167 160 1.04:1
ChatWithPopoverPerf.default 368 353 1.04:1
LabelMinimalPerf.default 385 371 1.04:1
LayoutMinimalPerf.default 375 361 1.04:1
ProviderMinimalPerf.default 1007 972 1.04:1
RefMinimalPerf.default 236 227 1.04:1
GridMinimalPerf.default 337 327 1.03:1
SegmentMinimalPerf.default 345 335 1.03:1
AnimationMinimalPerf.default 415 408 1.02:1
DialogMinimalPerf.default 763 751 1.02:1
EmbedMinimalPerf.default 4141 4073 1.02:1
PopupMinimalPerf.default 591 579 1.02:1
RadioGroupMinimalPerf.default 444 435 1.02:1
TableMinimalPerf.default 398 390 1.02:1
ToolbarMinimalPerf.default 946 923 1.02:1
TreeWith60ListItems.default 172 168 1.02:1
VideoMinimalPerf.default 633 618 1.02:1
CardMinimalPerf.default 535 531 1.01:1
DropdownManyItemsPerf.default 680 676 1.01:1
HeaderMinimalPerf.default 354 352 1.01:1
ItemLayoutMinimalPerf.default 1216 1208 1.01:1
ListCommonPerf.default 611 603 1.01:1
ListWith60ListItems.default 655 648 1.01:1
SkeletonMinimalPerf.default 349 344 1.01:1
SliderMinimalPerf.default 1579 1563 1.01:1
CheckboxMinimalPerf.default 2731 2734 1:1
DropdownMinimalPerf.default 3125 3126 1:1
ProviderMergeThemesPerf.default 1666 1673 1:1
TableManyItemsPerf.default 1876 1885 1:1
TextMinimalPerf.default 348 349 1:1
CustomToolbarPrototype.default 3832 3824 1:1
TreeMinimalPerf.default 780 778 1:1
AttachmentSlotsPerf.default 1042 1051 0.99:1
AvatarMinimalPerf.default 190 191 0.99:1
BoxMinimalPerf.default 335 339 0.99:1
CarouselMinimalPerf.default 457 460 0.99:1
DatepickerMinimalPerf.default 5345 5385 0.99:1
FlexMinimalPerf.default 282 285 0.99:1
InputMinimalPerf.default 1247 1264 0.99:1
MenuButtonMinimalPerf.default 1644 1657 0.99:1
PortalMinimalPerf.default 180 181 0.99:1
SplitButtonMinimalPerf.default 3782 3810 0.99:1
TooltipMinimalPerf.default 1007 1013 0.99:1
ButtonOverridesMissPerf.default 1660 1695 0.98:1
ChatMinimalPerf.default 645 658 0.98:1
ImageMinimalPerf.default 369 375 0.98:1
RosterPerf.default 1169 1198 0.98:1
ReactionMinimalPerf.default 363 372 0.98:1
StatusMinimalPerf.default 655 665 0.98:1
TextAreaMinimalPerf.default 483 491 0.98:1
ButtonSlotsPerf.default 538 552 0.97:1
HeaderSlotsPerf.default 741 761 0.97:1
AlertMinimalPerf.default 260 270 0.96:1
MenuMinimalPerf.default 824 861 0.96:1
DividerMinimalPerf.default 340 358 0.95:1
IconMinimalPerf.default 588 619 0.95:1
ListMinimalPerf.default 517 553 0.93:1

CXE Prague - @microsoft/cxe-prg automation moved this from In progress to Reviewer approved Jul 16, 2021
@Hotell Hotell mentioned this pull request Jul 16, 2021
@Hotell Hotell merged commit 8b1d09a into microsoft:master Jul 19, 2021
CXE Prague - @microsoft/cxe-prg automation moved this from Reviewer approved to Done Jul 19, 2021
@Hotell Hotell deleted the hotell/react-image/apply-sb-rfc-guides branch July 19, 2021 13:18
@Hotell Hotell moved this from Done to Archive in CXE Prague - @microsoft/cxe-prg Aug 4, 2021
PeterDraex pushed a commit to PeterDraex/fluentui that referenced this pull request Aug 6, 2021
* chore(react-image): migrate to new SB controlls setup
* refactor(react-image): remove redundant api declared by native img
* Change files
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

5 participants