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

fix: react-combobox defines fallbackPositions for popup on small screens #27521

Merged
merged 3 commits into from
Apr 11, 2023

Conversation

smhigley
Copy link
Contributor

Previous Behavior

When the listbox popup doesn't fit below or above the trigger, it doesn't try left/right positions.

New Behavior

Adds before & after fallbackPositions, so now the popup will attempt to position itself first after, then before the trigger (after below & above).

Related Issue(s)

@smhigley smhigley requested a review from a team as a code owner April 11, 2023 17:59
@smhigley smhigley self-assigned this Apr 11, 2023
@github-actions github-actions bot added this to the April Project Cycle Q2 2023 milestone Apr 11, 2023
@codesandbox-ci
Copy link

codesandbox-ci bot commented Apr 11, 2023

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 442b3b3:

Sandbox Source
@fluentui/react 8 starter Configuration
@fluentui/react-components 9 starter Configuration
Dropdown + Dialog (long list) Issue #27486

@fabricteam
Copy link
Collaborator

fabricteam commented Apr 11, 2023

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-combobox
Combobox (including child components)
89.718 kB
28.49 kB
89.788 kB
28.51 kB
70 B
20 B
react-combobox
Dropdown (including child components)
88.402 kB
28.217 kB
88.472 kB
28.238 kB
70 B
21 B
Unchanged fixtures
Package & Exports Size (minified/GZIP)
react-components
react-components: Button, FluentProvider & webLightTheme
67.994 kB
18.395 kB
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
207.529 kB
57.549 kB
react-components
react-components: FluentProvider & webLightTheme
38.819 kB
12.351 kB
react-portal-compat
PortalCompatProvider
6.446 kB
2.185 kB
🤖 This report was generated against 841ea75d516d85b88eb826030718c19c3239ee4d

@fabricteam
Copy link
Collaborator

fabricteam commented Apr 11, 2023

Perf Analysis (@fluentui/react-components)

Scenario Render type Master Ticks PR Ticks Iterations Status
FluentProviderWithTheme virtual-rerender-with-unmount 108 113 10 Possible regression
All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 704 674 5000
Button mount 374 380 5000
Field mount 1262 1255 5000
FluentProvider mount 883 889 5000
FluentProviderWithTheme mount 116 118 10
FluentProviderWithTheme virtual-rerender 93 96 10
FluentProviderWithTheme virtual-rerender-with-unmount 108 113 10 Possible regression
InfoButton mount 21 18 5000
MakeStyles mount 1123 1148 50000
Persona mount 1993 1940 5000
SpinButton mount 1576 1585 5000

@size-auditor
Copy link

size-auditor bot commented Apr 11, 2023

Asset size changes

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

Baseline commit: 841ea75d516d85b88eb826030718c19c3239ee4d (build)

@fabricteam
Copy link
Collaborator

fabricteam commented Apr 11, 2023

🕵 fluentuiv9 No visual regressions between this PR and main

Copy link
Member

@micahgodbolt micahgodbolt left a comment

Choose a reason for hiding this comment

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

approved with one suggestion

Co-authored-by: Micah Godbolt <micahgodbolt@gmail.com>
@smhigley smhigley merged commit 7b24128 into microsoft:master Apr 11, 2023
marcosmoura added a commit to marcosmoura/fluentui that referenced this pull request Apr 13, 2023
…t/drawer-light-dismiss-prop

* marcosmoura/feat/drawer-component: (51 commits)
  fix: upgrade react-dialog
  Doc: Add/Remove TreeItem and useFlatTree stories (microsoft#27515)
  applying package updates
  Fix accessibility labels for tree stories (microsoft#27443)
  fix: BasePickerListBelow aria-describedby with values (microsoft#27525)
  chore: Remove deprecated InputField, etc. shim components (microsoft#27492)
  [Feature]: allow aria-description attribute on v9 (microsoft#27478)
  feat(react-jsx-runtime): implements custom JSX pragma (microsoft#27472)
  chore: update generator to include "test-ssr" script (microsoft#27463)
  applying package updates
  fix: add "style" to exports field (microsoft#27274)
  applying package updates
  feat(react-datepicker-compat): Make package public (microsoft#27524)
  fix: react-combobox defines fallbackPositions for popup on small screens (microsoft#27521)
  fix: use tabster to focus on trigger, instead of manually invoking .focus (microsoft#27512)
  add cxe-red to react-shared-context ownership (microsoft#27296)
  docs: add props tables for all exported Popover controls (microsoft#27503)
  fix: Update FormFieldShim to work with Field context changes (microsoft#27436)
  Fix wrong state narration for multiple selected legends (microsoft#27429)
  add codeowners to theme designer v9 (microsoft#27311)
  ...
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.

[Bug]: <Dropdown> in <Dialog> renders the dropdown box too long
4 participants