SepInput 输入框组件测试

0. HTML 声明式标签 — SepBase.autoInit() 自动驱动

HTML 声明式标签 ↕

1. 基础类型

HTML 声明式标签 ↕

默认

Textarea

密码（外部 SepTooltip 提示）

JS API 初始化

默认

Textarea

密码（外部 SepTooltip + 帮助）

数字（number）

金额（amount）

金额（precision=2, min=0, max=9999999）

2. 三种尺寸

HTML 声明式标签 ↕

Small

Middle（默认）

Large

JS API 初始化

Small

Middle（默认）

Large

3. 状态

HTML 声明式标签 ↕

禁用

只读

Error

Warning

JS API 初始化

禁用

只读

Error

Warning

4. prefix / suffix

HTML 声明式标签 ↕

金额（prefix ¥）

域名（suffix .com）

两边都有

JS API 初始化

金额（prefix）

域名（suffix）

两边都有

5. addonBefore / addonAfter

HTML 声明式标签 ↕

网址（addonBefore）

单位（addonAfter）

前后都有

Small + addon

Large + addon

Error 状态 + addon

Filled + addon

Borderless + addon

Disabled + addon

前缀图标（SVG）

后缀按钮（SepButton）

前缀图标 + 后缀按钮

JS API 初始化

网址

单位

前后都有

Small + addon

Large + addon

Error 状态 + addon

Filled + addon

Borderless + addon

Disabled + addon

前缀图标（SVG）

后缀 SepButton 按钮

前缀图标 + 后缀按钮

6. allowClear + showCount

HTML 声明式标签 ↕

可清除

字数统计

清除 + 计数

JS API 初始化

可清除

字数统计

清除 + 计数

7. bordered / Group

HTML 声明式标签 ↕

无边框（bordered=false）

variant=filled

variant=borderless

Group 组合

JS API 初始化

无边框

variant=filled

variant=borderless

Group 组合

8. 精简单模式（native: true）

HTML 声明式标签 ↕

默认 text

password

textarea

number

disabled

无边框

Small + required

Error + Large

JS API 初始化

默认（text）

密码

Textarea

数字

禁用

Error 状态

Small

Large

无边框

9. API 方法测试

setValue / getValue

10. variant 变体

HTML 声明式标签 ↕

Outlined（默认）

Borderless

Filled

JS API 初始化

Outlined（默认）

Borderless

Filled

11. controls 数字步进

HTML 声明式标签 ↕

Number + Controls

Amount + Controls

Disabled Controls

JS API 初始化

Number + Controls

Amount + Controls

Disabled Controls

12. required / pattern

HTML 声明式标签 ↕

Required + 外部 Tooltip

Required + Small

Required + Large

Required + variant=filled

Pattern + 外部 Tooltip

Required + Borderless

Required + Disabled

Required Native

Required Native Small

Required Native Large

Required Native Filled

Required Native + Number

JS API 初始化

Required

Pattern（手机号 + 外部 Tooltip 帮助）

Required Small

Required Large

Required Filled

Required Borderless

Required Disabled

Required Native

Required Native Small

Required Native Large

Required Native Filled

Required Native + Number

13. countFormatter 自定义字数

HTML 声明式标签 ↕

countFormatter 自定义格式

JS API 初始化

自定义格式（超 80% 变红）

14. className / style / inputStyle

HTML 声明式标签 ↕

className + style + inputStyle

JS API 初始化

style + inputStyle 全定制

15. spellCheck

HTML 声明式标签 ↕

spellCheck 拼写检查

JS API 初始化

SpellCheck

16. onKeyDown / onCompositionStart/End

事件日志

17. 外部 SepTooltip 统一驱动（推荐）

HTML 声明式标签 ↕

SepInput 不再内置 ❓ 气泡，tooltip / 帮助 / 校验提示统一由外部 SepTooltip 组件接管。支持 12 方位 / focus|contextmenu|hover 触发 / ESC 关闭 / 关闭按钮 / offset / showArrow / zIndex 细控 / DOM 节点内容。通过 input.subscribe() 监听 status 变化自动切换气泡类型与内容，不强依赖也不影响布局。

用户名（普通提示 + topLeft）

密码（help + topRight + 关闭按钮）

手机号（Pattern + 状态提示）

邮箱（error 状态提示）

Warning 状态

rightBottom + 无箭头

help + 校验提示共存

动态刷新（密码强度）

trigger=focus（聚焦自动弹，失焦关）

trigger=contextmenu（右键弹出菜单）

JS API 初始化

手机号（Pattern + status 跟随 warning/error）

邮箱（error → 自动弹出，ESC / × / 点外部三方式关）

Warning 状态 → warning 型气泡

placement=rightBottom（角落对齐）+ 无箭头

help + 校验提示共存（subscribe 切换）

动态刷新（密码强度 + × 关闭 + offset=12）

DOM 内容 + 自定义 zIndex + bottomRight

手动模式 manual + 按钮 API

SepInput 输入框组件

0. HTML 声明式标签 — SepBase.autoInit() 自动驱动

1. 基础类型

2. 三种尺寸

3. 状态

4. prefix / suffix

5. addonBefore / addonAfter

6. allowClear + showCount

7. bordered / Group

8. 精简单模式（native: true）

9. API 方法测试

10. variant 变体

11. controls 数字步进

12. required / pattern

13. countFormatter 自定义字数

14. className / style / inputStyle

15. spellCheck

16. onKeyDown / onCompositionStart/End

17. 外部 SepTooltip 统一驱动（推荐）

18. 自动化断言

19. 性能基准 — SepInput vs Native DOM

SepInput 输入框组件

0. HTML 声明式标签 — SepBase.autoInit() 自动驱动 📋 示例代码

1. 基础类型 📋 示例代码

2. 三种尺寸 📋 示例代码

3. 状态 📋 示例代码

4. prefix / suffix 📋 示例代码

5. addonBefore / addonAfter 📋 示例代码

6. allowClear + showCount 📋 示例代码

7. bordered / Group 📋 示例代码

8. 精简单模式（native: true） 📋 示例代码

9. API 方法测试 📋 示例代码

10. variant 变体 📋 示例代码

11. controls 数字步进

12. required / pattern 📋 示例代码

13. countFormatter 自定义字数 📋 示例代码

14. className / style / inputStyle 📋 示例代码

15. spellCheck 📋 示例代码

16. onKeyDown / onCompositionStart/End 📋 示例代码

17. 外部 SepTooltip 统一驱动（推荐） 📋 示例代码

18. 自动化断言

19. 性能基准 — SepInput vs Native DOM

0. HTML 声明式标签 — SepBase.autoInit() 自动驱动

1. 基础类型

2. 三种尺寸

3. 状态

4. prefix / suffix

5. addonBefore / addonAfter

6. allowClear + showCount

7. bordered / Group

8. 精简单模式（native: true）

9. API 方法测试

10. variant 变体

12. required / pattern

13. countFormatter 自定义字数

14. className / style / inputStyle

15. spellCheck

16. onKeyDown / onCompositionStart/End

17. 外部 SepTooltip 统一驱动（推荐）