iter(g342): 重置按钮逐项复位字段与错误态

packages/skin/ui/src/form.ts

@@ -50,6 +50,9 @@ export function formItem(props: FormItemProps, control: HTMLElement): FormItemHa
   // 条件显示：隐藏时顺带清掉错误态，否则「看不见的红框」会拦住提交
   if (props.visible) effect(() => { el.hidden = !props.visible?.(); if (el.hidden) paint(null); });
   let seq = 0; // 校验轮次：异步结论回来时若已有更新的一轮，丢弃旧结果（防乱序覆盖）
+  // 初始值快照：重置要回到「刚渲染时」而不是空串（带默认值的字段不能被清成空）
+  const initial = Array.from(control.querySelectorAll<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>('input, textarea, select'))
+    .map((node) => ({ node, value: node.value, checked: (node as HTMLInputElement).checked }));
 
   /*** 错误态落点：控件根 + 内部原生控件，保证 select / checkbox 这类包裹式控件也能标红 ***/
   const marked = (): HTMLElement[] => [
@@ -98,6 +101,19 @@ export function formItem(props: FormItemProps, control: HTMLElement): FormItemHa
     return msg;
   };
 
+  /*** 复位：先跑调用方的自绘控件钩子，再把原生控件还原到初始值并同步信号，最后清错误态 ***/
+  const reset = (): void => {
+    props.reset?.(); // 自绘控件（无原生 input）拿不到值，只能交给调用方回写信号
+    for (const { node, value, checked } of initial) {
+      const boxed = node instanceof HTMLInputElement && (node.type === 'checkbox' || node.type === 'radio'); // 勾选类走 checked
+      if (boxed) (node as HTMLInputElement).checked = checked;
+      else node.value = value;
+      node.dispatchEvent(new Event('input', { bubbles: true })); // 冒泡给组件监听器：信号跟着改，否则下次渲染又把旧值写回 DOM
+      if (boxed) node.dispatchEvent(new Event('change', { bubbles: true })); // 勾选类只认 change，input 未必触发
+    }
+    paint(null); // 红框与错误文案一起退场
+  };
+
   control.addEventListener('input', () => {
     if (mode === 'input' || error.textContent) void validateAsync(); // input 模式即时校验；其余模式仅清已报错误
   });
@@ -107,17 +123,24 @@ export function formItem(props: FormItemProps, control: HTMLElement): FormItemHa
   control.addEventListener('focusout', () => {
     if (mode !== 'submit') void validateAsync(); // 用会冒泡的 focusout 取代 blur，包裹式控件同样生效
   });
-  return { el, validate, validateAsync };
+  return { el, validate, validateAsync, reset };
 }
 
 /*** 表单容器：布局 + 原生 submit 拦截 + 聚合校验（全部通过才触发 onSubmit，异步规则会等待） ***/ 
 export function form(props: FormProps, items: FormItemHandle[]): HTMLElement {
   // —— 状态集中声明 ——
-  const submitBtn = button({ label: props.submitText ?? '提交', type: 'submit' }) as HTMLButtonElement; // 走原生 submit，避免 click + submit 双触发
-  const resetBtn = props.resetText ? button({ label: props.resetText, variant: 'ghost', type: 'button', onClick: props.onReset }) : null; // 重置不得提交表单
-  const actions = h('div', { class: 'ua-form-actions' }, submitBtn, resetBtn);
   const summary = h('div', { class: 'ua-form-summary', role: 'alert' }) as HTMLElement; // 错误汇总：读屏能一次听到共几处要改
   summary.hidden = true;
+  /*** 重置：逐项复位 + 收起汇总条，最后交给调用方回调（只跑回调等于点了没反应） ***/
+  const doReset = (): void => {
+    for (const item of items) item.reset();
+    summary.hidden = true;
+    summary.textContent = '';
+    props.onReset?.();
+  };
+  const submitBtn = button({ label: props.submitText ?? '提交', type: 'submit' }) as HTMLButtonElement; // 走原生 submit，避免 click + submit 双触发
+  const resetBtn = props.resetText ? button({ label: props.resetText, variant: 'ghost', type: 'button', onClick: doReset }) : null; // 重置不得提交表单
+  const actions = h('div', { class: 'ua-form-actions' }, submitBtn, resetBtn);
   let running = false; // 提交中标记：异步校验期间屏蔽重复提交
 
   /*** 整体提交：逐项 await 校验（全部跑完以显示所有错误），有错聚焦首个并中止 ***/