# Component/Dropdown

Input 박스를 누르면 리스트가 표시되며 하나의 항목만 선택할 수 있습니다.

## Props


| Name | Type | Required | Default | Description |
|------|------|----------|---------|-------------|
| `className` | `string | undefined` | No |  |  |
| `width` | `CSSValueWithLength | undefined` | No |  |  |
| `maxHeight` | `number | undefined` | No | DEFAULT_DROPDOWN_MAX_HEIGHT |  |
| `zIndex` | `number | undefined` | No | getZIndex('dropdown') |  |
| `size` | `undefined "xsmall" "small" "medium" "large"` | No | 'medium' |  |
| `labelHeight` | `CSSValueWithLength | undefined` | No |  |  |
| `optionItemHeight` | `number | undefined` | No |  |  |
| `disabled` | `boolean | undefined` | No |  |  |
| `optionsMatchRefWidth` | `boolean | undefined` | No | true |  |
| `options` | `DropdownOption<OptionValue>[]` | Yes |  |  |
| `placeholder` | `string | undefined` | No |  |  |
| `status` | `undefined "error"` | No |  |  |
| `value` | `string | number | undefined` | No |  |  |
| `autoPlacement` | `boolean | undefined` | No | true | floating 요소가 reference 영역을 넘어갈 경우 자동 위치 처리 사용 유무  - 자동 위치 상/하만 적용됩니다. |
| `keyExtractor` | `((item: DropdownOption<OptionValue>, index: number) => string | number) | undefined` | No |  |  |
| `onChange` | `((value: OptionValue) => void) | undefined` | No |  |  |
| `renderLabel` | `((selectedOption: DropdownOption<OptionValue>) => ReactNode) | undefined` | No |  |  |
| `enableVirtualScroll` | `boolean | undefined` | No |  |  |
| `unstableFocusVisible` | `boolean | undefined` | No |  | react-aria useFocusRing isFocusVisible 반환값을 제어할 수 있습니다. |
| `ref` | `Ref<HTMLDivElement> | undefined` | No |  |  |