import { Canvas, Meta, Controls, Stories } from '@storybook/blocks';

import * as ComboboxStories from './Combobox.stories';

<Meta of={ComboboxStories} />

# Combobox

A combobox component for searching through a list of options in a dropdown.

This component borrows heavily from FlySelect, with code adapted for a
functional component.

## A11y

The current implementation of Combobox uses [BasicInput](?path=/docs/inputs-basicinput--docs) which doesn't derive a `label` element. Because of this, in order for the Combobox to be accessible, we need to explicitly pass an `aria-label` argument which is spread onto the BasicInput component as part of `...otherProps`. This is also why all of the Storybook stories include a minimal `aria-label` as part of their default.

<Canvas of={ComboboxStories.BasicLoaderWpeEnvironments} />

## Props

<Controls />

## Stories

<Stories of={ComboboxStories} />