codewave-openclaw-installer 1.0.0

package/skills/smart-customer-service/docs/codewave/20./345/272/224/347/224/250/345/274/200/345/217/221/10./351/241/265/351/235/242/350/256/276/350/256/241/28.H5/347/253/257Vue3/347/273/204/344/273/266/350/257/264/346/230/216/060./350/241/250/345/215/225/050./345/274/200/345/205/263.md

@@ -0,0 +1,134 @@
+# 开关
+
+<span class="tag-blue">Vue3</span> <span class="tag-yellow">H5</span>
+
+用于在打开和关闭状态之间进行切换。
+
+<img src="../assets/kaiguan_202509121437_1.png" class="imgStyle" style="width:175px;" />
+
+<div class="highlight">
+
+在本章节，你将学习：
+
+1. 开关的各类属性、事件、可访问属性等基础信息。
+2. 如何使用开关的各类属性，具体实现效果包括但不限于：
+
+   * 使用开关的“值”属性，以实现获得开关状态以及通过修改绑定变量来控制开关的状态。
+   * 使用开关的“禁用”属性，以实现对开关是否可操作的控制。
+   * 使用开关的“尺寸”、“开启颜色”、“关闭颜色”属性，以实现对开关的样式进行配置。
+
+3. 如何使用开关的各类事件，具体实现效果包括但不限于：
+
+   * 使用开关的“点击时”事件，以实现对开关点击的监听。
+   * 使用开关的“值改变时”事件，以获取当前开关状态用以某些操作的判断，例如开关开启才会加载数据等操作。
+
+</div>
+
+## 属性
+
+> 组件通用属性请参见[组件通用属性说明](../../17.组件通用属性说明.md)。
+
+### 数据属性
+
+- 值：开关当前是否开启，Boolean类型。默认开启编辑表达式功能，编辑表达式时通常直接绑定变量，如果开启“是否将组件输入赋值给变量“，会根据开关的开启状态改变变量的值，也会根据变量的值展示开关的开启状态。
+
+### 主要属性
+
+> 在表单中使用开关时包含表单类属性，详情可见[表单](010.表单.md)组件文档。
+
+- 禁用：Boolean类型。置灰显示，且禁止任何交互，如焦点、点击、切换状态等。
+- 加载状态：Boolean类型。开关是否处于加载中状态。
+
+    <img src="../assets/kaiguan_202509121437_2.png" class="imgStyle" style="width:175px;" />
+
+- 尺寸：开关的大小，默认单位px。
+- 开启颜色：开关开启状态的颜色。支持输入RGB、RGBA、Hex、颜色英文代码。
+- 关闭颜色：开关关闭状态的颜色。支持输入RGB、RGBA、Hex、颜色英文代码。
+
+## 事件
+
+| **事件名** | **描述**         |
+| :------ | :--------------- |
+| 点击时     | 开关被点击后触发该事件中的逻辑  |
+| 值改变时    | 开关状态改变后触发该事件中的逻辑 |
+
+**值变化时**
+
+- 事件概述：开关状态改变后触发该事件中的逻辑。
+- 输入参数：事件的输入参数event由应用自动生成，支持在事件逻辑中获取输入参数的值。
+
+    <img src="../assets/kaiguan_202509121437_3.png" class="imgStyle" style="width:200px;" />
+
+    - event：Boolean或String或Integer类型，开关当前是否开启。
+
+## 可访问属性
+
+在编写表达式或使用前端逻辑时，可以通过“变量或常量“使用开关组件的[可访问属性](../../19.组件可访问属性.md)，可访问属性有：
+
+<img src="../assets/kaiguan_202509121437_4.png" class="imgStyle" style="width:300px;" />
+
+- \_if（显示条件）：Boolean类型，开关是否显示，值与“显示条件”属性对齐。支持获取和赋值。
+
+## 样式
+
+> 组件通用样式请参见[组件通用样式说明](../../18.组件通用样式说明.md)。
+
+### 主题样式
+
+- size：开关尺寸
+- width：开关宽度
+- height：开关高度
+- node-size：开关节点尺寸
+- node-background：开关节点背景色
+- node-shadow：开关节点阴影
+- background：开关背景色
+- on-background：开关开启状态背景色
+- duration：开关过渡动画时长
+- disabled-opacity：开关禁用状态透明度
+
+组件支持在**样式**->**主题样式**中调整当前单个组件的主题样式；也支持在**自定义主题样式**->**组件主题配置**中调整当前类型组件在应用中的所有样式，并支持直接预览效果。
+
+> 推荐前往组件主题配置中查看各主题样式的效果，相关文档请参考[自定义主题样式](../../../60.可视化开发界面/70.更多设置/30.自定义主题样式.md)。
+
+<img src="../assets/kaiguan_202509121437_5.png" class="imgStyle" style="" />
+
+<div style="text-align: right;font-size: 14px;">
+    <span style="color: rgb(78, 110, 142);">创建人：</span>
+    <span style="color: rgb(118, 118, 118);">有鲤</span>
+    <span style="color: rgb(78, 110, 142);margin: 0 0 0 40px;">更新时间：</span>
+    <span style="color: rgb(118, 118, 118);">2025年09月12日</span>
+</div>
+<style>
+.tag-blue {
+    display: inline-block;
+    padding: 0.5px 10px;
+    border-radius: 9999px;
+    font-size: 0.75rem;
+    font-weight: 500;
+    margin-bottom: 1rem;
+    background-color: #dbeafe; /* 浅蓝色背景 */
+    color: #2563eb; /* 深蓝色文字 */
+}
+.tag-yellow {
+    display: inline-block;
+    padding: 0.5px 10px;
+    border-radius: 9999px;
+    font-size: 0.75rem;
+    font-weight: 500;
+    margin-bottom: 1rem;
+    background-color: #fef3c7; /* 浅黄色背景 */
+    color: #d97706; /* 深黄色文字 */
+}
+
+</style>
+
+<style>
+ .highlight {
+    background-color: #eaf6ff;
+    border-color: #679CF8;
+    border-left-width: 0.2rem;
+    border-left-style: solid;
+    padding: 1rem 1rem 1rem 1rem;
+    margin: 1rem 0px;
+}
+</style>

package/skills/smart-customer-service/docs/codewave/20./345/272/224/347/224/250/345/274/200/345/217/221/10./351/241/265/351/235/242/350/256/276/350/256/241/28.H5/347/253/257Vue3/347/273/204/344/273/266/350/257/264/346/230/216/060./350/241/250/345/215/225/060./345/244/215/351/200/211/346/241/206/347/273/204.md

@@ -0,0 +1,296 @@
+# 复选框组
+
+<span class="tag-blue">Vue3</span> <span class="tag-yellow">H5</span>
+
+
+在一组备选项中进行多选。
+
+<img src="../assets/fuxuankuangzu_20260104175509_1.png" class="imgStyle" style="width:300px" />
+
+<div class="highlight">
+
+在本章节，你将学习：
+
+1. 复选框组的各类属性，事件，可访问属性等基础信息。
+2. 如何使用复选框组的各类属性，具体实现效果包括但不限于：
+
+   * 如何使用复选框组的“数据源”属性，以实现动态生成多选项。
+   * 如何使用复选框组的“最大选中数量”属性，以实现控制多选项选择数量。
+   * 如何使用复选框组的“排列方向”属性，以实现控制多选项的排列方向，可选水平、垂直。
+
+3. 如何使用复选框的“插槽”，以修改复选框的展示效果。
+4. 示例一：如何设置静态多选组。
+5. 示例二：如何设置动态多选组。
+
+</div>
+
+
+
+## 属性
+
+> 组件通用属性请参见[组件通用属性说明](../../17.组件通用属性说明.md)。
+
+### 复选框组
+
+<img src="../assets/fuxuankuangzu_20260104175509_2.png" class="imgStyle" style="width:300px" />
+
+支持通过添加复选框的方式形成一个固定选项数量的复选框组。多选项中默认包含文本组件，支持替换为其他组件。
+
+#### 数据属性
+
+* 选中值：当前选中的复选框的值。`List<V>`类型，V的数据类型与复选框组的“值字段”属性或复选框的“标识符”属性有关。默认开启编辑表达式功能。编辑表达式时通常直接绑定变量，如果开启“是否将组件输入赋值给变量“，会根据选择的复选框的值改变变量的值，也会根据变量的值展示当前选择的复选框。
+* 数据源：除了直接添加复选框的方式外，复选框组可通过绑定数据源实现动态复选框组的效果。数据源可以绑定 `List<T>`类型变量或输出参数为数组或包含 `List<T>`的匿名数据结构的逻辑，List中的T可以是任意类型（包括 `List<T>`、联合类型）。
+
+    <div class="highlight">
+
+    当复选框组绑定数据源后，应用自动生成current变量。复选框组会根据数据源中包含的 List 按顺序对每一项进行循环遍历，使用current即可指代在 List 中当前正在访问或操作的对象。为**复选框**或其中的组件编辑表达式或添加事件，即可调用current变量：
+
+    <img src="../assets/fuxuankuangzu_20260104175509_3.png" class="imgStyle" style="width:200px" />
+
+    **所有可绑定数据源的组件同理。**
+
+    在复选框组的属性中设置任意字段（如值字段）时，同样根据字段值进行循环遍历，但不显示其 current.item 前缀。
+
+    </div>
+
+
+    操作步骤：
+
+    1. 点击“请选择表达式”进入编辑表达式页面，通过拖入变量、使用调用逻辑组件等方式设置数据源。
+
+        <img src="../assets/fuxuankuangzu_20260104175509_4.png" class="imgStyle" style="" />
+
+    2. 选择“值字段”和“文本字段”，用于获取选中值和动态展示选项。
+
+        <img src="../assets/fuxuankuangzu_20260104175509_5.png" class="imgStyle" style="width:300px" />
+
+    3. （可选）除了选择“文本字段”外，还可以向复选框内容中拖拽需要展示为选项的组件，为组件绑定数据源中的current.item或其属性，实现动态展示选项。例如拖入文本，并动态获取文本内容。
+
+        <img src="../assets/fuxuankuangzu_20260104175509_6.png" class="imgStyle" style="" />
+
+* 数据类型：数据源返回的数据结构的类型，自动识别类型进行展示说明，为只读状态无法修改。
+* 最大选中数量：Integer类型。复选框组可以选中复选框的最大数量。
+* 值字段：绑定数据源后，依据该字段动态加载复选框的值。用于指定“选中值”属性。
+* 文本字段：绑定数据源后，依据该字段动态加载复选框的选项文本。
+
+#### 主要属性
+
+> 在表单中使用输入框时包含表单类属性，详情可见[表单](../060.表单/010.表单.md)组件文档。
+
+* 排列方向：设置复选框组中选项的排列方向，支持水平和垂直两个方向。
+
+    <img src="../assets/fuxuankuangzu_20260104175509_7.png" class="imgStyle" style="width:300px" />
+
+* 是否禁用：Boolean类型。是否置灰显示，且禁止任何交互，如焦点、点击、选择等。
+* 形状：选择框的形状，可选圆形和方形。
+
+    <img src="../assets/fuxuankuangzu_20260104175509_8.png" class="imgStyle" style="width:300px" />
+
+* 图标大小：Integer类型，选择框的大小，默认单位px。
+
+### 复选框
+
+#### 数据属性
+
+* 标识符：当前复选框的值。当选项被选中时，复选框组的“选中值”即包含该值。
+* 是否复选框组绑定：Boolean类型。是否与复选框组绑定。
+
+#### 主要属性
+
+* 是否禁用：Boolean类型。当前复选框是否置灰显示，且禁止任何交互，如焦点、点击、选择等。优先级高于复选框组的“是否禁用”属性。
+* 形状：当前复选框选择框的形状，可选圆形和方形。优先级高于复选框组的“形状”属性。
+* 图标大小：Integer类型，当前复选框选择框的大小，默认单位px。优先级高于复选框组的“图标大小”属性。
+* 是否禁用文本：Boolean类型。当前复选框内搭文本是否置灰显示，且禁止任何交互，如焦点、点击等。
+* 文本位置：复选框的插槽相对于选择框的位置，可选左侧和右侧。
+* 选中颜色：选择框被选中时的背景色。支持输入RGB、RGBA、Hex、颜色英文代码。
+
+    <img src="../assets/fuxuankuangzu_20260104175509_9.png" class="imgStyle" style="width:100px" />
+
+* 是否半选：Boolean类型。是否为“不确定”选择状态。
+
+    <img src="../assets/fuxuankuangzu_20260104175509_10.png" class="imgStyle" style="width:100px" />
+
+## 事件
+
+### 复选框组
+
+| **事件名** | **描述**                 |
+| ---------------- | ------------------------------ |
+| 值改变时         | 选中项改变后触发该事件中的逻辑 |
+
+**值改变时**
+
+* 逻辑概述：选中项改变后触发该事件中的逻辑。
+* 输入参数：事件的输入参数value由应用自动生成，支持在事件逻辑中获取输入参数的值。
+
+    <img src="../assets/fuxuankuangzu_20260104175509_11.png" class="imgStyle" style="width:200px" />
+
+    * value：`List<V>`。V的数据类型与复选框组的“值字段”属性或复选框的“标识符”属性有关。当前选择的复选框的值。
+
+### 复选框
+
+| **事件名** | **描述**                             |
+| ---------------- | ------------------------------------------ |
+| 点击时           | 当前选项被点击时触发该事件中的逻辑         |
+| 值改变时         | 当前选项的选中状态改变后触发该事件中的逻辑 |
+
+**改变后**
+
+* 逻辑概述：当前选项的选中状态改变后触发该事件中的逻辑。
+* 输入参数：事件的输入参数value由应用自动生成，支持在事件逻辑中获取输入参数的值。
+
+    <img src="../assets/fuxuankuangzu_20260104175509_12.png" class="imgStyle" style="width:200px" />
+
+    * value：Boolean类型。当前复选框是否被选中。
+
+## 可访问属性
+
+在编写表达式或使用前端逻辑时，可以通过“变量或常量“使用复选框组组件的[可访问属性](../../19.组件可访问属性.md)，可访问属性有：
+
+<img src="../assets/fuxuankuangzu_20260104175509_13.png" class="imgStyle" style="width:300px" />
+
+**复选框组**
+
+* _if（显示条件）：Boolean类型，复选框组是否显示，值与“显示条件”属性对齐。支持获取和赋值。
+
+**复选框**
+
+* _if（显示条件）：Boolean类型，复选框是否显示，值与“显示条件”属性对齐。支持获取和赋值。
+
+## 组件逻辑
+
+页面添加复选框组组件后，支持调用复选框组的内置逻辑，内置逻辑有：
+
+| **逻辑名** | **描述**           |
+| ---------------- | ------------------------ |
+| reload           | 清除缓存，重新加载数据。 |
+
+<img src="../assets/fuxuankuangzu_20260104175509_14.png" class="imgStyle" style="width:300px" />
+
+### reload
+
+* 逻辑概述：清除缓存，重新加载数据。适用于复选框组的数据源使用调用逻辑或内置函数的情况。
+* 其他说明：
+
+  * 当复选框组的数据源使用调用逻辑并添加了监听变量，被监听的变量改变时将自动触发复选框组的reload。详细说明请参考[组件通用属性说明](../../17.组件通用属性说明.md)-监听变量。
+  * 当复选框组的数据源为调用逻辑或内置函数时，在新增、修改、删除数据等操作后，一般调用reload逻辑重新加载表格数据，用户修改信息后会即时呈现数据；当复选框组的数据源为变量时，变量支持在事件发生后动态更新，无需调用逻辑重新加载。
+
+## 插槽
+
+复选框组组件中包含插槽，支持拖拽放置其他组件：
+
+* 复选框包含插槽，用于指示复选框展示的内容。若复选框组绑定数据源，插槽中的组件支持根据复选框组的数据源来配置信息并动态加载。
+
+    <img src="../assets/fuxuankuangzu_20260104175509_15.png" class="imgStyle" style="width:300px" />
+
+## 样式
+
+> 组件通用样式请参见[组件通用样式说明](../../18.组件通用样式说明.md)。
+
+### 主题样式
+
+* --van-checkbox-size：复选框尺寸
+* --van-checkbox-border-color：复选框边框颜色
+* --van-checkbox-duration：复选框过渡动画时长
+* --van-checkbox-label-margin：复选框标签边距
+* --van-checkbox-label-color：复选框标签颜色
+* --van-checkbox-checked-icon-color：复选框选中图标颜色
+* --van-checkbox-disabled-icon-color：复选框禁用图标颜色
+* --van-checkbox-disabled-label-color：复选框禁用标签颜色
+* --van-checkbox-disabled-background：复选框禁用背景色
+
+组件支持在**样式**->**主题样式**中调整当前单个组件的主题样式；也支持在**自定义主题样式**->**组件主题配置**中调整当前类型组件在应用中的所有样式，并支持直接预览效果。
+
+> 推荐前往组件主题配置中查看各主题样式的效果，相关文档请参考[自定义主题样式](../../../60.可视化开发界面/70.更多设置/30.自定义主题样式.md)。
+
+<img src="../assets/fuxuankuangzu_20260104175509_16.png" class="imgStyle" style="" />
+
+## 示例一：如何设置静态复选框组
+
+### 效果展示
+
+<img src="../assets/fuxuankuangzu_20260104175509_17.gif" class="imgStyle" style="width:300px" />
+
+### 操作步骤
+
+1. 为复选框组添加复选框，并设置选项的文本以及标识符。
+
+    <img src="../assets/fuxuankuangzu_20260104175509_18.png" class="imgStyle" style="" />
+
+    <img src="../assets/fuxuankuangzu_20260104175509_19.png" class="imgStyle" style="" />
+
+2. 页面下创建类型为 `List<String>`的变量selectValue作为复选框组的选中值。
+
+    <img src="../assets/fuxuankuangzu_20260104175509_20.png" class="imgStyle" style="" />
+
+3. 拖入一个文本组件，并通过表达式赋值将文本内容设置为selectValue，用于展示选中值。
+
+    <img src="../assets/fuxuankuangzu_20260104175509_21.png" class="imgStyle" style="" />
+
+4. 预览查看效果。
+
+## 示例二：如何设置动态复选框组
+
+### 效果展示
+
+<img src="../assets/fuxuankuangzu_20260104175509_22.png" class="imgStyle" style="width:300px" />
+
+### 操作步骤
+
+**前提条件**：已有查询学生实体的服务端逻辑loadStudentInfo。
+
+<img src="../assets/fuxuankuangzu_20260104175509_23.png" class="imgStyle" style="" />
+
+1. 选中多选框组，然后进入数据源的表达式赋值界面，将该逻辑拖入后返回，如下图：
+
+    <img src="../assets/fuxuankuangzu_20260104175509_24.png" class="imgStyle" style="" />
+
+    <img src="../assets/fuxuankuangzu_20260104175509_25.png" class="imgStyle" style="" />
+
+2. 配置复选框组的值字段以及文本字段，如下图：
+
+    <img src="../assets/fuxuankuangzu_20260104175509_26.png" class="imgStyle" style="" />
+
+3. 发布预览查看效果。
+
+
+<style>
+ .highlight {
+    background-color: #eaf6ff;
+    border-color: #679CF8;
+    border-left-width: 0.2rem;
+    border-left-style: solid;
+    padding: 1rem 1rem 1rem 1rem;
+    margin: 1rem 0px;
+}
+</style>
+
+<style>
+  .tag-blue {
+      display:inline-block;
+      padding:0.5px 10px;
+      border-radius:9999px;
+      font-size:0.75rem;
+      font-weight:500;
+      margin-bottom:1rem;
+      background-color:#dbeafe;
+      color:#2563eb;
+}
+.tag-yellow {
+      display:inline-block;
+      padding:0.5px 10px;
+      border-radius:9999px;
+      font-size:0.75rem;
+      font-weight:500;
+      margin-bottom:1rem;
+      background-color:#fef3c7;
+      color:#d97706;
+}
+</style>
+
+<div style="text-align: right;font-size: 14px;">
+    <span style="color: rgb(78, 110, 142);">创建人：</span>
+    <span style="color: rgb(118, 118, 118);">有鲤</span>
+    <span style="color: rgb(78, 110, 142);margin: 0 0 0 40px;">更新时间：</span>
+    <span style="color: rgb(118, 118, 118);">2026年01月04日</span>
+</div>

package/skills/smart-customer-service/docs/codewave/20./345/272/224/347/224/250/345/274/200/345/217/221/10./351/241/265/351/235/242/350/256/276/350/256/241/28.H5/347/253/257Vue3/347/273/204/344/273/266/350/257/264/346/230/216/060./350/241/250/345/215/225/070./350/276/223/345/205/245/346/241/206.md

@@ -0,0 +1,212 @@
+# 输入框
+
+<span class="tag-blue">Vue3</span> <span class="tag-yellow">H5</span>
+
+
+用户可以在文本框内输入或编辑文字。
+
+<img src="../assets/shurukuang_20260105103909_1.png" class="imgStyle" style="width:300px" />
+
+<div class="highlight">
+
+在本章节，你将学习：
+
+1. 输入框组件的各类属性、事件、可访问属性等基础信息。
+
+2. 如何使用输入框组件的各类属性，具体实现效果包括但不限于：
+
+   * 使用输入框的“值”属性，以实现实时获取到输入框中输入的内容，也可以通过修改绑定变量的值来改变输入框中的内容。
+   * 使用输入框的“类型”属性，来控制输入框中输入内容的类型，可选文本、密码、数字、邮箱、电话、多行文本。
+   * 使用输入框的“最大文本长度”属性，以实现控制输入框中允许输入的内容的长度。
+   * 使用输入框的“冒号”属性，以控制输入框与标签之间是否显示冒号。
+   * 使用输入框的“标签对齐方式”、“输入框对齐方式”属性，来设置标签与输入框的排布样式，可选左对齐、顶部对齐、右对齐。
+   * 使用输入框的“多行文本行数”、“自动调整高度”、“显示字数统计”属性，以实现当类型为多行文本时对输入框的展示以及样式进行配置。
+
+</div>
+
+
+
+## 属性
+
+> 组件通用属性请参见[组件通用属性说明](../../17.组件通用属性说明.md)。
+
+### 数据属性
+
+* 值：String类型。输入框中的内容。默认开启编辑表达式功能。
+  * 关闭编辑表达式时支持手动输入值，适用输入值无需更改的场景，例如开启“禁用”属性时，输入值仅作展示。
+
+    <img src="../assets/shurukuang_20260105103909_2.png" class="imgStyle" style="width:300px" />
+
+  * 编辑表达式时若直接绑定变量，支持开启“是否将组件输入赋值给变量“，开启时会根据输入的内容改变变量的值，也会根据变量的值展示输入框中的内容。
+
+    <img src="../assets/shurukuang_20260105103909_3.png" class="imgStyle" style="" />
+
+### 主要属性
+
+> 在表单中使用输入框时包含表单类属性，详情可见[表单](../060.表单/010.表单.md)组件文档。
+
+* 类型：输入框的类型，用于限制输入内容的格式或展示效果。可选文本、密码、数字、邮箱、电话、多行文本。
+
+<div class="highlight">
+
+开启编辑表达式后，可复制选项标识来配置表达式的值。用于标识“类型”属性不同选项的对应值如下图：
+
+<img src="../assets/shurukuang_20260105103909_4.png" class="imgStyle" style="width:45%" />,<img src="../assets/shurukuang_20260105103909_5.png" class="imgStyle" style="width:45%" />
+
+</div>
+
+
+
+* 占位符：输入框为空时显示的文本。
+* 开启点击反馈：Boolean类型，是否在聚焦输入框时有短暂的 “按压动效”让用户感知到点击操作已触发。
+* 可清空：Boolean类型。输入框输入内容后是否展示清空按钮，支持点击按钮清空输入。
+* 禁用：Boolean类型。是否置灰显示，且禁止任何交互，如焦点、点击、输入等。
+* 只读：Boolean类型。是否正常显示，但禁止输入。
+* 最大文本长度：可以输入的最大文本长度，一个中文等于一个计数长度。默认为空，即表示不限制输入长度。
+* 冒号：Boolean类型。是否在标签后显示冒号。输入框在表单中时该属性名称为“显示冒号”。
+
+    <img src="../assets/shurukuang_20260105103909_6.png" class="imgStyle" style="width:300px" />
+
+* 尺寸：输入框的大小，可选正常和大。
+* 前缀图标：输入框最左侧显示的图标，支持从图标库选择图标、上传自定义SVG格式图标或编辑表达式。具体使用方法请参考[图标](../040.展示/120.图标.md)组件的“图标”属性。
+
+    <img src="../assets/shurukuang_20260105103909_7.png" class="imgStyle" style="width:300px" />
+
+* 后缀图标：输入框最右侧显示的图标，支持从图标库选择图标、上传自定义SVG格式图标或编辑表达式。具体使用方法请参考[图标](../040.展示/120.图标.md)组件的“图标”属性。
+
+    <img src="../assets/shurukuang_20260105103909_8.png" class="imgStyle" style="width:300px" />
+
+* 标签宽度：自定义输入框左侧标签插槽的宽度。
+
+    <img src="../assets/shurukuang_20260105103909_9.png" class="imgStyle" style="width:300px" />
+
+* 自动聚焦：Boolean类型。在进入页面时，是否自动聚焦到该组件，默认关闭。
+* 多行文本行数：Integer类型。设置输入框中内容的展示行数，默认为3行。只有“类型”属性选择了多行文本时可配置。
+* 自动调整高度：Boolean类型。是否根据内容自动扩展输入框高度，避免滚动条出现。只有“类型”属性选择了多行文本时可配置。
+* 标签对齐方式：输入框左侧标签的布局方式，包括左对齐、顶部对齐、右对齐。
+* 输入框对齐方式：输入框右侧文本内容的布局方式，包括左对齐、居中、右对齐。
+* 错误状态：Boolean类型。是否将右侧输入内容标红。
+
+    <img src="../assets/shurukuang_20260105103909_10.png" class="imgStyle" style="width:300px" />
+
+* 显示字数统计：Boolean类型。是否在输入框右下角显示当前输入字数。只有配置了“最大文本长度”属性时可配置。
+
+## 事件
+
+| **事件名** | **描述**                                                       |
+| ---------------- | -------------------------------------------------------------------- |
+| 点击时           | 输入框被点击时触发该事件中的逻辑                                     |
+| 获得焦点时       | 输入框获得焦点时触发该事件中的逻辑                                   |
+| 失去焦点时       | 输入框失去焦点时触发该事件中的逻辑                                   |
+| 输入时           | 输入或删除内容时触发该事件中的逻辑                                   |
+| 值改变时         | 输入框失去焦点后内容发生改变时触发该事件中的逻辑                     |
+| 清空按钮点击时   | 点击清空按钮时触发该事件中的逻辑，显示清空按钮需要开启“可清空”属性 |
+| 点击输入区       | 输入框输入文本区域被点击时触发该事件中的逻辑                         |
+
+**输入时**
+
+* 事件概述：输入或删除内容时触发该事件中的逻辑。
+* 输入参数：事件的输入参数value由应用自动生成，支持在事件逻辑中获取输入参数的值。
+
+    <img src="../assets/shurukuang_20260105103909_11.png" class="imgStyle" style="width:200px" />
+
+    * value：String类型或Decimal类型。记录当前输入框中的内容。
+
+**值改变时**
+
+* 事件概述：输入框失去焦点后内容发生改变时触发该事件中的逻辑。
+* 输入参数：事件的输入参数value由应用自动生成，支持在事件逻辑中获取输入参数的值。
+
+    <img src="../assets/shurukuang_20260105103909_12.png" class="imgStyle" style="width:200px" />
+
+    * value：String类型或Decimal类型。记录当前输入框中的内容。
+
+## 可访问属性
+
+在编写表达式或使用前端逻辑时，可以通过“变量或常量“使用输入框组件的[可访问属性](../../19.组件可访问属性.md)，可访问属性有：
+
+<img src="../assets/shurukuang_20260105103909_13.png" class="imgStyle" style="width:300px" />
+
+* _if（显示条件）：Boolean类型，输入框是否显示，值与“显示条件”属性对齐。支持获取和赋值。
+
+## 插槽
+
+输入框组件中包含插槽，支持拖拽放置其他组件：
+
+* 输入框左侧包含插槽。通常用于指示当前输入框的标题信息。
+
+    <img src="../assets/shurukuang_20260105103909_14.png" class="imgStyle" style="width:300px" />
+
+## 样式
+
+> 组件通用样式请参见[组件通用样式说明](../../18.组件通用样式说明.md)。
+
+### 主题样式
+
+* label-width：字段标签宽度
+* label-color：字段标签颜色
+* label-margin-right：字段标签右边距
+* input-text-color：字段输入框文字颜色
+* input-error-text-color：字段输入框错误文字颜色
+* input-disabled-text-color：字段输入框禁用状态文字颜色
+* placeholder-text-color：字段占位符文字颜色
+* icon-size：字段图标大小
+* clear-icon-size：字段清除图标大小
+* clear-icon-color：字段清除图标颜色
+* right-icon-color：字段右侧图标颜色
+* error-message-color：字段错误信息颜色
+* error-message-font-size：字段错误信息字体大小
+* text-area-min-height：字段文本域最小高度
+* word-limit-color：字段字数限制颜色
+* word-limit-font-size：字段字数限制字体大小
+* word-limit-line-height：字段字数限制行高
+* disabled-text-color：字段禁用状态文字颜色
+* required-mark-color：字段必填标记颜色
+
+组件支持在**样式**->**主题样式**中调整当前单个组件的主题样式；也支持在**自定义主题样式**->**组件主题配置**中调整当前类型组件在应用中的所有样式，并支持直接预览效果。
+
+> 推荐前往组件主题配置中查看各主题样式的效果，相关文档请参考[自定义主题样式](../../../60.可视化开发界面/70.更多设置/30.自定义主题样式.md)。
+
+<img src="../assets/shurukuang_20260105103909_15.png" class="imgStyle" style="" />
+
+
+<style>
+ .highlight {
+    background-color: #eaf6ff;
+    border-color: #679CF8;
+    border-left-width: 0.2rem;
+    border-left-style: solid;
+    padding: 1rem 1rem 1rem 1rem;
+    margin: 1rem 0px;
+}
+</style>
+
+<style>
+  .tag-blue {
+      display:inline-block;
+      padding:0.5px 10px;
+      border-radius:9999px;
+      font-size:0.75rem;
+      font-weight:500;
+      margin-bottom:1rem;
+      background-color:#dbeafe;
+      color:#2563eb;
+}
+.tag-yellow {
+      display:inline-block;
+      padding:0.5px 10px;
+      border-radius:9999px;
+      font-size:0.75rem;
+      font-weight:500;
+      margin-bottom:1rem;
+      background-color:#fef3c7;
+      color:#d97706;
+}
+</style>
+
+<div style="text-align: right;font-size: 14px;">
+    <span style="color: rgb(78, 110, 142);">创建人：</span>
+    <span style="color: rgb(118, 118, 118);">有鲤</span>
+    <span style="color: rgb(78, 110, 142);margin: 0 0 0 40px;">更新时间：</span>
+    <span style="color: rgb(118, 118, 118);">2026年01月05日</span>
+</div>