CrescentLeaf/LingChair
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity
Files
cfe8df43d154bbc3b11dde4be8c81c9c6fe99207
LingChair/client/mdui_patched/custom-elements.json

27260 lines
1020 KiB
JSON
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{
"schemaVersion": "1.0.0",
"readme": "",
"modules": [
{
"kind": "javascript-module",
"path": "@mdui/shared/mixins/anchor.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "AnchorMixinInterface",
"members": [
{
"kind": "field",
"name": "href",
"type": {
"text": "string | undefined"
},
"privacy": "public"
},
{
"kind": "field",
"name": "download",
"type": {
"text": "string | undefined"
},
"privacy": "public"
},
{
"kind": "field",
"name": "target",
"type": {
"text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
},
"privacy": "public"
},
{
"kind": "field",
"name": "rel",
"type": {
"text": "| 'alternate'\n | 'author'\n | 'bookmark'\n | 'external'\n | 'help'\n | 'license'\n | 'me'\n | 'next'\n | 'nofollow'\n | 'noreferrer'\n | 'opener'\n | 'prev'\n | 'search'\n | 'tag' | undefined"
},
"privacy": "public"
},
{
"kind": "method",
"name": "renderAnchor",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "options",
"type": {
"text": "RenderAnchorOptions"
}
}
]
}
]
},
{
"kind": "mixin",
"description": "",
"name": "AnchorMixin",
"members": [
{
"kind": "field",
"name": "href",
"type": {
"text": "string"
},
"privacy": "public",
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"attribute": "href",
"reflects": true
},
{
"kind": "field",
"name": "download",
"type": {
"text": "string"
},
"privacy": "public",
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "download",
"reflects": true
},
{
"kind": "field",
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"privacy": "public",
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "target",
"reflects": true
},
{
"kind": "field",
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"privacy": "public",
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"attribute": "rel",
"reflects": true
},
{
"kind": "method",
"name": "renderAnchor",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n refDirective,\n tabIndex,\n }",
"type": {
"text": "RenderAnchorOptions"
}
}
]
}
],
"attributes": [
{
"name": "href",
"type": {
"text": "string"
},
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"fieldName": "href"
},
{
"name": "download",
"type": {
"text": "string"
},
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "download"
},
{
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "target"
},
{
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"fieldName": "rel"
}
],
"parameters": [
{
"name": "superclass",
"type": {
"text": "T"
}
}
]
}
],
"exports": [
{
"kind": "js",
"name": "AnchorMixinInterface",
"declaration": {
"name": "AnchorMixinInterface",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "js",
"name": "AnchorMixin",
"declaration": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "@mdui/shared/mixins/focusable.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "FocusableMixinInterface",
"members": [
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public"
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public"
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"readonly": true
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
]
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
}
}
]
},
{
"kind": "mixin",
"description": "参考：https://github.com/adobe/spectrum-web-components/blob/main/tools/shared/src/focusable.ts",
"name": "FocusableMixin",
"members": [
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })"
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false"
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0"
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private"
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex"
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素"
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。"
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点"
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
]
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
}
}
],
"events": [
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
}
}
],
"attributes": [
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus"
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused"
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible"
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex"
}
],
"parameters": [
{
"name": "superclass",
"type": {
"text": "T"
}
}
]
}
],
"exports": [
{
"kind": "js",
"name": "FocusableMixinInterface",
"declaration": {
"name": "FocusableMixinInterface",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "js",
"name": "FocusableMixin",
"declaration": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "@mdui/shared/mixins/scrollBehavior.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "ScrollBehaviorMixinInterface",
"members": [
{
"kind": "field",
"name": "scrollTarget",
"type": {
"text": "string | HTMLElement | JQ<HTMLElement> | undefined"
},
"privacy": "public"
},
{
"kind": "field",
"name": "scrollBehavior",
"type": {
"text": "ScrollBehavior | undefined"
},
"privacy": "public"
},
{
"kind": "field",
"name": "scrollThreshold",
"type": {
"text": "number | undefined"
},
"privacy": "public"
},
{
"kind": "field",
"name": "scrollBehaviorDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected"
},
{
"kind": "method",
"name": "setContainerPadding",
"privacy": "protected",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "action",
"type": {
"text": "'add' | 'update' | 'remove'"
}
},
{
"name": "scrollTarget",
"optional": true,
"type": {
"text": "string | HTMLElement | JQ<HTMLElement>"
}
}
]
},
{
"kind": "method",
"name": "hasScrollBehavior",
"privacy": "protected",
"return": {
"type": {
"text": "boolean"
}
},
"parameters": [
{
"name": "behavior",
"type": {
"text": "ScrollBehavior | ScrollBehavior[]"
}
}
]
}
]
},
{
"kind": "mixin",
"description": "滚动行为\n\n父类需要实现",
"name": "ScrollBehaviorMixin",
"members": [
{
"kind": "field",
"name": "scrollTarget",
"type": {
"text": "string | HTMLElement | JQ<HTMLElement> | undefined"
},
"privacy": "public",
"description": "需要监听其滚动事件的元素。值可以是 CSS 选择器、DOM 元素、或 [JQ 对象](/docs/2/functions/jq)。默认监听 `window` 的滚动事件",
"attribute": "scroll-target"
},
{
"kind": "field",
"name": "scrollBehavior",
"type": {
"text": "'hide' | 'shrink' | 'elevate' | undefined"
},
"privacy": "public",
"description": "滚动行为。可选值为：\n* `hide`：滚动时隐藏\n* `shrink`：滚动时缩小\n* `elevate`：滚动时增加阴影\n\ntodo: 生成 custom-elements.json 时，属性名的注释用了父类的，属性枚举值的类型和注释用了该类的。期望都使用父类的。",
"attribute": "scroll-behavior",
"reflects": true
},
{
"kind": "field",
"name": "scrollThreshold",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "在滚动多少距离之后触发滚动行为，单位为 `px`",
"attribute": "scroll-threshold",
"reflects": true
},
{
"kind": "field",
"name": "scrollBehaviorDefinedController",
"privacy": "protected",
"default": "new DefinedController(this, { needDomReady: true, })"
},
{
"kind": "field",
"name": "lastScrollTopThreshold",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"description": "上次滚动后，垂直方向的距离（滚动距离超过 scrollThreshold 才记录）"
},
{
"kind": "field",
"name": "lastScrollTopNoThreshold",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"description": "上次滚动后，垂直方向的距离（无视 scrollThreshold，始终记录）"
},
{
"kind": "field",
"name": "isParentLayout",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "父元素是否是 `mdui-layout`"
},
{
"kind": "field",
"name": "scrollPaddingPosition",
"type": {
"text": "ScrollPaddingPosition"
},
"privacy": "protected",
"description": "滚动时，如果需要给 container 添加 padding，添加在顶部还是底部",
"readonly": true
},
{
"kind": "method",
"name": "onScrollTargetChange",
"privacy": "private",
"parameters": [
{
"name": "oldValue",
"type": {
"text": "string"
}
},
{
"name": "newValue",
"type": {
"text": "string"
}
}
]
},
{
"kind": "method",
"name": "onScrollBehaviorChange",
"privacy": "private"
},
{
"kind": "method",
"name": "hasScrollBehavior",
"privacy": "protected",
"return": {
"type": {
"text": "boolean"
}
},
"parameters": [
{
"name": "behavior",
"type": {
"text": "ScrollBehavior | ScrollBehavior[]"
},
"description": "为数组时，只要其中一个行为在 scrollBehavior 中，即返回 `true`"
}
],
"description": "scrollBehavior 包含多个滚动行为，用空格分割\n用该方法判断指定滚动行为是否在 scrollBehavior 中"
},
{
"kind": "method",
"name": "runScrollThreshold",
"privacy": "protected",
"parameters": [
{
"name": "_isScrollingUp",
"type": {
"text": "boolean"
},
"description": "是否向上滚动"
},
{
"name": "_scrollTop",
"type": {
"text": "number"
},
"description": "距离 scrollTarget 顶部的距离"
}
],
"description": "执行滚动事件，在滚动距离超过 scrollThreshold 时才会执行\nNote: 父类可以按需实现该方法"
},
{
"kind": "method",
"name": "runScrollNoThreshold",
"privacy": "protected",
"parameters": [
{
"name": "_isScrollingUp",
"type": {
"text": "boolean"
},
"description": "是否向上滚动"
},
{
"name": "_scrollTop",
"type": {
"text": "number"
},
"description": "距离 scrollTarget 顶部的距离"
}
],
"description": "执行滚动事件，会无视 scrollThreshold，始终会执行"
},
{
"kind": "method",
"name": "setContainerPadding",
"privacy": "protected",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "action",
"type": {
"text": "'add' | 'update' | 'remove'"
},
"description": "新增、更新、移除 padding"
},
{
"name": "scrollTarget",
"optional": true,
"type": {
"text": "string | HTMLElement | JQ<HTMLElement>"
},
"description": "在该元素上添加、更新或移除 padding"
}
],
"description": "更新滚动容器的 padding，避免内容被 navigation-bar 覆盖"
},
{
"kind": "method",
"name": "onListeningScroll",
"privacy": "private"
},
{
"kind": "method",
"name": "onScroll",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "listening",
"type": {
"text": "HTMLElement | Window"
}
}
],
"description": "滚动事件，这里过滤掉不符合条件的滚动"
},
{
"kind": "method",
"name": "updateScrollTop",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "listening",
"type": {
"text": "HTMLElement | Window"
}
}
],
"description": "重新更新 lastScrollTopThreshold、lastScrollTopNoThreshold 的值\n用于在 scrollTarget、scrollBehavior 变更时，重新设置 lastScrollTopThreshold、lastScrollTopNoThreshold 的初始值"
},
{
"kind": "method",
"name": "getListening",
"privacy": "private",
"return": {
"type": {
"text": "HTMLElement | Window | undefined"
}
},
"parameters": [
{
"name": "target",
"optional": true,
"type": {
"text": "string | HTMLElement | JQ<HTMLElement>"
}
}
],
"description": "获取组件需要监听哪个元素的滚动状态"
},
{
"kind": "method",
"name": "getContainer",
"privacy": "private",
"return": {
"type": {
"text": "HTMLElement | undefined"
}
},
"parameters": [
{
"name": "target",
"optional": true,
"type": {
"text": "string | HTMLElement | JQ<HTMLElement>"
}
}
],
"description": "获取组件在哪个容器内滚动"
}
],
"attributes": [
{
"name": "scroll-target",
"type": {
"text": "string | HTMLElement | JQ<HTMLElement> | undefined"
},
"description": "需要监听其滚动事件的元素。值可以是 CSS 选择器、DOM 元素、或 [JQ 对象](/docs/2/functions/jq)。默认监听 `window` 的滚动事件",
"fieldName": "scrollTarget"
},
{
"name": "scroll-behavior",
"type": {
"text": "'hide' | 'shrink' | 'elevate' | undefined"
},
"description": "滚动行为。可选值为：\n* `hide`：滚动时隐藏\n* `shrink`：滚动时缩小\n* `elevate`：滚动时增加阴影\n\ntodo: 生成 custom-elements.json 时，属性名的注释用了父类的，属性枚举值的类型和注释用了该类的。期望都使用父类的。",
"fieldName": "scrollBehavior"
},
{
"name": "scroll-threshold",
"type": {
"text": "number | undefined"
},
"description": "在滚动多少距离之后触发滚动行为，单位为 `px`",
"fieldName": "scrollThreshold"
}
],
"parameters": [
{
"name": "superclass",
"type": {
"text": "T"
}
}
]
}
],
"exports": [
{
"kind": "js",
"name": "ScrollBehaviorMixinInterface",
"declaration": {
"name": "ScrollBehaviorMixinInterface",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "js",
"name": "ScrollBehaviorMixin",
"declaration": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/avatar/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Avatar",
"cssProperties": [
{
"description": "组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
}
],
"cssParts": [
{
"description": "使用图片作为头像时，组件内部的 `<img>` 元素",
"name": "image"
},
{
"description": "使用图标作为头像时，组件内部的 `<mdui-icon>` 元素",
"name": "icon"
}
],
"slots": [
{
"description": "自定义头像内容，可以为字母、汉字、`<img>` 元素、图标等",
"name": ""
}
],
"members": [
{
"kind": "field",
"name": "src",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "头像图片的 URL 地址",
"attribute": "src",
"reflects": true
},
{
"kind": "field",
"name": "fit",
"type": {
"text": "| /*保持图片原有尺寸比例，内容会被等比例缩放*/ 'contain'\n | /*保持图片原有尺寸比例，但部分内容可能被剪切*/ 'cover'\n | /*默认值，不保持图片原有尺寸比例，内容会被拉伸以填充整个容器*/ 'fill'\n | /*保留图片原有尺寸，内容不会被缩放或拉伸*/ 'none'\n | /*保持图片原有尺寸比例，内容尺寸与 `none` 或 `contain` 中较小的一个相同*/ 'scale-down' | undefined"
},
"privacy": "public",
"description": "图片如何适应容器框，与原生的 [`object-fit`](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit) 属性相同。可选值包括：\n\n* `contain`：保持图片原有尺寸比例，内容会被等比例缩放\n* `cover`：保持图片原有尺寸比例，但部分内容可能被剪切\n* `fill`：默认值，不保持图片原有尺寸比例，内容会被拉伸以填充整个容器\n* `none`：保留图片原有尺寸，内容不会被缩放或拉伸\n* `scale-down`：保持图片原有尺寸比例，内容尺寸与 `none` 或 `contain` 中较小的一个相同",
"attribute": "fit",
"reflects": true
},
{
"kind": "field",
"name": "icon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "头像的 Material Icons 图标名",
"attribute": "icon",
"reflects": true
},
{
"kind": "field",
"name": "label",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "头像的替代文本描述",
"attribute": "label",
"reflects": true
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController(this, '[default]')"
}
],
"attributes": [
{
"name": "src",
"type": {
"text": "string | undefined"
},
"description": "头像图片的 URL 地址",
"fieldName": "src"
},
{
"name": "fit",
"type": {
"text": "| /*保持图片原有尺寸比例，内容会被等比例缩放*/ 'contain'\n | /*保持图片原有尺寸比例，但部分内容可能被剪切*/ 'cover'\n | /*默认值，不保持图片原有尺寸比例，内容会被拉伸以填充整个容器*/ 'fill'\n | /*保留图片原有尺寸，内容不会被缩放或拉伸*/ 'none'\n | /*保持图片原有尺寸比例，内容尺寸与 `none` 或 `contain` 中较小的一个相同*/ 'scale-down' | undefined"
},
"description": "图片如何适应容器框，与原生的 [`object-fit`](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit) 属性相同。可选值包括：\n\n* `contain`：保持图片原有尺寸比例，内容会被等比例缩放\n* `cover`：保持图片原有尺寸比例，但部分内容可能被剪切\n* `fill`：默认值，不保持图片原有尺寸比例，内容会被拉伸以填充整个容器\n* `none`：保留图片原有尺寸，内容不会被缩放或拉伸\n* `scale-down`：保持图片原有尺寸比例，内容尺寸与 `none` 或 `contain` 中较小的一个相同",
"fieldName": "fit"
},
{
"name": "icon",
"type": {
"text": "string | undefined"
},
"description": "头像的 Material Icons 图标名",
"fieldName": "icon"
},
{
"name": "label",
"type": {
"text": "string | undefined"
},
"description": "头像的替代文本描述",
"fieldName": "label"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "头像组件\n\n```html\n<mdui-avatar src=\"https://avatars.githubusercontent.com/u/3030330?s=40&v=4\"></mdui-avatar>\n```",
"tagName": "mdui-avatar",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Avatar",
"declaration": {
"name": "Avatar",
"module": "components/avatar/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-avatar",
"declaration": {
"name": "Avatar",
"module": "components/avatar/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/badge/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Badge",
"cssProperties": [
{
"description": "组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
}
],
"slots": [
{
"description": "徽标中显示的文本",
"name": ""
}
],
"members": [
{
"kind": "field",
"name": "variant",
"type": {
"text": "| /*小型徽标，不显示文本*/ 'small'\n | /*大型徽标，会显示文本*/ 'large'"
},
"privacy": "public",
"default": "'large'",
"description": "徽标的形状。可选值包括：\n\n* `small`：小型徽标，不显示文本\n* `large`：大型徽标，会显示文本",
"attribute": "variant",
"reflects": true
}
],
"attributes": [
{
"name": "variant",
"type": {
"text": "| /*小型徽标，不显示文本*/ 'small'\n | /*大型徽标，会显示文本*/ 'large'"
},
"default": "'large'",
"description": "徽标的形状。可选值包括：\n\n* `small`：小型徽标，不显示文本\n* `large`：大型徽标，会显示文本",
"fieldName": "variant"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "徽标组件\n\n```html\n<mdui-badge>12</mdui-badge>\n```",
"tagName": "mdui-badge",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Badge",
"declaration": {
"name": "Badge",
"module": "components/badge/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-badge",
"declaration": {
"name": "Badge",
"module": "components/badge/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/bottom-app-bar/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "BottomAppBar",
"cssProperties": [
{
"description": "组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
},
{
"description": "组件的 CSS `z-index` 值",
"name": "--z-index"
}
],
"slots": [
{
"description": "底部应用栏内部的元素",
"name": ""
}
],
"members": [
{
"kind": "field",
"name": "hide",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否隐藏",
"attribute": "hide",
"reflects": true
},
{
"kind": "field",
"name": "fabDetach",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否让底部应用栏中的 [`<mdui-fab>`](/docs/2/components/fab) 组件脱离应用栏。如果为 `true`，则当应用栏隐藏后，[`<mdui-fab>`](/docs/2/components/fab) 仍会停留在页面上",
"attribute": "fab-detach",
"reflects": true
},
{
"kind": "field",
"name": "scrollBehavior",
"type": {
"text": "'hide' | 'shrink' | 'elevate' | undefined"
},
"privacy": "public",
"description": "滚动行为。可选值为：\n\n* `hide`：滚动时隐藏",
"attribute": "scroll-behavior",
"reflects": true,
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "scrollPaddingPosition",
"type": {
"text": "ScrollPaddingPosition"
},
"privacy": "protected",
"description": "滚动时，如果需要给 container 添加 padding，添加在顶部还是底部",
"readonly": true,
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "layoutPlacement",
"type": {
"text": "LayoutPlacement"
},
"privacy": "protected",
"description": "当前布局组件所处的位置，父类必须实现该 getter",
"readonly": true,
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "method",
"name": "runScrollThreshold",
"privacy": "protected",
"parameters": [
{
"name": "isScrollingUp",
"type": {
"text": "boolean"
}
}
],
"description": "滚动行为\n当前仅支持 hide 这一个行为，所以不做行为类型判断",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "scrollTarget",
"type": {
"text": "string | HTMLElement | JQ<HTMLElement> | undefined"
},
"privacy": "public",
"description": "需要监听其滚动事件的元素。值可以是 CSS 选择器、DOM 元素、或 [JQ 对象](/docs/2/functions/jq)。默认监听 `window` 的滚动事件",
"attribute": "scroll-target",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "scrollThreshold",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "在滚动多少距离之后触发滚动行为，单位为 `px`",
"attribute": "scroll-threshold",
"reflects": true,
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "scrollBehaviorDefinedController",
"privacy": "protected",
"default": "new DefinedController(this, { needDomReady: true, })",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "lastScrollTopThreshold",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"description": "上次滚动后，垂直方向的距离（滚动距离超过 scrollThreshold 才记录）",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "lastScrollTopNoThreshold",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"description": "上次滚动后，垂直方向的距离（无视 scrollThreshold，始终记录）",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "isParentLayout",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"description": "父元素是否是 `mdui-layout`",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "method",
"name": "onScrollTargetChange",
"privacy": "private",
"parameters": [
{
"name": "oldValue",
"type": {
"text": "string"
}
},
{
"name": "newValue",
"type": {
"text": "string"
}
}
],
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "onScrollBehaviorChange",
"privacy": "private",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "hasScrollBehavior",
"privacy": "protected",
"return": {
"type": {
"text": "boolean"
}
},
"parameters": [
{
"name": "behavior",
"type": {
"text": "ScrollBehavior | ScrollBehavior[]"
},
"description": "为数组时，只要其中一个行为在 scrollBehavior 中，即返回 `true`"
}
],
"description": "scrollBehavior 包含多个滚动行为，用空格分割\n用该方法判断指定滚动行为是否在 scrollBehavior 中",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "runScrollNoThreshold",
"privacy": "protected",
"parameters": [
{
"name": "_isScrollingUp",
"type": {
"text": "boolean"
},
"description": "是否向上滚动"
},
{
"name": "_scrollTop",
"type": {
"text": "number"
},
"description": "距离 scrollTarget 顶部的距离"
}
],
"description": "执行滚动事件，会无视 scrollThreshold，始终会执行",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "setContainerPadding",
"privacy": "protected",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "action",
"type": {
"text": "'add' | 'update' | 'remove'"
},
"description": "新增、更新、移除 padding"
},
{
"name": "scrollTarget",
"optional": true,
"type": {
"text": "string | HTMLElement | JQ<HTMLElement>"
},
"description": "在该元素上添加、更新或移除 padding"
}
],
"description": "更新滚动容器的 padding，避免内容被 navigation-bar 覆盖",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "onListeningScroll",
"privacy": "private",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "onScroll",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "listening",
"type": {
"text": "HTMLElement | Window"
}
}
],
"description": "滚动事件，这里过滤掉不符合条件的滚动",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "updateScrollTop",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "listening",
"type": {
"text": "HTMLElement | Window"
}
}
],
"description": "重新更新 lastScrollTopThreshold、lastScrollTopNoThreshold 的值\n用于在 scrollTarget、scrollBehavior 变更时，重新设置 lastScrollTopThreshold、lastScrollTopNoThreshold 的初始值",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "getListening",
"privacy": "private",
"return": {
"type": {
"text": "HTMLElement | Window | undefined"
}
},
"parameters": [
{
"name": "target",
"optional": true,
"type": {
"text": "string | HTMLElement | JQ<HTMLElement>"
}
}
],
"description": "获取组件需要监听哪个元素的滚动状态",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "getContainer",
"privacy": "private",
"return": {
"type": {
"text": "HTMLElement | undefined"
}
},
"parameters": [
{
"name": "target",
"optional": true,
"type": {
"text": "string | HTMLElement | JQ<HTMLElement>"
}
}
],
"description": "获取组件在哪个容器内滚动",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "order",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "该组件在 [`<mdui-layout>`](/docs/2/components/layout) 中的布局顺序，按从小到大排序。默认为 `0`",
"attribute": "order",
"reflects": true,
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "field",
"name": "layoutManager",
"type": {
"text": "LayoutManager | undefined"
},
"privacy": "protected",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "method",
"name": "onOrderChange",
"privacy": "private",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
}
],
"events": [
{
"description": "开始显示时，事件被触发。可以通过调用 `event.preventDefault()` 阻止显示",
"name": "show"
},
{
"description": "显示动画完成时，事件被触发",
"name": "shown"
},
{
"description": "开始隐藏时，事件被触发。可以通过调用 `event.preventDefault()` 阻止隐藏",
"name": "hide"
},
{
"description": "隐藏动画完成时，事件被触发",
"name": "hidden"
}
],
"attributes": [
{
"name": "hide",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否隐藏",
"fieldName": "hide"
},
{
"name": "fab-detach",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否让底部应用栏中的 [`<mdui-fab>`](/docs/2/components/fab) 组件脱离应用栏。如果为 `true`，则当应用栏隐藏后，[`<mdui-fab>`](/docs/2/components/fab) 仍会停留在页面上",
"fieldName": "fabDetach"
},
{
"name": "scroll-behavior",
"type": {
"text": "'hide' | 'shrink' | 'elevate' | undefined"
},
"description": "滚动行为。可选值为：\n\n* `hide`：滚动时隐藏",
"fieldName": "scrollBehavior",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"name": "scroll-target",
"type": {
"text": "string | HTMLElement | JQ<HTMLElement> | undefined"
},
"description": "需要监听其滚动事件的元素。值可以是 CSS 选择器、DOM 元素、或 [JQ 对象](/docs/2/functions/jq)。默认监听 `window` 的滚动事件",
"fieldName": "scrollTarget",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"name": "scroll-threshold",
"type": {
"text": "number | undefined"
},
"description": "在滚动多少距离之后触发滚动行为，单位为 `px`",
"fieldName": "scrollThreshold",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"name": "order",
"type": {
"text": "number | undefined"
},
"description": "该组件在 [`<mdui-layout>`](/docs/2/components/layout) 中的布局顺序，按从小到大排序。默认为 `0`",
"fieldName": "order",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
}
],
"mixins": [
{
"name": "ScrollBehaviorMixin",
"package": "@mdui/shared/mixins/scrollBehavior.js"
}
],
"superclass": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
},
"summary": "底部应用栏组件\n\n```html\n<mdui-bottom-app-bar>\n..<mdui-button-icon icon=\"check_box--outlined\"></mdui-button-icon>\n..<mdui-button-icon icon=\"edit--outlined\"></mdui-button-icon>\n..<mdui-button-icon icon=\"mic_none--outlined\"></mdui-button-icon>\n..<mdui-button-icon icon=\"image--outlined\"></mdui-button-icon>\n..<div style=\"flex-grow: 1\"></div>\n..<mdui-fab icon=\"add\"></mdui-fab>\n</mdui-bottom-app-bar>\n```",
"tagName": "mdui-bottom-app-bar",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "BottomAppBar",
"declaration": {
"name": "BottomAppBar",
"module": "components/bottom-app-bar/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-bottom-app-bar",
"declaration": {
"name": "BottomAppBar",
"module": "components/bottom-app-bar/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/button-icon/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "ButtonIcon",
"cssProperties": [
{
"description": "组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
}
],
"cssParts": [
{
"description": "内部的 `<button>` 或 `<a>` 元素",
"name": "button"
},
{
"description": "未选中状态的图标",
"name": "icon"
},
{
"description": "选中状态的图标",
"name": "selected-icon"
},
{
"description": "加载中状态的 `<mdui-circular-progress>` 元素",
"name": "loading"
}
],
"slots": [
{
"description": "图标组件",
"name": ""
},
{
"description": "选中状态显示的图标元素",
"name": "selected-icon"
}
],
"members": [
{
"kind": "field",
"name": "variant",
"type": {
"text": "| /*适用于最低优先级的操作*/ 'standard'\n | /*视觉效果强烈，适用于高优先级的操作*/ 'filled'\n | /*视觉效果介于 `filled` 和 `outlined` 之间，适用于中高优先级的操作*/ 'tonal'\n | /*适用于中等优先级的操作*/ 'outlined'"
},
"privacy": "public",
"default": "'standard'",
"description": "图标按钮的形状。可选值包括：\n\n* `standard`：适用于最低优先级的操作\n* `filled`：视觉效果强烈，适用于高优先级的操作\n* `tonal`：视觉效果介于 `filled` 和 `outlined` 之间，适用于中高优先级的操作\n* `outlined`：适用于中等优先级的操作",
"attribute": "variant",
"reflects": true
},
{
"kind": "field",
"name": "icon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "Material Icons 图标名。也可以通过 default slot 设置",
"attribute": "icon",
"reflects": true
},
{
"kind": "field",
"name": "selectedIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "选中状态的 Material Icons 图标名。也可以通过 `slot=\"selected-icon\"` 设置",
"attribute": "selected-icon",
"reflects": true
},
{
"kind": "field",
"name": "selectable",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否可选中",
"attribute": "selectable",
"reflects": true
},
{
"kind": "field",
"name": "selected",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否已被选中",
"attribute": "selected",
"reflects": true
},
{
"kind": "field",
"name": "rippleRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController( this, '[default]', 'selected-icon', )"
},
{
"kind": "field",
"name": "rippleElement",
"privacy": "protected",
"readonly": true
},
{
"kind": "method",
"name": "onSelectedChange",
"privacy": "private"
},
{
"kind": "method",
"name": "renderIcon",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "field",
"name": "href",
"type": {
"text": "string"
},
"privacy": "public",
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"attribute": "href",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "download",
"type": {
"text": "string"
},
"privacy": "public",
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "download",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"privacy": "public",
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "target",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"privacy": "public",
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"attribute": "rel",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "method",
"name": "renderAnchor",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n refDirective,\n tabIndex,\n }",
"type": {
"text": "RenderAnchorOptions"
}
}
],
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true,
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null"
},
"privacy": "protected",
"readonly": true,
"description": "最终获得焦点的元素",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否禁用",
"attribute": "disabled",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "loading",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否处于加载中状态",
"attribute": "loading",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "name",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "按钮的名称，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"attribute": "name",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "按钮的初始值，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"attribute": "value",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "type",
"type": {
"text": "| /*此按钮将表单数据提交给服务器*/ 'submit'\n | /*此按钮重置所有组件为初始值*/ 'reset'\n | /*此按钮没有默认行为*/ 'button'"
},
"privacy": "public",
"default": "'button'",
"description": "按钮的类型。默认类型为 `button`。可选类型包括：\n\n* `submit`：点击按钮会提交表单数据到服务器\n* `reset`：点击按钮会将表单中的所有字段重置为初始值\n* `button`：此类型的按钮没有默认行为\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"attribute": "type",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "form",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"attribute": "form",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formAction",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "指定提交表单的 URL。\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `action` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formaction",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formEnctype",
"type": {
"text": "| /*未指定该属性时的默认值*/ 'application/x-www-form-urlencoded'\n | /*当表单包含 `<input type=\"file\">` 元素时使用*/ 'multipart/form-data'\n | /*HTML5 新增，用于调试*/ 'text/plain' | undefined"
},
"privacy": "public",
"description": "指定提交表单到服务器的内容类型。可选值包括：\n\n* `application/x-www-form-urlencoded`：未指定该属性时的默认值\n* `multipart/form-data`：当表单包含 `<input type=\"file\">` 元素时使用\n* `text/plain`：HTML5 新增，用于调试\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `enctype` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formenctype",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formMethod",
"type": {
"text": "| /*表单数据包含在表单内容中，发送到服务器*/ 'post'\n | /*表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法*/ 'get' | undefined"
},
"privacy": "public",
"description": "指定提交表单时使用的 HTTP 方法。可选值包括：\n\n* `post`：表单数据包含在表单内容中，发送到服务器\n* `get`：表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `method` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formmethod",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formNoValidate",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "如果设置了此属性，表单提交时将不执行表单验证。\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `novalidate` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formnovalidate",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formTarget",
"type": {
"text": "| /*默认选项，在当前框架中打开*/ '_self'\n | /*在新窗口中打开*/ '_blank'\n | /*在父框架中打开*/ '_parent'\n | /*在整个窗口中打开*/ '_top' | undefined"
},
"privacy": "public",
"description": "提交表单后接收到的响应应显示在何处。可选值包括：\n\n* `_self`：默认选项，在当前框架中打开\n* `_blank`：在新窗口中打开\n* `_parent`：在父框架中打开\n* `_top`：在整个窗口中打开\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `target` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formtarget",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formController",
"privacy": "private",
"readonly": true,
"default": "new FormController(this)",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "validity",
"type": {
"text": "ValidityState | undefined"
},
"privacy": "public",
"description": "表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "validationMessage",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "checkValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "reportValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。\n\n如果验证未通过，还会在组件上显示验证失败的提示。",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "setCustomValidity",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "message",
"type": {
"text": "string"
},
"description": "自定义的错误提示文本"
}
],
"description": "设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "renderLoading",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "renderButton",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n }",
"type": {
"text": "RenderButtonOptions"
}
}
],
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "isButton",
"privacy": "protected",
"return": {
"type": {
"text": "boolean"
}
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"description": "选中状态变更时触发",
"name": "change"
},
{
"description": "表单字段验证未通过时触发",
"name": "invalid"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"attributes": [
{
"name": "variant",
"type": {
"text": "| /*适用于最低优先级的操作*/ 'standard'\n | /*视觉效果强烈，适用于高优先级的操作*/ 'filled'\n | /*视觉效果介于 `filled` 和 `outlined` 之间，适用于中高优先级的操作*/ 'tonal'\n | /*适用于中等优先级的操作*/ 'outlined'"
},
"default": "'standard'",
"description": "图标按钮的形状。可选值包括：\n\n* `standard`：适用于最低优先级的操作\n* `filled`：视觉效果强烈，适用于高优先级的操作\n* `tonal`：视觉效果介于 `filled` 和 `outlined` 之间，适用于中高优先级的操作\n* `outlined`：适用于中等优先级的操作",
"fieldName": "variant"
},
{
"name": "icon",
"type": {
"text": "string | undefined"
},
"description": "Material Icons 图标名。也可以通过 default slot 设置",
"fieldName": "icon"
},
{
"name": "selected-icon",
"type": {
"text": "string | undefined"
},
"description": "选中状态的 Material Icons 图标名。也可以通过 `slot=\"selected-icon\"` 设置",
"fieldName": "selectedIcon"
},
{
"name": "selectable",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否可选中",
"fieldName": "selectable"
},
{
"name": "selected",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否已被选中",
"fieldName": "selected"
},
{
"name": "href",
"type": {
"text": "string"
},
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"fieldName": "href",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "download",
"type": {
"text": "string"
},
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "download",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "target",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"fieldName": "rel",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否禁用",
"fieldName": "disabled",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "loading",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否处于加载中状态",
"fieldName": "loading",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "name",
"type": {
"text": "string"
},
"default": "''",
"description": "按钮的名称，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"fieldName": "name",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "value",
"type": {
"text": "string"
},
"default": "''",
"description": "按钮的初始值，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"fieldName": "value",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "type",
"type": {
"text": "| /*此按钮将表单数据提交给服务器*/ 'submit'\n | /*此按钮重置所有组件为初始值*/ 'reset'\n | /*此按钮没有默认行为*/ 'button'"
},
"default": "'button'",
"description": "按钮的类型。默认类型为 `button`。可选类型包括：\n\n* `submit`：点击按钮会提交表单数据到服务器\n* `reset`：点击按钮会将表单中的所有字段重置为初始值\n* `button`：此类型的按钮没有默认行为\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"fieldName": "type",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "form",
"type": {
"text": "string | undefined"
},
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"fieldName": "form",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formaction",
"type": {
"text": "string | undefined"
},
"description": "指定提交表单的 URL。\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `action` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formAction",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formenctype",
"type": {
"text": "| /*未指定该属性时的默认值*/ 'application/x-www-form-urlencoded'\n | /*当表单包含 `<input type=\"file\">` 元素时使用*/ 'multipart/form-data'\n | /*HTML5 新增，用于调试*/ 'text/plain' | undefined"
},
"description": "指定提交表单到服务器的内容类型。可选值包括：\n\n* `application/x-www-form-urlencoded`：未指定该属性时的默认值\n* `multipart/form-data`：当表单包含 `<input type=\"file\">` 元素时使用\n* `text/plain`：HTML5 新增，用于调试\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `enctype` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formEnctype",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formmethod",
"type": {
"text": "| /*表单数据包含在表单内容中，发送到服务器*/ 'post'\n | /*表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法*/ 'get' | undefined"
},
"description": "指定提交表单时使用的 HTTP 方法。可选值包括：\n\n* `post`：表单数据包含在表单内容中，发送到服务器\n* `get`：表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `method` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formMethod",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formnovalidate",
"type": {
"text": "boolean"
},
"default": "false",
"description": "如果设置了此属性，表单提交时将不执行表单验证。\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `novalidate` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formNoValidate",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formtarget",
"type": {
"text": "| /*默认选项，在当前框架中打开*/ '_self'\n | /*在新窗口中打开*/ '_blank'\n | /*在父框架中打开*/ '_parent'\n | /*在整个窗口中打开*/ '_top' | undefined"
},
"description": "提交表单后接收到的响应应显示在何处。可选值包括：\n\n* `_self`：默认选项，在当前框架中打开\n* `_blank`：在新窗口中打开\n* `_parent`：在父框架中打开\n* `_top`：在整个窗口中打开\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `target` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formTarget",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
}
],
"superclass": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
},
"summary": "图标按钮组件\n\n```html\n<mdui-button-icon icon=\"search\"></mdui-button-icon>\n```",
"tagName": "mdui-button-icon",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "ButtonIcon",
"declaration": {
"name": "ButtonIcon",
"module": "components/button-icon/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-button-icon",
"declaration": {
"name": "ButtonIcon",
"module": "components/button-icon/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/button/button-base.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "ButtonBase",
"members": [
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否禁用",
"attribute": "disabled",
"reflects": true
},
{
"kind": "field",
"name": "loading",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否处于加载中状态",
"attribute": "loading",
"reflects": true
},
{
"kind": "field",
"name": "name",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "按钮的名称，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"attribute": "name",
"reflects": true
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "按钮的初始值，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"attribute": "value",
"reflects": true
},
{
"kind": "field",
"name": "type",
"type": {
"text": "| /*此按钮将表单数据提交给服务器*/ 'submit'\n | /*此按钮重置所有组件为初始值*/ 'reset'\n | /*此按钮没有默认行为*/ 'button'"
},
"privacy": "public",
"default": "'button'",
"description": "按钮的类型。默认类型为 `button`。可选类型包括：\n\n* `submit`：点击按钮会提交表单数据到服务器\n* `reset`：点击按钮会将表单中的所有字段重置为初始值\n* `button`：此类型的按钮没有默认行为\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"attribute": "type",
"reflects": true
},
{
"kind": "field",
"name": "form",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"attribute": "form",
"reflects": true
},
{
"kind": "field",
"name": "formAction",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "指定提交表单的 URL。\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `action` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formaction",
"reflects": true
},
{
"kind": "field",
"name": "formEnctype",
"type": {
"text": "| /*未指定该属性时的默认值*/ 'application/x-www-form-urlencoded'\n | /*当表单包含 `<input type=\"file\">` 元素时使用*/ 'multipart/form-data'\n | /*HTML5 新增，用于调试*/ 'text/plain' | undefined"
},
"privacy": "public",
"description": "指定提交表单到服务器的内容类型。可选值包括：\n\n* `application/x-www-form-urlencoded`：未指定该属性时的默认值\n* `multipart/form-data`：当表单包含 `<input type=\"file\">` 元素时使用\n* `text/plain`：HTML5 新增，用于调试\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `enctype` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formenctype",
"reflects": true
},
{
"kind": "field",
"name": "formMethod",
"type": {
"text": "| /*表单数据包含在表单内容中，发送到服务器*/ 'post'\n | /*表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法*/ 'get' | undefined"
},
"privacy": "public",
"description": "指定提交表单时使用的 HTTP 方法。可选值包括：\n\n* `post`：表单数据包含在表单内容中，发送到服务器\n* `get`：表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `method` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formmethod",
"reflects": true
},
{
"kind": "field",
"name": "formNoValidate",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "如果设置了此属性，表单提交时将不执行表单验证。\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `novalidate` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formnovalidate",
"reflects": true
},
{
"kind": "field",
"name": "formTarget",
"type": {
"text": "| /*默认选项，在当前框架中打开*/ '_self'\n | /*在新窗口中打开*/ '_blank'\n | /*在父框架中打开*/ '_parent'\n | /*在整个窗口中打开*/ '_top' | undefined"
},
"privacy": "public",
"description": "提交表单后接收到的响应应显示在何处。可选值包括：\n\n* `_self`：默认选项，在当前框架中打开\n* `_blank`：在新窗口中打开\n* `_parent`：在父框架中打开\n* `_top`：在整个窗口中打开\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `target` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formtarget",
"reflects": true
},
{
"kind": "field",
"name": "formController",
"privacy": "private",
"readonly": true,
"default": "new FormController(this)"
},
{
"kind": "field",
"name": "validity",
"type": {
"text": "ValidityState | undefined"
},
"privacy": "public",
"description": "表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)",
"readonly": true
},
{
"kind": "field",
"name": "validationMessage",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串",
"readonly": true
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "checkValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`"
},
{
"kind": "method",
"name": "reportValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。\n\n如果验证未通过，还会在组件上显示验证失败的提示。"
},
{
"kind": "method",
"name": "setCustomValidity",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "message",
"type": {
"text": "string"
},
"description": "自定义的错误提示文本"
}
],
"description": "设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证"
},
{
"kind": "method",
"name": "renderLoading",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderButton",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n }",
"type": {
"text": "RenderButtonOptions"
}
}
]
},
{
"kind": "method",
"name": "isButton",
"privacy": "protected",
"return": {
"type": {
"text": "boolean"
}
}
},
{
"kind": "field",
"name": "href",
"type": {
"text": "string"
},
"privacy": "public",
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"attribute": "href",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "download",
"type": {
"text": "string"
},
"privacy": "public",
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "download",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"privacy": "public",
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "target",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"privacy": "public",
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"attribute": "rel",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "method",
"name": "renderAnchor",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n refDirective,\n tabIndex,\n }",
"type": {
"text": "RenderAnchorOptions"
}
}
],
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"attributes": [
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否禁用",
"fieldName": "disabled"
},
{
"name": "loading",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否处于加载中状态",
"fieldName": "loading"
},
{
"name": "name",
"type": {
"text": "string"
},
"default": "''",
"description": "按钮的名称，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"fieldName": "name"
},
{
"name": "value",
"type": {
"text": "string"
},
"default": "''",
"description": "按钮的初始值，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"fieldName": "value"
},
{
"name": "type",
"type": {
"text": "| /*此按钮将表单数据提交给服务器*/ 'submit'\n | /*此按钮重置所有组件为初始值*/ 'reset'\n | /*此按钮没有默认行为*/ 'button'"
},
"default": "'button'",
"description": "按钮的类型。默认类型为 `button`。可选类型包括：\n\n* `submit`：点击按钮会提交表单数据到服务器\n* `reset`：点击按钮会将表单中的所有字段重置为初始值\n* `button`：此类型的按钮没有默认行为\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"fieldName": "type"
},
{
"name": "form",
"type": {
"text": "string | undefined"
},
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"fieldName": "form"
},
{
"name": "formaction",
"type": {
"text": "string | undefined"
},
"description": "指定提交表单的 URL。\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `action` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formAction"
},
{
"name": "formenctype",
"type": {
"text": "| /*未指定该属性时的默认值*/ 'application/x-www-form-urlencoded'\n | /*当表单包含 `<input type=\"file\">` 元素时使用*/ 'multipart/form-data'\n | /*HTML5 新增，用于调试*/ 'text/plain' | undefined"
},
"description": "指定提交表单到服务器的内容类型。可选值包括：\n\n* `application/x-www-form-urlencoded`：未指定该属性时的默认值\n* `multipart/form-data`：当表单包含 `<input type=\"file\">` 元素时使用\n* `text/plain`：HTML5 新增，用于调试\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `enctype` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formEnctype"
},
{
"name": "formmethod",
"type": {
"text": "| /*表单数据包含在表单内容中，发送到服务器*/ 'post'\n | /*表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法*/ 'get' | undefined"
},
"description": "指定提交表单时使用的 HTTP 方法。可选值包括：\n\n* `post`：表单数据包含在表单内容中，发送到服务器\n* `get`：表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `method` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formMethod"
},
{
"name": "formnovalidate",
"type": {
"text": "boolean"
},
"default": "false",
"description": "如果设置了此属性，表单提交时将不执行表单验证。\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `novalidate` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formNoValidate"
},
{
"name": "formtarget",
"type": {
"text": "| /*默认选项，在当前框架中打开*/ '_self'\n | /*在新窗口中打开*/ '_blank'\n | /*在父框架中打开*/ '_parent'\n | /*在整个窗口中打开*/ '_top' | undefined"
},
"description": "提交表单后接收到的响应应显示在何处。可选值包括：\n\n* `_self`：默认选项，在当前框架中打开\n* `_blank`：在新窗口中打开\n* `_parent`：在父框架中打开\n* `_top`：在整个窗口中打开\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `target` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formTarget"
},
{
"name": "href",
"type": {
"text": "string"
},
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"fieldName": "href",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "download",
"type": {
"text": "string"
},
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "download",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "target",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"fieldName": "rel",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"mixins": [
{
"name": "AnchorMixin",
"package": "@mdui/shared/mixins/anchor.js"
},
{
"name": "RippleMixin",
"module": "components/ripple/ripple-mixin.js"
},
{
"name": "FocusableMixin",
"package": "@mdui/shared/mixins/focusable.js"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"events": [
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
]
}
],
"exports": [
{
"kind": "js",
"name": "ButtonBase",
"declaration": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/button/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Button",
"cssProperties": [
{
"description": "组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
}
],
"cssParts": [
{
"description": "内部的 `<button>` 或 `<a>` 元素",
"name": "button"
},
{
"description": "按钮的文本",
"name": "label"
},
{
"description": "按钮左侧的图标",
"name": "icon"
},
{
"description": "按钮右侧的图标",
"name": "end-icon"
},
{
"description": "加载中状态的 `<mdui-circular-progress>` 元素",
"name": "loading"
}
],
"slots": [
{
"description": "按钮的文本",
"name": ""
},
{
"description": "按钮左侧的元素",
"name": "icon"
},
{
"description": "按钮右侧的元素",
"name": "end-icon"
}
],
"members": [
{
"kind": "field",
"name": "variant",
"type": {
"text": "| /*带阴影的按钮，适用于需要将按钮与背景视觉分离的场景*/ 'elevated'\n | /*视觉效果强烈，适用于重要流程的最终操作，如“保存”、“确认”等*/ 'filled'\n | /*视觉效果介于 `filled` 和 `outlined` 之间，适用于中高优先级的操作，如流程中的“下一步”*/ 'tonal'\n | /*带边框的按钮，适用于中等优先级，且次要的操作，如“返回”*/ 'outlined'\n | /*文本按钮，适用于最低优先级的操作*/ 'text'"
},
"privacy": "public",
"default": "'filled'",
"description": "按钮的形状。可选值包括：\n\n* `elevated`：带阴影的按钮，适用于需要将按钮与背景视觉分离的场景\n* `filled`：视觉效果强烈，适用于重要流程的最终操作，如“保存”、“确认”等\n* `tonal`：视觉效果介于 `filled` 和 `outlined` 之间，适用于中高优先级的操作，如流程中的“下一步”\n* `outlined`：带边框的按钮，适用于中等优先级，且次要的操作，如“返回”\n* `text`：文本按钮，适用于最低优先级的操作",
"attribute": "variant",
"reflects": true
},
{
"kind": "field",
"name": "fullWidth",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否填满父元素宽度",
"attribute": "full-width",
"reflects": true
},
{
"kind": "field",
"name": "icon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "左侧的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"attribute": "icon",
"reflects": true
},
{
"kind": "field",
"name": "endIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "右侧的 Material Icons 图标名。也可以通过 `slot=\"end-icon\"` 设置",
"attribute": "end-icon",
"reflects": true
},
{
"kind": "field",
"name": "rippleRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "rippleElement",
"privacy": "protected",
"readonly": true
},
{
"kind": "method",
"name": "renderIcon",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderLabel",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderEndIcon",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderInner",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult[]"
}
}
},
{
"kind": "field",
"name": "href",
"type": {
"text": "string"
},
"privacy": "public",
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"attribute": "href",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "download",
"type": {
"text": "string"
},
"privacy": "public",
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "download",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"privacy": "public",
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "target",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"privacy": "public",
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"attribute": "rel",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "renderAnchor",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n refDirective,\n tabIndex,\n }",
"type": {
"text": "RenderAnchorOptions"
}
}
],
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否禁用",
"attribute": "disabled",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "loading",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否处于加载中状态",
"attribute": "loading",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "name",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "按钮的名称，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"attribute": "name",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "按钮的初始值，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"attribute": "value",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "type",
"type": {
"text": "| /*此按钮将表单数据提交给服务器*/ 'submit'\n | /*此按钮重置所有组件为初始值*/ 'reset'\n | /*此按钮没有默认行为*/ 'button'"
},
"privacy": "public",
"default": "'button'",
"description": "按钮的类型。默认类型为 `button`。可选类型包括：\n\n* `submit`：点击按钮会提交表单数据到服务器\n* `reset`：点击按钮会将表单中的所有字段重置为初始值\n* `button`：此类型的按钮没有默认行为\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"attribute": "type",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "form",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"attribute": "form",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formAction",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "指定提交表单的 URL。\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `action` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formaction",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formEnctype",
"type": {
"text": "| /*未指定该属性时的默认值*/ 'application/x-www-form-urlencoded'\n | /*当表单包含 `<input type=\"file\">` 元素时使用*/ 'multipart/form-data'\n | /*HTML5 新增，用于调试*/ 'text/plain' | undefined"
},
"privacy": "public",
"description": "指定提交表单到服务器的内容类型。可选值包括：\n\n* `application/x-www-form-urlencoded`：未指定该属性时的默认值\n* `multipart/form-data`：当表单包含 `<input type=\"file\">` 元素时使用\n* `text/plain`：HTML5 新增，用于调试\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `enctype` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formenctype",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formMethod",
"type": {
"text": "| /*表单数据包含在表单内容中，发送到服务器*/ 'post'\n | /*表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法*/ 'get' | undefined"
},
"privacy": "public",
"description": "指定提交表单时使用的 HTTP 方法。可选值包括：\n\n* `post`：表单数据包含在表单内容中，发送到服务器\n* `get`：表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `method` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formmethod",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formNoValidate",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "如果设置了此属性，表单提交时将不执行表单验证。\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `novalidate` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formnovalidate",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formTarget",
"type": {
"text": "| /*默认选项，在当前框架中打开*/ '_self'\n | /*在新窗口中打开*/ '_blank'\n | /*在父框架中打开*/ '_parent'\n | /*在整个窗口中打开*/ '_top' | undefined"
},
"privacy": "public",
"description": "提交表单后接收到的响应应显示在何处。可选值包括：\n\n* `_self`：默认选项，在当前框架中打开\n* `_blank`：在新窗口中打开\n* `_parent`：在父框架中打开\n* `_top`：在整个窗口中打开\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `target` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formtarget",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formController",
"privacy": "private",
"readonly": true,
"default": "new FormController(this)",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "validity",
"type": {
"text": "ValidityState | undefined"
},
"privacy": "public",
"description": "表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "validationMessage",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "checkValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "reportValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。\n\n如果验证未通过，还会在组件上显示验证失败的提示。",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "setCustomValidity",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "message",
"type": {
"text": "string"
},
"description": "自定义的错误提示文本"
}
],
"description": "设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "renderLoading",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "renderButton",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n }",
"type": {
"text": "RenderButtonOptions"
}
}
],
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "isButton",
"privacy": "protected",
"return": {
"type": {
"text": "boolean"
}
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"description": "表单字段验证未通过时触发",
"name": "invalid"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
}
],
"attributes": [
{
"name": "variant",
"type": {
"text": "| /*带阴影的按钮，适用于需要将按钮与背景视觉分离的场景*/ 'elevated'\n | /*视觉效果强烈，适用于重要流程的最终操作，如“保存”、“确认”等*/ 'filled'\n | /*视觉效果介于 `filled` 和 `outlined` 之间，适用于中高优先级的操作，如流程中的“下一步”*/ 'tonal'\n | /*带边框的按钮，适用于中等优先级，且次要的操作，如“返回”*/ 'outlined'\n | /*文本按钮，适用于最低优先级的操作*/ 'text'"
},
"default": "'filled'",
"description": "按钮的形状。可选值包括：\n\n* `elevated`：带阴影的按钮，适用于需要将按钮与背景视觉分离的场景\n* `filled`：视觉效果强烈，适用于重要流程的最终操作，如“保存”、“确认”等\n* `tonal`：视觉效果介于 `filled` 和 `outlined` 之间，适用于中高优先级的操作，如流程中的“下一步”\n* `outlined`：带边框的按钮，适用于中等优先级，且次要的操作，如“返回”\n* `text`：文本按钮，适用于最低优先级的操作",
"fieldName": "variant"
},
{
"name": "full-width",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否填满父元素宽度",
"fieldName": "fullWidth"
},
{
"name": "icon",
"type": {
"text": "string | undefined"
},
"description": "左侧的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"fieldName": "icon"
},
{
"name": "end-icon",
"type": {
"text": "string | undefined"
},
"description": "右侧的 Material Icons 图标名。也可以通过 `slot=\"end-icon\"` 设置",
"fieldName": "endIcon"
},
{
"name": "href",
"type": {
"text": "string"
},
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"fieldName": "href",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "download",
"type": {
"text": "string"
},
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "download",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "target",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"fieldName": "rel",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否禁用",
"fieldName": "disabled",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "loading",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否处于加载中状态",
"fieldName": "loading",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "name",
"type": {
"text": "string"
},
"default": "''",
"description": "按钮的名称，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"fieldName": "name",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "value",
"type": {
"text": "string"
},
"default": "''",
"description": "按钮的初始值，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"fieldName": "value",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "type",
"type": {
"text": "| /*此按钮将表单数据提交给服务器*/ 'submit'\n | /*此按钮重置所有组件为初始值*/ 'reset'\n | /*此按钮没有默认行为*/ 'button'"
},
"default": "'button'",
"description": "按钮的类型。默认类型为 `button`。可选类型包括：\n\n* `submit`：点击按钮会提交表单数据到服务器\n* `reset`：点击按钮会将表单中的所有字段重置为初始值\n* `button`：此类型的按钮没有默认行为\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"fieldName": "type",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "form",
"type": {
"text": "string | undefined"
},
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"fieldName": "form",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formaction",
"type": {
"text": "string | undefined"
},
"description": "指定提交表单的 URL。\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `action` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formAction",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formenctype",
"type": {
"text": "| /*未指定该属性时的默认值*/ 'application/x-www-form-urlencoded'\n | /*当表单包含 `<input type=\"file\">` 元素时使用*/ 'multipart/form-data'\n | /*HTML5 新增，用于调试*/ 'text/plain' | undefined"
},
"description": "指定提交表单到服务器的内容类型。可选值包括：\n\n* `application/x-www-form-urlencoded`：未指定该属性时的默认值\n* `multipart/form-data`：当表单包含 `<input type=\"file\">` 元素时使用\n* `text/plain`：HTML5 新增，用于调试\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `enctype` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formEnctype",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formmethod",
"type": {
"text": "| /*表单数据包含在表单内容中，发送到服务器*/ 'post'\n | /*表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法*/ 'get' | undefined"
},
"description": "指定提交表单时使用的 HTTP 方法。可选值包括：\n\n* `post`：表单数据包含在表单内容中，发送到服务器\n* `get`：表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `method` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formMethod",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formnovalidate",
"type": {
"text": "boolean"
},
"default": "false",
"description": "如果设置了此属性，表单提交时将不执行表单验证。\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `novalidate` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formNoValidate",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formtarget",
"type": {
"text": "| /*默认选项，在当前框架中打开*/ '_self'\n | /*在新窗口中打开*/ '_blank'\n | /*在父框架中打开*/ '_parent'\n | /*在整个窗口中打开*/ '_top' | undefined"
},
"description": "提交表单后接收到的响应应显示在何处。可选值包括：\n\n* `_self`：默认选项，在当前框架中打开\n* `_blank`：在新窗口中打开\n* `_parent`：在父框架中打开\n* `_top`：在整个窗口中打开\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `target` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formTarget",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
}
],
"superclass": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
},
"summary": "按钮组件\n\n```html\n<mdui-button>Button</mdui-button>\n```",
"tagName": "mdui-button",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Button",
"declaration": {
"name": "Button",
"module": "components/button/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-button",
"declaration": {
"name": "Button",
"module": "components/button/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/card/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Card",
"cssProperties": [
{
"description": "组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
}
],
"slots": [
{
"description": "卡片的内容",
"name": ""
}
],
"members": [
{
"kind": "field",
"name": "variant",
"type": {
"text": "| /*带阴影的卡片，与背景的视觉分离度较高*/ 'elevated'\n | /*带填充色的卡片，与背景的视觉分离度较低*/ 'filled'\n | /*带边框的卡片，与背景的视觉分离度最高*/ 'outlined'"
},
"privacy": "public",
"default": "'elevated'",
"description": "卡片的形状。可选值包括：\n\n* `elevated`：带阴影的卡片，与背景的视觉分离度较高\n* `filled`：带填充色的卡片，与背景的视觉分离度较低\n* `outlined`：带边框的卡片，与背景的视觉分离度最高",
"attribute": "variant",
"reflects": true
},
{
"kind": "field",
"name": "clickable",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否可点击。为 `true` 时，卡片将具有鼠标悬浮效果和点击涟漪效果",
"attribute": "clickable",
"reflects": true
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否禁用",
"attribute": "disabled",
"reflects": true
},
{
"kind": "field",
"name": "rippleRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "rippleElement",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "href",
"type": {
"text": "string"
},
"privacy": "public",
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"attribute": "href",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "download",
"type": {
"text": "string"
},
"privacy": "public",
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "download",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"privacy": "public",
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "target",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"privacy": "public",
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"attribute": "rel",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "method",
"name": "renderAnchor",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n refDirective,\n tabIndex,\n }",
"type": {
"text": "RenderAnchorOptions"
}
}
],
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"attributes": [
{
"name": "variant",
"type": {
"text": "| /*带阴影的卡片，与背景的视觉分离度较高*/ 'elevated'\n | /*带填充色的卡片，与背景的视觉分离度较低*/ 'filled'\n | /*带边框的卡片，与背景的视觉分离度最高*/ 'outlined'"
},
"default": "'elevated'",
"description": "卡片的形状。可选值包括：\n\n* `elevated`：带阴影的卡片，与背景的视觉分离度较高\n* `filled`：带填充色的卡片，与背景的视觉分离度较低\n* `outlined`：带边框的卡片，与背景的视觉分离度最高",
"fieldName": "variant"
},
{
"name": "clickable",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否可点击。为 `true` 时，卡片将具有鼠标悬浮效果和点击涟漪效果",
"fieldName": "clickable"
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否禁用",
"fieldName": "disabled"
},
{
"name": "href",
"type": {
"text": "string"
},
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"fieldName": "href",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "download",
"type": {
"text": "string"
},
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "download",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "target",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"fieldName": "rel",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"mixins": [
{
"name": "AnchorMixin",
"package": "@mdui/shared/mixins/anchor.js"
},
{
"name": "RippleMixin",
"module": "components/ripple/ripple-mixin.js"
},
{
"name": "FocusableMixin",
"package": "@mdui/shared/mixins/focusable.js"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "卡片组件\n\n```html\n<mdui-card>card content</mdui-card>\n```",
"tagName": "mdui-card",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Card",
"declaration": {
"name": "Card",
"module": "components/card/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-card",
"declaration": {
"name": "Card",
"module": "components/card/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/checkbox/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Checkbox",
"cssParts": [
{
"description": "左侧图标容器",
"name": "control"
},
{
"description": "未选中状态的图标",
"name": "unchecked-icon"
},
{
"description": "选中状态的图标",
"name": "checked-icon"
},
{
"description": "不确定状态的图标",
"name": "indeterminate-icon"
},
{
"description": "复选框文本",
"name": "label"
}
],
"slots": [
{
"description": "复选框文本",
"name": ""
},
{
"description": "未选中状态的图标",
"name": "unchecked-icon"
},
{
"description": "选中状态的图标",
"name": "checked-icon"
},
{
"description": "不确定状态的图标",
"name": "indeterminate-icon"
}
],
"members": [
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否为禁用状态",
"attribute": "disabled",
"reflects": true
},
{
"kind": "field",
"name": "checked",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否为选中状态",
"attribute": "checked",
"reflects": true
},
{
"kind": "field",
"name": "defaultChecked",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "默认选中状态。在重置表单时，将恢复为此状态。此属性只能通过 JavaScript 属性设置"
},
{
"kind": "field",
"name": "indeterminate",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否处于不确定状态",
"attribute": "indeterminate",
"reflects": true
},
{
"kind": "field",
"name": "required",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "提交表单时，是否必须选中此复选框",
"attribute": "required",
"reflects": true
},
{
"kind": "field",
"name": "form",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"attribute": "form",
"reflects": true
},
{
"kind": "field",
"name": "name",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "复选框名称，将与表单数据一起提交",
"attribute": "name",
"reflects": true
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string"
},
"privacy": "public",
"default": "'on'",
"description": "复选框的值，将于表单数据一起提交",
"attribute": "value",
"reflects": true
},
{
"kind": "field",
"name": "uncheckedIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "未选中状态的 Material Icons 图标名。也可以通过 `slot=\"unchecked-icon\"` 设置",
"attribute": "unchecked-icon",
"reflects": true
},
{
"kind": "field",
"name": "checkedIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "选中状态的 Material Icons 图标名。也可以通过 `slot=\"checked-icon\"` 设置",
"attribute": "checked-icon",
"reflects": true
},
{
"kind": "field",
"name": "indeterminateIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "不确定状态的 Material Icons 图标名。也可以通过 `slot=\"indeterminate-icon\"` 设置",
"attribute": "indeterminate-icon",
"reflects": true
},
{
"kind": "field",
"name": "invalid",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否验证未通过"
},
{
"kind": "field",
"name": "inputRef",
"type": {
"text": "Ref<HTMLInputElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "rippleRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "formController",
"privacy": "private",
"readonly": true,
"default": "new FormController(this, { value: (control) => (control.checked ? control.value : undefined), defaultValue: (control) => control.defaultChecked!, setValue: (control, checked) => (control.checked = checked as boolean), })"
},
{
"kind": "field",
"name": "validity",
"type": {
"text": "ValidityState"
},
"privacy": "public",
"description": "表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)",
"readonly": true
},
{
"kind": "field",
"name": "validationMessage",
"type": {
"text": "string"
},
"privacy": "public",
"description": "如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串",
"readonly": true
},
{
"kind": "field",
"name": "rippleElement",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "onDisabledChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onCheckedChange",
"privacy": "private"
},
{
"kind": "method",
"name": "checkValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`"
},
{
"kind": "method",
"name": "reportValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。\n\n如果验证未通过，还会在组件上显示验证失败的提示。"
},
{
"kind": "method",
"name": "setCustomValidity",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "message",
"type": {
"text": "string"
},
"description": "自定义的错误提示文本"
}
],
"description": "设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证"
},
{
"kind": "method",
"name": "onChange",
"privacy": "private",
"description": "input[type=\"checkbox\"] 的 change 事件无法冒泡越过 shadow dom"
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"description": "选中状态变更时触发",
"name": "change"
},
{
"description": "选中状态变更时触发",
"name": "input"
},
{
"description": "表单字段验证未通过时触发",
"name": "invalid"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"attributes": [
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否为禁用状态",
"fieldName": "disabled"
},
{
"name": "checked",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否为选中状态",
"fieldName": "checked"
},
{
"name": "indeterminate",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否处于不确定状态",
"fieldName": "indeterminate"
},
{
"name": "required",
"type": {
"text": "boolean"
},
"default": "false",
"description": "提交表单时，是否必须选中此复选框",
"fieldName": "required"
},
{
"name": "form",
"type": {
"text": "string | undefined"
},
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"fieldName": "form"
},
{
"name": "name",
"type": {
"text": "string"
},
"default": "''",
"description": "复选框名称，将与表单数据一起提交",
"fieldName": "name"
},
{
"name": "value",
"type": {
"text": "string"
},
"default": "'on'",
"description": "复选框的值，将于表单数据一起提交",
"fieldName": "value"
},
{
"name": "unchecked-icon",
"type": {
"text": "string | undefined"
},
"description": "未选中状态的 Material Icons 图标名。也可以通过 `slot=\"unchecked-icon\"` 设置",
"fieldName": "uncheckedIcon"
},
{
"name": "checked-icon",
"type": {
"text": "string | undefined"
},
"description": "选中状态的 Material Icons 图标名。也可以通过 `slot=\"checked-icon\"` 设置",
"fieldName": "checkedIcon"
},
{
"name": "indeterminate-icon",
"type": {
"text": "string | undefined"
},
"description": "不确定状态的 Material Icons 图标名。也可以通过 `slot=\"indeterminate-icon\"` 设置",
"fieldName": "indeterminateIcon"
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"mixins": [
{
"name": "RippleMixin",
"module": "components/ripple/ripple-mixin.js"
},
{
"name": "FocusableMixin",
"package": "@mdui/shared/mixins/focusable.js"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "复选框组件\n\n```html\n<mdui-checkbox>Checkbox</mdui-checkbox>\n```",
"tagName": "mdui-checkbox",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Checkbox",
"declaration": {
"name": "Checkbox",
"module": "components/checkbox/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-checkbox",
"declaration": {
"name": "Checkbox",
"module": "components/checkbox/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/chip/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Chip",
"cssProperties": [
{
"description": "组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
}
],
"cssParts": [
{
"description": "内部的 `<button>` 或 `<a>` 元素",
"name": "button"
},
{
"description": "纸片文本",
"name": "label"
},
{
"description": "左侧图标",
"name": "icon"
},
{
"description": "右侧图标",
"name": "end-icon"
},
{
"description": "选中状态下的左侧图标",
"name": "selected-icon"
},
{
"description": "可删除时的右侧删除图标",
"name": "delete-icon"
},
{
"description": "加载中状态的 `<mdui-circular-progress>` 元素",
"name": "loading"
}
],
"slots": [
{
"description": "纸片文本",
"name": ""
},
{
"description": "左侧元素",
"name": "icon"
},
{
"description": "右侧元素",
"name": "end-icon"
},
{
"description": "选中状态下的左侧元素",
"name": "selected-icon"
},
{
"description": "可删除时的右侧删除元素",
"name": "delete-icon"
}
],
"members": [
{
"kind": "field",
"name": "variant",
"type": {
"text": "| /*用于显示与当前上下文相关的辅助操作，如在点餐页面提供分享、收藏等功能*/ 'assist'\n | /*用于对内容进行筛选，如在搜索结果页过滤搜索结果*/ 'filter'\n | /*用于表示用户输入的信息片段，如在 Gmail 的“收件人”字段中的联系人*/ 'input'\n | /*用于提供动态生成的推荐信息，以简化用户操作，如在聊天应用中预测用户可能想发送的信息*/ 'suggestion'"
},
"privacy": "public",
"default": "'assist'",
"description": "纸片的形状。可选值包括：\n\n* `assist`：用于显示与当前上下文相关的辅助操作，如在点餐页面提供分享、收藏等功能\n* `filter`：用于对内容进行筛选，如在搜索结果页过滤搜索结果\n* `input`：用于表示用户输入的信息片段，如在 Gmail 的“收件人”字段中的联系人\n* `suggestion`：用于提供动态生成的推荐信息，以简化用户操作，如在聊天应用中预测用户可能想发送的信息",
"attribute": "variant",
"reflects": true
},
{
"kind": "field",
"name": "elevated",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否显示阴影",
"attribute": "elevated",
"reflects": true
},
{
"kind": "field",
"name": "selectable",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否可选中",
"attribute": "selectable",
"reflects": true
},
{
"kind": "field",
"name": "selected",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否已选中",
"attribute": "selected",
"reflects": true
},
{
"kind": "field",
"name": "deletable",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否可删除。为 `true` 时，纸片右侧会显示删除图标",
"attribute": "deletable",
"reflects": true
},
{
"kind": "field",
"name": "icon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "左侧的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"attribute": "icon",
"reflects": true
},
{
"kind": "field",
"name": "selectedIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "选中状态下左侧的 Material Icons 图标名。也可以通过 `slot=\"selected-icon\"` 设置",
"attribute": "selected-icon",
"reflects": true
},
{
"kind": "field",
"name": "endIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "右侧的 Material Icons 图标名。也可以通过 `slot=\"end-icon\"` 设置",
"attribute": "end-icon",
"reflects": true
},
{
"kind": "field",
"name": "deleteIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "可删除时，右侧删除图标的 Material Icons 图标名。也可以通过 `slot=\"delete-icon\"` 设置",
"attribute": "delete-icon",
"reflects": true
},
{
"kind": "field",
"name": "rippleRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController( this, 'icon', 'selected-icon', 'end-icon', )"
},
{
"kind": "field",
"name": "rippleElement",
"privacy": "protected",
"readonly": true
},
{
"kind": "method",
"name": "onSelectedChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onClick",
"privacy": "private"
},
{
"kind": "method",
"name": "onKeyDown",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "KeyboardEvent"
}
}
]
},
{
"kind": "method",
"name": "onDelete",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "MouseEvent"
}
}
],
"description": "点击删除按钮"
},
{
"kind": "method",
"name": "renderIcon",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderLabel",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderEndIcon",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderDeleteIcon",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderInner",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult[]"
}
}
},
{
"kind": "field",
"name": "href",
"type": {
"text": "string"
},
"privacy": "public",
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"attribute": "href",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "download",
"type": {
"text": "string"
},
"privacy": "public",
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "download",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"privacy": "public",
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "target",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"privacy": "public",
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"attribute": "rel",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "renderAnchor",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n refDirective,\n tabIndex,\n }",
"type": {
"text": "RenderAnchorOptions"
}
}
],
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否禁用",
"attribute": "disabled",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "loading",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否处于加载中状态",
"attribute": "loading",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "name",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "按钮的名称，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"attribute": "name",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "按钮的初始值，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"attribute": "value",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "type",
"type": {
"text": "| /*此按钮将表单数据提交给服务器*/ 'submit'\n | /*此按钮重置所有组件为初始值*/ 'reset'\n | /*此按钮没有默认行为*/ 'button'"
},
"privacy": "public",
"default": "'button'",
"description": "按钮的类型。默认类型为 `button`。可选类型包括：\n\n* `submit`：点击按钮会提交表单数据到服务器\n* `reset`：点击按钮会将表单中的所有字段重置为初始值\n* `button`：此类型的按钮没有默认行为\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"attribute": "type",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "form",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"attribute": "form",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formAction",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "指定提交表单的 URL。\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `action` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formaction",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formEnctype",
"type": {
"text": "| /*未指定该属性时的默认值*/ 'application/x-www-form-urlencoded'\n | /*当表单包含 `<input type=\"file\">` 元素时使用*/ 'multipart/form-data'\n | /*HTML5 新增，用于调试*/ 'text/plain' | undefined"
},
"privacy": "public",
"description": "指定提交表单到服务器的内容类型。可选值包括：\n\n* `application/x-www-form-urlencoded`：未指定该属性时的默认值\n* `multipart/form-data`：当表单包含 `<input type=\"file\">` 元素时使用\n* `text/plain`：HTML5 新增，用于调试\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `enctype` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formenctype",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formMethod",
"type": {
"text": "| /*表单数据包含在表单内容中，发送到服务器*/ 'post'\n | /*表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法*/ 'get' | undefined"
},
"privacy": "public",
"description": "指定提交表单时使用的 HTTP 方法。可选值包括：\n\n* `post`：表单数据包含在表单内容中，发送到服务器\n* `get`：表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `method` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formmethod",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formNoValidate",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "如果设置了此属性，表单提交时将不执行表单验证。\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `novalidate` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formnovalidate",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formTarget",
"type": {
"text": "| /*默认选项，在当前框架中打开*/ '_self'\n | /*在新窗口中打开*/ '_blank'\n | /*在父框架中打开*/ '_parent'\n | /*在整个窗口中打开*/ '_top' | undefined"
},
"privacy": "public",
"description": "提交表单后接收到的响应应显示在何处。可选值包括：\n\n* `_self`：默认选项，在当前框架中打开\n* `_blank`：在新窗口中打开\n* `_parent`：在父框架中打开\n* `_top`：在整个窗口中打开\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `target` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formtarget",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formController",
"privacy": "private",
"readonly": true,
"default": "new FormController(this)",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "validity",
"type": {
"text": "ValidityState | undefined"
},
"privacy": "public",
"description": "表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "validationMessage",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "checkValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "reportValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。\n\n如果验证未通过，还会在组件上显示验证失败的提示。",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "setCustomValidity",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "message",
"type": {
"text": "string"
},
"description": "自定义的错误提示文本"
}
],
"description": "设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "renderLoading",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "renderButton",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n }",
"type": {
"text": "RenderButtonOptions"
}
}
],
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "isButton",
"privacy": "protected",
"return": {
"type": {
"text": "boolean"
}
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"description": "表单字段验证未通过时触发",
"name": "invalid"
},
{
"description": "选中状态变更时触发",
"name": "change"
},
{
"description": "点击删除图标时触发",
"name": "delete"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
}
],
"attributes": [
{
"name": "variant",
"type": {
"text": "| /*用于显示与当前上下文相关的辅助操作，如在点餐页面提供分享、收藏等功能*/ 'assist'\n | /*用于对内容进行筛选，如在搜索结果页过滤搜索结果*/ 'filter'\n | /*用于表示用户输入的信息片段，如在 Gmail 的“收件人”字段中的联系人*/ 'input'\n | /*用于提供动态生成的推荐信息，以简化用户操作，如在聊天应用中预测用户可能想发送的信息*/ 'suggestion'"
},
"default": "'assist'",
"description": "纸片的形状。可选值包括：\n\n* `assist`：用于显示与当前上下文相关的辅助操作，如在点餐页面提供分享、收藏等功能\n* `filter`：用于对内容进行筛选，如在搜索结果页过滤搜索结果\n* `input`：用于表示用户输入的信息片段，如在 Gmail 的“收件人”字段中的联系人\n* `suggestion`：用于提供动态生成的推荐信息，以简化用户操作，如在聊天应用中预测用户可能想发送的信息",
"fieldName": "variant"
},
{
"name": "elevated",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否显示阴影",
"fieldName": "elevated"
},
{
"name": "selectable",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否可选中",
"fieldName": "selectable"
},
{
"name": "selected",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否已选中",
"fieldName": "selected"
},
{
"name": "deletable",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否可删除。为 `true` 时，纸片右侧会显示删除图标",
"fieldName": "deletable"
},
{
"name": "icon",
"type": {
"text": "string | undefined"
},
"description": "左侧的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"fieldName": "icon"
},
{
"name": "selected-icon",
"type": {
"text": "string | undefined"
},
"description": "选中状态下左侧的 Material Icons 图标名。也可以通过 `slot=\"selected-icon\"` 设置",
"fieldName": "selectedIcon"
},
{
"name": "end-icon",
"type": {
"text": "string | undefined"
},
"description": "右侧的 Material Icons 图标名。也可以通过 `slot=\"end-icon\"` 设置",
"fieldName": "endIcon"
},
{
"name": "delete-icon",
"type": {
"text": "string | undefined"
},
"description": "可删除时，右侧删除图标的 Material Icons 图标名。也可以通过 `slot=\"delete-icon\"` 设置",
"fieldName": "deleteIcon"
},
{
"name": "href",
"type": {
"text": "string"
},
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"fieldName": "href",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "download",
"type": {
"text": "string"
},
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "download",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "target",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"fieldName": "rel",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否禁用",
"fieldName": "disabled",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "loading",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否处于加载中状态",
"fieldName": "loading",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "name",
"type": {
"text": "string"
},
"default": "''",
"description": "按钮的名称，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"fieldName": "name",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "value",
"type": {
"text": "string"
},
"default": "''",
"description": "按钮的初始值，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"fieldName": "value",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "type",
"type": {
"text": "| /*此按钮将表单数据提交给服务器*/ 'submit'\n | /*此按钮重置所有组件为初始值*/ 'reset'\n | /*此按钮没有默认行为*/ 'button'"
},
"default": "'button'",
"description": "按钮的类型。默认类型为 `button`。可选类型包括：\n\n* `submit`：点击按钮会提交表单数据到服务器\n* `reset`：点击按钮会将表单中的所有字段重置为初始值\n* `button`：此类型的按钮没有默认行为\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"fieldName": "type",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "form",
"type": {
"text": "string | undefined"
},
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"fieldName": "form",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formaction",
"type": {
"text": "string | undefined"
},
"description": "指定提交表单的 URL。\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `action` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formAction",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formenctype",
"type": {
"text": "| /*未指定该属性时的默认值*/ 'application/x-www-form-urlencoded'\n | /*当表单包含 `<input type=\"file\">` 元素时使用*/ 'multipart/form-data'\n | /*HTML5 新增，用于调试*/ 'text/plain' | undefined"
},
"description": "指定提交表单到服务器的内容类型。可选值包括：\n\n* `application/x-www-form-urlencoded`：未指定该属性时的默认值\n* `multipart/form-data`：当表单包含 `<input type=\"file\">` 元素时使用\n* `text/plain`：HTML5 新增，用于调试\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `enctype` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formEnctype",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formmethod",
"type": {
"text": "| /*表单数据包含在表单内容中，发送到服务器*/ 'post'\n | /*表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法*/ 'get' | undefined"
},
"description": "指定提交表单时使用的 HTTP 方法。可选值包括：\n\n* `post`：表单数据包含在表单内容中，发送到服务器\n* `get`：表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `method` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formMethod",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formnovalidate",
"type": {
"text": "boolean"
},
"default": "false",
"description": "如果设置了此属性，表单提交时将不执行表单验证。\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `novalidate` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formNoValidate",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formtarget",
"type": {
"text": "| /*默认选项，在当前框架中打开*/ '_self'\n | /*在新窗口中打开*/ '_blank'\n | /*在父框架中打开*/ '_parent'\n | /*在整个窗口中打开*/ '_top' | undefined"
},
"description": "提交表单后接收到的响应应显示在何处。可选值包括：\n\n* `_self`：默认选项，在当前框架中打开\n* `_blank`：在新窗口中打开\n* `_parent`：在父框架中打开\n* `_top`：在整个窗口中打开\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `target` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formTarget",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
}
],
"superclass": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
},
"summary": "纸片组件\n\n```html\n<mdui-chip>Chip</mdui-chip>\n```",
"tagName": "mdui-chip",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Chip",
"declaration": {
"name": "Chip",
"module": "components/chip/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-chip",
"declaration": {
"name": "Chip",
"module": "components/chip/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/circular-progress/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "CircularProgress",
"members": [
{
"kind": "field",
"name": "max",
"type": {
"text": "number"
},
"privacy": "public",
"default": "1",
"description": "进度指示器的最大值。默认为 `1`",
"attribute": "max",
"reflects": true
},
{
"kind": "field",
"name": "value",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "进度指示器的当前值。如果未指定该值，则显示为不确定状态",
"attribute": "value"
},
{
"kind": "method",
"name": "renderDeterminate",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderInDeterminate",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
}
],
"attributes": [
{
"name": "max",
"type": {
"text": "number"
},
"default": "1",
"description": "进度指示器的最大值。默认为 `1`",
"fieldName": "max"
},
{
"name": "value",
"type": {
"text": "number | undefined"
},
"description": "进度指示器的当前值。如果未指定该值，则显示为不确定状态",
"fieldName": "value"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "圆形进度指示器组件\n\n```html\n<mdui-circular-progress></mdui-circular-progress>\n```",
"tagName": "mdui-circular-progress",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "CircularProgress",
"declaration": {
"name": "CircularProgress",
"module": "components/circular-progress/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-circular-progress",
"declaration": {
"name": "CircularProgress",
"module": "components/circular-progress/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/collapse/collapse-item.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "CollapseItem",
"cssParts": [
{
"description": "折叠面板的头部内容",
"name": "header"
},
{
"description": "折叠面板的正文内容",
"name": "body"
}
],
"slots": [
{
"description": "折叠面板项的正文内容",
"name": ""
},
{
"description": "折叠面板项的头部内容",
"name": "header"
}
],
"members": [
{
"kind": "field",
"name": "value",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "此折叠面板项的值",
"attribute": "value",
"reflects": true
},
{
"kind": "field",
"name": "header",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "此折叠面板项的头部文本",
"attribute": "header",
"reflects": true
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否禁用此折叠面板项",
"attribute": "disabled",
"reflects": true
},
{
"kind": "field",
"name": "trigger",
"type": {
"text": "string | HTMLElement | JQ<HTMLElement> | undefined"
},
"privacy": "public",
"description": "点击该元素时触发折叠，值可以是 CSS 选择器、DOM 元素、或 [JQ 对象](/docs/2/functions/jq)。默认为点击整个 header 区域触发",
"attribute": "trigger"
},
{
"kind": "field",
"name": "active",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"description": "是否为激活状态，由 `collapse` 组件控制该参数"
},
{
"kind": "field",
"name": "state",
"type": {
"text": "'open' | 'opened' | 'close' | 'closed'"
},
"privacy": "private",
"default": "'closed'"
},
{
"kind": "field",
"name": "isInitial",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "true"
},
{
"kind": "field",
"name": "key",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "bodyRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "method",
"name": "onActiveChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onTransitionEnd",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "TransitionEvent"
}
}
]
},
{
"kind": "method",
"name": "updateBodyHeight",
"privacy": "private"
}
],
"events": [
{
"description": "开始打开时，事件被触发",
"name": "open"
},
{
"description": "打开动画完成时，事件被触发",
"name": "opened"
},
{
"description": "开始关闭时，事件被触发",
"name": "close"
},
{
"description": "关闭动画完成时，事件被触发",
"name": "closed"
}
],
"attributes": [
{
"name": "value",
"type": {
"text": "string | undefined"
},
"description": "此折叠面板项的值",
"fieldName": "value"
},
{
"name": "header",
"type": {
"text": "string | undefined"
},
"description": "此折叠面板项的头部文本",
"fieldName": "header"
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否禁用此折叠面板项",
"fieldName": "disabled"
},
{
"name": "trigger",
"type": {
"text": "string | HTMLElement | JQ<HTMLElement> | undefined"
},
"description": "点击该元素时触发折叠，值可以是 CSS 选择器、DOM 元素、或 [JQ 对象](/docs/2/functions/jq)。默认为点击整个 header 区域触发",
"fieldName": "trigger"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "折叠面板项组件，需配合 `<mdui-collapse>` 组件使用\n\n```html\n<mdui-collapse>\n..<mdui-collapse-item header=\"header-1\">content-1</mdui-collapse-item>\n..<mdui-collapse-item header=\"header-2\">content-2</mdui-collapse-item>\n</mdui-collapse>\n```",
"tagName": "mdui-collapse-item",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "CollapseItem",
"declaration": {
"name": "CollapseItem",
"module": "components/collapse/collapse-item.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-collapse-item",
"declaration": {
"name": "CollapseItem",
"module": "components/collapse/collapse-item.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/collapse/collapse.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Collapse",
"slots": [
{
"description": "`<mdui-collapse-item>` 组件",
"name": ""
}
],
"members": [
{
"kind": "field",
"name": "accordion",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否启用手风琴模式",
"attribute": "accordion",
"reflects": true
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string | string[] | undefined"
},
"privacy": "public",
"description": "当前展开的 `<mdui-collapse-item>` 的值\n\n**Note**：该属性的 HTML 属性始终为字符串，只有在 `accordion` 为 `true` 时，才能设置初始值；该属性的 JavaScript 属性值在 `accordion` 为 `true` 时为字符串，在 `accordion` 为 `false` 时为字符串数组。因此，当 `accordion` 为 `false` 时，只能通过修改 JavaScript 属性值来改变此值。",
"attribute": "value"
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否禁用此折叠面板",
"attribute": "disabled",
"reflects": true
},
{
"kind": "field",
"name": "activeKeys",
"type": {
"text": "number[]"
},
"privacy": "private",
"default": "[]"
},
{
"kind": "field",
"name": "items",
"type": {
"text": "CollapseItem[]"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "isInitial",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "true"
},
{
"kind": "field",
"name": "definedController",
"privacy": "private",
"default": "new DefinedController(this, { relatedElements: ['mdui-collapse-item'], })"
},
{
"kind": "method",
"name": "onActiveKeysChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onValueChange",
"privacy": "private"
},
{
"kind": "method",
"name": "setActiveKeys",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "activeKeys",
"type": {
"text": "number[]"
}
}
]
},
{
"kind": "method",
"name": "setValue",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "value",
"type": {
"text": "string | string[] | undefined"
}
}
]
},
{
"kind": "method",
"name": "onClick",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "MouseEvent"
}
}
]
},
{
"kind": "method",
"name": "onSlotChange",
"privacy": "private"
},
{
"kind": "method",
"name": "updateItems",
"privacy": "private"
}
],
"events": [
{
"description": "当前展开的折叠面板项变化时触发",
"name": "change"
}
],
"attributes": [
{
"name": "accordion",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否启用手风琴模式",
"fieldName": "accordion"
},
{
"name": "value",
"type": {
"text": "string | string[] | undefined"
},
"description": "当前展开的 `<mdui-collapse-item>` 的值\n\n**Note**：该属性的 HTML 属性始终为字符串，只有在 `accordion` 为 `true` 时，才能设置初始值；该属性的 JavaScript 属性值在 `accordion` 为 `true` 时为字符串，在 `accordion` 为 `false` 时为字符串数组。因此，当 `accordion` 为 `false` 时，只能通过修改 JavaScript 属性值来改变此值。",
"fieldName": "value"
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否禁用此折叠面板",
"fieldName": "disabled"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "折叠面板组件，需配合 `<mdui-collapse-item>` 组件使用\n\n```html\n<mdui-collapse>\n..<mdui-collapse-item header=\"header-1\">content-1</mdui-collapse-item>\n..<mdui-collapse-item header=\"header-2\">content-2</mdui-collapse-item>\n</mdui-collapse>\n```",
"tagName": "mdui-collapse",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Collapse",
"declaration": {
"name": "Collapse",
"module": "components/collapse/collapse.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-collapse",
"declaration": {
"name": "Collapse",
"module": "components/collapse/collapse.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/dialog/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Dialog",
"cssProperties": [
{
"description": "组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
},
{
"description": "组件的 CSS `z-index` 值",
"name": "--z-index"
}
],
"cssParts": [
{
"description": "遮罩层",
"name": "overlay"
},
{
"description": "对话框容器",
"name": "panel"
},
{
"description": "对话框 header 部分，包含 icon 和 headline",
"name": "header"
},
{
"description": "顶部图标，位于 header 中",
"name": "icon"
},
{
"description": "顶部标题，位于 header 中",
"name": "headline"
},
{
"description": "对话框 body 部分",
"name": "body"
},
{
"description": "副文本部分，位于 body 中",
"name": "description"
},
{
"description": "底部操作按钮",
"name": "action"
}
],
"slots": [
{
"description": "顶部元素，默认包含 `icon` slot 和 `headline` slot",
"name": "header"
},
{
"description": "顶部图标",
"name": "icon"
},
{
"description": "顶部标题",
"name": "headline"
},
{
"description": "标题下方的文本",
"name": "description"
},
{
"description": "对话框主体内容",
"name": ""
},
{
"description": "底部操作栏中的元素",
"name": "action"
}
],
"members": [
{
"kind": "field",
"name": "icon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "顶部的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"attribute": "icon",
"reflects": true
},
{
"kind": "field",
"name": "headline",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "标题。也可以通过 `slot=\"headline\"` 设置",
"attribute": "headline",
"reflects": true
},
{
"kind": "field",
"name": "description",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "标题下方的文本。也可以通过 `slot=\"description\"` 设置",
"attribute": "description",
"reflects": true
},
{
"kind": "field",
"name": "open",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否打开对话框",
"attribute": "open",
"reflects": true
},
{
"kind": "field",
"name": "fullscreen",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否全屏显示对话框",
"attribute": "fullscreen",
"reflects": true
},
{
"kind": "field",
"name": "closeOnEsc",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否允许按下 ESC 键关闭对话框",
"attribute": "close-on-esc",
"reflects": true
},
{
"kind": "field",
"name": "closeOnOverlayClick",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否允许点击遮罩层关闭对话框",
"attribute": "close-on-overlay-click",
"reflects": true
},
{
"kind": "field",
"name": "stackedActions",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否垂直排列底部操作按钮",
"attribute": "stacked-actions",
"reflects": true
},
{
"kind": "field",
"name": "topAppBarElements",
"type": {
"text": "TopAppBar[]"
},
"privacy": "private",
"readonly": true,
"description": "dialog 组件内包含的 mdui-top-app-bar 组件"
},
{
"kind": "field",
"name": "originalTrigger",
"type": {
"text": "HTMLElement"
},
"privacy": "private"
},
{
"kind": "field",
"name": "modalHelper",
"type": {
"text": "Modal"
},
"privacy": "private"
},
{
"kind": "field",
"name": "overlayRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "panelRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "bodyRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController( this, 'header', 'icon', 'headline', 'description', 'action', '[default]', )"
},
{
"kind": "field",
"name": "definedController",
"privacy": "private",
"readonly": true,
"default": "new DefinedController(this, { relatedElements: ['mdui-top-app-bar'], })"
},
{
"kind": "method",
"name": "onOpenChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onOverlayClick",
"privacy": "private"
},
{
"kind": "method",
"name": "renderIcon",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderHeadline",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderDescription",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
}
],
"events": [
{
"description": "对话框开始打开时触发。可以通过调用 `event.preventDefault()` 阻止对话框打开",
"name": "open"
},
{
"description": "对话框打开动画完成后触发",
"name": "opened"
},
{
"description": "对话框开始关闭时触发。可以通过调用 `event.preventDefault()` 阻止对话框关闭",
"name": "close"
},
{
"description": "对话框关闭动画完成后触发",
"name": "closed"
},
{
"description": "点击遮罩层时触发",
"name": "overlay-click"
}
],
"attributes": [
{
"name": "icon",
"type": {
"text": "string | undefined"
},
"description": "顶部的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"fieldName": "icon"
},
{
"name": "headline",
"type": {
"text": "string | undefined"
},
"description": "标题。也可以通过 `slot=\"headline\"` 设置",
"fieldName": "headline"
},
{
"name": "description",
"type": {
"text": "string | undefined"
},
"description": "标题下方的文本。也可以通过 `slot=\"description\"` 设置",
"fieldName": "description"
},
{
"name": "open",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否打开对话框",
"fieldName": "open"
},
{
"name": "fullscreen",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否全屏显示对话框",
"fieldName": "fullscreen"
},
{
"name": "close-on-esc",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否允许按下 ESC 键关闭对话框",
"fieldName": "closeOnEsc"
},
{
"name": "close-on-overlay-click",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否允许点击遮罩层关闭对话框",
"fieldName": "closeOnOverlayClick"
},
{
"name": "stacked-actions",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否垂直排列底部操作按钮",
"fieldName": "stackedActions"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "对话框组件\n\n```html\n<mdui-dialog>content</mdui-dialog>\n```",
"tagName": "mdui-dialog",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Dialog",
"declaration": {
"name": "Dialog",
"module": "components/dialog/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-dialog",
"declaration": {
"name": "Dialog",
"module": "components/dialog/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/divider/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Divider",
"members": [
{
"kind": "field",
"name": "vertical",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否为垂直分割线",
"attribute": "vertical",
"reflects": true
},
{
"kind": "field",
"name": "inset",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否进行左侧缩进",
"attribute": "inset",
"reflects": true
},
{
"kind": "field",
"name": "middle",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否进行左右两侧缩进",
"attribute": "middle",
"reflects": true
}
],
"attributes": [
{
"name": "vertical",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否为垂直分割线",
"fieldName": "vertical"
},
{
"name": "inset",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否进行左侧缩进",
"fieldName": "inset"
},
{
"name": "middle",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否进行左右两侧缩进",
"fieldName": "middle"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "分割线组件\n\n```html\n<mdui-divider></mdui-divider>\n```",
"tagName": "mdui-divider",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Divider",
"declaration": {
"name": "Divider",
"module": "components/divider/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-divider",
"declaration": {
"name": "Divider",
"module": "components/divider/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/dropdown/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Dropdown",
"cssProperties": [
{
"description": "组件的 CSS `z-index` 值",
"name": "--z-index"
}
],
"cssParts": [
{
"description": "触发下拉组件的元素的容器，即 `trigger` slot 的容器",
"name": "trigger"
},
{
"description": "下拉组件内容的容器",
"name": "panel"
}
],
"slots": [
{
"description": "下拉组件的内容",
"name": ""
},
{
"description": "触发下拉组件的元素，例如 [`<mdui-button>`](/docs/2/components/button) 元素",
"name": "trigger"
}
],
"members": [
{
"kind": "field",
"name": "open",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否打开下拉组件",
"attribute": "open",
"reflects": true
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否禁用下拉组件",
"attribute": "disabled",
"reflects": true
},
{
"kind": "field",
"name": "trigger",
"type": {
"text": "| /*点击触发*/ 'click'\n | /*鼠标悬浮触发*/ 'hover'\n | /*聚焦触发*/ 'focus'\n | /*鼠标右键点击、或触摸长按触发*/ 'contextmenu'\n | /*仅能通过编程方式打开和关闭下拉组件，不能再指定其他触发方式*/ 'manual'\n | string"
},
"privacy": "public",
"default": "'click'",
"description": "下拉组件的触发方式，支持多个值，用空格分隔。可选值包括：\n\n* `click`：点击触发\n* `hover`：鼠标悬浮触发\n* `focus`：聚焦触发\n* `contextmenu`：鼠标右键点击、或触摸长按触发\n* `manual`：仅能通过编程方式打开和关闭下拉组件，不能再指定其他触发方式",
"attribute": "trigger",
"reflects": true
},
{
"kind": "field",
"name": "placement",
"type": {
"text": "| /*自动判断位置*/ 'auto'\n | /*上方左对齐*/ 'top-start'\n | /*上方居中*/ 'top'\n | /*上方右对齐*/ 'top-end'\n | /*下方左对齐*/ 'bottom-start'\n | /*下方居中*/ 'bottom'\n | /*下方右对齐*/ 'bottom-end'\n | /*左侧顶部对齐*/ 'left-start'\n | /*左侧居中*/ 'left'\n | /*左侧底部对齐*/ 'left-end'\n | /*右侧顶部对齐*/ 'right-start'\n | /*右侧居中*/ 'right'\n | /*右侧底部对齐*/ 'right-end'"
},
"privacy": "public",
"default": "'auto'",
"description": "下拉组件内容的位置。可选值包括：\n\n* `auto`：自动判断位置\n* `top-start`：上方左对齐\n* `top`：上方居中\n* `top-end`：上方右对齐\n* `bottom-start`：下方左对齐\n* `bottom`：下方居中\n* `bottom-end`：下方右对齐\n* `left-start`：左侧顶部对齐\n* `left`：左侧居中\n* `left-end`：左侧底部对齐\n* `right-start`：右侧顶部对齐\n* `right`：右侧居中\n* `right-end`：右侧底部对齐",
"attribute": "placement",
"reflects": true
},
{
"kind": "field",
"name": "stayOpenOnClick",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "点击 [`<mdui-menu-item>`](/docs/2/components/menu#menu-item-api) 后，下拉组件是否保持打开状态",
"attribute": "stay-open-on-click",
"reflects": true
},
{
"kind": "field",
"name": "openDelay",
"type": {
"text": "number"
},
"privacy": "public",
"default": "150",
"description": "鼠标悬浮触发下拉组件打开的延时，单位为毫秒",
"attribute": "open-delay",
"reflects": true
},
{
"kind": "field",
"name": "closeDelay",
"type": {
"text": "number"
},
"privacy": "public",
"default": "150",
"description": "鼠标悬浮触发下拉组件关闭的延时，单位为毫秒",
"attribute": "close-delay",
"reflects": true
},
{
"kind": "field",
"name": "openOnPointer",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在触发下拉组件的光标位置打开下拉组件，常用于打开鼠标右键菜单",
"attribute": "open-on-pointer",
"reflects": true
},
{
"kind": "field",
"name": "triggerElements",
"type": {
"text": "HTMLElement[]"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "panelElements",
"type": {
"text": "HTMLElement[]"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "pointerOffsetX",
"type": {
"text": "number"
},
"privacy": "private"
},
{
"kind": "field",
"name": "pointerOffsetY",
"type": {
"text": "number"
},
"privacy": "private"
},
{
"kind": "field",
"name": "animateDirection",
"type": {
"text": "'horizontal' | 'vertical'"
},
"privacy": "private"
},
{
"kind": "field",
"name": "openTimeout",
"type": {
"text": "number"
},
"privacy": "private"
},
{
"kind": "field",
"name": "closeTimeout",
"type": {
"text": "number"
},
"privacy": "private"
},
{
"kind": "field",
"name": "observeResize",
"type": {
"text": "ObserveResize | undefined"
},
"privacy": "private"
},
{
"kind": "field",
"name": "overflowAncestors",
"type": {
"text": "ReturnType<typeof getOverflowAncestors> | undefined"
},
"privacy": "private"
},
{
"kind": "field",
"name": "panelRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "definedController",
"privacy": "private",
"readonly": true,
"default": "new DefinedController(this, { relatedElements: [''], })"
},
{
"kind": "field",
"name": "triggerElement",
"type": {
"text": "HTMLElement"
},
"privacy": "private",
"readonly": true
},
{
"kind": "method",
"name": "onPositionChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onOpenChange",
"privacy": "private"
},
{
"kind": "method",
"name": "getCssScaleName",
"privacy": "private",
"description": "获取 dropdown 打开、关闭动画的 CSS scaleX 或 scaleY"
},
{
"kind": "method",
"name": "onDocumentClick",
"privacy": "private",
"parameters": [
{
"name": "e",
"type": {
"text": "MouseEvent"
}
}
],
"description": "在 document 上点击时，根据条件判断是否要关闭 dropdown"
},
{
"kind": "method",
"name": "onDocumentKeydown",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "KeyboardEvent"
}
}
],
"description": "在 document 上按下按键时，根据条件判断是否要关闭 dropdown"
},
{
"kind": "method",
"name": "onWindowScroll",
"privacy": "private"
},
{
"kind": "method",
"name": "hasTrigger",
"privacy": "private",
"return": {
"type": {
"text": "boolean"
}
},
"parameters": [
{
"name": "trigger",
"type": {
"text": "'click' | 'hover' | 'focus' | 'contextmenu' | 'manual'"
}
}
]
},
{
"kind": "method",
"name": "onFocus",
"privacy": "private"
},
{
"kind": "method",
"name": "onClick",
"privacy": "private",
"parameters": [
{
"name": "e",
"type": {
"text": "MouseEvent"
}
}
]
},
{
"kind": "method",
"name": "onPanelClick",
"privacy": "private",
"parameters": [
{
"name": "e",
"type": {
"text": "MouseEvent"
}
}
]
},
{
"kind": "method",
"name": "onContextMenu",
"privacy": "private",
"parameters": [
{
"name": "e",
"type": {
"text": "MouseEvent"
}
}
]
},
{
"kind": "method",
"name": "onMouseEnter",
"privacy": "private"
},
{
"kind": "method",
"name": "onMouseLeave",
"privacy": "private"
},
{
"kind": "method",
"name": "updatePositioner",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
}
}
],
"events": [
{
"description": "下拉组件开始打开时，事件被触发。可以通过调用 `event.preventDefault()` 阻止下拉组件打开",
"name": "open"
},
{
"description": "下拉组件打开动画完成时，事件被触发",
"name": "opened"
},
{
"description": "下拉组件开始关闭时，事件被触发。可以通过调用 `event.preventDefault()` 阻止下拉组件关闭",
"name": "close"
},
{
"description": "下拉组件关闭动画完成时，事件被触发",
"name": "closed"
}
],
"attributes": [
{
"name": "open",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否打开下拉组件",
"fieldName": "open"
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否禁用下拉组件",
"fieldName": "disabled"
},
{
"name": "trigger",
"type": {
"text": "| /*点击触发*/ 'click'\n | /*鼠标悬浮触发*/ 'hover'\n | /*聚焦触发*/ 'focus'\n | /*鼠标右键点击、或触摸长按触发*/ 'contextmenu'\n | /*仅能通过编程方式打开和关闭下拉组件，不能再指定其他触发方式*/ 'manual'\n | string"
},
"default": "'click'",
"description": "下拉组件的触发方式，支持多个值，用空格分隔。可选值包括：\n\n* `click`：点击触发\n* `hover`：鼠标悬浮触发\n* `focus`：聚焦触发\n* `contextmenu`：鼠标右键点击、或触摸长按触发\n* `manual`：仅能通过编程方式打开和关闭下拉组件，不能再指定其他触发方式",
"fieldName": "trigger"
},
{
"name": "placement",
"type": {
"text": "| /*自动判断位置*/ 'auto'\n | /*上方左对齐*/ 'top-start'\n | /*上方居中*/ 'top'\n | /*上方右对齐*/ 'top-end'\n | /*下方左对齐*/ 'bottom-start'\n | /*下方居中*/ 'bottom'\n | /*下方右对齐*/ 'bottom-end'\n | /*左侧顶部对齐*/ 'left-start'\n | /*左侧居中*/ 'left'\n | /*左侧底部对齐*/ 'left-end'\n | /*右侧顶部对齐*/ 'right-start'\n | /*右侧居中*/ 'right'\n | /*右侧底部对齐*/ 'right-end'"
},
"default": "'auto'",
"description": "下拉组件内容的位置。可选值包括：\n\n* `auto`：自动判断位置\n* `top-start`：上方左对齐\n* `top`：上方居中\n* `top-end`：上方右对齐\n* `bottom-start`：下方左对齐\n* `bottom`：下方居中\n* `bottom-end`：下方右对齐\n* `left-start`：左侧顶部对齐\n* `left`：左侧居中\n* `left-end`：左侧底部对齐\n* `right-start`：右侧顶部对齐\n* `right`：右侧居中\n* `right-end`：右侧底部对齐",
"fieldName": "placement"
},
{
"name": "stay-open-on-click",
"type": {
"text": "boolean"
},
"default": "false",
"description": "点击 [`<mdui-menu-item>`](/docs/2/components/menu#menu-item-api) 后，下拉组件是否保持打开状态",
"fieldName": "stayOpenOnClick"
},
{
"name": "open-delay",
"type": {
"text": "number"
},
"default": "150",
"description": "鼠标悬浮触发下拉组件打开的延时，单位为毫秒",
"fieldName": "openDelay"
},
{
"name": "close-delay",
"type": {
"text": "number"
},
"default": "150",
"description": "鼠标悬浮触发下拉组件关闭的延时，单位为毫秒",
"fieldName": "closeDelay"
},
{
"name": "open-on-pointer",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在触发下拉组件的光标位置打开下拉组件，常用于打开鼠标右键菜单",
"fieldName": "openOnPointer"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "下拉组件\n\n```html\n<mdui-dropdown>\n..<mdui-button slot=\"trigger\">open dropdown</mdui-button>\n..<mdui-menu>\n....<mdui-menu-item>Item 1</mdui-menu-item>\n....<mdui-menu-item>Item 2</mdui-menu-item>\n..</mdui-menu>\n</mdui-dropdown>\n```",
"tagName": "mdui-dropdown",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Dropdown",
"declaration": {
"name": "Dropdown",
"module": "components/dropdown/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-dropdown",
"declaration": {
"name": "Dropdown",
"module": "components/dropdown/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/fab/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Fab",
"cssProperties": [
{
"description": "`size=\"small\"` 时，组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner-small"
},
{
"description": "`size=\"normal\"` 时，组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner-normal"
},
{
"description": "`size=\"large\"` 时，组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner-large"
}
],
"cssParts": [
{
"description": "内部的 `<button>` 或 `<a>` 元素",
"name": "button"
},
{
"description": "右侧的文本",
"name": "label"
},
{
"description": "左侧的图标",
"name": "icon"
},
{
"description": "加载中状态的 `<mdui-circular-progress>` 元素",
"name": "loading"
}
],
"slots": [
{
"description": "文本",
"name": ""
},
{
"description": "图标",
"name": "icon"
}
],
"members": [
{
"kind": "field",
"name": "variant",
"type": {
"text": "| /*使用 Primary container 背景色*/ 'primary'\n | /*使用 Surface container high 背景色*/ 'surface'\n | /*使用 Secondary container 背景色*/ 'secondary'\n | /*使用 Tertiary container 背景色*/ 'tertiary'"
},
"privacy": "public",
"default": "'primary'",
"description": "FAB 的形状，此组件的不同形状之间只有颜色不一样。可选值包括：\n\n* `primary`：使用 Primary container 背景色\n* `surface`：使用 Surface container high 背景色\n* `secondary`：使用 Secondary container 背景色\n* `tertiary`：使用 Tertiary container 背景色",
"attribute": "variant",
"reflects": true
},
{
"kind": "field",
"name": "size",
"type": {
"text": "| /*普通大小 FAB*/ 'normal'\n | /*小型 FAB*/ 'small'\n | /*大型 FAB*/ 'large'"
},
"privacy": "public",
"default": "'normal'",
"description": "FAB 的大小。可选值包括：\n* `normal`：普通大小 FAB\n* `small`：小型 FAB\n* `large`：大型 FAB",
"attribute": "size",
"reflects": true
},
{
"kind": "field",
"name": "icon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"attribute": "icon",
"reflects": true
},
{
"kind": "field",
"name": "extended",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否为展开状态",
"attribute": "extended",
"reflects": true
},
{
"kind": "field",
"name": "rippleRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController(this, 'icon')"
},
{
"kind": "field",
"name": "definedController",
"privacy": "private",
"readonly": true,
"default": "new DefinedController(this, { relatedElements: [''], })"
},
{
"kind": "field",
"name": "rippleElement",
"privacy": "protected",
"readonly": true
},
{
"kind": "method",
"name": "onExtendedChange",
"privacy": "private",
"description": "extended 变更时，设置动画"
},
{
"kind": "method",
"name": "renderLabel",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderIcon",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderInner",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult[]"
}
}
},
{
"kind": "field",
"name": "href",
"type": {
"text": "string"
},
"privacy": "public",
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"attribute": "href",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "download",
"type": {
"text": "string"
},
"privacy": "public",
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "download",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"privacy": "public",
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "target",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"privacy": "public",
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"attribute": "rel",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "renderAnchor",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n refDirective,\n tabIndex,\n }",
"type": {
"text": "RenderAnchorOptions"
}
}
],
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否禁用",
"attribute": "disabled",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "loading",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否处于加载中状态",
"attribute": "loading",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "name",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "按钮的名称，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"attribute": "name",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "按钮的初始值，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"attribute": "value",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "type",
"type": {
"text": "| /*此按钮将表单数据提交给服务器*/ 'submit'\n | /*此按钮重置所有组件为初始值*/ 'reset'\n | /*此按钮没有默认行为*/ 'button'"
},
"privacy": "public",
"default": "'button'",
"description": "按钮的类型。默认类型为 `button`。可选类型包括：\n\n* `submit`：点击按钮会提交表单数据到服务器\n* `reset`：点击按钮会将表单中的所有字段重置为初始值\n* `button`：此类型的按钮没有默认行为\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"attribute": "type",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "form",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"attribute": "form",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formAction",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "指定提交表单的 URL。\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `action` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formaction",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formEnctype",
"type": {
"text": "| /*未指定该属性时的默认值*/ 'application/x-www-form-urlencoded'\n | /*当表单包含 `<input type=\"file\">` 元素时使用*/ 'multipart/form-data'\n | /*HTML5 新增，用于调试*/ 'text/plain' | undefined"
},
"privacy": "public",
"description": "指定提交表单到服务器的内容类型。可选值包括：\n\n* `application/x-www-form-urlencoded`：未指定该属性时的默认值\n* `multipart/form-data`：当表单包含 `<input type=\"file\">` 元素时使用\n* `text/plain`：HTML5 新增，用于调试\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `enctype` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formenctype",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formMethod",
"type": {
"text": "| /*表单数据包含在表单内容中，发送到服务器*/ 'post'\n | /*表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法*/ 'get' | undefined"
},
"privacy": "public",
"description": "指定提交表单时使用的 HTTP 方法。可选值包括：\n\n* `post`：表单数据包含在表单内容中，发送到服务器\n* `get`：表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `method` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formmethod",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formNoValidate",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "如果设置了此属性，表单提交时将不执行表单验证。\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `novalidate` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formnovalidate",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formTarget",
"type": {
"text": "| /*默认选项，在当前框架中打开*/ '_self'\n | /*在新窗口中打开*/ '_blank'\n | /*在父框架中打开*/ '_parent'\n | /*在整个窗口中打开*/ '_top' | undefined"
},
"privacy": "public",
"description": "提交表单后接收到的响应应显示在何处。可选值包括：\n\n* `_self`：默认选项，在当前框架中打开\n* `_blank`：在新窗口中打开\n* `_parent`：在父框架中打开\n* `_top`：在整个窗口中打开\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `target` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formtarget",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formController",
"privacy": "private",
"readonly": true,
"default": "new FormController(this)",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "validity",
"type": {
"text": "ValidityState | undefined"
},
"privacy": "public",
"description": "表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "validationMessage",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "checkValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "reportValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。\n\n如果验证未通过，还会在组件上显示验证失败的提示。",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "setCustomValidity",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "message",
"type": {
"text": "string"
},
"description": "自定义的错误提示文本"
}
],
"description": "设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "renderLoading",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "renderButton",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n }",
"type": {
"text": "RenderButtonOptions"
}
}
],
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "isButton",
"privacy": "protected",
"return": {
"type": {
"text": "boolean"
}
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"description": "表单字段验证未通过时触发",
"name": "invalid"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
}
],
"attributes": [
{
"name": "variant",
"type": {
"text": "| /*使用 Primary container 背景色*/ 'primary'\n | /*使用 Surface container high 背景色*/ 'surface'\n | /*使用 Secondary container 背景色*/ 'secondary'\n | /*使用 Tertiary container 背景色*/ 'tertiary'"
},
"default": "'primary'",
"description": "FAB 的形状，此组件的不同形状之间只有颜色不一样。可选值包括：\n\n* `primary`：使用 Primary container 背景色\n* `surface`：使用 Surface container high 背景色\n* `secondary`：使用 Secondary container 背景色\n* `tertiary`：使用 Tertiary container 背景色",
"fieldName": "variant"
},
{
"name": "size",
"type": {
"text": "| /*普通大小 FAB*/ 'normal'\n | /*小型 FAB*/ 'small'\n | /*大型 FAB*/ 'large'"
},
"default": "'normal'",
"description": "FAB 的大小。可选值包括：\n* `normal`：普通大小 FAB\n* `small`：小型 FAB\n* `large`：大型 FAB",
"fieldName": "size"
},
{
"name": "icon",
"type": {
"text": "string | undefined"
},
"description": "Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"fieldName": "icon"
},
{
"name": "extended",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否为展开状态",
"fieldName": "extended"
},
{
"name": "href",
"type": {
"text": "string"
},
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"fieldName": "href",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "download",
"type": {
"text": "string"
},
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "download",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "target",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"fieldName": "rel",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否禁用",
"fieldName": "disabled",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "loading",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否处于加载中状态",
"fieldName": "loading",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "name",
"type": {
"text": "string"
},
"default": "''",
"description": "按钮的名称，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"fieldName": "name",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "value",
"type": {
"text": "string"
},
"default": "''",
"description": "按钮的初始值，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"fieldName": "value",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "type",
"type": {
"text": "| /*此按钮将表单数据提交给服务器*/ 'submit'\n | /*此按钮重置所有组件为初始值*/ 'reset'\n | /*此按钮没有默认行为*/ 'button'"
},
"default": "'button'",
"description": "按钮的类型。默认类型为 `button`。可选类型包括：\n\n* `submit`：点击按钮会提交表单数据到服务器\n* `reset`：点击按钮会将表单中的所有字段重置为初始值\n* `button`：此类型的按钮没有默认行为\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"fieldName": "type",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "form",
"type": {
"text": "string | undefined"
},
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"fieldName": "form",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formaction",
"type": {
"text": "string | undefined"
},
"description": "指定提交表单的 URL。\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `action` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formAction",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formenctype",
"type": {
"text": "| /*未指定该属性时的默认值*/ 'application/x-www-form-urlencoded'\n | /*当表单包含 `<input type=\"file\">` 元素时使用*/ 'multipart/form-data'\n | /*HTML5 新增，用于调试*/ 'text/plain' | undefined"
},
"description": "指定提交表单到服务器的内容类型。可选值包括：\n\n* `application/x-www-form-urlencoded`：未指定该属性时的默认值\n* `multipart/form-data`：当表单包含 `<input type=\"file\">` 元素时使用\n* `text/plain`：HTML5 新增，用于调试\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `enctype` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formEnctype",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formmethod",
"type": {
"text": "| /*表单数据包含在表单内容中，发送到服务器*/ 'post'\n | /*表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法*/ 'get' | undefined"
},
"description": "指定提交表单时使用的 HTTP 方法。可选值包括：\n\n* `post`：表单数据包含在表单内容中，发送到服务器\n* `get`：表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `method` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formMethod",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formnovalidate",
"type": {
"text": "boolean"
},
"default": "false",
"description": "如果设置了此属性，表单提交时将不执行表单验证。\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `novalidate` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formNoValidate",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formtarget",
"type": {
"text": "| /*默认选项，在当前框架中打开*/ '_self'\n | /*在新窗口中打开*/ '_blank'\n | /*在父框架中打开*/ '_parent'\n | /*在整个窗口中打开*/ '_top' | undefined"
},
"description": "提交表单后接收到的响应应显示在何处。可选值包括：\n\n* `_self`：默认选项，在当前框架中打开\n* `_blank`：在新窗口中打开\n* `_parent`：在父框架中打开\n* `_top`：在整个窗口中打开\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `target` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formTarget",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
}
],
"superclass": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
},
"summary": "浮动操作按钮组件\n\n```html\n<mdui-fab icon=\"edit\"></mdui-fab>\n```",
"tagName": "mdui-fab",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Fab",
"declaration": {
"name": "Fab",
"module": "components/fab/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-fab",
"declaration": {
"name": "Fab",
"module": "components/fab/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/icon/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Icon",
"slots": [
{
"description": "`svg` 图标的内容",
"name": ""
}
],
"members": [
{
"kind": "field",
"name": "name",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "Material Icons 图标名",
"attribute": "name",
"reflects": true
},
{
"kind": "field",
"name": "src",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "svg 图标的路径",
"attribute": "src",
"reflects": true
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController(this, '[default]')"
}
],
"attributes": [
{
"name": "name",
"type": {
"text": "string | undefined"
},
"description": "Material Icons 图标名",
"fieldName": "name"
},
{
"name": "src",
"type": {
"text": "string | undefined"
},
"description": "svg 图标的路径",
"fieldName": "src"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "图标组件\n\n```html\n<mdui-icon name=\"search\"></mdui-icon>\n```",
"tagName": "mdui-icon",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Icon",
"declaration": {
"name": "Icon",
"module": "components/icon/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-icon",
"declaration": {
"name": "Icon",
"module": "components/icon/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/layout/helper.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "LayoutManager",
"members": [
{
"kind": "field",
"name": "$main",
"type": {
"text": "JQ<LayoutMain> | undefined"
},
"privacy": "private"
},
{
"kind": "field",
"name": "states",
"type": {
"text": "LayoutItemState[]"
},
"privacy": "private",
"default": "[]"
},
{
"kind": "field",
"name": "items",
"type": {
"text": "LayoutItemBase[] | undefined"
},
"privacy": "private"
},
{
"kind": "method",
"name": "registerMain",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "element",
"type": {
"text": "LayoutMain"
}
}
],
"description": "注册 `<mdui-layout-main>`"
},
{
"kind": "method",
"name": "unregisterMain",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "取消注册 `<mdui-layout-main>`"
},
{
"kind": "method",
"name": "registerItem",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "element",
"type": {
"text": "LayoutItemBase"
}
}
],
"description": "注册新的 `<mdui-layout-item>`"
},
{
"kind": "method",
"name": "unregisterItem",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "element",
"type": {
"text": "LayoutItemBase"
}
}
],
"description": "取消注册 `<mdui-layout-item>`"
},
{
"kind": "method",
"name": "getItems",
"privacy": "public",
"return": {
"type": {
"text": "LayoutItemBase[]"
}
},
"description": "获取所有 `<mdui-layout-item>` 元素（按在 DOM 中的顺序）"
},
{
"kind": "method",
"name": "getMain",
"privacy": "public",
"return": {
"type": {
"text": "LayoutMain | undefined"
}
},
"description": "获取 `<mdui-layout-main>` 元素"
},
{
"kind": "method",
"name": "getItemsAndMain",
"privacy": "public",
"return": {
"type": {
"text": "(LayoutItemBase | LayoutMain)[]"
}
},
"description": "获取 `<mdui-layout-item>` 及 `<mdui-layout-main>` 元素"
},
{
"kind": "method",
"name": "updateOrder",
"privacy": "public",
"description": "更新 `order` 值，更新完后重新计算布局"
},
{
"kind": "method",
"name": "updateLayout",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "element",
"optional": true,
"type": {
"text": "LayoutItemBase"
},
"description": "从哪一个元素开始更新；若未传入参数，则将更新所有元素"
},
{
"name": "size",
"optional": true,
"type": {
"text": "{ width?: number; height?: number }"
},
"description": "此次更新中，元素的宽高（仅在此次更新中使用）。若不传则自动计算"
}
],
"description": "重新计算布局"
},
{
"kind": "method",
"name": "resort",
"privacy": "private",
"description": "按 order 排序，order 相同时，按在 DOM 中的顺序排序"
},
{
"kind": "method",
"name": "isNoWidth",
"privacy": "private",
"parameters": [
{
"name": "state",
"type": {
"text": "LayoutItemState"
}
}
],
"description": "组件宽度是否为 0\nmdui-navigation-drawer 较为特殊，在为模态化时，占据的宽度为 0"
}
]
},
{
"kind": "function",
"name": "getLayout",
"return": {
"type": {
"text": "LayoutManager"
}
},
"parameters": [
{
"name": "element",
"type": {
"text": "Layout"
}
}
],
"description": "获取 layout 实例"
}
],
"exports": [
{
"kind": "js",
"name": "LayoutManager",
"declaration": {
"name": "LayoutManager",
"module": "components/layout/helper.js"
}
},
{
"kind": "js",
"name": "getLayout",
"declaration": {
"name": "getLayout",
"module": "components/layout/helper.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/layout/layout-item-base.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "LayoutItemBase",
"members": [
{
"kind": "field",
"name": "order",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "该组件在 [`<mdui-layout>`](/docs/2/components/layout) 中的布局顺序，按从小到大排序。默认为 `0`",
"attribute": "order",
"reflects": true
},
{
"kind": "field",
"name": "layoutManager",
"type": {
"text": "LayoutManager | undefined"
},
"privacy": "protected"
},
{
"kind": "field",
"name": "isParentLayout",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false"
},
{
"kind": "field",
"name": "layoutPlacement",
"type": {
"text": "LayoutPlacement"
},
"privacy": "protected",
"description": "当前布局组件所处的位置，父类必须实现该 getter",
"readonly": true
},
{
"kind": "method",
"name": "onOrderChange",
"privacy": "private"
}
],
"attributes": [
{
"name": "order",
"type": {
"text": "number | undefined"
},
"description": "该组件在 [`<mdui-layout>`](/docs/2/components/layout) 中的布局顺序，按从小到大排序。默认为 `0`",
"fieldName": "order"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
}
}
],
"exports": [
{
"kind": "js",
"name": "LayoutItemBase",
"declaration": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/layout/layout-item.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "LayoutItem",
"slots": [
{
"description": "可以包含任意内容",
"name": ""
}
],
"members": [
{
"kind": "field",
"name": "placement",
"type": {
"text": "| /*上方*/ 'top'\n | /*下方*/ 'bottom'\n | /*左侧*/ 'left'\n | /*右侧*/ 'right'"
},
"privacy": "public",
"default": "'top'",
"description": "组件的位置。可选值包括：\n\n* `top`：上方\n* `bottom`：下方\n* `left`：左侧\n* `right`：右侧",
"attribute": "placement",
"reflects": true
},
{
"kind": "field",
"name": "layoutPlacement",
"type": {
"text": "LayoutPlacement"
},
"privacy": "protected",
"description": "当前布局组件所处的位置，父类必须实现该 getter",
"readonly": true,
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "method",
"name": "onPlacementChange",
"privacy": "private"
},
{
"kind": "field",
"name": "order",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "该组件在 [`<mdui-layout>`](/docs/2/components/layout) 中的布局顺序，按从小到大排序。默认为 `0`",
"attribute": "order",
"reflects": true,
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "field",
"name": "layoutManager",
"type": {
"text": "LayoutManager | undefined"
},
"privacy": "protected",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "field",
"name": "isParentLayout",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "method",
"name": "onOrderChange",
"privacy": "private",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
}
],
"attributes": [
{
"name": "placement",
"type": {
"text": "| /*上方*/ 'top'\n | /*下方*/ 'bottom'\n | /*左侧*/ 'left'\n | /*右侧*/ 'right'"
},
"default": "'top'",
"description": "组件的位置。可选值包括：\n\n* `top`：上方\n* `bottom`：下方\n* `left`：左侧\n* `right`：右侧",
"fieldName": "placement"
},
{
"name": "order",
"type": {
"text": "number | undefined"
},
"description": "该组件在 [`<mdui-layout>`](/docs/2/components/layout) 中的布局顺序，按从小到大排序。默认为 `0`",
"fieldName": "order",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
}
],
"superclass": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
},
"summary": "布局项组件\n\n```html\n<mdui-layout>\n..<mdui-layout-item></mdui-layout-item>\n..<mdui-layout-item></mdui-layout-item>\n..<mdui-layout-main></mdui-layout-main>\n</mdui-layout>\n```",
"tagName": "mdui-layout-item",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "LayoutItem",
"declaration": {
"name": "LayoutItem",
"module": "components/layout/layout-item.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-layout-item",
"declaration": {
"name": "LayoutItem",
"module": "components/layout/layout-item.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/layout/layout-main.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "LayoutMain",
"slots": [
{
"description": "可以包含任意内容",
"name": ""
}
],
"members": [
{
"kind": "field",
"name": "layoutManager",
"type": {
"text": "LayoutManager | undefined"
},
"privacy": "private"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "布局主体内容组件\n\n```html\n<mdui-layout>\n..<mdui-layout-item></mdui-layout-item>\n..<mdui-layout-item></mdui-layout-item>\n..<mdui-layout-main></mdui-layout-main>\n</mdui-layout>\n```",
"tagName": "mdui-layout-main",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "LayoutMain",
"declaration": {
"name": "LayoutMain",
"module": "components/layout/layout-main.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-layout-main",
"declaration": {
"name": "LayoutMain",
"module": "components/layout/layout-main.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/layout/layout.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Layout",
"slots": [
{
"description": "可以包含 [`<mdui-top-app-bar>`](/docs/2/components/top-app-bar)、[`<mdui-bottom-app-bar>`](/docs/2/components/bottom-app-bar)、[`<mdui-navigation-bar>`](/docs/2/components/navigation-bar)、[`<mdui-navigation-drawer>`](/docs/2/components/navigation-drawer)、[`<mdui-navigation-rail>`](/docs/2/components/navigation-rail)、`<mdui-layout-item>`、`<mdui-layout-main>` 元素",
"name": ""
}
],
"members": [
{
"kind": "field",
"name": "fullHeight",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "设置当前布局的高度为 100%",
"attribute": "full-height",
"reflects": true
}
],
"attributes": [
{
"name": "full-height",
"type": {
"text": "boolean"
},
"default": "false",
"description": "设置当前布局的高度为 100%",
"fieldName": "fullHeight"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "布局组件\n\n```html\n<mdui-layout>\n..<mdui-layout-item></mdui-layout-item>\n..<mdui-layout-item></mdui-layout-item>\n..<mdui-layout-main></mdui-layout-main>\n</mdui-layout>\n```",
"tagName": "mdui-layout",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Layout",
"declaration": {
"name": "Layout",
"module": "components/layout/layout.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-layout",
"declaration": {
"name": "Layout",
"module": "components/layout/layout.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/linear-progress/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "LinearProgress",
"cssProperties": [
{
"description": "组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
}
],
"cssParts": [
{
"description": "指示器部分",
"name": "indicator"
}
],
"members": [
{
"kind": "field",
"name": "max",
"type": {
"text": "number"
},
"privacy": "public",
"default": "1",
"description": "进度指示器的最大值。默认为 `1`",
"attribute": "max",
"reflects": true
},
{
"kind": "field",
"name": "value",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "进度指示器的当前值。如果未指定该值，则处于不确定状态",
"attribute": "value"
}
],
"attributes": [
{
"name": "max",
"type": {
"text": "number"
},
"default": "1",
"description": "进度指示器的最大值。默认为 `1`",
"fieldName": "max"
},
{
"name": "value",
"type": {
"text": "number | undefined"
},
"description": "进度指示器的当前值。如果未指定该值，则处于不确定状态",
"fieldName": "value"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "线性进度指示器组件\n\n```html\n<mdui-linear-progress></mdui-linear-progress>\n```",
"tagName": "mdui-linear-progress",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "LinearProgress",
"declaration": {
"name": "LinearProgress",
"module": "components/linear-progress/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-linear-progress",
"declaration": {
"name": "LinearProgress",
"module": "components/linear-progress/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/list/list-item.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "ListItem",
"cssProperties": [
{
"description": "列表项的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
},
{
"description": "指定了 `rounded` 属性时，列表项的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner-rounded"
}
],
"cssParts": [
{
"description": "列表项容器",
"name": "container"
},
{
"description": "左侧图标",
"name": "icon"
},
{
"description": "右侧图标",
"name": "end-icon"
},
{
"description": "中间部分",
"name": "body"
},
{
"description": "主标题",
"name": "headline"
},
{
"description": "副标题",
"name": "description"
}
],
"slots": [
{
"description": "主文本",
"name": ""
},
{
"description": "副文本",
"name": "description"
},
{
"description": "列表项左侧的元素",
"name": "icon"
},
{
"description": "列表项右侧的元素",
"name": "end-icon"
},
{
"description": "任意自定义内容",
"name": "custom"
}
],
"members": [
{
"kind": "field",
"name": "headline",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "主文本。也可以通过 default slot 设置",
"attribute": "headline",
"reflects": true
},
{
"kind": "field",
"name": "headlineLine",
"type": {
"text": "| /*显示单行，超出后截断*/ 1\n | /*显示两行，超出后截断*/ 2\n | /*显示三行，超出后截断*/ 3 | undefined"
},
"privacy": "public",
"description": "主文本行数，超过限制后将截断显示。默认无行数限制。可选值包括：\n\n* `1`：显示单行，超出后截断\n* `2`：显示两行，超出后截断\n* `3`：显示三行，超出后截断",
"attribute": "headline-line",
"reflects": true
},
{
"kind": "field",
"name": "description",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "副文本。也可以通过 `slot=\"description\"` 设置",
"attribute": "description",
"reflects": true
},
{
"kind": "field",
"name": "descriptionLine",
"type": {
"text": "| /*显示单行，超出后截断*/ 1\n | /*显示两行，超出后截断*/ 2\n | /*显示三行，超出后截断*/ 3 | undefined"
},
"privacy": "public",
"description": "副文本行数，超过限制后将截断显示。默认无行数限制。可选值包括：\n\n* `1`：显示单行，超出后截断\n* `2`：显示两行，超出后截断\n* `3`：显示三行，超出后截断",
"attribute": "description-line",
"reflects": true
},
{
"kind": "field",
"name": "icon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "左侧的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"attribute": "icon",
"reflects": true
},
{
"kind": "field",
"name": "endIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "右侧的 Material Icons 图标名。也可以通过 `slot=\"end-icon\"` 设置",
"attribute": "end-icon",
"reflects": true
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否禁用该列表项，禁用后，列表项将变为灰色，且其中的 [`<mdui-checkbox>`](/docs/2/components/checkbox)、[`<mdui-radio>`](/docs/2/components/radio)、[`<mdui-switch>`](/docs/2/components/switch) 等也将禁用",
"attribute": "disabled",
"reflects": true
},
{
"kind": "field",
"name": "active",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否激活该列表项",
"attribute": "active",
"reflects": true
},
{
"kind": "field",
"name": "nonclickable",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否使列表项不可点击。设置后，列表项中的 [`<mdui-checkbox>`](/docs/2/components/checkbox)、[`<mdui-radio>`](/docs/2/components/radio)、[`<mdui-switch>`](/docs/2/components/switch) 等仍可交互",
"attribute": "nonclickable",
"reflects": true
},
{
"kind": "field",
"name": "rounded",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否使用圆角形状的列表项",
"attribute": "rounded",
"reflects": true
},
{
"kind": "field",
"name": "alignment",
"type": {
"text": "| /*顶部对齐*/ 'start'\n | /*居中对齐*/ 'center'\n | /*底部对齐*/ 'end'"
},
"privacy": "public",
"default": "'center'",
"description": "列表项的垂直对齐方式。可选值包括：\n\n* `start`：顶部对齐\n* `center`：居中对齐\n* `end`：底部对齐",
"attribute": "alignment",
"reflects": true
},
{
"kind": "field",
"name": "iconElements",
"type": {
"text": "HTMLElement[]"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "endIconElements",
"type": {
"text": "HTMLElement[]"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "rippleRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "itemRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController( this, '[default]', 'description', 'icon', 'end-icon', 'custom', )"
},
{
"kind": "field",
"name": "rippleElement",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "renderInner",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "field",
"name": "href",
"type": {
"text": "string"
},
"privacy": "public",
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"attribute": "href",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "download",
"type": {
"text": "string"
},
"privacy": "public",
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "download",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"privacy": "public",
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "target",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"privacy": "public",
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"attribute": "rel",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "method",
"name": "renderAnchor",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n refDirective,\n tabIndex,\n }",
"type": {
"text": "RenderAnchorOptions"
}
}
],
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"attributes": [
{
"name": "headline",
"type": {
"text": "string | undefined"
},
"description": "主文本。也可以通过 default slot 设置",
"fieldName": "headline"
},
{
"name": "headline-line",
"type": {
"text": "| /*显示单行，超出后截断*/ 1\n | /*显示两行，超出后截断*/ 2\n | /*显示三行，超出后截断*/ 3 | undefined"
},
"description": "主文本行数，超过限制后将截断显示。默认无行数限制。可选值包括：\n\n* `1`：显示单行，超出后截断\n* `2`：显示两行，超出后截断\n* `3`：显示三行，超出后截断",
"fieldName": "headlineLine"
},
{
"name": "description",
"type": {
"text": "string | undefined"
},
"description": "副文本。也可以通过 `slot=\"description\"` 设置",
"fieldName": "description"
},
{
"name": "description-line",
"type": {
"text": "| /*显示单行，超出后截断*/ 1\n | /*显示两行，超出后截断*/ 2\n | /*显示三行，超出后截断*/ 3 | undefined"
},
"description": "副文本行数，超过限制后将截断显示。默认无行数限制。可选值包括：\n\n* `1`：显示单行，超出后截断\n* `2`：显示两行，超出后截断\n* `3`：显示三行，超出后截断",
"fieldName": "descriptionLine"
},
{
"name": "icon",
"type": {
"text": "string | undefined"
},
"description": "左侧的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"fieldName": "icon"
},
{
"name": "end-icon",
"type": {
"text": "string | undefined"
},
"description": "右侧的 Material Icons 图标名。也可以通过 `slot=\"end-icon\"` 设置",
"fieldName": "endIcon"
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否禁用该列表项，禁用后，列表项将变为灰色，且其中的 [`<mdui-checkbox>`](/docs/2/components/checkbox)、[`<mdui-radio>`](/docs/2/components/radio)、[`<mdui-switch>`](/docs/2/components/switch) 等也将禁用",
"fieldName": "disabled"
},
{
"name": "active",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否激活该列表项",
"fieldName": "active"
},
{
"name": "nonclickable",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否使列表项不可点击。设置后，列表项中的 [`<mdui-checkbox>`](/docs/2/components/checkbox)、[`<mdui-radio>`](/docs/2/components/radio)、[`<mdui-switch>`](/docs/2/components/switch) 等仍可交互",
"fieldName": "nonclickable"
},
{
"name": "rounded",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否使用圆角形状的列表项",
"fieldName": "rounded"
},
{
"name": "alignment",
"type": {
"text": "| /*顶部对齐*/ 'start'\n | /*居中对齐*/ 'center'\n | /*底部对齐*/ 'end'"
},
"default": "'center'",
"description": "列表项的垂直对齐方式。可选值包括：\n\n* `start`：顶部对齐\n* `center`：居中对齐\n* `end`：底部对齐",
"fieldName": "alignment"
},
{
"name": "href",
"type": {
"text": "string"
},
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"fieldName": "href",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "download",
"type": {
"text": "string"
},
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "download",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "target",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"fieldName": "rel",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"mixins": [
{
"name": "AnchorMixin",
"package": "@mdui/shared/mixins/anchor.js"
},
{
"name": "RippleMixin",
"module": "components/ripple/ripple-mixin.js"
},
{
"name": "FocusableMixin",
"package": "@mdui/shared/mixins/focusable.js"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "列表项组件。需配合 `<mdui-list>` 组件使用\n\n```html\n<mdui-list>\n..<mdui-list-subheader>Subheader</mdui-list-subheader>\n..<mdui-list-item>Item 1</mdui-list-item>\n..<mdui-list-item>Item 2</mdui-list-item>\n</mdui-list>\n```",
"tagName": "mdui-list-item",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "ListItem",
"declaration": {
"name": "ListItem",
"module": "components/list/list-item.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-list-item",
"declaration": {
"name": "ListItem",
"module": "components/list/list-item.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/list/list-subheader.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "ListSubheader",
"slots": [
{
"description": "列表标题文本",
"name": ""
}
],
"members": [],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "列表标题组件。需配合 `<mdui-list>` 组件使用\n\n```html\n<mdui-list>\n..<mdui-list-subheader>Subheader</mdui-list-subheader>\n..<mdui-list-item>Item 1</mdui-list-item>\n..<mdui-list-item>Item 2</mdui-list-item>\n</mdui-list>\n```",
"tagName": "mdui-list-subheader",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "ListSubheader",
"declaration": {
"name": "ListSubheader",
"module": "components/list/list-subheader.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-list-subheader",
"declaration": {
"name": "ListSubheader",
"module": "components/list/list-subheader.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/list/list.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "List",
"slots": [
{
"description": "`<mdui-list-item>` 元素",
"name": ""
}
],
"members": [],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "列表组件。需配合 `<mdui-list-item>` 组件使用\n\n```html\n<mdui-list>\n..<mdui-list-subheader>Subheader</mdui-list-subheader>\n..<mdui-list-item>Item 1</mdui-list-item>\n..<mdui-list-item>Item 2</mdui-list-item>\n</mdui-list>\n```",
"tagName": "mdui-list",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "List",
"declaration": {
"name": "List",
"module": "components/list/list.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-list",
"declaration": {
"name": "List",
"module": "components/list/list.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/menu/menu-item.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "MenuItem",
"cssParts": [
{
"description": "菜单项的容器",
"name": "container"
},
{
"description": "左侧的图标",
"name": "icon"
},
{
"description": "文本内容",
"name": "label"
},
{
"description": "右侧的图标",
"name": "end-icon"
},
{
"description": "右侧的文本",
"name": "end-text"
},
{
"description": "选中状态的图标",
"name": "selected-icon"
},
{
"description": "子菜单元素",
"name": "submenu"
}
],
"slots": [
{
"description": "菜单项的文本",
"name": ""
},
{
"description": "菜单项左侧图标",
"name": "icon"
},
{
"description": "菜单项右侧图标",
"name": "end-icon"
},
{
"description": "菜单右侧的文本",
"name": "end-text"
},
{
"description": "选中状态的图标",
"name": "selected-icon"
},
{
"description": "子菜单",
"name": "submenu"
},
{
"description": "任意自定义内容",
"name": "custom"
}
],
"members": [
{
"kind": "field",
"name": "value",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "菜单项的值",
"attribute": "value",
"reflects": true
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否禁用菜单项",
"attribute": "disabled",
"reflects": true
},
{
"kind": "field",
"name": "icon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "左侧的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置\n\n如果左侧不需要显示图标，但需要预留一个图标的位置，可传入空字符串进行占位",
"attribute": "icon",
"reflects": true
},
{
"kind": "field",
"name": "endIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "右侧的 Material Icons 图标名。也可以通过 `slot=\"end-icon\"` 设置",
"attribute": "end-icon",
"reflects": true
},
{
"kind": "field",
"name": "endText",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "右侧的文本。也可以通过 `slot=\"end-text\"` 设置",
"attribute": "end-text",
"reflects": true
},
{
"kind": "field",
"name": "selectedIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "选中状态的 Material Icons 图标名。也可以通过 `slot=\"selected-icon\"` 设置",
"attribute": "selected-icon",
"reflects": true
},
{
"kind": "field",
"name": "submenuOpen",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否打开子菜单",
"attribute": "submenu-open",
"reflects": true
},
{
"kind": "field",
"name": "selected",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"attribute": "selected",
"reflects": true
},
{
"kind": "field",
"name": "dense",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false"
},
{
"kind": "field",
"name": "selects",
"type": {
"text": "'single' | 'multiple' | undefined"
},
"privacy": "protected"
},
{
"kind": "field",
"name": "submenuTrigger",
"type": {
"text": "string | undefined"
},
"privacy": "protected"
},
{
"kind": "field",
"name": "submenuOpenDelay",
"type": {
"text": "number | undefined"
},
"privacy": "protected"
},
{
"kind": "field",
"name": "submenuCloseDelay",
"type": {
"text": "number | undefined"
},
"privacy": "protected"
},
{
"kind": "field",
"name": "focusable",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false"
},
{
"kind": "field",
"name": "key",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "submenuOpenTimeout",
"type": {
"text": "number"
},
"privacy": "private"
},
{
"kind": "field",
"name": "submenuCloseTimeout",
"type": {
"text": "number"
},
"privacy": "private"
},
{
"kind": "field",
"name": "rippleRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "containerRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "submenuRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController( this, '[default]', 'icon', 'end-icon', 'end-text', 'submenu', 'custom', )"
},
{
"kind": "field",
"name": "definedController",
"privacy": "private",
"readonly": true,
"default": "new DefinedController(this, { relatedElements: [''], })"
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "rippleElement",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "hasSubmenu",
"type": {
"text": "boolean"
},
"privacy": "private",
"readonly": true
},
{
"kind": "method",
"name": "onOpenChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onOuterClick",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "Event"
}
}
],
"description": "点击子菜单外面的区域，关闭子菜单"
},
{
"kind": "method",
"name": "hasTrigger",
"privacy": "private",
"return": {
"type": {
"text": "boolean"
}
},
"parameters": [
{
"name": "trigger",
"type": {
"text": "string"
}
}
]
},
{
"kind": "method",
"name": "onFocus",
"privacy": "private"
},
{
"kind": "method",
"name": "onBlur",
"privacy": "private"
},
{
"kind": "method",
"name": "onClick",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "MouseEvent"
}
}
]
},
{
"kind": "method",
"name": "onKeydown",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "KeyboardEvent"
}
}
]
},
{
"kind": "method",
"name": "onMouseEnter",
"privacy": "private"
},
{
"kind": "method",
"name": "onMouseLeave",
"privacy": "private"
},
{
"kind": "method",
"name": "updateSubmenuPositioner",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
}
},
{
"kind": "method",
"name": "renderInner",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "useDefaultEndIcon",
"type": {
"text": "boolean"
}
},
{
"name": "hasIcon",
"type": {
"text": "boolean"
}
}
]
},
{
"kind": "field",
"name": "href",
"type": {
"text": "string"
},
"privacy": "public",
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"attribute": "href",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "download",
"type": {
"text": "string"
},
"privacy": "public",
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "download",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"privacy": "public",
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "target",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"privacy": "public",
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"attribute": "rel",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "method",
"name": "renderAnchor",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n refDirective,\n tabIndex,\n }",
"type": {
"text": "RenderAnchorOptions"
}
}
],
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"description": "子菜单开始打开时，事件被触发。可以通过调用 `event.preventDefault()` 阻止子菜单打开",
"name": "submenu-open"
},
{
"description": "子菜单打开动画完成时，事件被触发",
"name": "submenu-opened"
},
{
"description": "子菜单开始关闭时，事件被触发。可以通过调用 `event.preventDefault()` 阻止子菜单关闭",
"name": "submenu-close"
},
{
"description": "子菜单关闭动画完成时，事件被触发",
"name": "submenu-closed"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"attributes": [
{
"name": "value",
"type": {
"text": "string | undefined"
},
"description": "菜单项的值",
"fieldName": "value"
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否禁用菜单项",
"fieldName": "disabled"
},
{
"name": "icon",
"type": {
"text": "string | undefined"
},
"description": "左侧的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置\n\n如果左侧不需要显示图标，但需要预留一个图标的位置，可传入空字符串进行占位",
"fieldName": "icon"
},
{
"name": "end-icon",
"type": {
"text": "string | undefined"
},
"description": "右侧的 Material Icons 图标名。也可以通过 `slot=\"end-icon\"` 设置",
"fieldName": "endIcon"
},
{
"name": "end-text",
"type": {
"text": "string | undefined"
},
"description": "右侧的文本。也可以通过 `slot=\"end-text\"` 设置",
"fieldName": "endText"
},
{
"name": "selected-icon",
"type": {
"text": "string | undefined"
},
"description": "选中状态的 Material Icons 图标名。也可以通过 `slot=\"selected-icon\"` 设置",
"fieldName": "selectedIcon"
},
{
"name": "submenu-open",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否打开子菜单",
"fieldName": "submenuOpen"
},
{
"name": "selected",
"type": {
"text": "boolean"
},
"default": "false",
"fieldName": "selected"
},
{
"name": "href",
"type": {
"text": "string"
},
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"fieldName": "href",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "download",
"type": {
"text": "string"
},
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "download",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "target",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"fieldName": "rel",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"mixins": [
{
"name": "AnchorMixin",
"package": "@mdui/shared/mixins/anchor.js"
},
{
"name": "RippleMixin",
"module": "components/ripple/ripple-mixin.js"
},
{
"name": "FocusableMixin",
"package": "@mdui/shared/mixins/focusable.js"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "菜单项组件。需配合 `<mdui-menu>` 组件使用\n\n```html\n<mdui-menu>\n..<mdui-menu-item>Item 1</mdui-menu-item>\n..<mdui-menu-item>Item 2</mdui-menu-item>\n</mdui-menu>\n```",
"tagName": "mdui-menu-item",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "MenuItem",
"declaration": {
"name": "MenuItem",
"module": "components/menu/menu-item.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-menu-item",
"declaration": {
"name": "MenuItem",
"module": "components/menu/menu-item.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/menu/menu.js",
"declarations": [
{
"kind": "class",
"description": "键盘快捷键：\n* `Arrow Up` / `Arrow Down` - 使焦点在 `<mdui-menu-item>` 之间向上/向下切换\n* `Home` / `End` - 使焦点跳转到第一个/最后一个 `<mdui-menu-item>` 元素上\n* `Space` - 可选中时，选中/取消选中一项\n* `Enter` - 包含子菜单时，打开子菜单；为链接时，跳转链接\n* `Escape` - 子菜单已打开时，关闭子菜单",
"name": "Menu",
"cssProperties": [
{
"description": "组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
}
],
"slots": [
{
"description": "子菜单项（`<mdui-menu-item>`）、分割线（[`<mdui-divider>`](/docs/2/components/divider)）等元素",
"name": ""
}
],
"members": [
{
"kind": "field",
"name": "selects",
"type": {
"text": "| /*单选*/ 'single'\n | /*多选*/ 'multiple' | undefined"
},
"privacy": "public",
"description": "菜单项的可选状态。默认不可选。可选值包括：\n\n* `single`：单选\n* `multiple`：多选",
"attribute": "selects",
"reflects": true
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string | string[] | undefined"
},
"privacy": "public",
"description": "当前选中的 `<mdui-menu-item>` 的值。\n\n**Note**：该属性的 HTML 属性始终为字符串，仅在 `selects=\"single\"` 时可通过 HTML 属性设置初始值；该属性的 JavaScript 属性值在 `selects=\"single\"` 时为字符串，在 `selects=\"multiple\"` 时为字符串数组。因此，在 `selects=\"multiple\"` 时，若要修改该值，只能通过修改 JavaScript 属性值实现。",
"attribute": "value"
},
{
"kind": "field",
"name": "dense",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "菜单项是否使用紧凑布局",
"attribute": "dense",
"reflects": true
},
{
"kind": "field",
"name": "submenuTrigger",
"type": {
"text": "| /*点击菜单项时打开子菜单*/ 'click'\n | /*鼠标悬浮到菜单项上时打开子菜单*/ 'hover'\n | /*聚焦到菜单项上时打开子菜单*/ 'focus'\n | /*仅能通过编程方式打开和关闭子菜单，不能再指定其他触发方式*/ 'manual'\n | string"
},
"privacy": "public",
"default": "'click hover'",
"description": "子菜单的触发方式，支持多个值，用空格分隔。可选值包括：\n\n* `click`：点击菜单项时打开子菜单\n* `hover`：鼠标悬浮到菜单项上时打开子菜单\n* `focus`：聚焦到菜单项上时打开子菜单\n* `manual`：仅能通过编程方式打开和关闭子菜单，不能再指定其他触发方式",
"attribute": "submenu-trigger",
"reflects": true
},
{
"kind": "field",
"name": "submenuOpenDelay",
"type": {
"text": "number"
},
"privacy": "public",
"default": "200",
"description": "鼠标悬浮触发子菜单打开的延时，单位毫秒",
"attribute": "submenu-open-delay",
"reflects": true
},
{
"kind": "field",
"name": "submenuCloseDelay",
"type": {
"text": "number"
},
"privacy": "public",
"default": "200",
"description": "鼠标悬浮触发子菜单关闭的延时，单位毫秒",
"attribute": "submenu-close-delay",
"reflects": true
},
{
"kind": "field",
"name": "selectedKeys",
"type": {
"text": "number[]"
},
"privacy": "private",
"default": "[]"
},
{
"kind": "field",
"name": "childrenItems",
"type": {
"text": "MenuItem[]"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "isInitial",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "true"
},
{
"kind": "field",
"name": "lastActiveItems",
"type": {
"text": "MenuItem[]"
},
"privacy": "private",
"default": "[]"
},
{
"kind": "field",
"name": "definedController",
"privacy": "private",
"readonly": true,
"default": "new DefinedController(this, { relatedElements: ['mdui-menu-item'], })"
},
{
"kind": "field",
"name": "items",
"type": {
"text": "MenuItem[]"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "itemsEnabled",
"type": {
"text": "MenuItem[]"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "isSingle",
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "isMultiple",
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "isSelectable",
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "isSubmenu",
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "lastActiveItem",
"privacy": "private"
},
{
"kind": "method",
"name": "onSlotChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onSelectsChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onSelectedKeysChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onValueChange",
"privacy": "private"
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置在当前元素上"
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "从当前元素中移除焦点"
},
{
"kind": "method",
"name": "setSelectedKeys",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "selectedKeys",
"type": {
"text": "number[]"
}
}
]
},
{
"kind": "method",
"name": "setValue",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "value",
"type": {
"text": "string | string[] | undefined"
}
}
]
},
{
"kind": "method",
"name": "getSiblingsItems",
"privacy": "private",
"return": {
"type": {
"text": "MenuItem[]"
}
},
"parameters": [
{
"name": "item",
"type": {
"text": "MenuItem"
}
},
{
"name": "onlyEnabled",
"default": "false"
}
]
},
{
"kind": "method",
"name": "updateFocusable",
"privacy": "private"
},
{
"kind": "method",
"name": "updateSelected",
"privacy": "private"
},
{
"kind": "method",
"name": "selectOne",
"privacy": "private",
"parameters": [
{
"name": "item",
"type": {
"text": "MenuItem"
}
}
]
},
{
"kind": "method",
"name": "focusableOne",
"privacy": "private",
"parameters": [
{
"name": "item",
"type": {
"text": "MenuItem"
}
}
]
},
{
"kind": "method",
"name": "focusOne",
"privacy": "private",
"parameters": [
{
"name": "item",
"type": {
"text": "MenuItem"
}
},
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
]
},
{
"kind": "method",
"name": "onClick",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "MouseEvent"
}
}
]
},
{
"kind": "method",
"name": "onKeyDown",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "KeyboardEvent"
}
}
]
}
],
"events": [
{
"description": "菜单项选中状态变化时触发",
"name": "change"
}
],
"attributes": [
{
"name": "selects",
"type": {
"text": "| /*单选*/ 'single'\n | /*多选*/ 'multiple' | undefined"
},
"description": "菜单项的可选状态。默认不可选。可选值包括：\n\n* `single`：单选\n* `multiple`：多选",
"fieldName": "selects"
},
{
"name": "value",
"type": {
"text": "string | string[] | undefined"
},
"description": "当前选中的 `<mdui-menu-item>` 的值。\n\n**Note**：该属性的 HTML 属性始终为字符串，仅在 `selects=\"single\"` 时可通过 HTML 属性设置初始值；该属性的 JavaScript 属性值在 `selects=\"single\"` 时为字符串，在 `selects=\"multiple\"` 时为字符串数组。因此，在 `selects=\"multiple\"` 时，若要修改该值，只能通过修改 JavaScript 属性值实现。",
"fieldName": "value"
},
{
"name": "dense",
"type": {
"text": "boolean"
},
"default": "false",
"description": "菜单项是否使用紧凑布局",
"fieldName": "dense"
},
{
"name": "submenu-trigger",
"type": {
"text": "| /*点击菜单项时打开子菜单*/ 'click'\n | /*鼠标悬浮到菜单项上时打开子菜单*/ 'hover'\n | /*聚焦到菜单项上时打开子菜单*/ 'focus'\n | /*仅能通过编程方式打开和关闭子菜单，不能再指定其他触发方式*/ 'manual'\n | string"
},
"default": "'click hover'",
"description": "子菜单的触发方式，支持多个值，用空格分隔。可选值包括：\n\n* `click`：点击菜单项时打开子菜单\n* `hover`：鼠标悬浮到菜单项上时打开子菜单\n* `focus`：聚焦到菜单项上时打开子菜单\n* `manual`：仅能通过编程方式打开和关闭子菜单，不能再指定其他触发方式",
"fieldName": "submenuTrigger"
},
{
"name": "submenu-open-delay",
"type": {
"text": "number"
},
"default": "200",
"description": "鼠标悬浮触发子菜单打开的延时，单位毫秒",
"fieldName": "submenuOpenDelay"
},
{
"name": "submenu-close-delay",
"type": {
"text": "number"
},
"default": "200",
"description": "鼠标悬浮触发子菜单关闭的延时，单位毫秒",
"fieldName": "submenuCloseDelay"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "菜单组件。需配合 `<mdui-menu-item>` 组件使用\n\n```html\n<mdui-menu>\n..<mdui-menu-item>Item 1</mdui-menu-item>\n..<mdui-menu-item>Item 2</mdui-menu-item>\n</mdui-menu>\n```",
"tagName": "mdui-menu",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Menu",
"declaration": {
"name": "Menu",
"module": "components/menu/menu.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-menu",
"declaration": {
"name": "Menu",
"module": "components/menu/menu.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/navigation-bar/navigation-bar-item.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "NavigationBarItem",
"cssProperties": [
{
"description": "指示器的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner-indicator"
}
],
"cssParts": [
{
"description": "导航项容器",
"name": "container"
},
{
"description": "指示器",
"name": "indicator"
},
{
"description": "徽标",
"name": "badge"
},
{
"description": "图标",
"name": "icon"
},
{
"description": "激活状态的图标",
"name": "active-icon"
},
{
"description": "导航项文本",
"name": "label"
}
],
"slots": [
{
"description": "导航项文本",
"name": ""
},
{
"description": "图标",
"name": "icon"
},
{
"description": "激活状态的图标元素",
"name": "active-icon"
},
{
"description": "徽标",
"name": "badge"
}
],
"members": [
{
"kind": "field",
"name": "icon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "未激活状态的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"attribute": "icon",
"reflects": true
},
{
"kind": "field",
"name": "activeIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "激活状态的 Material Icons 图标名。也可以通过 `slot=\"active-icon\"` 设置",
"attribute": "active-icon",
"reflects": true
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "导航项的值",
"attribute": "value",
"reflects": true
},
{
"kind": "field",
"name": "labelVisibility",
"type": {
"text": "'selected' | 'labeled' | 'unlabeled' | undefined"
},
"privacy": "protected",
"description": "文本的可视状态，由 `<mdui-navigation-bar>` 组件控制该参数"
},
{
"kind": "field",
"name": "isInitial",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "true",
"description": "是否是初始状态，不显示动画。由 `<mdui-navigation-bar>` 组件控制该参数"
},
{
"kind": "field",
"name": "active",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"description": "是否为激活状态，由 `<mdui-navigation-bar>` 组件控制该参数",
"attribute": "active",
"reflects": true
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false"
},
{
"kind": "field",
"name": "key",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "rippleRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController( this, 'active-icon', )"
},
{
"kind": "field",
"name": "rippleElement",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "renderInner",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "field",
"name": "href",
"type": {
"text": "string"
},
"privacy": "public",
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"attribute": "href",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "download",
"type": {
"text": "string"
},
"privacy": "public",
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "download",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"privacy": "public",
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "target",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"privacy": "public",
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"attribute": "rel",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "method",
"name": "renderAnchor",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n refDirective,\n tabIndex,\n }",
"type": {
"text": "RenderAnchorOptions"
}
}
],
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"attributes": [
{
"name": "icon",
"type": {
"text": "string | undefined"
},
"description": "未激活状态的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"fieldName": "icon"
},
{
"name": "active-icon",
"type": {
"text": "string | undefined"
},
"description": "激活状态的 Material Icons 图标名。也可以通过 `slot=\"active-icon\"` 设置",
"fieldName": "activeIcon"
},
{
"name": "value",
"type": {
"text": "string | undefined"
},
"description": "导航项的值",
"fieldName": "value"
},
{
"name": "active",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否为激活状态，由 `<mdui-navigation-bar>` 组件控制该参数",
"fieldName": "active"
},
{
"name": "href",
"type": {
"text": "string"
},
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"fieldName": "href",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "download",
"type": {
"text": "string"
},
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "download",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "target",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"fieldName": "rel",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"mixins": [
{
"name": "AnchorMixin",
"package": "@mdui/shared/mixins/anchor.js"
},
{
"name": "RippleMixin",
"module": "components/ripple/ripple-mixin.js"
},
{
"name": "FocusableMixin",
"package": "@mdui/shared/mixins/focusable.js"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "底部导航栏项组件。需配合 `<mdui-navigation-bar>` 组件使用\n\n```html\n<mdui-navigation-bar>\n..<mdui-navigation-bar-item icon=\"place\">Item 1</mdui-navigation-bar-item>\n..<mdui-navigation-bar-item icon=\"commute\">Item 2</mdui-navigation-bar-item>\n..<mdui-navigation-bar-item icon=\"people\">Item 3</mdui-navigation-bar-item>\n</mdui-navigation-bar>\n```",
"tagName": "mdui-navigation-bar-item",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "NavigationBarItem",
"declaration": {
"name": "NavigationBarItem",
"module": "components/navigation-bar/navigation-bar-item.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-navigation-bar-item",
"declaration": {
"name": "NavigationBarItem",
"module": "components/navigation-bar/navigation-bar-item.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/navigation-bar/navigation-bar.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "NavigationBar",
"cssProperties": [
{
"description": "组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
},
{
"description": "组件的 CSS `z-index` 值",
"name": "--z-index"
}
],
"slots": [
{
"description": "`<mdui-navigation-bar-item>` 组件",
"name": ""
}
],
"members": [
{
"kind": "field",
"name": "hide",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否隐藏",
"attribute": "hide",
"reflects": true
},
{
"kind": "field",
"name": "labelVisibility",
"type": {
"text": "| /*当选项小于等于3个时，始终显示文本；当选项大于3个时，仅显示选中状态的文本*/ 'auto'\n | /*仅在选中状态显示文本*/ 'selected'\n | /*始终显示文本*/ 'labeled'\n | /*始终不显示文本*/ 'unlabeled'"
},
"privacy": "public",
"default": "'auto'",
"description": "文本的可视状态。可选值包括：\n\n* `auto`：当选项小于等于3个时，始终显示文本；当选项大于3个时，仅显示选中状态的文本\n* `selected`：仅在选中状态显示文本\n* `labeled`：始终显示文本\n* `unlabeled`：始终不显示文本",
"attribute": "label-visibility",
"reflects": true
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "当前选中的 `<mdui-navigation-bar-item>` 的值",
"attribute": "value",
"reflects": true
},
{
"kind": "field",
"name": "scrollBehavior",
"type": {
"text": "'hide' | 'shrink' | 'elevate' | undefined"
},
"privacy": "public",
"description": "滚动行为。可选值包括：\n\n* `hide`：滚动时隐藏",
"attribute": "scroll-behavior",
"reflects": true,
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "activeKey",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0"
},
{
"kind": "field",
"name": "items",
"type": {
"text": "NavigationBarItem[]"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "isInitial",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "true"
},
{
"kind": "field",
"name": "definedController",
"privacy": "private",
"default": "new DefinedController(this, { relatedElements: ['mdui-navigation-bar-item'], })"
},
{
"kind": "field",
"name": "scrollPaddingPosition",
"type": {
"text": "ScrollPaddingPosition"
},
"privacy": "protected",
"description": "滚动时，如果需要给 container 添加 padding，添加在顶部还是底部",
"readonly": true,
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "layoutPlacement",
"type": {
"text": "LayoutPlacement"
},
"privacy": "protected",
"description": "当前布局组件所处的位置，父类必须实现该 getter",
"readonly": true,
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "method",
"name": "onActiveKeyChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onValueChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onLabelVisibilityChange",
"privacy": "private"
},
{
"kind": "method",
"name": "runScrollThreshold",
"privacy": "protected",
"parameters": [
{
"name": "isScrollingUp",
"type": {
"text": "boolean"
}
}
],
"description": "滚动行为\n当前仅支持 hide 这一个行为，所以不做行为类型判断",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "onClick",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "event",
"type": {
"text": "MouseEvent"
}
}
]
},
{
"kind": "method",
"name": "updateItems",
"privacy": "private"
},
{
"kind": "method",
"name": "onSlotChange",
"privacy": "private"
},
{
"kind": "field",
"name": "scrollTarget",
"type": {
"text": "string | HTMLElement | JQ<HTMLElement> | undefined"
},
"privacy": "public",
"description": "需要监听其滚动事件的元素。值可以是 CSS 选择器、DOM 元素、或 [JQ 对象](/docs/2/functions/jq)。默认监听 `window` 的滚动事件",
"attribute": "scroll-target",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "scrollThreshold",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "在滚动多少距离之后触发滚动行为，单位为 `px`",
"attribute": "scroll-threshold",
"reflects": true,
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "scrollBehaviorDefinedController",
"privacy": "protected",
"default": "new DefinedController(this, { needDomReady: true, })",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "lastScrollTopThreshold",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"description": "上次滚动后，垂直方向的距离（滚动距离超过 scrollThreshold 才记录）",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "lastScrollTopNoThreshold",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"description": "上次滚动后，垂直方向的距离（无视 scrollThreshold，始终记录）",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "isParentLayout",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"description": "父元素是否是 `mdui-layout`",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "method",
"name": "onScrollTargetChange",
"privacy": "private",
"parameters": [
{
"name": "oldValue",
"type": {
"text": "string"
}
},
{
"name": "newValue",
"type": {
"text": "string"
}
}
],
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "onScrollBehaviorChange",
"privacy": "private",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "hasScrollBehavior",
"privacy": "protected",
"return": {
"type": {
"text": "boolean"
}
},
"parameters": [
{
"name": "behavior",
"type": {
"text": "ScrollBehavior | ScrollBehavior[]"
},
"description": "为数组时，只要其中一个行为在 scrollBehavior 中，即返回 `true`"
}
],
"description": "scrollBehavior 包含多个滚动行为，用空格分割\n用该方法判断指定滚动行为是否在 scrollBehavior 中",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "runScrollNoThreshold",
"privacy": "protected",
"parameters": [
{
"name": "_isScrollingUp",
"type": {
"text": "boolean"
},
"description": "是否向上滚动"
},
{
"name": "_scrollTop",
"type": {
"text": "number"
},
"description": "距离 scrollTarget 顶部的距离"
}
],
"description": "执行滚动事件，会无视 scrollThreshold，始终会执行",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "setContainerPadding",
"privacy": "protected",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "action",
"type": {
"text": "'add' | 'update' | 'remove'"
},
"description": "新增、更新、移除 padding"
},
{
"name": "scrollTarget",
"optional": true,
"type": {
"text": "string | HTMLElement | JQ<HTMLElement>"
},
"description": "在该元素上添加、更新或移除 padding"
}
],
"description": "更新滚动容器的 padding，避免内容被 navigation-bar 覆盖",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "onListeningScroll",
"privacy": "private",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "onScroll",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "listening",
"type": {
"text": "HTMLElement | Window"
}
}
],
"description": "滚动事件，这里过滤掉不符合条件的滚动",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "updateScrollTop",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "listening",
"type": {
"text": "HTMLElement | Window"
}
}
],
"description": "重新更新 lastScrollTopThreshold、lastScrollTopNoThreshold 的值\n用于在 scrollTarget、scrollBehavior 变更时，重新设置 lastScrollTopThreshold、lastScrollTopNoThreshold 的初始值",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "getListening",
"privacy": "private",
"return": {
"type": {
"text": "HTMLElement | Window | undefined"
}
},
"parameters": [
{
"name": "target",
"optional": true,
"type": {
"text": "string | HTMLElement | JQ<HTMLElement>"
}
}
],
"description": "获取组件需要监听哪个元素的滚动状态",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "getContainer",
"privacy": "private",
"return": {
"type": {
"text": "HTMLElement | undefined"
}
},
"parameters": [
{
"name": "target",
"optional": true,
"type": {
"text": "string | HTMLElement | JQ<HTMLElement>"
}
}
],
"description": "获取组件在哪个容器内滚动",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "order",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "该组件在 [`<mdui-layout>`](/docs/2/components/layout) 中的布局顺序，按从小到大排序。默认为 `0`",
"attribute": "order",
"reflects": true,
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "field",
"name": "layoutManager",
"type": {
"text": "LayoutManager | undefined"
},
"privacy": "protected",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "method",
"name": "onOrderChange",
"privacy": "private",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
}
],
"events": [
{
"description": "值变化时触发",
"name": "change"
},
{
"description": "开始显示时，事件被触发。可以通过调用 `event.preventDefault()` 阻止显示",
"name": "show"
},
{
"description": "显示动画完成时，事件被触发",
"name": "shown"
},
{
"description": "开始隐藏时，事件被触发。可以通过调用 `event.preventDefault()` 阻止隐藏",
"name": "hide"
},
{
"description": "隐藏动画完成时，事件被触发",
"name": "hidden"
}
],
"attributes": [
{
"name": "hide",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否隐藏",
"fieldName": "hide"
},
{
"name": "label-visibility",
"type": {
"text": "| /*当选项小于等于3个时，始终显示文本；当选项大于3个时，仅显示选中状态的文本*/ 'auto'\n | /*仅在选中状态显示文本*/ 'selected'\n | /*始终显示文本*/ 'labeled'\n | /*始终不显示文本*/ 'unlabeled'"
},
"default": "'auto'",
"description": "文本的可视状态。可选值包括：\n\n* `auto`：当选项小于等于3个时，始终显示文本；当选项大于3个时，仅显示选中状态的文本\n* `selected`：仅在选中状态显示文本\n* `labeled`：始终显示文本\n* `unlabeled`：始终不显示文本",
"fieldName": "labelVisibility"
},
{
"name": "value",
"type": {
"text": "string | undefined"
},
"description": "当前选中的 `<mdui-navigation-bar-item>` 的值",
"fieldName": "value"
},
{
"name": "scroll-behavior",
"type": {
"text": "'hide' | 'shrink' | 'elevate' | undefined"
},
"description": "滚动行为。可选值包括：\n\n* `hide`：滚动时隐藏",
"fieldName": "scrollBehavior",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"name": "scroll-target",
"type": {
"text": "string | HTMLElement | JQ<HTMLElement> | undefined"
},
"description": "需要监听其滚动事件的元素。值可以是 CSS 选择器、DOM 元素、或 [JQ 对象](/docs/2/functions/jq)。默认监听 `window` 的滚动事件",
"fieldName": "scrollTarget",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"name": "scroll-threshold",
"type": {
"text": "number | undefined"
},
"description": "在滚动多少距离之后触发滚动行为，单位为 `px`",
"fieldName": "scrollThreshold",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"name": "order",
"type": {
"text": "number | undefined"
},
"description": "该组件在 [`<mdui-layout>`](/docs/2/components/layout) 中的布局顺序，按从小到大排序。默认为 `0`",
"fieldName": "order",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
}
],
"mixins": [
{
"name": "ScrollBehaviorMixin",
"package": "@mdui/shared/mixins/scrollBehavior.js"
}
],
"superclass": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
},
"summary": "底部导航栏组件。需配合 `<mdui-navigation-bar-item>` 组件使用\n\n```html\n<mdui-navigation-bar>\n..<mdui-navigation-bar-item icon=\"place\">Item 1</mdui-navigation-bar-item>\n..<mdui-navigation-bar-item icon=\"commute\">Item 2</mdui-navigation-bar-item>\n..<mdui-navigation-bar-item icon=\"people\">Item 3</mdui-navigation-bar-item>\n</mdui-navigation-bar>\n```",
"tagName": "mdui-navigation-bar",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "NavigationBar",
"declaration": {
"name": "NavigationBar",
"module": "components/navigation-bar/navigation-bar.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-navigation-bar",
"declaration": {
"name": "NavigationBar",
"module": "components/navigation-bar/navigation-bar.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/navigation-drawer/index.js",
"declarations": [
{
"kind": "class",
"description": "在手机端，`modal` 始终为 `true`；大于手机端时，`modal` 属性才开始生效",
"name": "NavigationDrawer",
"cssProperties": [
{
"description": "组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
},
{
"description": "组件的 CSS `z-index` 值",
"name": "--z-index"
}
],
"cssParts": [
{
"description": "遮罩层",
"name": "overlay"
},
{
"description": "抽屉栏容器",
"name": "panel"
}
],
"slots": [
{
"description": "抽屉栏中的内容",
"name": ""
}
],
"members": [
{
"kind": "field",
"name": "open",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否打开抽屉栏",
"attribute": "open",
"reflects": true
},
{
"kind": "field",
"name": "modal",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "抽屉栏打开时，是否显示遮罩层\n\n在窄屏设备上（屏幕宽度小于 [`--mdui-breakpoint-md`](/docs/2/styles/design-tokens#breakpoint)），会始终显示遮罩层，无视该参数",
"attribute": "modal",
"reflects": true
},
{
"kind": "field",
"name": "closeOnEsc",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "在有遮罩层的情况下，按下 ESC 键是否关闭抽屉栏",
"attribute": "close-on-esc",
"reflects": true
},
{
"kind": "field",
"name": "closeOnOverlayClick",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "点击遮罩层时，是否关闭抽屉栏",
"attribute": "close-on-overlay-click",
"reflects": true
},
{
"kind": "field",
"name": "placement",
"type": {
"text": "| /*左侧*/ 'left'\n | /*右侧*/ 'right'"
},
"privacy": "public",
"default": "'left'",
"description": "抽屉栏的位置。可选值包括：\n\n* `left`：左侧\n* `right`：右侧",
"attribute": "placement",
"reflects": true
},
{
"kind": "field",
"name": "contained",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "默认情况下，抽屉栏相对于 `body` 元素显示。当该参数设置为 `true` 时，抽屉栏将相对于其父元素显示。\n\n**Note**：设置该属性时，必须在父元素上手动设置样式 `position: relative; overflow: hidden;`。",
"attribute": "contained",
"reflects": true
},
{
"kind": "field",
"name": "mobile",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"attribute": "mobile",
"reflects": true
},
{
"kind": "field",
"name": "originalTrigger",
"type": {
"text": "HTMLElement"
},
"privacy": "private"
},
{
"kind": "field",
"name": "observeResize",
"type": {
"text": "ObserveResize | undefined"
},
"privacy": "private"
},
{
"kind": "field",
"name": "modalHelper",
"type": {
"text": "Modal"
},
"privacy": "private"
},
{
"kind": "field",
"name": "overlayRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "panelRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "definedController",
"privacy": "private",
"readonly": true,
"default": "new DefinedController(this, { needDomReady: true, })"
},
{
"kind": "field",
"name": "layoutPlacement",
"type": {
"text": "LayoutPlacement"
},
"privacy": "protected",
"description": "当前布局组件所处的位置，父类必须实现该 getter",
"readonly": true,
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "field",
"name": "lockTarget",
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "isModal",
"privacy": "private",
"readonly": true
},
{
"kind": "method",
"name": "onContainedChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onPlacementChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onMobileChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onOpenChange",
"privacy": "private"
},
{
"kind": "method",
"name": "setObserveResize",
"privacy": "private"
},
{
"kind": "method",
"name": "onOverlayClick",
"privacy": "private"
},
{
"kind": "method",
"name": "getLockTargetAnimate",
"privacy": "private",
"parameters": [
{
"name": "open",
"type": {
"text": "boolean"
}
},
{
"name": "duration",
"type": {
"text": "number"
}
}
]
},
{
"kind": "field",
"name": "order",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "该组件在 [`<mdui-layout>`](/docs/2/components/layout) 中的布局顺序，按从小到大排序。默认为 `0`",
"attribute": "order",
"reflects": true,
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "field",
"name": "layoutManager",
"type": {
"text": "LayoutManager | undefined"
},
"privacy": "protected",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "field",
"name": "isParentLayout",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "method",
"name": "onOrderChange",
"privacy": "private",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
}
],
"events": [
{
"description": "抽屉栏打开之前触发。可以通过调用 `event.preventDefault()` 阻止抽屉栏打开",
"name": "open"
},
{
"description": "抽屉栏打开动画完成之后触发",
"name": "opened"
},
{
"description": "抽屉栏关闭之前触发。可以通过调用 `event.preventDefault()` 阻止抽屉栏关闭",
"name": "close"
},
{
"description": "抽屉栏关闭动画完成之后触发",
"name": "closed"
},
{
"description": "点击遮罩层时触发",
"name": "overlay-click"
}
],
"attributes": [
{
"name": "open",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否打开抽屉栏",
"fieldName": "open"
},
{
"name": "modal",
"type": {
"text": "boolean"
},
"default": "false",
"description": "抽屉栏打开时，是否显示遮罩层\n\n在窄屏设备上（屏幕宽度小于 [`--mdui-breakpoint-md`](/docs/2/styles/design-tokens#breakpoint)），会始终显示遮罩层，无视该参数",
"fieldName": "modal"
},
{
"name": "close-on-esc",
"type": {
"text": "boolean"
},
"default": "false",
"description": "在有遮罩层的情况下，按下 ESC 键是否关闭抽屉栏",
"fieldName": "closeOnEsc"
},
{
"name": "close-on-overlay-click",
"type": {
"text": "boolean"
},
"default": "false",
"description": "点击遮罩层时，是否关闭抽屉栏",
"fieldName": "closeOnOverlayClick"
},
{
"name": "placement",
"type": {
"text": "| /*左侧*/ 'left'\n | /*右侧*/ 'right'"
},
"default": "'left'",
"description": "抽屉栏的位置。可选值包括：\n\n* `left`：左侧\n* `right`：右侧",
"fieldName": "placement"
},
{
"name": "contained",
"type": {
"text": "boolean"
},
"default": "false",
"description": "默认情况下，抽屉栏相对于 `body` 元素显示。当该参数设置为 `true` 时，抽屉栏将相对于其父元素显示。\n\n**Note**：设置该属性时，必须在父元素上手动设置样式 `position: relative; overflow: hidden;`。",
"fieldName": "contained"
},
{
"name": "mobile",
"type": {
"text": "boolean"
},
"default": "false",
"fieldName": "mobile"
},
{
"name": "order",
"type": {
"text": "number | undefined"
},
"description": "该组件在 [`<mdui-layout>`](/docs/2/components/layout) 中的布局顺序，按从小到大排序。默认为 `0`",
"fieldName": "order",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
}
],
"superclass": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
},
"summary": "侧边抽屉栏组件\n\n```html\n<mdui-navigation-drawer>content</mdui-navigation-drawer>\n```",
"tagName": "mdui-navigation-drawer",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "NavigationDrawer",
"declaration": {
"name": "NavigationDrawer",
"module": "components/navigation-drawer/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-navigation-drawer",
"declaration": {
"name": "NavigationDrawer",
"module": "components/navigation-drawer/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/navigation-rail/navigation-rail-item.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "NavigationRailItem",
"cssProperties": [
{
"description": "指示器的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner-indicator"
}
],
"cssParts": [
{
"description": "导航项容器",
"name": "container"
},
{
"description": "指示器",
"name": "indicator"
},
{
"description": "徽标",
"name": "badge"
},
{
"description": "图标",
"name": "icon"
},
{
"description": "激活状态的图标",
"name": "active-icon"
},
{
"description": "文本内容",
"name": "label"
}
],
"slots": [
{
"description": "文本内容",
"name": ""
},
{
"description": "图标",
"name": "icon"
},
{
"description": "激活状态的图标",
"name": "active-icon"
},
{
"description": "徽标",
"name": "badge"
}
],
"members": [
{
"kind": "field",
"name": "icon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "未激活状态下的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"attribute": "icon",
"reflects": true
},
{
"kind": "field",
"name": "activeIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "激活状态下的 Material Icons 图标名。也可以通过 `slot=\"active-icon\"` 设置",
"attribute": "active-icon",
"reflects": true
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "导航项的值",
"attribute": "value",
"reflects": true
},
{
"kind": "field",
"name": "active",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"description": "是否为激活状态，由 `<mdui-navigation-rail>` 组件控制该参数",
"attribute": "active",
"reflects": true
},
{
"kind": "field",
"name": "isInitial",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "true",
"description": "是否是初始状态，不显示动画。由 `<mdui-navigation-rail>` 组件控制该参数"
},
{
"kind": "field",
"name": "placement",
"type": {
"text": "'left' | 'right'"
},
"privacy": "protected",
"default": "'left'",
"description": "导航栏的位置，由 `<mdui-navigation-rail>` 组件控制该参数"
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false"
},
{
"kind": "field",
"name": "key",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "rippleRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController( this, '[default]', 'active-icon', )"
},
{
"kind": "field",
"name": "rippleElement",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "renderInner",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "hasDefaultSlot",
"type": {
"text": "boolean"
}
}
]
},
{
"kind": "field",
"name": "href",
"type": {
"text": "string"
},
"privacy": "public",
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"attribute": "href",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "download",
"type": {
"text": "string"
},
"privacy": "public",
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "download",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"privacy": "public",
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "target",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"privacy": "public",
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"attribute": "rel",
"reflects": true,
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "method",
"name": "renderAnchor",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n refDirective,\n tabIndex,\n }",
"type": {
"text": "RenderAnchorOptions"
}
}
],
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"attributes": [
{
"name": "icon",
"type": {
"text": "string | undefined"
},
"description": "未激活状态下的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"fieldName": "icon"
},
{
"name": "active-icon",
"type": {
"text": "string | undefined"
},
"description": "激活状态下的 Material Icons 图标名。也可以通过 `slot=\"active-icon\"` 设置",
"fieldName": "activeIcon"
},
{
"name": "value",
"type": {
"text": "string | undefined"
},
"description": "导航项的值",
"fieldName": "value"
},
{
"name": "active",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否为激活状态，由 `<mdui-navigation-rail>` 组件控制该参数",
"fieldName": "active"
},
{
"name": "href",
"type": {
"text": "string"
},
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"fieldName": "href",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "download",
"type": {
"text": "string"
},
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "download",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "target",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"fieldName": "rel",
"inheritedFrom": {
"name": "AnchorMixin",
"module": "@mdui/shared/mixins/anchor.js"
}
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"mixins": [
{
"name": "AnchorMixin",
"package": "@mdui/shared/mixins/anchor.js"
},
{
"name": "RippleMixin",
"module": "components/ripple/ripple-mixin.js"
},
{
"name": "FocusableMixin",
"package": "@mdui/shared/mixins/focusable.js"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "侧边导航项组件。需配合 `<mdui-navigation-rail>` 组件使用\n\n```html\n<mdui-navigation-rail>\n..<mdui-navigation-rail-item icon=\"watch_later\">Recent</mdui-navigation-rail-item>\n..<mdui-navigation-rail-item icon=\"image\">Images</mdui-navigation-rail-item>\n..<mdui-navigation-rail-item icon=\"library_music\">Library</mdui-navigation-rail-item>\n</mdui-navigation-rail>\n```",
"tagName": "mdui-navigation-rail-item",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "NavigationRailItem",
"declaration": {
"name": "NavigationRailItem",
"module": "components/navigation-rail/navigation-rail-item.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-navigation-rail-item",
"declaration": {
"name": "NavigationRailItem",
"module": "components/navigation-rail/navigation-rail-item.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/navigation-rail/navigation-rail.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "NavigationRail",
"cssProperties": [
{
"description": "组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
},
{
"description": "组件的 CSS `z-index` 值",
"name": "--z-index"
}
],
"cssParts": [
{
"description": "顶部元素的容器",
"name": "top"
},
{
"description": "底部元素的容器",
"name": "bottom"
},
{
"description": "`<mdui-navigation-rail-item>` 组件的容器",
"name": "items"
}
],
"slots": [
{
"description": "`<mdui-navigation-rail-item>` 组件",
"name": ""
},
{
"description": "顶部的元素",
"name": "top"
},
{
"description": "底部的元素",
"name": "bottom"
}
],
"members": [
{
"kind": "field",
"name": "value",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "当前选中的 `<mdui-navigation-rail-item>` 的值",
"attribute": "value",
"reflects": true
},
{
"kind": "field",
"name": "placement",
"type": {
"text": "| /*左侧*/ 'left'\n | /*右侧*/ 'right'"
},
"privacy": "public",
"default": "'left'",
"description": "导航栏的位置。可选值包括：\n\n* `left`：左侧\n* `right`：右侧",
"attribute": "placement",
"reflects": true
},
{
"kind": "field",
"name": "alignment",
"type": {
"text": "| /*顶部对齐*/ 'start'\n | /*居中对齐*/ 'center'\n | /*底部对齐*/ 'end'"
},
"privacy": "public",
"default": "'start'",
"description": "`<mdui-navigation-rail-item>` 元素的对齐方式。可选值包括：\n\n* `start`：顶部对齐\n* `center`：居中对齐\n* `end`：底部对齐",
"attribute": "alignment",
"reflects": true
},
{
"kind": "field",
"name": "contained",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "默认情况下，导航栏相对于 `body` 元素显示。当该参数设置为 `true` 时，导航栏将相对于其父元素显示。\n\n**Note**：设置该属性时，必须在父元素上手动设置样式 `position: relative;`。",
"attribute": "contained",
"reflects": true
},
{
"kind": "field",
"name": "divider",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在导航栏和页面内容之间添加分割线",
"attribute": "divider",
"reflects": true
},
{
"kind": "field",
"name": "activeKey",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0"
},
{
"kind": "field",
"name": "items",
"type": {
"text": "NavigationRailItem[]"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController( this, 'top', 'bottom', )"
},
{
"kind": "field",
"name": "definedController",
"privacy": "private",
"readonly": true,
"default": "new DefinedController(this, { relatedElements: ['mdui-navigation-rail-item'], })"
},
{
"kind": "field",
"name": "isInitial",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "true"
},
{
"kind": "field",
"name": "layoutPlacement",
"type": {
"text": "LayoutPlacement"
},
"privacy": "protected",
"description": "当前布局组件所处的位置，父类必须实现该 getter",
"readonly": true,
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "field",
"name": "parentTarget",
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "isRight",
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "paddingValue",
"type": {
"text": "number | undefined"
},
"privacy": "private",
"readonly": true
},
{
"kind": "method",
"name": "onActiveKeyChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onValueChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onContainedChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onPlacementChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onClick",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "event",
"type": {
"text": "MouseEvent"
}
}
]
},
{
"kind": "method",
"name": "updateItems",
"privacy": "private"
},
{
"kind": "method",
"name": "onSlotChange",
"privacy": "private"
},
{
"kind": "field",
"name": "order",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "该组件在 [`<mdui-layout>`](/docs/2/components/layout) 中的布局顺序，按从小到大排序。默认为 `0`",
"attribute": "order",
"reflects": true,
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "field",
"name": "layoutManager",
"type": {
"text": "LayoutManager | undefined"
},
"privacy": "protected",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "field",
"name": "isParentLayout",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "method",
"name": "onOrderChange",
"privacy": "private",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
}
],
"events": [
{
"description": "值变化时触发",
"name": "change"
}
],
"attributes": [
{
"name": "value",
"type": {
"text": "string | undefined"
},
"description": "当前选中的 `<mdui-navigation-rail-item>` 的值",
"fieldName": "value"
},
{
"name": "placement",
"type": {
"text": "| /*左侧*/ 'left'\n | /*右侧*/ 'right'"
},
"default": "'left'",
"description": "导航栏的位置。可选值包括：\n\n* `left`：左侧\n* `right`：右侧",
"fieldName": "placement"
},
{
"name": "alignment",
"type": {
"text": "| /*顶部对齐*/ 'start'\n | /*居中对齐*/ 'center'\n | /*底部对齐*/ 'end'"
},
"default": "'start'",
"description": "`<mdui-navigation-rail-item>` 元素的对齐方式。可选值包括：\n\n* `start`：顶部对齐\n* `center`：居中对齐\n* `end`：底部对齐",
"fieldName": "alignment"
},
{
"name": "contained",
"type": {
"text": "boolean"
},
"default": "false",
"description": "默认情况下，导航栏相对于 `body` 元素显示。当该参数设置为 `true` 时，导航栏将相对于其父元素显示。\n\n**Note**：设置该属性时，必须在父元素上手动设置样式 `position: relative;`。",
"fieldName": "contained"
},
{
"name": "divider",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在导航栏和页面内容之间添加分割线",
"fieldName": "divider"
},
{
"name": "order",
"type": {
"text": "number | undefined"
},
"description": "该组件在 [`<mdui-layout>`](/docs/2/components/layout) 中的布局顺序，按从小到大排序。默认为 `0`",
"fieldName": "order",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
}
],
"superclass": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
},
"summary": "侧边导航栏组件。需配合 `<mdui-navigation-rail-item>` 组件使用\n\n```html\n<mdui-navigation-rail>\n..<mdui-navigation-rail-item icon=\"watch_later\">Recent</mdui-navigation-rail-item>\n..<mdui-navigation-rail-item icon=\"image\">Images</mdui-navigation-rail-item>\n..<mdui-navigation-rail-item icon=\"library_music\">Library</mdui-navigation-rail-item>\n</mdui-navigation-rail>\n```",
"tagName": "mdui-navigation-rail",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "NavigationRail",
"declaration": {
"name": "NavigationRail",
"module": "components/navigation-rail/navigation-rail.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-navigation-rail",
"declaration": {
"name": "NavigationRail",
"module": "components/navigation-rail/navigation-rail.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/radio/radio-group.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "RadioGroup",
"slots": [
{
"description": "`<mdui-radio>` 元素",
"name": ""
}
],
"members": [
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否禁用此组件",
"attribute": "disabled",
"reflects": true
},
{
"kind": "field",
"name": "form",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"attribute": "form",
"reflects": true
},
{
"kind": "field",
"name": "name",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "单选框组的名称，将与表单数据一起提交",
"attribute": "name",
"reflects": true
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "单选框组的名称，将于表单数据一起提交",
"attribute": "value",
"reflects": true
},
{
"kind": "field",
"name": "defaultValue",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "默认选中的值。在重置表单时，将重置为该默认值。该属性只能通过 JavaScript 属性设置"
},
{
"kind": "field",
"name": "required",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "提交表单时，是否必须选中其中一个单选框",
"attribute": "required",
"reflects": true
},
{
"kind": "field",
"name": "invalid",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否验证未通过"
},
{
"kind": "field",
"name": "isInitial",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "true"
},
{
"kind": "field",
"name": "inputRef",
"type": {
"text": "Ref<HTMLInputElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "formController",
"privacy": "private",
"readonly": true,
"default": "new FormController(this)"
},
{
"kind": "field",
"name": "definedController",
"privacy": "private",
"readonly": true,
"default": "new DefinedController(this, { relatedElements: ['mdui-radio'], })"
},
{
"kind": "field",
"name": "validity",
"type": {
"text": "ValidityState"
},
"privacy": "public",
"description": "表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)",
"readonly": true
},
{
"kind": "field",
"name": "validationMessage",
"type": {
"text": "string"
},
"privacy": "public",
"description": "如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串",
"readonly": true
},
{
"kind": "field",
"name": "items",
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "itemsEnabled",
"privacy": "private",
"readonly": true
},
{
"kind": "method",
"name": "onValueChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onInvalidChange",
"privacy": "private"
},
{
"kind": "method",
"name": "checkValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`"
},
{
"kind": "method",
"name": "reportValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。\n\n如果验证未通过，还会在组件上显示验证失败的提示。"
},
{
"kind": "method",
"name": "setCustomValidity",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "message",
"type": {
"text": "string"
},
"description": "自定义的错误提示文本"
}
],
"description": "设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证"
},
{
"kind": "method",
"name": "updateRadioFocusable",
"privacy": "private"
},
{
"kind": "method",
"name": "onClick",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "MouseEvent"
}
}
]
},
{
"kind": "method",
"name": "onKeyDown",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "KeyboardEvent"
}
}
],
"description": "在内部的 `<mdui-radio>` 上按下按键时，在 `<mdui-radio>` 之间切换焦点"
},
{
"kind": "method",
"name": "onSlotChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onCheckedChange",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "Event"
}
}
],
"description": "slot 中的 mdui-radio 的 checked 变更时触发的事件"
},
{
"kind": "method",
"name": "updateItems",
"privacy": "private"
}
],
"events": [
{
"description": "选中值变化时触发",
"name": "change"
},
{
"description": "选中值变化时触发",
"name": "input"
},
{
"description": "表单字段验证未通过时触发",
"name": "invalid"
}
],
"attributes": [
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否禁用此组件",
"fieldName": "disabled"
},
{
"name": "form",
"type": {
"text": "string | undefined"
},
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"fieldName": "form"
},
{
"name": "name",
"type": {
"text": "string"
},
"default": "''",
"description": "单选框组的名称，将与表单数据一起提交",
"fieldName": "name"
},
{
"name": "value",
"type": {
"text": "string"
},
"default": "''",
"description": "单选框组的名称，将于表单数据一起提交",
"fieldName": "value"
},
{
"name": "required",
"type": {
"text": "boolean"
},
"default": "false",
"description": "提交表单时，是否必须选中其中一个单选框",
"fieldName": "required"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "单选框组组件。需配合 `<mdui-radio>` 组件使用\n\n```html\n<mdui-radio-group value=\"chinese\">\n..<mdui-radio value=\"chinese\">Chinese</mdui-radio>\n..<mdui-radio value=\"english\">English</mdui-radio>\n</mdui-radio-group>\n```",
"tagName": "mdui-radio-group",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "RadioGroup",
"declaration": {
"name": "RadioGroup",
"module": "components/radio/radio-group.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-radio-group",
"declaration": {
"name": "RadioGroup",
"module": "components/radio/radio-group.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/radio/radio.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Radio",
"cssParts": [
{
"description": "左侧图标容器",
"name": "control"
},
{
"description": "未选中状态的图标",
"name": "unchecked-icon"
},
{
"description": "选中状态的图标",
"name": "checked-icon"
},
{
"description": "文本内容",
"name": "label"
}
],
"slots": [
{
"description": "文本内容",
"name": ""
},
{
"description": "未选中状态的图标",
"name": "unchecked-icon"
},
{
"description": "选中状态的图标",
"name": "checked-icon"
}
],
"members": [
{
"kind": "field",
"name": "value",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "当前单选项的值",
"attribute": "value",
"reflects": true
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否禁用当前单选项",
"attribute": "disabled",
"reflects": true
},
{
"kind": "field",
"name": "checked",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "当前单选项是否已选中",
"attribute": "checked",
"reflects": true
},
{
"kind": "field",
"name": "uncheckedIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "未选中状态的 Material Icons 图标名。也可以通过 `slot=\"unchecked-icon\"` 设置",
"attribute": "unchecked-icon",
"reflects": true
},
{
"kind": "field",
"name": "checkedIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "选中状态的 Material Icons 图标名。也可以通过 `slot=\"checked-icon\"` 设置",
"attribute": "checked-icon",
"reflects": true
},
{
"kind": "field",
"name": "invalid",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false"
},
{
"kind": "field",
"name": "groupDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"attribute": "group-disabled",
"reflects": true
},
{
"kind": "field",
"name": "focusable",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "true"
},
{
"kind": "field",
"name": "isInitial",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "true"
},
{
"kind": "field",
"name": "rippleRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "rippleElement",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "onCheckedChange",
"privacy": "private"
},
{
"kind": "method",
"name": "isDisabled",
"privacy": "private",
"return": {
"type": {
"text": "boolean"
}
}
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"description": "选中该单选项时触发",
"name": "change"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"attributes": [
{
"name": "value",
"type": {
"text": "string"
},
"default": "''",
"description": "当前单选项的值",
"fieldName": "value"
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否禁用当前单选项",
"fieldName": "disabled"
},
{
"name": "checked",
"type": {
"text": "boolean"
},
"default": "false",
"description": "当前单选项是否已选中",
"fieldName": "checked"
},
{
"name": "unchecked-icon",
"type": {
"text": "string | undefined"
},
"description": "未选中状态的 Material Icons 图标名。也可以通过 `slot=\"unchecked-icon\"` 设置",
"fieldName": "uncheckedIcon"
},
{
"name": "checked-icon",
"type": {
"text": "string | undefined"
},
"description": "选中状态的 Material Icons 图标名。也可以通过 `slot=\"checked-icon\"` 设置",
"fieldName": "checkedIcon"
},
{
"name": "group-disabled",
"type": {
"text": "boolean"
},
"default": "false",
"fieldName": "groupDisabled"
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"mixins": [
{
"name": "RippleMixin",
"module": "components/ripple/ripple-mixin.js"
},
{
"name": "FocusableMixin",
"package": "@mdui/shared/mixins/focusable.js"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "单选框组件。需配合 `<mdui-radio-group>` 组件使用\n\n```html\n<mdui-radio-group value=\"chinese\">\n..<mdui-radio value=\"chinese\">Chinese</mdui-radio>\n..<mdui-radio value=\"english\">English</mdui-radio>\n</mdui-radio-group>\n```",
"tagName": "mdui-radio",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Radio",
"declaration": {
"name": "Radio",
"module": "components/radio/radio.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-radio",
"declaration": {
"name": "Radio",
"module": "components/radio/radio.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/range-slider/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "RangeSlider",
"cssParts": [
{
"description": "未激活状态的轨道",
"name": "track-inactive"
},
{
"description": "已激活状态的轨道",
"name": "track-active"
},
{
"description": "操作杆",
"name": "handle"
},
{
"description": "提示文本",
"name": "label"
},
{
"description": "刻度标记",
"name": "tickmark"
}
],
"members": [
{
"kind": "field",
"name": "defaultValue",
"type": {
"text": "number[]"
},
"privacy": "public",
"default": "[]",
"description": "默认值。在重置表单时，将重置为该默认值。此属性只能通过 JavaScript 属性设置"
},
{
"kind": "field",
"name": "currentHandle",
"type": {
"text": "'start' | 'end'"
},
"privacy": "private",
"default": "'start'",
"description": "当前操作的是哪一个 handle"
},
{
"kind": "field",
"name": "hoverHandle",
"type": {
"text": "'start' | 'end' | undefined"
},
"privacy": "private"
},
{
"kind": "field",
"name": "rippleStartRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "rippleEndRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "handleStartRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "handleEndRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "formController",
"privacy": "private",
"readonly": true,
"default": "new FormController(this)"
},
{
"kind": "field",
"name": "_value",
"type": {
"text": "number[]"
},
"privacy": "private",
"default": "[]"
},
{
"kind": "field",
"name": "value",
"type": {
"text": "number[]"
},
"privacy": "public",
"description": "滑块的值，为数组格式，将于表单数据一起提交。\n\n**NOTE**：该属性无法通过 HTML 属性设置初始值，如果要修改该值，只能通过修改 JavaScript 属性值实现。"
},
{
"kind": "field",
"name": "rippleElement",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "getRippleIndex",
"privacy": "protected"
},
{
"kind": "method",
"name": "updateStyle",
"privacy": "private"
},
{
"kind": "method",
"name": "onInput",
"privacy": "private"
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true,
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement"
},
"privacy": "protected",
"readonly": true,
"description": "最终获得焦点的元素",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "min",
"type": {
"text": "number"
},
"privacy": "public",
"default": "0",
"description": "滑块的最小值，默认为 `0`",
"attribute": "min",
"reflects": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "max",
"type": {
"text": "number"
},
"privacy": "public",
"default": "100",
"description": "滑块的最大值，默认为 `100`",
"attribute": "max",
"reflects": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "step",
"type": {
"text": "number"
},
"privacy": "public",
"default": "1",
"description": "步进间隔，默认为 `1`",
"attribute": "step",
"reflects": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "tickmarks",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否添加刻度标记",
"attribute": "tickmarks",
"reflects": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "nolabel",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否隐藏文本提示",
"attribute": "nolabel",
"reflects": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否被禁用",
"attribute": "disabled",
"reflects": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "form",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"attribute": "form",
"reflects": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "name",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "滑块的名称，该名称将与表单数据一起提交",
"attribute": "name",
"reflects": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "invalid",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"description": "是否验证未通过\n\n该验证为根据是否通过 `setCustomValidity` 方法设置了值，来判断是否验证通过",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "labelVisible",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "inputRef",
"type": {
"text": "Ref<HTMLInputElement>"
},
"privacy": "protected",
"readonly": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "trackActiveRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "protected",
"readonly": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "validity",
"type": {
"text": "ValidityState"
},
"privacy": "public",
"description": "表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)",
"readonly": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "validationMessage",
"type": {
"text": "string"
},
"privacy": "public",
"description": "如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串",
"readonly": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "labelFormatter",
"type": {
"text": "(value: number) => string"
},
"privacy": "public",
"description": "用于自定义标签的显示格式的函数。函数参数为滑块的当前值，返回值为期望显示的文本。",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "onDisabledChange",
"privacy": "private",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "checkValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "reportValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。\n\n如果验证未通过，还会在组件上显示验证失败的提示。",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "setCustomValidity",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "message",
"type": {
"text": "string"
},
"description": "自定义的错误提示文本"
}
],
"description": "设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "fixValue",
"privacy": "protected",
"return": {
"type": {
"text": "number"
}
},
"parameters": [
{
"name": "value",
"type": {
"text": "number"
}
}
],
"description": "value 不在 min、max 或 step 的限制范围内时，修正 value 的值",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "getCandidateValues",
"privacy": "protected",
"description": "获取候选值组成的数组",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "renderLabel",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "value",
"type": {
"text": "number"
}
}
],
"description": "渲染浮动标签",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "onChange",
"privacy": "protected",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"description": "值发生变更，且失去焦点时，将触发该事件",
"name": "change"
},
{
"description": "值变更时触发",
"name": "input"
},
{
"description": "表单字段验证未通过时触发",
"name": "invalid"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"superclass": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
},
"summary": "范围滑块组件\n\n```html\n<mdui-range-slider></mdui-range-slider>\n```",
"tagName": "mdui-range-slider",
"customElement": true,
"attributes": [
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "min",
"type": {
"text": "number"
},
"default": "0",
"description": "滑块的最小值，默认为 `0`",
"fieldName": "min",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"name": "max",
"type": {
"text": "number"
},
"default": "100",
"description": "滑块的最大值，默认为 `100`",
"fieldName": "max",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"name": "step",
"type": {
"text": "number"
},
"default": "1",
"description": "步进间隔，默认为 `1`",
"fieldName": "step",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"name": "tickmarks",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否添加刻度标记",
"fieldName": "tickmarks",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"name": "nolabel",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否隐藏文本提示",
"fieldName": "nolabel",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否被禁用",
"fieldName": "disabled",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"name": "form",
"type": {
"text": "string | undefined"
},
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"fieldName": "form",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"name": "name",
"type": {
"text": "string"
},
"default": "''",
"description": "滑块的名称，该名称将与表单数据一起提交",
"fieldName": "name",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
}
]
}
],
"exports": [
{
"kind": "js",
"name": "RangeSlider",
"declaration": {
"name": "RangeSlider",
"module": "components/range-slider/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-range-slider",
"declaration": {
"name": "RangeSlider",
"module": "components/range-slider/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/segmented-button/segmented-button-group.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "SegmentedButtonGroup",
"cssProperties": [
{
"description": "组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
}
],
"slots": [
{
"description": "`<mdui-segmented-button>` 组件",
"name": ""
}
],
"members": [
{
"kind": "field",
"name": "fullWidth",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否填满父元素宽度",
"attribute": "full-width",
"reflects": true
},
{
"kind": "field",
"name": "selects",
"type": {
"text": "| /*单选*/ 'single'\n | /*多选*/ 'multiple' | undefined"
},
"privacy": "public",
"description": "分段按钮的可选中状态，默认为不可选中。可选值包括：\n\n* `single`：单选\n* `multiple`：多选",
"attribute": "selects",
"reflects": true
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否为禁用状态",
"attribute": "disabled",
"reflects": true
},
{
"kind": "field",
"name": "required",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "提交表单时，是否必须选中",
"attribute": "required",
"reflects": true
},
{
"kind": "field",
"name": "form",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"attribute": "form",
"reflects": true
},
{
"kind": "field",
"name": "name",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "提交表单时的名称，将与表单数据一起提交",
"attribute": "name",
"reflects": true
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string | string[]"
},
"privacy": "public",
"default": "''",
"description": "当前选中的 `<mdui-segmented-button>` 的值。\n\n**Note**：该属性的 HTML 属性始终为字符串，且仅在 `selects=\"single\"` 时可以通过 HTML 属性设置初始值。该属性的 JavaScript 属性值在 `selects=\"single\"` 时为字符串，在 `selects=\"multiple\"` 时为字符串数组。所以，在 `selects=\"multiple\"` 时，如果要修改该值，只能通过修改 JavaScript 属性值实现。",
"attribute": "value"
},
{
"kind": "field",
"name": "defaultValue",
"type": {
"text": "string | string[]"
},
"privacy": "public",
"default": "''",
"description": "默认选中的值。在重置表单时，将重置为该默认值。该属性只能通过 JavaScript 属性设置"
},
{
"kind": "field",
"name": "selectedKeys",
"type": {
"text": "number[]"
},
"privacy": "private",
"default": "[]"
},
{
"kind": "field",
"name": "invalid",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否验证未通过"
},
{
"kind": "field",
"name": "isInitial",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "true"
},
{
"kind": "field",
"name": "inputRef",
"type": {
"text": "Ref<HTMLSelectElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "formController",
"privacy": "private",
"readonly": true,
"default": "new FormController(this)"
},
{
"kind": "field",
"name": "definedController",
"privacy": "private",
"readonly": true,
"default": "new DefinedController(this, { relatedElements: ['mdui-segmented-button'], })"
},
{
"kind": "field",
"name": "validity",
"type": {
"text": "ValidityState"
},
"privacy": "public",
"description": "表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)",
"readonly": true
},
{
"kind": "field",
"name": "validationMessage",
"type": {
"text": "string"
},
"privacy": "public",
"description": "如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串",
"readonly": true
},
{
"kind": "field",
"name": "items",
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "itemsEnabled",
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "isSingle",
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "isMultiple",
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "isSelectable",
"privacy": "private",
"readonly": true
},
{
"kind": "method",
"name": "onSelectsChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onSelectedKeysChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onValueChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onInvalidChange",
"privacy": "private"
},
{
"kind": "method",
"name": "checkValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`"
},
{
"kind": "method",
"name": "reportValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。\n\n如果验证未通过，还会在组件上显示验证失败的提示。"
},
{
"kind": "method",
"name": "setCustomValidity",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "message",
"type": {
"text": "string"
},
"description": "自定义的错误提示文本"
}
],
"description": "设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证"
},
{
"kind": "method",
"name": "selectOne",
"privacy": "private",
"parameters": [
{
"name": "item",
"type": {
"text": "SegmentedButton"
}
}
]
},
{
"kind": "method",
"name": "onClick",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "MouseEvent"
}
}
]
},
{
"kind": "method",
"name": "onInputKeyDown",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "KeyboardEvent"
}
}
],
"description": "在隐藏的 `<input>` 或 `<select>` 上按下按键时，切换选中状态\n通常为验证不通过时，默认聚焦到 `<input>` 或 `<select>` 上，此时按下按键，切换第一个元素的选中状态"
},
{
"kind": "method",
"name": "onSlotChange",
"privacy": "private"
},
{
"kind": "method",
"name": "setSelectedKeys",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "selectedKeys",
"type": {
"text": "number[]"
}
}
]
},
{
"kind": "method",
"name": "setValue",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "value",
"type": {
"text": "string | string[]"
}
}
]
},
{
"kind": "method",
"name": "updateItems",
"privacy": "private",
"parameters": [
{
"name": "slotChange",
"default": "false",
"type": {
"text": "boolean"
}
}
]
}
],
"events": [
{
"description": "选中的值变更时触发",
"name": "change"
},
{
"description": "表单字段验证未通过时触发",
"name": "invalid"
}
],
"attributes": [
{
"name": "full-width",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否填满父元素宽度",
"fieldName": "fullWidth"
},
{
"name": "selects",
"type": {
"text": "| /*单选*/ 'single'\n | /*多选*/ 'multiple' | undefined"
},
"description": "分段按钮的可选中状态，默认为不可选中。可选值包括：\n\n* `single`：单选\n* `multiple`：多选",
"fieldName": "selects"
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否为禁用状态",
"fieldName": "disabled"
},
{
"name": "required",
"type": {
"text": "boolean"
},
"default": "false",
"description": "提交表单时，是否必须选中",
"fieldName": "required"
},
{
"name": "form",
"type": {
"text": "string | undefined"
},
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"fieldName": "form"
},
{
"name": "name",
"type": {
"text": "string"
},
"default": "''",
"description": "提交表单时的名称，将与表单数据一起提交",
"fieldName": "name"
},
{
"name": "value",
"type": {
"text": "string | string[]"
},
"default": "''",
"description": "当前选中的 `<mdui-segmented-button>` 的值。\n\n**Note**：该属性的 HTML 属性始终为字符串，且仅在 `selects=\"single\"` 时可以通过 HTML 属性设置初始值。该属性的 JavaScript 属性值在 `selects=\"single\"` 时为字符串，在 `selects=\"multiple\"` 时为字符串数组。所以，在 `selects=\"multiple\"` 时，如果要修改该值，只能通过修改 JavaScript 属性值实现。",
"fieldName": "value"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "分段按钮组件。需配合 `<mdui-segmented-button>` 组件使用\n\n```html\n<mdui-segmented-button-group>\n..<mdui-segmented-button>Day</mdui-segmented-button>\n..<mdui-segmented-button>Week</mdui-segmented-button>\n..<mdui-segmented-button>Month</mdui-segmented-button>\n</mdui-segmented-button-group>\n```",
"tagName": "mdui-segmented-button-group",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "SegmentedButtonGroup",
"declaration": {
"name": "SegmentedButtonGroup",
"module": "components/segmented-button/segmented-button-group.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-segmented-button-group",
"declaration": {
"name": "SegmentedButtonGroup",
"module": "components/segmented-button/segmented-button-group.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/segmented-button/segmented-button.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "SegmentedButton",
"cssParts": [
{
"description": "内部的 `<button>` 或 `<a>` 元素",
"name": "button"
},
{
"description": "左侧的图标",
"name": "icon"
},
{
"description": "选中状态的左侧图标",
"name": "selected-icon"
},
{
"description": "右侧的图标",
"name": "end-icon"
},
{
"description": "文本内容",
"name": "label"
},
{
"description": "加载中状态的 `<mdui-circular-progress>` 元素",
"name": "loading"
}
],
"slots": [
{
"description": "分段按钮项的文本内容",
"name": ""
},
{
"description": "分段按钮项的左侧图标",
"name": "icon"
},
{
"description": "选中状态的左侧图标",
"name": "selected-icon"
},
{
"description": "分段按钮项的右侧图标",
"name": "end-icon"
}
],
"members": [
{
"kind": "field",
"name": "icon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "左侧的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"attribute": "icon",
"reflects": true
},
{
"kind": "field",
"name": "endIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "右侧的 Material Icons 图标名。也可以通过 `slot=\"end-icon\"` 设置",
"attribute": "end-icon",
"reflects": true
},
{
"kind": "field",
"name": "selectedIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "选中状态的 Material Icons 图标名。也可以通过 `slot=\"selected-icon\"` 设置",
"attribute": "selected-icon",
"reflects": true
},
{
"kind": "field",
"name": "selected",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"description": "是否选中该分段按钮项，由 <mdui-segmented-button-group> 组件控制该参数",
"attribute": "selected",
"reflects": true
},
{
"kind": "field",
"name": "invalid",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"description": "是否验证未通过。由 <mdui-segmented-button-group> 控制该参数",
"attribute": "invalid",
"reflects": true
},
{
"kind": "field",
"name": "groupDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"attribute": "group-disabled",
"reflects": true
},
{
"kind": "field",
"name": "key",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "rippleRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController( this, '[default]', 'icon', 'end-icon', )"
},
{
"kind": "field",
"name": "rippleElement",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "isDisabled",
"privacy": "private",
"return": {
"type": {
"text": "boolean"
}
}
},
{
"kind": "method",
"name": "renderIcon",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderLabel",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderEndIcon",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderInner",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult[]"
}
}
},
{
"kind": "field",
"name": "href",
"type": {
"text": "string"
},
"privacy": "public",
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"attribute": "href",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "download",
"type": {
"text": "string"
},
"privacy": "public",
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "download",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"privacy": "public",
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"attribute": "target",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"privacy": "public",
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"attribute": "rel",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "renderAnchor",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n refDirective,\n tabIndex,\n }",
"type": {
"text": "RenderAnchorOptions"
}
}
],
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否禁用",
"attribute": "disabled",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "loading",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否处于加载中状态",
"attribute": "loading",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "name",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "按钮的名称，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"attribute": "name",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "按钮的初始值，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"attribute": "value",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "type",
"type": {
"text": "| /*此按钮将表单数据提交给服务器*/ 'submit'\n | /*此按钮重置所有组件为初始值*/ 'reset'\n | /*此按钮没有默认行为*/ 'button'"
},
"privacy": "public",
"default": "'button'",
"description": "按钮的类型。默认类型为 `button`。可选类型包括：\n\n* `submit`：点击按钮会提交表单数据到服务器\n* `reset`：点击按钮会将表单中的所有字段重置为初始值\n* `button`：此类型的按钮没有默认行为\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"attribute": "type",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "form",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"attribute": "form",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formAction",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "指定提交表单的 URL。\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `action` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formaction",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formEnctype",
"type": {
"text": "| /*未指定该属性时的默认值*/ 'application/x-www-form-urlencoded'\n | /*当表单包含 `<input type=\"file\">` 元素时使用*/ 'multipart/form-data'\n | /*HTML5 新增，用于调试*/ 'text/plain' | undefined"
},
"privacy": "public",
"description": "指定提交表单到服务器的内容类型。可选值包括：\n\n* `application/x-www-form-urlencoded`：未指定该属性时的默认值\n* `multipart/form-data`：当表单包含 `<input type=\"file\">` 元素时使用\n* `text/plain`：HTML5 新增，用于调试\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `enctype` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formenctype",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formMethod",
"type": {
"text": "| /*表单数据包含在表单内容中，发送到服务器*/ 'post'\n | /*表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法*/ 'get' | undefined"
},
"privacy": "public",
"description": "指定提交表单时使用的 HTTP 方法。可选值包括：\n\n* `post`：表单数据包含在表单内容中，发送到服务器\n* `get`：表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `method` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formmethod",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formNoValidate",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "如果设置了此属性，表单提交时将不执行表单验证。\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `novalidate` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formnovalidate",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formTarget",
"type": {
"text": "| /*默认选项，在当前框架中打开*/ '_self'\n | /*在新窗口中打开*/ '_blank'\n | /*在父框架中打开*/ '_parent'\n | /*在整个窗口中打开*/ '_top' | undefined"
},
"privacy": "public",
"description": "提交表单后接收到的响应应显示在何处。可选值包括：\n\n* `_self`：默认选项，在当前框架中打开\n* `_blank`：在新窗口中打开\n* `_parent`：在父框架中打开\n* `_top`：在整个窗口中打开\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `target` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"attribute": "formtarget",
"reflects": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "formController",
"privacy": "private",
"readonly": true,
"default": "new FormController(this)",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "validity",
"type": {
"text": "ValidityState | undefined"
},
"privacy": "public",
"description": "表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "field",
"name": "validationMessage",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串",
"readonly": true,
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "checkValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "reportValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。\n\n如果验证未通过，还会在组件上显示验证失败的提示。",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "setCustomValidity",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "message",
"type": {
"text": "string"
},
"description": "自定义的错误提示文本"
}
],
"description": "设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "renderLoading",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "renderButton",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "{\n id,\n className,\n part,\n content = html`<slot></slot>`,\n }",
"type": {
"text": "RenderButtonOptions"
}
}
],
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"kind": "method",
"name": "isButton",
"privacy": "protected",
"return": {
"type": {
"text": "boolean"
}
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"description": "表单字段验证未通过时触发",
"name": "invalid"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
}
],
"attributes": [
{
"name": "icon",
"type": {
"text": "string | undefined"
},
"description": "左侧的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"fieldName": "icon"
},
{
"name": "end-icon",
"type": {
"text": "string | undefined"
},
"description": "右侧的 Material Icons 图标名。也可以通过 `slot=\"end-icon\"` 设置",
"fieldName": "endIcon"
},
{
"name": "selected-icon",
"type": {
"text": "string | undefined"
},
"description": "选中状态的 Material Icons 图标名。也可以通过 `slot=\"selected-icon\"` 设置",
"fieldName": "selectedIcon"
},
{
"name": "selected",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否选中该分段按钮项，由 <mdui-segmented-button-group> 组件控制该参数",
"fieldName": "selected"
},
{
"name": "invalid",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否验证未通过。由 <mdui-segmented-button-group> 控制该参数",
"fieldName": "invalid"
},
{
"name": "group-disabled",
"type": {
"text": "boolean"
},
"default": "false",
"fieldName": "groupDisabled"
},
{
"name": "href",
"type": {
"text": "string"
},
"description": "链接的目标 URL。\n\n如果设置了此属性，组件内部将渲染为 `<a>` 元素，并可以使用链接相关的属性。",
"fieldName": "href",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "download",
"type": {
"text": "string"
},
"description": "下载链接的目标。\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "download",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "target",
"type": {
"text": "| /*在新窗口中打开链接*/ '_blank'\n | /*在父框架中打开链接*/ '_parent'\n | /*默认。在当前框架中打开链接*/ '_self'\n | /*在整个窗口中打开链接*/ '_top'"
},
"description": "链接的打开方式。可选值包括：\n\n* `_blank`：在新窗口中打开链接\n* `_parent`：在父框架中打开链接\n* `_self`：默认。在当前框架中打开链接\n* `_top`：在整个窗口中打开链接\n\n**Note**：仅在设置了 `href` 属性时，此属性才有效。",
"fieldName": "target",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "rel",
"type": {
"text": "| /*当前文档的替代版本*/ 'alternate'\n | /*当前文档或文章的作者*/ 'author'\n | /*永久链接到最近的祖先章节*/ 'bookmark'\n | /*引用的文档与当前文档不在同一站点*/ 'external'\n | /*链接到相关的帮助文档*/ 'help'\n | /*当前文档的主要内容由被引用文件的版权许可覆盖*/ 'license'\n | /*当前文档代表链接内容的所有者*/ 'me'\n | /*当前文档是系列中的一部分，被引用的文档是系列的下一个文档*/ 'next'\n | /*当前文档的作者或发布者不认可被引用的文件*/ 'nofollow'\n | /*不包含 `Referer` 头。类似于 `noopener` 的效果*/ 'noreferrer'\n | /*如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文*/ 'opener'\n | /*当前文档是系列的一部分，被引用的文档是系列的上一个文档*/ 'prev'\n | /*提供一个资源链接，可用于搜索当前文件及其相关页面*/ 'search'\n | /*提供一个适用于当前文档的标签（由给定地址识别）*/ 'tag'"
},
"description": "当前文档与被链接文档之间的关系。可选值包括：\n\n* `alternate`：当前文档的替代版本\n* `author`：当前文档或文章的作者\n* `bookmark`：永久链接到最近的祖先章节\n* `external`：引用的文档与当前文档不在同一站点\n* `help`：链接到相关的帮助文档\n* `license`：当前文档的主要内容由被引用文件的版权许可覆盖\n* `me`：当前文档代表链接内容的所有者\n* `next`：当前文档是系列中的一部分，被引用的文档是系列的下一个文档\n* `nofollow`：当前文档的作者或发布者不认可被引用的文件\n* `noreferrer`：不包含 `Referer` 头。类似于 `noopener` 的效果\n* `opener`：如果超链接会创建一个顶级浏览上下文（即 `target` 属性值为 `_blank`），则创建一个辅助浏览上下文\n* `prev`：当前文档是系列的一部分，被引用的文档是系列的上一个文档\n* `search`：提供一个资源链接，可用于搜索当前文件及其相关页面\n* `tag`：提供一个适用于当前文档的标签（由给定地址识别）\n\n**Note**：仅在指定了 `href` 属性时可用。",
"fieldName": "rel",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否禁用",
"fieldName": "disabled",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "loading",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否处于加载中状态",
"fieldName": "loading",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "name",
"type": {
"text": "string"
},
"default": "''",
"description": "按钮的名称，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"fieldName": "name",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "value",
"type": {
"text": "string"
},
"default": "''",
"description": "按钮的初始值，将与表单数据一起提交。\n\n**Note**：仅在未设置 `href` 属性时，此属性才有效。",
"fieldName": "value",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "type",
"type": {
"text": "| /*此按钮将表单数据提交给服务器*/ 'submit'\n | /*此按钮重置所有组件为初始值*/ 'reset'\n | /*此按钮没有默认行为*/ 'button'"
},
"default": "'button'",
"description": "按钮的类型。默认类型为 `button`。可选类型包括：\n\n* `submit`：点击按钮会提交表单数据到服务器\n* `reset`：点击按钮会将表单中的所有字段重置为初始值\n* `button`：此类型的按钮没有默认行为\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"fieldName": "type",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "form",
"type": {
"text": "string | undefined"
},
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。\n\n**Note**：仅在未指定 `href` 属性时，此属性才有效。",
"fieldName": "form",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formaction",
"type": {
"text": "string | undefined"
},
"description": "指定提交表单的 URL。\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `action` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formAction",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formenctype",
"type": {
"text": "| /*未指定该属性时的默认值*/ 'application/x-www-form-urlencoded'\n | /*当表单包含 `<input type=\"file\">` 元素时使用*/ 'multipart/form-data'\n | /*HTML5 新增，用于调试*/ 'text/plain' | undefined"
},
"description": "指定提交表单到服务器的内容类型。可选值包括：\n\n* `application/x-www-form-urlencoded`：未指定该属性时的默认值\n* `multipart/form-data`：当表单包含 `<input type=\"file\">` 元素时使用\n* `text/plain`：HTML5 新增，用于调试\n\n如果指定了此属性，将覆盖 `<form>` 元素的 `enctype` 属性。\n\n**Note**：仅在未指定 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formEnctype",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formmethod",
"type": {
"text": "| /*表单数据包含在表单内容中，发送到服务器*/ 'post'\n | /*表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法*/ 'get' | undefined"
},
"description": "指定提交表单时使用的 HTTP 方法。可选值包括：\n\n* `post`：表单数据包含在表单内容中，发送到服务器\n* `get`：表单数据以 `?` 作为分隔符附加到表单的 URI 属性中，生成的 URI 发送到服务器。当表单没有副作用，并且仅包含 ASCII 字符时，使用此方法\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `method` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formMethod",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formnovalidate",
"type": {
"text": "boolean"
},
"default": "false",
"description": "如果设置了此属性，表单提交时将不执行表单验证。\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `novalidate` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formNoValidate",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
},
{
"name": "formtarget",
"type": {
"text": "| /*默认选项，在当前框架中打开*/ '_self'\n | /*在新窗口中打开*/ '_blank'\n | /*在父框架中打开*/ '_parent'\n | /*在整个窗口中打开*/ '_top' | undefined"
},
"description": "提交表单后接收到的响应应显示在何处。可选值包括：\n\n* `_self`：默认选项，在当前框架中打开\n* `_blank`：在新窗口中打开\n* `_parent`：在父框架中打开\n* `_top`：在整个窗口中打开\n\n如果设置了此属性，将覆盖 `<form>` 元素的 `target` 属性。\n\n**Note**：仅在未设置 `href` 属性且 `type=\"submit\"` 时，此属性才有效。",
"fieldName": "formTarget",
"inheritedFrom": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
}
}
],
"superclass": {
"name": "ButtonBase",
"module": "components/button/button-base.js"
},
"summary": "分段按钮项组件。需配合 `<mdui-segmented-button-group>` 组件使用\n\n```html\n<mdui-segmented-button-group>\n..<mdui-segmented-button>Day</mdui-segmented-button>\n..<mdui-segmented-button>Week</mdui-segmented-button>\n..<mdui-segmented-button>Month</mdui-segmented-button>\n</mdui-segmented-button-group>\n```",
"tagName": "mdui-segmented-button",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "SegmentedButton",
"declaration": {
"name": "SegmentedButton",
"module": "components/segmented-button/segmented-button.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-segmented-button",
"declaration": {
"name": "SegmentedButton",
"module": "components/segmented-button/segmented-button.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/select/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Select",
"cssParts": [
{
"description": "多选时，放置选中值对应的 chip 的容器",
"name": "chips"
},
{
"description": "多选时，每一个选中的值对应的 chip",
"name": "chip"
},
{
"description": "chip 内部的 `<button>` 元素",
"name": "chip__button"
},
{
"description": "chip 内部的文本",
"name": "chip__label"
},
{
"description": "chip 内部的删除图标",
"name": "chip__delete-icon"
},
{
"description": "文本框，即 [`<mdui-text-field>`](/docs/2/components/text-field) 元素",
"name": "text-field"
},
{
"description": "text-field 内部的文本框容器",
"name": "text-field__container"
},
{
"description": "text-field 内部的左侧图标",
"name": "text-field__icon"
},
{
"description": "text-field 内部的右侧图标",
"name": "text-field__end-icon"
},
{
"description": "text-field 内部的验证失败状态的右侧图标",
"name": "text-field__error-icon"
},
{
"description": "text-field 内部的左侧文本",
"name": "text-field__prefix"
},
{
"description": "text-field 内部的右侧文本",
"name": "text-field__suffix"
},
{
"description": "text-field 内部的标签文本",
"name": "text-field__label"
},
{
"description": "text-field 内部的 `<input>` 元素",
"name": "text-field__input"
},
{
"description": "text-field 内部的清空按钮",
"name": "text-field__clear-button"
},
{
"description": "text-field 内部的清空按钮中的图标",
"name": "text-field__clear-icon"
},
{
"description": "text-field 内部的底部辅助信息容器，包括 helper 和 error",
"name": "text-field__supporting"
},
{
"description": "text-field 内部的底部帮助文本",
"name": "text-field__helper"
},
{
"description": "text-field 内部的底部错误描述文本",
"name": "text-field__error"
},
{
"description": "下拉菜单，即 [`<mdui-menu>`](/docs/2/components/menu) 元素",
"name": "menu"
}
],
"slots": [
{
"description": "`<mdui-menu-item>` 元素",
"name": ""
},
{
"description": "左侧图标",
"name": "icon"
},
{
"description": "右侧图标",
"name": "end-icon"
},
{
"description": "验证失败状态的右侧图标",
"name": "error-icon"
},
{
"description": "左侧文本",
"name": "prefix"
},
{
"description": "右侧文本",
"name": "suffix"
},
{
"description": "清空按钮",
"name": "clear-button"
},
{
"description": "清空按钮中的图标",
"name": "clear-icon"
},
{
"description": "底部的帮助文本",
"name": "helper"
}
],
"members": [
{
"kind": "field",
"name": "variant",
"type": {
"text": "| /*带背景色的选择框，视觉效果较强*/ 'filled'\n | /*带边框的选择框，视觉效果较弱*/ 'outlined'"
},
"privacy": "public",
"default": "'filled'",
"description": "选择框的样式。可选值包括：\n\n* `filled`：带背景色的选择框，视觉效果较强\n* `outlined`：带边框的选择框，视觉效果较弱",
"attribute": "variant",
"reflects": true
},
{
"kind": "field",
"name": "multiple",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否支持多选",
"attribute": "multiple",
"reflects": true
},
{
"kind": "field",
"name": "name",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "选择框的名称，将与表单数据一起提交",
"attribute": "name",
"reflects": true
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string | string[]"
},
"privacy": "public",
"default": "''",
"description": "选择框的值，将与表单数据一起提交。\n\n如果未指定 `multiple` 属性，该值为字符串；如果指定了 `multiple` 属性，该值为字符串数组。HTML 属性只能设置字符串值；如果需要设置数组值，请通过 JavaScript 属性设置。",
"attribute": "value"
},
{
"kind": "field",
"name": "defaultValue",
"type": {
"text": "string | string[]"
},
"privacy": "public",
"default": "''",
"description": "默认选中的值。在重置表单时，将重置为该默认值。该属性只能通过 JavaScript 属性设置"
},
{
"kind": "field",
"name": "label",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "标签文本",
"attribute": "label",
"reflects": true
},
{
"kind": "field",
"name": "placeholder",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "占位符文本",
"attribute": "placeholder",
"reflects": true
},
{
"kind": "field",
"name": "helper",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "选择框底部的帮助文本。也可以通过 `slot=\"helper\"` 设置",
"attribute": "helper",
"reflects": true
},
{
"kind": "field",
"name": "clearable",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否可以清空选择框",
"attribute": "clearable",
"reflects": true
},
{
"kind": "field",
"name": "clearIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "当选择框可清空时，显示在选择框右侧的清空按钮的 Material Icons 图标名。也可以通过 `slot=\"clear-icon\"` 设置",
"attribute": "clear-icon",
"reflects": true
},
{
"kind": "field",
"name": "placement",
"type": {
"text": "| /*自动判断位置*/ 'auto'\n | /*位于下方*/ 'bottom'\n | /*位于上方*/ 'top'"
},
"privacy": "public",
"default": "'auto'",
"description": "选择框的位置。可选值包括：\n\n* `auto`：自动判断位置\n* `bottom`：位于下方\n* `top`：位于上方",
"attribute": "placement",
"reflects": true
},
{
"kind": "field",
"name": "endAligned",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "文本是否右对齐",
"attribute": "end-aligned",
"reflects": true
},
{
"kind": "field",
"name": "prefix",
"type": {
"text": "string"
},
"privacy": "public",
"description": "选择框的前缀文本。仅在聚焦状态，或选择框有值时才会显示。也可以通过 `slot=\"prefix\"` 设置",
"attribute": "prefix",
"reflects": true
},
{
"kind": "field",
"name": "suffix",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "选择框的后缀文本。仅在聚焦状态，或选择框有值时才会显示。也可以通过 `slot=\"suffix\"` 设置",
"attribute": "suffix",
"reflects": true
},
{
"kind": "field",
"name": "icon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "选择框的前缀图标的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"attribute": "icon",
"reflects": true
},
{
"kind": "field",
"name": "endIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "选择框的后缀图标的 Material Icons 图标名。也可以通过 `slot=\"end-icon\"` 设置",
"attribute": "end-icon",
"reflects": true
},
{
"kind": "field",
"name": "errorIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "表单字段验证失败时，显示在选择框右侧的 Material Icons 图标名。也可以通过 `slot=\"error-icon\"` 设置",
"attribute": "error-icon",
"reflects": true
},
{
"kind": "field",
"name": "form",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"attribute": "form",
"reflects": true
},
{
"kind": "field",
"name": "readonly",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否为只读状态",
"attribute": "readonly",
"reflects": true
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否为禁用状态",
"attribute": "disabled",
"reflects": true
},
{
"kind": "field",
"name": "required",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "提交表单时，是否必须填写该字段",
"attribute": "required",
"reflects": true
},
{
"kind": "field",
"name": "invalid",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否验证未通过\n\n该验证为浏览器原生验证 API，基于 `required` 属性的验证结果"
},
{
"kind": "field",
"name": "menuItems",
"type": {
"text": "MenuItem[]"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "observeResize",
"type": {
"text": "ObserveResize | undefined"
},
"privacy": "private"
},
{
"kind": "field",
"name": "menuRef",
"type": {
"text": "Ref<Menu>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "textFieldRef",
"type": {
"text": "Ref<TextField>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "hiddenInputRef",
"type": {
"text": "Ref<HTMLInputElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "formController",
"privacy": "private",
"readonly": true,
"default": "new FormController(this)"
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController( this, 'icon', 'end-icon', 'error-icon', 'prefix', 'suffix', 'clear-button', 'clear-icon', 'helper', )"
},
{
"kind": "field",
"name": "definedController",
"privacy": "private",
"readonly": true,
"default": "new DefinedController(this, { relatedElements: ['mdui-menu-item'], })"
},
{
"kind": "field",
"name": "validity",
"type": {
"text": "ValidityState"
},
"privacy": "public",
"description": "表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)",
"readonly": true
},
{
"kind": "field",
"name": "validationMessage",
"type": {
"text": "string"
},
"privacy": "public",
"description": "如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串",
"readonly": true
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "checkValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`"
},
{
"kind": "method",
"name": "reportValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。\n\n如果验证未通过，还会在组件上显示验证失败的提示。"
},
{
"kind": "method",
"name": "setCustomValidity",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "message",
"type": {
"text": "string"
},
"description": "自定义的错误提示文本"
}
],
"description": "设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证"
},
{
"kind": "method",
"name": "getMenuItemLabelByValue",
"privacy": "private",
"parameters": [
{
"name": "valueItem",
"type": {
"text": "string"
}
}
]
},
{
"kind": "method",
"name": "resizeMenu",
"privacy": "private"
},
{
"kind": "method",
"name": "onDropdownOpen",
"privacy": "private"
},
{
"kind": "method",
"name": "onDropdownClose",
"privacy": "private"
},
{
"kind": "method",
"name": "onValueChange",
"privacy": "private",
"parameters": [
{
"name": "e",
"type": {
"text": "Event"
}
}
]
},
{
"kind": "method",
"name": "onDeleteOneValue",
"privacy": "private",
"parameters": [
{
"name": "valueItem",
"type": {
"text": "string"
}
}
],
"description": "multiple 为 true 时，点 chip 的删除按钮，删除其中一个值"
},
{
"kind": "method",
"name": "onClear",
"privacy": "private"
},
{
"kind": "method",
"name": "onTextFieldKeyDown",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "KeyboardEvent"
}
}
],
"description": "焦点在 text-field 上时，按下回车键，打开下拉选项"
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"description": "选中的值变更时触发",
"name": "change"
},
{
"description": "表单字段验证未通过时触发",
"name": "invalid"
},
{
"description": "在点击由 `clearable` 属性生成的清空按钮时触发。可以通过调用 `event.preventDefault()` 阻止清空选择框",
"name": "clear"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"attributes": [
{
"name": "variant",
"type": {
"text": "| /*带背景色的选择框，视觉效果较强*/ 'filled'\n | /*带边框的选择框，视觉效果较弱*/ 'outlined'"
},
"default": "'filled'",
"description": "选择框的样式。可选值包括：\n\n* `filled`：带背景色的选择框，视觉效果较强\n* `outlined`：带边框的选择框，视觉效果较弱",
"fieldName": "variant"
},
{
"name": "multiple",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否支持多选",
"fieldName": "multiple"
},
{
"name": "name",
"type": {
"text": "string"
},
"default": "''",
"description": "选择框的名称，将与表单数据一起提交",
"fieldName": "name"
},
{
"name": "value",
"type": {
"text": "string | string[]"
},
"default": "''",
"description": "选择框的值，将与表单数据一起提交。\n\n如果未指定 `multiple` 属性，该值为字符串；如果指定了 `multiple` 属性，该值为字符串数组。HTML 属性只能设置字符串值；如果需要设置数组值，请通过 JavaScript 属性设置。",
"fieldName": "value"
},
{
"name": "label",
"type": {
"text": "string | undefined"
},
"description": "标签文本",
"fieldName": "label"
},
{
"name": "placeholder",
"type": {
"text": "string | undefined"
},
"description": "占位符文本",
"fieldName": "placeholder"
},
{
"name": "helper",
"type": {
"text": "string | undefined"
},
"description": "选择框底部的帮助文本。也可以通过 `slot=\"helper\"` 设置",
"fieldName": "helper"
},
{
"name": "clearable",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否可以清空选择框",
"fieldName": "clearable"
},
{
"name": "clear-icon",
"type": {
"text": "string | undefined"
},
"description": "当选择框可清空时，显示在选择框右侧的清空按钮的 Material Icons 图标名。也可以通过 `slot=\"clear-icon\"` 设置",
"fieldName": "clearIcon"
},
{
"name": "placement",
"type": {
"text": "| /*自动判断位置*/ 'auto'\n | /*位于下方*/ 'bottom'\n | /*位于上方*/ 'top'"
},
"default": "'auto'",
"description": "选择框的位置。可选值包括：\n\n* `auto`：自动判断位置\n* `bottom`：位于下方\n* `top`：位于上方",
"fieldName": "placement"
},
{
"name": "end-aligned",
"type": {
"text": "boolean"
},
"default": "false",
"description": "文本是否右对齐",
"fieldName": "endAligned"
},
{
"name": "prefix",
"type": {
"text": "string"
},
"description": "选择框的前缀文本。仅在聚焦状态，或选择框有值时才会显示。也可以通过 `slot=\"prefix\"` 设置",
"fieldName": "prefix"
},
{
"name": "suffix",
"type": {
"text": "string | undefined"
},
"description": "选择框的后缀文本。仅在聚焦状态，或选择框有值时才会显示。也可以通过 `slot=\"suffix\"` 设置",
"fieldName": "suffix"
},
{
"name": "icon",
"type": {
"text": "string | undefined"
},
"description": "选择框的前缀图标的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"fieldName": "icon"
},
{
"name": "end-icon",
"type": {
"text": "string | undefined"
},
"description": "选择框的后缀图标的 Material Icons 图标名。也可以通过 `slot=\"end-icon\"` 设置",
"fieldName": "endIcon"
},
{
"name": "error-icon",
"type": {
"text": "string | undefined"
},
"description": "表单字段验证失败时，显示在选择框右侧的 Material Icons 图标名。也可以通过 `slot=\"error-icon\"` 设置",
"fieldName": "errorIcon"
},
{
"name": "form",
"type": {
"text": "string | undefined"
},
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"fieldName": "form"
},
{
"name": "readonly",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否为只读状态",
"fieldName": "readonly"
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否为禁用状态",
"fieldName": "disabled"
},
{
"name": "required",
"type": {
"text": "boolean"
},
"default": "false",
"description": "提交表单时，是否必须填写该字段",
"fieldName": "required"
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"mixins": [
{
"name": "FocusableMixin",
"package": "@mdui/shared/mixins/focusable.js"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "选择框组件。需配合 `<mdui-menu-item>` 组件使用\n\n```html\n<mdui-select>\n..<mdui-menu-item value=\"item-1\">Item 1</mdui-menu-item>\n..<mdui-menu-item value=\"item-2\">Item 2</mdui-menu-item>\n</mdui-select>\n```",
"tagName": "mdui-select",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Select",
"declaration": {
"name": "Select",
"module": "components/select/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-select",
"declaration": {
"name": "Select",
"module": "components/select/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/slider/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Slider",
"cssParts": [
{
"description": "未激活状态的轨道",
"name": "track-inactive"
},
{
"description": "已激活状态的轨道",
"name": "track-active"
},
{
"description": "操作杆",
"name": "handle"
},
{
"description": "提示文本",
"name": "label"
},
{
"description": "刻度标记",
"name": "tickmark"
}
],
"members": [
{
"kind": "field",
"name": "value",
"type": {
"text": "number"
},
"privacy": "public",
"default": "0",
"description": "滑块的值，将于表单数据一起提交",
"attribute": "value"
},
{
"kind": "field",
"name": "defaultValue",
"type": {
"text": "number"
},
"privacy": "public",
"default": "0",
"description": "默认值。在重置表单时，将重置为该默认值。该属性只能通过 JavaScript 属性设置"
},
{
"kind": "field",
"name": "rippleRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "handleRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "formController",
"privacy": "private",
"readonly": true,
"default": "new FormController(this)"
},
{
"kind": "field",
"name": "rippleElement",
"privacy": "protected",
"readonly": true
},
{
"kind": "method",
"name": "onValueChange",
"privacy": "private"
},
{
"kind": "method",
"name": "updateStyle",
"privacy": "private"
},
{
"kind": "method",
"name": "onInput",
"privacy": "private"
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true,
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement"
},
"privacy": "protected",
"readonly": true,
"description": "最终获得焦点的元素",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "min",
"type": {
"text": "number"
},
"privacy": "public",
"default": "0",
"description": "滑块的最小值，默认为 `0`",
"attribute": "min",
"reflects": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "max",
"type": {
"text": "number"
},
"privacy": "public",
"default": "100",
"description": "滑块的最大值，默认为 `100`",
"attribute": "max",
"reflects": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "step",
"type": {
"text": "number"
},
"privacy": "public",
"default": "1",
"description": "步进间隔，默认为 `1`",
"attribute": "step",
"reflects": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "tickmarks",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否添加刻度标记",
"attribute": "tickmarks",
"reflects": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "nolabel",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否隐藏文本提示",
"attribute": "nolabel",
"reflects": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否被禁用",
"attribute": "disabled",
"reflects": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "form",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"attribute": "form",
"reflects": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "name",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "滑块的名称，该名称将与表单数据一起提交",
"attribute": "name",
"reflects": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "invalid",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"description": "是否验证未通过\n\n该验证为根据是否通过 `setCustomValidity` 方法设置了值，来判断是否验证通过",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "labelVisible",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "inputRef",
"type": {
"text": "Ref<HTMLInputElement>"
},
"privacy": "protected",
"readonly": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "trackActiveRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "protected",
"readonly": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "validity",
"type": {
"text": "ValidityState"
},
"privacy": "public",
"description": "表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)",
"readonly": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "validationMessage",
"type": {
"text": "string"
},
"privacy": "public",
"description": "如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串",
"readonly": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true,
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "field",
"name": "labelFormatter",
"type": {
"text": "(value: number) => string"
},
"privacy": "public",
"description": "用于自定义标签的显示格式的函数。函数参数为滑块的当前值，返回值为期望显示的文本。",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "onDisabledChange",
"privacy": "private",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "checkValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "reportValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。\n\n如果验证未通过，还会在组件上显示验证失败的提示。",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "setCustomValidity",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "message",
"type": {
"text": "string"
},
"description": "自定义的错误提示文本"
}
],
"description": "设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "fixValue",
"privacy": "protected",
"return": {
"type": {
"text": "number"
}
},
"parameters": [
{
"name": "value",
"type": {
"text": "number"
}
}
],
"description": "value 不在 min、max 或 step 的限制范围内时，修正 value 的值",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "getCandidateValues",
"privacy": "protected",
"description": "获取候选值组成的数组",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "renderLabel",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "value",
"type": {
"text": "number"
}
}
],
"description": "渲染浮动标签",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"kind": "method",
"name": "onChange",
"privacy": "protected",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"description": "在值发生变更，且失去焦点时，将触发该事件",
"name": "change"
},
{
"description": "值变更时触发",
"name": "input"
},
{
"description": "表单字段验证未通过时触发",
"name": "invalid"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"attributes": [
{
"name": "value",
"type": {
"text": "number"
},
"default": "0",
"description": "滑块的值，将于表单数据一起提交",
"fieldName": "value"
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "min",
"type": {
"text": "number"
},
"default": "0",
"description": "滑块的最小值，默认为 `0`",
"fieldName": "min",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"name": "max",
"type": {
"text": "number"
},
"default": "100",
"description": "滑块的最大值，默认为 `100`",
"fieldName": "max",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"name": "step",
"type": {
"text": "number"
},
"default": "1",
"description": "步进间隔，默认为 `1`",
"fieldName": "step",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"name": "tickmarks",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否添加刻度标记",
"fieldName": "tickmarks",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"name": "nolabel",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否隐藏文本提示",
"fieldName": "nolabel",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否被禁用",
"fieldName": "disabled",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"name": "form",
"type": {
"text": "string | undefined"
},
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"fieldName": "form",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
},
{
"name": "name",
"type": {
"text": "string"
},
"default": "''",
"description": "滑块的名称，该名称将与表单数据一起提交",
"fieldName": "name",
"inheritedFrom": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
}
],
"superclass": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
},
"summary": "滑块组件\n\n```html\n<mdui-slider></mdui-slider>\n```",
"tagName": "mdui-slider",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Slider",
"declaration": {
"name": "Slider",
"module": "components/slider/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-slider",
"declaration": {
"name": "Slider",
"module": "components/slider/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/slider/slider-base.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "SliderBase",
"members": [
{
"kind": "field",
"name": "min",
"type": {
"text": "number"
},
"privacy": "public",
"default": "0",
"description": "滑块的最小值，默认为 `0`",
"attribute": "min",
"reflects": true
},
{
"kind": "field",
"name": "max",
"type": {
"text": "number"
},
"privacy": "public",
"default": "100",
"description": "滑块的最大值，默认为 `100`",
"attribute": "max",
"reflects": true
},
{
"kind": "field",
"name": "step",
"type": {
"text": "number"
},
"privacy": "public",
"default": "1",
"description": "步进间隔，默认为 `1`",
"attribute": "step",
"reflects": true
},
{
"kind": "field",
"name": "tickmarks",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否添加刻度标记",
"attribute": "tickmarks",
"reflects": true
},
{
"kind": "field",
"name": "nolabel",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否隐藏文本提示",
"attribute": "nolabel",
"reflects": true
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否被禁用",
"attribute": "disabled",
"reflects": true
},
{
"kind": "field",
"name": "form",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"attribute": "form",
"reflects": true
},
{
"kind": "field",
"name": "name",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "滑块的名称，该名称将与表单数据一起提交",
"attribute": "name",
"reflects": true
},
{
"kind": "field",
"name": "invalid",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"description": "是否验证未通过\n\n该验证为根据是否通过 `setCustomValidity` 方法设置了值，来判断是否验证通过"
},
{
"kind": "field",
"name": "labelVisible",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false"
},
{
"kind": "field",
"name": "inputRef",
"type": {
"text": "Ref<HTMLInputElement>"
},
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "trackActiveRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "validity",
"type": {
"text": "ValidityState"
},
"privacy": "public",
"description": "表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)",
"readonly": true
},
{
"kind": "field",
"name": "validationMessage",
"type": {
"text": "string"
},
"privacy": "public",
"description": "如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串",
"readonly": true
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "labelFormatter",
"type": {
"text": "(value: number) => string"
},
"privacy": "public",
"description": "用于自定义标签的显示格式的函数。函数参数为滑块的当前值，返回值为期望显示的文本。"
},
{
"kind": "method",
"name": "onDisabledChange",
"privacy": "private"
},
{
"kind": "method",
"name": "checkValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`"
},
{
"kind": "method",
"name": "reportValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。\n\n如果验证未通过，还会在组件上显示验证失败的提示。"
},
{
"kind": "method",
"name": "setCustomValidity",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "message",
"type": {
"text": "string"
},
"description": "自定义的错误提示文本"
}
],
"description": "设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证"
},
{
"kind": "method",
"name": "fixValue",
"privacy": "protected",
"return": {
"type": {
"text": "number"
}
},
"parameters": [
{
"name": "value",
"type": {
"text": "number"
}
}
],
"description": "value 不在 min、max 或 step 的限制范围内时，修正 value 的值"
},
{
"kind": "method",
"name": "getCandidateValues",
"privacy": "protected",
"description": "获取候选值组成的数组"
},
{
"kind": "method",
"name": "renderLabel",
"privacy": "protected",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "value",
"type": {
"text": "number"
}
}
],
"description": "渲染浮动标签"
},
{
"kind": "method",
"name": "onChange",
"privacy": "protected"
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"attributes": [
{
"name": "min",
"type": {
"text": "number"
},
"default": "0",
"description": "滑块的最小值，默认为 `0`",
"fieldName": "min"
},
{
"name": "max",
"type": {
"text": "number"
},
"default": "100",
"description": "滑块的最大值，默认为 `100`",
"fieldName": "max"
},
{
"name": "step",
"type": {
"text": "number"
},
"default": "1",
"description": "步进间隔，默认为 `1`",
"fieldName": "step"
},
{
"name": "tickmarks",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否添加刻度标记",
"fieldName": "tickmarks"
},
{
"name": "nolabel",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否隐藏文本提示",
"fieldName": "nolabel"
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否被禁用",
"fieldName": "disabled"
},
{
"name": "form",
"type": {
"text": "string | undefined"
},
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"fieldName": "form"
},
{
"name": "name",
"type": {
"text": "string"
},
"default": "''",
"description": "滑块的名称，该名称将与表单数据一起提交",
"fieldName": "name"
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"mixins": [
{
"name": "RippleMixin",
"module": "components/ripple/ripple-mixin.js"
},
{
"name": "FocusableMixin",
"package": "@mdui/shared/mixins/focusable.js"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"events": [
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
]
}
],
"exports": [
{
"kind": "js",
"name": "SliderBase",
"declaration": {
"name": "SliderBase",
"module": "components/slider/slider-base.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/snackbar/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Snackbar",
"cssProperties": [
{
"description": "组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
},
{
"description": "组件的 CSS `z-index` 值",
"name": "--z-index"
}
],
"cssParts": [
{
"description": "消息文本",
"name": "message"
},
{
"description": "操作按钮",
"name": "action"
},
{
"description": "关闭按钮",
"name": "close-button"
},
{
"description": "关闭按钮中的图标",
"name": "close-icon"
}
],
"slots": [
{
"description": "Snackbar 的消息文本内容",
"name": ""
},
{
"description": "右侧的操作按钮",
"name": "action"
},
{
"description": "右侧的关闭按钮。必须设置 `closeable` 属性为 `true` 才会显示",
"name": "close-button"
},
{
"description": "关闭按钮中的图标",
"name": "close-icon"
}
],
"members": [
{
"kind": "field",
"name": "open",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否显示 Snackbar",
"attribute": "open",
"reflects": true
},
{
"kind": "field",
"name": "placement",
"type": {
"text": "| /*顶部居中*/ 'top'\n | /*顶部左对齐*/ 'top-start'\n | /*顶部右对齐*/ 'top-end'\n | /*底部居中*/ 'bottom'\n | /*底部左对齐*/ 'bottom-start'\n | /*底部右对齐*/ 'bottom-end'"
},
"privacy": "public",
"default": "'bottom'",
"description": "Snackbar 的显示位置。默认为 `bottom`。可选值包括：\n\n* `top`：顶部居中\n* `top-start`：顶部左对齐\n* `top-end`：顶部右对齐\n* `bottom`：底部居中\n* `bottom-start`：底部左对齐\n* `bottom-end`：底部右对齐",
"attribute": "placement",
"reflects": true
},
{
"kind": "field",
"name": "action",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "操作按钮的文本。也可以通过 `slot=\"action\"` 设置操作按钮",
"attribute": "action",
"reflects": true
},
{
"kind": "field",
"name": "actionLoading",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "操作按钮是否处于加载中状态",
"attribute": "action-loading",
"reflects": true
},
{
"kind": "field",
"name": "closeable",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在右侧显示关闭按钮",
"attribute": "closeable",
"reflects": true
},
{
"kind": "field",
"name": "closeIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "关闭按钮的 Material Icons 图标名。也可以通过 `slot=\"close-icon\"` 设置",
"attribute": "close-icon",
"reflects": true
},
{
"kind": "field",
"name": "messageLine",
"type": {
"text": "| /*最多显示一行*/ 1\n | /*最多显示两行*/ 2 | undefined"
},
"privacy": "public",
"description": "消息文本的最大显示行数。默认不限制。可选值包括：\n\n* `1`：最多显示一行\n* `2`：最多显示两行",
"attribute": "message-line",
"reflects": true
},
{
"kind": "field",
"name": "autoCloseDelay",
"type": {
"text": "number"
},
"privacy": "public",
"default": "5000",
"description": "自动关闭的延迟时间（单位：毫秒）。设置为 `0` 则不自动关闭。默认为 5000 毫秒",
"attribute": "auto-close-delay",
"reflects": true
},
{
"kind": "field",
"name": "closeOnOutsideClick",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "点击或触摸 Snackbar 以外的区域时，是否关闭 Snackbar",
"attribute": "close-on-outside-click",
"reflects": true
},
{
"kind": "field",
"name": "mobile",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"attribute": "mobile",
"reflects": true
},
{
"kind": "field",
"name": "closeTimeout",
"type": {
"text": "number"
},
"privacy": "private"
},
{
"kind": "field",
"name": "observeResize",
"type": {
"text": "ObserveResize | undefined"
},
"privacy": "private"
},
{
"kind": "method",
"name": "onOpenChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onStackChange",
"privacy": "private",
"description": "这两个属性变更时，需要重新排序该组件后面的 snackbar"
},
{
"kind": "method",
"name": "reorderStack",
"privacy": "private",
"parameters": [
{
"name": "startSnackbar",
"optional": true,
"type": {
"text": "Snackbar"
},
"description": "从哪个 snackbar 开始重新排列，默认从第一个开始"
}
],
"description": "重新排序 snackbar 堆叠"
},
{
"kind": "method",
"name": "onDocumentClick",
"privacy": "private",
"parameters": [
{
"name": "e",
"type": {
"text": "PointerEvent"
}
}
],
"description": "在 document 上点击时，根据条件判断是否要关闭 snackbar"
},
{
"kind": "method",
"name": "onActionClick",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "MouseEvent"
}
}
]
},
{
"kind": "method",
"name": "onCloseClick",
"privacy": "private"
}
],
"events": [
{
"description": "Snackbar 开始显示时，事件被触发。可以通过调用 `event.preventDefault()` 阻止 Snackbar 显示",
"name": "open"
},
{
"description": "Snackbar 显示动画完成时，事件被触发",
"name": "opened"
},
{
"description": "Snackbar 开始隐藏时，事件被触发。可以通过调用 `event.preventDefault()` 阻止 Snackbar 关闭",
"name": "close"
},
{
"description": "Snackbar 隐藏动画完成时，事件被触发",
"name": "closed"
},
{
"description": "点击操作按钮时触发",
"name": "action-click"
}
],
"attributes": [
{
"name": "open",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否显示 Snackbar",
"fieldName": "open"
},
{
"name": "placement",
"type": {
"text": "| /*顶部居中*/ 'top'\n | /*顶部左对齐*/ 'top-start'\n | /*顶部右对齐*/ 'top-end'\n | /*底部居中*/ 'bottom'\n | /*底部左对齐*/ 'bottom-start'\n | /*底部右对齐*/ 'bottom-end'"
},
"default": "'bottom'",
"description": "Snackbar 的显示位置。默认为 `bottom`。可选值包括：\n\n* `top`：顶部居中\n* `top-start`：顶部左对齐\n* `top-end`：顶部右对齐\n* `bottom`：底部居中\n* `bottom-start`：底部左对齐\n* `bottom-end`：底部右对齐",
"fieldName": "placement"
},
{
"name": "action",
"type": {
"text": "string | undefined"
},
"description": "操作按钮的文本。也可以通过 `slot=\"action\"` 设置操作按钮",
"fieldName": "action"
},
{
"name": "action-loading",
"type": {
"text": "boolean"
},
"default": "false",
"description": "操作按钮是否处于加载中状态",
"fieldName": "actionLoading"
},
{
"name": "closeable",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在右侧显示关闭按钮",
"fieldName": "closeable"
},
{
"name": "close-icon",
"type": {
"text": "string | undefined"
},
"description": "关闭按钮的 Material Icons 图标名。也可以通过 `slot=\"close-icon\"` 设置",
"fieldName": "closeIcon"
},
{
"name": "message-line",
"type": {
"text": "| /*最多显示一行*/ 1\n | /*最多显示两行*/ 2 | undefined"
},
"description": "消息文本的最大显示行数。默认不限制。可选值包括：\n\n* `1`：最多显示一行\n* `2`：最多显示两行",
"fieldName": "messageLine"
},
{
"name": "auto-close-delay",
"type": {
"text": "number"
},
"default": "5000",
"description": "自动关闭的延迟时间（单位：毫秒）。设置为 `0` 则不自动关闭。默认为 5000 毫秒",
"fieldName": "autoCloseDelay"
},
{
"name": "close-on-outside-click",
"type": {
"text": "boolean"
},
"default": "false",
"description": "点击或触摸 Snackbar 以外的区域时，是否关闭 Snackbar",
"fieldName": "closeOnOutsideClick"
},
{
"name": "mobile",
"type": {
"text": "boolean"
},
"default": "false",
"fieldName": "mobile"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "消息条组件\n\n```html\n<mdui-snackbar>message</mdui-snackbar>\n```",
"tagName": "mdui-snackbar",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Snackbar",
"declaration": {
"name": "Snackbar",
"module": "components/snackbar/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-snackbar",
"declaration": {
"name": "Snackbar",
"module": "components/snackbar/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/switch/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Switch",
"cssProperties": [
{
"description": "组件轨道的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
},
{
"description": "组件图标容器的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner-thumb"
}
],
"cssParts": [
{
"description": "轨道",
"name": "track"
},
{
"description": "图标容器",
"name": "thumb"
},
{
"description": "未选中状态的图标",
"name": "unchecked-icon"
},
{
"description": "选中状态的图标",
"name": "checked-icon"
}
],
"slots": [
{
"description": "未选中状态的元素",
"name": "unchecked-icon"
},
{
"description": "选中状态的元素",
"name": "checked-icon"
}
],
"members": [
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否为禁用状态",
"attribute": "disabled",
"reflects": true
},
{
"kind": "field",
"name": "checked",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否为选中状态",
"attribute": "checked",
"reflects": true
},
{
"kind": "field",
"name": "defaultChecked",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "默认选中状态。在重置表单时，将重置为此状态。此属性只能通过 JavaScript 属性设置"
},
{
"kind": "field",
"name": "uncheckedIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "未选中状态的 Material Icons 图标名。也可以通过 `slot=\"unchecked-icon\"` 设置",
"attribute": "unchecked-icon",
"reflects": true
},
{
"kind": "field",
"name": "checkedIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "选中状态的 Material Icons 图标名。也可以通过 `slot=\"checked-icon\"` 设置\n\n默认为 `check` 图标，可传入空字符串移除默认图标",
"attribute": "checked-icon",
"reflects": true
},
{
"kind": "field",
"name": "required",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "提交表单时，是否必须选中此开关",
"attribute": "required",
"reflects": true
},
{
"kind": "field",
"name": "form",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"attribute": "form",
"reflects": true
},
{
"kind": "field",
"name": "name",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "开关的名称，将与表单数据一起提交",
"attribute": "name",
"reflects": true
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string"
},
"privacy": "public",
"default": "'on'",
"description": "开关的值，将于表单数据一起提交",
"attribute": "value",
"reflects": true
},
{
"kind": "field",
"name": "invalid",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否验证未通过"
},
{
"kind": "field",
"name": "rippleRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "inputRef",
"type": {
"text": "Ref<HTMLInputElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "formController",
"privacy": "private",
"readonly": true,
"default": "new FormController(this, { value: (control) => (control.checked ? control.value : undefined), defaultValue: (control) => control.defaultChecked!, setValue: (control, checked) => (control.checked = checked as boolean), })"
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController( this, 'unchecked-icon', )"
},
{
"kind": "field",
"name": "validity",
"type": {
"text": "ValidityState"
},
"privacy": "public",
"description": "表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)",
"readonly": true
},
{
"kind": "field",
"name": "validationMessage",
"type": {
"text": "string"
},
"privacy": "public",
"description": "如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串",
"readonly": true
},
{
"kind": "field",
"name": "rippleElement",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "onDisabledChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onCheckedChange",
"privacy": "private"
},
{
"kind": "method",
"name": "checkValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`"
},
{
"kind": "method",
"name": "reportValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。\n\n如果验证未通过，还会在组件上显示验证失败的提示。"
},
{
"kind": "method",
"name": "setCustomValidity",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "message",
"type": {
"text": "string"
},
"description": "自定义的错误提示文本"
}
],
"description": "设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证"
},
{
"kind": "method",
"name": "onChange",
"privacy": "private",
"description": "input[type=\"checkbox\"] 的 change 事件无法冒泡越过 shadow dom"
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"description": "选中状态变更时触发",
"name": "change"
},
{
"description": "选中状态变更时触发",
"name": "input"
},
{
"description": "表单字段验证不通过时触发",
"name": "invalid"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"attributes": [
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否为禁用状态",
"fieldName": "disabled"
},
{
"name": "checked",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否为选中状态",
"fieldName": "checked"
},
{
"name": "unchecked-icon",
"type": {
"text": "string | undefined"
},
"description": "未选中状态的 Material Icons 图标名。也可以通过 `slot=\"unchecked-icon\"` 设置",
"fieldName": "uncheckedIcon"
},
{
"name": "checked-icon",
"type": {
"text": "string | undefined"
},
"description": "选中状态的 Material Icons 图标名。也可以通过 `slot=\"checked-icon\"` 设置\n\n默认为 `check` 图标，可传入空字符串移除默认图标",
"fieldName": "checkedIcon"
},
{
"name": "required",
"type": {
"text": "boolean"
},
"default": "false",
"description": "提交表单时，是否必须选中此开关",
"fieldName": "required"
},
{
"name": "form",
"type": {
"text": "string | undefined"
},
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"fieldName": "form"
},
{
"name": "name",
"type": {
"text": "string"
},
"default": "''",
"description": "开关的名称，将与表单数据一起提交",
"fieldName": "name"
},
{
"name": "value",
"type": {
"text": "string"
},
"default": "'on'",
"description": "开关的值，将于表单数据一起提交",
"fieldName": "value"
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"mixins": [
{
"name": "RippleMixin",
"module": "components/ripple/ripple-mixin.js"
},
{
"name": "FocusableMixin",
"package": "@mdui/shared/mixins/focusable.js"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "开关切换组件\n\n```html\n<mdui-switch></mdui-switch>\n```",
"tagName": "mdui-switch",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Switch",
"declaration": {
"name": "Switch",
"module": "components/switch/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-switch",
"declaration": {
"name": "Switch",
"module": "components/switch/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/tabs/tab-panel.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "TabPanel",
"slots": [
{
"description": "选项卡面板项内容",
"name": ""
}
],
"members": [
{
"kind": "field",
"name": "value",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "选项卡面板项的值",
"attribute": "value",
"reflects": true
},
{
"kind": "field",
"name": "active",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"description": "是否为激活状态，由 `<mdui-tabs>` 组件控制该状态",
"attribute": "active",
"reflects": true
}
],
"attributes": [
{
"name": "value",
"type": {
"text": "string | undefined"
},
"description": "选项卡面板项的值",
"fieldName": "value"
},
{
"name": "active",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否为激活状态，由 `<mdui-tabs>` 组件控制该状态",
"fieldName": "active"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "选项卡面板项组件。需配合 `<mdui-tabs>` 和 `<mdui-tab>` 组件使用\n\n```html\n<mdui-tabs value=\"tab-1\">\n..<mdui-tab value=\"tab-1\">Tab 1</mdui-tab>\n..<mdui-tab value=\"tab-2\">Tab 2</mdui-tab>\n..<mdui-tab value=\"tab-3\">Tab 3</mdui-tab>\n\n..<mdui-tab-panel slot=\"panel\" value=\"tab-1\">Panel 1</mdui-tab-panel>\n..<mdui-tab-panel slot=\"panel\" value=\"tab-2\">Panel 2</mdui-tab-panel>\n..<mdui-tab-panel slot=\"panel\" value=\"tab-3\">Panel 3</mdui-tab-panel>\n</mdui-tabs>\n```",
"tagName": "mdui-tab-panel",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "TabPanel",
"declaration": {
"name": "TabPanel",
"module": "components/tabs/tab-panel.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-tab-panel",
"declaration": {
"name": "TabPanel",
"module": "components/tabs/tab-panel.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/tabs/tab.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Tab",
"cssParts": [
{
"description": "选项卡导航项容器",
"name": "container"
},
{
"description": "选项卡导航项中的图标",
"name": "icon"
},
{
"description": "选项卡导航项的文本",
"name": "label"
}
],
"slots": [
{
"description": "选项卡导航项的文本内容",
"name": ""
},
{
"description": "选项卡导航项中的图标",
"name": "icon"
},
{
"description": "徽标",
"name": "badge"
},
{
"description": "自定义整个选项卡导航项中的内容",
"name": "custom"
}
],
"members": [
{
"kind": "field",
"name": "value",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "选项卡导航项的值",
"attribute": "value",
"reflects": true
},
{
"kind": "field",
"name": "icon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"attribute": "icon",
"reflects": true
},
{
"kind": "field",
"name": "inline",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否把图标和文本水平排列",
"attribute": "inline",
"reflects": true
},
{
"kind": "field",
"name": "active",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"description": "是否为激活状态，由 `<mdui-tabs>` 组件控制该参数",
"attribute": "active",
"reflects": true
},
{
"kind": "field",
"name": "variant",
"type": {
"text": "'primary' | 'secondary'"
},
"privacy": "protected",
"default": "'primary'",
"description": "选项卡形状。由 `<mdui-tabs>` 组件控制该参数"
},
{
"kind": "field",
"name": "key",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "rippleRef",
"type": {
"text": "Ref<Ripple>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController( this, 'icon', 'custom', )"
},
{
"kind": "field",
"name": "rippleElement",
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "rippleDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"readonly": true
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"attributes": [
{
"name": "value",
"type": {
"text": "string | undefined"
},
"description": "选项卡导航项的值",
"fieldName": "value"
},
{
"name": "icon",
"type": {
"text": "string | undefined"
},
"description": "Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"fieldName": "icon"
},
{
"name": "inline",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否把图标和文本水平排列",
"fieldName": "inline"
},
{
"name": "active",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否为激活状态，由 `<mdui-tabs>` 组件控制该参数",
"fieldName": "active"
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"mixins": [
{
"name": "RippleMixin",
"module": "components/ripple/ripple-mixin.js"
},
{
"name": "FocusableMixin",
"package": "@mdui/shared/mixins/focusable.js"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "选项卡导航项组件。需配合 `<mdui-tabs>` 和 `<mdui-tab-panel>` 组件使用\n\n```html\n<mdui-tabs value=\"tab-1\">\n..<mdui-tab value=\"tab-1\">Tab 1</mdui-tab>\n..<mdui-tab value=\"tab-2\">Tab 2</mdui-tab>\n..<mdui-tab value=\"tab-3\">Tab 3</mdui-tab>\n\n..<mdui-tab-panel slot=\"panel\" value=\"tab-1\">Panel 1</mdui-tab-panel>\n..<mdui-tab-panel slot=\"panel\" value=\"tab-2\">Panel 2</mdui-tab-panel>\n..<mdui-tab-panel slot=\"panel\" value=\"tab-3\">Panel 3</mdui-tab-panel>\n</mdui-tabs>\n```",
"tagName": "mdui-tab",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Tab",
"declaration": {
"name": "Tab",
"module": "components/tabs/tab.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-tab",
"declaration": {
"name": "Tab",
"module": "components/tabs/tab.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/tabs/tabs.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Tabs",
"cssParts": [
{
"description": "`<mdui-tab>` 元素的容器",
"name": "container"
},
{
"description": "激活状态指示器",
"name": "indicator"
}
],
"slots": [
{
"description": "`<mdui-tab>` 元素",
"name": ""
},
{
"description": "`<mdui-tab-panel>` 元素",
"name": "panel"
}
],
"members": [
{
"kind": "field",
"name": "variant",
"type": {
"text": "| /*适用于位于 `<mdui-top-app-bar>` 下方，用于切换应用的主页面的场景*/ 'primary'\n | /*适用于位于页面中，用于切换一组相关内容的场景*/ 'secondary'"
},
"privacy": "public",
"default": "'primary'",
"description": "选项卡形状。可选值包括：\n\n* `primary`：适用于位于 `<mdui-top-app-bar>` 下方，用于切换应用的主页面的场景\n* `secondary`：适用于位于页面中，用于切换一组相关内容的场景",
"attribute": "variant",
"reflects": true
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "当前激活的 `<mdui-tab>` 的值",
"attribute": "value",
"reflects": true
},
{
"kind": "field",
"name": "placement",
"type": {
"text": "| /*位于上方，左对齐*/ 'top-start'\n | /*位于上方，居中对齐*/ 'top'\n | /*位于上方，右对齐*/ 'top-end'\n | /*位于下方，左对齐*/ 'bottom-start'\n | /*位于下方，居中对齐*/ 'bottom'\n | /*位于下方，右对齐*/ 'bottom-end'\n | /*位于左侧，顶部对齐*/ 'left-start'\n | /*位于左侧，居中对齐*/ 'left'\n | /*位于左侧，底部对齐*/ 'left-end'\n | /*位于右侧，顶部对齐*/ 'right-start'\n | /*位于右侧，居中对齐*/ 'right'\n | /*位于右侧，底部对齐*/ 'right-end'"
},
"privacy": "public",
"default": "'top-start'",
"description": "选项卡位置。默认为 `top-start`。可选值包括：\n\n* `top-start`：位于上方，左对齐\n* `top`：位于上方，居中对齐\n* `top-end`：位于上方，右对齐\n* `bottom-start`：位于下方，左对齐\n* `bottom`：位于下方，居中对齐\n* `bottom-end`：位于下方，右对齐\n* `left-start`：位于左侧，顶部对齐\n* `left`：位于左侧，居中对齐\n* `left-end`：位于左侧，底部对齐\n* `right-start`：位于右侧，顶部对齐\n* `right`：位于右侧，居中对齐\n* `right-end`：位于右侧，底部对齐",
"attribute": "placement",
"reflects": true
},
{
"kind": "field",
"name": "fullWidth",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否填满父元素宽度",
"attribute": "full-width",
"reflects": true
},
{
"kind": "field",
"name": "activeKey",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0"
},
{
"kind": "field",
"name": "isInitial",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "true"
},
{
"kind": "field",
"name": "tabs",
"type": {
"text": "Tab[]"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "panels",
"type": {
"text": "TabPanel[]"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "activeTab",
"type": {
"text": "Tab | undefined"
},
"privacy": "private"
},
{
"kind": "field",
"name": "observeResize",
"type": {
"text": "ObserveResize | undefined"
},
"privacy": "private"
},
{
"kind": "field",
"name": "containerRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "indicatorRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "definedController",
"privacy": "private",
"readonly": true,
"default": "new DefinedController(this, { relatedElements: ['mdui-tab', 'mdui-tab-panel'], })"
},
{
"kind": "method",
"name": "onActiveKeyChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onValueChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onIndicatorChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onSlotChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onClick",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "MouseEvent"
}
}
]
},
{
"kind": "method",
"name": "updateActive",
"privacy": "private"
},
{
"kind": "method",
"name": "updateIndicator",
"privacy": "private"
}
],
"events": [
{
"description": "选中的值变化时触发",
"name": "change"
}
],
"attributes": [
{
"name": "variant",
"type": {
"text": "| /*适用于位于 `<mdui-top-app-bar>` 下方，用于切换应用的主页面的场景*/ 'primary'\n | /*适用于位于页面中，用于切换一组相关内容的场景*/ 'secondary'"
},
"default": "'primary'",
"description": "选项卡形状。可选值包括：\n\n* `primary`：适用于位于 `<mdui-top-app-bar>` 下方，用于切换应用的主页面的场景\n* `secondary`：适用于位于页面中，用于切换一组相关内容的场景",
"fieldName": "variant"
},
{
"name": "value",
"type": {
"text": "string | undefined"
},
"description": "当前激活的 `<mdui-tab>` 的值",
"fieldName": "value"
},
{
"name": "placement",
"type": {
"text": "| /*位于上方，左对齐*/ 'top-start'\n | /*位于上方，居中对齐*/ 'top'\n | /*位于上方，右对齐*/ 'top-end'\n | /*位于下方，左对齐*/ 'bottom-start'\n | /*位于下方，居中对齐*/ 'bottom'\n | /*位于下方，右对齐*/ 'bottom-end'\n | /*位于左侧，顶部对齐*/ 'left-start'\n | /*位于左侧，居中对齐*/ 'left'\n | /*位于左侧，底部对齐*/ 'left-end'\n | /*位于右侧，顶部对齐*/ 'right-start'\n | /*位于右侧，居中对齐*/ 'right'\n | /*位于右侧，底部对齐*/ 'right-end'"
},
"default": "'top-start'",
"description": "选项卡位置。默认为 `top-start`。可选值包括：\n\n* `top-start`：位于上方，左对齐\n* `top`：位于上方，居中对齐\n* `top-end`：位于上方，右对齐\n* `bottom-start`：位于下方，左对齐\n* `bottom`：位于下方，居中对齐\n* `bottom-end`：位于下方，右对齐\n* `left-start`：位于左侧，顶部对齐\n* `left`：位于左侧，居中对齐\n* `left-end`：位于左侧，底部对齐\n* `right-start`：位于右侧，顶部对齐\n* `right`：位于右侧，居中对齐\n* `right-end`：位于右侧，底部对齐",
"fieldName": "placement"
},
{
"name": "full-width",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否填满父元素宽度",
"fieldName": "fullWidth"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "选项卡组件。需配合 `<mdui-tab>` 和 `<mdui-tab-panel>` 组件使用\n\n```html\n<mdui-tabs value=\"tab-1\">\n..<mdui-tab value=\"tab-1\">Tab 1</mdui-tab>\n..<mdui-tab value=\"tab-2\">Tab 2</mdui-tab>\n..<mdui-tab value=\"tab-3\">Tab 3</mdui-tab>\n\n..<mdui-tab-panel slot=\"panel\" value=\"tab-1\">Panel 1</mdui-tab-panel>\n..<mdui-tab-panel slot=\"panel\" value=\"tab-2\">Panel 2</mdui-tab-panel>\n..<mdui-tab-panel slot=\"panel\" value=\"tab-3\">Panel 3</mdui-tab-panel>\n</mdui-tabs>\n```",
"tagName": "mdui-tabs",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Tabs",
"declaration": {
"name": "Tabs",
"module": "components/tabs/tabs.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-tabs",
"declaration": {
"name": "Tabs",
"module": "components/tabs/tabs.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/text-field/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "TextField",
"cssParts": [
{
"description": "文本框容器",
"name": "container"
},
{
"description": "左侧图标",
"name": "icon"
},
{
"description": "右侧图标",
"name": "end-icon"
},
{
"description": "验证失败状态的右侧图标",
"name": "error-icon"
},
{
"description": "左侧文本",
"name": "prefix"
},
{
"description": "右侧文本",
"name": "suffix"
},
{
"description": "上方的标签文本",
"name": "label"
},
{
"description": "内部的 `<input>` 或 `<textarea>` 元素",
"name": "input"
},
{
"description": "清空按钮",
"name": "clear-button"
},
{
"description": "清空按钮中的图标",
"name": "clear-icon"
},
{
"description": "密码显示状态切换按钮",
"name": "toggle-password-button"
},
{
"description": "显示密码状态下，密码显示状态切换按钮中的图标",
"name": "show-password-icon"
},
{
"description": "隐藏密码状态下，密码显示状态切换按钮中的图标",
"name": "hide-password-icon"
},
{
"description": "底部辅助信息容器，包括 helper、error、counter",
"name": "supporting"
},
{
"description": "底部的帮助文本",
"name": "helper"
},
{
"description": "底部的错误描述文本",
"name": "error"
},
{
"description": "底部右侧的字数统计",
"name": "counter"
}
],
"slots": [
{
"description": "左侧图标",
"name": "icon"
},
{
"description": "右侧图标",
"name": "end-icon"
},
{
"description": "验证失败状态的右侧图标",
"name": "error-icon"
},
{
"description": "左侧文本",
"name": "prefix"
},
{
"description": "右侧文本",
"name": "suffix"
},
{
"description": "清空按钮",
"name": "clear-button"
},
{
"description": "清空按钮中的图标",
"name": "clear-icon"
},
{
"description": "密码显示状态切换按钮",
"name": "toggle-password-button"
},
{
"description": "显示密码状态下，密码显示状态切换按钮中的图标",
"name": "show-password-icon"
},
{
"description": "隐藏密码状态下，密码显示状态切换按钮中的图标",
"name": "hide-password-icon"
},
{
"description": "底部的帮助文本",
"name": "helper"
}
],
"members": [
{
"kind": "field",
"name": "variant",
"type": {
"text": "| /*带背景色的文本框，视觉效果较强*/ 'filled'\n | /*带边框的文本框，视觉效果较弱*/ 'outlined'"
},
"privacy": "public",
"default": "'filled'",
"description": "文本框的形状。默认为 `filled`。可选值包括：\n\n* `filled`：带背景色的文本框，视觉效果较强\n* `outlined`：带边框的文本框，视觉效果较弱",
"attribute": "variant",
"reflects": true
},
{
"kind": "field",
"name": "type",
"type": {
"text": "| /*默认值。文本字段*/ 'text'\n | /*只能输入数字。拥有动态键盘的设备上会显示数字键盘*/ 'number'\n | /*用于输入密码，其值会被遮盖*/ 'password'\n | /*用于输入 URL，会验证 URL 格式。在支持动态键盘的设备上有相应的键盘*/ 'url'\n | /*用于输入邮箱地址，会验证邮箱格式。在支持动态键盘的设备上有相应的键盘*/ 'email'\n | /*用于搜索框。拥有动态键盘的设备上的回车图标会变成搜索图标*/ 'search'\n | /*用于输入电话号码。拥有动态键盘的设备上会显示电话数字键盘*/ 'tel'\n | /*隐藏该控件，但其值仍会提交到服务器*/ 'hidden'\n | /*输入日期的控件（年、月、日，不包括时间）。在支持的浏览器激活时打开日期选择器或年月日的数字滚轮*/ 'date'\n | /*输入日期和时间的控件，不包括时区。在支持的浏览器激活时打开日期选择器或年月日的数字滚轮*/ 'datetime-local'\n | /*输入年和月的控件，没有时区*/ 'month'\n | /*用于输入时间的控件，不包括时区*/ 'time'\n | /*用于输入以年和周数组成的日期，不带时区*/ 'week'"
},
"privacy": "public",
"default": "'text'",
"description": "文本框输入类型。默认为 `text`。可选值包括：\n\n* `text`：默认值。文本字段\n* `number`：只能输入数字。拥有动态键盘的设备上会显示数字键盘\n* `password`：用于输入密码，其值会被遮盖\n* `url`：用于输入 URL，会验证 URL 格式。在支持动态键盘的设备上有相应的键盘\n* `email`：用于输入邮箱地址，会验证邮箱格式。在支持动态键盘的设备上有相应的键盘\n* `search`：用于搜索框。拥有动态键盘的设备上的回车图标会变成搜索图标\n* `tel`：用于输入电话号码。拥有动态键盘的设备上会显示电话数字键盘\n* `hidden`：隐藏该控件，但其值仍会提交到服务器\n* `date`：输入日期的控件（年、月、日，不包括时间）。在支持的浏览器激活时打开日期选择器或年月日的数字滚轮\n* `datetime-local`：输入日期和时间的控件，不包括时区。在支持的浏览器激活时打开日期选择器或年月日的数字滚轮\n* `month`：输入年和月的控件，没有时区\n* `time`：用于输入时间的控件，不包括时区\n* `week`：用于输入以年和周数组成的日期，不带时区",
"attribute": "type",
"reflects": true
},
{
"kind": "field",
"name": "name",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "文本框名称，将与表单数据一起提交",
"attribute": "name",
"reflects": true
},
{
"kind": "field",
"name": "value",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "文本框的值，将与表单数据一起提交",
"attribute": "value"
},
{
"kind": "field",
"name": "defaultValue",
"type": {
"text": "string"
},
"privacy": "public",
"default": "''",
"description": "默认值。在重置表单时，将重置为该默认值。该属性只能通过 JavaScript 属性设置"
},
{
"kind": "field",
"name": "label",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "标签文本",
"attribute": "label",
"reflects": true
},
{
"kind": "field",
"name": "placeholder",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "占位符文本",
"attribute": "placeholder",
"reflects": true
},
{
"kind": "field",
"name": "helper",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "文本框底部的帮助文本。也可以通过 `slot=\"helper\"` 设置",
"attribute": "helper",
"reflects": true
},
{
"kind": "field",
"name": "helperOnFocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否仅在获得焦点时，显示底部的帮助文本",
"attribute": "helper-on-focus",
"reflects": true
},
{
"kind": "field",
"name": "clearable",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否可清空文本框内容",
"attribute": "clearable",
"reflects": true
},
{
"kind": "field",
"name": "clearIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "可清空文本框时，显示在文本框右侧的清空按钮的 Material Icons 图标名。也可以通过 `slot=\"clear-icon\"` 设置",
"attribute": "clear-icon",
"reflects": true
},
{
"kind": "field",
"name": "endAligned",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否将文本右对齐",
"attribute": "end-aligned",
"reflects": true
},
{
"kind": "field",
"name": "prefix",
"type": {
"text": "string"
},
"privacy": "public",
"description": "文本框的前缀文本。只在文本框聚焦或有值时显示。也可以通过 `slot=\"prefix\"` 设置",
"attribute": "prefix",
"reflects": true
},
{
"kind": "field",
"name": "suffix",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "文本框的后缀文本。只在文本框聚焦或有值时显示。也可以通过 `slot=\"suffix\"` 设置",
"attribute": "suffix",
"reflects": true
},
{
"kind": "field",
"name": "icon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "文本框的前缀图标的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"attribute": "icon",
"reflects": true
},
{
"kind": "field",
"name": "endIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "文本框的后缀图标的 Material Icons 图标名。也可以通过 `slot=\"end-icon\"` 设置",
"attribute": "end-icon",
"reflects": true
},
{
"kind": "field",
"name": "errorIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "表单字段验证失败时，显示在文本框右侧的 Material Icons 图标名。也可以通过 `slot=\"error-icon\"` 设置",
"attribute": "error-icon",
"reflects": true
},
{
"kind": "field",
"name": "form",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"attribute": "form",
"reflects": true
},
{
"kind": "field",
"name": "readonly",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否为只读模式",
"attribute": "readonly",
"reflects": true
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否禁用输入框",
"attribute": "disabled",
"reflects": true
},
{
"kind": "field",
"name": "required",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "提交表单时，是否必须填写该字段",
"attribute": "required",
"reflects": true
},
{
"kind": "field",
"name": "rows",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "文本框的固定显示行数",
"attribute": "rows",
"reflects": true
},
{
"kind": "field",
"name": "autosize",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否根据输入内容自动调整文本框高度",
"attribute": "autosize",
"reflects": true
},
{
"kind": "field",
"name": "minRows",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "`autosize` 为 `true` 时，文本框的最小行数",
"attribute": "min-rows",
"reflects": true
},
{
"kind": "field",
"name": "maxRows",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "`autosize` 为 `true` 时，文本框的最大行数",
"attribute": "max-rows",
"reflects": true
},
{
"kind": "field",
"name": "minlength",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "允许输入的最小字符数",
"attribute": "minlength",
"reflects": true
},
{
"kind": "field",
"name": "maxlength",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "允许输入的最大字符数",
"attribute": "maxlength",
"reflects": true
},
{
"kind": "field",
"name": "counter",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否显示字数统计，只在 `maxlength` 被指定时有效",
"attribute": "counter",
"reflects": true
},
{
"kind": "field",
"name": "min",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "当 `type` 为 `number` 时，允许输入的最小数值",
"attribute": "min",
"reflects": true
},
{
"kind": "field",
"name": "max",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "当 `type` 为 `number` 时，允许输入的最大数值",
"attribute": "max",
"reflects": true
},
{
"kind": "field",
"name": "step",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "`type` 为 `number` 时，数值增减的步长",
"attribute": "step",
"reflects": true
},
{
"kind": "field",
"name": "pattern",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "用于表单验证的正则表达式",
"attribute": "pattern",
"reflects": true
},
{
"kind": "field",
"name": "togglePassword",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "`type` 为 `password` 时，设置此属性会添加一个切换按钮，用于在明文和密文之间切换",
"attribute": "toggle-password",
"reflects": true
},
{
"kind": "field",
"name": "showPasswordIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "密码切换按钮的 Material Icons 图标，当密码为明文时显示。也可以通过 `slot=\"show-password-icon\"` 设置",
"attribute": "show-password-icon",
"reflects": true
},
{
"kind": "field",
"name": "hidePasswordIcon",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "密码切换按钮的 Material Icons 图标，当密码为密文时显示。也可以通过 `slot=\"hide-password-icon\"` 设置",
"attribute": "hide-password-icon",
"reflects": true
},
{
"kind": "field",
"name": "autocapitalize",
"type": {
"text": "| /*禁用首字母大写*/ 'none'\n | /*句子首字母大写*/ 'sentences'\n | /*单词首字母大写*/ 'words'\n | /*所有字母大写*/ 'characters'"
},
"privacy": "public",
"description": "iOS 的非标准属性，用于控制文本首字母是否自动大写。在 iOS5 及以后的版本上有效。可选值包括：\n\n* `none`：禁用首字母大写\n* `sentences`：句子首字母大写\n* `words`：单词首字母大写\n* `characters`：所有字母大写",
"attribute": "autocapitalize",
"reflects": true
},
{
"kind": "field",
"name": "autocorrect",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "`input` 元素的 `autocorrect` 属性",
"attribute": "autocorrect",
"reflects": true
},
{
"kind": "field",
"name": "autocomplete",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "`input` 元素的 `autocomplete` 属性",
"attribute": "autocomplete",
"reflects": true
},
{
"kind": "field",
"name": "enterkeyhint",
"type": {
"text": "| /*插入新行*/ 'enter'\n | /*完成输入，关闭虚拟键盘*/ 'done'\n | /*导航到输入文本的目标*/ 'go'\n | /*移动到下一个输入项*/ 'next'\n | /*移动到上一个输入项*/ 'previous'\n | /*导航到搜索结果*/ 'search'\n | /*发送文本信息*/ 'send' | undefined"
},
"privacy": "public",
"description": "`input` 元素的 `enterkeyhint` 属性，用于定制虚拟键盘上的 Enter 键的显示文本或图标。具体显示效果取决于用户使用的设备和语言。可选值包括：\n\n* `enter`：插入新行\n* `done`：完成输入，关闭虚拟键盘\n* `go`：导航到输入文本的目标\n* `next`：移动到下一个输入项\n* `previous`：移动到上一个输入项\n* `search`：导航到搜索结果\n* `send`：发送文本信息",
"attribute": "enterkeyhint",
"reflects": true
},
{
"kind": "field",
"name": "spellcheck",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否启用拼写检查",
"attribute": "spellcheck",
"reflects": true
},
{
"kind": "field",
"name": "inputmode",
"type": {
"text": "| /*无虚拟键盘。在需要实现自己的键盘输入控件时很有用*/ 'none'\n | /*标准文本输入键盘*/ 'text'\n | /*小数输入键盘，除了数字之外可能会有小数点 `.` 或者千分符逗号 `,`*/ 'decimal'\n | /*显示 0-9 的数字键盘*/ 'numeric'\n | /*手机数字键盘，包含 0-9 数字、星号 `*` 或者井号 `#` 键*/ 'tel'\n | /*为搜索输入优化的虚拟键盘，提交按钮通常会显示 `search` 或者 “搜索”*/ 'search'\n | /*为邮件地址输入优化的虚拟键盘，通常会有 `@ .` 等键*/ 'email'\n | /*为 URL 输入优化的虚拟键盘，通常会有 `. / #` 等键*/ 'url' | undefined"
},
"privacy": "public",
"description": "`input` 元素的 `inputmode` 属性，用于定制虚拟键盘的类型。可选值包括：\n\n* `none`：无虚拟键盘。在需要实现自己的键盘输入控件时很有用\n* `text`：标准文本输入键盘\n* `decimal`：小数输入键盘，除了数字之外可能会有小数点 `.` 或者千分符逗号 `,`\n* `numeric`：显示 0-9 的数字键盘\n* `tel`：手机数字键盘，包含 0-9 数字、星号 `*` 或者井号 `#` 键\n* `search`：为搜索输入优化的虚拟键盘，提交按钮通常会显示 `search` 或者 “搜索”\n* `email`：为邮件地址输入优化的虚拟键盘，通常会有 `@ .` 等键\n* `url`：为 URL 输入优化的虚拟键盘，通常会有 `. / #` 等键",
"attribute": "inputmode",
"reflects": true
},
{
"kind": "field",
"name": "invalid",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否验证未通过\n\n该验证为浏览器原生验证 API，基于 `type`、`required`、`minlength`、`maxlength` 及 `pattern` 等属性的验证结果"
},
{
"kind": "field",
"name": "invalidStyle",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "该属性设置为 true 时，则在样式上为 text-field 赋予 invalid 的状态。实际是否验证通过仍需根据 invalid 属性判断\n该属性仅供 mdui 内部使用，当前 select 组件使用了该属性"
},
{
"kind": "field",
"name": "focusedStyle",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "该属性设置为 true 时，则在样式上为 text-field 赋予聚焦状态。实际是否聚焦仍然由 focusableMixin 控制\n该属性仅供 mdui 内部使用，当前 select 组件使用了该属性",
"attribute": "focused-style",
"reflects": true
},
{
"kind": "field",
"name": "isPasswordVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false"
},
{
"kind": "field",
"name": "hasValue",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false"
},
{
"kind": "field",
"name": "error",
"type": {
"text": "string"
},
"privacy": "private",
"default": "''",
"description": "通过该属性传入了错误文案时，会优先显示该文案。需要配合 invalid=true 或 invalidStyle=true 使用\n当前仅供 select 组件使用"
},
{
"kind": "field",
"name": "observeResize",
"type": {
"text": "ObserveResize | undefined"
},
"privacy": "private"
},
{
"kind": "field",
"name": "inputRef",
"type": {
"text": "Ref<HTMLInputElement | HTMLTextAreaElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "formController",
"privacy": "private",
"readonly": true,
"default": "new FormController(this)"
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController( this, 'icon', 'end-icon', 'helper', 'input', // input 仅供 <mdui-select> 使用，文档中不写该 slot )"
},
{
"kind": "field",
"name": "readonlyButClearable",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "该属性设为 true 时，即使设置了 readonly，仍可以显示 clearable\n当前仅供 select 组件使用"
},
{
"kind": "field",
"name": "validity",
"type": {
"text": "ValidityState"
},
"privacy": "public",
"description": "表单验证状态对象，具体参见 [`ValidityState`](https://developer.mozilla.org/zh-CN/docs/Web/API/ValidityState)",
"readonly": true
},
{
"kind": "field",
"name": "validationMessage",
"type": {
"text": "string"
},
"privacy": "public",
"description": "如果表单验证未通过，此属性将包含提示信息。如果验证通过，此属性将为空字符串",
"readonly": true
},
{
"kind": "field",
"name": "valueAsNumber",
"type": {
"text": "number"
},
"privacy": "public",
"description": "获取当前值，并转换为 `number` 类型；或设置一个 `number` 类型的值。\n如果值无法被转换为 `number` 类型，则会返回 `NaN`。"
},
{
"kind": "field",
"name": "focusElement",
"type": {
"text": "HTMLElement | null | undefined"
},
"privacy": "protected",
"description": "最终获得焦点的元素",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusDisabled",
"type": {
"text": "boolean"
},
"privacy": "protected",
"description": "父类要实现该属性，表示是否禁用 focus 状态",
"readonly": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "isFocusedStyle",
"type": {
"text": "boolean"
},
"privacy": "private",
"description": "是否显示聚焦状态样式",
"readonly": true
},
{
"kind": "field",
"name": "isTextarea",
"privacy": "private",
"description": "是否渲染为 textarea。为 false 时渲染为 input",
"readonly": true
},
{
"kind": "method",
"name": "onDisabledChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onValueChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onRowsChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onMaxRowsChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onMinRowsChange",
"privacy": "private"
},
{
"kind": "method",
"name": "select",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "选中文本框中的文本"
},
{
"kind": "method",
"name": "setSelectionRange",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "start",
"type": {
"text": "number"
},
"description": "被选中的第一个字符的位置索引，从 `0` 开始。如果这个值比元素的 `value` 长度还大，则会被看作 `value` 最后一个位置的索引"
},
{
"name": "end",
"type": {
"text": "number"
},
"description": "被选中的最后一个字符的*下一个*位置索引。如果这个值比元素的 `value` 长度还大，则会被看作 `value` 最后一个位置的索引"
},
{
"name": "direction",
"default": "'none'",
"type": {
"text": "'forward' | 'backward' | 'none'"
},
"description": "一个表示选择方向的字符串，可能的值有：`forward`、`backward`、`none`"
}
],
"description": "选中文本框中特定范围的内容"
},
{
"kind": "method",
"name": "setRangeText",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "replacement",
"type": {
"text": "string"
},
"description": "要插入的字符串"
},
{
"name": "start",
"type": {
"text": "number"
},
"description": "要替换的字符的起止位置的索引。默认为当前用户选中的字符的起始位置的索引"
},
{
"name": "end",
"type": {
"text": "number"
},
"description": "要替换的字符的结束位置的索引。默认为当前用户选中的字符的结束位置的索引"
},
{
"name": "selectMode",
"default": "'preserve'",
"type": {
"text": "'select' | 'start' | 'end' | 'preserve'"
},
"description": "文本被替换后，选取的状态。可选值为：\n* `select`：选择新插入的文本\n* `start`：将光标移动到新插入的文本的起始位置\n* `end`：将光标移动到新插入的文本的结束位置\n* `preserve`：默认值。尝试保留选取"
}
],
"description": "将文本框中特定范围的文本替换为新的文本"
},
{
"kind": "method",
"name": "checkValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`"
},
{
"kind": "method",
"name": "reportValidity",
"privacy": "public",
"return": {
"type": {
"text": "boolean"
}
},
"description": "检查表单字段是否通过验证。如果未通过，返回 `false` 并触发 `invalid` 事件；如果通过，返回 `true`。\n\n如果验证未通过，还会在组件上显示验证失败的提示。"
},
{
"kind": "method",
"name": "setCustomValidity",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "message",
"type": {
"text": "string"
},
"description": "自定义的错误提示文本"
}
],
"description": "设置自定义的错误提示文本。只要这个文本不为空，就表示字段未通过验证"
},
{
"kind": "method",
"name": "setCustomValidityInternal",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "message",
"type": {
"text": "string"
}
}
]
},
{
"kind": "method",
"name": "onChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onClear",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "MouseEvent"
}
}
]
},
{
"kind": "method",
"name": "onInput",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "InputEvent"
}
}
]
},
{
"kind": "method",
"name": "onInvalid",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "Event"
}
}
]
},
{
"kind": "method",
"name": "onKeyDown",
"privacy": "private",
"parameters": [
{
"name": "event",
"type": {
"text": "KeyboardEvent"
}
}
]
},
{
"kind": "method",
"name": "onTextAreaKeyUp",
"privacy": "private",
"description": "textarea 不支持 pattern 属性，所以在 keyup 时执行验证"
},
{
"kind": "method",
"name": "onTogglePassword",
"privacy": "private"
},
{
"kind": "method",
"name": "getPatternErrorMsg",
"privacy": "private"
},
{
"kind": "method",
"name": "setTextareaHeight",
"privacy": "private"
},
{
"kind": "method",
"name": "renderLabel",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderPrefix",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderSuffix",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
}
},
{
"kind": "method",
"name": "renderRightIcon",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "hasErrorIcon",
"type": {
"text": "boolean"
}
}
]
},
{
"kind": "method",
"name": "renderClearButton",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "hasClearButton",
"type": {
"text": "boolean"
}
}
]
},
{
"kind": "method",
"name": "renderTogglePasswordButton",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "hasTogglePasswordButton",
"type": {
"text": "boolean"
}
}
]
},
{
"kind": "method",
"name": "renderInput",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "hasInputSlot",
"type": {
"text": "boolean"
}
}
]
},
{
"kind": "method",
"name": "renderTextArea",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "hasInputSlot",
"type": {
"text": "boolean"
}
}
]
},
{
"kind": "method",
"name": "renderHelper",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "hasError",
"type": {
"text": "boolean"
},
"description": "是否包含错误提示"
},
{
"name": "hasHelper",
"type": {
"text": "boolean"
},
"description": "是否含 helper 属性或 helper slot"
}
]
},
{
"kind": "method",
"name": "renderCounter",
"privacy": "private",
"return": {
"type": {
"text": "TemplateResult"
}
},
"parameters": [
{
"name": "hasCounter",
"type": {
"text": "boolean"
}
}
]
},
{
"kind": "field",
"name": "autofocus",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"attribute": "autofocus",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focused",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focused",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusVisible",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"attribute": "focus-visible",
"reflects": true,
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "focusableDefinedController",
"type": {
"text": "DefinedController"
},
"privacy": "protected",
"default": "new DefinedController(this, { relatedElements: [''] })",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_manipulatingTabindex",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_tabIndex",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "_lastFocusDisabled",
"type": {
"text": "boolean | undefined"
},
"privacy": "private",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "field",
"name": "tabIndex",
"type": {
"text": "number"
},
"privacy": "public",
"description": "元素在使用 Tab 键切换焦点时的顺序",
"attribute": "tabindex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "click",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "模拟鼠标点击元素",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "focus",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "options",
"optional": true,
"type": {
"text": "FocusOptions"
}
}
],
"description": "将焦点设置到当前元素。\n\n可以传入一个对象作为参数，该对象的属性包括：\n\n* `preventScroll`：默认情况下，元素获取焦点后，页面会滚动以将该元素滚动到视图中。如果不希望页面滚动，可以将此属性设置为 `true`。",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "blur",
"privacy": "public",
"return": {
"type": {
"text": "void"
}
},
"description": "移除当前元素的焦点",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageFocusElementTabindex",
"privacy": "private",
"return": {
"type": {
"text": "Promise<void>"
}
},
"parameters": [
{
"name": "tabIndex",
"type": {
"text": "number"
}
}
],
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"kind": "method",
"name": "manageAutoFocus",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"events": [
{
"description": "获得焦点时触发",
"name": "focus"
},
{
"description": "失去焦点时触发",
"name": "blur"
},
{
"description": "在文本框的值变更，且失去焦点时触发",
"name": "change"
},
{
"description": "在文本框的值变更时触发",
"name": "input"
},
{
"description": "表单字段验证不通过时触发",
"name": "invalid"
},
{
"description": "在点击由 `clearable` 属性生成的清空按钮时触发。可以通过调用 `event.preventDefault()` 阻止清空文本框",
"name": "clear"
},
{
"name": "keydown",
"type": {
"text": "KeyboardEvent"
},
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"attributes": [
{
"name": "variant",
"type": {
"text": "| /*带背景色的文本框，视觉效果较强*/ 'filled'\n | /*带边框的文本框，视觉效果较弱*/ 'outlined'"
},
"default": "'filled'",
"description": "文本框的形状。默认为 `filled`。可选值包括：\n\n* `filled`：带背景色的文本框，视觉效果较强\n* `outlined`：带边框的文本框，视觉效果较弱",
"fieldName": "variant"
},
{
"name": "type",
"type": {
"text": "| /*默认值。文本字段*/ 'text'\n | /*只能输入数字。拥有动态键盘的设备上会显示数字键盘*/ 'number'\n | /*用于输入密码，其值会被遮盖*/ 'password'\n | /*用于输入 URL，会验证 URL 格式。在支持动态键盘的设备上有相应的键盘*/ 'url'\n | /*用于输入邮箱地址，会验证邮箱格式。在支持动态键盘的设备上有相应的键盘*/ 'email'\n | /*用于搜索框。拥有动态键盘的设备上的回车图标会变成搜索图标*/ 'search'\n | /*用于输入电话号码。拥有动态键盘的设备上会显示电话数字键盘*/ 'tel'\n | /*隐藏该控件，但其值仍会提交到服务器*/ 'hidden'\n | /*输入日期的控件（年、月、日，不包括时间）。在支持的浏览器激活时打开日期选择器或年月日的数字滚轮*/ 'date'\n | /*输入日期和时间的控件，不包括时区。在支持的浏览器激活时打开日期选择器或年月日的数字滚轮*/ 'datetime-local'\n | /*输入年和月的控件，没有时区*/ 'month'\n | /*用于输入时间的控件，不包括时区*/ 'time'\n | /*用于输入以年和周数组成的日期，不带时区*/ 'week'"
},
"default": "'text'",
"description": "文本框输入类型。默认为 `text`。可选值包括：\n\n* `text`：默认值。文本字段\n* `number`：只能输入数字。拥有动态键盘的设备上会显示数字键盘\n* `password`：用于输入密码，其值会被遮盖\n* `url`：用于输入 URL，会验证 URL 格式。在支持动态键盘的设备上有相应的键盘\n* `email`：用于输入邮箱地址，会验证邮箱格式。在支持动态键盘的设备上有相应的键盘\n* `search`：用于搜索框。拥有动态键盘的设备上的回车图标会变成搜索图标\n* `tel`：用于输入电话号码。拥有动态键盘的设备上会显示电话数字键盘\n* `hidden`：隐藏该控件，但其值仍会提交到服务器\n* `date`：输入日期的控件（年、月、日，不包括时间）。在支持的浏览器激活时打开日期选择器或年月日的数字滚轮\n* `datetime-local`：输入日期和时间的控件，不包括时区。在支持的浏览器激活时打开日期选择器或年月日的数字滚轮\n* `month`：输入年和月的控件，没有时区\n* `time`：用于输入时间的控件，不包括时区\n* `week`：用于输入以年和周数组成的日期，不带时区",
"fieldName": "type"
},
{
"name": "name",
"type": {
"text": "string"
},
"default": "''",
"description": "文本框名称，将与表单数据一起提交",
"fieldName": "name"
},
{
"name": "value",
"type": {
"text": "string"
},
"default": "''",
"description": "文本框的值，将与表单数据一起提交",
"fieldName": "value"
},
{
"name": "label",
"type": {
"text": "string | undefined"
},
"description": "标签文本",
"fieldName": "label"
},
{
"name": "placeholder",
"type": {
"text": "string | undefined"
},
"description": "占位符文本",
"fieldName": "placeholder"
},
{
"name": "helper",
"type": {
"text": "string | undefined"
},
"description": "文本框底部的帮助文本。也可以通过 `slot=\"helper\"` 设置",
"fieldName": "helper"
},
{
"name": "helper-on-focus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否仅在获得焦点时，显示底部的帮助文本",
"fieldName": "helperOnFocus"
},
{
"name": "clearable",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否可清空文本框内容",
"fieldName": "clearable"
},
{
"name": "clear-icon",
"type": {
"text": "string | undefined"
},
"description": "可清空文本框时，显示在文本框右侧的清空按钮的 Material Icons 图标名。也可以通过 `slot=\"clear-icon\"` 设置",
"fieldName": "clearIcon"
},
{
"name": "end-aligned",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否将文本右对齐",
"fieldName": "endAligned"
},
{
"name": "prefix",
"type": {
"text": "string"
},
"description": "文本框的前缀文本。只在文本框聚焦或有值时显示。也可以通过 `slot=\"prefix\"` 设置",
"fieldName": "prefix"
},
{
"name": "suffix",
"type": {
"text": "string | undefined"
},
"description": "文本框的后缀文本。只在文本框聚焦或有值时显示。也可以通过 `slot=\"suffix\"` 设置",
"fieldName": "suffix"
},
{
"name": "icon",
"type": {
"text": "string | undefined"
},
"description": "文本框的前缀图标的 Material Icons 图标名。也可以通过 `slot=\"icon\"` 设置",
"fieldName": "icon"
},
{
"name": "end-icon",
"type": {
"text": "string | undefined"
},
"description": "文本框的后缀图标的 Material Icons 图标名。也可以通过 `slot=\"end-icon\"` 设置",
"fieldName": "endIcon"
},
{
"name": "error-icon",
"type": {
"text": "string | undefined"
},
"description": "表单字段验证失败时，显示在文本框右侧的 Material Icons 图标名。也可以通过 `slot=\"error-icon\"` 设置",
"fieldName": "errorIcon"
},
{
"name": "form",
"type": {
"text": "string | undefined"
},
"description": "关联的 `<form>` 元素。此属性值应为同一页面中的一个 `<form>` 元素的 `id`。\n\n如果未指定此属性，则该元素必须是 `<form>` 元素的子元素。通过此属性，你可以将元素放置在页面的任何位置，而不仅仅是 `<form>` 元素的子元素。",
"fieldName": "form"
},
{
"name": "readonly",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否为只读模式",
"fieldName": "readonly"
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否禁用输入框",
"fieldName": "disabled"
},
{
"name": "required",
"type": {
"text": "boolean"
},
"default": "false",
"description": "提交表单时，是否必须填写该字段",
"fieldName": "required"
},
{
"name": "rows",
"type": {
"text": "number | undefined"
},
"description": "文本框的固定显示行数",
"fieldName": "rows"
},
{
"name": "autosize",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否根据输入内容自动调整文本框高度",
"fieldName": "autosize"
},
{
"name": "min-rows",
"type": {
"text": "number | undefined"
},
"description": "`autosize` 为 `true` 时，文本框的最小行数",
"fieldName": "minRows"
},
{
"name": "max-rows",
"type": {
"text": "number | undefined"
},
"description": "`autosize` 为 `true` 时，文本框的最大行数",
"fieldName": "maxRows"
},
{
"name": "minlength",
"type": {
"text": "number | undefined"
},
"description": "允许输入的最小字符数",
"fieldName": "minlength"
},
{
"name": "maxlength",
"type": {
"text": "number | undefined"
},
"description": "允许输入的最大字符数",
"fieldName": "maxlength"
},
{
"name": "counter",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否显示字数统计，只在 `maxlength` 被指定时有效",
"fieldName": "counter"
},
{
"name": "min",
"type": {
"text": "number | undefined"
},
"description": "当 `type` 为 `number` 时，允许输入的最小数值",
"fieldName": "min"
},
{
"name": "max",
"type": {
"text": "number | undefined"
},
"description": "当 `type` 为 `number` 时，允许输入的最大数值",
"fieldName": "max"
},
{
"name": "step",
"type": {
"text": "number | undefined"
},
"description": "`type` 为 `number` 时，数值增减的步长",
"fieldName": "step"
},
{
"name": "pattern",
"type": {
"text": "string | undefined"
},
"description": "用于表单验证的正则表达式",
"fieldName": "pattern"
},
{
"name": "toggle-password",
"type": {
"text": "boolean"
},
"default": "false",
"description": "`type` 为 `password` 时，设置此属性会添加一个切换按钮，用于在明文和密文之间切换",
"fieldName": "togglePassword"
},
{
"name": "show-password-icon",
"type": {
"text": "string | undefined"
},
"description": "密码切换按钮的 Material Icons 图标，当密码为明文时显示。也可以通过 `slot=\"show-password-icon\"` 设置",
"fieldName": "showPasswordIcon"
},
{
"name": "hide-password-icon",
"type": {
"text": "string | undefined"
},
"description": "密码切换按钮的 Material Icons 图标，当密码为密文时显示。也可以通过 `slot=\"hide-password-icon\"` 设置",
"fieldName": "hidePasswordIcon"
},
{
"name": "autocapitalize",
"type": {
"text": "| /*禁用首字母大写*/ 'none'\n | /*句子首字母大写*/ 'sentences'\n | /*单词首字母大写*/ 'words'\n | /*所有字母大写*/ 'characters'"
},
"description": "iOS 的非标准属性，用于控制文本首字母是否自动大写。在 iOS5 及以后的版本上有效。可选值包括：\n\n* `none`：禁用首字母大写\n* `sentences`：句子首字母大写\n* `words`：单词首字母大写\n* `characters`：所有字母大写",
"fieldName": "autocapitalize"
},
{
"name": "autocorrect",
"type": {
"text": "string | undefined"
},
"description": "`input` 元素的 `autocorrect` 属性",
"fieldName": "autocorrect"
},
{
"name": "autocomplete",
"type": {
"text": "string | undefined"
},
"description": "`input` 元素的 `autocomplete` 属性",
"fieldName": "autocomplete"
},
{
"name": "enterkeyhint",
"type": {
"text": "| /*插入新行*/ 'enter'\n | /*完成输入，关闭虚拟键盘*/ 'done'\n | /*导航到输入文本的目标*/ 'go'\n | /*移动到下一个输入项*/ 'next'\n | /*移动到上一个输入项*/ 'previous'\n | /*导航到搜索结果*/ 'search'\n | /*发送文本信息*/ 'send' | undefined"
},
"description": "`input` 元素的 `enterkeyhint` 属性，用于定制虚拟键盘上的 Enter 键的显示文本或图标。具体显示效果取决于用户使用的设备和语言。可选值包括：\n\n* `enter`：插入新行\n* `done`：完成输入，关闭虚拟键盘\n* `go`：导航到输入文本的目标\n* `next`：移动到下一个输入项\n* `previous`：移动到上一个输入项\n* `search`：导航到搜索结果\n* `send`：发送文本信息",
"fieldName": "enterkeyhint"
},
{
"name": "spellcheck",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否启用拼写检查",
"fieldName": "spellcheck"
},
{
"name": "inputmode",
"type": {
"text": "| /*无虚拟键盘。在需要实现自己的键盘输入控件时很有用*/ 'none'\n | /*标准文本输入键盘*/ 'text'\n | /*小数输入键盘，除了数字之外可能会有小数点 `.` 或者千分符逗号 `,`*/ 'decimal'\n | /*显示 0-9 的数字键盘*/ 'numeric'\n | /*手机数字键盘，包含 0-9 数字、星号 `*` 或者井号 `#` 键*/ 'tel'\n | /*为搜索输入优化的虚拟键盘，提交按钮通常会显示 `search` 或者 “搜索”*/ 'search'\n | /*为邮件地址输入优化的虚拟键盘，通常会有 `@ .` 等键*/ 'email'\n | /*为 URL 输入优化的虚拟键盘，通常会有 `. / #` 等键*/ 'url' | undefined"
},
"description": "`input` 元素的 `inputmode` 属性，用于定制虚拟键盘的类型。可选值包括：\n\n* `none`：无虚拟键盘。在需要实现自己的键盘输入控件时很有用\n* `text`：标准文本输入键盘\n* `decimal`：小数输入键盘，除了数字之外可能会有小数点 `.` 或者千分符逗号 `,`\n* `numeric`：显示 0-9 的数字键盘\n* `tel`：手机数字键盘，包含 0-9 数字、星号 `*` 或者井号 `#` 键\n* `search`：为搜索输入优化的虚拟键盘，提交按钮通常会显示 `search` 或者 “搜索”\n* `email`：为邮件地址输入优化的虚拟键盘，通常会有 `@ .` 等键\n* `url`：为 URL 输入优化的虚拟键盘，通常会有 `. / #` 等键",
"fieldName": "inputmode"
},
{
"name": "focused-style",
"type": {
"text": "boolean"
},
"default": "false",
"description": "该属性设置为 true 时，则在样式上为 text-field 赋予聚焦状态。实际是否聚焦仍然由 focusableMixin 控制\n该属性仅供 mdui 内部使用，当前 select 组件使用了该属性",
"fieldName": "focusedStyle"
},
{
"name": "autofocus",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否在页面加载完成后自动获取焦点",
"fieldName": "autofocus",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focused",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否获得了焦点，不管是鼠标点击，还是键盘切换获得的焦点，都会添加该属性\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focused",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "focus-visible",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否通过键盘切换获得了焦点\n添加到 :host 元素上，供 CSS 选择器添加样式",
"fieldName": "focusVisible",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
},
{
"name": "tabindex",
"type": {
"text": "number"
},
"description": "元素在使用 Tab 键切换焦点时的顺序",
"fieldName": "tabIndex",
"inheritedFrom": {
"name": "FocusableMixin",
"module": "@mdui/shared/mixins/focusable.js"
}
}
],
"mixins": [
{
"name": "FocusableMixin",
"package": "@mdui/shared/mixins/focusable.js"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "文本框组件\n\n```html\n<mdui-text-field label=\"Text Field\"></mdui-text-field>\n```",
"tagName": "mdui-text-field",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "TextField",
"declaration": {
"name": "TextField",
"module": "components/text-field/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-text-field",
"declaration": {
"name": "TextField",
"module": "components/text-field/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/tooltip/index.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "Tooltip",
"cssProperties": [
{
"description": "当 variant=\"plain\" 时，组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner-plain"
},
{
"description": "当 variant=\"rich\" 时，组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner-rich"
},
{
"description": "组件的 CSS `z-index` 值",
"name": "--z-index"
}
],
"cssParts": [
{
"description": "tooltip 的容器",
"name": "popup"
},
{
"description": "标题",
"name": "headline"
},
{
"description": "正文",
"name": "content"
},
{
"description": "操作按钮",
"name": "action"
}
],
"slots": [
{
"description": "tooltip 触发的目标元素，只有 `default` slot 中的第一个元素会作为目标元素",
"name": ""
},
{
"description": "tooltip 的标题，只有当 `variant=\"rich\"` 时，此 slot 才有效",
"name": "headline"
},
{
"description": "tooltip 的内容，可以包含 HTML。若只包含纯文本，可以使用 `content` 属性代替",
"name": "content"
},
{
"description": "tooltip 底部的按钮，只有当 `variant=\"rich\"` 时，此 slot 才有效",
"name": "action"
}
],
"members": [
{
"kind": "field",
"name": "variant",
"type": {
"text": "| /*纯文本，适用于简单的单行文本*/ 'plain'\n | /*富文本，可以包含标题、正文和操作按钮*/ 'rich'"
},
"privacy": "public",
"default": "'plain'",
"description": "tooltip 的形状。默认为 `plain`。可选值包括：\n\n* `plain`：纯文本，适用于简单的单行文本\n* `rich`：富文本，可以包含标题、正文和操作按钮",
"attribute": "variant",
"reflects": true
},
{
"kind": "field",
"name": "placement",
"type": {
"text": "| /*自动判断位置*/ 'auto'\n | /*位于左上方*/ 'top-left'\n | /*位于上方，左对齐*/ 'top-start'\n | /*位于上方，居中对齐*/ 'top'\n | /*位于上方，右对齐*/ 'top-end'\n | /*位于右上方*/ 'top-right'\n | /*位于左下方*/ 'bottom-left'\n | /*位于下方，左对齐*/ 'bottom-start'\n | /*位于下方，居中对齐*/ 'bottom'\n | /*位于下方，右对齐*/ 'bottom-end'\n | /*位于右下方*/ 'bottom-right'\n | /*位于左侧，顶部对齐*/ 'left-start'\n | /*位于左侧，居中对齐*/ 'left'\n | /*位于左侧，底部对齐*/ 'left-end'\n | /*位于右侧，顶部对齐*/ 'right-start'\n | /*位于右侧，居中对齐*/ 'right'\n | /*位于右侧，底部对齐*/ 'right-end'"
},
"privacy": "public",
"default": "'auto'",
"description": "tooltip 的位置。默认为 `auto`。可选值包括：\n\n* `auto`：自动判断位置。`variant=\"plain\"` 时，优先使用 `top`；`variant=\"rich\"` 时，优先使用 `bottom-right`\n* `top-left`：位于左上方\n* `top-start`：位于上方，左对齐\n* `top`：位于上方，居中对齐\n* `top-end`：位于上方，右对齐\n* `top-right`：位于右上方\n* `bottom-left`：位于左下方\n* `bottom-start`：位于下方，左对齐\n* `bottom`：位于下方，居中对齐\n* `bottom-end`：位于下方，右对齐\n* `bottom-right`：位于右下方\n* `left-start`：位于左侧，顶部对齐\n* `left`：位于左侧，居中对齐\n* `left-end`：位于左侧，底部对齐\n* `right-start`：位于右侧，顶部对齐\n* `right`：位于右侧，居中对齐\n* `right-end`：位于右侧，底部对齐",
"attribute": "placement",
"reflects": true
},
{
"kind": "field",
"name": "openDelay",
"type": {
"text": "number"
},
"privacy": "public",
"default": "150",
"description": "鼠标悬浮触发显示的延时，单位为毫秒",
"attribute": "open-delay",
"reflects": true
},
{
"kind": "field",
"name": "closeDelay",
"type": {
"text": "number"
},
"privacy": "public",
"default": "150",
"description": "鼠标悬浮触发隐藏的延时，单位为毫秒",
"attribute": "close-delay",
"reflects": true
},
{
"kind": "field",
"name": "headline",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "tooltip 的标题。仅 `variant=\"rich\"` 时可使用。也可以通过 `slot=\"headline\"` 设置",
"attribute": "headline",
"reflects": true
},
{
"kind": "field",
"name": "content",
"type": {
"text": "string | undefined"
},
"privacy": "public",
"description": "tooltip 的内容。也可以通过 `slot=\"content\"` 设置",
"attribute": "content",
"reflects": true
},
{
"kind": "field",
"name": "trigger",
"type": {
"text": "| /*点击时触发*/ 'click'\n | /*鼠标悬浮时触发*/ 'hover'\n | /*聚焦时触发*/ 'focus'\n | /*只能通过编程方式打开和关闭 tooltip，不能再指定其他触发方式*/ 'manual'\n | string"
},
"privacy": "public",
"default": "'hover focus'",
"description": "触发方式，支持多个值，用空格分隔。可选值包括：\n\n* `click`：点击时触发\n* `hover`：鼠标悬浮时触发\n* `focus`：聚焦时触发\n* `manual`：只能通过编程方式打开和关闭 tooltip，不能再指定其他触发方式",
"attribute": "trigger",
"reflects": true
},
{
"kind": "field",
"name": "disabled",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否禁用 tooltip",
"attribute": "disabled",
"reflects": true
},
{
"kind": "field",
"name": "open",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否显示 tooltip",
"attribute": "open",
"reflects": true
},
{
"kind": "field",
"name": "observeResize",
"type": {
"text": "ObserveResize | undefined"
},
"privacy": "private"
},
{
"kind": "field",
"name": "overflowAncestors",
"type": {
"text": "ReturnType<typeof getOverflowAncestors> | undefined"
},
"privacy": "private"
},
{
"kind": "field",
"name": "hoverTimeout",
"type": {
"text": "number"
},
"privacy": "private"
},
{
"kind": "field",
"name": "popupRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController( this, 'headline', 'action', )"
},
{
"kind": "field",
"name": "hoverController",
"privacy": "private",
"readonly": true,
"default": "new HoverController(this, this.popupRef)"
},
{
"kind": "field",
"name": "definedController",
"privacy": "private",
"readonly": true,
"default": "new DefinedController(this, { needDomReady: true, })"
},
{
"kind": "field",
"name": "target",
"type": {
"text": "HTMLElement"
},
"privacy": "private",
"description": "获取第一个非 <style> 和 content slot 的子元素，作为 tooltip 的目标元素",
"readonly": true
},
{
"kind": "method",
"name": "onPositionChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onOpenChange",
"privacy": "private"
},
{
"kind": "method",
"name": "isRich",
"privacy": "private",
"return": {
"type": {
"text": "boolean"
}
}
},
{
"kind": "method",
"name": "requestClose",
"privacy": "private",
"description": "请求关闭 tooltip。鼠标未悬浮在 tooltip 上时，直接关闭；否则等鼠标移走再关闭"
},
{
"kind": "method",
"name": "hasTrigger",
"privacy": "private",
"return": {
"type": {
"text": "boolean"
}
},
"parameters": [
{
"name": "trigger",
"type": {
"text": "string"
}
}
]
},
{
"kind": "method",
"name": "onFocus",
"privacy": "private"
},
{
"kind": "method",
"name": "onBlur",
"privacy": "private"
},
{
"kind": "method",
"name": "onClick",
"privacy": "private",
"parameters": [
{
"name": "e",
"type": {
"text": "MouseEvent"
}
}
]
},
{
"kind": "method",
"name": "onKeydown",
"privacy": "private",
"parameters": [
{
"name": "e",
"type": {
"text": "KeyboardEvent"
}
}
]
},
{
"kind": "method",
"name": "onMouseEnter",
"privacy": "private"
},
{
"kind": "method",
"name": "onMouseLeave",
"privacy": "private"
},
{
"kind": "method",
"name": "onDocumentClick",
"privacy": "private",
"parameters": [
{
"name": "e",
"type": {
"text": "MouseEvent"
}
}
],
"description": "在 document 上点击时，根据条件判断是否关闭 tooltip"
},
{
"kind": "method",
"name": "onWindowScroll",
"privacy": "private"
},
{
"kind": "method",
"name": "updatePositioner",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
}
}
],
"events": [
{
"description": "tooltip 开始显示时，事件被触发。可以通过调用 `event.preventDefault()` 阻止 tooltip 打开",
"name": "open"
},
{
"description": "tooltip 显示动画完成时，事件被触发",
"name": "opened"
},
{
"description": "tooltip 开始隐藏时，事件被触发。可以通过调用 `event.preventDefault()` 阻止 tooltip 关闭",
"name": "close"
},
{
"description": "tooltip 隐藏动画完成时，事件被触发",
"name": "closed"
}
],
"attributes": [
{
"name": "variant",
"type": {
"text": "| /*纯文本，适用于简单的单行文本*/ 'plain'\n | /*富文本，可以包含标题、正文和操作按钮*/ 'rich'"
},
"default": "'plain'",
"description": "tooltip 的形状。默认为 `plain`。可选值包括：\n\n* `plain`：纯文本，适用于简单的单行文本\n* `rich`：富文本，可以包含标题、正文和操作按钮",
"fieldName": "variant"
},
{
"name": "placement",
"type": {
"text": "| /*自动判断位置*/ 'auto'\n | /*位于左上方*/ 'top-left'\n | /*位于上方，左对齐*/ 'top-start'\n | /*位于上方，居中对齐*/ 'top'\n | /*位于上方，右对齐*/ 'top-end'\n | /*位于右上方*/ 'top-right'\n | /*位于左下方*/ 'bottom-left'\n | /*位于下方，左对齐*/ 'bottom-start'\n | /*位于下方，居中对齐*/ 'bottom'\n | /*位于下方，右对齐*/ 'bottom-end'\n | /*位于右下方*/ 'bottom-right'\n | /*位于左侧，顶部对齐*/ 'left-start'\n | /*位于左侧，居中对齐*/ 'left'\n | /*位于左侧，底部对齐*/ 'left-end'\n | /*位于右侧，顶部对齐*/ 'right-start'\n | /*位于右侧，居中对齐*/ 'right'\n | /*位于右侧，底部对齐*/ 'right-end'"
},
"default": "'auto'",
"description": "tooltip 的位置。默认为 `auto`。可选值包括：\n\n* `auto`：自动判断位置。`variant=\"plain\"` 时，优先使用 `top`；`variant=\"rich\"` 时，优先使用 `bottom-right`\n* `top-left`：位于左上方\n* `top-start`：位于上方，左对齐\n* `top`：位于上方，居中对齐\n* `top-end`：位于上方，右对齐\n* `top-right`：位于右上方\n* `bottom-left`：位于左下方\n* `bottom-start`：位于下方，左对齐\n* `bottom`：位于下方，居中对齐\n* `bottom-end`：位于下方，右对齐\n* `bottom-right`：位于右下方\n* `left-start`：位于左侧，顶部对齐\n* `left`：位于左侧，居中对齐\n* `left-end`：位于左侧，底部对齐\n* `right-start`：位于右侧，顶部对齐\n* `right`：位于右侧，居中对齐\n* `right-end`：位于右侧，底部对齐",
"fieldName": "placement"
},
{
"name": "open-delay",
"type": {
"text": "number"
},
"default": "150",
"description": "鼠标悬浮触发显示的延时，单位为毫秒",
"fieldName": "openDelay"
},
{
"name": "close-delay",
"type": {
"text": "number"
},
"default": "150",
"description": "鼠标悬浮触发隐藏的延时，单位为毫秒",
"fieldName": "closeDelay"
},
{
"name": "headline",
"type": {
"text": "string | undefined"
},
"description": "tooltip 的标题。仅 `variant=\"rich\"` 时可使用。也可以通过 `slot=\"headline\"` 设置",
"fieldName": "headline"
},
{
"name": "content",
"type": {
"text": "string | undefined"
},
"description": "tooltip 的内容。也可以通过 `slot=\"content\"` 设置",
"fieldName": "content"
},
{
"name": "trigger",
"type": {
"text": "| /*点击时触发*/ 'click'\n | /*鼠标悬浮时触发*/ 'hover'\n | /*聚焦时触发*/ 'focus'\n | /*只能通过编程方式打开和关闭 tooltip，不能再指定其他触发方式*/ 'manual'\n | string"
},
"default": "'hover focus'",
"description": "触发方式，支持多个值，用空格分隔。可选值包括：\n\n* `click`：点击时触发\n* `hover`：鼠标悬浮时触发\n* `focus`：聚焦时触发\n* `manual`：只能通过编程方式打开和关闭 tooltip，不能再指定其他触发方式",
"fieldName": "trigger"
},
{
"name": "disabled",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否禁用 tooltip",
"fieldName": "disabled"
},
{
"name": "open",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否显示 tooltip",
"fieldName": "open"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "工具提示组件\n\n```html\n<mdui-tooltip content=\"tooltip content\">\n..<mdui-button>button</mdui-button>\n</mdui-tooltip>\n```",
"tagName": "mdui-tooltip",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "Tooltip",
"declaration": {
"name": "Tooltip",
"module": "components/tooltip/index.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-tooltip",
"declaration": {
"name": "Tooltip",
"module": "components/tooltip/index.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/top-app-bar/top-app-bar-title.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "TopAppBarTitle",
"cssParts": [
{
"description": "标题文本",
"name": "label"
},
{
"description": "展开状态下的标题文本",
"name": "label-large"
}
],
"slots": [
{
"description": "顶部应用栏的标题文本",
"name": ""
},
{
"description": "展开状态下的标题文本",
"name": "label-large"
}
],
"members": [
{
"kind": "field",
"name": "variant",
"type": {
"text": "| 'center-aligned' /*预览图*/\n | 'small' /*预览图*/\n | 'medium' /*预览图*/\n | 'large'"
},
"privacy": "private",
"default": "'small'",
"description": "顶部应用栏形状。由 mdui-top-app-bar 组件控制该参数"
},
{
"kind": "field",
"name": "shrink",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "是否缩小成 `variant=\"small\"` 的样式，仅在 `variant=\"medium\"` 或 `variant=\"large\"` 时生效。由 mdui-top-app-bar 组件控制该参数"
},
{
"kind": "field",
"name": "hasSlotController",
"privacy": "private",
"readonly": true,
"default": "new HasSlotController( this, 'label-large', )"
},
{
"kind": "field",
"name": "labelLargeRef",
"type": {
"text": "Ref<HTMLElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "defaultSlotRef",
"type": {
"text": "Ref<HTMLSlotElement>"
},
"privacy": "private",
"readonly": true
},
{
"kind": "method",
"name": "onSlotChange",
"privacy": "private",
"parameters": [
{
"name": "hasLabelLargeSlot",
"type": {
"text": "boolean"
}
}
],
"description": "default slot 变化时，同步到 label-large 中"
}
],
"superclass": {
"name": "MduiElement",
"package": "@mdui/shared/base/mdui-element.js"
},
"summary": "顶部应用栏标题组件。需配合 `<mdui-top-app-bar>` 组件使用\n\n```html\n<mdui-top-app-bar>\n..<mdui-button-icon icon=\"menu\"></mdui-button-icon>\n..<mdui-top-app-bar-title>Title</mdui-top-app-bar-title>\n..<div style=\"flex-grow: 1\"></div>\n..<mdui-button-icon icon=\"more_vert\"></mdui-button-icon>\n</mdui-top-app-bar>\n```",
"tagName": "mdui-top-app-bar-title",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "TopAppBarTitle",
"declaration": {
"name": "TopAppBarTitle",
"module": "components/top-app-bar/top-app-bar-title.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-top-app-bar-title",
"declaration": {
"name": "TopAppBarTitle",
"module": "components/top-app-bar/top-app-bar-title.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "components/top-app-bar/top-app-bar.js",
"declarations": [
{
"kind": "class",
"description": "",
"name": "TopAppBar",
"cssProperties": [
{
"description": "组件的圆角大小。可以指定一个具体的像素值；但更推荐引用[设计令牌](/docs/2/styles/design-tokens#shape-corner)",
"name": "--shape-corner"
},
{
"description": "组件的 CSS `z-index` 值",
"name": "--z-index"
}
],
"slots": [
{
"description": "顶部应用栏内部的元素",
"name": ""
}
],
"members": [
{
"kind": "field",
"name": "variant",
"type": {
"text": "| /*小型应用栏，标题居中*/ 'center-aligned'\n | /*小型应用栏*/ 'small'\n | /*中型应用栏*/ 'medium'\n | /*大型应用栏*/ 'large'"
},
"privacy": "public",
"default": "'small'",
"description": "顶部应用栏的形状。默认为 `small`。可选值包括：\n\n* `center-aligned`：小型应用栏，标题居中\n* `small`：小型应用栏\n* `medium`：中型应用栏\n* `large`：大型应用栏",
"attribute": "variant",
"reflects": true
},
{
"kind": "field",
"name": "hide",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否隐藏",
"attribute": "hide",
"reflects": true
},
{
"kind": "field",
"name": "shrink",
"type": {
"text": "boolean"
},
"privacy": "public",
"default": "false",
"description": "是否缩小为 `variant=\"small\"` 的样式，仅在 `variant=\"medium\"` 或 `variant=\"large\"` 时生效",
"attribute": "shrink",
"reflects": true
},
{
"kind": "field",
"name": "scrollBehavior",
"type": {
"text": "'hide' | 'shrink' | 'elevate' | undefined"
},
"privacy": "public",
"description": "滚动行为。可同时使用多个值，用空格分隔。可选值包括：\n\n* `hide`：滚动时隐藏\n* `shrink`：在中型、大型应用栏中可使用，滚动时缩小成小型应用栏的样式\n* `elevate`：滚动时添加阴影",
"attribute": "scroll-behavior",
"reflects": true,
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "scrolling",
"type": {
"text": "boolean"
},
"privacy": "private",
"default": "false",
"description": "滚动条是否不位于顶部",
"attribute": "scrolling",
"reflects": true
},
{
"kind": "field",
"name": "titleElements",
"type": {
"text": "TopAppBarTitle[]"
},
"privacy": "private",
"readonly": true
},
{
"kind": "field",
"name": "definedController",
"privacy": "private",
"default": "new DefinedController(this, { relatedElements: ['mdui-top-app-bar-title'], })"
},
{
"kind": "field",
"name": "scrollPaddingPosition",
"type": {
"text": "ScrollPaddingPosition"
},
"privacy": "protected",
"description": "滚动时，如果需要给 container 添加 padding，添加在顶部还是底部",
"readonly": true,
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "layoutPlacement",
"type": {
"text": "LayoutPlacement"
},
"privacy": "protected",
"description": "当前布局组件所处的位置，父类必须实现该 getter",
"readonly": true,
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "method",
"name": "onVariantChange",
"privacy": "private"
},
{
"kind": "method",
"name": "onShrinkChange",
"privacy": "private"
},
{
"kind": "method",
"name": "runScrollNoThreshold",
"privacy": "protected",
"parameters": [
{
"name": "isScrollingUp",
"type": {
"text": "boolean"
}
},
{
"name": "scrollTop",
"type": {
"text": "number"
}
}
],
"description": "执行滚动事件，会无视 scrollThreshold，始终会执行",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "runScrollThreshold",
"privacy": "protected",
"parameters": [
{
"name": "isScrollingUp",
"type": {
"text": "boolean"
}
},
{
"name": "scrollTop",
"type": {
"text": "number"
}
}
],
"description": "执行滚动事件，在滚动距离超过 scrollThreshold 时才会执行\nNote: 父类可以按需实现该方法",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "scrollTarget",
"type": {
"text": "string | HTMLElement | JQ<HTMLElement> | undefined"
},
"privacy": "public",
"description": "需要监听其滚动事件的元素。值可以是 CSS 选择器、DOM 元素、或 [JQ 对象](/docs/2/functions/jq)。默认监听 `window` 的滚动事件",
"attribute": "scroll-target",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "scrollThreshold",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "在滚动多少距离之后触发滚动行为，单位为 `px`",
"attribute": "scroll-threshold",
"reflects": true,
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "scrollBehaviorDefinedController",
"privacy": "protected",
"default": "new DefinedController(this, { needDomReady: true, })",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "lastScrollTopThreshold",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"description": "上次滚动后，垂直方向的距离（滚动距离超过 scrollThreshold 才记录）",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "lastScrollTopNoThreshold",
"type": {
"text": "number"
},
"privacy": "private",
"default": "0",
"description": "上次滚动后，垂直方向的距离（无视 scrollThreshold，始终记录）",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "isParentLayout",
"type": {
"text": "boolean"
},
"privacy": "protected",
"default": "false",
"description": "父元素是否是 `mdui-layout`",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "method",
"name": "onScrollTargetChange",
"privacy": "private",
"parameters": [
{
"name": "oldValue",
"type": {
"text": "string"
}
},
{
"name": "newValue",
"type": {
"text": "string"
}
}
],
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "onScrollBehaviorChange",
"privacy": "private",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "hasScrollBehavior",
"privacy": "protected",
"return": {
"type": {
"text": "boolean"
}
},
"parameters": [
{
"name": "behavior",
"type": {
"text": "ScrollBehavior | ScrollBehavior[]"
},
"description": "为数组时，只要其中一个行为在 scrollBehavior 中，即返回 `true`"
}
],
"description": "scrollBehavior 包含多个滚动行为，用空格分割\n用该方法判断指定滚动行为是否在 scrollBehavior 中",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "setContainerPadding",
"privacy": "protected",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "action",
"type": {
"text": "'add' | 'update' | 'remove'"
},
"description": "新增、更新、移除 padding"
},
{
"name": "scrollTarget",
"optional": true,
"type": {
"text": "string | HTMLElement | JQ<HTMLElement>"
},
"description": "在该元素上添加、更新或移除 padding"
}
],
"description": "更新滚动容器的 padding，避免内容被 navigation-bar 覆盖",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "onListeningScroll",
"privacy": "private",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "onScroll",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "listening",
"type": {
"text": "HTMLElement | Window"
}
}
],
"description": "滚动事件，这里过滤掉不符合条件的滚动",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "updateScrollTop",
"privacy": "private",
"return": {
"type": {
"text": "void"
}
},
"parameters": [
{
"name": "listening",
"type": {
"text": "HTMLElement | Window"
}
}
],
"description": "重新更新 lastScrollTopThreshold、lastScrollTopNoThreshold 的值\n用于在 scrollTarget、scrollBehavior 变更时，重新设置 lastScrollTopThreshold、lastScrollTopNoThreshold 的初始值",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "getListening",
"privacy": "private",
"return": {
"type": {
"text": "HTMLElement | Window | undefined"
}
},
"parameters": [
{
"name": "target",
"optional": true,
"type": {
"text": "string | HTMLElement | JQ<HTMLElement>"
}
}
],
"description": "获取组件需要监听哪个元素的滚动状态",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "method",
"name": "getContainer",
"privacy": "private",
"return": {
"type": {
"text": "HTMLElement | undefined"
}
},
"parameters": [
{
"name": "target",
"optional": true,
"type": {
"text": "string | HTMLElement | JQ<HTMLElement>"
}
}
],
"description": "获取组件在哪个容器内滚动",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"kind": "field",
"name": "order",
"type": {
"text": "number | undefined"
},
"privacy": "public",
"description": "该组件在 [`<mdui-layout>`](/docs/2/components/layout) 中的布局顺序，按从小到大排序。默认为 `0`",
"attribute": "order",
"reflects": true,
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "field",
"name": "layoutManager",
"type": {
"text": "LayoutManager | undefined"
},
"privacy": "protected",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
},
{
"kind": "method",
"name": "onOrderChange",
"privacy": "private",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
}
],
"events": [
{
"description": "开始显示时，事件被触发。可以通过调用 `event.preventDefault()` 阻止显示",
"name": "show"
},
{
"description": "显示动画完成时，事件被触发",
"name": "shown"
},
{
"description": "开始隐藏时，事件被触发。可以通过调用 `event.preventDefault()` 阻止隐藏",
"name": "hide"
},
{
"description": "隐藏动画完成时，事件被触发",
"name": "hidden"
}
],
"attributes": [
{
"name": "variant",
"type": {
"text": "| /*小型应用栏，标题居中*/ 'center-aligned'\n | /*小型应用栏*/ 'small'\n | /*中型应用栏*/ 'medium'\n | /*大型应用栏*/ 'large'"
},
"default": "'small'",
"description": "顶部应用栏的形状。默认为 `small`。可选值包括：\n\n* `center-aligned`：小型应用栏，标题居中\n* `small`：小型应用栏\n* `medium`：中型应用栏\n* `large`：大型应用栏",
"fieldName": "variant"
},
{
"name": "hide",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否隐藏",
"fieldName": "hide"
},
{
"name": "shrink",
"type": {
"text": "boolean"
},
"default": "false",
"description": "是否缩小为 `variant=\"small\"` 的样式，仅在 `variant=\"medium\"` 或 `variant=\"large\"` 时生效",
"fieldName": "shrink"
},
{
"name": "scroll-behavior",
"type": {
"text": "'hide' | 'shrink' | 'elevate' | undefined"
},
"description": "滚动行为。可同时使用多个值，用空格分隔。可选值包括：\n\n* `hide`：滚动时隐藏\n* `shrink`：在中型、大型应用栏中可使用，滚动时缩小成小型应用栏的样式\n* `elevate`：滚动时添加阴影",
"fieldName": "scrollBehavior",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"name": "scrolling",
"type": {
"text": "boolean"
},
"default": "false",
"description": "滚动条是否不位于顶部",
"fieldName": "scrolling"
},
{
"name": "scroll-target",
"type": {
"text": "string | HTMLElement | JQ<HTMLElement> | undefined"
},
"description": "需要监听其滚动事件的元素。值可以是 CSS 选择器、DOM 元素、或 [JQ 对象](/docs/2/functions/jq)。默认监听 `window` 的滚动事件",
"fieldName": "scrollTarget",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"name": "scroll-threshold",
"type": {
"text": "number | undefined"
},
"description": "在滚动多少距离之后触发滚动行为，单位为 `px`",
"fieldName": "scrollThreshold",
"inheritedFrom": {
"name": "ScrollBehaviorMixin",
"module": "@mdui/shared/mixins/scrollBehavior.js"
}
},
{
"name": "order",
"type": {
"text": "number | undefined"
},
"description": "该组件在 [`<mdui-layout>`](/docs/2/components/layout) 中的布局顺序，按从小到大排序。默认为 `0`",
"fieldName": "order",
"inheritedFrom": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
}
}
],
"mixins": [
{
"name": "ScrollBehaviorMixin",
"package": "@mdui/shared/mixins/scrollBehavior.js"
}
],
"superclass": {
"name": "LayoutItemBase",
"module": "components/layout/layout-item-base.js"
},
"summary": "顶部应用栏组件\n\n```html\n<mdui-top-app-bar>\n..<mdui-button-icon icon=\"menu\"></mdui-button-icon>\n..<mdui-top-app-bar-title>Title</mdui-top-app-bar-title>\n..<div style=\"flex-grow: 1\"></div>\n..<mdui-button-icon icon=\"more_vert\"></mdui-button-icon>\n</mdui-top-app-bar>\n```",
"tagName": "mdui-top-app-bar",
"customElement": true
}
],
"exports": [
{
"kind": "js",
"name": "TopAppBar",
"declaration": {
"name": "TopAppBar",
"module": "components/top-app-bar/top-app-bar.js"
}
},
{
"kind": "custom-element-definition",
"name": "mdui-top-app-bar",
"declaration": {
"name": "TopAppBar",
"module": "components/top-app-bar/top-app-bar.js"
}
}
]
}
]
}
Reference in New Issue View Git Blame Copy Permalink