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

Color picker - fixes #4127 #4146

Merged
merged 1 commit into from
Mar 17, 2023
Merged

Color picker - fixes #4127 #4146

merged 1 commit into from
Mar 17, 2023

Conversation

HarrySIV
Copy link
Contributor

@HarrySIV HarrySIV commented Mar 17, 2023

This PR technically fixes #4127 the color picker closing immediately on color selection, including typing in the TextInput field, but there are a couple more issues here that could use fixing, I'm just not sure how to go about all of them.

  1. It'd be nice if you could make the ::selection background clear so that you can see the color as it changes, but only while the color picker is open. I suppose I could do that with a useEffect hook and check if the picker isOpen or not, but I'm not exactly sure how to change the raw CSS for that.
  2. If you type in the hex code and accidentally type again, either hitting enter or something, it will replace the current selection with the key stroke. I'm not sure what the best way is to prevent that, but my first thought is don't allow the TextInput to autocomplete, instead require an enter keystroke or for the TextInput to lose focus in order to acknowledge the color change.
    I feel like that may be a big ask though.

@facebook-github-bot facebook-github-bot added the CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. label Mar 17, 2023
@vercel
Copy link

vercel bot commented Mar 17, 2023

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated
lexical ✅ Ready (Inspect) Visit Preview 💬 Add your feedback Mar 17, 2023 at 8:29PM (UTC)
lexical-playground ✅ Ready (Inspect) Visit Preview 💬 Add your feedback Mar 17, 2023 at 8:29PM (UTC)

Copy link
Member

@zurfyx zurfyx left a comment

Choose a reason for hiding this comment

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

Thanks! This makes sense to me but honestly I don't see the use case behind the stopCloseOnClickSelf property. Why would a dropdown ever close when you're clicking it? For example, I feel like the Insert and Align dropdowns we have do not have the correct behavior. That's a follow up item if you feel like fixing the remaining

@zurfyx zurfyx merged commit 46df974 into facebook:main Mar 17, 2023
@HarrySIV
Copy link
Contributor Author

I believe the default behavior for a lot of editors is to close the drop down on click, though I understand how someone who is editing might want to try out different looks before choosing one, and that having to constantly reopen the drop down menu can be annoying (I've been there). Or if they want to add like 5 horizontal rules.
Looking around at other color pickers, I see a lot of editors have an "ok" and "cancel" button that closes the drop down/modal and finalizes the change.
I can certainly go ahead and make the changes to insert and align items though.

@HarrySIV HarrySIV deleted the color-picker-fix branch March 17, 2023 21:23
@zurfyx zurfyx mentioned this pull request Mar 24, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Bug: Color picker hex input impossible to use. Picker closes on input focus.
3 participants