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

[pickers] Clean popper position on new pickers #7445

Merged
merged 6 commits into from
Feb 6, 2023

Conversation

flaviendelangle
Copy link
Member

@flaviendelangle flaviendelangle commented Jan 9, 2023

Part of #7440

This one changes the behavior compared to v5 so it's worth discussing

  • Set the position of single input pickers (non range) to bottom-start
  • Keep the position of multi input pickers (range) to center but add fullWidth prop to the TextField to make sure there is never space at the right of the last input

https://deploy-preview-7445--material-ui-x.netlify.app/x/react-date-pickers/date-picker/#basic-usage

@flaviendelangle flaviendelangle self-assigned this Jan 9, 2023
@flaviendelangle flaviendelangle added the component: pickers This is the name of the generic UI component, not the React module! label Jan 9, 2023
@mui-bot
Copy link

mui-bot commented Jan 9, 2023

Messages
📖 Netlify deploy preview: https://deploy-preview-7445--material-ui-x.netlify.app/

These are the results for the performance tests:

Test case Unit Min Max Median Mean σ
Filter 100k rows ms 600 912.2 729.4 733.28 110.929
Sort 100k rows ms 588 1,106.3 788.5 845.3 167.789
Select 100k rows ms 205.9 302 280 261.48 39.19
Deselect 100k rows ms 141.6 294.3 237.6 235.16 52.828

Generated by 🚫 dangerJS against 9d51e33

@github-actions github-actions bot added the PR: out-of-date The pull request has merge conflicts and can't be merged label Jan 12, 2023
@github-actions
Copy link

This pull request has conflicts, please resolve those before we can evaluate the pull request.

Copy link
Member

@oliviertassinari oliviertassinari left a comment

Choose a reason for hiding this comment

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

It feels much better on my end in this demo https://deploy-preview-7445--material-ui-x.netlify.app/x/react-date-pickers/date-picker/#basic-usage 👌

Regarding the transition, something feels wrong, it doesn't feel great. Maybe no transitions would feel better or faster on or with an origin a bit more on the left side. Maybe it's only point 12 of #7440.

@github-actions github-actions bot removed the PR: out-of-date The pull request has merge conflicts and can't be merged label Feb 6, 2023
@flaviendelangle
Copy link
Member Author

Regarding the transition, something feels wrong, it doesn't feel great. Maybe no transitions would feel better or faster on or with an origin a bit more on the left side. Maybe it's only point 12 of #7440.

We can experiment with different transitions in another PR.
Spectrum has no transition for example.

Copy link
Member

@LukasTy LukasTy left a comment

Choose a reason for hiding this comment

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

Great job!
Very nice fine-tuning improvements. 👌

@flaviendelangle flaviendelangle merged commit a25e098 into mui:next Feb 6, 2023
@flaviendelangle flaviendelangle deleted the popper-position branch February 6, 2023 16:43
MBilalShafi pushed a commit to MBilalShafi/mui-x that referenced this pull request Feb 6, 2023
@oliviertassinari oliviertassinari added bug 🐛 Something doesn't work design: ui labels Jul 10, 2023
@oliviertassinari oliviertassinari added design This is about UI or UX design, please involve a designer and removed design: ui labels Aug 18, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug 🐛 Something doesn't work component: pickers This is the name of the generic UI component, not the React module! design This is about UI or UX design, please involve a designer
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants