feat: add filter docs for table, improve code

2020-12-22 16:33:30 +08:00 · 2020-12-22 16:33:30 +08:00 · 4b8ad76e60
commit 4b8ad76e60
parent 9337660240
48 changed files with 260 additions and 190 deletions
--- a/assets/styles/post.styl
+++ b/assets/styles/post.styl
@ -1,4 +1,4 @@
-@import "~highlight.js/styles/atom-one-dark.css"
+@import "~highlight.js/styles/atom-one-light.css"

 margin-y($top, $bottom = $top)
  margin-top $top
--- a/one/docs/advanced/theming.md
+++ b/one/docs/advanced/theming.md
@ -82,7 +82,7 @@ VEUI 中各个组件的可切换的预设样式是通过为主题包提供可扩
 | `boolean` | `boolean` | `false` | 预设 `ui` 属性是否为布尔型。 |
 | `inherit` | `boolean` | `false` | 预设 `ui` 属性值是否会被子组件继承。 |

-以 `Select` 组件为例：
+以 `NumberInput` 组件为例：

 ```js
 import config from 'veui/managers/config'
@ -90,11 +90,13 @@ import config from 'veui/managers/config'
 config.defaults({
  ui: {
    size: {
-      values: ['large', 'small', 'tiny', 'micro'],
+      values: ['xs', 's', 'm'],
+      default: 'm',
      inherit: true
    },
    style: {
-      values: ['alt']
+      values: ['normal', 'strong'],
+      default: 'normal'
    }
  }
 }, 'select')
@ -103,13 +105,13 @@ config.defaults({
 在上面这个例子中，我们定义了两个 `ui` 属性：`size` 和 `style`。它们都是枚举类型，其中 `size` 值可被子组件继承。最终调用 `Select` 组件时，可以这样启用预设样式：

 ```html
-<veui-select ui="alt small">...</veui-select>
+<veui-select ui="strong s">...</veui-select>
 ```

 当然，我们也可以完全不定义 `ui` 属性的详情，这时 VEUI 会将用户书写的 `ui` 属性原样输出，不会进行去重、同属性的属性值冲突检测、继承等特殊处理。

 :::warning
-由于 `ui` 属性最后会将值打平输出到 DOM 元素上，所以各个属性的值不能冲突。
+由于 `ui` 属性最后会将值序列化为空格分隔的字符串输出到 DOM 元素上，所以各个属性的值不能冲突。
 :::

 ### 指定组件内部组件的预设样式
@ -127,8 +129,29 @@ config.defaults({
 }, 'select')
 ```

+如果希望部件的 `ui` 属性值可以根据声明/继承的值动态计算得出，也可以直接使用计算函数：
+
+```js
+import config from 'veui/managers/config'
+
+const SIZE_MAPPING = {
+  xs: 's',
+  s: 's',
+  m: 's',
+  l: 'm'
+}
+
+config.defaults({
+  parts: {
+    item: ({ size }) => SIZE_MAPPING[size]
+  }
+}, 'select')
+```
+
+上面的例子中，组件内部件 `item` 的 `ui` 属性将在 `size` 属性的基础上进行一次映射。
+
 ## 主题包列表

-* [veui-theme-dls](https://github.com/ecomfe/veui/tree/dev/packages/veui-theme-dls)：基于 DLS 的 VEUI 2.x 主题
-* [veui-theme-blue](https://github.com/ecomfe/veui-theme-blue)：基于 Theme Blue 的 VEUI 1.x 主题
+* [veui-theme-dls](https://github.com/ecomfe/veui/tree/dev/packages/veui-theme-dls)：基于 Light DLS 的 VEUI 2.x 主题
+* [veui-theme-blue](https://github.com/ecomfe/veui-theme-blue)：基于 Theme Blue 的 VEUI 2.x 主题
 * [veui-theme-spectre](https://justineo.github.io/veui-theme-spectre/demo/)：基于 Spectre.css 的 VEUI 1.x 主题
--- a/one/docs/components/alert.md
+++ b/one/docs/components/alert.md
@ -60,12 +60,12 @@

 | 名称 | 描述 |
 | -- | -- |
-| `default` | [^scoped-slot-default] |
+| `default` | [^slot-default] |
 | `title` | 消息标题的内容区域。 |
 | `extra` | 消息之后的额外内容区域。 |
 | `content` | 整个消息区域，包括状态图标、切换按钮、关闭按钮等。 |

-^^^scoped-slot-default
+^^^slot-default
 消息内容区域。

 默认内容：消息文本。
--- a/one/docs/components/anchor.md
+++ b/one/docs/components/anchor.md
@ -44,10 +44,10 @@

 | 名称 | 描述 |
 | -- | -- |
-| `item` | [^scoped-slot-item] |
-| `item-label` | [^scoped-slot-item-label] |
+| `item` | [^slot-item] |
+| `item-label` | [^slot-item-label] |

-^^^scoped-slot-item
+^^^slot-item
 渲染每个锚点链接。

 默认内容：锚点链接。
@ -55,7 +55,7 @@
 作用域参数参见 `items` 属性详情。
 ^^^

-^^^scoped-slot-item-label
+^^^slot-item-label
 渲染每个锚点链接的文本。

 默认内容：锚点链接的描述文本 `label`。
--- a/one/docs/components/autocomplete.md
+++ b/one/docs/components/autocomplete.md
@ -55,10 +55,10 @@

 | 名称 | 描述 |
 | -- | -- |
-| `suggestions` | [^scoped-slot-suggestions] |
-| `option-label` | [^scoped-slot-option-label] |
+| `suggestions` | [^slot-suggestions] |
+| `option-label` | [^slot-option-label] |

-^^^scoped-slot-suggestions
+^^^slot-suggestions

 下拉建议面板插槽。

@ -70,7 +70,7 @@
 +++
 ^^^

-^^^scoped-slot-option-label
+^^^slot-option-label

 下拉面板中选项插槽。

--- a/one/docs/components/button-group.md
+++ b/one/docs/components/button-group.md
@ -69,9 +69,9 @@
 | 名称 | 描述 |
 | -- | -- |
 | `default` | 按钮组内容区。 |
-| `item` | [^scoped-slot-item] |
+| `item` | [^slot-item] |

-^^^scoped-slot-item
+^^^slot-item
 用来定制每个按钮的内容。

 默认内容：`label` 属性值。
--- a/one/docs/components/calendar.md
+++ b/one/docs/components/calendar.md
@ -35,7 +35,7 @@
 | `week-start` | `number=` | `calendar.weekStart` | 一周的起始。可进行[全局配置](#全局配置)。 |
 | `fill-month` | `boolean=` | `true` | 当只有一个面板时，是否要在当前月份面板显示非本月日期。 |
 | `date-class` | `string|Array|Object|function=` | `{}` | 特定日期的自定义 HTML `class`。传非函数时，数据格式为所有 [Vue 支持的 `class` 表达式](https://cn.vuejs.org/v2/guide/class-and-style.html#%E7%BB%91%E5%AE%9A-HTML-Class)；传函数时，签名为 `function(Date): string|Array<string>|Object<string, boolean>`，返回值格式亦为所有 Vue 支持的 `class` 表达式。 |
-| `disabled-date` | `function(Date, Date=): boolean=` | `() => false` | 第一个参数为需要判断是否禁用的日期。当处于范围选择过程中且已经选择了一个日期，会作为第二个参数传入。 |
+| `disabled-date` | `function(Date, Date=): boolean=` | `() => false` | 用于自定义指定日期是否禁用。第一个参数为需要判断是否禁用的日期。当处于范围选择过程中且已经选择了一个日期，会作为第二个参数传入。 |
 | `disabled` | `boolean=` | `false` | 是否为禁用状态。 |
 | `readonly` | `boolean=` | `false` | 是否为只读状态。 |

@ -62,9 +62,9 @@
 | -- | -- |
 | `before` | 日历内，面板上方可供定制的区域。 |
 | `after` | 日历内，面板下方可供定制的区域。 |
-| `date` | [^scoped-slot-date] |
+| `date` | [^slot-date] |

-^^^scoped-slot-date
+^^^slot-date
 单日单元格内的区域，可用来定制每一天对应区域的内容。

 默认内容：对应日期的 `date`。
--- a/one/docs/components/carousel.md
+++ b/one/docs/components/carousel.md
@ -81,9 +81,9 @@

 | 名称 | 描述 |
 | -- | -- |
-| `item` | [^scoped-slot-item] |
+| `item` | [^slot-item] |

-^^^scoped-slot-item
+^^^slot-item
 可用来定制每个轮播项的区域。

 默认内容：轮播项图片。
--- a/one/docs/components/check-button-group.md
+++ b/one/docs/components/check-button-group.md
@ -62,9 +62,9 @@

 | 名称 | 描述 |
 | -- | -- |
-| `item` | [^scoped-slot-item] |
+| `item` | [^slot-item] |

-^^^scoped-slot-item
+^^^slot-item
 按钮内文本区域。

 默认内容：`label` 属性值。
--- a/one/docs/components/checkbox-group.md
+++ b/one/docs/components/checkbox-group.md
@ -62,9 +62,9 @@

 | 名称 | 描述 |
 | -- | -- |
-| `item` | [^scoped-slot-item] |
+| `item` | [^slot-item] |

-^^^scoped-slot-item
+^^^slot-item
 选项描述文本区域。

 默认内容：`label` 属性值。
--- a/one/docs/components/column.md
+++ b/one/docs/components/column.md
@ -21,6 +21,7 @@
 | `align` | `string=` | - | 内容对齐方式，支持 `left`/`center`/`right`。 |
 | `span` | `function(number): Object=` | | [^span] |
 | `desc` | `string` | - | 表头描述。 |
+| `filter-value` | `*` | - | 筛选条件取值，目前仅支持 `true` 表示已经过筛选。 |

 ^^^sortable
 本列是否支持排序。
@ -44,9 +45,10 @@
 | -- | -- |
 | `head` | 列头区域。 |
 | `foot` | [^slot-foot] |
-| `default` | [^scoped-slot-default] |
-| `sub-row` | [^scoped-slot-sub-row] |
-| `desc` | [^scoped-slot-desc] |
+| `default` | [^slot-default] |
+| `sub-row` | [^slot-sub-row] |
+| `desc` | [^slot-desc] |
+| `filter` | [^slot-filter] |

 ^^^slot-foot
 列脚区域。
@ -56,7 +58,7 @@
 :::
 ^^^

-^^^scoped-slot-default
+^^^slot-default
 单元格的内容。

 默认内容：表格 `data` 数据项中与 `field` 属性对应的字段值。
@ -64,7 +66,7 @@
 作用域参数为 `data` 内当前行数据中的所有字段。
 ^^^

-^^^scoped-slot-sub-row
+^^^slot-sub-row
 展开行后子行的内容。使用此插槽时，内容会作为行展开下方子行中对应列的单元格内容。行数据源来自 `data` 中对应主行数据的 `children` 数组，展开的子行数与 `children` 内数据项数相同，使用相同的列配置。

 默认内容：表格 `data[i].children[j]` 数据项中与 `field` 属性对应的字段值。
@ -76,6 +78,22 @@
 :::
 ^^^

-^^^scoped-slot-desc
-表头描述。提供 `close` 函数，用于关闭展现描述内容的容器。使用此插槽时会覆盖 `Column` 的插槽 `desc` 内容。
+^^^slot-desc
+表头描述。使用此插槽时会覆盖 `Column` 的 `desc` 属性。
+
+++作用域参数
+| 名称 | 类型 | 描述 |
+| -- | -- | -- |
+| `close` | `function(): void` | 关闭展现描述内容的容器。 |
+++
+^^^
+
+^^^slot-filter
+筛选浮层的内容。
+
+++作用域参数
+| 名称 | 类型 | 描述 |
+| -- | -- | -- |
+| `close` | `function(): void` | 关闭筛选浮层。 |
+++
 ^^^
--- a/one/docs/components/date-picker.md
+++ b/one/docs/components/date-picker.md
@ -170,9 +170,9 @@

 | 名称 | 描述 |
 | -- | -- |
-| `date` | [^scoped-slot-date] |
+| `date` | [^slot-date] |

-^^^scoped-slot-date
+^^^slot-date
 浮层中日历的单日单元格内的区域，可用来定制每一天对应区域的内容。

 默认内容：对应日期的 `date`。
--- a/one/docs/components/dropdown.md
+++ b/one/docs/components/dropdown.md
@ -100,12 +100,12 @@
 | `default` | 选项列表的内容。在没有指定 `options` 属性时，可以用来直接内联 `Option` 或 `OptionGroup`。 |
 | `before` | 选项列表前的内容。无默认内容。 |
 | `after` | 选项列表后的内容。无默认内容。 |
-| `label` | [^scoped-slot-label] |
-| `group-label` | [^scoped-slot-group-label] |
-| `option-label` | [^scoped-slot-option-label] |
-| `option` | [^scoped-slot-option] |
+| `label` | [^slot-label] |
+| `group-label` | [^slot-group-label] |
+| `option-label` | [^slot-option-label] |
+| `option` | [^slot-option] |

-^^^scoped-slot-label
+^^^slot-label
 下拉按钮文本区域。

 默认内容：`label` 属性值。
@ -117,7 +117,7 @@
 +++
 ^^^

-^^^scoped-slot-group-label
+^^^slot-group-label
 下拉选项组（带 `options` 的选项）的标题文本区域。

 默认内容：选项的 `label` 属性值。
@ -132,7 +132,7 @@
 另外，当前选项数据中除了上面描述的字段之外的其它字段也会自动通过 `v-bind` 进行绑定到作用域参数上。
 ^^^

-^^^scoped-slot-option-label
+^^^slot-option-label
 下拉选项（不带 `options` 的选项）的文本区域。

 默认内容：选项的 `label` 属性值。
@ -148,7 +148,7 @@
 另外，当前选项数据中除了上面描述的字段之外的其它字段也会自动通过 `v-bind` 进行绑定到作用域参数上。
 ^^^

-^^^scoped-slot-option
+^^^slot-option
 可供选择的下拉选项的整个区域。

 默认内容：`Option` 内的组件默认结构。
--- a/one/docs/components/option-group.md
+++ b/one/docs/components/option-group.md
@ -47,12 +47,12 @@
 | 名称 | 描述 |
 | -- | -- |
 | `default` | 选项列表的内容。在没有指定 `options` 属性时，可以用来直接内联 `Option` 或其它 `OptionGroup` 组件。 |
-| `label` | [^scoped-slot-label] |
-| `group-label` | [^scoped-slot-group-label] |
-| `option-label` | [^scoped-slot-option-label] |
-| `option` | [^scoped-slot-option] |
+| `label` | [^slot-label] |
+| `group-label` | [^slot-group-label] |
+| `option-label` | [^slot-option-label] |
+| `option` | [^slot-option] |

-^^^scoped-slot-label
+^^^slot-label
 选项组标题文本区域。

 默认内容：`label` 属性对应的文本。
@ -65,7 +65,7 @@
 +++
 ^^^

-^^^scoped-slot-group-label
+^^^slot-group-label
 子选项组的标题文本区域。

 默认内容：带 `options` 的选项对应的 `label` 属性值。
@ -80,7 +80,7 @@
 另外，当前选项组数据中除了上面描述的字段之外的其它字段也会自动通过 `v-bind` 进行绑定到作用域参数上。
 ^^^

-^^^scoped-slot-option-label
+^^^slot-option-label
 选项的文本区域。

 默认内容：不带 `options` 的选项对应的 `label` 属性值。
@ -97,7 +97,7 @@
 另外，当前选项数据中除了上面描述的字段之外的其它字段也会自动通过 `v-bind` 进行绑定到作用域参数上。
 ^^^

-^^^scoped-slot-option
+^^^slot-option
 可供选择的选项的整个区域。

 默认内容：`Option` 内的组件默认结构。
--- a/one/docs/components/progress.md
+++ b/one/docs/components/progress.md
@ -43,9 +43,9 @@

 | 名称 | 描述 |
 | -- | -- |
-| `default` | [^scoped-slot-default] |
+| `default` | [^slot-default] |

-^^^scoped-slot-default
+^^^slot-default
 可用来定制文字提示区域的内容。

 默认内容：完成率百分比。
--- a/one/docs/components/radio-button-group.md
+++ b/one/docs/components/radio-button-group.md
@ -54,9 +54,9 @@

 | 名称 | 描述 |
 | -- | -- |
-| `item` | [^scoped-slot-item] |
+| `item` | [^slot-item] |

-^^^scoped-slot-item
+^^^slot-item
 按钮内文本区域。

 默认内容：`label` 属性值。
--- a/one/docs/components/radio-group.md
+++ b/one/docs/components/radio-group.md
@ -54,9 +54,9 @@

 | 名称 | 描述 |
 | -- | -- |
-| `item` | [^scoped-slot-item] |
+| `item` | [^slot-item] |

-^^^scoped-slot-item
+^^^slot-item
 选项描述文本区域。

 默认内容：`label` 属性值。
--- a/one/docs/components/region-picker.md
+++ b/one/docs/components/region-picker.md
@ -41,9 +41,9 @@

 | 名称 | 描述 |
 | -- | -- |
-| `label` | [^scoped-slot-label] |
+| `label` | [^slot-label] |

-^^^scoped-slot-label
+^^^slot-label
 每个节点文本描述的内容。

 默认内容：每个节点 `label` 字段对应的文本内容。
--- a/one/docs/components/schedule.md
+++ b/one/docs/components/schedule.md
@ -59,12 +59,12 @@
 | `header-content` | 顶部区域的内容，不包括外层容器。 |
 | `shortcuts` | 顶部快捷选项区域。 |
 | `legend` | 顶部图例区域。 |
-| `legend-label` | [^scoped-slot-legend-label] |
-| `hour` | [^scoped-slot-hour] |
-| `label` | [^scoped-slot-label] |
-| `tooltip` | [^scoped-slot-tooltip] |
+| `legend-label` | [^slot-legend-label] |
+| `hour` | [^slot-hour] |
+| `label` | [^slot-label] |
+| `tooltip` | [^slot-tooltip] |

-^^^scoped-slot-legend-label
+^^^slot-legend-label
 每个图例的文本区域。

 默认内容：每个图例状态 `label` 字段对应的文本内容。
@ -79,7 +79,7 @@
 另外，`status` 内对应图例状态对象中除了上面描述的字段之外的其它字段也会自动通过 `v-bind` 进行绑定到作用域参数上。
 ^^^

-^^^scoped-slot-hour
+^^^slot-hour
 每小时区域的内容。

 默认内容：无。
@ -92,7 +92,7 @@
 +++
 ^^^

-^^^scoped-slot-label
+^^^slot-label
 已选时间段的区域。

 默认内容：时段在 3 小时及以上时，显示时段范围 <code>&#0096;${from}:00–${to + 1}:00&#0096;</code>；选择全天的显示为“全天”；小于 3 小时无内容。
@ -105,7 +105,7 @@
 +++
 ^^^

-^^^scoped-slot-tooltip
+^^^slot-tooltip
 光标移入每个小时格子的悬浮提示内容。

 默认内容：当前小时格子的时间范围 <code>&#0096;${hour}:00–${hour + 1}:00&#0096;</code>。
--- a/one/docs/components/select.md
+++ b/one/docs/components/select.md
@ -99,12 +99,12 @@
 | `default` | 选项列表的内容。在没有指定 `options` 属性时，可以用来直接内联 `Option` 或 `OptionGroup`。 |
 | `before` | 选项列表前的内容。无默认内容。 |
 | `after` | 选项列表后的内容。无默认内容。 |
-| `label` | [^scoped-slot-label] |
-| `group-label` | [^scoped-slot-group-label] |
-| `option-label` | [^scoped-slot-option-label] |
-| `option` | [^scoped-slot-option] |
+| `label` | [^slot-label] |
+| `group-label` | [^slot-group-label] |
+| `option-label` | [^slot-option-label] |
+| `option` | [^slot-option] |

-^^^scoped-slot-label
+^^^slot-label
 下拉按钮文本区域。

 默认内容：已选项对应的 `label` 属性值或内联模式下已选项的文本内容。
@ -121,7 +121,7 @@
 另外，当前选项数据中除了上面描述的字段之外的其它字段也会自动通过 `v-bind` 进行绑定到作用域参数上。
 ^^^

-^^^scoped-slot-group-label
+^^^slot-group-label
 下拉选项组（带 `options` 的选项）的标题文本区域。

 默认内容：选项的 `label` 属性值。
@ -136,7 +136,7 @@
 另外，当前选项数据中除了上面描述的字段之外的其它字段也会自动通过 `v-bind` 进行绑定到作用域参数上。
 ^^^

-^^^scoped-slot-option-label
+^^^slot-option-label
 下拉选项（不带 `options` 的选项）的文本区域。

 默认内容：选项的 `label` 属性值。
@ -153,7 +153,7 @@
 另外，当前选项数据中除了上面描述的字段之外的其它字段也会自动通过 `v-bind` 进行绑定到作用域参数上。
 ^^^

-^^^scoped-slot-option
+^^^slot-option
 可供选择的下拉选项的整个区域。

 默认内容：`Option` 内的组件默认结构。
--- a/one/docs/components/slider.md
+++ b/one/docs/components/slider.md
@ -82,10 +82,10 @@
 | -- | -- |
 | `track` | 滑轨。默认内容：横线。 |
 | `tip-label` | 浮动提示文本。默认内容：当前 `value` 值。 |
-| `thumb` | [^scoped-slot-thumb] |
-| `tip` | [^scoped-slot-tip] |
+| `thumb` | [^slot-thumb] |
+| `tip` | [^slot-tip] |

-^^^scoped-slot-thumb
+^^^slot-thumb
 滑块。

 默认内容：圆形按钮。
@ -100,7 +100,7 @@
 +++
 ^^^

-^^^scoped-slot-tip
+^^^slot-tip
 浮动提示。

 默认内容：内容为 `value` 的 Tooltip 组件。
--- a/one/docs/components/steps.md
+++ b/one/docs/components/steps.md
@ -54,12 +54,12 @@

 | 名称 | 描述 |
 | -- | -- |
-| `default` | [^scoped-slot-default] |
+| `default` | [^slot-default] |
 | `index` | 序号部分内容，默认显示从 `1` 开始的序号，已完成的步骤显示完成图标，出错的步骤显示出错图标。位于 `default` 内部，作用域参数同 `default`。 |
 | `label` | 步骤标题部分内容，默认显示 `steps` 中项目的 `label` 字段。位于 `default` 内部，作用域参数同 `default`。 |
 | `desc` | 步骤描述部分内容，默认显示 `steps` 中项目的 `desc` 字段。位于 `default` 内部，作用域参数同 `default`。 |

-^^^scoped-slot-default
+^^^slot-default
 整个步骤项内容。

 默认内容：序号/完成图标、步骤标题、描述等内容。
--- a/one/docs/components/table.md
+++ b/one/docs/components/table.md
@ -97,9 +97,9 @@
 | `default` | 用于定义表格列，只能包含 `Column` 组件。 |
 | `no-data` | 用于定义无数据时要展现的内容。 |
 | `foot` | 表格脚部内容，整个区域将打通成为一个容器，不再保留分列。 |
-| `sub-row` | [^scoped-slot-sub-row] |
+| `sub-row` | [^slot-sub-row] |

-^^^scoped-slot-sub-row
+^^^slot-sub-row
 展开行后子行的内容。使用此插槽时，内容会作为行展开下方通栏显式的子行内容。使用此插槽时会覆盖 `Column` 的插槽 `sub-row` 内容。

 作用域参数为 `data` 内当前行数据中的所有字段，以及当前行对应索引值 `index`。
--- a/one/docs/components/time-picker.md
+++ b/one/docs/components/time-picker.md
@ -72,9 +72,9 @@

 | 名称 | 描述 |
 | -- | -- |
-| `option` | [^scoped-slot-option] |
+| `option` | [^slot-option] |

-^^^scoped-slot-option
+^^^slot-option

 下拉面板中的时间选项插槽。

--- a/one/docs/demo/table/desc.vue
+++ b/one/docs/demo/table/desc.vue
@ -2,7 +2,6 @@
 <article>
  <section>
    <veui-table
-      :ui="ui"
      :data="data"
      key-field="id"
    >
--- a/one/docs/en-US/components/alert.md
+++ b/one/docs/en-US/components/alert.md
@ -60,12 +60,12 @@ The index of current message displayed when having multiple messages.

 | Name | Description |
 | -- | -- |
-| `default` | [^scoped-slot-default] |
+| `default` | [^slot-default] |
 | `title` | The content area of the alert title. |
 | `extra` | The extra content after the alert message. |
 | `content` | The content of the whole component, including message text, status icon, previous/next navigation and close button. |

-^^^scoped-slot-default
+^^^slot-default
 The content of the message.

 Default: message text.
--- a/one/docs/en-US/components/button-group.md
+++ b/one/docs/en-US/components/button-group.md
@ -69,9 +69,9 @@ The datasource array for buttons in the group. The type of each item is `{label,
 | Name | Description |
 | -- | -- |
 | `default` | Button group's content. |
-| `item` | [^scoped-slot-item] |
+| `item` | [^slot-item] |

-^^^scoped-slot-item
+^^^slot-item
 The content of each button.

 Shows the text specified by the `label` prop by default.
--- a/one/docs/en-US/components/calendar.md
+++ b/one/docs/en-US/components/calendar.md
@ -62,9 +62,9 @@ Selected date(s) or date range(s). Data type differs according to `multiple` and
 | -- | -- |
 | `before` | Customizable area before the content of the month panel(s). |
 | `after` | Customizable area after the content of the month panel(s). |
-| `date` | [^scoped-slot-date] |
+| `date` | [^slot-date] |

-^^^scoped-slot-date
+^^^slot-date
 The content of each date cell. Displays the corresponding day of month by default.

 +++Scope properties
--- a/one/docs/en-US/components/carousel.md
+++ b/one/docs/en-US/components/carousel.md
@ -81,9 +81,9 @@ The behavior triggers item switch when radio indicator is displayed.

 | Name | Description |
 | -- | -- |
-| `item` | [^scoped-slot-item] |
+| `item` | [^slot-item] |

-^^^scoped-slot-item
+^^^slot-item
 The content of each carousel item. Displays the corresponding image by default.

 The slot scope properties are the same as each item inside `datasource` (including custom properties), with an extra `index: number`, which denotes the index within the datasource. i.e. The `slot-scope` is in the form of `{src, alt, label, index, ...}`.
--- a/one/docs/en-US/components/check-button-group.md
+++ b/one/docs/en-US/components/check-button-group.md
@ -55,9 +55,9 @@ The `value`s of the selected items.

 | Name | Description |
 | -- | -- |
-| `item` | [^scoped-slot-item] |
+| `item` | [^slot-item] |

-^^^scoped-slot-item
+^^^slot-item
 The label content of each button. Displays the value of the `label` prop by default.

 +++Scope properties
@ -85,3 +85,9 @@ Additionally, custom properties apart from the listed ones will also be passes i

 Triggers when the selected item changed. The callback parameter list is `(value: Array)` and `value` is the value array of the selected items.
 ^^^
+
+### Icons
+
+| Name | Description |
+| -- | -- |
+| `check` | The loading spinner. |
--- a/one/docs/en-US/components/checkbox-group.md
+++ b/one/docs/en-US/components/checkbox-group.md
@ -56,9 +56,9 @@ The `value`s of the selected items.

 | Name | Description |
 | -- | -- |
-| `item` | [^scoped-slot-item] |
+| `item` | [^slot-item] |

-^^^scoped-slot-item
+^^^slot-item
 The label content of each checkbox. Displays the value of the `label` prop by default.

 +++Scope properties
--- a/one/docs/en-US/components/column.md
+++ b/one/docs/en-US/components/column.md
@ -20,6 +20,8 @@ See [the demos of `Table`](./table#demos).
 | `sortable` | `boolean=` | `false` | [^sortable] |
 | `align` | `string=` | - | The alignment of cell content in the column. Supports `left`/`center`/`right`. |
 | `span` | `function(number): Object=` | | [^span] |
+| `desc` | `string` | - | The description of the column head. |
+| `filter-value` | `*` | - | The value of filter condition. `true` is the only value supported for now which indicates the column is filtered. |

 ^^^sortable
 Whether current column is sortable.
@ -43,8 +45,10 @@ You can learn more abut how to use this in `Table` component's [Demos › Advanc
 | -- | -- |
 | `head` | The table head. |
 | `foot` | [^slot-foot] |
-| `default` | [^scoped-slot-default] |
-| `sub-row` | [^scoped-slot-sub-row] |
+| `default` | [^slot-default] |
+| `sub-row` | [^slot-sub-row] |
+| `desc` | [^slot-desc] |
+| `filter` | [^slot-filter] |

 ^^^slot-foot
 The table foot.
@ -54,13 +58,13 @@ The table foot.
 :::
 ^^^

-^^^scoped-slot-default
+^^^slot-default
 The content of the table cell. Displays the property value corresponds to the `field` property in table's `data` prop.

 The slot scope properties are the same as each item inside `data`, with an extra `index: number`, which denotes the index within the row data.
 ^^^

-^^^scoped-slot-sub-row
+^^^slot-sub-row
 The content of cells in a sub row. Sub row data comes from the `children` array inside the row data in `Table`s `data` prop. The number of sub rows are determined by the length of the `children` array and the sub rows share the same column configuration with the table.

 Displays the value keyed by the `field` prop inside the sub row data, which is `data[i].children[j]` of the parent table.
@ -71,3 +75,23 @@ The slot scope properties are the same as each item inside `children`, with an e
 The `sub-row` slot of `Column` will be ignored when content is provided for `Table`'s `sub-row` slot.
 :::
 ^^^
+
+^^^slot-desc
+The content of the description overlay. Will override the `desc` prop when set.
+
+++Scope properties
+| Name | Type | Description |
+| -- | -- | -- |
+| `close` | `function(): void` | Used to close the description overlay. |
+++
+^^^
+
+^^^slot-filter
+The content of the filter dropdown.
+
+++Scope properties
+| Name | Type | Description |
+| -- | -- | -- |
+| `close` | `function(): void` | Used to close the filter dropdown. |
+++
+^^^
--- a/one/docs/en-US/components/date-picker.md
+++ b/one/docs/en-US/components/date-picker.md
@ -173,9 +173,9 @@ Whether the dropdown overlay is expanded.

 | Name | Description |
 | -- | -- |
-| `date` | [^scoped-slot-date] |
+| `date` | [^slot-date] |

-^^^scoped-slot-date
+^^^slot-date
 The content of each date cell in the dropdown overlay. Displays the corresponding day of month by default.

 +++Scope properties
--- a/one/docs/en-US/components/dropdown.md
+++ b/one/docs/en-US/components/dropdown.md
@ -99,12 +99,12 @@ Whether the dropdown menu is expanded.
 | `default` | The content of the options dropdown layer. Can be used to place `Option`s or `OptionGroups`s when the `options` prop is not specified. |
 | `before` | The content before the options in the dropdown layer. |
 | `after` | The content after the options in the dropdown layer. |
-| `label` | [^scoped-slot-label] |
-| `group-label` | [^scoped-slot-group-label] |
-| `option-label` | [^scoped-slot-option-label] |
-| `option` | [^scoped-slot-option] |
+| `label` | [^slot-label] |
+| `group-label` | [^slot-group-label] |
+| `option-label` | [^slot-option-label] |
+| `option` | [^slot-option] |

-^^^scoped-slot-label
+^^^slot-label
 The content of the select button. Displays the `label` prop by default.

 +++Scope properties
@ -114,7 +114,7 @@ The content of the select button. Displays the `label` prop by default.
 +++
 ^^^

-^^^scoped-slot-group-label
+^^^slot-group-label
 The label text of each option group (option with child `options`). Displays the `label` of the option by default.

 +++Scope properties
@ -127,7 +127,7 @@ The label text of each option group (option with child `options`). Displays the
 Additionally, custom properties in current option, apart from the listed ones, will also be passes into the scope object via `v-bind`.
 ^^^

-^^^scoped-slot-option-label
+^^^slot-option-label
 The label text of each option (option without child `options`). Displays the `label` of the option by default.

 +++Scope properties
@ -142,7 +142,7 @@ The label text of each option (option without child `options`). Displays the `la
 Additionally, custom properties in current option, apart from the listed ones, will also be passes into the scope object via `v-bind`.
 ^^^

-^^^scoped-slot-option
+^^^slot-option
 The entire content area of each option (option without child `options`). Displays the default content of `Options` component by default.

 +++Scope properties
--- a/one/docs/en-US/components/option-group.md
+++ b/one/docs/en-US/components/option-group.md
@ -47,12 +47,12 @@ The way to display child options.
 | Name | Description |
 | -- | -- |
 | `default` | The content of the options dropdown. Can be used to place `Option`s or `OptionGroups`s when the `options` prop is not specified. |
-| `label` | [^scoped-slot-label] |
-| `group-label` | [^scoped-slot-group-label] |
-| `option-label` | [^scoped-slot-option-label] |
-| `option` | [^scoped-slot-option] |
+| `label` | [^slot-label] |
+| `group-label` | [^slot-group-label] |
+| `option-label` | [^slot-option-label] |
+| `option` | [^slot-option] |

-^^^scoped-slot-label
+^^^slot-label
 The label of the option group. Displays the `label` prop by default.

 +++Scope properties
@ -63,7 +63,7 @@ The label of the option group. Displays the `label` prop by default.
 +++
 ^^^

-^^^scoped-slot-group-label
+^^^slot-group-label
 The label text of each option group (option with child `options`). Displays the `label` of the option by default.

 +++Scope properties
@ -76,7 +76,7 @@ The label text of each option group (option with child `options`). Displays the
 Additionally, custom properties in current option, apart from the listed ones, will also be passes into the scope object via `v-bind`.
 ^^^

-^^^scoped-slot-option-label
+^^^slot-option-label
 The label text of each option (option without child `options`). Displays the `label` of the option by default.

 +++Scope properties
@ -91,7 +91,7 @@ The label text of each option (option without child `options`). Displays the `la
 Additionally, custom properties in current option, apart from the listed ones, will also be passes into the scope object via `v-bind`.
 ^^^

-^^^scoped-slot-option
+^^^slot-option
 The entire content area of each option (option without child `options`). Displays the default content of `Options` component by default.

 +++Scope properties
--- a/one/docs/en-US/components/progress.md
+++ b/one/docs/en-US/components/progress.md
@ -43,9 +43,9 @@ The status of the progress. Available values are `success`/`alert`, denoting suc

 | Name | Description |
 | -- | -- |
-| `default` | [^scoped-slot-default] |
+| `default` | [^slot-default] |

-^^^scoped-slot-default
+^^^slot-default
 The description content. Displays the percentage value of the progress by default.

 +++Scope properties
--- a/one/docs/en-US/components/radio-button-group.md
+++ b/one/docs/en-US/components/radio-button-group.md
@ -54,9 +54,9 @@ The `value`s of the selected items.

 | Name | Description |
 | -- | -- |
-| `item` | [^scoped-slot-item] |
+| `item` | [^slot-item] |

-^^^scoped-slot-item
+^^^slot-item
 The label content of each button. Displays the value of the `label` prop by default.

 +++Scope properties
--- a/one/docs/en-US/components/radio-group.md
+++ b/one/docs/en-US/components/radio-group.md
@ -54,9 +54,9 @@ The `value` of the selected item.

 | Name | Description |
 | -- | -- |
-| `item` | [^scoped-slot-item] |
+| `item` | [^slot-item] |

-^^^scoped-slot-item
+^^^slot-item
 The label content of each radio. Displays the value of the `label` prop by default.

 +++Scope properties
--- a/one/docs/en-US/components/region-picker.md
+++ b/one/docs/en-US/components/region-picker.md
@ -41,9 +41,9 @@ The array of selected `value`s.

 | Name | Description |
 | -- | -- |
-| `label` | [^scoped-slot-label] |
+| `label` | [^slot-label] |

-^^^scoped-slot-label
+^^^slot-label
 The label content of each node. Displays the `label` property of each item by default.

 +++Scope properties
--- a/one/docs/en-US/components/schedule.md
+++ b/one/docs/en-US/components/schedule.md
@ -59,12 +59,12 @@ Shortcut selection list. The type is `{label: string, selected: boolean|Array}`.
 | `header-content` | The content of the header section, not including the container. |
 | `shortcuts` | The shortcuts section of the header section. |
 | `legend` | The legends section of the header section. |
-| `legend-label` | [^scoped-slot-legend-label] |
-| `hour` | [^scoped-slot-hour] |
-| `label` | [^scoped-slot-label] |
-| `tooltip` | [^scoped-slot-tooltip] |
+| `legend-label` | [^slot-legend-label] |
+| `hour` | [^slot-hour] |
+| `label` | [^slot-label] |
+| `tooltip` | [^slot-tooltip] |

-^^^scoped-slot-legend-label
+^^^slot-legend-label
 The text label of each legend. Displays the `label` property of each legend by default.

 +++Scope properties
@ -77,7 +77,7 @@ The text label of each legend. Displays the `label` property of each legend by d
 Additionally, custom properties inside `statuses` apart from the listed ones will also be passes into the scope object via `v-bind`.
 ^^^

-^^^scoped-slot-hour
+^^^slot-hour
 The content of each hour cell.

 +++Scope properties
@ -88,7 +88,7 @@ The content of each hour cell.
 +++
 ^^^

-^^^scoped-slot-label
+^^^slot-label
 The content of the selected label. By default, displays the time range in the form of <code>&#0096;${from}:00–${to + 1}:00&#0096;</code> when it's more than 3 hours, displays “Entire Day” when every hour of a day are selected; displays nothing for less than 3 hours.

 +++Scope properties
@ -99,7 +99,7 @@ The content of the selected label. By default, displays the time range in the fo
 +++
 ^^^

-^^^scoped-slot-tooltip
+^^^slot-tooltip
 The tooltip for each hour cell. Displays <code>&#0096;${hour}:00–${hour + 1}:00&#0096;</code> for current hour by default.

 +++Scope properties
--- a/one/docs/en-US/components/select.md
+++ b/one/docs/en-US/components/select.md
@ -98,12 +98,12 @@ Whether the dropdown menu is expanded.
 | `default` | The content of the options dropdown layer. Can be used to place `Option`s or `OptionGroups`s when the `options` prop is not specified. |
 | `before` | The content before the options in the dropdown layer. |
 | `after` | The content after the options in the dropdown layer. |
-| `label` | [^scoped-slot-label] |
-| `group-label` | [^scoped-slot-group-label] |
-| `option-label` | [^scoped-slot-option-label] |
-| `option` | [^scoped-slot-option] |
+| `label` | [^slot-label] |
+| `group-label` | [^slot-group-label] |
+| `option-label` | [^slot-option-label] |
+| `option` | [^slot-option] |

-^^^scoped-slot-label
+^^^slot-label
 The content of the select button. Displays the `label` of selected option or the text content of the selected embedded option by default.

 +++Scope properties
@ -118,7 +118,7 @@ The content of the select button. Displays the `label` of selected option or the
 Additionally, custom properties apart from the listed ones will also be passes into the scope object via `v-bind`.
 ^^^

-^^^scoped-slot-group-label
+^^^slot-group-label
 The label text of each option group (option with child `options`). Displays the `label` of the option by default.

 +++Scope properties
@ -131,7 +131,7 @@ The label text of each option group (option with child `options`). Displays the
 Additionally, custom properties in current option, apart from the listed ones, will also be passes into the scope object via `v-bind`.
 ^^^

-^^^scoped-slot-option-label
+^^^slot-option-label
 The label text of each option (option without child `options`). Displays the `label` of the option by default.

 +++Scope properties
@ -146,7 +146,7 @@ The label text of each option (option without child `options`). Displays the `la
 Additionally, custom properties in current option, apart from the listed ones, will also be passes into the scope object via `v-bind`.
 ^^^

-^^^scoped-slot-option
+^^^slot-option
 The entire content area of each option (option without child `options`). Displays the default content of `Options` component by default.

 +++Scope properties
--- a/one/docs/en-US/components/slider.md
+++ b/one/docs/en-US/components/slider.md
@ -83,10 +83,10 @@ When `parse` and `format` are specified, values can be of any type, and `parse`
 | -- | -- |
 | `track` | The track of the slider. Displays a bar by default. |
 | `tip-label` | The tooltip content. Displays the current `value` or its item by default. |
-| `thumb` | [^scoped-slot-thumb] |
-| `tip` | [^scoped-slot-tip] |
+| `thumb` | [^slot-thumb] |
+| `tip` | [^slot-tip] |

-^^^scoped-slot-thumb
+^^^slot-thumb
 The thumb(s) of the slider. Displays a round button by default.

 +++Scope properties
@ -99,7 +99,7 @@ The thumb(s) of the slider. Displays a round button by default.
 +++
 ^^^

-^^^scoped-slot-tip
+^^^slot-tip
 The entire tooltip for each thumb. Displays a `Tooltip` component with `value` as its content by default.

 +++Scope properties
--- a/one/docs/en-US/components/steps.md
+++ b/one/docs/en-US/components/steps.md
@ -54,12 +54,12 @@ The datasource of steps with item type being `{ label, desc, to, status }`.

 | Name | Description |
 | -- | -- |
-| `default` | [^scoped-slot-default] |
+| `default` | [^slot-default] |
 | `index` | The step index. Displays an index value starts from `1`, a success icon for finished steps by default and an error icon for error steps. Resides inside the default slot and share the same scope properties. |
 | `label` | The step label. Displays the `label` prop by default. Resides inside the default slot and share the same scope properties. |
 | `desc` | The step description. Displays the `desc` prop by default. Resides inside the default slot and share the same scope properties. |

-^^^scoped-slot-default
+^^^slot-default
 The content of each step. Displays the step index/completed icon, label and description by default.

 +++Scope properties
--- a/one/docs/en-US/components/table.md
+++ b/one/docs/en-US/components/table.md
@ -91,9 +91,9 @@ The values of expanded rows. Each item is the value keyed by the `key-field` pro
 | `default` | The columns of the table. Can only have `Column` components as children. |
 | `no-data` | The content to be displayed when there's no data to show. |
 | `foot` | The content of the table foot. Will span across all columns when defined. |
-| `sub-row` | [^scoped-slot-sub-row] |
+| `sub-row` | [^slot-sub-row] |

-^^^scoped-slot-sub-row
+^^^slot-sub-row
 The content of the expanded sub-row. Will span across all columns and override the `sub-row` slot of the `Column` components inside the table.

 The slot scope properties are the same as each item inside `datasource`, with an extra `index: number`, which denotes the index within the datasource.
--- a/one/docs/en-US/index.md
+++ b/one/docs/en-US/index.md
@ -17,7 +17,7 @@

 VEUI is designed to keep components and styles separated. Users can develop and specify their own theme package for VEUI. `veui-theme-dls` is the built-in theme package.

-VEUI is published as ES modules with untranspiled ES next code thus requires to be compiled along with the application project.
+VEUI is published as Vue single file components and ES modules with untranspiled ES next code thus requires to be compiled along with the application project.

 Apart from components, VEUI also offers various powerful directives and plugins to boost application development based on Vue.js.

--- a/one/docs/index.md
+++ b/one/docs/index.md
@ -17,7 +17,7 @@

 VEUI 采用组件库样式与逻辑分离的方式开发，用户可以灵活地指定甚至自行开发 VEUI 的主题包。VEUI 官方提供的默认主题包为 `veui-theme-dls`。

-VEUI 是以 ES Next 源码形式通过 ES module 格式进行发布的，需要与用户项目本身一同编译构建。VEUI 除了提供丰富的组件，还提供多个功能强大的指令及插件，帮助开发者迅速搭建基于 Vue 的应用。
+VEUI 是通过未经转译的 Vue 单位件组件及 ES 模块进行发布的，需要与用户项目本身一同编译构建。VEUI 除了提供丰富的组件，还提供多个功能强大的指令及插件，帮助开发者迅速搭建基于 Vue 的应用。

 #### 浏览器兼容性

--- a/package-lock.json
+++ b/package-lock.json
@ -3549,9 +3549,9 @@
      }
    },
    "babel-plugin-veui": {
-      "version": "2.0.0-beta.22",
-      "resolved": "https://registry.npmjs.org/babel-plugin-veui/-/babel-plugin-veui-2.0.0-beta.22.tgz",
-      "integrity": "sha512-ubdLh+jvTNsAoIhTCiZRdwula3d5u1cmsB4yfbkCz0WNwUXsVn/eO3jF66UfEBOsbajvWnxYZoLMmihf2zcn7g==",
+      "version": "2.0.0-beta.24",
+      "resolved": "https://registry.npmjs.org/babel-plugin-veui/-/babel-plugin-veui-2.0.0-beta.24.tgz",
+      "integrity": "sha512-CBGFYIz+bf8TSfKThNKp8gCfBOxdzcaq1hxicJ0F4yYq8DTroZwKymJMp9e6WxsuHit3bBpn3tSXD1M4Is/Fzg==",
      "dev": true
    },
    "babel-runtime": {
@ -8971,9 +8971,9 @@
      }
    },
    "less-plugin-dls": {
-      "version": "1.0.0-alpha.34",
-      "resolved": "https://registry.npmjs.org/less-plugin-dls/-/less-plugin-dls-1.0.0-alpha.34.tgz",
-      "integrity": "sha512-7miks1JydXWbMGhlQiM4EM/tF2Cd5oAhQbb+47BoUlv0KGdsdpRu2y9G3nKO3n4H0/8JfNxQy2+ZisOKf2MgxQ==",
+      "version": "1.0.0-alpha.35",
+      "resolved": "https://registry.npmjs.org/less-plugin-dls/-/less-plugin-dls-1.0.0-alpha.35.tgz",
+      "integrity": "sha512-05RwxhXrXnZa4SYCVOJ1mrKP/Fuy40VIfIlSFhBHn94SB56s87izDgXIvcHGd7hH11u8j95SxZt3wCZCXy0WkA==",
      "dev": true,
      "requires": {
        "arg": "^4.1.3",
@ -15773,9 +15773,9 @@
      }
    },
    "veui": {
-      "version": "2.0.0-beta.22",
-      "resolved": "https://registry.npmjs.org/veui/-/veui-2.0.0-beta.22.tgz",
-      "integrity": "sha512-Hj/do/aBYVmAkLkWWmPm8crijL9+z1q7RB+Vat/tiEyQgFXa4WmrYgjocVKX43LLD3QftVjhts8U5PR5RYO2JA==",
+      "version": "2.0.0-beta.24",
+      "resolved": "https://registry.npmjs.org/veui/-/veui-2.0.0-beta.24.tgz",
+      "integrity": "sha512-LNFcOjrNm5vi8J37ofJOOOrMkgLWUTcYt5s6VxT2Jiz8oHhsDmIp94DYTVMeS3mlo+qpqpUbqmyZA2TZiqqpKw==",
      "dev": true,
      "requires": {
        "bytes": "^3.0.0",
@ -15798,9 +15798,9 @@
      }
    },
    "veui-loader": {
-      "version": "2.0.0-beta.22",
-      "resolved": "https://registry.npmjs.org/veui-loader/-/veui-loader-2.0.0-beta.22.tgz",
-      "integrity": "sha512-aY2LR0huewLdSWPYhgZZ1/690WzMiwJFohZVmvDzOlke4otVMqaqtbN2L6QDwQsj/UnH++LGnyXVAQfcKToBEA==",
+      "version": "2.0.0-beta.24",
+      "resolved": "https://registry.npmjs.org/veui-loader/-/veui-loader-2.0.0-beta.24.tgz",
+      "integrity": "sha512-VgzDMLzHjSzG3lHz80aWWcu5cO1sfRTo96uDaL3pJY9wmJZqku6RhWQV8e9HqY9tsgrC378y3vL4r9xBB8VuuQ==",
      "dev": true,
      "requires": {
        "loader-utils": "^2.0.0",
@ -15890,40 +15890,40 @@
      }
    },
    "veui-theme-dls": {
-      "version": "2.0.0-beta.22",
-      "resolved": "https://registry.npmjs.org/veui-theme-dls/-/veui-theme-dls-2.0.0-beta.22.tgz",
-      "integrity": "sha512-cpcY/ree8OJU9+CFbC/OaCGzS40LGL23iDY/Mx2tqPlB4EgpxIr08DKGZwWhrXhfFbyFoI20MpbzGpDNj3Tc0A==",
+      "version": "2.0.0-beta.24",
+      "resolved": "https://registry.npmjs.org/veui-theme-dls/-/veui-theme-dls-2.0.0-beta.24.tgz",
+      "integrity": "sha512-M6crJAVMoWlqv7dOf5bhiF1R+eFazTI3sN5p2DNPDwgQNkpFQp/4QBasNHWRrd8LCcQQuKuaCq+smkWoYp0ByQ==",
      "dev": true,
      "requires": {
        "classlist-polyfill": "^1.2.0",
-        "dls-icons-vue": "^0.18.0",
+        "dls-icons-vue": "^0.19.0",
        "focus-visible": "^4.1.0",
-        "less-plugin-dls": "^1.0.0-alpha.34",
+        "less-plugin-dls": "^1.0.0-alpha.35",
        "less-plugin-est": "^3.0.0",
-        "veui-theme-dls-icons": "^2.0.0-beta.22"
+        "veui-theme-dls-icons": "^2.0.0-beta.24"
      },
      "dependencies": {
        "dls-icons-vue": {
-          "version": "0.18.0",
-          "resolved": "https://registry.npmjs.org/dls-icons-vue/-/dls-icons-vue-0.18.0.tgz",
-          "integrity": "sha512-ywQxM3FxWWYIJJ+cYn6VHtcETkRru9NxFSUfnqVowir7+CApbMVZl7aLT3R8JlfuVCFcOrlV3K9iE+gmV392og==",
+          "version": "0.19.0",
+          "resolved": "https://registry.npmjs.org/dls-icons-vue/-/dls-icons-vue-0.19.0.tgz",
+          "integrity": "sha512-jOa1cPQC/5Y0ZzngLnyAJ1OX969pHTLl34Bm7D0sqYxYRYzTzBjSvajDe8hN+83TCjrE3L4GNwqY/QmzSixYTQ==",
          "dev": true
        }
      }
    },
    "veui-theme-dls-icons": {
-      "version": "2.0.0-beta.22",
-      "resolved": "https://registry.npmjs.org/veui-theme-dls-icons/-/veui-theme-dls-icons-2.0.0-beta.22.tgz",
-      "integrity": "sha512-1KHFU4SiLJrtvpkhlLnoCh7FvPxGlps9BC2+sg2N61l9kjVvQMcvFTuxpt0uOvMAuyIfvuSph3CyKERtd2WgRQ==",
+      "version": "2.0.0-beta.24",
+      "resolved": "https://registry.npmjs.org/veui-theme-dls-icons/-/veui-theme-dls-icons-2.0.0-beta.24.tgz",
+      "integrity": "sha512-qk0ZOPnrezmBzJEEDOsKR6AN9BDf2o23uGXj7gUiL7+BWao1ww4W5E3anI1rgga3OgUkq2L5r/EPjqvd45FWbw==",
      "dev": true,
      "requires": {
-        "dls-icons-vue": "^0.18.0"
+        "dls-icons-vue": "^0.19.0"
      },
      "dependencies": {
        "dls-icons-vue": {
-          "version": "0.18.0",
-          "resolved": "https://registry.npmjs.org/dls-icons-vue/-/dls-icons-vue-0.18.0.tgz",
-          "integrity": "sha512-ywQxM3FxWWYIJJ+cYn6VHtcETkRru9NxFSUfnqVowir7+CApbMVZl7aLT3R8JlfuVCFcOrlV3K9iE+gmV392og==",
+          "version": "0.19.0",
+          "resolved": "https://registry.npmjs.org/dls-icons-vue/-/dls-icons-vue-0.19.0.tgz",
+          "integrity": "sha512-jOa1cPQC/5Y0ZzngLnyAJ1OX969pHTLl34Bm7D0sqYxYRYzTzBjSvajDe8hN+83TCjrE3L4GNwqY/QmzSixYTQ==",
          "dev": true
        }
      }
--- a/package.json
+++ b/package.json
@ -20,7 +20,7 @@
  },
  "devDependencies": {
    "babel-plugin-lodash": "^3.3.4",
-    "babel-plugin-veui": "^2.0.0-beta.22",
+    "babel-plugin-veui": "^2.0.0-beta.24",
    "dls-icons-vue": "^0.14.0",
    "eslint": "^5.15.1",
    "eslint-config-prettier": "^4.1.0",
@ -68,10 +68,10 @@
    "stylus-loader": "^3.0.2",
    "unist-util-remove": "^1.0.1",
    "unist-util-visit": "^1.4.0",
-    "veui": "^2.0.0-beta.22",
-    "veui-loader": "^2.0.0-beta.22",
-    "veui-theme-dls": "^2.0.0-beta.22",
-    "veui-theme-dls-icons": "^2.0.0-beta.22",
+    "veui": "^2.0.0-beta.24",
+    "veui-loader": "^2.0.0-beta.24",
+    "veui-theme-dls": "^2.0.0-beta.24",
+    "veui-theme-dls-icons": "^2.0.0-beta.24",
    "vue-awesome": "^4.1.0",
    "vue-i18n": "^8.16.0",
    "vue-windows": "^0.2.4"