Skip to content

Commit cee5fc4

Browse files
committed
Rename combobox to autocomplete
1 parent c0b8d13 commit cee5fc4

File tree

22 files changed

+588
-545
lines changed

22 files changed

+588
-545
lines changed

.changeset/twelve-gifts-camp.md

+23-21
Original file line numberDiff line numberDiff line change
@@ -3,27 +3,27 @@
33
'@crowdstrike/ember-toucan-form': patch
44
---
55

6-
Added a `Combobox` component to both core and form packages.
6+
Added an `Autocomplete` component to both core and form packages.
77

88
If you're using `toucan-core`, the control and field components are exposed:
99

1010
```hbs
11-
<Form::Controls::Combobox
11+
<Form::Controls::Autocomplete
1212
@onChange={{this.onChange}}
1313
@options={{this.options}}
1414
@contentClass='z-10'
1515
@selected={{this.selected}}
1616
@optionKey='label'
1717
@noResultsText='No results'
1818
placeholder='Colors'
19-
as |combobox|
19+
as |autocomplete|
2020
>
21-
<combobox.Option>
22-
{{combobox.option.label}}
23-
</combobox.Option>
24-
</Form::Controls::Combobox>
21+
<autocomplete.Option>
22+
{{autocomplete.option.label}}
23+
</autocomplete.Option>
24+
</Form::Controls::Autocomplete>
2525
26-
<Form::Fields::Combobox
26+
<Form::Fields::Autocomplete
2727
@contentClass='z-10'
2828
@error={{this.errorMessage}}
2929
@hint='Type "blue" into the field'
@@ -34,28 +34,30 @@ If you're using `toucan-core`, the control and field components are exposed:
3434
@options={{this.options}}
3535
@selected={{this.selected}}
3636
placeholder='Colors'
37-
as |combobox|
37+
as |autocomplete|
3838
>
39-
<combobox.Option>
40-
{{combobox.option.label}}
41-
</combobox.Option>
42-
</Form::Fields::Combobox>
39+
<autocomplete.Option>
40+
{{autocomplete.option.label}}
41+
</autocomplete.Option>
42+
</Form::Fields::Autocomplete>
4343
```
4444

4545
If you're using `toucan-form`, the component is exposed via:
4646

4747
```hbs
4848
<ToucanForm as |form|>
49-
<form.Combobox
50-
@label='Combobox'
51-
@name='combobox'
49+
<form.Autocomplete
50+
@label='Autocomplete'
51+
@name='autocomplete'
5252
@options={{options}}
53-
data-combobox
54-
as |combobox|
53+
data-autocomplete
54+
as |autocomplete|
5555
>
56-
<combobox.Option data-option>{{combobox.option}}</combobox.Option>
57-
</form.Combobox>
56+
<autocomplete.Option data-option>
57+
{{autocomplete.option}}
58+
</autocomplete.Option>
59+
</form.Autocomplete>
5860
</ToucanForm>
5961
```
6062

61-
For more information on using these components, view [the docs](https://ember-toucan-core.pages.dev/docs/components/combobox).
63+
For more information on using these components, view [the docs](https://ember-toucan-core.pages.dev/docs/components/autocomplete).

docs/components/combobox-field/demo/base-demo.md docs/components/autocomplete-field/demo/base-demo.md

+6-6
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
```hbs template
2-
<Form::Fields::Combobox
2+
<Form::Fields::Autocomplete
33
@contentClass='z-10'
44
@error={{this.errorMessage}}
55
@hint='Type "blue" into the field'
@@ -10,12 +10,12 @@
1010
@options={{this.options}}
1111
@selected={{this.selected}}
1212
placeholder='Colors'
13-
as |combobox|
13+
as |autocomplete|
1414
>
15-
<combobox.Option>
16-
{{combobox.option.label}}
17-
</combobox.Option>
18-
</Form::Fields::Combobox>
15+
<autocomplete.Option>
16+
{{autocomplete.option.label}}
17+
</autocomplete.Option>
18+
</Form::Fields::Autocomplete>
1919
```
2020

2121
```js component

0 commit comments

Comments
 (0)