pub fn FormSelect<T: Clone + PartialEq + 'static>(
_: FormSelectProps<T>,
) -> ElementExpand description
下拉选择框组件(自定义弹层,全主题化)。
原生 <select> 的弹出列表由 OS/浏览器渲染,无法跟随主题(暗色下是白底
系统菜单),故用 button[aria-haspopup=listbox] + 绝对定位面板重写:
- 面板/选项全部使用 Catppuccin 语义色,带
select-enter入场动画; - focus 始终留在触发器,键盘经
aria-activedescendant高亮(↑↓ 循环、 Enter/Space 选中、Esc 关闭、Home/End 跳首尾、Tab 关闭并自然流转焦点); - 透明遮罩拦截外部点击关闭(同 Popover 模式);选项
onmousedown阻止默认 行为,点击不夺走触发器焦点; - 打开时视口下方空间不足且上方更宽余则向上展开(
should_flip); - 泛型值绑定:
onchange直接回传选中项的T,无需字符串反查。
Props:
id:触发器 id,用于与 label 关联(缺省用内部计数器生成)value:当前选中项(受控)options:可选项(值, 标签)列表onchange:选中变化回调,回传新选中项的值
§Props
For details, see the props struct definition.
id:Option<String>value:Toptions:Vec<(T,&'staticstr)>onchange:EventHandler<T>trigger_class:Option<&'staticstr>触发器样式覆盖:缺省为全宽表单款;工具栏内联场景传
FORM_SELECT_COMPACT_CLASS,或自定义类串(如编辑器底部胶囊)。