mdui 2.0.2 → 2.0.4

package/components/chip/index.d.ts

@@ -17,35 +17,35 @@ import type { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
  * @event change - 选中状态变更时触发
  * @event delete - 点击删除图标时触发
  *
- * @slot - 文本
+ * @slot - 纸片文本
  * @slot icon - 左侧元素
  * @slot end-icon - 右侧元素
- * @slot selected-icon - 选中状态的左侧元素
- * @slot delete-icon - 可删除时，右侧的删除元素
+ * @slot selected-icon - 选中状态下的左侧元素
+ * @slot delete-icon - 可删除时的右侧删除元素
  *
- * @csspart button - 内部的 `button` 或 `a` 元素
- * @csspart label - 文本
+ * @csspart button - 内部的 `<button>` 或 `<a>` 元素
+ * @csspart label - 纸片文本
  * @csspart icon - 左侧图标
  * @csspart end-icon - 右侧图标
- * @csspart selected-icon - 选中状态的左侧图标
- * @csspart delete-icon - 可删除时，右侧的删除图标
+ * @csspart selected-icon - 选中状态下的左侧图标
+ * @csspart delete-icon - 可删除时的右侧删除图标
  * @csspart loading - 加载中状态的 `<mdui-circular-progress>` 元素
  *
- * @cssprop --shape-corner - 组件的圆角大小。可以指定一个具体的像素值；但更推荐[引用设计令牌](/docs/2/styles/design-tokens#shape-corner)
+ * @cssprop --shape-corner - 组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)
  */
-export declare class Chip extends ButtonBase {
+export declare class Chip extends ButtonBase<ChipEventMap> {
     static styles: CSSResultGroup;
     /**
-     * 纸片形状。可选值为：
+     * 纸片的形状。可选值包括：
      *
-     * * `assist`：用于显示和当前上下文相关的辅助操作。例如在点餐页面，提供分享，收藏等功能
-     * * `filter`：用于对内容进行筛选。例如在搜索结果页，对搜索结果进行过滤
-     * * `input`：用于表示用户输入的信息片段。例如 Gmail 中“收件人”字段中的联系人
-     * * `suggestion`：用于提供动态生成的推荐信息，以简化用户操作。例如在聊天应用中猜测用户可能想发送的信息，供用户选择
+     * * `assist`：用于显示与当前上下文相关的辅助操作，如在点餐页面提供分享、收藏等功能
+     * * `filter`：用于对内容进行筛选，如在搜索结果页过滤搜索结果
+     * * `input`：用于表示用户输入的信息片段，如在 Gmail 的“收件人”字段中的联系人
+     * * `suggestion`：用于提供动态生成的推荐信息，以简化用户操作，如在聊天应用中预测用户可能想发送的信息
      */
-    variant: /*用于显示和当前上下文相关的辅助操作。例如在点餐页面，提供分享，收藏等功能*/ 'assist' | /*用于对内容进行筛选。例如在搜索结果页，对搜索结果进行过滤*/ 'filter' | /*用于表示用户输入的信息片段。例如 Gmail 中“收件人”字段中的联系人*/ 'input' | /*用于提供动态生成的推荐信息，以简化用户操作。例如在聊天应用中猜测用户可能想发送的信息，供用户选择*/ 'suggestion';
+    variant: /*用于显示与当前上下文相关的辅助操作，如在点餐页面提供分享、收藏等功能*/ 'assist' | /*用于对内容进行筛选，如在搜索结果页过滤搜索结果*/ 'filter' | /*用于表示用户输入的信息片段，如在 Gmail 的“收件人”字段中的联系人*/ 'input' | /*用于提供动态生成的推荐信息，以简化用户操作，如在聊天应用中预测用户可能想发送的信息*/ 'suggestion';
     /**
-     * 是否包含阴影
+     * 是否显示阴影
      */
     elevated: boolean;
     /**
@@ -53,11 +53,11 @@ export declare class Chip extends ButtonBase {
      */
     selectable: boolean;
     /**
-     * 是否为选中状态
+     * 是否已选中
      */
     selected: boolean;
     /**
-     * 是否可删除。为 `true` 时，在右侧会显示删除图标图标
+     * 是否可删除。为 `true` 时，纸片右侧会显示删除图标
      */
     deletable: boolean;
     /**
@@ -65,7 +65,7 @@ export declare class Chip extends ButtonBase {
      */
     icon?: string;
     /**
-     * 选中状态，左侧的 Material Icons 图标名。也可以通过 `slot="selected-icon"` 设置
+     * 选中状态下左侧的 Material Icons 图标名。也可以通过 `slot="selected-icon"` 设置
      */
     selectedIcon?: string;
     /**
@@ -73,7 +73,7 @@ export declare class Chip extends ButtonBase {
      */
     endIcon?: string;
     /**
-     * 右侧的 Material Icons 图标名。也可以通过 `slot="delete-icon"` 设置
+     * 可删除时，右侧删除图标的 Material Icons 图标名。也可以通过 `slot="delete-icon"` 设置
      */
     deleteIcon?: string;
     private readonly rippleRef;
@@ -95,6 +95,13 @@ export declare class Chip extends ButtonBase {
     private renderDeleteIcon;
     private renderInner;
 }
+export interface ChipEventMap {
+    focus: FocusEvent;
+    blur: FocusEvent;
+    invalid: CustomEvent<void>;
+    change: CustomEvent<void>;
+    delete: CustomEvent<void>;
+}
 declare global {
     interface HTMLElementTagNameMap {
         'mdui-chip': Chip;

package/components/chip/index.js

@@ -6,7 +6,6 @@ import cc from 'classcat';
 import { HasSlotController } from '@mdui/shared/controllers/has-slot.js';
 import { watch } from '@mdui/shared/decorators/watch.js';
 import { booleanConverter } from '@mdui/shared/helpers/decorator.js';
-import { emit } from '@mdui/shared/helpers/event.js';
 import { nothingTemplate } from '@mdui/shared/helpers/template.js';
 import '@mdui/shared/icons/check.js';
 import '@mdui/shared/icons/clear.js';
@@ -26,36 +25,36 @@ import { style } from './style.js';
  * @event change - 选中状态变更时触发
  * @event delete - 点击删除图标时触发
  *
- * @slot - 文本
+ * @slot - 纸片文本
  * @slot icon - 左侧元素
  * @slot end-icon - 右侧元素
- * @slot selected-icon - 选中状态的左侧元素
- * @slot delete-icon - 可删除时，右侧的删除元素
+ * @slot selected-icon - 选中状态下的左侧元素
+ * @slot delete-icon - 可删除时的右侧删除元素
  *
- * @csspart button - 内部的 `button` 或 `a` 元素
- * @csspart label - 文本
+ * @csspart button - 内部的 `<button>` 或 `<a>` 元素
+ * @csspart label - 纸片文本
  * @csspart icon - 左侧图标
  * @csspart end-icon - 右侧图标
- * @csspart selected-icon - 选中状态的左侧图标
- * @csspart delete-icon - 可删除时，右侧的删除图标
+ * @csspart selected-icon - 选中状态下的左侧图标
+ * @csspart delete-icon - 可删除时的右侧删除图标
  * @csspart loading - 加载中状态的 `<mdui-circular-progress>` 元素
  *
- * @cssprop --shape-corner - 组件的圆角大小。可以指定一个具体的像素值；但更推荐[引用设计令牌](/docs/2/styles/design-tokens#shape-corner)
+ * @cssprop --shape-corner - 组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)
  */
 let Chip = class Chip extends ButtonBase {
     constructor() {
         super();
         /**
-         * 纸片形状。可选值为：
+         * 纸片的形状。可选值包括：
          *
-         * * `assist`：用于显示和当前上下文相关的辅助操作。例如在点餐页面，提供分享，收藏等功能
-         * * `filter`：用于对内容进行筛选。例如在搜索结果页，对搜索结果进行过滤
-         * * `input`：用于表示用户输入的信息片段。例如 Gmail 中“收件人”字段中的联系人
-         * * `suggestion`：用于提供动态生成的推荐信息，以简化用户操作。例如在聊天应用中猜测用户可能想发送的信息，供用户选择
+         * * `assist`：用于显示与当前上下文相关的辅助操作，如在点餐页面提供分享、收藏等功能
+         * * `filter`：用于对内容进行筛选，如在搜索结果页过滤搜索结果
+         * * `input`：用于表示用户输入的信息片段，如在 Gmail 的“收件人”字段中的联系人
+         * * `suggestion`：用于提供动态生成的推荐信息，以简化用户操作，如在聊天应用中预测用户可能想发送的信息
          */
         this.variant = 'assist';
         /**
-         * 是否包含阴影
+         * 是否显示阴影
          */
         this.elevated = false;
         /**
@@ -63,11 +62,11 @@ let Chip = class Chip extends ButtonBase {
          */
         this.selectable = false;
         /**
-         * 是否为选中状态
+         * 是否已选中
          */
         this.selected = false;
         /**
-         * 是否可删除。为 `true` 时，在右侧会显示删除图标图标
+         * 是否可删除。为 `true` 时，纸片右侧会显示删除图标
          */
         this.deletable = false;
         this.rippleRef = createRef();
@@ -79,7 +78,7 @@ let Chip = class Chip extends ButtonBase {
         return this.rippleRef.value;
     }
     onSelectedChange() {
-        emit(this, 'change');
+        this.emit('change');
     }
     firstUpdated(changedProperties) {
         super.firstUpdated(changedProperties);
@@ -134,7 +133,7 @@ let Chip = class Chip extends ButtonBase {
         }
         // 按下 Delete 或 BackSpace 键时，触发 delete 事件
         if (this.deletable && ['Delete', 'Backspace'].includes(event.key)) {
-            emit(this, 'delete');
+            this.emit('delete');
         }
     }
     /**
@@ -142,7 +141,7 @@ let Chip = class Chip extends ButtonBase {
      */
     onDelete(event) {
         event.stopPropagation();
-        emit(this, 'delete');
+        this.emit('delete');
     }
     renderIcon() {
         if (this.loading) {

package/components/circular-progress/index.d.ts

@@ -1,4 +1,4 @@
-import { LitElement } from 'lit';
+import { MduiElement } from '@mdui/shared/base/mdui-element.js';
 import type { CSSResultGroup, TemplateResult } from 'lit';
 /**
  * @summary 圆形进度指示器组件
@@ -7,20 +7,22 @@ import type { CSSResultGroup, TemplateResult } from 'lit';
  * <mdui-circular-progress></mdui-circular-progress>
  * ```
  */
-export declare class CircularProgress extends LitElement {
+export declare class CircularProgress extends MduiElement<CircularProgressEventMap> {
     static styles: CSSResultGroup;
     /**
-     * 进度指示器的最大值，默认为 1
+     * 进度指示器的最大值。默认为 `1`
      */
     max: number;
     /**
-     * 进度指示器的当前值。若未指定该值，则为不确定状态
+     * 进度指示器的当前值。如果未指定该值，则显示为不确定状态
      */
     value?: number;
     protected render(): TemplateResult;
     private renderDeterminate;
     private renderInDeterminate;
 }
+export interface CircularProgressEventMap {
+}
 declare global {
     interface HTMLElementTagNameMap {
         'mdui-circular-progress': CircularProgress;

package/components/circular-progress/index.js

@@ -1,8 +1,9 @@
 import { __decorate } from "tslib";
-import { html, LitElement } from 'lit';
+import { html } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { isUndefined } from '@mdui/jq/shared/helper.js';
+import { MduiElement } from '@mdui/shared/base/mdui-element.js';
 import { componentStyle } from '@mdui/shared/lit-styles/component-style.js';
 import { style } from './style.js';
 /**
@@ -12,11 +13,11 @@ import { style } from './style.js';
  * <mdui-circular-progress></mdui-circular-progress>
  * ```
  */
-let CircularProgress = class CircularProgress extends LitElement {
+let CircularProgress = class CircularProgress extends MduiElement {
     constructor() {
         super(...arguments);
         /**
-         * 进度指示器的最大值，默认为 1
+         * 进度指示器的最大值。默认为 `1`
          */
         this.max = 1;
     }

package/components/collapse/collapse-item.d.ts

@@ -1,9 +1,9 @@
-import { LitElement } from 'lit';
 import '@mdui/jq/methods/height.js';
+import { MduiElement } from '@mdui/shared/base/mdui-element.js';
 import type { JQ } from '@mdui/jq/shared/core.js';
 import type { CSSResultGroup, TemplateResult, PropertyValues } from 'lit';
 /**
- * @summary 折叠面板项组件。需与 `<mdui-collapse>` 组件配合使用
+ * @summary 折叠面板项组件，需配合 `<mdui-collapse>` 组件使用
  *
  * ```html
  * <mdui-collapse>
@@ -23,18 +23,18 @@ import type { CSSResultGroup, TemplateResult, PropertyValues } from 'lit';
  * @csspart header - 折叠面板的头部内容
  * @csspart body - 折叠面板的正文内容
  */
-export declare class CollapseItem extends LitElement {
+export declare class CollapseItem extends MduiElement<CollapseItemEventMap> {
     static styles: CSSResultGroup;
     /**
-     * 该折叠面板项的值
+     * 此折叠面板项的值
      */
     value?: string;
     /**
-     * 该折叠面板项的头部文本
+     * 此折叠面板项的头部文本
      */
     header?: string;
     /**
-     * 是否禁用该折叠面板项
+     * 是否禁用此折叠面板项
      */
     disabled: boolean;
     /**
@@ -55,3 +55,14 @@ export declare class CollapseItem extends LitElement {
     private onTransitionEnd;
     private updateBodyHeight;
 }
+export interface CollapseItemEventMap {
+    open: CustomEvent<void>;
+    opened: CustomEvent<void>;
+    close: CustomEvent<void>;
+    closed: CustomEvent<void>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mdui-collapse-item': CollapseItem;
+    }
+}

package/components/collapse/collapse-item.js

@@ -1,18 +1,18 @@
 import { __decorate } from "tslib";
-import { html, LitElement } from 'lit';
+import { html } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { createRef, ref } from 'lit/directives/ref.js';
 import { $ } from '@mdui/jq/$.js';
 import '@mdui/jq/methods/height.js';
+import { MduiElement } from '@mdui/shared/base/mdui-element.js';
 import { watch } from '@mdui/shared/decorators/watch.js';
 import { booleanConverter } from '@mdui/shared/helpers/decorator.js';
-import { emit } from '@mdui/shared/helpers/event.js';
 import { uniqueId } from '@mdui/shared/helpers/uniqueId.js';
 import { componentStyle } from '@mdui/shared/lit-styles/component-style.js';
 import { collapseItemStyle } from './collapse-item-style.js';
 /**
- * @summary 折叠面板项组件。需与 `<mdui-collapse>` 组件配合使用
+ * @summary 折叠面板项组件，需配合 `<mdui-collapse>` 组件使用
  *
  * ```html
  * <mdui-collapse>
@@ -32,11 +32,11 @@ import { collapseItemStyle } from './collapse-item-style.js';
  * @csspart header - 折叠面板的头部内容
  * @csspart body - 折叠面板的正文内容
  */
-let CollapseItem = class CollapseItem extends LitElement {
+let CollapseItem = class CollapseItem extends MduiElement {
     constructor() {
         super(...arguments);
         /**
-         * 是否禁用该折叠面板项
+         * 是否禁用此折叠面板项
          */
         this.disabled = false;
         /**
@@ -59,7 +59,7 @@ let CollapseItem = class CollapseItem extends LitElement {
         }
         else {
             this.state = this.active ? 'open' : 'close';
-            emit(this, this.state);
+            this.emit(this.state);
             this.updateBodyHeight();
         }
     }
@@ -76,7 +76,7 @@ let CollapseItem = class CollapseItem extends LitElement {
     onTransitionEnd(event) {
         if (event.target === this.bodyRef.value) {
             this.state = this.active ? 'opened' : 'closed';
-            emit(this, this.state);
+            this.emit(this.state);
             this.updateBodyHeight();
         }
     }

package/components/collapse/collapse.d.ts

@@ -1,8 +1,8 @@
-import { LitElement } from 'lit';
 import '@mdui/jq/methods/is.js';
+import { MduiElement } from '@mdui/shared/base/mdui-element.js';
 import type { CSSResultGroup, TemplateResult } from 'lit';
 /**
- * @summary 折叠面板组件。需与 `<mdui-collapse-item>` 组件配合使用
+ * @summary 折叠面板组件，需配合 `<mdui-collapse-item>` 组件使用
  *
  * ```html
  * <mdui-collapse>
@@ -11,27 +11,24 @@ import type { CSSResultGroup, TemplateResult } from 'lit';
  * </mdui-collapse>
  * ```
  *
- * @event change - 当前打开的折叠面板项改变时触发
+ * @event change - 当前展开的折叠面板项变化时触发
  *
  * @slot - `<mdui-collapse-item>` 组件
  */
-export declare class Collapse extends LitElement {
+export declare class Collapse extends MduiElement<CollapseEventMap> {
     static styles: CSSResultGroup;
     /**
-     * 是否为手风琴模式
+     * 是否启用手风琴模式
      */
     accordion: boolean;
     /**
-     * 当前打开的 `<mdui-collapse-item>` 的值
+     * 当前展开的 `<mdui-collapse-item>` 的值
      *
-     * Note:
-     * 该属性的 HTML 属性始终为字符串，且仅在 `accordion` 为 `true` 时可以设置初始值；
-     * 该属性的 JavaScript 属性值在 `accordion` 为 `true` 时为字符串、在 `accordion` 为 `false` 时为字符串数组。
-     * 所以，在 `accordion` 为 `false` 时，如果要修改该值，只能通过修改 JavaScript 属性值实现。
+     * **Note**：该属性的 HTML 属性始终为字符串，只有在 `accordion` 为 `true` 时，才能设置初始值；该属性的 JavaScript 属性值在 `accordion` 为 `true` 时为字符串，在 `accordion` 为 `false` 时为字符串数组。因此，当 `accordion` 为 `false` 时，只能通过修改 JavaScript 属性值来改变此值。
      */
     value?: string | string[];
     /**
-     * 是否禁用该折叠面板
+     * 是否禁用此折叠面板
      */
     disabled: boolean;
     private activeKeys;
@@ -47,3 +44,11 @@ export declare class Collapse extends LitElement {
     private onSlotChange;
     private updateItems;
 }
+export interface CollapseEventMap {
+    change: CustomEvent<void>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mdui-collapse': Collapse;
+    }
+}

package/components/collapse/collapse.js

@@ -1,18 +1,18 @@
 import { __decorate } from "tslib";
-import { html, LitElement } from 'lit';
+import { html } from 'lit';
 import { customElement, property, queryAssignedElements, state, } from 'lit/decorators.js';
 import { $ } from '@mdui/jq/$.js';
 import '@mdui/jq/methods/is.js';
 import { isElement, isUndefined } from '@mdui/jq/shared/helper.js';
+import { MduiElement } from '@mdui/shared/base/mdui-element.js';
 import { DefinedController } from '@mdui/shared/controllers/defined.js';
 import { watch } from '@mdui/shared/decorators/watch.js';
 import { arraysEqualIgnoreOrder } from '@mdui/shared/helpers/array.js';
 import { booleanConverter } from '@mdui/shared/helpers/decorator.js';
-import { emit } from '@mdui/shared/helpers/event.js';
 import { componentStyle } from '@mdui/shared/lit-styles/component-style.js';
 import { collapseStyle } from './collapse-style.js';
 /**
- * @summary 折叠面板组件。需与 `<mdui-collapse-item>` 组件配合使用
+ * @summary 折叠面板组件，需配合 `<mdui-collapse-item>` 组件使用
  *
  * ```html
  * <mdui-collapse>
@@ -21,19 +21,19 @@ import { collapseStyle } from './collapse-style.js';
  * </mdui-collapse>
  * ```
  *
- * @event change - 当前打开的折叠面板项改变时触发
+ * @event change - 当前展开的折叠面板项变化时触发
  *
  * @slot - `<mdui-collapse-item>` 组件
  */
-let Collapse = class Collapse extends LitElement {
+let Collapse = class Collapse extends MduiElement {
     constructor() {
         super(...arguments);
         /**
-         * 是否为手风琴模式
+         * 是否启用手风琴模式
          */
         this.accordion = false;
         /**
-         * 是否禁用该折叠面板
+         * 是否禁用此折叠面板
          */
         this.disabled = false;
         // 因为 collapse-item 的 value 可能会重复，所以在每个 collapse-item 元素上都添加了一个唯一的 key，通过 activeKey 来记录激活状态的 key
@@ -54,7 +54,7 @@ let Collapse = class Collapse extends LitElement {
                 .map((item) => item.value);
         this.setValue(value);
         if (!this.isInitial) {
-            emit(this, 'change');
+            this.emit('change');
         }
     }
     async onValueChange() {
@@ -109,10 +109,10 @@ let Collapse = class Collapse extends LitElement {
         if (event.button) {
             return;
         }
-        // collapse-item 被禁用，忽略
         const target = event.target;
         const item = target.closest('mdui-collapse-item');
-        if (item.disabled) {
+        // collapse-item 被禁用，忽略
+        if (!item || item.disabled) {
             return;
         }
         const path = event.composedPath();

package/components/dialog/index.d.ts

@@ -1,4 +1,4 @@
-import { LitElement } from 'lit';
+import { MduiElement } from '@mdui/shared/base/mdui-element.js';
 import '../icon.js';
 import type { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
 /**
@@ -8,10 +8,10 @@ import type { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
  * <mdui-dialog>content</mdui-dialog>
  * ```
  *
- * @event open - 在对话框打开之前触发。可以通过调用 `event.preventDefault()` 阻止对话框打开
- * @event opened - 在对话框打开之后触发
- * @event close - 在对话框关闭之前触发。可以通过调用 `event.preventDefault()` 阻止对话框关闭
- * @event closed - 在对话框关闭之后触发
+ * @event open - 对话框开始打开时触发。可以通过调用 `event.preventDefault()` 阻止对话框打开
+ * @event opened - 对话框打开动画完成后触发
+ * @event close - 对话框开始关闭时触发。可以通过调用 `event.preventDefault()` 阻止对话框关闭
+ * @event closed - 对话框关闭动画完成后触发
  * @event overlay-click - 点击遮罩层时触发
  *
  * @slot header - 顶部元素，默认包含 `icon` slot 和 `headline` slot
@@ -23,17 +23,17 @@ import type { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
  *
  * @csspart overlay - 遮罩层
  * @csspart panel - 对话框容器
- * @csspart header - 对话框 header 部分，其中包含了 icon 和 headline
- * @csspart icon - 顶部的图标，位于 header 中
- * @csspart headline - 顶部的标题，位于 header 中
- * @csspart body - 对话框的 body 部分
+ * @csspart header - 对话框 header 部分，包含 icon 和 headline
+ * @csspart icon - 顶部图标，位于 header 中
+ * @csspart headline - 顶部标题，位于 header 中
+ * @csspart body - 对话框 body 部分
  * @csspart description - 副文本部分，位于 body 中
  * @csspart action - 底部操作按钮
  *
- * @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 Dialog extends LitElement {
+export declare class Dialog extends MduiElement<DialogEventMap> {
     static styles: CSSResultGroup;
     /**
      * 顶部的 Material Icons 图标名。也可以通过 `slot="icon"` 设置
@@ -52,15 +52,15 @@ export declare class Dialog extends LitElement {
      */
     open: boolean;
     /**
-     * 是否为全屏对话框
+     * 是否全屏显示对话框
      */
     fullscreen: boolean;
     /**
-     * 是否在按下 ESC 键时，关闭对话框
+     * 是否允许按下 ESC 键关闭对话框
      */
     closeOnEsc: boolean;
     /**
-     * 是否在点击遮罩时，关闭对话框
+     * 是否允许点击遮罩层关闭对话框
      */
     closeOnOverlayClick: boolean;
     /**
@@ -93,6 +93,13 @@ export declare class Dialog extends LitElement {
     private renderHeadline;
     private renderDescription;
 }
+export interface DialogEventMap {
+    open: CustomEvent<void>;
+    opened: CustomEvent<void>;
+    close: CustomEvent<void>;
+    closed: CustomEvent<void>;
+    'overlay-click': CustomEvent<void>;
+}
 declare global {
     interface HTMLElementTagNameMap {
         'mdui-dialog': Dialog;