Do not show typeahead unless there is more than one item in the listbox

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}

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('')
   })
 })

src/lib/components/__snapshots__/container.test.jsx.snap

@@ -31,24 +31,5 @@ exports[`Container > Component renders correctly 1`] = `
     }
     type="text"
   />
-  <input
-    aria-hidden="true"
-    autoCapitalize="off"
-    autoComplete="off"
-    autoCorrect="off"
-    className="typeahead-class"
-    readOnly="readonly"
-    spellCheck="false"
-    style={
-      {
-        "left": 0,
-        "position": "absolute",
-        "top": 0,
-        "zIndex": 0,
-      }
-    }
-    tabIndex="-1"
-    type="text"
-  />
 </div>
 `;

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 && (
           <input
             className={`${inputStyles || ''} ${customStyles.typeahead || ''}`.trim()}
             style={defaultStyles.typeahead}