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

Combobox: Add component #74

Open
ItsJonQ opened this issue Nov 3, 2020 · 7 comments
Open

Combobox: Add component #74

ItsJonQ opened this issue Nov 3, 2020 · 7 comments

Comments

@ItsJonQ
Copy link
Owner

ItsJonQ commented Nov 3, 2020

We'll need a highly flexible Combobox component. Something as feature-rich (hopefully) as React Select.

Some of the features we'd need to support would include:

  • Selecting multiple items (which render as deletable tags)
  • Custom menu/item rendering
  • Grouping
  • Async loading/fetching support
  • Portaling

We may be able to Downshift as the state management/interaction handler (the "brains" if you will) for this Combobox.

I know @diegohaz has been working on a Reakit Combobox as well <3.

@ItsJonQ ItsJonQ self-assigned this Nov 3, 2020
@ItsJonQ
Copy link
Owner Author

ItsJonQ commented Nov 5, 2020

An example of where a Combobox component is used within Gutenberg (adding tags).

Screen Shot 2020-11-05 at 11 35 07 AM

@diegohaz
Copy link
Collaborator

diegohaz commented Nov 5, 2020

By the way, the Reakit Combobox stories can be found here: https://next.reakit.io/storybook/?path=/story/examples--accessible-combobox

I'll create a tags example there. It's going to be fun! :D

@ItsJonQ
Copy link
Owner Author

ItsJonQ commented Nov 5, 2020

I'll create a tags example there. It's going to be fun! :D

@diegohaz Can't wait!!!!

@diegohaz
Copy link
Collaborator

diegohaz commented Nov 7, 2020

@ItsJonQ Built this: https://codesandbox.io/s/reakit-combobox-with-tags-smfgu

The code is a mess and it has probably a lot of bugs, but, yeah, it was fun! 😆

@ItsJonQ ItsJonQ removed their assignment Nov 9, 2020
@ItsJonQ
Copy link
Owner Author

ItsJonQ commented Nov 23, 2020

For integration with Gutenberg, we may need to replace the current FontSizePicker component from @wordpress/components (as it related to Typography Tools in Global Styles).

As such, we'll need some sort of Combobox component:

Screen Shot 2020-11-23 at 2 11 07 PM

As such, we can probably role with the technologies/setup that the current CustomSelect from WP components has.

@ItsJonQ ItsJonQ added this to the Phase 1: Prep milestone Nov 23, 2020
@ItsJonQ ItsJonQ self-assigned this Nov 23, 2020
@ItsJonQ
Copy link
Owner Author

ItsJonQ commented Nov 23, 2020

🤦 . I just realized that the current FontSizePicker doesn't use a ComboBox. But rather, a custom <Select /> component.

@ItsJonQ
Copy link
Owner Author

ItsJonQ commented Nov 23, 2020

Creating a new issue for the custom select component:
#161

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants