docs(Autocomplete): add RAC Autocomplete docs #7784
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
reidbarber
commented
Feb 19, 2025
devongovett
reviewed
Feb 19, 2025
There was a problem hiding this comment.
somehow we need to find a way to emphasize that Autocomplete works with both TextField and SearchField, and with both Menu and ListBox. Right now the examples suggest it works only with SearchField and Menu. Maybe we should mix them up a bit and provide some more varied examples that people might google for as well? Searchable menu, Command palette, Filterable Select (like the story we have), etc.
reidbarber
changed the title
yihuiliao
reviewed
Feb 19, 2025
devongovett
reviewed
Feb 21, 2025
packages/react-aria-components/docs/examples/command-palette.mdx
Outdated
Show resolved
Hide resolved
|
|
||
| return ( | ||
| <div className="bg-linear-to-r from-indigo-500 to-violet-500 p-8 h-[340px] rounded-lg flex flex-col items-center justify-center"> | ||
| <div className="flex flex-col gap-1 w-[320px] rounded-md bg-white shadow-lg"> |
There was a problem hiding this comment.
Do we want to make this into a Dialog that you could open with Command K (or by clicking a button)?
This reverts commit 4710c1b.
…um into rac-autocomplete-docs
snowystinger
previously approved these changes
Feb 21, 2025
devongovett
reviewed
Feb 21, 2025
packages/react-aria-components/docs/examples/command-palette.mdx
Outdated
Show resolved
Hide resolved
devongovett
reviewed
Feb 21, 2025
packages/react-aria-components/docs/examples/command-palette.mdx
Outdated
Show resolved
Hide resolved
packages/react-aria-components/docs/examples/command-palette.mdx
Outdated
Show resolved
Hide resolved
yihuiliao
previously approved these changes
Feb 21, 2025
devongovett
reviewed
Feb 21, 2025
packages/react-aria-components/docs/examples/command-palette.mdx
Outdated
Show resolved
Hide resolved
## API Changes
react-aria-components/react-aria-components:UNSTABLE_Autocomplete-UNSTABLE_Autocomplete {
- children: ReactNode
- defaultInputValue?: string
- filter?: (string, string) => boolean
- inputValue?: string
- onInputChange?: (string) => void
- slot?: string | null
-}/react-aria-components:UNSTABLE_AutocompleteContext-UNSTABLE_AutocompleteContext {
- UNTYPED
-}/react-aria-components:UNSTABLE_AutocompleteStateContext-UNSTABLE_AutocompleteStateContext {
- UNTYPED
-}/react-aria-components:Autocomplete+Autocomplete {
+ children: ReactNode
+ defaultInputValue?: string
+ filter?: (string, string) => boolean
+ inputValue?: string
+ onInputChange?: (string) => void
+ slot?: string | null
+}/react-aria-components:AutocompleteContext+AutocompleteContext {
+ UNTYPED
+}/react-aria-components:AutocompleteStateContext+AutocompleteStateContext {
+ UNTYPED
+} |
devongovett
approved these changes
Feb 22, 2025
|
|
||
| This example shows an `AutocompleteClearButton` component that can be placed within an `Autocomplete` to allow the user to clear the input. | ||
|
|
||
| ```tsx example |
There was a problem hiding this comment.
This example is still a little weird because the search field already has a clear button too. 🤔
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
✅ Pull Request Checklist:
📝 Test Instructions:
🧢 Your Project: