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/080./345/217/215/351/246/210.md/040./346/260/224/346/263/241/345/274/271/345/207/272/346/241/206.md

@@ -0,0 +1,200 @@
+# 气泡弹出框
+
+<span class="tag-blue">Vue3</span> <span class="tag-yellow">H5</span>
+
+
+弹出式的气泡菜单。
+
+<img src="../assets/qipaotanchukuang_20260106182613_1.png" class="imgStyle" style="" />
+
+<div class="highlight">
+
+在本章节，你将学习：
+
+1. 气泡弹出框的各类属性、事件、可访问属性等基础信息。
+2. 如何使用气泡弹出框的各类事件，具体实现效果包括但不限于：
+
+   * 使用气泡弹出框的“数据源”属性，以实现动态设置弹出菜单中的数据。
+   * 使用气泡弹出框的“是否显示”属性，以实现通过修改绑定变量的值来控制弹出框的展示。
+   * 使用气泡弹出框的“选项列表的排列方向”属性，以控制弹出框列表的排列方式，可选垂直、水平。
+   * 使用气泡弹出框的“弹出位置”属性，以控制弹出框的弹出位置。
+
+</div>
+
+
+
+## 属性
+
+> 组件通用属性请参见[组件通用属性说明](../../17.组件通用属性说明.md)。
+
+### 数据属性
+
+* 数据源：弹出气泡菜单中数据的来源。数据源可以绑定 `List<T>`类型变量或输出参数为数组或包含 `List<T>`的匿名数据结构的逻辑，List中的T可以是任意类型（包括 `List<T>`、联合类型）。
+
+    <div class="highlight">
+
+    当气泡弹出框绑定数据源后，应用自动生成current变量。气泡菜单会根据数据源中包含的 List 按顺序对每一项进行循环遍历，使用current即可指代在 List 中当前正在访问或操作的对象。为**气泡菜单项**中的组件编辑表达式或添加事件，即可调用current变量：
+
+    <img src="../assets/qipaotanchukuang_20260106182613_2.png" class="imgStyle" style="width:200px" />
+
+    **所有可绑定数据源的组件同理。**
+
+    在气泡弹出框的属性中设置任意字段（如选项图标字段）时，同样根据字段值进行循环遍历，但不显示其 current.item 前缀。
+
+    </div>
+
+
+    操作步骤：
+
+    1. 点击“请选择表达式”进入编辑表达式页面，通过拖入变量、使用调用逻辑组件等方式设置数据源。
+
+        <img src="../assets/qipaotanchukuang_20260106182613_3.png" class="imgStyle" style="" />
+
+    2. 向气泡菜单中拖拽需要展示为菜单项的组件，为组件绑定数据源中的current.item或其属性，实现动态展示选项。例如拖入文本，并动态获取文本内容。
+
+        <img src="../assets/qipaotanchukuang_20260106182613_4.png" class="imgStyle" style="" />
+
+* 数据类型：数据源返回的数据结构的类型，自动识别类型进行展示说明，为只读状态无法修改。
+* 选项图标字段：绑定数据源后，依据该字段动态加载节点的图标，该字段值的数据类型为String类型，可设置具体值为.icon格式图标链接。
+
+    <img src="../assets/qipaotanchukuang_20260106182613_5.png" class="imgStyle" style="width:200px" />
+
+* 选项文字颜色字段：绑定数据源后，依据该字段动态加载节点的文字颜色，该字段值的数据类型为String类型，可设置具体值为RGB、RGBA、Hex、颜色英文代码。
+* 选项是否禁用字段：绑定数据源后，依据该字段动态加载节点是否置灰，且禁止点击、选择。该字段值的数据类型为Boolean类型。
+
+    <img src="../assets/qipaotanchukuang_20260106182613_6.png" class="imgStyle" style="width:200px" />
+
+### 主要属性
+
+* 是否显示：Boolean类型。是否弹出气泡菜单。默认开启编辑表达式功能。编辑表达式时若直接绑定Boolean类型变量，支持开启“是否将组件输入赋值给变量“，开启时会根据弹出状态改变变量的值，也会根据变量的值改变弹出状态。
+* 选项列表的排列方向：弹出菜单项的排列方向。可选垂直和水平。
+
+    <img src="../assets/qipaotanchukuang_20260106182613_7.png" class="imgStyle" style="width:400px" />
+
+* 弹出位置：气泡菜单的弹出位置，可选择顶部、顶部左侧、顶部右侧、左侧、左侧上方、左侧下方、右侧、右侧上方、右侧下方、底部、底部左侧、底部右侧。
+* 主题风格：气泡菜单的样式风格。可选浅色和深色。
+
+    <img src="../assets/qipaotanchukuang_20260106182613_8.png" class="imgStyle" style="width:400px" />
+
+* 触发方式：触发气泡菜单弹出的方式。可选点击和手动，选择手动时，可以为“是否显示”属性绑定Boolean类型变量。通过改变变量值来控制气泡菜单是否弹出。
+* 动画时长：气泡菜单弹出和收起的过渡动画时长，默认单位s。设置为0时表示禁用动画。
+* 左右位置偏移量：Integer类型，气泡菜单向右偏移距离。默认单位px。
+* 上下位置偏移量：Integer类型，气泡菜单向下偏移距离。默认单位px。
+* 是否显示遮罩层：Boolean类型，打开气泡菜单后是否显示遮罩层覆盖非气泡弹出框内容。
+* 是否展示小箭头：Boolean类型，是否显示气泡箭头。
+
+    <img src="../assets/qipaotanchukuang_20260106182613_9.png" class="imgStyle" style="width:200px" />
+
+* 是否在点击选项后关闭：Boolean类型，是否在点击遮气泡菜单项后关闭气泡菜单。
+* 是否在点击外部元素后关闭菜单：Boolean类型，是否在点击任意其他组件后关闭气泡菜单。
+* 是否在点击遮罩层后关闭菜单：Boolean类型，是否在点击遮罩层后关闭气泡菜单。开启“是否显示遮罩层”属性后有效。
+* 是否自定义菜单内容：Boolean类型，无视“数据源”属性，气泡中仅显示为一个插槽，自定义插槽内的组件。
+
+## 事件
+
+| **事件名**         | **描述**                                                   |
+| ------------------------ | ---------------------------------------------------------------- |
+| 点击选项时触发           | 点击任意气泡菜单项时触发该事件中的逻辑。                         |
+| 打开菜单时触发           | 执行打开气泡菜单操作时触发该事件中的逻辑。                       |
+| 关闭菜单时触发           | 执行关闭气泡菜单操作时触发该事件中的逻辑。                       |
+| 打开菜单且动画结束后触发 | 气泡菜单打开动画播放完毕时触发该事件中的逻辑。                   |
+| 关闭菜单且动画结束后触发 | 气泡菜单关闭动画播放完毕时触发该事件中的逻辑。                   |
+| 点击遮罩层时触发         | 点击遮罩层时触发该事件中的逻辑。开启“是否显示遮罩层”后可触发。 |
+
+**点击选项时触发**
+
+* 事件概述：点击任意气泡菜单项时触发该事件中的逻辑。
+* 输入参数：事件的输入参数event由应用自动生成，支持在事件逻辑中获取输入参数的值。
+
+    <img src="../assets/qipaotanchukuang_20260106182613_10.png" class="imgStyle" style="width:200px" />
+
+    * event：数据类型由数据源决定。其中记录了当前点击项的完整数据对象。
+
+## 可访问属性
+
+在编写表达式或使用前端逻辑时，可以通过“变量或常量“使用气泡弹出框组件的[可访问属性](../../19.组件可访问属性.md)，可访问属性有：
+
+<img src="../assets/qipaotanchukuang_20260106182613_11.png" class="imgStyle" style="width:300px" />
+
+* _if（显示条件）：Boolean类型，气泡弹出框是否显示，值与“显示条件”属性对齐。支持获取和赋值。
+
+## 插槽
+
+气泡弹出框组件中包含插槽，支持拖拽放置其他组件：
+
+* 弹出框弹出层外包含插槽。常见用法如：指示触发弹出层展示的内容。
+
+    <img src="../assets/qipaotanchukuang_20260106182613_12.png" class="imgStyle" style="width:300px" />
+
+* 弹出框弹出层的菜单项包含插槽。常见用法如：指示选项展示的内容，需要搭配“数据源”属性使用。气泡弹出框在绑定数据源后，插槽中的组件支持根据的数据源来配置信息并动态加载。若不需要动态加载，请开启“是否自定义菜单内容”属性。
+
+    <img src="../assets/qipaotanchukuang_20260106182613_13.png" class="imgStyle" style="width:300px" />
+
+## 样式
+
+> 组件通用样式请参见[组件通用样式说明](../../18.组件通用样式说明.md)。
+
+### 主题样式
+
+* --van-popover-arrow-size：弹出框箭头大小
+* --van-popover-radius：弹出框圆角半径
+* --van-popover-action-width：弹出框操作按钮宽度
+* --van-popover-action-height：弹出框操作按钮高度
+* --van-popover-action-font-size：弹出框操作按钮字体大小
+* --van-popover-action-icon-size：弹出框操作按钮图标大小
+* --van-popover-horizontal-action-height：弹出框水平操作按钮高度
+* --van-popover-horizontal-action-icon-size：弹出框水平操作按钮图标大小
+* --van-popover-light-text-color：弹出框浅色主题文字颜色
+* --van-popover-light-background：弹出框浅色主题背景色
+* --van-popover-light-action-disabled-text-color：弹出框浅色主题禁用操作按钮文字颜色
+* --van-popover-dark-text-color：弹出框深色主题文字颜色
+* --van-popover-dark-background：弹出框深色主题背景色
+* --van-popover-dark-action-disabled-text-color：弹出框深色主题禁用操作按钮文字颜色
+
+组件支持在**样式**->**主题样式**中调整当前单个组件的主题样式；也支持在**自定义主题样式**->**组件主题配置**中调整当前类型组件在应用中的所有样式，并支持直接预览效果。
+
+> 推荐前往组件主题配置中查看各主题样式的效果，相关文档请参考[自定义主题样式](../../../60.可视化开发界面/70.更多设置/30.自定义主题样式.md)。
+
+<img src="../assets/qipaotanchukuang_20260106182613_14.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月06日</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/080./345/217/215/351/246/210.md/050./344/270/213/346/213/211/345/210/267/346/226/260.md

@@ -0,0 +1,116 @@
+# 下拉刷新
+
+<span class="tag-blue">Vue3</span> <span class="tag-yellow">H5</span>
+
+用于提供下拉刷新的交互操作。
+
+<img src="../assets/xialashuaxin_202509151445_1.gif" class="imgStyle" style="width:300px;" />
+
+<div class="highlight">
+
+在本章节，你将学习：
+
+1. 下拉刷新的各类属性，事件，可访问属性等基础信息。
+2. 如何使用下拉刷新的各类属性，具体实现效果包括但不限于：
+
+   * 使用下拉刷新的“是否处于加载状态”属性，可通过修改绑定的变量的值来控制加载状态。
+   * 使用下拉刷新的“下拉过程提示文案”、“释放过程提示文案”、“加载过程提示文案”、“刷新成功提示文案”属性，来控制下拉刷新各个阶段展示的文字内容。
+   * 使用下拉刷新的“刷新成功提示展示时长”属性，以控制刷新成功后，刷新成功提示的展示时长。
+   * 使用下拉刷新的“触发下拉刷新的距离”属性，以设定下拉到多少距离是触发刷新。
+
+</div>
+
+## 属性
+
+> 组件通用属性请参见[组件通用属性说明](../../17.组件通用属性说明.md)。
+
+下拉刷新组件是一个容器，支持按住容器内容下拉至一定距离并在释放后使容器顶端显示刷新提示，刷新结束后容器内容回弹至原始位置。
+
+<img src="../assets/xialashuaxin_202509151445_2.png" class="imgStyle" style="width:300px;" />
+
+### 主要属性
+
+- 是否处于加载状态：Boolean类型。是否为加载状态。默认开启编辑表达式功能。编辑表达式时若直接绑定Boolean类型变量，支持开启“是否将组件输入赋值给变量“，开启时会根据加载状态改变变量的值，也会根据变量的值改变加载状态。
+- 下拉过程提示文案：当下拉操作未达到触发刷新的距离时，向用户展示的提示文案。
+- 释放过程提示文案：当下拉操作达到触发刷新的距离但尚未释放时，向用户展示的提示文案。
+- 加载过程提示文案：刷新加载过程中，向用户展示的提示文案。
+- 刷新成功提示文案：刷新成功后，向用户展示的提示文案。
+- 刷新成功提示展示时长(ms)：Integer类型，刷新成功提示文案的展示时长，单位为毫秒。
+- 动画时长：Integer类型，下拉、回弹等动画的时长，单位为毫秒。
+- 顶部内容高度：Integer类型，下拉刷新交互中。承载提示文案、动画等元素的区域高度。
+- 触发下拉刷新的距离：Integer类型，触发下拉刷新所需的下拉距离。默认单位px。
+- 是否禁用下拉刷新：Boolean类型，是否禁止下拉刷新。
+
+## 事件
+
+| 事件名  | 描述              |
+| :---------- | :--------------------- |
+| 下拉刷新时触发     | 下拉操作触发至刷新加载时触发该逻辑中的事件。 |
+| 拖动时或状态改变时触发 | 操作拖动或刷新状态改变时触发该逻辑中的事件。 |
+
+## 可访问属性
+
+在编写表达式或使用前端逻辑时，可以通过“变量或常量“使用下拉刷新组件的[可访问属性](../../19.组件可访问属性.md)，可访问属性有：
+
+<img src="../assets/xialashuaxin_202509151445_3.png" class="imgStyle" style="width:300px;" />
+
+- \_if（显示条件）：Boolean类型，下拉刷新是否显示，值与“显示条件”属性对齐。支持获取和赋值。
+
+## 样式
+
+> 组件通用样式请参见[组件通用样式说明](../../18.组件通用样式说明.md)。
+
+### 主题样式
+
+- head-height：下拉刷新头部高度
+- head-font-size：下拉刷新头部字体大小
+- head-text-color：下拉刷新头部文字颜色
+- loading-icon-size：下拉刷新加载图标大小
+
+组件支持在**样式**->**主题样式**中调整当前单个组件的主题样式；也支持在**自定义主题样式**->**组件主题配置**中调整当前类型组件在应用中的所有样式，并支持直接预览效果。
+
+> 推荐前往组件主题配置中查看各主题样式的效果，相关文档请参考[自定义主题样式](../../../60.可视化开发界面/70.更多设置/30.自定义主题样式.md)。
+
+<img src="../assets/xialashuaxin_202509151445_4.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月15日</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/080./345/217/215/351/246/210.md/060./346/273/221/345/212/250/345/215/225/345/205/203/346/240/274.md

@@ -0,0 +1,97 @@
+# 滑动单元格
+
+<span class="tag-blue">Vue3</span> <span class="tag-yellow">H5</span>
+
+可以左右滑动来展示操作按钮的单元格组件。
+
+<img src="../assets/huadongdanyuange_202509151447_1.gif" class="imgStyle" style="width:300px;" />
+
+## 属性
+
+> 组件通用属性请参见[组件通用属性说明](../../17.组件通用属性说明.md)。
+
+在可视化开发中，选中滑动单元格组件后可以点击滑动条左右的箭头查看或编辑左右两侧的可滑动区域。
+
+<img src="../assets/huadongdanyuange_202509151447_2.png" class="imgStyle" style="width:300px;" />
+
+### 主要属性
+
+- 标识符：滑动单元格的唯一标识符。触发滑动单元格的[打开时或关闭时事件](http://1)时，可从输入参数中获取标识符的值。
+- 左侧滑动区域宽度：Integer类型，左侧滑动区域宽度，默认单位px，默认值为左侧组件总宽度。
+- 右侧滑动区域宽度：Integer类型，右侧滑动区域宽度，默认单位px，默认值为右侧组件总宽度。
+- 是否禁用：Boolean类型，是否置灰显示，且禁止滑动。
+- 是否阻止点击事件：Boolean类型，是否在点击滑动单元格后无任何反馈。用于禁用单元格的点击交互。
+- 是否阻止冒泡：Boolean类型，控制滑动单元格触发的点击、滑动等事件时，是否不会向上传递给父级元素，避免父元素因该事件产生额外反应。用于隔离单元格与父元素的事件影响。
+
+## 事件
+
+| 事件名 | 描述              |
+| :------ | :-------------------- |
+| 点击时     | 鼠标左键单击对应组件时触发该事件中的逻辑  |
+| 打开时     | 滑动展开任意一边侧边栏时触发该事件中的逻辑 |
+| 关闭时     | 滑动收起任意一边侧边栏时触发该事件中的逻辑 |
+
+**打开时 / 关闭时**
+
+打开时 / 关闭时事件包含由应用自动生成的输入参数event，支持在事件逻辑中获取输入参数的值。
+
+<img src="../assets/huadongdanyuange_202509151447_3.png" class="imgStyle" style="width:200px;" />
+
+- position：String类型，当前滑动展开或收起的侧边栏的位置。展开或收起左侧侧边栏时值为left；展开或收起右侧侧边栏时值为right。
+- name：String或Integer类型，当前滑动展开或收起的滑动单元格的标识符。
+
+## 可访问属性
+
+在编写表达式或使用前端逻辑时，可以通过“变量或常量“使用滑动单元格组件的[可访问属性](../../19.组件可访问属性.md)，可访问属性有：
+
+<img src="../assets/huadongdanyuange_202509151447_4.png" class="imgStyle" style="width:300px;" />
+
+- \_if（显示条件）：Boolean类型，滑动单元格是否显示，值与“显示条件”属性对齐。支持获取和赋值。
+
+## 组件逻辑
+
+页面添加滑动单元格组件后，支持调用滑动单元格的内置逻辑，内置逻辑有：
+
+| 逻辑名 | 描述                                                 |
+| :------ | :-------------------------------------------------------- |
+| open    | 展开侧边栏。入参position为String类型必填参数，可填写left或right，用于指定展开侧边栏的位置。 |
+| close   | 收起侧边栏。                                                    |
+
+<img src="../assets/huadongdanyuange_202509151447_5.png" class="imgStyle" style="width:400px;" />
+
+## 样式
+
+> 组件通用样式请参见[组件通用样式说明](../../18.组件通用样式说明.md)。
+
+## 使用说明
+
+滑动单元格中默认包含一个单元格，支持删除并替换为其他组件。关于单元格的介绍请参考文档[单元格组](../040.展示/020.单元格组.md)。
+
+<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月15日</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>

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/080./345/217/215/351/246/210.md/070./350/275/273/346/217/220/347/244/272.md

@@ -0,0 +1,162 @@
+# 轻提示
+
+<span class="tag-blue">Vue3</span> <span class="tag-yellow">H5</span>
+
+在页面中间弹出黑色半透明提示，用于消息通知、加载提示、操作结果提示等场景。
+
+<img src="../assets/qingtishi_202509151451_1.gif" class="imgStyle" style="width:300px;" />
+
+<div class="highlight">
+
+在本章节，你将学习：
+
+1. 轻提示的各类属性、事件、可访问属性等基础信息。
+2. 如何使用轻提示组件的各类属性，具体实现效果包括但不限于：
+
+    * 使用轻提示的“是否显示”属性，以实现通过修改绑定变量的值来控制轻提示的展示。
+    * 使用轻提示的“提示类型”属性，以控制轻提示提示框中的内容，可选加载、成功、失败、文字。
+    * 使用轻提示的“显示位置”属性，以控制轻提示显示的位置，可选顶部，中间，底部。
+    * 使用轻提示的“是否禁止背景点击”属性，以控制在提示显示的时候非轻提示的组件是否可以被点击。
+
+3. 如何使用轻提示组件的各类组件逻辑，具体实现效果包括但不限于：
+
+    * 使用轻提示的“open”的组件逻辑，以实现手动打开提示。
+    * 使用轻提示的“close”的组件逻辑，以实现手动关闭提示。
+
+</div>
+
+## 属性
+
+> 组件通用属性请参见[组件通用属性说明](../../17.组件通用属性说明.md)。
+
+### 主要属性
+
+- 是否显示：Boolean类型，是否显示提示。默认开启编辑表达式功能，编辑表达式时若直接绑定Boolean类型变量，支持开启“是否将组件输入赋值给变量“，开启时会根据提示的显示状态改变变量的值，也会根据变量的值显示或隐藏提示。
+- 提示类型：提示框中图标的类型，可选加载、成功、失败、文字（无图标）。
+
+    <div class="highlight">
+
+    开启编辑表达式后，可复制选项标识来配置表达式的值。用于标识“提示类型”属性不同选项的对应值如下图：
+
+    <img src="../assets/qingtishi_202509151451_2.png" class="imgStyle" style="width:300px;" />
+
+    </div>
+    
+
+- 加载图标类型：“提示类型”为加载时，加载图标的样式，可选spinner和circular。
+- 位置：提示出现的位置。可选顶部、中间、底部。
+- 文本换行方式：文本内容换行显示时，文字的换行方式。
+  - 正常：遵循自然的换行规则， 遇到空格或换行符时进行换行。当文本内容到达容器边界时，如果当前单词没有结束，这个单词会整体移动到下一行，不会对单词进行拆分 。
+  - break-all：只要文本内容超出容器的宽度，就会在超出的位置强制换行，即便会拆分单词。对于连续的英文字符串或者数字串，它也会直接截断并换行 。
+  - break-word：当文本内容超出容器宽度时，优先在正常的换行点（空格、换行符）进行换行。如果没有合适的换行点，比如遇到一个很长没有空格的单词，会在单词内部合适的位置进行拆分换行，保证单词不会溢出容器边界。
+- 自定义图标：忽略“提示类型”中的图标，自定义提示文本上方显示的图标。支持从图标库选择图标、上传自定义SVG格式图标或编辑表达式。具体使用方法请参考[图标](../040.展示/120.图标.md)组件的“图标”属性。
+- 图标大小：图标的尺寸，默认单位px。
+- 是否显示背景遮罩层：Boolean类型，显示提示后是否显示遮罩层覆盖非提示内容。
+- 是否禁止背景点击：Boolean类型，显示提示后是否点击非轻提示组件。
+- 是否在点击后关闭：Boolean类型，是否在点击提示时隐藏提示。
+- 是否在点击遮罩层后关闭：Boolean类型，是否在点击遮罩层后隐藏提示。开启“是否显示背景遮罩层”属性后有效。
+- 展示时长(ms)：Integer类型，提示的显示时长。默认单位毫秒。
+- 层级：表示当前组件所在的层数，值越大层级越靠上。在相同位置时，层级大的组件会覆盖层级小的组件。
+
+## 事件
+
+| 事件名  | 描述               |
+| :--------- | :--------------------- |
+| 完全展示后的回调函数 | 提示显示且动画播放完毕时触发该事件中的逻辑。 |
+| 关闭时的回调函数   | 提示隐藏时触发该事件中的逻辑。        |
+
+## 可访问属性
+
+在编写表达式或使用前端逻辑时，可以通过“变量或常量“使用轻提示组件的[可访问属性](../../19.组件可访问属性.md)，可访问属性有：
+
+<img src="../assets/qingtishi_202509151451_3.png" class="imgStyle" style="width:300px;" />
+
+- \_if（显示条件）：Boolean类型，轻提示是否显示，值与“显示条件”属性对齐。支持获取和赋值。
+
+## 组件逻辑
+
+页面添加轻提示组件后，支持调用轻提示的内置逻辑，内置逻辑有：
+
+| **逻辑名** | **描述** |
+| :------ | :----- |
+| open    | 显示轻提示。 |
+| close   | 隐藏轻提示。 |
+
+<img src="../assets/qingtishi_202509151451_4.png" class="imgStyle" style="width:400px;" />
+
+## 插槽
+
+轻提示组件中包含插槽，支持拖拽放置其他组件：
+
+<img src="../assets/qingtishi_202509151451_5.png" class="imgStyle" style="width:300px;" />
+
+## 样式
+
+> 组件通用样式请参见[组件通用样式说明](../../18.组件通用样式说明.md)。
+
+### 主题样式
+
+- max-width：轻提示最大宽度
+- font-size：轻提示字体大小
+- text-color：轻提示文字颜色
+- loading-icon-color：轻提示加载图标颜色
+- line-height：轻提示行高
+- radius：轻提示圆角半径
+- background：轻提示背景色
+- icon-size：轻提示图标大小
+- text-min-width：轻提示文字最小宽度
+- text-padding：轻提示文字内边距
+- default-padding：轻提示默认内边距
+- default-width：轻提示默认宽度
+- default-min-height：轻提示默认最小高度
+- position-top-distance：轻提示顶部位置距离
+- position-bottom-distance：轻提示底部位置距离
+
+组件支持在**样式**->**主题样式**中调整当前单个组件的主题样式；也支持在**自定义主题样式**->**组件主题配置**中调整当前类型组件在应用中的所有样式，并支持直接预览效果。
+
+> 推荐前往组件主题配置中查看各主题样式的效果，相关文档请参考[自定义主题样式](../../../60.可视化开发界面/70.更多设置/30.自定义主题样式.md)。
+
+<img src="../assets/qingtishi_202509151451_6.png" class="imgStyle" style="" />
+
+## 使用说明
+
+页面编辑区左下角的小窗口中整理了当前页面所有的轻提示组件。鼠标移动到小窗口上，点击“弹出消息”后右侧出现该页面所有轻提示列表，双击指定的轻提示可以唤起。
+
+<img src="../assets/qingtishi_202509151451_7.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月15日</span>
+</div>
+<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;
+}
+.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>