iter(g205): textField 支持密码显隐切换

.ua/index.json

@@ -1,6 +1,6 @@
 {
   "$schema": "ui-arch-registry-index/0.1",
-  "generatedAt": "2026-10-26T11:13:22.375Z",
+  "generatedAt": "2026-10-26T11:15:10.295Z",
   "repoRoot": ".",
   "packages": [
     {
@@ -410,6 +410,11 @@
                 "n": "size",
                 "t": "'sm' | 'md' | 'lg'",
                 "d": "高度档位：sm 紧凑 / md 默认 / lg 大触控目标，走 --ua-control-h-* 三档；缺省 md"
+              },
+              {
+                "n": "password",
+                "t": "boolean",
+                "d": "密码框：原生打点渲染，内置「显示/隐藏」切换按钮（aria-label 同步）；缺省普通文本"
               }
             ],
             "example": "const name = signal(''); const el = textField({ value: name, placeholder: '输入名字…', onInput: (v) => console.log(v) })",

llms-full.txt

@@ -1,6 +1,6 @@
 # @ui-arch 组件库 Agent 文档（无图形版）
 
-> 自动生成于 2026-10-26T11:13:22.375Z，数据源：各包 ua.manifest.json，勿手改。人类版文档站：apps/docs/index.html。
+> 自动生成于 2026-10-26T11:15:10.295Z，数据源：各包 ua.manifest.json，勿手改。人类版文档站：apps/docs/index.html。
 > 组件 = 普通函数，传 props 返回 DOM；状态用 signal 双向绑定：读 signal() 写 signal(v)。
 
 ## 快速上手
@@ -117,6 +117,7 @@ button({ label: '提交', variant: 'primary', onClick: () => console.log('clicke
 - clearable（默认 false）：boolean —— 开启后有值即显示一键清空按钮；缺省 false
 - maxCount：number —— 字数上限：同时设原生 maxlength，并在输入框内侧显示实时计数；缺省不限
 - size：'sm' | 'md' | 'lg' —— 高度档位：sm 紧凑 / md 默认 / lg 大触控目标，走 --ua-control-h-* 三档；缺省 md
+- password：boolean —— 密码框：原生打点渲染，内置「显示/隐藏」切换按钮（aria-label 同步）；缺省普通文本
 
 示例：
 

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 一键清空，maxCount 显示字数统计 ***/
+/*** 文本输入：value 信号双向绑定，disabled 支持布尔或信号禁用，onInput 为输入回调；prefix/suffix 包附加组，clearable 一键清空，password 密码显隐切换，maxCount 显示字数统计 ***/
 export function textField(props: TextFieldProps): HTMLElement {
   const el = h('input', { class: `ua-input${props.size && props.size !== 'md' ? ` is-${props.size}` : ''}`, placeholder: props.placeholder ?? '', disabled: props.disabled }) as HTMLInputElement; // false/undefined 移除属性，Signal 走响应式
   if (props.value) {
@@ -38,8 +38,28 @@ export function textField(props: TextFieldProps): HTMLElement {
     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) // 清空按钮 / 计数并入后置附加组
+  let eyeBtn: HTMLElement | null = null; // 密码显隐按钮；password 未开不创建
+  if (props.password) {
+    el.type = 'password'; // 原生打点渲染，避免自绘遮罩的安全坑
+    let shown = false;    // 当前是否明文
+    eyeBtn = h(
+      'button',
+      {
+        type: 'button',
+        class: 'ua-input-clear', // 复用清空按钮样式：同尺寸同位置，零新增 CSS
+        'aria-label': '显示密码',
+        onClick: () => {
+          shown = !shown;
+          el.type = shown ? 'text' : 'password';
+          eyeBtn!.textContent = shown ? '隐藏' : '显示'; // 文案即状态：按钮永远写「下一步动作」
+          eyeBtn!.setAttribute('aria-label', shown ? '隐藏密码' : '显示密码');
+        },
+      },
+      '显示',
+    );
+  }
+  const suffix = clearBtn || counter || eyeBtn
+    ? h('span', { class: 'ua-input-clear-group' }, clearBtn, eyeBtn, counter, props.suffix ?? null) // 清空 / 显隐 / 计数并入后置附加组
     : props.suffix;
   return addonWrap(el, props.prefix, suffix);
 }

packages/skin/ui/src/types.ts

@@ -39,6 +39,7 @@ export interface TextFieldProps {
   prefix?: string | HTMLElement;     // 输入框内侧前置附加块（如图标、货币符）；缺省不渲染
   suffix?: string | HTMLElement;     // 输入框内侧后置附加块（如单位）；缺省不渲染
   clearable?: boolean;               // 开启后有值时显示一键清空按钮；缺省不渲染
+  password?: boolean;                // 密码框：原生打点渲染并内置「显示/隐藏」切换按钮；缺省普通文本
   maxCount?: number;                 // 字数上限；传了即设原生 maxlength 并在输入框内侧显示实时计数
 }
 

packages/skin/ui/ua.manifest.json

@@ -281,6 +281,11 @@
             "n": "size",
             "t": "'sm' | 'md' | 'lg'",
             "d": "高度档位：sm 紧凑 / md 默认 / lg 大触控目标，走 --ua-control-h-* 三档；缺省 md"
+          },
+          {
+            "n": "password",
+            "t": "boolean",
+            "d": "密码框：原生打点渲染，内置「显示/隐藏」切换按钮（aria-label 同步）；缺省普通文本"
           }
         ],
         "example": "const name = signal(''); const el = textField({ value: name, placeholder: '输入名字…', onInput: (v) => console.log(v) })",