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

useArrowNavigationGroup grid-linear axis #28253

Merged
merged 3 commits into from
Jun 19, 2023

Conversation

jurokapsiar
Copy link
Contributor

Upgrade tabster to latest
add grid-linear axis option

@ling1726
Copy link
Member

you updated API run yarn workspace @fluentui/react-tabster build

@jurokapsiar jurokapsiar requested a review from a team as a code owner June 19, 2023 07:57
@fabricteam
Copy link
Collaborator

Perf Analysis (@fluentui/react-components)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 590 586 5000
Button mount 307 293 5000
Field mount 1050 1075 5000
FluentProvider mount 666 653 5000
FluentProviderWithTheme mount 71 72 10
FluentProviderWithTheme virtual-rerender 68 72 10
FluentProviderWithTheme virtual-rerender-with-unmount 72 82 10
InfoButton mount 14 16 5000
MakeStyles mount 833 845 50000
Persona mount 1633 1621 5000
SpinButton mount 1295 1316 5000

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

Sandbox Source
@fluentui/react 8 starter Configuration
@fluentui/react-components 9 starter Configuration

@size-auditor
Copy link

size-auditor bot commented Jun 19, 2023

Asset size changes

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

Baseline commit: 4e3460bbbabb80de909e7f911ab0337548871f6e (build)

@fabricteam
Copy link
Collaborator

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
TreeWith60ListItems.default 97 86 1.13:1
PortalMinimalPerf.default 86 80 1.08:1
ProviderMinimalPerf.default 212 198 1.07:1
LabelMinimalPerf.default 233 219 1.06:1
CardMinimalPerf.default 311 297 1.05:1
FormMinimalPerf.default 228 217 1.05:1
LoaderMinimalPerf.default 199 190 1.05:1
RadioGroupMinimalPerf.default 273 259 1.05:1
AvatarMinimalPerf.default 111 107 1.04:1
DialogMinimalPerf.default 455 438 1.04:1
ReactionMinimalPerf.default 211 202 1.04:1
TableMinimalPerf.default 242 232 1.04:1
TextAreaMinimalPerf.default 300 288 1.04:1
CheckboxMinimalPerf.default 1155 1122 1.03:1
HeaderMinimalPerf.default 212 205 1.03:1
MenuMinimalPerf.default 490 477 1.03:1
AnimationMinimalPerf.default 297 290 1.02:1
AttachmentSlotsPerf.default 626 613 1.02:1
ChatMinimalPerf.default 427 419 1.02:1
DividerMinimalPerf.default 205 200 1.02:1
HeaderSlotsPerf.default 471 462 1.02:1
InputMinimalPerf.default 544 534 1.02:1
RosterPerf.default 1525 1499 1.02:1
PopupMinimalPerf.default 352 344 1.02:1
SkeletonMinimalPerf.default 198 195 1.02:1
SplitButtonMinimalPerf.default 2265 2219 1.02:1
BoxMinimalPerf.default 193 191 1.01:1
ButtonSlotsPerf.default 310 306 1.01:1
DatepickerMinimalPerf.default 3509 3461 1.01:1
DropdownMinimalPerf.default 1421 1411 1.01:1
LayoutMinimalPerf.default 198 196 1.01:1
ListNestedPerf.default 332 329 1.01:1
ListWith60ListItems.default 367 365 1.01:1
MenuButtonMinimalPerf.default 948 942 1.01:1
CustomToolbarPrototype.default 1464 1453 1.01:1
VideoMinimalPerf.default 442 439 1.01:1
EmbedMinimalPerf.default 1839 1834 1:1
FlexMinimalPerf.default 155 155 1:1
ItemLayoutMinimalPerf.default 710 708 1:1
SegmentMinimalPerf.default 205 204 1:1
SliderMinimalPerf.default 716 719 1:1
ToolbarMinimalPerf.default 529 527 1:1
TooltipMinimalPerf.default 1232 1233 1:1
AccordionMinimalPerf.default 78 79 0.99:1
ButtonMinimalPerf.default 83 84 0.99:1
ChatDuplicateMessagesPerf.default 145 146 0.99:1
RefMinimalPerf.default 108 109 0.99:1
StatusMinimalPerf.default 392 395 0.99:1
IconMinimalPerf.default 381 383 0.99:1
TableManyItemsPerf.default 1113 1129 0.99:1
TextMinimalPerf.default 190 192 0.99:1
TreeMinimalPerf.default 464 468 0.99:1
ButtonOverridesMissPerf.default 638 650 0.98:1
ListCommonPerf.default 392 398 0.98:1
ProviderMergeThemesPerf.default 646 660 0.98:1
ChatWithPopoverPerf.default 173 179 0.97:1
GridMinimalPerf.default 179 185 0.97:1
CarouselMinimalPerf.default 244 254 0.96:1
DropdownManyItemsPerf.default 381 395 0.96:1
ImageMinimalPerf.default 211 219 0.96:1
AlertMinimalPerf.default 156 165 0.95:1
ListMinimalPerf.default 300 317 0.95:1
AttachmentMinimalPerf.default 83 88 0.94:1

@fabricteam
Copy link
Collaborator

🕵 fluentuiv8 No visual regressions between this PR and main

@fabricteam
Copy link
Collaborator

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-accordion
Accordion (including children components)
88.064 kB
26.659 kB
88.246 kB
26.712 kB
182 B
53 B
react-card
Card - All
88.752 kB
25.122 kB
88.829 kB
25.141 kB
77 B
19 B
react-card
Card
83.687 kB
23.666 kB
83.764 kB
23.685 kB
77 B
19 B
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
210.103 kB
58.624 kB
210.365 kB
58.697 kB
262 B
73 B
react-datepicker-compat
DatePicker Compat
221.601 kB
59.012 kB
221.863 kB
59.081 kB
262 B
69 B
react-dialog
Dialog (including children components)
91.673 kB
27.385 kB
91.816 kB
27.419 kB
143 B
34 B
react-infobutton
InfoButton
131.018 kB
40.224 kB
131.161 kB
40.259 kB
143 B
35 B
react-infobutton
InfoLabel
134.483 kB
41.291 kB
134.626 kB
41.328 kB
143 B
37 B
react-menu
Menu (including children components)
132.175 kB
40.453 kB
132.358 kB
40.508 kB
183 B
55 B
react-menu
Menu (including selectable components)
134.939 kB
40.948 kB
135.122 kB
41.002 kB
183 B
54 B
react-popover
Popover
119.608 kB
36.799 kB
119.751 kB
36.834 kB
143 B
35 B
react-table
DataGrid
156.086 kB
42.712 kB
156.269 kB
42.766 kB
183 B
54 B
react-table
Table as DataGrid
131.742 kB
33.728 kB
131.923 kB
33.783 kB
181 B
55 B
Unchanged fixtures
Package & Exports Size (minified/GZIP)
global-context
createContext
510 B
330 B
global-context
createContextSelector
537 B
342 B
priority-overflow
createOverflowManager
4.204 kB
1.656 kB
react-alert
Alert
82.552 kB
21.771 kB
react-avatar
Avatar
47.7 kB
14.504 kB
react-avatar
AvatarGroup
15.682 kB
6.306 kB
react-avatar
AvatarGroupItem
63.876 kB
18.984 kB
react-badge
Badge
23.591 kB
7.264 kB
react-badge
CounterBadge
24.493 kB
7.565 kB
react-badge
PresenceBadge
22.213 kB
7.872 kB
react-button
Button
36.778 kB
9.51 kB
react-button
CompoundButton
43.932 kB
10.99 kB
react-button
MenuButton
40.965 kB
10.705 kB
react-button
SplitButton
49.197 kB
12.27 kB
react-button
ToggleButton
55.06 kB
11.446 kB
react-card
CardFooter
9.229 kB
3.9 kB
react-card
CardHeader
11.125 kB
4.596 kB
react-card
CardPreview
10.034 kB
4.248 kB
react-checkbox
Checkbox
33.164 kB
10.699 kB
react-combobox
Combobox (including child components)
86.98 kB
28.084 kB
react-combobox
Dropdown (including child components)
85.321 kB
27.675 kB
react-components
react-components: Button, FluentProvider & webLightTheme
65.162 kB
17.952 kB
react-components
react-components: FluentProvider & webLightTheme
36.395 kB
11.996 kB
react-divider
Divider
17.477 kB
6.357 kB
react-field
Field
18.003 kB
6.931 kB
react-image
Image
11.55 kB
4.627 kB
react-input
Input
24.219 kB
7.781 kB
react-label
Label
10.175 kB
4.243 kB
react-link
Link
12.375 kB
5.113 kB
react-overflow
hooks only
12.461 kB
4.609 kB
react-persona
Persona
54.621 kB
16.435 kB
react-portal
Portal
11.82 kB
4.391 kB
react-portal-compat
PortalCompatProvider
6.473 kB
2.196 kB
react-positioning
usePositioning
24.249 kB
8.856 kB
react-progress
ProgressBar
13.927 kB
5.488 kB
react-provider
FluentProvider
18.115 kB
6.719 kB
react-radio
Radio
26.952 kB
8.608 kB
react-radio
RadioGroup
11.362 kB
4.753 kB
react-select
Select
24.915 kB
8.708 kB
react-slider
Slider
34.358 kB
11.107 kB
react-spinbutton
SpinButton
33.452 kB
10.296 kB
react-spinner
Spinner
21.363 kB
7.021 kB
react-switch
Switch
29.472 kB
9.226 kB
react-table
Table (Primitives only)
44.615 kB
12.472 kB
react-table
Table (Selection only)
77.524 kB
19.166 kB
react-table
Table (Sort only)
76.854 kB
18.976 kB
react-tags
Tag
21.343 kB
7.822 kB
react-text
Text - Default
12.563 kB
4.972 kB
react-text
Text - Wrappers
15.713 kB
5.293 kB
react-textarea
Textarea
27.69 kB
9.125 kB
react-theme
Single theme token import
69 B
89 B
react-theme
Teams: all themes
31.987 kB
6.85 kB
react-theme
Teams: Light theme
18.121 kB
5.194 kB
react-tooltip
Tooltip
47.263 kB
16.585 kB
react-utilities
SSRProvider
180 B
159 B
🤖 This report was generated against 4e3460bbbabb80de909e7f911ab0337548871f6e

@fabricteam
Copy link
Collaborator

🕵 FluentUI-v0 No visual regressions between this PR and main

@fabricteam
Copy link
Collaborator

🕵 fluentuiv9 No visual regressions between this PR and main

@fabricteam
Copy link
Collaborator

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
BaseButton mount 613 633 5000
Breadcrumb mount 1712 1691 1000
Checkbox mount 1689 1698 5000
CheckboxBase mount 1467 1501 5000
ChoiceGroup mount 2933 2877 5000
ComboBox mount 648 646 1000
CommandBar mount 6257 6239 1000
ContextualMenu mount 11517 11938 1000
DefaultButton mount 742 727 5000
DetailsRow mount 2180 2158 5000
DetailsRowFast mount 2131 2140 5000
DetailsRowNoStyles mount 1977 2038 5000
Dialog mount 2637 2633 1000
DocumentCardTitle mount 226 227 1000
Dropdown mount 1938 1970 5000
FocusTrapZone mount 1133 1125 5000
FocusZone mount 1157 1096 5000
GroupedList mount 36992 41088 2
GroupedList virtual-rerender 20031 19629 2
GroupedList virtual-rerender-with-unmount 50528 50280 2
GroupedListV2 mount 229 221 2
GroupedListV2 virtual-rerender 197 215 2
GroupedListV2 virtual-rerender-with-unmount 233 222 2
IconButton mount 1050 1058 5000
Label mount 330 332 5000
Layer mount 2680 2712 5000
Link mount 383 378 5000
MenuButton mount 951 938 5000
MessageBar mount 21338 21203 5000
Nav mount 1914 1968 1000
OverflowSet mount 765 753 5000
Panel mount 2048 1753 1000
Persona mount 737 729 1000
Pivot mount 836 866 1000
PrimaryButton mount 835 833 5000
Rating mount 4553 4599 5000
SearchBox mount 935 907 5000
Shimmer mount 1866 1853 5000
Slider mount 1326 1338 5000
SpinButton mount 2847 2866 5000
Spinner mount 387 372 5000
SplitButton mount 1817 1789 5000
Stack mount 402 413 5000
StackWithIntrinsicChildren mount 854 869 5000
StackWithTextChildren mount 2644 2611 5000
SwatchColorPicker mount 5967 5933 5000
TagPicker mount 1414 1408 5000
Text mount 368 373 5000
TextField mount 933 891 5000
ThemeProvider mount 810 828 5000
ThemeProvider virtual-rerender 576 576 5000
ThemeProvider virtual-rerender-with-unmount 1270 1268 5000
Toggle mount 593 603 5000
buttonNative mount 191 190 5000

@jurokapsiar jurokapsiar merged commit 1a277b9 into microsoft:master Jun 19, 2023
@jurokapsiar jurokapsiar deleted the tabster-grid-linear branch June 19, 2023 09:15
marcosmoura added a commit to marcosmoura/fluentui that referenced this pull request Jun 20, 2023
* master: (32 commits)
  applying package updates
  feat(react-tags): add styles for size (microsoft#28229)
  docs(react-dialog): update DialogTriggerOutsideDialog to include focus behavior (microsoft#28176)
  bugfix: Ensures dialog actions stretches on breakpoints (microsoft#28258)
  applying package updates
  fix: TableHeaderCell should not render button when not sortable (microsoft#28097)
  fix(react-file-type-icons): Map mhtml extension to html icon (microsoft#28112)
  Fix overlapping axis labels on smaller viewports (microsoft#28239)
  useArrowNavigationGroup grid-linear axis (microsoft#28253)
  applying package updates
  fix: Alert example missing aria-label for icon (microsoft#28234)
  Overflow divider fix (microsoft#28011)
  feat(tools): implement `cypress-component-configuration` generator (microsoft#28115)
  chore: migrate to TS 4.7 (microsoft#28067)
  fix(scripts-tasks): make generate-api work in deterministic way (microsoft#28215)
  feat(react-tags): add overflow story (microsoft#28012)
  Structure and slots for SearchBox, using Input as a slot (microsoft#28090)
  feat(tokens): Add/update theme tokens (microsoft#27791)
  feat(react-tags): add a11y role and best practices guide (microsoft#28075)
  fix: Toast intent should always be present in the context (microsoft#28226)
  ...
@msft-fluent-ui-bot
Copy link
Collaborator

🎉@fluentui/react-tabster@v9.8.0 has been released which incorporates this pull request.:tada:

Handy links:

@msft-fluent-ui-bot
Copy link
Collaborator

🎉@fluentui/react-components@v9.22.0 has been released which incorporates this pull request.:tada:

Handy links:

marcosmoura added a commit to marcosmoura/fluentui that referenced this pull request Jun 22, 2023
* master: (95 commits)
  docs(react-drawer): improve drawer stories examples (microsoft#28283)
  bugfix: adds grid-template-columns to DialogBody styles to ensure grid template layout (microsoft#28272)
  Doc: Tree Infinite Scrolling (microsoft#28197)
  fix(react-card): infer a11y id from immediate header element (microsoft#28266)
  Fixed bugs and added more stories to the Breadcrumb (microsoft#28267)
  refactor: Keep vanillajs code only where needed (microsoft#28278)
  fix: correcting focus behavior of react-search (microsoft#28241)
  Tooltip : updated tooltip styles (microsoft#28264)
  applying package updates
  feat(react-tags): add styles for size (microsoft#28229)
  docs(react-dialog): update DialogTriggerOutsideDialog to include focus behavior (microsoft#28176)
  bugfix: Ensures dialog actions stretches on breakpoints (microsoft#28258)
  applying package updates
  fix: TableHeaderCell should not render button when not sortable (microsoft#28097)
  fix(react-file-type-icons): Map mhtml extension to html icon (microsoft#28112)
  Fix overlapping axis labels on smaller viewports (microsoft#28239)
  useArrowNavigationGroup grid-linear axis (microsoft#28253)
  applying package updates
  fix: Alert example missing aria-label for icon (microsoft#28234)
  Overflow divider fix (microsoft#28011)
  ...
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.

5 participants