iter: d02 select/radioGroup 补 disabled + 修复 select 箭头旋转

This commit is contained in:
ui-arch-bot
2026-10-23 16:47:03 +08:00
parent 84277a744e
commit 6b9fa95d1e
11 changed files with 75 additions and 15 deletions
+6 -1
View File
@@ -6,7 +6,12 @@ export function radioGroup(props: RadioGroupProps): HTMLElement {
const groupName = `ua-radio-${Math.random().toString(36).slice(2, 8)}`; // 组内唯一 name
const radios: HTMLInputElement[] = [];
for (const opt of props.options) {
const input = h('input', { type: 'radio', name: groupName, class: 'ua-radio' }) as HTMLInputElement;
const input = h('input', {
type: 'radio',
name: groupName,
class: 'ua-radio',
disabled: props.disabled, // 布尔或信号禁用,h() 直接透传
}) as HTMLInputElement;
input.value = opt.value;
radios.push(input);
input.addEventListener('change', () => {
+2 -1
View File
@@ -24,6 +24,7 @@ export function select(props: SelectProps): HTMLElement {
class: 'ua-select-trigger',
'aria-haspopup': 'listbox',
'aria-expanded': () => String(open()),
disabled: props.disabled, // 布尔或信号禁用,h() 直接透传(原生 button 拦截点击)
onClick: () => open(!open()),
},
h('span', { class: () => `ua-select-value${value() ? '' : ' is-empty'}` }, () => current() || props.placeholder || ''),
@@ -46,7 +47,7 @@ export function select(props: SelectProps): HTMLElement {
);
const pop = h('div', { class: () => `ua-select-pop${open() ? ' ua-open' : ''}`, role: 'listbox' }, ...options);
const root = h('div', { class: 'ua-select' }, trigger, pop);
const root = h('div', { class: () => `ua-select${open() ? ' ua-open' : ''}` }, trigger, pop); // 根带开合类,供箭头旋转
root.addEventListener('keydown', (e: KeyboardEvent) => {
if (e.key === 'Escape') open(false); // Esc 关闭弹层
+2
View File
@@ -67,6 +67,7 @@ export interface SelectProps {
options: OptionItem[]; // 选项列表
value?: Signal<string>; // 选中值信号,双向绑定
placeholder?: string; // 未选中时的占位项文案
disabled?: boolean | Signal<boolean>; // 禁用态:布尔直接置位,传信号则动态同步
onChange?: (value: string) => void; // 变更回调
}
@@ -74,6 +75,7 @@ export interface SelectProps {
export interface RadioGroupProps {
options: OptionItem[]; // 选项列表
value?: Signal<string>; // 选中值信号,双向绑定
disabled?: boolean | Signal<boolean>; // 禁用态:整组置灰且不可选
onChange?: (value: string) => void; // 变更回调
}