时间选择器 TimePicker

TimePicker 把小时和分钟组成一个可以验证的时间值。它的责任不是装饰一个时钟图标，而是限制候选、确认组合，并把最终时间回填到当前预约或排期任务。

TimePicker ≠ DatePicker ≠ Input：TimePicker 负责一天中的合法时间，DatePicker 负责日历日期，Input 适合无法归一化为固定时间的文本。

• 小时和分钟是同一个时间值的两个组成部分，不应让用户填入格式不一致的自由字符串。
• 如果预约跨日期，日期与时间要分别表达，并在提交前组合成明确的值。

验收时检查触发按钮的 aria-expanded、弹层边界、小时分钟选择和确认后的回填值；不要只检查页面出现了一个输入框。

• 字段标签和触发器：说明这个时间值用于哪个预约任务，并负责打开选择面板。
• 小时列与分钟列：把可选时间拆成可验证的两个维度。
• 确认后的值：把组合结果回填到字段和当前预约摘要。

空值表示还没有时间，已选表示字段拥有可回填的合法值，禁用表示当前不能修改；这三个状态不能只通过颜色或占位文字的细微变化区分。

时间选择器的完整反馈包含三个动作：打开候选、确认小时和分钟、把同一个值带入预约结果。缺少最后的回填，用户无法确认页面到底采用了哪个时间。

什么时候用 TimePicker，要先看任务需要的是一天中的合法时段、日历日期，还是无法归一化的自然语言；只有前者才应该如何使用时间选择器。

请在会议室预约表单实现 TimePicker：只提供 09、10、11、14、15、16 点和 00、30 分，用户选择后字段回填完整的 HH:mm，并把同一个值显示在预约摘要里。请保留真实按钮、aria-expanded、Esc 关闭、键盘焦点和窄屏弹层定位；日期由独立 DatePicker 负责，自然语言说明不要塞进 TimePicker。