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(Menu): Add children api support #13227

Merged

Conversation

assuncaocharles
Copy link
Contributor

@assuncaocharles assuncaocharles commented May 19, 2020

Pull request checklist

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

Description of changes

Adding Children API support to Menu

Focus areas to test

(optional)

@msft-github-bot
Copy link
Contributor

msft-github-bot commented May 19, 2020

Perf Analysis

No significant results to display.

All results

Scenario Master Ticks PR Ticks Iterations Status
BaseButton 807 765 5000
Checkbox 1520 1502 5000
CheckboxBase 1195 1208 5000
CheckboxNext 1425 1430 5000
ChoiceGroup 4767 4610 5000
ComboBox 894 894 1000
CommandBar 7360 7413 1000
ContextualMenu 12302 12570 1000
DefaultButton 1023 992 5000
DetailsRow 3213 3383 5000
DetailsRow (fast icons) 3290 3297 5000
DetailsRow without styles 3120 3141 5000
Dialog 1423 1401 1000
DocumentCardTitle with truncation 1834 1833 1000
Dropdown 2268 2321 5000
FocusZone 1817 1754 5000
IconButton 1554 1582 5000
Label 293 302 5000
Link 431 445 5000
LinkNext 445 399 5000
MenuButton 1369 1329 5000
Nav 3135 3080 1000
Panel 1356 1349 1000
Persona 776 809 1000
Pivot 1287 1329 1000
PrimaryButton 1145 1106 5000
SearchBox 1115 1169 5000
Slider 1425 1385 5000
SliderNext 1448 1449 5000
Spinner 389 365 5000
SplitButton 2877 2972 5000
Stack 449 447 5000
Stack with Intrinsic children 1857 1755 5000
Stack with Text children 4636 4589 5000
TagPicker 2638 2607 5000
Text 344 353 5000
TextField 1325 1385 5000
Toggle 829 897 5000
ToggleNext 836 828 5000
button 75 75 5000

Perf Analysis (Fluent)

Perf comparison
Status Scenario Fluent TPI Fabric TPI Ratio Iterations Ticks
🔧 Avatar.Fluent 0.65 0.44 1.48:1 2000 1294
🦄 Button.Fluent 0.09 0.17 0.53:1 5000 468
🔧 Checkbox.Fluent 1.1 0.3 3.67:1 1000 1104
🔧 Dialog.Fluent 0.56 0.2 2.8:1 5000 2803
🔧 Dropdown.Fluent 6.25 0.44 14.2:1 1000 6246
🔧 Icon.Fluent 0.13 0.04 3.25:1 5000 644
🦄 Image.Fluent 0.06 0.1 0.6:1 5000 310
🔧 Slider.Fluent 2.87 0.35 8.2:1 1000 2869
🔧 Text.Fluent 0.07 0.02 3.5:1 5000 326
🦄 Tooltip.Fluent 0.1 16.31 0.01:1 5000 494

🔧 Needs work     🎯 On target     🦄 Amazing

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
FlexMinimalPerf.default 290 251 1.16:1
MenuMinimalPerf.default 720 623 1.16:1
ButtonMinimalPerf.default 173 154 1.12:1
AttachmentMinimalPerf.default 150 135 1.11:1
ChatMinimalPerf.default 593 547 1.08:1
SliderMinimalPerf.default 2913 2735 1.07:1
BoxMinimalPerf.default 318 301 1.06:1
HeaderSlotsPerf.default 1333 1252 1.06:1
LoaderMinimalPerf.default 1178 1113 1.06:1
SegmentMinimalPerf.default 333 313 1.06:1
CardMinimalPerf.default 525 501 1.05:1
ChatDuplicateMessagesPerf.default 514 488 1.05:1
ItemLayoutMinimalPerf.default 2587 2458 1.05:1
ListMinimalPerf.default 425 404 1.05:1
IconMinimalPerf.default 638 606 1.05:1
CarouselMinimalPerf.default 492 474 1.04:1
FormMinimalPerf.default 374 358 1.04:1
ListNestedPerf.default 1058 1019 1.04:1
DialogMinimalPerf.default 2820 2742 1.03:1
RefMinimalPerf.default 179 173 1.03:1
SplitButtonMinimalPerf.default 3582 3481 1.03:1
TextAreaMinimalPerf.default 428 417 1.03:1
Slider.Fluent 2869 2786 1.03:1
Tooltip.Fluent 494 478 1.03:1
ChatWithPopoverPerf.default 655 645 1.02:1
DropdownMinimalPerf.default 6289 6140 1.02:1
MenuButtonMinimalPerf.default 1558 1522 1.02:1
RadioGroupMinimalPerf.default 542 531 1.02:1
Dialog.Fluent 2803 2753 1.02:1
Icon.Fluent 644 631 1.02:1
Text.Fluent 326 321 1.02:1
AnimationMinimalPerf.default 675 667 1.01:1
HeaderMinimalPerf.default 329 325 1.01:1
InputMinimalPerf.default 1565 1545 1.01:1
LabelMinimalPerf.default 378 375 1.01:1
ReactionMinimalPerf.default 361 357 1.01:1
CustomToolbarPrototype.default 4588 4532 1.01:1
TreeMinimalPerf.default 1207 1198 1.01:1
AvatarMinimalPerf.default 685 684 1:1
CheckboxMinimalPerf.default 4993 4973 1:1
DividerMinimalPerf.default 311 311 1:1
Checkbox.Fluent 1104 1106 1:1
Dropdown.Fluent 6246 6224 1:1
DropdownManyItemsPerf.default 2042 2063 0.99:1
EmbedMinimalPerf.default 3233 3258 0.99:1
ImageMinimalPerf.default 340 345 0.99:1
AccordionMinimalPerf.default 127 130 0.98:1
TreeWith60ListItems.default 253 257 0.98:1
ListWith60ListItems.default 1489 1536 0.97:1
PopupMinimalPerf.default 249 257 0.97:1
ProviderMergeThemesPerf.default 1659 1705 0.97:1
ProviderMinimalPerf.default 756 777 0.97:1
VideoMinimalPerf.default 543 557 0.97:1
AttachmentSlotsPerf.default 1147 1190 0.96:1
HierarchicalTreeMinimalPerf.default 370 384 0.96:1
LayoutMinimalPerf.default 744 773 0.96:1
ListCommonPerf.default 1028 1072 0.96:1
TableMinimalPerf.default 343 358 0.96:1
TextMinimalPerf.default 302 315 0.96:1
ToolbarMinimalPerf.default 702 732 0.96:1
Avatar.Fluent 1294 1352 0.96:1
ButtonSlotsPerf.default 665 704 0.94:1
StatusMinimalPerf.default 594 631 0.94:1
Image.Fluent 310 329 0.94:1
TooltipMinimalPerf.default 672 720 0.93:1
PortalMinimalPerf.default 106 115 0.92:1
AlertMinimalPerf.default 271 297 0.91:1
GridMinimalPerf.default 1173 1288 0.91:1
Button.Fluent 468 516 0.91:1

@size-auditor
Copy link

size-auditor bot commented May 19, 2020

Asset size changes

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

Baseline commit: 387865b75c5a33a576800a15cd663f767964165a (build)

@assuncaocharles assuncaocharles merged commit 9088a68 into microsoft:master May 22, 2020
@assuncaocharles assuncaocharles deleted the feat/menu-children-api branch May 22, 2020 18:07
miroslavstastny pushed a commit to levithomason/fluentui that referenced this pull request Jun 8, 2020
* feat(Menu): Add children api support

* feat(Menu): Pointing example

* feat(Menu): Pointing example remove items array

* feat(Menu): Underlined example

* feat(Menu): IconOnly example

* feat(Menu): Icon&Content Example

* feat(Menu): Divider Example

* feat(Menu): Disabled Example

* feat(Menu): Vertical submenu

* feat(Menu): Vertical submenu fix

* feat(Menu): partially fix submenu

* feat(Menu): Fix submenu

* feat(Menu): Menu as toolbar example

* feat(Menu): Menu as toolbar example

* feat(Menu): Menu as toolbar example

* feat(Menu): with submenu

* feat(Menu): with submenu controlled

* feat(Menu): With Tooltips

* feat(Menu): Evaluate accessibility

* feat(menu): fix divider

* chore(Menu): fix build

* chore(Menu): fix sbmenu

* chore(Menu): fix sbmenu

* chore(Menu): fix sbmenu with controlled

* chore(Menu): fix Menu toolbar

* feat(Menu): parentComponent Slot

* feat(Menu): fix tests

* feat(Menu): fix tests

* feat(Menu): fix tests

* feat(Menu): fix tests

* Update packages/fluentui/docs/src/examples/components/Menu/Slots/MenuExampleDividerHorizontal.tsx

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

* Update packages/fluentui/docs/src/examples/components/Menu/Slots/MenuExampleSlot.tsx

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

* Update packages/fluentui/docs/src/examples/components/Menu/Usage/MenuExampleToolbar.tsx

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

* Update packages/fluentui/docs/src/examples/components/Menu/Variations/MenuExampleVerticalPrimary.tsx

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

* Update packages/fluentui/docs/src/examples/components/Menu/Usage/MenuExampleToolbar.tsx

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

* Update packages/fluentui/docs/src/examples/components/Menu/Usage/MenuExampleWithSubmenu.tsx

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

* Update packages/fluentui/docs/src/examples/components/Menu/Usage/MenuExampleWithSubmenu.tsx

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

* Update packages/fluentui/docs/src/examples/components/Menu/Variations/MenuExampleVerticalPrimary.tsx

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

* Update packages/fluentui/docs/src/examples/components/Menu/Variations/MenuExampleVerticalPrimary.tsx

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

* Update packages/fluentui/docs/src/examples/components/Menu/Variations/MenuExampleVerticalPrimary.tsx

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

* Update packages/fluentui/docs/src/examples/components/Menu/Variations/MenuExampleVerticalPrimary.tsx

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

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

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

* Update packages/fluentui/react-northstar/src/components/Menu/menuContext.ts

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

* feat(Menu): Review

* feat(Menu): fix prop

* feat(Menu): fix build errors

* feat(Menu): rename example

* feat(Menu): delete examples with submenu

* feat(Menu): typo

* feat(Menu): remove return statement

* feat(Menu): Revert parentComponent slot

* Update packages/fluentui/docs/src/examples/components/Menu/Slots/MenuExampleDividerHorizontal.tsx

Co-authored-by: Marija Najdova <mnajdova@gmail.com>

* feat(Menu): Acessibility for item and divider

* feat(Menu): Acessibility for item and divider

* feat(Menu): MenuExampleTabList RFC

* feat(Menu): onItemClick using actualProps

* feat(Menu): onItemClick instead actualProps

* fix types

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

Co-authored-by: Marija Najdova <mnajdova@gmail.com>

* feat(Menu): pass parentProps to slotProps

* feat(Menu): onItemClick stable

* feat(Menu): remove unnused

* feat(Menu): add changelog

* feat(Menu): fix screen

* feat(Menu): fix tests

* feat(Menu): change divider content condition

* feat(Menu): fix item click

* feat(Menu): fix item click

* feat(Menu): itemClick as null

* feat(Menu): itemClick as fixed

* feat(Menu): remove onclick from props

* feat(Menu): improve onlclick invoke

Co-authored-by: Oleksandr Fediashov <alexander.mcgarret@gmail.com>
Co-authored-by: Marija Najdova <mnajdova@gmail.com>
Co-authored-by: Oleksandr Fediashov <olfedias@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.

None yet

6 participants