iter(g121): textField 补 maxCount 字数统计

packages/skin/ui/src/textField.ts

@@ -2,7 +2,7 @@ import { effect, h } from '@ui-arch/frame';
 import { addonWrap } from './addons.js';
 import type { TextFieldProps } from './types.js';
 
-/*** 文本输入：value 信号双向绑定，disabled 支持布尔或信号禁用，onInput 为输入回调；prefix/suffix 包附加组，clearable 一键清空 ***/
+/*** 文本输入：value 信号双向绑定，disabled 支持布尔或信号禁用，onInput 为输入回调；prefix/suffix 包附加组，clearable 一键清空，maxCount 显示字数统计 ***/
 export function textField(props: TextFieldProps): HTMLElement {
   const el = h('input', { class: 'ua-input', placeholder: props.placeholder ?? '', disabled: props.disabled }) as HTMLInputElement; // false/undefined 移除属性，Signal 走响应式
   if (props.value) {
@@ -30,6 +30,16 @@ export function textField(props: TextFieldProps): HTMLElement {
     el.addEventListener('input', syncClear);                                                 // 用户输入时同步
     effect(() => { if (props.value) props.value(); syncClear(); });                          // 外部写回时同步（读信号建依赖）
   }
-  const suffix = clearBtn ? h('span', { class: 'ua-input-clear-group' }, clearBtn, props.suffix ?? null) : props.suffix; // 清空按钮并入后置附加组
+  let counter: HTMLElement | null = null; // 字数统计块；maxCount 未传不创建
+  if (props.maxCount) {
+    el.setAttribute('maxlength', String(props.maxCount)); // 原生拦截超限输入
+    counter = h('span', { class: 'ua-input-count' });
+    const syncCount = (): void => { counter!.textContent = `${el.value.length}/${props.maxCount}`; }; // 实时 n/limit
+    el.addEventListener('input', syncCount);                          // 用户输入时同步
+    effect(() => { if (props.value) props.value(); syncCount(); });   // 初始与外部写回时同步（读信号建依赖）
+  }
+  const suffix = clearBtn || counter
+    ? h('span', { class: 'ua-input-clear-group' }, clearBtn, counter, props.suffix ?? null) // 清空按钮 / 计数并入后置附加组
+    : props.suffix;
   return addonWrap(el, props.prefix, suffix);
 }