diff --git a/examples/geo/App.jsx b/examples/geo/App.jsx
index 6fb5a4c..e6c8b16 100644
--- a/examples/geo/App.jsx
+++ b/examples/geo/App.jsx
@@ -83,7 +83,7 @@ const App = () => {
placeholder={placeholder}
plugins={[[recentSearchesPlugin, {ratio: 2, name: 'Recent', limit: maxItems}]]}
styles={autocompleteStyles}
- typeahead={false}
+ typeahead={true}
Cancel={CancelButton}
Clear={ClearButton}
GroupName={GroupName}
diff --git a/src/lib/__tests__/turnstone.test.jsx b/src/lib/__tests__/turnstone.test.jsx
index 0f32e88..923a377 100644
--- a/src/lib/__tests__/turnstone.test.jsx
+++ b/src/lib/__tests__/turnstone.test.jsx
@@ -91,14 +91,13 @@ describe('Integration tests', () => {
const container = screen.getByRole('combobox')
const input = screen.getByPlaceholderText(placeholder)
- const typeahead = container.children[1]
expect(input).toBeDefined()
- expect(typeahead).toBeDefined()
expect(screen.queryByRole('listbox')).toBeNull()
userEvent.type(screen.getByRole('textbox'), 'p')
expect(await screen.findByRole('listbox')).toBeDefined()
- expect(typeahead.value).toBe('Peach')
+ expect(container.children[1]).toBeDefined()
+ expect(container.children[1].value).toBe('Peach')
expect(input.value).toBe('P')
expect(screen.getByRole('option', { name: /peach/i }).getAttribute('aria-selected')).toBe('true')
userEvent.type(screen.getByRole('textbox'), 'i', { skipClick: true })
@@ -123,6 +122,6 @@ describe('Integration tests', () => {
userEvent.type(screen.getByRole('textbox'), '{backspace}', { skipClick: true })
expect(screen.queryByRole('listbox')).toBeNull()
expect(input.value).toBe('')
- expect(typeahead.value).toBe('')
+ expect(container.children[1].value).toBe('')
})
})
\ No newline at end of file
diff --git a/src/lib/components/__snapshots__/container.test.jsx.snap b/src/lib/components/__snapshots__/container.test.jsx.snap
index 03c367e..2df8dbf 100644
--- a/src/lib/components/__snapshots__/container.test.jsx.snap
+++ b/src/lib/components/__snapshots__/container.test.jsx.snap
@@ -31,24 +31,5 @@ exports[`Container > Component renders correctly 1`] = `
}
type="text"
/>
-
`;
diff --git a/src/lib/components/container.jsx b/src/lib/components/container.jsx
index ce3959a..b6bf909 100644
--- a/src/lib/components/container.jsx
+++ b/src/lib/components/container.jsx
@@ -78,6 +78,8 @@ export default function Container(props) {
const typeaheadInput = useRef(null)
// Calculated states
+ console.log('hasTypeahead', typeahead, state.items.length > 1)
+ const hasTypeahead = typeahead && state.items.length > 1
const hasClearButton = clearButton && !!state.query
const hasCancelButton = cancelButton && hasFocus
const isExpanded = hasFocus && state.itemsLoaded
@@ -241,7 +243,7 @@ export default function Container(props) {
aria-controls={listboxId}
/>
- {typeahead && (
+ {hasTypeahead && (