AtomUI/docs/Desktop.Controls/Input/InputToken.md

# Input Design Token

Input 控件族使用两个组件级 Design Token：

- `LineEditToken`（Token ID: `"LineEdit"`）— 供 TextBox、LineEdit、SearchEdit 使用
- `TextAreaToken`（Token ID: `"TextArea"`）— 供 TextArea 使用

所有视觉属性均从全局 `SharedToken` 派生，不硬编码任何具体值。

---

## Token 资源访问方式

在 AXAML 中使用 LineEdit 组件级 Token：

```xml
{atom:LineEditTokenResource InputFontSize}
{atom:LineEditTokenResource InputFontSizeLG}
{atom:LineEditTokenResource InputFontSizeSM}
```

在 AXAML 中使用 TextArea 组件级 Token：

```xml
{atom:TextAreaTokenResource FontSize}
{atom:TextAreaTokenResource FontSizeLG}
{atom:TextAreaTokenResource ResizeHandleSize}
```

在 AXAML 中使用全局共享 Token：

```xml
{atom:SharedTokenResource ColorPrimary}
{atom:SharedTokenResource ControlHeight}
{atom:SharedTokenResource BorderRadius}
```

---

## LineEditToken 组件级 Token 一览

`LineEditToken`（Token ID: `"LineEdit"`）定义了 LineEdit / TextBox / SearchEdit 共用的组件级 Token。

### 字体 Token

| Token 名 | 类型 | 来源 | 说明 |
|---|---|---|---|
| `InputFontSize` | `double` | `SharedToken.FontSize` | 中号输入框字体大小 |
| `InputFontSizeLG` | `double` | `SharedToken.FontSizeLG` | 大号输入框字体大小 |
| `InputFontSizeSM` | `double` | `SharedToken.FontSizeSM` | 小号输入框字体大小 |

> `LineEditToken` 支持继承扩展：其构造函数为 `protected`，允许子 Token 类（如 `SearchEditToken`）复用字体计算逻辑。

---

## TextAreaToken 组件级 Token 一览

`TextAreaToken`（Token ID: `"TextArea"`）定义了 TextArea 专用的组件级 Token。

### 字体 Token

| Token 名 | 类型 | 来源 | 说明 |
|---|---|---|---|
| `FontSize` | `double` | `SharedToken.FontSize` | 中号文本域字体大小 |
| `FontSizeLG` | `double` | `SharedToken.FontSizeLG` | 大号文本域字体大小 |
| `FontSizeSM` | `double` | `SharedToken.FontSizeSM` | 小号文本域字体大小 |

### Resize 指示器 Token

| Token 名 | 类型 | 来源 | 说明 |
|---|---|---|---|
| `ResizeIndicatorLineColor` | `Color` | `SharedToken.ColorTextDescription` | 拖拽调整大小指示器线条颜色 |
| `ResizeHandleSize` | `double` | `SharedToken.SizeXS` | 拖拽手柄大小 |

### 内边距 Token

| Token 名 | 类型 | 来源 | 说明 |
|---|---|---|---|
| `RightAddOnPadding` | `Thickness` | `SharedToken.UniformlyPaddingSM - LineWidth` | 中号右侧装饰区域内边距 |
| `RightAddOnPaddingSM` | `Thickness` | `SharedToken.ControlPaddingHorizontalSM - LineWidth` | 小号右侧装饰区域内边距 |
| `RightAddOnPaddingLG` | `Thickness` | `SharedToken.ControlPaddingHorizontal - LineWidth` | 大号右侧装饰区域内边距 |

---

## 主题中使用的全局 SharedToken

除组件级 Token 外，Input 控件族的 ControlTheme 还直接引用了以下全局 `SharedToken`：

### 尺寸与布局

| Token 资源键 | 使用场景 |
|---|---|
| `ControlHeight` / `ControlHeightSM` / `ControlHeightLG` | 输入框高度（中/小/大） |
| `BorderRadius` / `BorderRadiusSM` / `BorderRadiusLG` | 圆角半径（中/小/大） |
| `FontHeight` / `FontHeightSM` / `FontHeightLG` | 行高（中/小/大） |
| `BorderThickness` | 默认边框厚度 |
| `LineWidth` | 线宽（用于计算内边距偏移） |
| `UniformlyPaddingXXS` | 内部元素间距（清除按钮、密码按钮之间） |
| `UniformlyPaddingSM` | 中号内边距 |
| `ControlPaddingHorizontal` | 控件水平内边距 |
| `ControlPaddingHorizontalSM` | 小号控件水平内边距 |

### 颜色

| Token 资源键 | 使用场景 |
|---|---|
| `ColorPrimary` | 主色调（搜索按钮 Primary 样式、图标高亮） |
| `ColorBorder` | 默认边框颜色 |
| `ColorText` | 默认文本颜色（光标颜色） |
| `ColorTextPlaceholder` | 占位文本颜色、字符计数颜色 |
| `ColorTextDisabled` | 禁用态文本颜色 |
| `ColorTextDescription` | Resize 指示器线条颜色 |
| `ColorErrorText` | 错误状态文本颜色（Borderless / Filled 变体） |
| `ColorWarningText` | 警告状态文本颜色（Borderless / Filled 变体） |
| `SelectionBackground` | 文本选区背景色 |
| `SelectionForeground` | 文本选区前景色 |

### 动画与交互

| Token 资源键 | 使用场景 |
|---|---|
| `EnableMotion` | 全局动画开关（控制 `IsMotionEnabled` 默认值） |

---

## Token 对外观的具体影响

### 尺寸与 Token 映射

| 尺寸 | 高度 | 字号 (LineEdit) | 字号 (TextArea) | 圆角 | 行高 |
|---|---|---|---|---|---|
| `Large` | `ControlHeightLG` | `InputFontSizeLG` | `FontSizeLG` | `BorderRadiusLG` | `FontHeightLG` |
| `Middle` | `ControlHeight` | `InputFontSize` | `FontSize` | `BorderRadius` | `FontHeight` |
| `Small` | `ControlHeightSM` | `InputFontSizeSM` | `FontSizeSM` | `BorderRadiusSM` | `FontHeightSM` |

### 样式变体与 Token 映射

样式变体的颜色映射主要由内部 `AddOnDecoratedBox` 控件的主题控制，各变体使用以下 SharedToken：

| 样式变体 | 边框颜色 | 背景色 | 焦点态 |
|---|---|---|---|
| **Outline** | `ColorBorder` | `ColorBgContainer` | 主色调边框 + 外发光 |
| **Filled** | 透明 | `ColorFillTertiary` | 主色调边框 + 外发光 |
| **Borderless** | 透明 | 透明 | 无边框无外发光 |
| **Underlined** | 底部 `ColorBorder` | 透明 | 主色调底部边框 |

### 验证状态与 Token 映射

| 验证状态 | 边框颜色 | 文本颜色（Borderless/Filled） |
|---|---|---|
| **Default** | `ColorBorder` | `ColorText` |
| **Error** | `ColorError` | `ColorErrorText` |
| **Warning** | `ColorWarning` | `ColorWarningText` |

### 禁用态

禁用时：
- 文本颜色变为 `ColorTextDisabled`
- 背景色变为 `ColorBgContainerDisabled`（Outline 变体）
- 占位文本颜色保持 `ColorTextPlaceholder`

### TextArea 特有 Token 影响

- `ResizeIndicatorLineColor`：控制右下角拖拽手柄的两条指示线颜色
- `ResizeHandleSize`：控制拖拽手柄的热区大小
- `RightAddOnPadding` / `RightAddOnPaddingSM` / `RightAddOnPaddingLG`：控制清除按钮、反馈图标等右侧装饰元素与文本域边缘的距离