Skip to content

Commit

Permalink
fix: autocomplete starter (#7824)
Browse files Browse the repository at this point in the history 
* fix: autocomplete starter

* fix typecheck

---------

Co-authored-by: Yihui Liao <[email protected]>
  • Loading branch information
@devongovett @yihuiliao
devongovett and yihuiliao authored Feb 24, 2025
1 parent d2cc705 commit c8fdba5
Showing 1 changed file with 13 additions and 14 deletions.
27 changes: 13 additions & 14 deletions packages/react-aria-components/docs/Autocomplete.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -214,7 +214,6 @@ This example wraps `Autocomplete` and all of its children together into a single
import type {AutocompleteProps, Key} from 'react-aria-components';
import {Menu, MenuItem} from 'react-aria-components';
import {MySearchField} from './SearchField';
import {MyItem} from './Menu';

interface MyAutocompleteProps<T extends object> extends Omit<AutocompleteProps, 'children'> {
label?: string,
Expand All @@ -239,14 +238,14 @@ function MyAutocomplete<T extends object>({label,placeholder, items, children, o
}

<MyAutocomplete label="Commands" placeholder="Search commands...">
<MyItem>Create new file...</MyItem>
<MyItem>Create new folder...</MyItem>
<MyItem>Assign to...</MyItem>
<MyItem>Assign to me</MyItem>
<MyItem>Change status...</MyItem>
<MyItem>Change priority...</MyItem>
<MyItem>Add label...</MyItem>
<MyItem>Remove label...</MyItem>
<MenuItem>Create new file...</MenuItem>
<MenuItem>Create new folder...</MenuItem>
<MenuItem>Assign to...</MenuItem>
<MenuItem>Assign to me</MenuItem>
<MenuItem>Change status...</MenuItem>
<MenuItem>Change priority...</MenuItem>
<MenuItem>Add label...</MenuItem>
<MenuItem>Remove label...</MenuItem>
</MyAutocomplete>
```

Expand Down Expand Up @@ -306,7 +305,7 @@ function Example() {
/*- begin highlight -*/
defaultInputValue="Adobe XD">
{/*- end highlight -*/}
{item => <MyItem>{item.name}</MyItem>}
{item => <MenuItem>{item.name}</MenuItem>}
</MyAutocomplete>

<MyAutocomplete
Expand All @@ -316,7 +315,7 @@ function Example() {
inputValue={value}
onInputChange={setValue}>
{/*- end highlight -*/}
{item => <MyItem>{item.name}</MyItem>}
{item => <MenuItem>{item.name}</MenuItem>}
</MyAutocomplete>
</div>
);
Expand Down Expand Up @@ -367,9 +366,9 @@ function Example() {
<MySearchField label="Animals" placeholder="Search animals..." />
<AutocompleteClearButton />
<Menu>
<MyItem id="cat">Cat</MyItem>
<MyItem id="dog">Dog</MyItem>
<MyItem id="kangaroo">Kangaroo</MyItem>
<MenuItem id="cat">Cat</MenuItem>
<MenuItem id="dog">Dog</MenuItem>
<MenuItem id="kangaroo">Kangaroo</MenuItem>
</Menu>
</Autocomplete>
</div>
Expand Down

1 comment on commit c8fdba5

@rspbot
Copy link

@rspbot rspbot commented on c8fdba5 Feb 25, 2025

Choose a reason for hiding this comment

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

Verdaccio builds:
CRA Test App
NextJS Test App
RAC Tailwind Example
RAC Spectrum + Tailwind Example
S2 Parcel Example
S2 Webpack Example
CRA Test App Size
NextJS App Size
Publish stats
Size diff since last release
Docs
Storybook
S2 Storybook

Please sign in to comment.