mdui 2.0.3 → 2.0.4

package/components/slider/slider-base.js

@@ -15,11 +15,11 @@ export class SliderBase extends RippleMixin(FocusableMixin(MduiElement)) {
     constructor() {
         super(...arguments);
         /**
-         * 最小允许值，默认为 `0`
+         * 滑块的最小值，默认为 `0`
          */
         this.min = 0;
         /**
-         * 最大允许值，默认为 `100`
+         * 滑块的最大值，默认为 `100`
          */
         this.max = 100;
         /**
@@ -31,15 +31,15 @@ export class SliderBase extends RippleMixin(FocusableMixin(MduiElement)) {
          */
         this.tickmarks = false;
         /**
-         * 是否不显示文本提示
+         * 是否隐藏文本提示
          */
         this.nolabel = false;
         /**
-         * 是否禁用
+         * 是否被禁用
          */
         this.disabled = false;
         /**
-         * 滑块名称，将与表单数据一起提交
+         * 滑块的名称，该名称将与表单数据一起提交
          */
         this.name = '';
         /**
@@ -53,18 +53,18 @@ export class SliderBase extends RippleMixin(FocusableMixin(MduiElement)) {
         this.inputRef = createRef();
         this.trackActiveRef = createRef();
         /**
-         * 用于自定义标签的显示格式
+         * 用于自定义标签的显示格式的函数。函数参数为滑块的当前值，返回值为期望显示的文本。
          */
         this.labelFormatter = (value) => value.toString();
     }
     /**
-     * 表单验证状态对象
+     * 表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)
      */
     get validity() {
         return this.inputRef.value.validity;
     }
     /**
-     * 表单验证的错误提示信息
+     * 如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串
      */
     get validationMessage() {
         return this.inputRef.value.validationMessage;
@@ -82,7 +82,7 @@ export class SliderBase extends RippleMixin(FocusableMixin(MduiElement)) {
         this.invalid = !this.inputRef.value.checkValidity();
     }
     /**
-     * 检查表单字段是否验证通过。若未通过则返回 `false`，并触发 `invalid` 事件；若验证通过，则返回 `true`
+     * 检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`
      */
     checkValidity() {
         const valid = this.inputRef.value.checkValidity();
@@ -97,9 +97,9 @@ export class SliderBase extends RippleMixin(FocusableMixin(MduiElement)) {
         return valid;
     }
     /**
-     * 检查表单字段是否验证通过。若未通过则返回 `false`，并触发 `invalid` 事件；若验证通过，则返回 `true`。
+     * 检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。
      *
-     * 验证未通过时，还将在组件上显示未通过的提示。
+     * 如果验证未通过，还会在组件上显示验证失败的提示。
      */
     reportValidity() {
         this.invalid = !this.inputRef.value.reportValidity();
@@ -119,9 +119,9 @@ export class SliderBase extends RippleMixin(FocusableMixin(MduiElement)) {
         return !this.invalid;
     }
     /**
-     * 设置自定义的错误提示文本。只要文本不为空，则表示字段验证未通过
+     * 设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证
      *
-     * @param message 自定义的提示文本
+     * @param message 自定义的错误提示文本
      */
     setCustomValidity(message) {
         this.inputRef.value.setCustomValidity(message);

package/components/snackbar/index.d.ts

@@ -17,18 +17,18 @@ import type { CSSResultGroup, TemplateResult } from 'lit';
  * @event closed - Snackbar 隐藏动画完成时，事件被触发
  * @event action-click - 点击操作按钮时触发
  *
- * @slot - Snackbar 中的消息文本内容
+ * @slot - Snackbar 的消息文本内容
  * @slot action - 右侧的操作按钮
- * @slot close-button - 右侧的关闭按钮。必须设置 `closeable` 属性为 `true` 才会显示该按钮
- * @slot close-icon - 右侧的关闭按钮中的图标
+ * @slot close-button - 右侧的关闭按钮。必须设置 `closeable` 属性为 `true` 才会显示
+ * @slot close-icon - 关闭按钮中的图标
  *
  * @csspart message - 消息文本
  * @csspart action - 操作按钮
  * @csspart close-button - 关闭按钮
  * @csspart close-icon - 关闭按钮中的图标
  *
- * @cssprop --shape-corner - 组件的圆角大小。可以指定一个具体的像素值；但更推荐[引用设计令牌](/docs/2/styles/design-tokens#shape-corner)
- * @cssprop --z-index - 组件的 CSS 的 `z-index` 值
+ * @cssprop --shape-corner - 组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)
+ * @cssprop --z-index - 组件的 CSS `z-index` 值
  */
 export declare class Snackbar extends MduiElement<SnackbarEventMap> {
     static styles: CSSResultGroup;
@@ -37,22 +37,22 @@ export declare class Snackbar extends MduiElement<SnackbarEventMap> {
      */
     open: boolean;
     /**
-     * Snackbar 出现的位置。默认为 `bottom`。可选值为：
+     * Snackbar 的显示位置。默认为 `bottom`。可选值包括：
      *
-     * * `top`：位于顶部，居中对齐
-     * * `top-start`：位于顶部，左对齐
-     * * `top-end`：位于顶部，右对齐
-     * * `bottom`：位于底部，居中对齐
-     * * `bottom-start`：位于底部，左对齐
-     * * `bottom-end`：位于底部，右对齐
+     * * `top`：顶部居中
+     * * `top-start`：顶部左对齐
+     * * `top-end`：顶部右对齐
+     * * `bottom`：底部居中
+     * * `bottom-start`：底部左对齐
+     * * `bottom-end`：底部右对齐
      */
-    placement: /*位于顶部，居中对齐*/ 'top' | /*位于顶部，左对齐*/ 'top-start' | /*位于顶部，右对齐*/ 'top-end' | /*位于底部，居中对齐*/ 'bottom' | /*位于底部，左对齐*/ 'bottom-start' | /*位于底部，右对齐*/ 'bottom-end';
+    placement: /*顶部居中*/ 'top' | /*顶部左对齐*/ 'top-start' | /*顶部右对齐*/ 'top-end' | /*底部居中*/ 'bottom' | /*底部左对齐*/ 'bottom-start' | /*底部右对齐*/ 'bottom-end';
     /**
      * 操作按钮的文本。也可以通过 `slot="action"` 设置操作按钮
      */
     action?: string;
     /**
-     * 操作按钮是否为 loading 状态
+     * 操作按钮是否处于加载中状态
      */
     actionLoading: boolean;
     /**
@@ -60,22 +60,22 @@ export declare class Snackbar extends MduiElement<SnackbarEventMap> {
      */
     closeable: boolean;
     /**
-     * 关闭按钮中的 Material Icons 图标名。也可以通过 `slot="close-icon"` 设置
+     * 关闭按钮的 Material Icons 图标名。也可以通过 `slot="close-icon"` 设置
      */
     closeIcon?: string;
     /**
-     * 消息文本最多显示几行。默认不限制行数。可选值为：
+     * 消息文本的最大显示行数。默认不限制。可选值包括：
      *
-     * * `1`：消息文本最多显示一行
-     * * `2`：消息文本最多显示两行
+     * * `1`：最多显示一行
+     * * `2`：最多显示两行
      */
-    messageLine?: /*消息文本最多显示一行*/ 1 | /*消息文本最多显示两行*/ 2;
+    messageLine?: /*最多显示一行*/ 1 | /*最多显示两行*/ 2;
     /**
-     * 在多长时间后自动关闭（单位为毫秒）。设置为 `0` 时，不自动关闭。默认为 5 秒后自动关闭。
+     * 自动关闭的延迟时间（单位：毫秒）。设置为 `0` 则不自动关闭。默认为 5000 毫秒
      */
     autoCloseDelay: number;
     /**
-     * 点击或触摸 Snackbar 以外的区域时是否关闭 Snackbar
+     * 点击或触摸 Snackbar 以外的区域时，是否关闭 Snackbar
      */
     closeOnOutsideClick: boolean;
     private closeTimeout;

package/components/snackbar/index.js

@@ -28,18 +28,18 @@ import { style } from './style.js';
  * @event closed - Snackbar 隐藏动画完成时，事件被触发
  * @event action-click - 点击操作按钮时触发
  *
- * @slot - Snackbar 中的消息文本内容
+ * @slot - Snackbar 的消息文本内容
  * @slot action - 右侧的操作按钮
- * @slot close-button - 右侧的关闭按钮。必须设置 `closeable` 属性为 `true` 才会显示该按钮
- * @slot close-icon - 右侧的关闭按钮中的图标
+ * @slot close-button - 右侧的关闭按钮。必须设置 `closeable` 属性为 `true` 才会显示
+ * @slot close-icon - 关闭按钮中的图标
  *
  * @csspart message - 消息文本
  * @csspart action - 操作按钮
  * @csspart close-button - 关闭按钮
  * @csspart close-icon - 关闭按钮中的图标
  *
- * @cssprop --shape-corner - 组件的圆角大小。可以指定一个具体的像素值；但更推荐[引用设计令牌](/docs/2/styles/design-tokens#shape-corner)
- * @cssprop --z-index - 组件的 CSS 的 `z-index` 值
+ * @cssprop --shape-corner - 组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)
+ * @cssprop --z-index - 组件的 CSS `z-index` 值
  */
 let Snackbar = class Snackbar extends MduiElement {
     constructor() {
@@ -49,18 +49,18 @@ let Snackbar = class Snackbar extends MduiElement {
          */
         this.open = false;
         /**
-         * Snackbar 出现的位置。默认为 `bottom`。可选值为：
+         * Snackbar 的显示位置。默认为 `bottom`。可选值包括：
          *
-         * * `top`：位于顶部，居中对齐
-         * * `top-start`：位于顶部，左对齐
-         * * `top-end`：位于顶部，右对齐
-         * * `bottom`：位于底部，居中对齐
-         * * `bottom-start`：位于底部，左对齐
-         * * `bottom-end`：位于底部，右对齐
+         * * `top`：顶部居中
+         * * `top-start`：顶部左对齐
+         * * `top-end`：顶部右对齐
+         * * `bottom`：底部居中
+         * * `bottom-start`：底部左对齐
+         * * `bottom-end`：底部右对齐
          */
         this.placement = 'bottom';
         /**
-         * 操作按钮是否为 loading 状态
+         * 操作按钮是否处于加载中状态
          */
         this.actionLoading = false;
         /**
@@ -68,11 +68,11 @@ let Snackbar = class Snackbar extends MduiElement {
          */
         this.closeable = false;
         /**
-         * 在多长时间后自动关闭（单位为毫秒）。设置为 `0` 时，不自动关闭。默认为 5 秒后自动关闭。
+         * 自动关闭的延迟时间（单位：毫秒）。设置为 `0` 则不自动关闭。默认为 5000 毫秒
          */
         this.autoCloseDelay = 5000;
         /**
-         * 点击或触摸 Snackbar 以外的区域时是否关闭 Snackbar
+         * 点击或触摸 Snackbar 以外的区域时，是否关闭 Snackbar
          */
         this.closeOnOutsideClick = false;
         this.onDocumentClick = this.onDocumentClick.bind(this);

package/components/switch/index.d.ts

@@ -26,8 +26,8 @@ declare const Switch_base: import("@open-wc/dedupe-mixin").Constructor<import(".
  * @csspart unchecked-icon - 未选中状态的图标
  * @csspart checked-icon 选中状态的图标
  *
- * @cssprop --shape-corner - 组件的轨道的圆角大小。可以指定一个具体的像素值；但更推荐[引用设计令牌](/docs/2/styles/design-tokens#shape-corner)
- * @cssprop --shape-corner-thumb - 组件的图标容器的圆角大小。可以指定一个具体的像素值；但更推荐[引用设计令牌](/docs/2/styles/design-tokens#shape-corner)
+ * @cssprop --shape-corner - 组件轨道的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)
+ * @cssprop --shape-corner-thumb - 组件图标容器的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)
  */
 export declare class Switch extends Switch_base<SwitchEventMap> implements FormControl {
     static styles: CSSResultGroup;
@@ -40,7 +40,7 @@ export declare class Switch extends Switch_base<SwitchEventMap> implements FormC
      */
     checked: boolean;
     /**
-     * 默认选中状态。在重置表单时，将重置为该默认状态。该属性只能通过 JavaScript 属性设置
+     * 默认选中状态。在重置表单时，将重置为此状态。此属性只能通过 JavaScript 属性设置
      */
     defaultChecked: boolean;
     /**
@@ -50,17 +50,17 @@ export declare class Switch extends Switch_base<SwitchEventMap> implements FormC
     /**
      * 选中状态的 Material Icons 图标名。也可以通过 `slot="checked-icon"` 设置
      *
-     * 默认为 check 图标，可传入空字符串移除默认图标
+     * 默认为 `check` 图标，可传入空字符串移除默认图标
      */
     checkedIcon?: string;
     /**
-     * 提交表单时，是否必须选中该开关
+     * 提交表单时，是否必须选中此开关
      */
     required: boolean;
     /**
-     * 关联的 `form` 元素。此属性值必须为同一页面中的一个 `<form>` 元素的 `id` 属性。
+     * 关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。
      *
-     * 如果此属性未指定，则元素必须是 `form` 元素的后代。利用此属性，你可以将元素放置在页面中的任何位置，而不仅仅是作为 `form` 元素的后代。
+     * 如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。
      */
     form?: string;
     /**
@@ -80,11 +80,11 @@ export declare class Switch extends Switch_base<SwitchEventMap> implements FormC
     private readonly formController;
     private readonly hasSlotController;
     /**
-     * 表单验证状态对象
+     * 表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)
      */
     get validity(): ValidityState;
     /**
-     * 表单验证的错误提示信息
+     * 如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串
      */
     get validationMessage(): string;
     protected get rippleElement(): Ripple;
@@ -94,19 +94,19 @@ export declare class Switch extends Switch_base<SwitchEventMap> implements FormC
     private onDisabledChange;
     private onCheckedChange;
     /**
-     * 检查表单字段是否验证通过。若未通过则返回 `false`，并触发 `invalid` 事件；若验证通过，则返回 `true`
+     * 检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`
      */
     checkValidity(): boolean;
     /**
-     * 检查表单字段是否验证通过。若未通过则返回 `false`，并触发 `invalid` 事件；若验证通过，则返回 `true`。
+     * 检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。
      *
-     * 验证未通过时，还将在组件上显示未通过的提示。
+     * 如果验证未通过，还会在组件上显示验证失败的提示。
      */
     reportValidity(): boolean;
     /**
-     * 设置自定义的错误提示文本。只要文本不为空，则表示字段验证未通过
+     * 设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证
      *
-     * @param message 自定义的提示文本
+     * @param message 自定义的错误提示文本
      */
     setCustomValidity(message: string): void;
     protected render(): TemplateResult;

package/components/switch/index.js

@@ -39,8 +39,8 @@ import { style } from './style.js';
  * @csspart unchecked-icon - 未选中状态的图标
  * @csspart checked-icon 选中状态的图标
  *
- * @cssprop --shape-corner - 组件的轨道的圆角大小。可以指定一个具体的像素值；但更推荐[引用设计令牌](/docs/2/styles/design-tokens#shape-corner)
- * @cssprop --shape-corner-thumb - 组件的图标容器的圆角大小。可以指定一个具体的像素值；但更推荐[引用设计令牌](/docs/2/styles/design-tokens#shape-corner)
+ * @cssprop --shape-corner - 组件轨道的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)
+ * @cssprop --shape-corner-thumb - 组件图标容器的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)
  */
 let Switch = class Switch extends RippleMixin(FocusableMixin(MduiElement)) {
     constructor() {
@@ -54,11 +54,11 @@ let Switch = class Switch extends RippleMixin(FocusableMixin(MduiElement)) {
          */
         this.checked = false;
         /**
-         * 默认选中状态。在重置表单时，将重置为该默认状态。该属性只能通过 JavaScript 属性设置
+         * 默认选中状态。在重置表单时，将重置为此状态。此属性只能通过 JavaScript 属性设置
          */
         this.defaultChecked = false;
         /**
-         * 提交表单时，是否必须选中该开关
+         * 提交表单时，是否必须选中此开关
          */
         this.required = false;
         /**
@@ -83,13 +83,13 @@ let Switch = class Switch extends RippleMixin(FocusableMixin(MduiElement)) {
         this.hasSlotController = new HasSlotController(this, 'unchecked-icon');
     }
     /**
-     * 表单验证状态对象
+     * 表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)
      */
     get validity() {
         return this.inputRef.value.validity;
     }
     /**
-     * 表单验证的错误提示信息
+     * 如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串
      */
     get validationMessage() {
         return this.inputRef.value.validationMessage;
@@ -123,7 +123,7 @@ let Switch = class Switch extends RippleMixin(FocusableMixin(MduiElement)) {
         }
     }
     /**
-     * 检查表单字段是否验证通过。若未通过则返回 `false`，并触发 `invalid` 事件；若验证通过，则返回 `true`
+     * 检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`
      */
     checkValidity() {
         const valid = this.inputRef.value.checkValidity();
@@ -137,9 +137,9 @@ let Switch = class Switch extends RippleMixin(FocusableMixin(MduiElement)) {
         return valid;
     }
     /**
-     * 检查表单字段是否验证通过。若未通过则返回 `false`，并触发 `invalid` 事件；若验证通过，则返回 `true`。
+     * 检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。
      *
-     * 验证未通过时，还将在组件上显示未通过的提示。
+     * 如果验证未通过，还会在组件上显示验证失败的提示。
      */
     reportValidity() {
         this.invalid = !this.inputRef.value.reportValidity();
@@ -158,9 +158,9 @@ let Switch = class Switch extends RippleMixin(FocusableMixin(MduiElement)) {
         return !this.invalid;
     }
     /**
-     * 设置自定义的错误提示文本。只要文本不为空，则表示字段验证未通过
+     * 设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证
      *
-     * @param message 自定义的提示文本
+     * @param message 自定义的错误提示文本
      */
     setCustomValidity(message) {
         this.inputRef.value.setCustomValidity(message);

package/components/tabs/tab-panel.d.ts

@@ -1,7 +1,7 @@
 import { MduiElement } from '@mdui/shared/base/mdui-element.js';
 import type { CSSResultGroup, TemplateResult } from 'lit';
 /**
- * @summary 选项卡面板项组件。需与 `<mdui-tabs>` 和 `<mdui-tab>` 组件配合使用
+ * @summary 选项卡面板项组件。需配合 `<mdui-tabs>` 和 `<mdui-tab>` 组件使用
  *
  * ```html
  * <mdui-tabs value="tab-1">
@@ -15,12 +15,12 @@ import type { CSSResultGroup, TemplateResult } from 'lit';
  * </mdui-tabs>
  * ```
  *
- * @slot - 选项卡面板内容
+ * @slot - 选项卡面板项内容
  */
 export declare class TabPanel extends MduiElement<TabPanelEventMap> {
     static styles: CSSResultGroup;
     /**
-     * 该选项卡面板的值
+     * 选项卡面板项的值
      */
     value?: string;
     /**

package/components/tabs/tab-panel.js

@@ -6,7 +6,7 @@ import { booleanConverter } from '@mdui/shared/helpers/decorator.js';
 import { componentStyle } from '@mdui/shared/lit-styles/component-style.js';
 import { tabPanelStyle } from './tab-panel-style.js';
 /**
- * @summary 选项卡面板项组件。需与 `<mdui-tabs>` 和 `<mdui-tab>` 组件配合使用
+ * @summary 选项卡面板项组件。需配合 `<mdui-tabs>` 和 `<mdui-tab>` 组件使用
  *
  * ```html
  * <mdui-tabs value="tab-1">
@@ -20,7 +20,7 @@ import { tabPanelStyle } from './tab-panel-style.js';
  * </mdui-tabs>
  * ```
  *
- * @slot - 选项卡面板内容
+ * @slot - 选项卡面板项内容
  */
 let TabPanel = class TabPanel extends MduiElement {
     constructor() {

package/components/tabs/tab.d.ts

@@ -4,7 +4,7 @@ import type { Ripple } from '../ripple/index.js';
 import type { CSSResultGroup, TemplateResult } from 'lit';
 declare const Tab_base: import("@open-wc/dedupe-mixin").Constructor<import("../ripple/ripple-mixin.js").RippleMixinInterface> & import("@open-wc/dedupe-mixin").Constructor<import("@mdui/shared/mixins/focusable.js").FocusableMixinInterface> & typeof MduiElement;
 /**
- * @summary 选项卡项组件。需与 `<mdui-tabs>` 和 `<mdui-tab-panel>` 组件配合使用
+ * @summary 选项卡导航项组件。需配合 `<mdui-tabs>` 和 `<mdui-tab-panel>` 组件使用
  *
  * ```html
  * <mdui-tabs value="tab-1">
@@ -21,19 +21,19 @@ declare const Tab_base: import("@open-wc/dedupe-mixin").Constructor<import("../r
  * @event focus - 获得焦点时触发
  * @event blur - 失去焦点时触发
  *
- * @slot - 选项卡导航项的文本
+ * @slot - 选项卡导航项的文本内容
  * @slot icon - 选项卡导航项中的图标
  * @slot badge - 徽标
  * @slot custom - 自定义整个选项卡导航项中的内容
  *
- * @csspart container - 导航项容器
- * @csspart icon - 导航项中的图标
- * @csspart label - 导航项的文本
+ * @csspart container - 选项卡导航项容器
+ * @csspart icon - 选项卡导航项中的图标
+ * @csspart label - 选项卡导航项的文本
  */
 export declare class Tab extends Tab_base<TabEventMap> {
     static styles: CSSResultGroup;
     /**
-     * 该选项卡导航项的值
+     * 选项卡导航项的值
      */
     value?: string;
     /**

package/components/tabs/tab.js

@@ -15,7 +15,7 @@ import '../icon.js';
 import { RippleMixin } from '../ripple/ripple-mixin.js';
 import { tabStyle } from './tab-style.js';
 /**
- * @summary 选项卡项组件。需与 `<mdui-tabs>` 和 `<mdui-tab-panel>` 组件配合使用
+ * @summary 选项卡导航项组件。需配合 `<mdui-tabs>` 和 `<mdui-tab-panel>` 组件使用
  *
  * ```html
  * <mdui-tabs value="tab-1">
@@ -32,14 +32,14 @@ import { tabStyle } from './tab-style.js';
  * @event focus - 获得焦点时触发
  * @event blur - 失去焦点时触发
  *
- * @slot - 选项卡导航项的文本
+ * @slot - 选项卡导航项的文本内容
  * @slot icon - 选项卡导航项中的图标
  * @slot badge - 徽标
  * @slot custom - 自定义整个选项卡导航项中的内容
  *
- * @csspart container - 导航项容器
- * @csspart icon - 导航项中的图标
- * @csspart label - 导航项的文本
+ * @csspart container - 选项卡导航项容器
+ * @csspart icon - 选项卡导航项中的图标
+ * @csspart label - 选项卡导航项的文本
  */
 let Tab = class Tab extends RippleMixin(FocusableMixin(MduiElement)) {
     constructor() {

package/components/tabs/tabs.d.ts

@@ -5,7 +5,7 @@ import '@mdui/jq/methods/get.js';
 import { MduiElement } from '@mdui/shared/base/mdui-element.js';
 import type { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
 /**
- * @summary 选项卡组件。需与 `<mdui-tab>` 和 `<mdui-tab-panel>` 组件配合使用
+ * @summary 选项卡组件。需配合 `<mdui-tab>` 和 `<mdui-tab-panel>` 组件使用
  *
  * ```html
  * <mdui-tabs value="tab-1">
@@ -30,33 +30,33 @@ import type { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
 export declare class Tabs extends MduiElement<TabsEventMap> {
     static styles: CSSResultGroup;
     /**
-     * 选项卡形状。可选值为：
+     * 选项卡形状。可选值包括：
      *
-     * * `primary`：位于 `<mdui-top-app-bar>` 下方，用于切换应用的主页面时，可使用该形状的选项卡
-     * * `secondary`：位于页面中，用于切换一组相关内容时，可使用该形状的选项卡
+     * * `primary`：适用于位于 `<mdui-top-app-bar>` 下方，用于切换应用的主页面的场景
+     * * `secondary`：适用于位于页面中，用于切换一组相关内容的场景
      */
-    variant: /*位于 `<mdui-top-app-bar>` 下方，用于切换应用的主页面时，可使用该形状的选项卡*/ 'primary' | /*位于页面中，用于切换一组相关内容时，可使用该形状的选项卡*/ 'secondary';
+    variant: /*适用于位于 `<mdui-top-app-bar>` 下方，用于切换应用的主页面的场景*/ 'primary' | /*适用于位于页面中，用于切换一组相关内容的场景*/ 'secondary';
     /**
      * 当前激活的 `<mdui-tab>` 的值
      */
     value?: string;
     /**
-     * 选项卡位置。默认为 `top-start`。可选值为：
+     * 选项卡位置。默认为 `top-start`。可选值包括：
      *
-     * * `top-start`：位于上方，且左对齐
-     * * `top`：位于上方，且居中对齐
-     * * `top-end`：位于上方，且右对齐
-     * * `bottom-start`：位于下方，且左对齐
-     * * `bottom`：位于下方，且居中对齐
-     * * `bottom-end`：位于下方，且右对齐
-     * * `left-start`：位于左侧，且顶部对齐
-     * * `left`：位于左侧，且居中对齐
-     * * `left-end`：位于左侧，且底部对齐
-     * * `right-start`：位于右侧，且顶部对齐
-     * * `right`：位于右侧，且居中对齐
-     * * `right-end`：位于右侧，且底部对齐
+     * * `top-start`：位于上方，左对齐
+     * * `top`：位于上方，居中对齐
+     * * `top-end`：位于上方，右对齐
+     * * `bottom-start`：位于下方，左对齐
+     * * `bottom`：位于下方，居中对齐
+     * * `bottom-end`：位于下方，右对齐
+     * * `left-start`：位于左侧，顶部对齐
+     * * `left`：位于左侧，居中对齐
+     * * `left-end`：位于左侧，底部对齐
+     * * `right-start`：位于右侧，顶部对齐
+     * * `right`：位于右侧，居中对齐
+     * * `right-end`：位于右侧，底部对齐
      */
-    placement: /*位于上方，且左对齐*/ 'top-start' | /*位于上方，且居中对齐*/ 'top' | /*位于上方，且右对齐*/ 'top-end' | /*位于下方，且左对齐*/ 'bottom-start' | /*位于下方，且居中对齐*/ 'bottom' | /*位于下方，且右对齐*/ 'bottom-end' | /*位于左侧，且顶部对齐*/ 'left-start' | /*位于左侧，且居中对齐*/ 'left' | /*位于左侧，且底部对齐*/ 'left-end' | /*位于右侧，且顶部对齐*/ 'right-start' | /*位于右侧，且居中对齐*/ 'right' | /*位于右侧，且底部对齐*/ 'right-end';
+    placement: /*位于上方，左对齐*/ 'top-start' | /*位于上方，居中对齐*/ 'top' | /*位于上方，右对齐*/ 'top-end' | /*位于下方，左对齐*/ 'bottom-start' | /*位于下方，居中对齐*/ 'bottom' | /*位于下方，右对齐*/ 'bottom-end' | /*位于左侧，顶部对齐*/ 'left-start' | /*位于左侧，居中对齐*/ 'left' | /*位于左侧，底部对齐*/ 'left-end' | /*位于右侧，顶部对齐*/ 'right-start' | /*位于右侧，居中对齐*/ 'right' | /*位于右侧，底部对齐*/ 'right-end';
     /**
      * 是否填满父元素宽度
      */

package/components/tabs/tabs.js

@@ -16,7 +16,7 @@ import { observeResize } from '@mdui/shared/helpers/observeResize.js';
 import { componentStyle } from '@mdui/shared/lit-styles/component-style.js';
 import { tabsStyle } from './tabs-style.js';
 /**
- * @summary 选项卡组件。需与 `<mdui-tab>` 和 `<mdui-tab-panel>` 组件配合使用
+ * @summary 选项卡组件。需配合 `<mdui-tab>` 和 `<mdui-tab-panel>` 组件使用
  *
  * ```html
  * <mdui-tabs value="tab-1">
@@ -42,27 +42,27 @@ let Tabs = class Tabs extends MduiElement {
     constructor() {
         super(...arguments);
         /**
-         * 选项卡形状。可选值为：
+         * 选项卡形状。可选值包括：
          *
-         * * `primary`：位于 `<mdui-top-app-bar>` 下方，用于切换应用的主页面时，可使用该形状的选项卡
-         * * `secondary`：位于页面中，用于切换一组相关内容时，可使用该形状的选项卡
+         * * `primary`：适用于位于 `<mdui-top-app-bar>` 下方，用于切换应用的主页面的场景
+         * * `secondary`：适用于位于页面中，用于切换一组相关内容的场景
          */
         this.variant = 'primary';
         /**
-         * 选项卡位置。默认为 `top-start`。可选值为：
+         * 选项卡位置。默认为 `top-start`。可选值包括：
          *
-         * * `top-start`：位于上方，且左对齐
-         * * `top`：位于上方，且居中对齐
-         * * `top-end`：位于上方，且右对齐
-         * * `bottom-start`：位于下方，且左对齐
-         * * `bottom`：位于下方，且居中对齐
-         * * `bottom-end`：位于下方，且右对齐
-         * * `left-start`：位于左侧，且顶部对齐
-         * * `left`：位于左侧，且居中对齐
-         * * `left-end`：位于左侧，且底部对齐
-         * * `right-start`：位于右侧，且顶部对齐
-         * * `right`：位于右侧，且居中对齐
-         * * `right-end`：位于右侧，且底部对齐
+         * * `top-start`：位于上方，左对齐
+         * * `top`：位于上方，居中对齐
+         * * `top-end`：位于上方，右对齐
+         * * `bottom-start`：位于下方，左对齐
+         * * `bottom`：位于下方，居中对齐
+         * * `bottom-end`：位于下方，右对齐
+         * * `left-start`：位于左侧，顶部对齐
+         * * `left`：位于左侧，居中对齐
+         * * `left-end`：位于左侧，底部对齐
+         * * `right-start`：位于右侧，顶部对齐
+         * * `right`：位于右侧，居中对齐
+         * * `right-end`：位于右侧，底部对齐
          */
         this.placement = 'top-start';
         /**