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] Update openOnFocus example to work even with empty input #720

Merged

Conversation

indiesquidge
Copy link
Collaborator

The existing openOnFocus example mounts/unmounts the popover based on the results array state, which returns null if the input term is an empty string. This is confusing in the context of the openOnFocus prop because the popover doesn't show on focus if the input is empty.

An alternative to using hardcoded example options would be to use a variant of useCityMatch that returns an array of e.g. the first 10 cities if the input term is an empty string.

Old Example

combobox-open-on-focus

New Example

new-combobox-open-on-focus

Thank you for contributing to Reach UI! Please fill in this template before submitting your PR to help us process your request more quickly.

  • Use a meaningful title for the pull request. Include the name of the package modified.
  • Test the change in your own code (Compile and run).
  • Add or edit tests to reflect the change (Run with yarn test).
  • Add or edit Storybook examples to reflect the change (Run with yarn start).
  • Ensure formatting is consistent with the project's Prettier configuration.
  • Add documentation to support any new features.

This pull request:

  • Creates a new package
  • Fixes a bug in an existing package
  • Adds additional features/functionality to an existing package
  • Updates documentation or example code
  • Other

@codesandbox-ci
Copy link

codesandbox-ci bot commented Jan 4, 2021

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 9a0ec60:

Sandbox Source
reach-ui-template Configuration

The existing openOnFocus example mounts/unmounts the popover based on
the results array state, which returns null if the input term is an
empty string. This is confusing in the context of the openOnFocus prop
because the popover doesn't show on focus if the input is empty.
@indiesquidge indiesquidge force-pushed the combobox-better-open-on-focus-example branch from be4ac7d to 9a0ec60 Compare January 4, 2021 23:05
@chaance chaance added the Type: Housekeeping General housekeeping label Jan 25, 2021
@chaance chaance merged commit 6995b96 into reach:develop Jan 25, 2021
@indiesquidge indiesquidge deleted the combobox-better-open-on-focus-example branch February 16, 2021 06:41
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type: Housekeeping General housekeeping
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants