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

feat(Breadcrumb): add base component #14922

Merged
merged 6 commits into from
Sep 8, 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

This PR adds base Breadcrumb component

Focus areas to test

(optional)

@codesandbox-ci
Copy link

codesandbox-ci bot commented Sep 7, 2020

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 307336b:

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

@msft-github-bot
Copy link
Contributor

msft-github-bot commented Sep 7, 2020

Perf Analysis

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
BaseButton mount 920 904 5000
ButtonNext mount 702 700 5000
Checkbox mount 1643 1602 5000
CheckboxBase mount 1346 1394 5000
CheckboxNext mount 1719 1701 5000
ChoiceGroup mount 5127 5164 5000
ChoiceGroupNext mount 5175 5084 5000
ComboBox mount 912 944 1000
CommandBar mount 7519 7469 1000
ContextualMenu mount 12519 12404 1000
DefaultButton mount 1180 1131 5000
DetailsRow mount 3647 3621 5000
DetailsRowFast mount 3677 3557 5000
DetailsRowNoStyles mount 3404 3464 5000
Dialog mount 1495 1493 1000
DocumentCardTitle mount 1793 1808 1000
Dropdown mount 2649 2660 5000
FocusZone mount 1758 1850 5000
IconButton mount 1820 1785 5000
Label mount 358 334 5000
Link mount 459 451 5000
LinkNext mount 464 478 5000
MenuButton mount 1494 1504 5000
MessageBar mount 2109 2075 5000
MessageBarNext mount 2071 2049 5000
Nav mount 3359 3337 1000
OverflowSet mount 1425 1416 5000
OverflowSetNext mount 1045 1052 5000
Panel mount 1461 1454 1000
Persona mount 842 841 1000
Pivot mount 1440 1435 1000
PivotNext mount 1433 1403 1000
PrimaryButton mount 1293 1276 5000
SearchBox mount 1430 1303 5000
SearchBoxNext mount 1379 1378 5000
Shimmer mount 2633 2648 5000
ShimmerNext mount 2666 2713 5000
Slider mount 1521 1527 5000
SliderNext mount 1940 1956 5000
SpinButton mount 5113 5109 5000
SpinButtonNext mount 5213 5174 5000
Spinner mount 408 417 5000
SplitButton mount 3173 3232 5000
Stack mount 537 534 5000
StackWithIntrinsicChildren mount 1998 1973 5000
StackWithTextChildren mount 5225 5256 5000
SwatchColorPicker mount 10431 10535 5000
SwatchColorPickerNext mount 10412 10331 5000
TagPicker mount 2884 2824 5000
TeachingBubble mount 49086 49156 5000
TeachingBubbleNext mount 49121 50516 5000
Text mount 429 461 5000
TextField mount 1446 1388 5000
ThemeProvider mount 4217 4376 5000
ThemeProvider virtual-rerender 466 449 5000
Toggle mount 855 847 5000
ToggleNext mount 823 825 5000
button mount 125 114 5000

Perf Analysis (Fluent)

⚠️ 5 potential perf regressions detected

Potential regressions comparing to master

Scenario Current PR Ticks Baseline Ticks Ratio Regression Analysis
ButtonOverridesMissPerf.default 1736 40 43.4:1 analysis
ButtonUseCssNestingPerf.default 1179 47 25.09:1 analysis
ButtonUseCssPerf.default 898 47 19.11:1 analysis
ChatWithPopoverPerf.default 503 481 1.05:1 analysis
ListNestedPerf.default 619 913 0.68:1 analysis
Perf comparison
Status Scenario Fluent TPI Fabric TPI Ratio Iterations Ticks
🎯 Avatar.Fluent 0.47 0.49 0.96:1 2000 931
🦄 Button.Fluent 0.13 0.2 0.65:1 5000 631
🔧 Checkbox.Fluent 0.71 0.37 1.92:1 1000 705
🎯 Dialog.Fluent 0.16 0.22 0.73:1 5000 812
🔧 Dropdown.Fluent 2.96 0.49 6.04:1 1000 2957
🔧 Icon.Fluent 0.15 0.06 2.5:1 5000 742
🎯 Image.Fluent 0.09 0.12 0.75:1 5000 445
🔧 Slider.Fluent 1.58 0.37 4.27:1 1000 1576
🔧 Text.Fluent 0.08 0.03 2.67:1 5000 401
🦄 Tooltip.Fluent 0.12 15.06 0.01:1 5000 582

🔧 Needs work     🎯 On target     🦄 Amazing

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
AttachmentMinimalPerf.default 204 148 1.38:1
PortalMinimalPerf.default 157 114 1.38:1
RefMinimalPerf.default 248 194 1.28:1
GridMinimalPerf.default 434 345 1.26:1
HeaderMinimalPerf.default 429 346 1.24:1
LabelMinimalPerf.default 516 434 1.19:1
SegmentMinimalPerf.default 408 343 1.19:1
ButtonMinimalPerf.default 214 182 1.18:1
FormMinimalPerf.default 485 412 1.18:1
ReactionMinimalPerf.default 468 396 1.18:1
ImageMinimalPerf.default 451 384 1.17:1
TableMinimalPerf.default 472 402 1.17:1
Text.Fluent 401 342 1.17:1
AnimationMinimalPerf.default 445 385 1.16:1
StatusMinimalPerf.default 816 701 1.16:1
DividerMinimalPerf.default 437 379 1.15:1
LayoutMinimalPerf.default 449 393 1.14:1
SkeletonMinimalPerf.default 483 423 1.14:1
CarouselMinimalPerf.default 522 461 1.13:1
TreeWith60ListItems.default 237 210 1.13:1
Checkbox.Fluent 705 624 1.13:1
Image.Fluent 445 393 1.13:1
FlexMinimalPerf.default 317 284 1.12:1
ListMinimalPerf.default 532 477 1.12:1
BoxMinimalPerf.default 408 368 1.11:1
ChatMinimalPerf.default 683 614 1.11:1
Tooltip.Fluent 582 522 1.11:1
DialogMinimalPerf.default 838 759 1.1:1
IconMinimalPerf.default 754 687 1.1:1
Button.Fluent 631 572 1.1:1
CardMinimalPerf.default 606 558 1.09:1
MenuMinimalPerf.default 935 859 1.09:1
TextMinimalPerf.default 404 369 1.09:1
HeaderSlotsPerf.default 862 800 1.08:1
RadioGroupMinimalPerf.default 467 432 1.08:1
TextAreaMinimalPerf.default 530 493 1.08:1
ToolbarMinimalPerf.default 1015 943 1.08:1
TreeMinimalPerf.default 960 889 1.08:1
Icon.Fluent 742 690 1.08:1
ButtonSlotsPerf.default 639 598 1.07:1
ProviderMergeThemesPerf.default 1948 1821 1.07:1
TooltipMinimalPerf.default 835 781 1.07:1
VideoMinimalPerf.default 664 621 1.07:1
Dialog.Fluent 812 758 1.07:1
ChatDuplicateMessagesPerf.default 442 418 1.06:1
DropdownManyItemsPerf.default 811 766 1.06:1
AlertMinimalPerf.default 332 317 1.05:1
InputMinimalPerf.default 1355 1291 1.05:1
MenuButtonMinimalPerf.default 1665 1583 1.05:1
PopupMinimalPerf.default 696 660 1.05:1
ProviderMinimalPerf.default 962 914 1.05:1
AvatarMinimalPerf.default 498 481 1.04:1
EmbedMinimalPerf.default 2005 1930 1.04:1
ItemLayoutMinimalPerf.default 1385 1333 1.04:1
CheckboxMinimalPerf.default 2915 2830 1.03:1
SplitButtonMinimalPerf.default 3964 3845 1.03:1
TableManyItemsPerf.default 2370 2291 1.03:1
CustomToolbarPrototype.default 3776 3655 1.03:1
LoaderMinimalPerf.default 777 760 1.02:1
Dropdown.Fluent 2957 2901 1.02:1
AccordionMinimalPerf.default 157 155 1.01:1
DropdownMinimalPerf.default 2929 2902 1.01:1
Avatar.Fluent 931 927 1:1
AttachmentSlotsPerf.default 1163 1175 0.99:1
Slider.Fluent 1576 1587 0.99:1
SliderMinimalPerf.default 1569 1633 0.96:1
ListWith60ListItems.default 979 1109 0.88:1
ListCommonPerf.default 699 982 0.71:1

@size-auditor
Copy link

size-auditor bot commented Sep 7, 2020

Asset size changes

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

Baseline commit: 44a60ee06f4ed4770b267b9fc52cbfb6fb25dad1 (build)

@assuncaocharles
Copy link
Contributor Author

@layershifter is that what u mean?

@assuncaocharles assuncaocharles merged commit 8d9d028 into microsoft:master Sep 8, 2020
@assuncaocharles assuncaocharles deleted the feat/breadcrumb branch September 8, 2020 10:19
hutchcodes pushed a commit to hutchcodes/fluentui that referenced this pull request Sep 10, 2020
* feat(Breadcrumb): add base component

* Update packages/fluentui/react-northstar/src/components/Breadcrumb/Breadcrumb.tsx

Co-authored-by: Oleksandr Fediashov <[email protected]>

* feat(Breadcrumb): expose slot

* Revert "feat(Breadcrumb): expose slot"

This reverts commit af78698.

* feat(Breadcrumb): remove zone wrapper

* feat(Breadcrumb): add changelog

Co-authored-by: Oleksandr Fediashov <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Fluent UI react-northstar (v0) Work related to Fluent UI V0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants