表单
Combobox
一个能打字的 select，可以选一个，也可以选多个。
什么时候用它
大约十几个选项以上。更少的时候 Select 更好：不用思考就能扫完。
示例
default
Type to filter — “compact” matches two of them.
multiple
The panel stays open while you pick; past two it counts instead of listing.
说明
一个能打字的 select，可以选一个，也可以选多个。
和 Select 的分界线是长度，而且这不是口味问题：大约十几个选项以内，带样式的 select 更好，因为一个不用筛的列表扫起来比一个需要思考的更快。超过之后，这个才是正确答案。
筛选、高亮行和方向键都来自 cmdk，它正确实现了 ARIA combobox 模式：高亮通过 aria-activedescendant 移动，焦点留在输入框里。手搓的 combobox 会把焦点挪进列表，于是打出来的字就没法再改了。
和这里其他每一个表单控件一样，受控非受控都行。
属性
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| label必填 | string | 给控件命名。必填——触发器上的文字是值，不是名字。 | |
| options必填 | ComboboxOption[] | — | |
| className | string | — | |
| defaultValue | string | — | |
| disabled | boolean | false | — |
| emptyMessage | string | 'Nothing matches.' | 筛选没有命中任何项时显示。写清楚**什么样的输入**会命中。 |
| multiple | false | — | |
| onValueChange | (value: string) => void | — | |
| placeholder | string | 'Select…' | 什么都没选时，显示在触发器上。 |
| searchPlaceholder | string | 'Search…' | 筛选框里的占位文字。 |
| value | string | — |
键盘操作
| 按键 | 作用 |
|---|---|
| EnterSpace↓ | 展开列表。 |
| ↑↓ | 移动高亮，焦点始终留在筛选框里。 |
| Enter | 选中高亮那一项；再选一次当前项就是取消。 |
| Escape | 不选中直接关闭。 |
无障碍
- 高亮通过 aria-activedescendant 移动，焦点留在输入框里——这是 ARIA combobox 模式。自己手搓的会把焦点挪进列表，然后打的字就没法改了。
- label 必填：触发器上是值，值不是名字。