Select
基于 Proto UI Base Select 重构的 Shadcn Select。
当前条目把 shadcn 风格与 API 表面组合在已经编目的 Base Select 协议之上,并在 Web Components、React、Vue 三种适配器中共享同一套选择、焦点和 ARIA 语义。
正在加载交互示例… 正文和源码已可阅读,交互控件就绪后会显示在这里。
Root、Trigger、Value、Content、Item、Surface、Viewport、ItemText、Group、Label、SeparatordefaultValue/value、defaultOpen/open与对应变更事件Trigger.size="sm | default"Trigger.appearance="default | ghost"Content.position="item-aligned | popper",默认值与 shadcn/ui 一致为item-aligned- 单选、禁用项、键盘导航、typeahead、浮层关闭与焦点恢复
Group 是被动选项容器,Label 只命名所属分组。多个分组可与未分组选项混排,不改变选择顺序。Separator 是无子内容的装饰性分隔;上方示例直接使用这些真实 parts。视觉基线固定为 shadcn/ui revision 02cad611。
完整的 Surface → Viewport → Item → ItemText 组合为 item-aligned 定位提供显式结构;旧组合与显式 popper 继续支持。这不等于完整 Radix 定位一致性。滚动按钮、ItemIndicator 与表单提交仍未完成。GPUI peer 已验证分组命名关系的传输,但当前 wire 未携带 Separator 的 hidden-tree 事实;原生辅助技术验收仍待完成。
Trigger 外观
Section titled “Trigger 外观”appearance="default" 保留上方示例的有框字段表面。appearance="ghost" 是显式 Proto UI 呈现扩展:静止边框与背景透明、无静止阴影;hover 与 press 使用 accent 表面,保留清晰键盘焦点 ring 与 disabled 行为。此 prop 设在 shadcn-select-trigger,不设在 Root 或 Content;移除时即使在交互中也恢复 default。它只改变 Base Select Trigger 之上的视觉投影,不改变选择、键盘导航或浮层行为。