mdui
Version:
实现 material you 设计规范的 Web Components 组件库
6,554 lines • 265 kB
JSON
{
"version": 1.1,
"tags": [
{
"name": "mdui-avatar",
"description": "Avatar Component \n\n```html\n<mdui-avatar src=\"https://avatars githubusercontent com/u/3030330?s=40&v=4\"></mdui-avatar>\n```",
"attributes": [
{
"name": "src",
"description": "URL of the avatar image.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/avatar#attributes-src"
}
]
},
{
"name": "fit",
"description": "Image resizing method, similar to the CSS [`object-fit`](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit) property. Possible values:\n\n* `contain`: Scales the image to fit within the box while preserving aspect ratio. The image will be \"letterboxed\" if the aspect ratios do not match.\n* `cover`: Scales the image to fill the box while preserving aspect ratio. The image will be clipped if the aspect ratios do not match.\n* `fill`: Default. Scales the image to fill the box; the image may be stretched if aspect ratios do not match.\n* `none`: No resizing.\n* `scale-down`: Scales the image down to fit. Behaves like `none` or `contain`, whichever results in the smaller image.",
"values": [
{
"name": "contain",
"description": "Scales the image to fit within the box while preserving aspect ratio. The image will be \"letterboxed\" if the aspect ratios do not match."
},
{
"name": "cover",
"description": "Scales the image to fill the box while preserving aspect ratio. The image will be clipped if the aspect ratios do not match."
},
{
"name": "fill",
"description": "Default. Scales the image to fill the box; the image may be stretched if aspect ratios do not match."
},
{
"name": "none",
"description": "No resizing."
},
{
"name": "scale-down",
"description": "Scales the image down to fit. Behaves like `none` or `contain`, whichever results in the smaller image."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/avatar#attributes-fit"
}
]
},
{
"name": "icon",
"description": "The Material Icons name for the avatar.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/avatar#attributes-icon"
}
]
},
{
"name": "label",
"description": "Text description of the avatar.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/avatar#attributes-label"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/avatar"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/avatar/index.ts"
}
]
},
{
"name": "mdui-badge",
"description": "Badge Component \n\n```html\n<mdui-badge>12</mdui-badge>\n```",
"attributes": [
{
"name": "variant",
"description": "Defines the badge size. Possible values:\n* `small`: A small badge without text.\n* `large`: A large badge with text.",
"values": [
{
"name": "small",
"description": "A small badge without text."
},
{
"name": "large",
"description": "A large badge with text."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/badge#attributes-variant"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/badge"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/badge/index.ts"
}
]
},
{
"name": "mdui-bottom-app-bar",
"description": "Bottom App Bar Component \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```",
"attributes": [
{
"name": "hide",
"description": "Whether the bottom app bar is hidden.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/bottom-app-bar#attributes-hide"
}
]
},
{
"name": "fab-detach",
"description": "If set, detaches the [`<mdui-fab>`](/en/docs/2/components/fab) from the bottom app bar. The [`<mdui-fab>`](/en/docs/2/components/fab) remains on the page even after the app bar is hidden.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/bottom-app-bar#attributes-fab-detach"
}
]
},
{
"name": "scroll-behavior",
"description": "Specifies the scroll behavior. Possible values:\n\n* `hide`: Hides when scrolling.",
"values": [
{
"name": "hide"
},
{
"name": "shrink"
},
{
"name": "elevate"
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/bottom-app-bar#attributes-scroll-behavior"
}
]
},
{
"name": "scroll-target",
"description": "The element to watch for scroll events. Accepts a CSS selector, a DOM element, or a [JQ object](/en/docs/2/functions/jq). Defaults to `window`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/bottom-app-bar#attributes-scroll-target"
}
]
},
{
"name": "scroll-threshold",
"description": "The scroll distance (in pixels) required to trigger the scroll behavior.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/bottom-app-bar#attributes-scroll-threshold"
}
]
},
{
"name": "order",
"description": "Specifies the layout order within the [`<mdui-layout>`](/en/docs/2/components/layout) component. Items are sorted in ascending order. The default value is `0`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/bottom-app-bar#attributes-order"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/bottom-app-bar"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/bottom-app-bar/index.ts"
}
]
},
{
"name": "mdui-button-icon",
"description": "Icon Button Component \n\n```html\n<mdui-button-icon icon=\"search\"></mdui-button-icon>\n```",
"attributes": [
{
"name": "variant",
"description": "Defines the icon button variant. Possible values:\n* `standard`: For low-priority actions.\n* `filled`: Has the strongest visual emphasis and works well for high-priority actions.\n* `tonal`: Blends `filled` and `outlined`, and works well for medium- to high-priority actions.\n* `outlined`: For medium-priority or secondary actions.",
"values": [
{
"name": "standard",
"description": "For low-priority actions."
},
{
"name": "filled",
"description": "Has the strongest visual effect, suitable for high-priority actions."
},
{
"name": "tonal",
"description": "A blend of `filled` and `outlined`, suitable for medium- to high-priority actions."
},
{
"name": "outlined",
"description": "For medium-priority or secondary actions."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-variant"
}
]
},
{
"name": "icon",
"description": "Specifies the Material Icons name. Alternatively, use the default slot.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-icon"
}
]
},
{
"name": "selected-icon",
"description": "Specifies the Material Icons name when selected. Alternatively, use `slot=\"selected-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-selected-icon"
}
]
},
{
"name": "selectable",
"description": "Makes the button selectable.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-selectable"
}
]
},
{
"name": "selected",
"description": "Indicates whether the button is selected.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-selected"
}
]
},
{
"name": "href",
"description": "The URL for the link. When set, the component renders as an `<a>` element and supports link-related attributes.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-href"
}
]
},
{
"name": "download",
"description": "Downloads the linked URL.\n\n**Note**: Only available when `href` is specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-download"
}
]
},
{
"name": "target",
"description": "Controls where the linked URL opens. Possible values:\n\n* `_blank`: Opens in a new tab or window.\n* `_parent`: Opens in the parent browsing context, or `_self` if there is no parent.\n* `_self`: Opens in the current browsing context (default).\n* `_top`: Opens in the topmost browsing context, or `_self` if there are no ancestors.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "_blank",
"description": "Opens in a new tab or window."
},
{
"name": "_parent",
"description": "Opens in the parent browsing context, or `_self` if there is no parent."
},
{
"name": "_self",
"description": "Opens in the current browsing context (default)."
},
{
"name": "_top",
"description": "Opens in the topmost browsing context, or `_self` if there are no ancestors."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-target"
}
]
},
{
"name": "rel",
"description": "Specifies the relationship of the linked URL as space-separated link types. Possible values:\n\n* `alternate`: An alternate version of the current document.\n* `author`: The author of the current document or article.\n* `bookmark`: The permalink for the nearest ancestor section.\n* `external`: The referenced document is not part of the same site as the current document.\n* `help`: A link to context-sensitive help.\n* `license`: Content covered by the copyright license described by the referenced document.\n* `me`: Links to content owned by the current document's author.\n* `next`: The next document in the series.\n* `nofollow`: Not endorsed by the original author or publisher.\n* `noreferrer`: Prevents the `Referer` header from being sent. Same effect as `noopener`.\n* `opener`: Creates an auxiliary browsing context if the hyperlink would otherwise create a top-level browsing context that is not an auxiliary one (i.e., when `target=\"_blank\"`).\n* `prev`: The previous document in the series.\n* `search`: Links to a resource that can be used to search through the current document and its related pages.\n* `tag`: Marks the current document with the given tag.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "alternate",
"description": "An alternate version of the current document."
},
{
"name": "author",
"description": "The author of the current document or article."
},
{
"name": "bookmark",
"description": "The permalink for the nearest ancestor section."
},
{
"name": "external",
"description": "The referenced document is not part of the same site as the current document."
},
{
"name": "help",
"description": "A link to context-sensitive help."
},
{
"name": "license",
"description": "Indicates that the main content of the current document is covered by the copyright license described by the referenced document."
},
{
"name": "me",
"description": "Indicates that the current document represents the person who owns the linked content."
},
{
"name": "next",
"description": "Indicates that the current document is part of a series and that the next document in the series is the referenced document."
},
{
"name": "nofollow",
"description": "Indicates that the current document's original author or publisher does not endorse the referenced document."
},
{
"name": "noreferrer",
"description": "Prevents the `Referer` header from being sent. It has the same effect as `noopener`."
},
{
"name": "opener",
"description": "Creates a new browsing context when the hyperlink would otherwise open in a top-level context that is not auxiliary (for example, when `target=\"_blank\"` is specified)."
},
{
"name": "prev",
"description": "Indicates that the current document is part of a series and that the previous document in the series is the referenced document."
},
{
"name": "search",
"description": "Links to a resource that can be used to search through the current document and its related pages."
},
{
"name": "tag",
"description": "Assigns a tag, identified by the given address, to the current document."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-rel"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-tabindex"
}
]
},
{
"name": "disabled",
"description": "Disables the element.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-disabled"
}
]
},
{
"name": "loading",
"description": "Indicates that the element is in a loading state.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-loading"
}
]
},
{
"name": "name",
"description": "The button name submitted with form data.\n\n**Note**: Only available when `href` is not specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-name"
}
]
},
{
"name": "value",
"description": "The button value submitted with form data.\n\n**Note**: Only available when `href` is not specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-value"
}
]
},
{
"name": "type",
"description": "Specifies the button's default action. Default: `button`. Possible values:\n\n* `submit`: Submits the form data to the server.\n* `reset`: Restores all controls to their initial values.\n* `button`: Does nothing by default.\n\n**Note**: Only available when `href` is not specified.",
"values": [
{
"name": "submit",
"description": "Submits the form data to the server."
},
{
"name": "reset",
"description": "Resets all controls to their initial values."
},
{
"name": "button",
"description": "Has no default action."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-type"
}
]
},
{
"name": "form",
"description": "Associates the button with a `<form>` element. Set this to the `id` of a `<form>` in the same document. If omitted, the button uses its parent `<form>`, if any.\n\nThis lets the button target any form in the document, not just the one it is nested in.\n\n**Note**: Only available when `href` is not specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-form"
}
]
},
{
"name": "formaction",
"description": "Specifies the URL that processes the button's submitted information. Overrides the `action` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-formaction"
}
]
},
{
"name": "formenctype",
"description": "Specifies how to encode the form data. Possible values:\n\n* `application/x-www-form-urlencoded`: Default when the attribute is omitted.\n* `multipart/form-data`: Used for `<input>` elements with `type=\"file\"`.\n* `text/plain`: Useful for debugging, but not for actual form submissions.\n\nOverrides the `enctype` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"values": [
{
"name": "application/x-www-form-urlencoded",
"description": "Default if the attribute is not used."
},
{
"name": "multipart/form-data",
"description": "Used for `<input>` elements with `type=\"file\"`."
},
{
"name": "text/plain",
"description": "For debugging, not for real form submission."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-formenctype"
}
]
},
{
"name": "formmethod",
"description": "Specifies the HTTP method for form submission. Possible values:\n\n* `post`: Sends the form data in the request body.\n* `get`: Appends the form data to the `action` URL.\n\nOverrides the `method` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"values": [
{
"name": "post",
"description": "Form data is included in the HTTP request body."
},
{
"name": "get",
"description": "Form data is appended to the `action` URL."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-formmethod"
}
]
},
{
"name": "formnovalidate",
"description": "Specifies that the form should not be validated on submission. Overrides the `novalidate` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-formnovalidate"
}
]
},
{
"name": "formtarget",
"description": "Specifies where to open the response after form submission. Possible values:\n\n* `_self`: Current browsing context (default).\n* `_blank`: New tab or window.\n* `_parent`: Parent browsing context, or `_self` if there is no parent.\n* `_top`: Topmost browsing context, or `_self` if there are no ancestors.\n\nOverrides the `target` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"values": [
{
"name": "_self",
"description": "Current browsing context (default)."
},
{
"name": "_blank",
"description": "New tab or window."
},
{
"name": "_parent",
"description": "Parent browsing context, or `_self` if there is no parent."
},
{
"name": "_top",
"description": "Topmost browsing context, or `_self` if there are no ancestors."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon#attributes-formtarget"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button-icon"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/button-icon/index.ts"
}
]
},
{
"name": "mdui-button",
"description": "Button Component \n\n```html\n<mdui-button>Button</mdui-button>\n```",
"attributes": [
{
"name": "variant",
"description": "Defines the button variant. Possible values:\n* `elevated`: A button with a shadow for visual emphasis.\n* `filled`: Used for final actions like 'Save' or 'Confirm'.\n* `tonal`: Blends `filled` and `outlined`, and works well for medium- to high-priority actions.\n* `outlined`: A bordered button for medium-priority and secondary actions.\n* `text`: A text button for low-priority actions.",
"values": [
{
"name": "elevated",
"description": "A button with a shadow for visual emphasis."
},
{
"name": "filled",
"description": "Used for final actions like 'Save' or 'Confirm'."
},
{
"name": "tonal",
"description": "A blend of `filled` and `outlined`, suitable for medium- to high-priority actions."
},
{
"name": "outlined",
"description": "A bordered button for medium-priority and secondary actions."
},
{
"name": "text",
"description": "A text button for low-priority actions."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-variant"
}
]
},
{
"name": "full-width",
"description": "If set, the button expands to fill the width of its container.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-full-width"
}
]
},
{
"name": "icon",
"description": "Specifies the Material Icons name on the left. Alternatively, use `slot=\"icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-icon"
}
]
},
{
"name": "end-icon",
"description": "Specifies the Material Icons name on the right. Alternatively, use `slot=\"end-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-end-icon"
}
]
},
{
"name": "href",
"description": "The URL for the link. When set, the component renders as an `<a>` element and supports link-related attributes.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-href"
}
]
},
{
"name": "download",
"description": "Downloads the linked URL.\n\n**Note**: Only available when `href` is specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-download"
}
]
},
{
"name": "target",
"description": "Controls where the linked URL opens. Possible values:\n\n* `_blank`: Opens in a new tab or window.\n* `_parent`: Opens in the parent browsing context, or `_self` if there is no parent.\n* `_self`: Opens in the current browsing context (default).\n* `_top`: Opens in the topmost browsing context, or `_self` if there are no ancestors.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "_blank",
"description": "Opens in a new tab or window."
},
{
"name": "_parent",
"description": "Opens in the parent browsing context, or `_self` if there is no parent."
},
{
"name": "_self",
"description": "Opens in the current browsing context (default)."
},
{
"name": "_top",
"description": "Opens in the topmost browsing context, or `_self` if there are no ancestors."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-target"
}
]
},
{
"name": "rel",
"description": "Specifies the relationship of the linked URL as space-separated link types. Possible values:\n\n* `alternate`: An alternate version of the current document.\n* `author`: The author of the current document or article.\n* `bookmark`: The permalink for the nearest ancestor section.\n* `external`: The referenced document is not part of the same site as the current document.\n* `help`: A link to context-sensitive help.\n* `license`: Content covered by the copyright license described by the referenced document.\n* `me`: Links to content owned by the current document's author.\n* `next`: The next document in the series.\n* `nofollow`: Not endorsed by the original author or publisher.\n* `noreferrer`: Prevents the `Referer` header from being sent. Same effect as `noopener`.\n* `opener`: Creates an auxiliary browsing context if the hyperlink would otherwise create a top-level browsing context that is not an auxiliary one (i.e., when `target=\"_blank\"`).\n* `prev`: The previous document in the series.\n* `search`: Links to a resource that can be used to search through the current document and its related pages.\n* `tag`: Marks the current document with the given tag.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "alternate",
"description": "An alternate version of the current document."
},
{
"name": "author",
"description": "The author of the current document or article."
},
{
"name": "bookmark",
"description": "The permalink for the nearest ancestor section."
},
{
"name": "external",
"description": "The referenced document is not part of the same site as the current document."
},
{
"name": "help",
"description": "A link to context-sensitive help."
},
{
"name": "license",
"description": "Indicates that the main content of the current document is covered by the copyright license described by the referenced document."
},
{
"name": "me",
"description": "Indicates that the current document represents the person who owns the linked content."
},
{
"name": "next",
"description": "Indicates that the current document is part of a series and that the next document in the series is the referenced document."
},
{
"name": "nofollow",
"description": "Indicates that the current document's original author or publisher does not endorse the referenced document."
},
{
"name": "noreferrer",
"description": "Prevents the `Referer` header from being sent. It has the same effect as `noopener`."
},
{
"name": "opener",
"description": "Creates a new browsing context when the hyperlink would otherwise open in a top-level context that is not auxiliary (for example, when `target=\"_blank\"` is specified)."
},
{
"name": "prev",
"description": "Indicates that the current document is part of a series and that the previous document in the series is the referenced document."
},
{
"name": "search",
"description": "Links to a resource that can be used to search through the current document and its related pages."
},
{
"name": "tag",
"description": "Assigns a tag, identified by the given address, to the current document."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-rel"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-tabindex"
}
]
},
{
"name": "disabled",
"description": "Disables the element.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-disabled"
}
]
},
{
"name": "loading",
"description": "Indicates that the element is in a loading state.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-loading"
}
]
},
{
"name": "name",
"description": "The button name submitted with form data.\n\n**Note**: Only available when `href` is not specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-name"
}
]
},
{
"name": "value",
"description": "The button value submitted with form data.\n\n**Note**: Only available when `href` is not specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-value"
}
]
},
{
"name": "type",
"description": "Specifies the button's default action. Default: `button`. Possible values:\n\n* `submit`: Submits the form data to the server.\n* `reset`: Restores all controls to their initial values.\n* `button`: Does nothing by default.\n\n**Note**: Only available when `href` is not specified.",
"values": [
{
"name": "submit",
"description": "Submits the form data to the server."
},
{
"name": "reset",
"description": "Resets all controls to their initial values."
},
{
"name": "button",
"description": "Has no default action."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-type"
}
]
},
{
"name": "form",
"description": "Associates the button with a `<form>` element. Set this to the `id` of a `<form>` in the same document. If omitted, the button uses its parent `<form>`, if any.\n\nThis lets the button target any form in the document, not just the one it is nested in.\n\n**Note**: Only available when `href` is not specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-form"
}
]
},
{
"name": "formaction",
"description": "Specifies the URL that processes the button's submitted information. Overrides the `action` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-formaction"
}
]
},
{
"name": "formenctype",
"description": "Specifies how to encode the form data. Possible values:\n\n* `application/x-www-form-urlencoded`: Default when the attribute is omitted.\n* `multipart/form-data`: Used for `<input>` elements with `type=\"file\"`.\n* `text/plain`: Useful for debugging, but not for actual form submissions.\n\nOverrides the `enctype` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"values": [
{
"name": "application/x-www-form-urlencoded",
"description": "Default if the attribute is not used."
},
{
"name": "multipart/form-data",
"description": "Used for `<input>` elements with `type=\"file\"`."
},
{
"name": "text/plain",
"description": "For debugging, not for real form submission."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-formenctype"
}
]
},
{
"name": "formmethod",
"description": "Specifies the HTTP method for form submission. Possible values:\n\n* `post`: Sends the form data in the request body.\n* `get`: Appends the form data to the `action` URL.\n\nOverrides the `method` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"values": [
{
"name": "post",
"description": "Form data is included in the HTTP request body."
},
{
"name": "get",
"description": "Form data is appended to the `action` URL."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-formmethod"
}
]
},
{
"name": "formnovalidate",
"description": "Specifies that the form should not be validated on submission. Overrides the `novalidate` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-formnovalidate"
}
]
},
{
"name": "formtarget",
"description": "Specifies where to open the response after form submission. Possible values:\n\n* `_self`: Current browsing context (default).\n* `_blank`: New tab or window.\n* `_parent`: Parent browsing context, or `_self` if there is no parent.\n* `_top`: Topmost browsing context, or `_self` if there are no ancestors.\n\nOverrides the `target` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"values": [
{
"name": "_self",
"description": "Current browsing context (default)."
},
{
"name": "_blank",
"description": "New tab or window."
},
{
"name": "_parent",
"description": "Parent browsing context, or `_self` if there is no parent."
},
{
"name": "_top",
"description": "Topmost browsing context, or `_self` if there are no ancestors."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button#attributes-formtarget"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/button"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/button/index.ts"
}
]
},
{
"name": "mdui-card",
"description": "Card Component \n\n```html\n<mdui-card>card content</mdui-card>\n```",
"attributes": [
{
"name": "variant",
"description": "Defines the card variant. Possible values:\n* `elevated`: Shadowed, offering more separation from the background than `filled`, but less than `outlined`.\n* `filled`: Provides minimal separation from the background.\n* `outlined`: Bordered, providing the most separation from the background.",
"values": [
{
"name": "elevated",
"description": "Shadowed, providing more visual separation from the background than `filled`, but less than `outlined`."
},
{
"name": "filled",
"description": "Provides minimal visual separation from the background."
},
{
"name": "outlined",
"description": "Bordered, providing maximum visual separation from the background."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/card#attributes-variant"
}
]
},
{
"name": "clickable",
"description": "Makes the card clickable. If set, hover and click ripple effects are added.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/card#attributes-clickable"
}
]
},
{
"name": "disabled",
"description": "Disables the card.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/card#attributes-disabled"
}
]
},
{
"name": "href",
"description": "The URL for the link. When set, the component renders as an `<a>` element and supports link-related attributes.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/card#attributes-href"
}
]
},
{
"name": "download",
"description": "Downloads the linked URL.\n\n**Note**: Only available when `href` is specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/card#attributes-download"
}
]
},
{
"name": "target",
"description": "Controls where the linked URL opens. Possible values:\n\n* `_blank`: Opens in a new tab or window.\n* `_parent`: Opens in the parent browsing context, or `_self` if there is no parent.\n* `_self`: Opens in the current browsing context (default).\n* `_top`: Opens in the topmost browsing context, or `_self` if there are no ancestors.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "_blank",
"description": "Opens in a new tab or window."
},
{
"name": "_parent",
"description": "Opens in the parent browsing context, or `_self` if there is no parent."
},
{
"name": "_self",
"description": "Opens in the current browsing context (default)."
},
{
"name": "_top",
"description": "Opens in the topmost browsing context, or `_self` if there are no ancestors."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/card#attributes-target"
}
]
},
{
"name": "rel",
"description": "Specifies the relationship of the linked URL as space-separated link types. Possible values:\n\n* `alternate`: An alternate version of the current document.\n* `author`: The author of the current document or article.\n* `bookmark`: The permalink for the nearest ancestor section.\n* `external`: The referenced document is not part of the same site as the current document.\n* `help`: A link to context-sensitive help.\n* `license`: Content covered by the copyright license described by the referenced document.\n* `me`: Links to content owned by the current document's author.\n* `next`: The next document in the series.\n* `nofollow`: Not endorsed by the original author or publisher.\n* `noreferrer`: Prevents the `Referer` header from being sent. Same effect as `noopener`.\n* `opener`: Creates a new browsing context when the hyperlink would otherwise open in a top-level context that is not auxiliary (for example, when `target=\"_blank\"` is specified).\n* `prev`: The previous document in the series.\n* `search`: Links to a resource that can be used to search through the current document and its related pages.\n* `tag`: Marks the current document with the given tag.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "alternate",
"description": "An alternate version of the current document."
},
{
"name": "author",
"description": "The author of the current document or article."
},
{
"name": "bookmark",
"description": "The permalink for the nearest ancestor section."
},
{
"name": "external",
"description": "The referenced document is not part of the same site as the current document."
},
{
"name": "help",
"description": "A link to context-sensitive help."
},
{
"name": "license",
"description": "Indicates that the main content of the current document is covered by the copyright license described by the referenced document."
},
{
"name": "me",
"description": "Indicates that the current document represents the person who owns the linked content."
},
{
"name": "next",
"description": "Indicates that the current document is part of a series and that the next document in the series is the referenced document."
},
{
"name": "nofollow",
"description": "Indicates that the current document's original author or publisher does not endorse the referenced document."
},
{
"name": "noreferrer",
"description": "Prevents the `Referer` header from being sent. It has the same effect as `noopener`."
},
{
"name": "opener",
"description": "Creates a new browsing context when the hyperlink would otherwise open in a top-level context that is not auxiliary (for example, when `target=\"_blank\"` is specified)."
},
{
"name": "prev",
"description": "Indicates that the current document is part of a series and that the previous document in the series is the referenced document."
},
{
"name": "search",
"description": "Links to a resource that can be used to search through the current document and its related pages."
},
{
"name": "tag",
"description": "Assigns a tag, identified by the given address, to the current document."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/card#attributes-rel"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/card#attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/card#attributes-tabindex"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/card"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/card/index.ts"
}
]
},
{
"name": "mdui-checkbox",
"description": "Checkbox Component \n\n```html\n<mdui-checkbox>Checkbox</mdui-checkbox>\n```",
"attributes": [
{
"name": "disabled",
"description": "Disables the checkbox.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/checkbox#attributes-disabled"
}
]
},
{
"name": "checked",
"description": "Sets the checkbox to the checked state.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/checkbox#attributes-checked"
}
]
},
{
"name": "indeterminate",
"description": "Sets the checkbox to an indeterminate state.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/checkbox#attributes-indeterminate"
}
]
},
{
"name": "required",
"description": "The checkbox must be checked to submit the form.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/checkbox#attributes-required"
}
]
},
{
"name": "form",
"description": "Associates the checkbox with a `<form>` element. Set this to the `id` of a `<form>` in the same document. If omitted, the checkbox uses its parent `<form>`, if any.\n\nThis lets the checkbox work with any form in the document, not just the one it is nested in.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/checkbox#attributes-form"
}
]
},
{
"name": "name",
"description": "Sets the checkbox's name, which is submitted with form data.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/checkbox#attributes-name"
}
]
},
{
"name": "value",
"description": "Sets the checkbox's value, which is submitted with form data.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/checkbox#attributes-value"
}
]
},
{
"name": "unchecked-icon",
"description": "Sets the Material Icons name for the unchecked state. Alternatively, use `slot=\"unchecked-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/checkbox#attributes-unchecked-icon"
}
]
},
{
"name": "checked-icon",
"description": "Sets the Material Icons name for the checked state. Alternatively, use `slot=\"checked-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/checkbox#attributes-checked-icon"
}
]
},
{
"name": "indeterminate-icon",
"description": "Sets the Material Icons name for the indeterminate state. Alternatively, use `slot=\"indeterminate-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/checkbox#attributes-indeterminate-icon"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/checkbox#attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/checkbox#attributes-tabindex"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/checkbox"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/checkbox/index.ts"
}
]
},
{
"name": "mdui-chip",
"description": "Chip Component \n\n```html\n<mdui-chip>Chip</mdui-chip>\n```",
"attributes": [
{
"name": "variant",
"description": "Defines the chip variant. Possible values:\n\n* `assist`: Shows contextual actions, such as sharing or favoriting on a meal-ordering page.\n* `filter`: Filters content, such as search results.\n* `input`: Represents user input, such as contacts in Gmail's 'To' field.\n* `suggestion`: Shows dynamic suggestions that help users act more quickly, such as message suggestions in a chat app.",
"values": [
{
"name": "assist",
"description": "Shows contextual actions, such as sharing or favoriting on a meal-ordering page."
},
{
"name": "filter",
"description": "Filters content, such as search results."
},
{
"name": "input",
"description": "Represents user input, such as contacts in Gmail's 'To' field."
},
{
"name": "suggestion",
"description": "Shows dynamic suggestions that help users act more quickly, such as message suggestions in a chat app."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-variant"
}
]
},
{
"name": "elevated",
"description": "Adds a shadow to the chip.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-elevated"
}
]
},
{
"name": "selectable",
"description": "Makes the chip selectable.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-selectable"
}
]
},
{
"name": "selected",
"description": "Marks the chip as selected.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-selected"
}
]
},
{
"name": "deletable",
"description": "Makes the chip deletable. If set, a delete icon appears on the right.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-deletable"
}
]
},
{
"name": "icon",
"description": "Sets the Material Icons name for the left icon. Alternatively, use `slot=\"icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-icon"
}
]
},
{
"name": "selected-icon",
"description": "Sets the Material Icons name for the left icon when selected. Alternatively, use `slot=\"selected-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-selected-icon"
}
]
},
{
"name": "end-icon",
"description": "Sets the Material Icons name for the right icon. Alternatively, use `slot=\"end-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-end-icon"
}
]
},
{
"name": "delete-icon",
"description": "Sets the Material Icons name for the delete icon when deletable. Alternatively, use `slot=\"delete-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-delete-icon"
}
]
},
{
"name": "href",
"description": "The URL for the link. When set, the component renders as an `<a>` element and supports link-related attributes.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-href"
}
]
},
{
"name": "download",
"description": "Downloads the linked URL.\n\n**Note**: Only available when `href` is specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-download"
}
]
},
{
"name": "target",
"description": "Controls where the linked URL opens. Possible values:\n\n* `_blank`: Opens in a new tab or window.\n* `_parent`: Opens in the parent browsing context, or `_self` if there is no parent.\n* `_self`: Opens in the current browsing context (default).\n* `_top`: Opens in the topmost browsing context, or `_self` if there are no ancestors.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "_blank",
"description": "Opens in a new tab or window."
},
{
"name": "_parent",
"description": "Opens in the parent browsing context, or `_self` if there is no parent."
},
{
"name": "_self",
"description": "Opens in the current browsing context (default)."
},
{
"name": "_top",
"description": "Opens in the topmost browsing context, or `_self` if there are no ancestors."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-target"
}
]
},
{
"name": "rel",
"description": "Specifies the relationship of the linked URL as space-separated link types. Possible values:\n\n* `alternate`: An alternate version of the current document.\n* `author`: The author of the current document or article.\n* `bookmark`: The permalink for the nearest ancestor section.\n* `external`: The referenced document is not part of the same site as the current document.\n* `help`: A link to context-sensitive help.\n* `license`: Content covered by the copyright license described by the referenced document.\n* `me`: Links to content owned by the current document's author.\n* `next`: The next document in the series.\n* `nofollow`: Not endorsed by the original author or publisher.\n* `noreferrer`: Prevents the `Referer` header from being sent. Same effect as `noopener`.\n* `opener`: Creates an auxiliary browsing context if the hyperlink would otherwise create a top-level browsing context that is not an auxiliary one (i.e., when `target=\"_blank\"`).\n* `prev`: The previous document in the series.\n* `search`: Links to a resource that can be used to search through the current document and its related pages.\n* `tag`: Marks the current document with the given tag.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "alternate",
"description": "An alternate version of the current document."
},
{
"name": "author",
"description": "The author of the current document or article."
},
{
"name": "bookmark",
"description": "The permalink for the nearest ancestor section."
},
{
"name": "external",
"description": "The referenced document is not part of the same site as the current document."
},
{
"name": "help",
"description": "A link to context-sensitive help."
},
{
"name": "license",
"description": "Indicates that the main content of the current document is covered by the copyright license described by the referenced document."
},
{
"name": "me",
"description": "Indicates that the current document represents the person who owns the linked content."
},
{
"name": "next",
"description": "Indicates that the current document is part of a series and that the next document in the series is the referenced document."
},
{
"name": "nofollow",
"description": "Indicates that the current document's original author or publisher does not endorse the referenced document."
},
{
"name": "noreferrer",
"description": "Prevents the `Referer` header from being sent. It has the same effect as `noopener`."
},
{
"name": "opener",
"description": "Creates a new browsing context when the hyperlink would otherwise open in a top-level context that is not auxiliary (for example, when `target=\"_blank\"` is specified)."
},
{
"name": "prev",
"description": "Indicates that the current document is part of a series and that the previous document in the series is the referenced document."
},
{
"name": "search",
"description": "Links to a resource that can be used to search through the current document and its related pages."
},
{
"name": "tag",
"description": "Assigns a tag, identified by the given address, to the current document."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-rel"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-tabindex"
}
]
},
{
"name": "disabled",
"description": "Disables the element.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-disabled"
}
]
},
{
"name": "loading",
"description": "Indicates that the element is in a loading state.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-loading"
}
]
},
{
"name": "name",
"description": "The button name submitted with form data.\n\n**Note**: Only available when `href` is not specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-name"
}
]
},
{
"name": "value",
"description": "The button value submitted with form data.\n\n**Note**: Only available when `href` is not specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-value"
}
]
},
{
"name": "type",
"description": "Specifies the button's default action. Default: `button`. Possible values:\n\n* `submit`: Submits the form data to the server.\n* `reset`: Restores all controls to their initial values.\n* `button`: Does nothing by default.\n\n**Note**: Only available when `href` is not specified.",
"values": [
{
"name": "submit",
"description": "Submits the form data to the server."
},
{
"name": "reset",
"description": "Resets all controls to their initial values."
},
{
"name": "button",
"description": "Has no default action."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-type"
}
]
},
{
"name": "form",
"description": "Associates the button with a `<form>` element. Set this to the `id` of a `<form>` in the same document. If omitted, the button uses its parent `<form>`, if any.\n\nThis lets the button target any form in the document, not just the one it is nested in.\n\n**Note**: Only available when `href` is not specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-form"
}
]
},
{
"name": "formaction",
"description": "Specifies the URL that processes the button's submitted information. Overrides the `action` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-formaction"
}
]
},
{
"name": "formenctype",
"description": "Specifies how to encode the form data. Possible values:\n\n* `application/x-www-form-urlencoded`: Default when the attribute is omitted.\n* `multipart/form-data`: Used for `<input>` elements with `type=\"file\"`.\n* `text/plain`: Useful for debugging, but not for actual form submissions.\n\nOverrides the `enctype` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"values": [
{
"name": "application/x-www-form-urlencoded",
"description": "Default if the attribute is not used."
},
{
"name": "multipart/form-data",
"description": "Used for `<input>` elements with `type=\"file\"`."
},
{
"name": "text/plain",
"description": "For debugging, not for real form submission."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-formenctype"
}
]
},
{
"name": "formmethod",
"description": "Specifies the HTTP method for form submission. Possible values:\n\n* `post`: Sends the form data in the request body.\n* `get`: Appends the form data to the `action` URL.\n\nOverrides the `method` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"values": [
{
"name": "post",
"description": "Form data is included in the HTTP request body."
},
{
"name": "get",
"description": "Form data is appended to the `action` URL."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-formmethod"
}
]
},
{
"name": "formnovalidate",
"description": "Specifies that the form should not be validated on submission. Overrides the `novalidate` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-formnovalidate"
}
]
},
{
"name": "formtarget",
"description": "Specifies where to open the response after form submission. Possible values:\n\n* `_self`: Current browsing context (default).\n* `_blank`: New tab or window.\n* `_parent`: Parent browsing context, or `_self` if there is no parent.\n* `_top`: Topmost browsing context, or `_self` if there are no ancestors.\n\nOverrides the `target` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"values": [
{
"name": "_self",
"description": "Current browsing context (default)."
},
{
"name": "_blank",
"description": "New tab or window."
},
{
"name": "_parent",
"description": "Parent browsing context, or `_self` if there is no parent."
},
{
"name": "_top",
"description": "Topmost browsing context, or `_self` if there are no ancestors."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip#attributes-formtarget"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/chip"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/chip/index.ts"
}
]
},
{
"name": "mdui-circular-progress",
"description": "Circular Progress Component \n\n```html\n<mdui-circular-progress></mdui-circular-progress>\n```",
"attributes": [
{
"name": "max",
"description": "Sets the maximum value for the progress indicator. The default value is `1`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/circular-progress#attributes-max"
}
]
},
{
"name": "value",
"description": "Sets the current value of the progress indicator. If not specified, the progress indicator is in an indeterminate state.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/circular-progress#attributes-value"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/circular-progress"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/circular-progress/index.ts"
}
]
},
{
"name": "mdui-collapse-item",
"description": "Collapse Item Component Use with the `<mdui-collapse>` component \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```",
"attributes": [
{
"name": "value",
"description": "Specifies the value of the collapsible panel item.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/collapse#collapse-item-attributes-value"
}
]
},
{
"name": "header",
"description": "Sets the header text for the collapsible panel item.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/collapse#collapse-item-attributes-header"
}
]
},
{
"name": "disabled",
"description": "Disables the collapsible panel item.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/collapse#collapse-item-attributes-disabled"
}
]
},
{
"name": "trigger",
"description": "The element that toggles collapse on click. This can be a CSS selector, a DOM element, or a [JQ object](/en/docs/2/functions/jq). By default, the entire header area is the trigger.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/collapse#collapse-item-attributes-trigger"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/collapse"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/collapse/collapse-item.ts"
}
]
},
{
"name": "mdui-collapse",
"description": "Collapse Panel Component Use with the `<mdui-collapse-item>` component \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```",
"attributes": [
{
"name": "accordion",
"description": "Activates accordion mode.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/collapse#collapse-attributes-accordion"
}
]
},
{
"name": "value",
"description": "Specifies the open `<mdui-collapse-item>` value.\n\n**Note**: The HTML attribute is always a string and can only be set initially when `accordion` is `true`. The JavaScript property is a string when `accordion` is `true` and a string array when `accordion` is `false`. To change this value when `accordion` is `false`, update the JavaScript property.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/collapse#collapse-attributes-value"
}
]
},
{
"name": "disabled",
"description": "Disables the collapsible panel.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/collapse#collapse-attributes-disabled"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/collapse"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/collapse/collapse.ts"
}
]
},
{
"name": "mdui-dialog",
"description": "Dialog Component \n\n```html\n<mdui-dialog>content</mdui-dialog>\n```",
"attributes": [
{
"name": "icon",
"description": "Sets the Material Icons name for the top icon. Alternatively, use `slot=\"icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dialog#attributes-icon"
}
]
},
{
"name": "headline",
"description": "Sets the dialog title. Alternatively, use `slot=\"headline\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dialog#attributes-headline"
}
]
},
{
"name": "description",
"description": "The text displayed below the title. Alternatively, use `slot=\"description\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dialog#attributes-description"
}
]
},
{
"name": "open",
"description": "Opens the dialog.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dialog#attributes-open"
}
]
},
{
"name": "fullscreen",
"description": "Displays the dialog in full-screen mode.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dialog#attributes-fullscreen"
}
]
},
{
"name": "close-on-esc",
"description": "Closes the dialog when the ESC key is pressed.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dialog#attributes-close-on-esc"
}
]
},
{
"name": "close-on-overlay-click",
"description": "Closes the dialog when the overlay is clicked.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dialog#attributes-close-on-overlay-click"
}
]
},
{
"name": "stacked-actions",
"description": "Stacks the bottom action buttons vertically.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dialog#attributes-stacked-actions"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dialog"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/dialog/index.ts"
}
]
},
{
"name": "mdui-divider",
"description": "Divider Component \n\n```html\n<mdui-divider></mdui-divider>\n```",
"attributes": [
{
"name": "vertical",
"description": "Displays the divider vertically.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/divider#attributes-vertical"
}
]
},
{
"name": "inset",
"description": "Adds an inset from the left side.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/divider#attributes-inset"
}
]
},
{
"name": "middle",
"description": "Adds insets from both the left and right sides.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/divider#attributes-middle"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/divider"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/divider/index.ts"
}
]
},
{
"name": "mdui-dropdown",
"description": "Dropdown Component \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```",
"attributes": [
{
"name": "open",
"description": "Opens the dropdown.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dropdown#attributes-open"
}
]
},
{
"name": "disabled",
"description": "Disables the dropdown.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dropdown#attributes-disabled"
}
]
},
{
"name": "trigger",
"description": "Defines how the dropdown opens. Multiple space-separated values are supported. Possible values:\n\n* `click`: Triggers on click.\n* `hover`: Triggers on mouse hover.\n* `focus`: Triggers on focus.\n* `contextmenu`: Triggers on right-click or long press.\n* `manual`: If used, the dropdown can only be opened and closed programmatically, and no other trigger methods can be specified.",
"values": [
{
"name": "click",
"description": "Triggers on click."
},
{
"name": "hover",
"description": "Triggers on mouse hover."
},
{
"name": "focus",
"description": "Triggers on focus."
},
{
"name": "contextmenu",
"description": "Triggers on right-click or long press."
},
{
"name": "manual",
"description": "If used, the dropdown can only be opened and closed programmatically, and no other trigger methods can be specified."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dropdown#attributes-trigger"
}
]
},
{
"name": "placement",
"description": "Sets the dropdown position. Possible values:\n\n* `auto`: Automatically determined.\n* `top-start`: Above and left-aligned.\n* `top`: Above and centered.\n* `top-end`: Above and right-aligned.\n* `bottom-start`: Below and left-aligned.\n* `bottom`: Below and centered.\n* `bottom-end`: Below and right-aligned.\n* `left-start`: Left and top-aligned.\n* `left`: Left and centered.\n* `left-end`: Left and bottom-aligned.\n* `right-start`: Right and top-aligned.\n* `right`: Right and centered.\n* `right-end`: Right and bottom-aligned.",
"values": [
{
"name": "auto",
"description": "Automatically determined."
},
{
"name": "top-start",
"description": "Above and left-aligned."
},
{
"name": "top",
"description": "Above and centered."
},
{
"name": "top-end",
"description": "Above and right-aligned."
},
{
"name": "bottom-start",
"description": "Below and left-aligned."
},
{
"name": "bottom",
"description": "Below and centered."
},
{
"name": "bottom-end",
"description": "Below and right-aligned."
},
{
"name": "left-start",
"description": "Left and top-aligned."
},
{
"name": "left",
"description": "Left and centered."
},
{
"name": "left-end",
"description": "Left and bottom-aligned."
},
{
"name": "right-start",
"description": "Right and top-aligned."
},
{
"name": "right",
"description": "Right and centered."
},
{
"name": "right-end",
"description": "Right and bottom-aligned."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dropdown#attributes-placement"
}
]
},
{
"name": "stay-open-on-click",
"description": "Prevents the dropdown from closing when a [`<mdui-menu-item>`](/en/docs/2/components/menu#menu-item-api) is clicked.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dropdown#attributes-stay-open-on-click"
}
]
},
{
"name": "open-delay",
"description": "Sets the delay (in ms) for opening the dropdown on hover.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dropdown#attributes-open-delay"
}
]
},
{
"name": "close-delay",
"description": "Sets the delay (in ms) for closing the dropdown on hover.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dropdown#attributes-close-delay"
}
]
},
{
"name": "open-on-pointer",
"description": "Opens the dropdown at the pointer position. This is typically used for context menus.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dropdown#attributes-open-on-pointer"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/dropdown"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/dropdown/index.ts"
}
]
},
{
"name": "mdui-fab",
"description": "Floating Action Button Component \n\n```html\n<mdui-fab icon=\"edit\"></mdui-fab>\n```",
"attributes": [
{
"name": "variant",
"description": "Sets the FAB color. Possible values:\n\n* `primary`: Uses the primary container background color.\n* `surface`: Uses the surface container high background color.\n* `secondary`: Uses the secondary container background color.\n* `tertiary`: Uses the tertiary container background color.",
"values": [
{
"name": "primary",
"description": "Uses the primary container background color."
},
{
"name": "surface",
"description": "Uses the surface container high background color."
},
{
"name": "secondary",
"description": "Uses the secondary container background color."
},
{
"name": "tertiary",
"description": "Uses the tertiary container background color."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-variant"
}
]
},
{
"name": "size",
"description": "Sets the FAB size. Possible values:\n* `normal`: Normal size.\n* `small`: Small size.\n* `large`: Large size.",
"values": [
{
"name": "normal",
"description": "Normal size."
},
{
"name": "small",
"description": "Small size."
},
{
"name": "large",
"description": "Large size."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-size"
}
]
},
{
"name": "icon",
"description": "Sets the Material Icons name. Alternatively, use `slot=\"icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-icon"
}
]
},
{
"name": "extended",
"description": "Extends the FAB to show text alongside the icon.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-extended"
}
]
},
{
"name": "href",
"description": "The URL for the link. When set, the component renders as an `<a>` element and supports link-related attributes.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-href"
}
]
},
{
"name": "download",
"description": "Downloads the linked URL.\n\n**Note**: Only available when `href` is specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-download"
}
]
},
{
"name": "target",
"description": "Controls where the linked URL opens. Possible values:\n\n* `_blank`: Opens in a new tab or window.\n* `_parent`: Opens in the parent browsing context, or `_self` if there is no parent.\n* `_self`: Opens in the current browsing context (default).\n* `_top`: Opens in the topmost browsing context, or `_self` if there are no ancestors.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "_blank",
"description": "Opens in a new tab or window."
},
{
"name": "_parent",
"description": "Opens in the parent browsing context, or `_self` if there is no parent."
},
{
"name": "_self",
"description": "Opens in the current browsing context (default)."
},
{
"name": "_top",
"description": "Opens in the topmost browsing context, or `_self` if there are no ancestors."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-target"
}
]
},
{
"name": "rel",
"description": "Specifies the relationship of the linked URL as space-separated link types. Possible values:\n\n* `alternate`: An alternate version of the current document.\n* `author`: The author of the current document or article.\n* `bookmark`: The permalink for the nearest ancestor section.\n* `external`: The referenced document is not part of the same site as the current document.\n* `help`: A link to context-sensitive help.\n* `license`: Content covered by the copyright license described by the referenced document.\n* `me`: Links to content owned by the current document's author.\n* `next`: The next document in the series.\n* `nofollow`: Not endorsed by the original author or publisher.\n* `noreferrer`: Prevents the `Referer` header from being sent. Same effect as `noopener`.\n* `opener`: Creates an auxiliary browsing context if the hyperlink would otherwise create a top-level browsing context that is not an auxiliary one (i.e., when `target=\"_blank\"`).\n* `prev`: The previous document in the series.\n* `search`: Links to a resource that can be used to search through the current document and its related pages.\n* `tag`: Marks the current document with the given tag.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "alternate",
"description": "An alternate version of the current document."
},
{
"name": "author",
"description": "The author of the current document or article."
},
{
"name": "bookmark",
"description": "The permalink for the nearest ancestor section."
},
{
"name": "external",
"description": "The referenced document is not part of the same site as the current document."
},
{
"name": "help",
"description": "A link to context-sensitive help."
},
{
"name": "license",
"description": "Indicates that the main content of the current document is covered by the copyright license described by the referenced document."
},
{
"name": "me",
"description": "Indicates that the current document represents the person who owns the linked content."
},
{
"name": "next",
"description": "Indicates that the current document is part of a series and that the next document in the series is the referenced document."
},
{
"name": "nofollow",
"description": "Indicates that the current document's original author or publisher does not endorse the referenced document."
},
{
"name": "noreferrer",
"description": "Prevents the `Referer` header from being sent. It has the same effect as `noopener`."
},
{
"name": "opener",
"description": "Creates a new browsing context when the hyperlink would otherwise open in a top-level context that is not auxiliary (for example, when `target=\"_blank\"` is specified)."
},
{
"name": "prev",
"description": "Indicates that the current document is part of a series and that the previous document in the series is the referenced document."
},
{
"name": "search",
"description": "Links to a resource that can be used to search through the current document and its related pages."
},
{
"name": "tag",
"description": "Assigns a tag, identified by the given address, to the current document."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-rel"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-tabindex"
}
]
},
{
"name": "disabled",
"description": "Disables the element.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-disabled"
}
]
},
{
"name": "loading",
"description": "Indicates that the element is in a loading state.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-loading"
}
]
},
{
"name": "name",
"description": "The button name submitted with form data.\n\n**Note**: Only available when `href` is not specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-name"
}
]
},
{
"name": "value",
"description": "The button value submitted with form data.\n\n**Note**: Only available when `href` is not specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-value"
}
]
},
{
"name": "type",
"description": "Specifies the button's default action. Default: `button`. Possible values:\n\n* `submit`: Submits the form data to the server.\n* `reset`: Restores all controls to their initial values.\n* `button`: Does nothing by default.\n\n**Note**: Only available when `href` is not specified.",
"values": [
{
"name": "submit",
"description": "Submits the form data to the server."
},
{
"name": "reset",
"description": "Resets all controls to their initial values."
},
{
"name": "button",
"description": "Has no default action."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-type"
}
]
},
{
"name": "form",
"description": "Associates the button with a `<form>` element. Set this to the `id` of a `<form>` in the same document. If omitted, the button uses its parent `<form>`, if any.\n\nThis lets the button target any form in the document, not just the one it is nested in.\n\n**Note**: Only available when `href` is not specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-form"
}
]
},
{
"name": "formaction",
"description": "Specifies the URL that processes the button's submitted information. Overrides the `action` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-formaction"
}
]
},
{
"name": "formenctype",
"description": "Specifies how to encode the form data. Possible values:\n\n* `application/x-www-form-urlencoded`: Default when the attribute is omitted.\n* `multipart/form-data`: Used for `<input>` elements with `type=\"file\"`.\n* `text/plain`: Useful for debugging, but not for actual form submissions.\n\nOverrides the `enctype` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"values": [
{
"name": "application/x-www-form-urlencoded",
"description": "Default if the attribute is not used."
},
{
"name": "multipart/form-data",
"description": "Used for `<input>` elements with `type=\"file\"`."
},
{
"name": "text/plain",
"description": "For debugging, not for real form submission."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-formenctype"
}
]
},
{
"name": "formmethod",
"description": "Specifies the HTTP method for form submission. Possible values:\n\n* `post`: Sends the form data in the request body.\n* `get`: Appends the form data to the `action` URL.\n\nOverrides the `method` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"values": [
{
"name": "post",
"description": "Form data is included in the HTTP request body."
},
{
"name": "get",
"description": "Form data is appended to the `action` URL."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-formmethod"
}
]
},
{
"name": "formnovalidate",
"description": "Specifies that the form should not be validated on submission. Overrides the `novalidate` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-formnovalidate"
}
]
},
{
"name": "formtarget",
"description": "Specifies where to open the response after form submission. Possible values:\n\n* `_self`: Current browsing context (default).\n* `_blank`: New tab or window.\n* `_parent`: Parent browsing context, or `_self` if there is no parent.\n* `_top`: Topmost browsing context, or `_self` if there are no ancestors.\n\nOverrides the `target` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"values": [
{
"name": "_self",
"description": "Current browsing context (default)."
},
{
"name": "_blank",
"description": "New tab or window."
},
{
"name": "_parent",
"description": "Parent browsing context, or `_self` if there is no parent."
},
{
"name": "_top",
"description": "Topmost browsing context, or `_self` if there are no ancestors."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab#attributes-formtarget"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/fab"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/fab/index.ts"
}
]
},
{
"name": "mdui-icon",
"description": "Icon Component \n\n```html\n<mdui-icon name=\"search\"></mdui-icon>\n```",
"attributes": [
{
"name": "name",
"description": "Specifies the name of the Material Icons.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/icon#attributes-name"
}
]
},
{
"name": "src",
"description": "Specifies the path of the SVG icon.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/icon#attributes-src"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/icon"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/icon/index.ts"
}
]
},
{
"name": "mdui-layout-item",
"description": "Layout Item Component \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```",
"attributes": [
{
"name": "placement",
"description": "Determines where the component is placed. Possible values:\n\n* `top`: Places the component at the top.\n* `bottom`: Places the component at the bottom.\n* `left`: Places the component on the left.\n* `right`: Places the component on the right.",
"values": [
{
"name": "top",
"description": "Places the component at the top."
},
{
"name": "bottom",
"description": "Places the component at the bottom."
},
{
"name": "left",
"description": "Places the component on the left."
},
{
"name": "right",
"description": "Places the component on the right."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/layout#layout-item-attributes-placement"
}
]
},
{
"name": "order",
"description": "Specifies the layout order within the [`<mdui-layout>`](/en/docs/2/components/layout) component. Items are sorted in ascending order. The default value is `0`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/layout#layout-item-attributes-order"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/layout"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/layout/layout-item.ts"
}
]
},
{
"name": "mdui-layout-main",
"description": "Layout Main Component \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```",
"attributes": [],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/layout"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/layout/layout-main.ts"
}
]
},
{
"name": "mdui-layout",
"description": "Layout Component \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```",
"attributes": [
{
"name": "full-height",
"description": "Sets the layout height to 100%.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/layout#layout-attributes-full-height"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/layout"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/layout/layout.ts"
}
]
},
{
"name": "mdui-linear-progress",
"description": "Linear Progress Component \n\n```html\n<mdui-linear-progress></mdui-linear-progress>\n```",
"attributes": [
{
"name": "max",
"description": "Sets the maximum value for the progress indicator. The default value is `1`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/linear-progress#attributes-max"
}
]
},
{
"name": "value",
"description": "Sets the current value of the progress indicator. If not specified, the progress indicator is in an indeterminate state.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/linear-progress#attributes-value"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/linear-progress"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/linear-progress/index.ts"
}
]
},
{
"name": "mdui-list-item",
"description": "List Item Component Use with the `<mdui-list>` component \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```",
"attributes": [
{
"name": "headline",
"description": "Main text. Alternatively, use the default slot.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-headline"
}
]
},
{
"name": "headline-line",
"description": "Maximum number of lines for the main text. Overflow text is truncated. Default is no limit. Possible values:\n\n* `1`: Single-line text that truncates when it overflows.\n* `2`: Two-line text that truncates when it overflows.\n* `3`: Three-line text that truncates when it overflows.",
"values": [
{
"name": "1",
"description": "Single-line text that truncates when it overflows."
},
{
"name": "2",
"description": "Two-line text that truncates when it overflows."
},
{
"name": "3",
"description": "Three-line text that truncates when it overflows."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-headline-line"
}
]
},
{
"name": "description",
"description": "Subtext. Alternatively, use `slot=\"description\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-description"
}
]
},
{
"name": "description-line",
"description": "Maximum number of lines for the subtext. Overflow text is truncated. Default is no limit. Possible values:\n\n* `1`: Single-line text that truncates when it overflows.\n* `2`: Two-line text that truncates when it overflows.\n* `3`: Three-line text that truncates when it overflows.",
"values": [
{
"name": "1",
"description": "Single-line text that truncates when it overflows."
},
{
"name": "2",
"description": "Two-line text that truncates when it overflows."
},
{
"name": "3",
"description": "Three-line text that truncates when it overflows."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-description-line"
}
]
},
{
"name": "icon",
"description": "Material Icons name on the left. Alternatively, use `slot=\"icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-icon"
}
]
},
{
"name": "end-icon",
"description": "Material Icons name on the right. Alternatively, use `slot=\"end-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-end-icon"
}
]
},
{
"name": "disabled",
"description": "Disables the list item. It dims the item and disables interactive elements like [`<mdui-checkbox>`](/en/docs/2/components/checkbox), [`<mdui-radio>`](/en/docs/2/components/radio), and [`<mdui-switch>`](/en/docs/2/components/switch).",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-disabled"
}
]
},
{
"name": "active",
"description": "Marks the list item as active.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-active"
}
]
},
{
"name": "nonclickable",
"description": "Disables the list item's default click action, but interactive elements like [`<mdui-checkbox>`](/en/docs/2/components/checkbox), [`<mdui-radio>`](/en/docs/2/components/radio), and [`<mdui-switch>`](/en/docs/2/components/switch) inside it remain functional.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-nonclickable"
}
]
},
{
"name": "rounded",
"description": "Applies a rounded appearance to the list item.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-rounded"
}
]
},
{
"name": "alignment",
"description": "Vertical alignment of the list item. Possible values:\n\n* `start`: Aligns to the top.\n* `center`: Aligns to the center.\n* `end`: Aligns to the bottom.",
"values": [
{
"name": "start",
"description": "Top alignment."
},
{
"name": "center",
"description": "Center alignment."
},
{
"name": "end",
"description": "Bottom alignment."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-alignment"
}
]
},
{
"name": "href",
"description": "The URL for the link. When set, the component renders as an `<a>` element and supports link-related attributes.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-href"
}
]
},
{
"name": "download",
"description": "Downloads the linked URL.\n\n**Note**: Only available when `href` is specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-download"
}
]
},
{
"name": "target",
"description": "Controls where the linked URL opens. Possible values:\n\n* `_blank`: Opens in a new tab or window.\n* `_parent`: Opens in the parent browsing context, or `_self` if there is no parent.\n* `_self`: Opens in the current browsing context (default).\n* `_top`: Opens in the topmost browsing context, or `_self` if there are no ancestors.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "_blank",
"description": "Opens in a new tab or window."
},
{
"name": "_parent",
"description": "Opens in the parent browsing context, or `_self` if there is no parent."
},
{
"name": "_self",
"description": "Opens in the current browsing context (default)."
},
{
"name": "_top",
"description": "Opens in the topmost browsing context, or `_self` if there are no ancestors."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-target"
}
]
},
{
"name": "rel",
"description": "Specifies the relationship of the linked URL as space-separated link types. Possible values:\n\n* `alternate`: An alternate version of the current document.\n* `author`: The author of the current document or article.\n* `bookmark`: The permalink for the nearest ancestor section.\n* `external`: The referenced document is not part of the same site as the current document.\n* `help`: A link to context-sensitive help.\n* `license`: Content covered by the copyright license described by the referenced document.\n* `me`: Links to content owned by the current document's author.\n* `next`: The next document in the series.\n* `nofollow`: Not endorsed by the original author or publisher.\n* `noreferrer`: Prevents the `Referer` header from being sent. Same effect as `noopener`.\n* `opener`: Creates a new browsing context when the hyperlink would otherwise open in a top-level context that is not auxiliary (for example, when `target=\"_blank\"` is specified).\n* `prev`: The previous document in the series.\n* `search`: Links to a resource that can be used to search through the current document and its related pages.\n* `tag`: Marks the current document with the given tag.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "alternate",
"description": "An alternate version of the current document."
},
{
"name": "author",
"description": "The author of the current document or article."
},
{
"name": "bookmark",
"description": "The permalink for the nearest ancestor section."
},
{
"name": "external",
"description": "The referenced document is not part of the same site as the current document."
},
{
"name": "help",
"description": "A link to context-sensitive help."
},
{
"name": "license",
"description": "Indicates that the main content of the current document is covered by the copyright license described by the referenced document."
},
{
"name": "me",
"description": "Indicates that the current document represents the person who owns the linked content."
},
{
"name": "next",
"description": "Indicates that the current document is part of a series and that the next document in the series is the referenced document."
},
{
"name": "nofollow",
"description": "Indicates that the current document's original author or publisher does not endorse the referenced document."
},
{
"name": "noreferrer",
"description": "Prevents the `Referer` header from being sent. It has the same effect as `noopener`."
},
{
"name": "opener",
"description": "Creates a new browsing context when the hyperlink would otherwise open in a top-level context that is not auxiliary (for example, when `target=\"_blank\"` is specified)."
},
{
"name": "prev",
"description": "Indicates that the current document is part of a series and that the previous document in the series is the referenced document."
},
{
"name": "search",
"description": "Links to a resource that can be used to search through the current document and its related pages."
},
{
"name": "tag",
"description": "Assigns a tag, identified by the given address, to the current document."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-rel"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list#list-item-attributes-tabindex"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/list/list-item.ts"
}
]
},
{
"name": "mdui-list-subheader",
"description": "List Subheader Component Use with the `<mdui-list>` component \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```",
"attributes": [],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/list/list-subheader.ts"
}
]
},
{
"name": "mdui-list",
"description": "List Component Use with the `<mdui-list-item>` component \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```",
"attributes": [],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/list"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/list/list.ts"
}
]
},
{
"name": "mdui-menu-item",
"description": "Menu Item Component \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```",
"attributes": [
{
"name": "value",
"description": "The value of the menu item.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-item-attributes-value"
}
]
},
{
"name": "disabled",
"description": "Disables the menu item.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-item-attributes-disabled"
}
]
},
{
"name": "icon",
"description": "Specifies the Material Icons name for the left icon. Alternatively, use `slot=\"icon\"`. An empty string reserves space for an icon.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-item-attributes-icon"
}
]
},
{
"name": "end-icon",
"description": "Specifies the Material Icons name for the right icon. Alternatively, use `slot=\"end-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-item-attributes-end-icon"
}
]
},
{
"name": "end-text",
"description": "Specifies the right text. Alternatively, use `slot=\"end-text\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-item-attributes-end-text"
}
]
},
{
"name": "selected-icon",
"description": "Specifies the Material Icons name for the selected state. Alternatively, use `slot=\"selected-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-item-attributes-selected-icon"
}
]
},
{
"name": "submenu-open",
"description": "Opens the submenu.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-item-attributes-submenu-open"
}
]
},
{
"name": "href",
"description": "The URL for the link. When set, the component renders as an `<a>` element and supports link-related attributes.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-item-attributes-href"
}
]
},
{
"name": "download",
"description": "Downloads the linked URL.\n\n**Note**: Only available when `href` is specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-item-attributes-download"
}
]
},
{
"name": "target",
"description": "Controls where the linked URL opens. Possible values:\n\n* `_blank`: Opens in a new tab or window.\n* `_parent`: Opens in the parent browsing context, or `_self` if there is no parent.\n* `_self`: Opens in the current browsing context (default).\n* `_top`: Opens in the topmost browsing context, or `_self` if there are no ancestors.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "_blank",
"description": "Opens in a new tab or window."
},
{
"name": "_parent",
"description": "Opens in the parent browsing context, or `_self` if there is no parent."
},
{
"name": "_self",
"description": "Opens in the current browsing context (default)."
},
{
"name": "_top",
"description": "Opens in the topmost browsing context, or `_self` if there are no ancestors."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-item-attributes-target"
}
]
},
{
"name": "rel",
"description": "Specifies the relationship of the linked URL as space-separated link types. Possible values:\n\n* `alternate`: An alternate version of the current document.\n* `author`: The author of the current document or article.\n* `bookmark`: The permalink for the nearest ancestor section.\n* `external`: The referenced document is not part of the same site as the current document.\n* `help`: A link to context-sensitive help.\n* `license`: Content covered by the copyright license described by the referenced document.\n* `me`: Links to content owned by the current document's author.\n* `next`: The next document in the series.\n* `nofollow`: Not endorsed by the original author or publisher.\n* `noreferrer`: Prevents the `Referer` header from being sent. Same effect as `noopener`.\n* `opener`: Creates a new browsing context when the hyperlink would otherwise open in a top-level context that is not auxiliary (for example, when `target=\"_blank\"` is specified).\n* `prev`: The previous document in the series.\n* `search`: Links to a resource that can be used to search through the current document and its related pages.\n* `tag`: Marks the current document with the given tag.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "alternate",
"description": "An alternate version of the current document."
},
{
"name": "author",
"description": "The author of the current document or article."
},
{
"name": "bookmark",
"description": "The permalink for the nearest ancestor section."
},
{
"name": "external",
"description": "The referenced document is not part of the same site as the current document."
},
{
"name": "help",
"description": "A link to context-sensitive help."
},
{
"name": "license",
"description": "Indicates that the main content of the current document is covered by the copyright license described by the referenced document."
},
{
"name": "me",
"description": "Indicates that the current document represents the person who owns the linked content."
},
{
"name": "next",
"description": "Indicates that the current document is part of a series and that the next document in the series is the referenced document."
},
{
"name": "nofollow",
"description": "Indicates that the current document's original author or publisher does not endorse the referenced document."
},
{
"name": "noreferrer",
"description": "Prevents the `Referer` header from being sent. It has the same effect as `noopener`."
},
{
"name": "opener",
"description": "Creates a new browsing context when the hyperlink would otherwise open in a top-level context that is not auxiliary (for example, when `target=\"_blank\"` is specified)."
},
{
"name": "prev",
"description": "Indicates that the current document is part of a series and that the previous document in the series is the referenced document."
},
{
"name": "search",
"description": "Links to a resource that can be used to search through the current document and its related pages."
},
{
"name": "tag",
"description": "Assigns a tag, identified by the given address, to the current document."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-item-attributes-rel"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-item-attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-item-attributes-tabindex"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/menu/menu-item.ts"
}
]
},
{
"name": "mdui-menu",
"description": "Menu Component Use with the `<mdui-menu-item>` component \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```",
"attributes": [
{
"name": "selects",
"description": "Controls whether menu items can be selected. They are not selectable by default. Possible values:\n\n* `single`: Only one item can be selected at a time.\n* `multiple`: Multiple items can be selected.",
"values": [
{
"name": "single",
"description": "Only one item can be selected at a time."
},
{
"name": "multiple",
"description": "Multiple items can be selected."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-attributes-selects"
}
]
},
{
"name": "value",
"description": "The value of the selected `<mdui-menu-item>`.\n\n**Note**: The HTML attribute always accepts a string and can only be used as an initial value when `selects=\"single\"`. The JavaScript property is a string when `selects=\"single\"` and an array of strings when `selects=\"multiple\"`. When `selects=\"multiple\"`, update the JavaScript property to change this value.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-attributes-value"
}
]
},
{
"name": "dense",
"description": "Indicates whether the menu items use a compact layout.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-attributes-dense"
}
]
},
{
"name": "submenu-trigger",
"description": "Defines how submenus open. Multiple space-separated values are supported. Possible values:\n\n* `click`: Opens the submenu when the menu item is clicked.\n* `hover`: Opens the submenu when hovering over a menu item.\n* `focus`: Opens the submenu when the menu item receives focus.\n* `manual`: Submenus can only be opened and closed programmatically; no other trigger methods can be specified.",
"values": [
{
"name": "click",
"description": "Opens the submenu when the menu item is clicked."
},
{
"name": "hover",
"description": "Opens the submenu when hovering over a menu item."
},
{
"name": "focus",
"description": "Opens the submenu when the menu item receives focus."
},
{
"name": "manual",
"description": "Submenus can only be opened and closed programmatically; no other trigger methods can be specified."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-attributes-submenu-trigger"
}
]
},
{
"name": "submenu-open-delay",
"description": "The delay (in milliseconds) before a submenu opens on hover.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-attributes-submenu-open-delay"
}
]
},
{
"name": "submenu-close-delay",
"description": "The delay (in milliseconds) before a submenu closes on hover.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu#menu-attributes-submenu-close-delay"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/menu"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/menu/menu.ts"
}
]
},
{
"name": "mdui-navigation-bar-item",
"description": "Navigation Bar Item Component Use with the `<mdui-navigation-bar>` component \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```",
"attributes": [
{
"name": "icon",
"description": "Specifies the Material Icons name for the inactive state. Alternatively, use `slot=\"icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar#navigation-bar-item-attributes-icon"
}
]
},
{
"name": "active-icon",
"description": "Specifies the Material Icons name for the active state. Alternatively, use `slot=\"active-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar#navigation-bar-item-attributes-active-icon"
}
]
},
{
"name": "value",
"description": "The value of the navigation item.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar#navigation-bar-item-attributes-value"
}
]
},
{
"name": "href",
"description": "The URL for the link. When set, the component renders as an `<a>` element and supports link-related attributes.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar#navigation-bar-item-attributes-href"
}
]
},
{
"name": "download",
"description": "Downloads the linked URL.\n\n**Note**: Only available when `href` is specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar#navigation-bar-item-attributes-download"
}
]
},
{
"name": "target",
"description": "Controls where the linked URL opens. Possible values:\n\n* `_blank`: Opens in a new tab or window.\n* `_parent`: Opens in the parent browsing context, or `_self` if there is no parent.\n* `_self`: Opens in the current browsing context (default).\n* `_top`: Opens in the topmost browsing context, or `_self` if there are no ancestors.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "_blank",
"description": "Opens in a new tab or window."
},
{
"name": "_parent",
"description": "Opens in the parent browsing context, or `_self` if there is no parent."
},
{
"name": "_self",
"description": "Opens in the current browsing context (default)."
},
{
"name": "_top",
"description": "Opens in the topmost browsing context, or `_self` if there are no ancestors."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar#navigation-bar-item-attributes-target"
}
]
},
{
"name": "rel",
"description": "Specifies the relationship of the linked URL as space-separated link types. Possible values:\n\n* `alternate`: An alternate version of the current document.\n* `author`: The author of the current document or article.\n* `bookmark`: The permalink for the nearest ancestor section.\n* `external`: The referenced document is not part of the same site as the current document.\n* `help`: A link to context-sensitive help.\n* `license`: Content covered by the copyright license described by the referenced document.\n* `me`: Links to content owned by the current document's author.\n* `next`: The next document in the series.\n* `nofollow`: Not endorsed by the original author or publisher.\n* `noreferrer`: Prevents the `Referer` header from being sent. Same effect as `noopener`.\n* `opener`: Creates a new browsing context when the hyperlink would otherwise open in a top-level context that is not auxiliary (for example, when `target=\"_blank\"` is specified).\n* `prev`: The previous document in the series.\n* `search`: Links to a resource that can be used to search through the current document and its related pages.\n* `tag`: Marks the current document with the given tag.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "alternate",
"description": "An alternate version of the current document."
},
{
"name": "author",
"description": "The author of the current document or article."
},
{
"name": "bookmark",
"description": "The permalink for the nearest ancestor section."
},
{
"name": "external",
"description": "The referenced document is not part of the same site as the current document."
},
{
"name": "help",
"description": "A link to context-sensitive help."
},
{
"name": "license",
"description": "Indicates that the main content of the current document is covered by the copyright license described by the referenced document."
},
{
"name": "me",
"description": "Indicates that the current document represents the person who owns the linked content."
},
{
"name": "next",
"description": "Indicates that the current document is part of a series and that the next document in the series is the referenced document."
},
{
"name": "nofollow",
"description": "Indicates that the current document's original author or publisher does not endorse the referenced document."
},
{
"name": "noreferrer",
"description": "Prevents the `Referer` header from being sent. It has the same effect as `noopener`."
},
{
"name": "opener",
"description": "Creates a new browsing context when the hyperlink would otherwise open in a top-level context that is not auxiliary (for example, when `target=\"_blank\"` is specified)."
},
{
"name": "prev",
"description": "Indicates that the current document is part of a series and that the previous document in the series is the referenced document."
},
{
"name": "search",
"description": "Links to a resource that can be used to search through the current document and its related pages."
},
{
"name": "tag",
"description": "Assigns a tag, identified by the given address, to the current document."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar#navigation-bar-item-attributes-rel"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar#navigation-bar-item-attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar#navigation-bar-item-attributes-tabindex"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/navigation-bar/navigation-bar-item.ts"
}
]
},
{
"name": "mdui-navigation-bar",
"description": "Navigation Bar Component Use with the `<mdui-navigation-bar-item>` component \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```",
"attributes": [
{
"name": "hide",
"description": "Whether the navigation bar is hidden.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar#navigation-bar-attributes-hide"
}
]
},
{
"name": "label-visibility",
"description": "Specifies when the text is shown. Possible values:\n\n* `auto`: Visible if there are 3 or fewer items; otherwise, only visible in the selected state.\n* `selected`: Only visible in the selected state.\n* `labeled`: Always visible.\n* `unlabeled`: Never visible.",
"values": [
{
"name": "auto",
"description": "Visible if there are 3 or fewer items; otherwise, only visible in the selected state."
},
{
"name": "selected",
"description": "Only visible in the selected state."
},
{
"name": "labeled",
"description": "Always visible."
},
{
"name": "unlabeled",
"description": "Never visible."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar#navigation-bar-attributes-label-visibility"
}
]
},
{
"name": "value",
"description": "The value of the selected `<mdui-navigation-bar-item>`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar#navigation-bar-attributes-value"
}
]
},
{
"name": "scroll-behavior",
"description": "Defines the scroll behavior. Possible values:\n\n* `hide`: Hides when scrolling.",
"values": [
{
"name": "hide"
},
{
"name": "shrink"
},
{
"name": "elevate"
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar#navigation-bar-attributes-scroll-behavior"
}
]
},
{
"name": "scroll-target",
"description": "The element to watch for scroll events. Accepts a CSS selector, a DOM element, or a [JQ object](/en/docs/2/functions/jq). Defaults to `window`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar#navigation-bar-attributes-scroll-target"
}
]
},
{
"name": "scroll-threshold",
"description": "The scroll distance (in pixels) required to trigger the scroll behavior.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar#navigation-bar-attributes-scroll-threshold"
}
]
},
{
"name": "order",
"description": "Specifies the layout order within the [`<mdui-layout>`](/en/docs/2/components/layout) component. Items are sorted in ascending order. The default value is `0`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar#navigation-bar-attributes-order"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-bar"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/navigation-bar/navigation-bar.ts"
}
]
},
{
"name": "mdui-navigation-drawer",
"description": "Navigation Drawer Component \n\n```html\n<mdui-navigation-drawer>content</mdui-navigation-drawer>\n```",
"attributes": [
{
"name": "open",
"description": "Opens the navigation drawer.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-drawer#attributes-open"
}
]
},
{
"name": "modal",
"description": "Displays an overlay when open.\n\nOn narrow devices (screen width < [`--mdui-breakpoint-md`](/en/docs/2/styles/design-tokens#breakpoint)), the overlay is always displayed.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-drawer#attributes-modal"
}
]
},
{
"name": "close-on-esc",
"description": "Closes the drawer when the ESC key is pressed and an overlay is present.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-drawer#attributes-close-on-esc"
}
]
},
{
"name": "close-on-overlay-click",
"description": "Closes the drawer when the overlay is clicked.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-drawer#attributes-close-on-overlay-click"
}
]
},
{
"name": "placement",
"description": "Sets the drawer's position. Possible values:\n\n* `left`: Displays on the left side.\n* `right`: Displays on the right side.",
"values": [
{
"name": "left",
"description": "Display on the left side."
},
{
"name": "right",
"description": "Display on the right side."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-drawer#attributes-placement"
}
]
},
{
"name": "contained",
"description": "By default, the navigation drawer is positioned relative to the `body` element. If set, it is positioned relative to its parent element.\n\n**Note**: You must manually set `position: relative; overflow: hidden;` on the parent element when this attribute is set.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-drawer#attributes-contained"
}
]
},
{
"name": "order",
"description": "Specifies the layout order within the [`<mdui-layout>`](/en/docs/2/components/layout) component. Items are sorted in ascending order. The default value is `0`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-drawer#attributes-order"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-drawer"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/navigation-drawer/index.ts"
}
]
},
{
"name": "mdui-navigation-rail-item",
"description": "Navigation Rail Item Component Use with the `<mdui-navigation-rail>` component \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```",
"attributes": [
{
"name": "icon",
"description": "Specifies the Material Icons name for the inactive state. Alternatively, use `slot=\"icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail#navigation-rail-item-attributes-icon"
}
]
},
{
"name": "active-icon",
"description": "Specifies the Material Icons name for the active state. Alternatively, use `slot=\"active-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail#navigation-rail-item-attributes-active-icon"
}
]
},
{
"name": "value",
"description": "The value of the navigation item.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail#navigation-rail-item-attributes-value"
}
]
},
{
"name": "href",
"description": "The URL for the link. When set, the component renders as an `<a>` element and supports link-related attributes.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail#navigation-rail-item-attributes-href"
}
]
},
{
"name": "download",
"description": "Downloads the linked URL.\n\n**Note**: Only available when `href` is specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail#navigation-rail-item-attributes-download"
}
]
},
{
"name": "target",
"description": "Controls where the linked URL opens. Possible values:\n\n* `_blank`: Opens in a new tab or window.\n* `_parent`: Opens in the parent browsing context, or `_self` if there is no parent.\n* `_self`: Opens in the current browsing context (default).\n* `_top`: Opens in the topmost browsing context, or `_self` if there are no ancestors.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "_blank",
"description": "Opens in a new tab or window."
},
{
"name": "_parent",
"description": "Opens in the parent browsing context, or `_self` if there is no parent."
},
{
"name": "_self",
"description": "Opens in the current browsing context (default)."
},
{
"name": "_top",
"description": "Opens in the topmost browsing context, or `_self` if there are no ancestors."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail#navigation-rail-item-attributes-target"
}
]
},
{
"name": "rel",
"description": "Specifies the relationship of the linked URL as space-separated link types. Possible values:\n\n* `alternate`: An alternate version of the current document.\n* `author`: The author of the current document or article.\n* `bookmark`: The permalink for the nearest ancestor section.\n* `external`: The referenced document is not part of the same site as the current document.\n* `help`: A link to context-sensitive help.\n* `license`: Content covered by the copyright license described by the referenced document.\n* `me`: Links to content owned by the current document's author.\n* `next`: The next document in the series.\n* `nofollow`: Not endorsed by the original author or publisher.\n* `noreferrer`: Prevents the `Referer` header from being sent. Same effect as `noopener`.\n* `opener`: Creates a new browsing context when the hyperlink would otherwise open in a top-level context that is not auxiliary (for example, when `target=\"_blank\"` is specified).\n* `prev`: The previous document in the series.\n* `search`: Links to a resource that can be used to search through the current document and its related pages.\n* `tag`: Marks the current document with the given tag.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "alternate",
"description": "An alternate version of the current document."
},
{
"name": "author",
"description": "The author of the current document or article."
},
{
"name": "bookmark",
"description": "The permalink for the nearest ancestor section."
},
{
"name": "external",
"description": "The referenced document is not part of the same site as the current document."
},
{
"name": "help",
"description": "A link to context-sensitive help."
},
{
"name": "license",
"description": "Indicates that the main content of the current document is covered by the copyright license described by the referenced document."
},
{
"name": "me",
"description": "Indicates that the current document represents the person who owns the linked content."
},
{
"name": "next",
"description": "Indicates that the current document is part of a series and that the next document in the series is the referenced document."
},
{
"name": "nofollow",
"description": "Indicates that the current document's original author or publisher does not endorse the referenced document."
},
{
"name": "noreferrer",
"description": "Prevents the `Referer` header from being sent. It has the same effect as `noopener`."
},
{
"name": "opener",
"description": "Creates a new browsing context when the hyperlink would otherwise open in a top-level context that is not auxiliary (for example, when `target=\"_blank\"` is specified)."
},
{
"name": "prev",
"description": "Indicates that the current document is part of a series and that the previous document in the series is the referenced document."
},
{
"name": "search",
"description": "Links to a resource that can be used to search through the current document and its related pages."
},
{
"name": "tag",
"description": "Assigns a tag, identified by the given address, to the current document."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail#navigation-rail-item-attributes-rel"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail#navigation-rail-item-attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail#navigation-rail-item-attributes-tabindex"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/navigation-rail/navigation-rail-item.ts"
}
]
},
{
"name": "mdui-navigation-rail",
"description": "Navigation Rail Component Use with the `<mdui-navigation-rail-item>` component \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```",
"attributes": [
{
"name": "value",
"description": "The value of the selected `<mdui-navigation-rail-item>`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail#navigation-rail-attributes-value"
}
]
},
{
"name": "placement",
"description": "Sets the navigation rail's position. Possible values:\n\n* `left`: Displays on the left.\n* `right`: Displays on the right.",
"values": [
{
"name": "left",
"description": "Display on the left."
},
{
"name": "right",
"description": "Display on the right."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail#navigation-rail-attributes-placement"
}
]
},
{
"name": "alignment",
"description": "Sets the alignment of `<mdui-navigation-rail-item>` elements. Possible values:\n\n* `start`: Aligns to the top.\n* `center`: Aligns to the center.\n* `end`: Aligns to the bottom.",
"values": [
{
"name": "start",
"description": "Aligns to the top."
},
{
"name": "center",
"description": "Aligns to the center."
},
{
"name": "end",
"description": "Aligns to the bottom."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail#navigation-rail-attributes-alignment"
}
]
},
{
"name": "contained",
"description": "By default, the navigation rail is positioned relative to the `body` element. If set, it is positioned relative to its parent element.\n\n**Note**: You must manually set `position: relative;` on the parent element when this attribute is set.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail#navigation-rail-attributes-contained"
}
]
},
{
"name": "divider",
"description": "Adds a divider between the navigation rail and the page content.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail#navigation-rail-attributes-divider"
}
]
},
{
"name": "order",
"description": "Specifies the layout order within the [`<mdui-layout>`](/en/docs/2/components/layout) component. Items are sorted in ascending order. The default value is `0`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail#navigation-rail-attributes-order"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/navigation-rail"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/navigation-rail/navigation-rail.ts"
}
]
},
{
"name": "mdui-radio-group",
"description": "Radio Group Component Use with the `<mdui-radio>` component \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```",
"attributes": [
{
"name": "disabled",
"description": "Disables the radio group.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/radio#radio-group-attributes-disabled"
}
]
},
{
"name": "form",
"description": "Associates the radio group with a `<form>` element. Set this to the `id` of a `<form>` in the same document. If omitted, the radio group uses its parent `<form>`, if any.\n\nThis lets the radio group work with any form in the document, not just the one it is nested in.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/radio#radio-group-attributes-form"
}
]
},
{
"name": "name",
"description": "The name of the radio group, which is submitted with form data.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/radio#radio-group-attributes-name"
}
]
},
{
"name": "value",
"description": "The value of the selected radio button, which is submitted with form data.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/radio#radio-group-attributes-value"
}
]
},
{
"name": "required",
"description": "Requires a radio selection when the form is submitted.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/radio#radio-group-attributes-required"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/radio"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/radio/radio-group.ts"
}
]
},
{
"name": "mdui-radio",
"description": "Radio Component Use with the `<mdui-radio-group>` component \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```",
"attributes": [
{
"name": "value",
"description": "Specifies the value of the radio.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/radio#radio-attributes-value"
}
]
},
{
"name": "disabled",
"description": "Disables the radio.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/radio#radio-attributes-disabled"
}
]
},
{
"name": "checked",
"description": "Sets the radio to the checked state.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/radio#radio-attributes-checked"
}
]
},
{
"name": "unchecked-icon",
"description": "Specifies the Material Icons name for the unchecked state. Alternatively, use `slot=\"unchecked-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/radio#radio-attributes-unchecked-icon"
}
]
},
{
"name": "checked-icon",
"description": "Specifies the Material Icons name for the checked state. Alternatively, use `slot=\"checked-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/radio#radio-attributes-checked-icon"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/radio#radio-attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/radio#radio-attributes-tabindex"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/radio"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/radio/radio.ts"
}
]
},
{
"name": "mdui-range-slider",
"description": "Range Slider Component \n\n```html\n<mdui-range-slider></mdui-range-slider>\n```",
"attributes": [
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/range-slider#attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/range-slider#attributes-tabindex"
}
]
},
{
"name": "min",
"description": "Specifies the minimum value. Default is `0`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/range-slider#attributes-min"
}
]
},
{
"name": "max",
"description": "Specifies the maximum value. Default is `100`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/range-slider#attributes-max"
}
]
},
{
"name": "step",
"description": "Specifies the step interval. Default is `1`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/range-slider#attributes-step"
}
]
},
{
"name": "tickmarks",
"description": "Adds tickmarks to the slider.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/range-slider#attributes-tickmarks"
}
]
},
{
"name": "nolabel",
"description": "Hides the value label.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/range-slider#attributes-nolabel"
}
]
},
{
"name": "disabled",
"description": "Disables the slider.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/range-slider#attributes-disabled"
}
]
},
{
"name": "form",
"description": "Associates the slider with a `<form>` element. Set this to the `id` of a `<form>` in the same document. If omitted, the slider uses its parent `<form>`, if any.\n\nThis lets the slider work with any form in the document, not just the one it is nested in.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/range-slider#attributes-form"
}
]
},
{
"name": "name",
"description": "Specifies the slider's name, which is submitted with form data.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/range-slider#attributes-name"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/range-slider"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/range-slider/index.ts"
}
]
},
{
"name": "mdui-segmented-button-group",
"description": "Segmented Button Group Component Use with the `<mdui-segmented-button>` component \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```",
"attributes": [
{
"name": "full-width",
"description": "If set, the segmented button group expands to fill the width of its container.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-group-attributes-full-width"
}
]
},
{
"name": "selects",
"description": "Controls whether the segmented button group can be selected. By default, it is not selectable. Possible values:\n\n* `single`: Only one can be selected.\n* `multiple`: Multiple selections are allowed.",
"values": [
{
"name": "single",
"description": "Only one can be selected."
},
{
"name": "multiple",
"description": "Multiple selections are allowed."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-group-attributes-selects"
}
]
},
{
"name": "disabled",
"description": "Disables the segmented button group.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-group-attributes-disabled"
}
]
},
{
"name": "required",
"description": "Requires a selection when the form is submitted.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-group-attributes-required"
}
]
},
{
"name": "form",
"description": "Associates the segmented button group with a `<form>` element. Set this to the `id` of a `<form>` in the same document. If omitted, the segmented button group uses its parent `<form>`, if any.\n\nThis lets the segmented button group work with any form in the document, not just the one it is nested in.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-group-attributes-form"
}
]
},
{
"name": "name",
"description": "The name of the segmented button group, which is submitted with form data.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-group-attributes-name"
}
]
},
{
"name": "value",
"description": "The value of the selected `<mdui-segmented-button>`. This value is submitted with form data.\n\n**Note**: The HTML attribute always accepts a string and can only be used as an initial value when `selects=\"single\"`. The JavaScript property is a string when `selects=\"single\"` and an array of strings when `selects=\"multiple\"`. When `selects=\"multiple\"`, update the JavaScript property to change this value.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-group-attributes-value"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/segmented-button/segmented-button-group.ts"
}
]
},
{
"name": "mdui-segmented-button",
"description": "Segmented Button Component Use with the `<mdui-segmented-button-group>` component \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```",
"attributes": [
{
"name": "icon",
"description": "Specifies the Material Icons name for the left icon. Alternatively, use `slot=\"icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-icon"
}
]
},
{
"name": "end-icon",
"description": "Specifies the Material Icons name for the right icon. Alternatively, use `slot=\"end-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-end-icon"
}
]
},
{
"name": "selected-icon",
"description": "Specifies the Material Icons name for the selected state. Alternatively, use `slot=\"selected-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-selected-icon"
}
]
},
{
"name": "href",
"description": "The URL for the link. When set, the component renders as an `<a>` element and supports link-related attributes.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-href"
}
]
},
{
"name": "download",
"description": "Downloads the linked URL.\n\n**Note**: Only available when `href` is specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-download"
}
]
},
{
"name": "target",
"description": "Controls where the linked URL opens. Possible values:\n\n* `_blank`: Opens in a new tab or window.\n* `_parent`: Opens in the parent browsing context, or `_self` if there is no parent.\n* `_self`: Opens in the current browsing context (default).\n* `_top`: Opens in the topmost browsing context, or `_self` if there are no ancestors.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "_blank",
"description": "Opens in a new tab or window."
},
{
"name": "_parent",
"description": "Opens in the parent browsing context, or `_self` if there is no parent."
},
{
"name": "_self",
"description": "Opens in the current browsing context (default)."
},
{
"name": "_top",
"description": "Opens in the topmost browsing context, or `_self` if there are no ancestors."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-target"
}
]
},
{
"name": "rel",
"description": "Specifies the relationship of the linked URL as space-separated link types. Possible values:\n\n* `alternate`: An alternate version of the current document.\n* `author`: The author of the current document or article.\n* `bookmark`: The permalink for the nearest ancestor section.\n* `external`: The referenced document is not part of the same site as the current document.\n* `help`: A link to context-sensitive help.\n* `license`: Content covered by the copyright license described by the referenced document.\n* `me`: Links to content owned by the current document's author.\n* `next`: The next document in the series.\n* `nofollow`: Not endorsed by the original author or publisher.\n* `noreferrer`: Prevents the `Referer` header from being sent. Same effect as `noopener`.\n* `opener`: Creates an auxiliary browsing context if the hyperlink would otherwise create a top-level browsing context that is not an auxiliary one (i.e., when `target=\"_blank\"`).\n* `prev`: The previous document in the series.\n* `search`: Links to a resource that can be used to search through the current document and its related pages.\n* `tag`: Marks the current document with the given tag.\n\n**Note**: Only available when `href` is specified.",
"values": [
{
"name": "alternate",
"description": "An alternate version of the current document."
},
{
"name": "author",
"description": "The author of the current document or article."
},
{
"name": "bookmark",
"description": "The permalink for the nearest ancestor section."
},
{
"name": "external",
"description": "The referenced document is not part of the same site as the current document."
},
{
"name": "help",
"description": "A link to context-sensitive help."
},
{
"name": "license",
"description": "Indicates that the main content of the current document is covered by the copyright license described by the referenced document."
},
{
"name": "me",
"description": "Indicates that the current document represents the person who owns the linked content."
},
{
"name": "next",
"description": "Indicates that the current document is part of a series and that the next document in the series is the referenced document."
},
{
"name": "nofollow",
"description": "Indicates that the current document's original author or publisher does not endorse the referenced document."
},
{
"name": "noreferrer",
"description": "Prevents the `Referer` header from being sent. It has the same effect as `noopener`."
},
{
"name": "opener",
"description": "Creates a new browsing context when the hyperlink would otherwise open in a top-level context that is not auxiliary (for example, when `target=\"_blank\"` is specified)."
},
{
"name": "prev",
"description": "Indicates that the current document is part of a series and that the previous document in the series is the referenced document."
},
{
"name": "search",
"description": "Links to a resource that can be used to search through the current document and its related pages."
},
{
"name": "tag",
"description": "Assigns a tag, identified by the given address, to the current document."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-rel"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-tabindex"
}
]
},
{
"name": "disabled",
"description": "Disables the element.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-disabled"
}
]
},
{
"name": "loading",
"description": "Indicates that the element is in a loading state.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-loading"
}
]
},
{
"name": "name",
"description": "The button name submitted with form data.\n\n**Note**: Only available when `href` is not specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-name"
}
]
},
{
"name": "value",
"description": "The button value submitted with form data.\n\n**Note**: Only available when `href` is not specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-value"
}
]
},
{
"name": "type",
"description": "Specifies the button's default action. Default: `button`. Possible values:\n\n* `submit`: Submits the form data to the server.\n* `reset`: Restores all controls to their initial values.\n* `button`: Does nothing by default.\n\n**Note**: Only available when `href` is not specified.",
"values": [
{
"name": "submit",
"description": "Submits the form data to the server."
},
{
"name": "reset",
"description": "Resets all controls to their initial values."
},
{
"name": "button",
"description": "Has no default action."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-type"
}
]
},
{
"name": "form",
"description": "Associates the button with a `<form>` element. Set this to the `id` of a `<form>` in the same document. If omitted, the button uses its parent `<form>`, if any.\n\nThis lets the button target any form in the document, not just the one it is nested in.\n\n**Note**: Only available when `href` is not specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-form"
}
]
},
{
"name": "formaction",
"description": "Specifies the URL that processes the button's submitted information. Overrides the `action` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-formaction"
}
]
},
{
"name": "formenctype",
"description": "Specifies how to encode the form data. Possible values:\n\n* `application/x-www-form-urlencoded`: Default when the attribute is omitted.\n* `multipart/form-data`: Used for `<input>` elements with `type=\"file\"`.\n* `text/plain`: Useful for debugging, but not for actual form submissions.\n\nOverrides the `enctype` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"values": [
{
"name": "application/x-www-form-urlencoded",
"description": "Default if the attribute is not used."
},
{
"name": "multipart/form-data",
"description": "Used for `<input>` elements with `type=\"file\"`."
},
{
"name": "text/plain",
"description": "For debugging, not for real form submission."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-formenctype"
}
]
},
{
"name": "formmethod",
"description": "Specifies the HTTP method for form submission. Possible values:\n\n* `post`: Sends the form data in the request body.\n* `get`: Appends the form data to the `action` URL.\n\nOverrides the `method` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"values": [
{
"name": "post",
"description": "Form data is included in the HTTP request body."
},
{
"name": "get",
"description": "Form data is appended to the `action` URL."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-formmethod"
}
]
},
{
"name": "formnovalidate",
"description": "Specifies that the form should not be validated on submission. Overrides the `novalidate` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-formnovalidate"
}
]
},
{
"name": "formtarget",
"description": "Specifies where to open the response after form submission. Possible values:\n\n* `_self`: Current browsing context (default).\n* `_blank`: New tab or window.\n* `_parent`: Parent browsing context, or `_self` if there is no parent.\n* `_top`: Topmost browsing context, or `_self` if there are no ancestors.\n\nOverrides the `target` attribute of the button's form owner.\n\n**Note**: Only available when `href` is not specified and `type=\"submit\"`.",
"values": [
{
"name": "_self",
"description": "Current browsing context (default)."
},
{
"name": "_blank",
"description": "New tab or window."
},
{
"name": "_parent",
"description": "Parent browsing context, or `_self` if there is no parent."
},
{
"name": "_top",
"description": "Topmost browsing context, or `_self` if there are no ancestors."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button#segmented-button-attributes-formtarget"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/segmented-button"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/segmented-button/segmented-button.ts"
}
]
},
{
"name": "mdui-select",
"description": "Select Component Use with the `<mdui-menu-item>` component \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```",
"attributes": [
{
"name": "variant",
"description": "Defines the select variant. Possible values:\n\n* `filled`: Solid background with strong visual emphasis.\n* `outlined`: Bordered with lighter visual emphasis.",
"values": [
{
"name": "filled",
"description": "Solid background with strong visual emphasis."
},
{
"name": "outlined",
"description": "Bordered with lighter visual emphasis."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-variant"
}
]
},
{
"name": "multiple",
"description": "Enables multiple selections.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-multiple"
}
]
},
{
"name": "name",
"description": "Name of the select, which is submitted with form data.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-name"
}
]
},
{
"name": "value",
"description": "Value of the select, which is submitted with form data.\n\nIf `multiple` is not set, the value is a string; otherwise, it is an array of strings. HTML attributes can only set string values; array values must be set via the JavaScript property.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-value"
}
]
},
{
"name": "label",
"description": "Label text.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-label"
}
]
},
{
"name": "placeholder",
"description": "Placeholder text.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-placeholder"
}
]
},
{
"name": "helper",
"description": "Helper text displayed below the select. Alternatively, use `slot=\"helper\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-helper"
}
]
},
{
"name": "clearable",
"description": "Makes the select clearable.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-clearable"
}
]
},
{
"name": "clear-icon",
"description": "Material Icons name for the clear button displayed on the right when clearable. Alternatively, use `slot=\"clear-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-clear-icon"
}
]
},
{
"name": "placement",
"description": "Select placement. Possible values:\n\n* `auto`: Automatically determined.\n* `bottom`: Below the input.\n* `top`: Above the input.",
"values": [
{
"name": "auto",
"description": "Automatically determined."
},
{
"name": "bottom",
"description": "Below the input."
},
{
"name": "top",
"description": "Above the input."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-placement"
}
]
},
{
"name": "end-aligned",
"description": "Aligns text to the right.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-end-aligned"
}
]
},
{
"name": "prefix",
"description": "Prefix text of the select. Displayed only when the select is focused or has a value. Alternatively, use `slot=\"prefix\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-prefix"
}
]
},
{
"name": "suffix",
"description": "Suffix text of the select. Displayed only when the select is focused or has a value. Alternatively, use `slot=\"suffix\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-suffix"
}
]
},
{
"name": "icon",
"description": "Material Icons name for the prefix icon. Alternatively, use `slot=\"icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-icon"
}
]
},
{
"name": "end-icon",
"description": "Material Icons name for the suffix icon. Alternatively, use `slot=\"end-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-end-icon"
}
]
},
{
"name": "error-icon",
"description": "Material Icons name displayed on the right when form field validation fails. Alternatively, use `slot=\"error-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-error-icon"
}
]
},
{
"name": "form",
"description": "Associates the select with a `<form>` element. Set this to the `id` of a `<form>` in the same document. If omitted, the select uses its parent `<form>`, if any.\n\nThis lets the select work with any form in the document, not just the one it is nested in.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-form"
}
]
},
{
"name": "readonly",
"description": "Makes the select read-only.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-readonly"
}
]
},
{
"name": "disabled",
"description": "Disables the select.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-disabled"
}
]
},
{
"name": "required",
"description": "Requires a selection when the form is submitted.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-required"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select#attributes-tabindex"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/select"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/select/index.ts"
}
]
},
{
"name": "mdui-slider",
"description": "Slider Component \n\n```html\n<mdui-slider></mdui-slider>\n```",
"attributes": [
{
"name": "value",
"description": "The value of the slider, which is submitted with form data.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/slider#attributes-value"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/slider#attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/slider#attributes-tabindex"
}
]
},
{
"name": "min",
"description": "Specifies the minimum value. Default is `0`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/slider#attributes-min"
}
]
},
{
"name": "max",
"description": "Specifies the maximum value. Default is `100`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/slider#attributes-max"
}
]
},
{
"name": "step",
"description": "Specifies the step interval. Default is `1`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/slider#attributes-step"
}
]
},
{
"name": "tickmarks",
"description": "Adds tickmarks to the slider.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/slider#attributes-tickmarks"
}
]
},
{
"name": "nolabel",
"description": "Hides the value label.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/slider#attributes-nolabel"
}
]
},
{
"name": "disabled",
"description": "Disables the slider.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/slider#attributes-disabled"
}
]
},
{
"name": "form",
"description": "Associates the slider with a `<form>` element. Set this to the `id` of a `<form>` in the same document. If omitted, the slider uses its parent `<form>`, if any.\n\nThis lets the slider work with any form in the document, not just the one it is nested in.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/slider#attributes-form"
}
]
},
{
"name": "name",
"description": "Specifies the slider's name, which is submitted with form data.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/slider#attributes-name"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/slider"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/slider/index.ts"
}
]
},
{
"name": "mdui-snackbar",
"description": "Snackbar Component \n\n```html\n<mdui-snackbar>message</mdui-snackbar>\n```",
"attributes": [
{
"name": "open",
"description": "Opens the Snackbar.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/snackbar#attributes-open"
}
]
},
{
"name": "placement",
"description": "Snackbar placement. Default is `bottom`. Possible values:\n\n* `top`: Top center.\n* `top-start`: Top left.\n* `top-end`: Top right.\n* `bottom`: Bottom center.\n* `bottom-start`: Bottom left.\n* `bottom-end`: Bottom right.",
"values": [
{
"name": "top",
"description": "Top center."
},
{
"name": "top-start",
"description": "Top left."
},
{
"name": "top-end",
"description": "Top right."
},
{
"name": "bottom",
"description": "Bottom center."
},
{
"name": "bottom-start",
"description": "Bottom left."
},
{
"name": "bottom-end",
"description": "Bottom right."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/snackbar#attributes-placement"
}
]
},
{
"name": "action",
"description": "Text for the action button. Alternatively, use `slot=\"action\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/snackbar#attributes-action"
}
]
},
{
"name": "action-loading",
"description": "Whether the action button is in a loading state.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/snackbar#attributes-action-loading"
}
]
},
{
"name": "closeable",
"description": "Shows a close button on the right.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/snackbar#attributes-closeable"
}
]
},
{
"name": "close-icon",
"description": "Material Icons name for the close button. Alternatively, use `slot=\"close-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/snackbar#attributes-close-icon"
}
]
},
{
"name": "message-line",
"description": "Maximum lines for message text. Default is unlimited. Possible values:\n\n* `1`: Single line.\n* `2`: Two lines.",
"values": [
{
"name": "1",
"description": "Single line."
},
{
"name": "2",
"description": "Two lines."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/snackbar#attributes-message-line"
}
]
},
{
"name": "auto-close-delay",
"description": "Automatically closes the Snackbar after the given delay (in milliseconds). Set to `0` to disable auto-close. Default is `5000`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/snackbar#attributes-auto-close-delay"
}
]
},
{
"name": "close-on-outside-click",
"description": "Closes the Snackbar when the user clicks or touches outside it.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/snackbar#attributes-close-on-outside-click"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/snackbar"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/snackbar/index.ts"
}
]
},
{
"name": "mdui-switch",
"description": "Switch Component \n\n```html\n<mdui-switch></mdui-switch>\n```",
"attributes": [
{
"name": "disabled",
"description": "Disables the switch.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/switch#attributes-disabled"
}
]
},
{
"name": "checked",
"description": "Sets the switch to the checked state.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/switch#attributes-checked"
}
]
},
{
"name": "unchecked-icon",
"description": "The Material Icons name for the unchecked state. Alternatively, use `slot=\"unchecked-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/switch#attributes-unchecked-icon"
}
]
},
{
"name": "checked-icon",
"description": "The Material Icons name for the checked state. Alternatively, use `slot=\"checked-icon\"`. Defaults to the `check` icon; setting an empty string removes the default icon.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/switch#attributes-checked-icon"
}
]
},
{
"name": "required",
"description": "The switch must be checked before the form is submitted.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/switch#attributes-required"
}
]
},
{
"name": "form",
"description": "Associates the switch with a `<form>` element. Set this to the `id` of a `<form>` in the same document. If omitted, the switch uses its parent `<form>`, if any.\n\nThis lets the switch work with any form in the document, not just the one it is nested in.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/switch#attributes-form"
}
]
},
{
"name": "name",
"description": "The name of the switch, which is submitted with form data.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/switch#attributes-name"
}
]
},
{
"name": "value",
"description": "The value of the switch, which is submitted with form data.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/switch#attributes-value"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/switch#attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/switch#attributes-tabindex"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/switch"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/switch/index.ts"
}
]
},
{
"name": "mdui-tab-panel",
"description": "Tab Panel Component Use with the `<mdui-tabs>` and `<mdui-tab>` components \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```",
"attributes": [
{
"name": "value",
"description": "Specifies the value of the tab panel.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tabs#tab-panel-attributes-value"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tabs"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/tabs/tab-panel.ts"
}
]
},
{
"name": "mdui-tab",
"description": "Tab Component Use with the `<mdui-tabs>` and `<mdui-tab-panel>` components \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```",
"attributes": [
{
"name": "value",
"description": "Specifies the tab value.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tabs#tab-attributes-value"
}
]
},
{
"name": "icon",
"description": "Specifies the Material Icons name. Alternatively, use `slot=\"icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tabs#tab-attributes-icon"
}
]
},
{
"name": "inline",
"description": "Arranges the icon and text horizontally.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tabs#tab-attributes-inline"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tabs#tab-attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tabs#tab-attributes-tabindex"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tabs"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/tabs/tab.ts"
}
]
},
{
"name": "mdui-tabs",
"description": "Tabs Component Use with the `<mdui-tab>` and `<mdui-tab-panel>` components \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```",
"attributes": [
{
"name": "variant",
"description": "Defines the tab variant. Possible values:\n\n* `primary`: Sits below `<mdui-top-app-bar>` and is used to switch between main application pages.\n* `secondary`: Sits within the page and is used to switch between related content groups.",
"values": [
{
"name": "primary",
"description": "Located below `<mdui-top-app-bar>`, used for switching between main application pages."
},
{
"name": "secondary",
"description": "Located within the page, used for switching between related content groups."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tabs#tabs-attributes-variant"
}
]
},
{
"name": "value",
"description": "Specifies the active `<mdui-tab>` value.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tabs#tabs-attributes-value"
}
]
},
{
"name": "placement",
"description": "Defines the tab position. Default is `top-start`. Possible values:\n\n* `top-start`: Top left.\n* `top`: Top centered.\n* `top-end`: Top right.\n* `bottom-start`: Bottom left.\n* `bottom`: Bottom, centered.\n* `bottom-end`: Bottom right.\n* `left-start`: Left top.\n* `left`: Left, centered.\n* `left-end`: Left bottom.\n* `right-start`: Right top.\n* `right`: Right, centered.\n* `right-end`: Right bottom.",
"values": [
{
"name": "top-start",
"description": "Top left."
},
{
"name": "top",
"description": "Top centered."
},
{
"name": "top-end",
"description": "Top right."
},
{
"name": "bottom-start",
"description": "Bottom left."
},
{
"name": "bottom",
"description": "Bottom, centered."
},
{
"name": "bottom-end",
"description": "Bottom right."
},
{
"name": "left-start",
"description": "Left top."
},
{
"name": "left",
"description": "Left, centered."
},
{
"name": "left-end",
"description": "Left bottom."
},
{
"name": "right-start",
"description": "Right top."
},
{
"name": "right",
"description": "Right, centered."
},
{
"name": "right-end",
"description": "Right bottom."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tabs#tabs-attributes-placement"
}
]
},
{
"name": "full-width",
"description": "If set, the tabs will fill the width of their parent element.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tabs#tabs-attributes-full-width"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tabs"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/tabs/tabs.ts"
}
]
},
{
"name": "mdui-text-field",
"description": "Text Field Component \n\n```html\n<mdui-text-field label=\"Text Field\"></mdui-text-field>\n```",
"attributes": [
{
"name": "variant",
"description": "Defines the text field variant. Default is `filled`. Possible values:\n\n* `filled`: Text field with a background color for stronger visual emphasis.\n* `outlined`: Text field with a border for subtler visual emphasis.",
"values": [
{
"name": "filled",
"description": "Text field with a background color for stronger visual emphasis."
},
{
"name": "outlined",
"description": "Text field with a border for subtler visual emphasis."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-variant"
}
]
},
{
"name": "type",
"description": "Specifies the text field type. Default is `text`. Possible values:\n\n* `text`: Standard text field.\n* `number`: Allows numeric input only. Virtual keyboards on mobile devices show a numeric layout.\n* `password`: Hides the password as you type.\n* `url`: Validates URL format. Virtual keyboards on mobile devices show a URL-specific layout.\n* `email`: Validates email format. Virtual keyboards on mobile devices show an email-specific layout.\n* `search`: Shows a search icon on the Enter key in virtual keyboards.\n* `tel`: Displays a phone keypad on virtual keyboards.\n* `hidden`: Hides the control, but its value is still submitted to the server.\n* `date`: Opens a date picker or a numeric scroll wheel for year, month, and day in supported browsers.\n* `datetime-local`: Activates a date and time picker in supported browsers, without a time zone.\n* `month`: Allows entering a year and month without a time zone.\n* `time`: Allows time input without a time zone.\n* `week`: Allows entering a year and week without a time zone.",
"values": [
{
"name": "text",
"description": "Standard text field."
},
{
"name": "number",
"description": "Allows only numeric input. Devices with virtual keyboards will display a numeric keyboard."
},
{
"name": "password",
"description": "Hides the password as you type."
},
{
"name": "url",
"description": "Validates URL format. Devices with virtual keyboards will display a URL-specific keyboard."
},
{
"name": "email",
"description": "Validates email format. Devices with virtual keyboards will display an email-specific keyboard."
},
{
"name": "search",
"description": "Shows a search icon on the Enter key in virtual keyboards."
},
{
"name": "tel",
"description": "Displays a phone keypad on virtual keyboards."
},
{
"name": "hidden",
"description": "Hides the control, but its value is still submitted to the server."
},
{
"name": "date",
"description": "Opens a date picker or a numeric scroll wheel for year, month, and day in supported browsers."
},
{
"name": "datetime-local",
"description": "Activates a date and time picker in supported browsers, excluding time zone."
},
{
"name": "month",
"description": "Allows entering a year and month, without a time zone."
},
{
"name": "time",
"description": "Allows time input, excluding time zone."
},
{
"name": "week",
"description": "Allows entering a year and week, without a time zone."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-type"
}
]
},
{
"name": "name",
"description": "The name of the text field, which is submitted with form data.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-name"
}
]
},
{
"name": "value",
"description": "The value of the text field, which is submitted with form data.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-value"
}
]
},
{
"name": "label",
"description": "Label text.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-label"
}
]
},
{
"name": "placeholder",
"description": "Placeholder text.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-placeholder"
}
]
},
{
"name": "helper",
"description": "The helper text displayed at the bottom of the text field. Alternatively, use `slot=\"helper\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-helper"
}
]
},
{
"name": "helper-on-focus",
"description": "Shows the helper text only when the text field is focused.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-helper-on-focus"
}
]
},
{
"name": "clearable",
"description": "Makes the text field clearable.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-clearable"
}
]
},
{
"name": "clear-icon",
"description": "Material Icons name shown on the right when the text field is clearable. Alternatively, use `slot=\"clear-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-clear-icon"
}
]
},
{
"name": "end-aligned",
"description": "Aligns the text to the right.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-end-aligned"
}
]
},
{
"name": "prefix",
"description": "The prefix text for the text field. It is only displayed when the text field is focused or has a value. Alternatively, use `slot=\"prefix\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-prefix"
}
]
},
{
"name": "suffix",
"description": "The suffix text for the text field. It is only displayed when the text field is focused or has a value. Alternatively, use `slot=\"suffix\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-suffix"
}
]
},
{
"name": "icon",
"description": "Material Icons name for the prefix icon of the text field. Alternatively, use `slot=\"icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-icon"
}
]
},
{
"name": "end-icon",
"description": "Material Icons name for the suffix icon of the text field. Alternatively, use `slot=\"end-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-end-icon"
}
]
},
{
"name": "error-icon",
"description": "Material Icons name displayed on the right side of the text field when form field validation fails. Alternatively, use `slot=\"error-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-error-icon"
}
]
},
{
"name": "form",
"description": "Associates the text field with a `<form>` element. Set this to the `id` of a `<form>` in the same document. If omitted, the text field uses its parent `<form>`, if any.\n\nThis lets the text field work with any form in the document, not just the one it is nested in.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-form"
}
]
},
{
"name": "readonly",
"description": "Makes the text field read-only.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-readonly"
}
]
},
{
"name": "disabled",
"description": "Disables the text field.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-disabled"
}
]
},
{
"name": "required",
"description": "The field must be filled out before the form is submitted.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-required"
}
]
},
{
"name": "rows",
"description": "The number of rows in the text field.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-rows"
}
]
},
{
"name": "autosize",
"description": "Automatically adjusts the height of the text field based on its content.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-autosize"
}
]
},
{
"name": "min-rows",
"description": "The minimum number of rows when `autosize` is enabled.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-min-rows"
}
]
},
{
"name": "max-rows",
"description": "The maximum number of rows when `autosize` is enabled.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-max-rows"
}
]
},
{
"name": "minlength",
"description": "The minimum number of characters for input.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-minlength"
}
]
},
{
"name": "maxlength",
"description": "The maximum number of characters for input.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-maxlength"
}
]
},
{
"name": "counter",
"description": "Displays the character count when `maxlength` is specified.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-counter"
}
]
},
{
"name": "min",
"description": "The minimum value when `type` is `number`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-min"
}
]
},
{
"name": "max",
"description": "The maximum value when `type` is `number`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-max"
}
]
},
{
"name": "step",
"description": "The step interval for increment/decrement when `type` is `number`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-step"
}
]
},
{
"name": "pattern",
"description": "The regular expression for form validation.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-pattern"
}
]
},
{
"name": "toggle-password",
"description": "Adds a toggle button to show or hide the password when `type` is `password`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-toggle-password"
}
]
},
{
"name": "show-password-icon",
"description": "Material Icons name for the visible password toggle button. Alternatively, use `slot=\"show-password-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-show-password-icon"
}
]
},
{
"name": "hide-password-icon",
"description": "Material Icons name for the hidden password toggle button. Alternatively, use `slot=\"hide-password-icon\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-hide-password-icon"
}
]
},
{
"name": "autocapitalize",
"description": "A non-standard iOS attribute for automatic capitalization. Possible values:\n\n* `none`: Disables automatic capitalization.\n* `sentences`: Capitalizes the first letter of each sentence.\n* `words`: Capitalizes the first letter of each word.\n* `characters`: Capitalizes all letters.",
"values": [
{
"name": "none",
"description": "Disables automatic capitalization."
},
{
"name": "sentences",
"description": "Capitalizes the first letter of each sentence."
},
{
"name": "words",
"description": "Capitalizes the first letter of each word."
},
{
"name": "characters",
"description": "Capitalizes all letters."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-autocapitalize"
}
]
},
{
"name": "autocorrect",
"description": "The `autocorrect` attribute of the `input` element.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-autocorrect"
}
]
},
{
"name": "autocomplete",
"description": "The `autocomplete` attribute of the `input` element.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-autocomplete"
}
]
},
{
"name": "enterkeyhint",
"description": "Customizes the Enter key text or icon on the virtual keyboard. The effect varies by device and language. Possible values:\n\n* `enter`: Inserts a new line, typically used in a multi-line text field.\n* `done`: Indicates completion and closes the virtual keyboard.\n* `go`: Navigates to the target of the entered text.\n* `next`: Moves to the next text field.\n* `previous`: Moves to the previous text field.\n* `search`: Navigates to search results.\n* `send`: Sends a text message.",
"values": [
{
"name": "enter",
"description": "Inserts a new line, typically used in a multi-line text field."
},
{
"name": "done",
"description": "Indicates input completion, closes the virtual keyboard."
},
{
"name": "go",
"description": "Navigates to the target of the entered text."
},
{
"name": "next",
"description": "Moves to the next text field."
},
{
"name": "previous",
"description": "Moves to the previous text field."
},
{
"name": "search",
"description": "Navigates to search results."
},
{
"name": "send",
"description": "Sends a text message."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-enterkeyhint"
}
]
},
{
"name": "spellcheck",
"description": "Enables spell checking.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-spellcheck"
}
]
},
{
"name": "inputmode",
"description": "Customizes the virtual keyboard. Possible values:\n\n* `none`: No virtual keyboard. Useful for custom input controls.\n* `text`: Standard text input keyboard.\n* `decimal`: Decimal input keyboard. This includes a period `.` or comma `,` and numbers.\n* `numeric`: Numeric keyboard. This displays numbers 0–9.\n* `tel`: Phone number keyboard. This includes numbers 0–9, asterisk `*`, and hash `#` keys.\n* `search`: Search-optimized virtual keyboard. 'Search' appears on the submit button.\n* `email`: Email-optimized virtual keyboard. This typically includes `@` and `.`.\n* `url`: URL-optimized virtual keyboard. This typically includes `.`, `/`, and `#`.",
"values": [
{
"name": "none",
"description": "No virtual keyboard. This is useful for custom input controls."
},
{
"name": "text",
"description": "Standard text input keyboard."
},
{
"name": "decimal",
"description": "Decimal input keyboard. This includes a period `.` or comma `,` and numbers."
},
{
"name": "numeric",
"description": "Numeric keyboard. This displays numbers 0–9."
},
{
"name": "tel",
"description": "Phone number keyboard. This includes numbers 0–9, asterisk `*`, and hash `#` keys."
},
{
"name": "search",
"description": "Search-optimized virtual keyboard. 'Search' appears on the submit button."
},
{
"name": "email",
"description": "Email-optimized virtual keyboard. This typically includes `@` and `.`."
},
{
"name": "url",
"description": "URL-optimized virtual keyboard. This typically includes `.`, `/`, and `#`."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-inputmode"
}
]
},
{
"name": "autofocus",
"description": "Whether the element is focused when the page loads.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-autofocus"
}
]
},
{
"name": "tabindex",
"description": "The element's tab order when navigating with the Tab key.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field#attributes-tabindex"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/text-field"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/text-field/index.ts"
}
]
},
{
"name": "mdui-tooltip",
"description": "Tooltip Component \n\n```html\n<mdui-tooltip content=\"tooltip content\">\n <mdui-button>button</mdui-button>\n</mdui-tooltip>\n```",
"attributes": [
{
"name": "variant",
"description": "Defines the tooltip variant. Default is `plain`. Possible values:\n\n* `plain`: For simple, single-line text.\n* `rich`: For tooltips with a title, body text, and action buttons.",
"values": [
{
"name": "plain",
"description": "For simple, single-line text."
},
{
"name": "rich",
"description": "For tooltips with a title, body text, and action buttons."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tooltip#attributes-variant"
}
]
},
{
"name": "placement",
"description": "Sets the tooltip position. Default is `auto`. Possible values:\n\n* `auto`: Automatically determined. For `variant=\"plain\"`, prefers `top`; for `variant=\"rich\"`, prefers `bottom-right`.\n* `top-left`: Top left.\n* `top-start`: Top start.\n* `top`: Top center.\n* `top-end`: Top end.\n* `top-right`: Top right.\n* `bottom-left`: Bottom left.\n* `bottom-start`: Bottom start.\n* `bottom`: Bottom center.\n* `bottom-end`: Bottom end.\n* `bottom-right`: Bottom right.\n* `left-start`: Left start.\n* `left`: Left center.\n* `left-end`: Left end.\n* `right-start`: Right start.\n* `right`: Right center.\n* `right-end`: Right end.",
"values": [
{
"name": "auto",
"description": "Position is determined automatically."
},
{
"name": "top-left",
"description": "Top left."
},
{
"name": "top-start",
"description": "Top start."
},
{
"name": "top",
"description": "Top center."
},
{
"name": "top-end",
"description": "Top end."
},
{
"name": "top-right",
"description": "Top right."
},
{
"name": "bottom-left",
"description": "Bottom left."
},
{
"name": "bottom-start",
"description": "Bottom start."
},
{
"name": "bottom",
"description": "Bottom center."
},
{
"name": "bottom-end",
"description": "Bottom end."
},
{
"name": "bottom-right",
"description": "Bottom right."
},
{
"name": "left-start",
"description": "Left start."
},
{
"name": "left",
"description": "Left center."
},
{
"name": "left-end",
"description": "Left end."
},
{
"name": "right-start",
"description": "Right start."
},
{
"name": "right",
"description": "Right center."
},
{
"name": "right-end",
"description": "Right end."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tooltip#attributes-placement"
}
]
},
{
"name": "open-delay",
"description": "The delay (in milliseconds) before the tooltip appears on hover.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tooltip#attributes-open-delay"
}
]
},
{
"name": "close-delay",
"description": "The delay (in milliseconds) before the tooltip disappears on hover.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tooltip#attributes-close-delay"
}
]
},
{
"name": "headline",
"description": "Sets the tooltip title. Only applies when `variant=\"rich\"`. Alternatively, use `slot=\"headline\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tooltip#attributes-headline"
}
]
},
{
"name": "content",
"description": "Sets the tooltip content. Alternatively, use `slot=\"content\"`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tooltip#attributes-content"
}
]
},
{
"name": "trigger",
"description": "Defines how the tooltip opens. Multiple space-separated values are supported. Possible values:\n\n* `click`: Triggers on click.\n* `hover`: Triggers on mouse hover.\n* `focus`: Triggers on focus.\n* `manual`: Can only be opened and closed programmatically; no other trigger methods can be specified.",
"values": [
{
"name": "click",
"description": "Triggers on click."
},
{
"name": "hover",
"description": "Triggers on mouse hover."
},
{
"name": "focus",
"description": "Triggers on focus."
},
{
"name": "manual",
"description": "Can only be opened and closed programmatically; no other trigger methods can be specified."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tooltip#attributes-trigger"
}
]
},
{
"name": "disabled",
"description": "Disables the tooltip.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tooltip#attributes-disabled"
}
]
},
{
"name": "open",
"description": "Opens the tooltip.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tooltip#attributes-open"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/tooltip"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/tooltip/index.ts"
}
]
},
{
"name": "mdui-top-app-bar-title",
"description": "Top App Bar Title Component Use with the `<mdui-top-app-bar>` component \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```",
"attributes": [],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/top-app-bar"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/top-app-bar/top-app-bar-title.ts"
}
]
},
{
"name": "mdui-top-app-bar",
"description": "Top App Bar Component \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```",
"attributes": [
{
"name": "variant",
"description": "Defines the top app bar variant. Default is `small`. Possible values:\n\n* `center-aligned`: A small app bar with a centered title.\n* `small`: Small app bar.\n* `medium`: Medium-sized app bar.\n* `large`: Large-sized app bar.",
"values": [
{
"name": "center-aligned",
"description": "Small app bar with a centered title."
},
{
"name": "small",
"description": "Small app bar."
},
{
"name": "medium",
"description": "Medium-sized app bar."
},
{
"name": "large",
"description": "Large-sized app bar."
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/top-app-bar#top-app-bar-attributes-variant"
}
]
},
{
"name": "hide",
"description": "Whether the top app bar is hidden.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/top-app-bar#top-app-bar-attributes-hide"
}
]
},
{
"name": "shrink",
"description": "Shrinks the app bar to the `small` variant. Only applies to `medium` or `large` variants.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/top-app-bar#top-app-bar-attributes-shrink"
}
]
},
{
"name": "scroll-behavior",
"description": "Defines the scroll behavior. Multiple space-separated values are accepted. Possible values:\n\n* `hide`: Hides when scrolling.\n* `shrink`: Shrinks when scrolling (for medium to large app bars).\n* `elevate`: Increases elevation when scrolling.",
"values": [
{
"name": "hide"
},
{
"name": "shrink"
},
{
"name": "elevate"
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/top-app-bar#top-app-bar-attributes-scroll-behavior"
}
]
},
{
"name": "scroll-target",
"description": "The element to watch for scroll events. Accepts a CSS selector, a DOM element, or a [JQ object](/en/docs/2/functions/jq). Defaults to `window`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/top-app-bar#top-app-bar-attributes-scroll-target"
}
]
},
{
"name": "scroll-threshold",
"description": "The scroll distance (in pixels) required to trigger the scroll behavior.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/top-app-bar#top-app-bar-attributes-scroll-threshold"
}
]
},
{
"name": "order",
"description": "Specifies the layout order within the [`<mdui-layout>`](/en/docs/2/components/layout) component. Items are sorted in ascending order. The default value is `0`.",
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/top-app-bar#top-app-bar-attributes-order"
}
]
}
],
"references": [
{
"name": "Docs",
"url": "https://www.mdui.org/en/docs/2/components/top-app-bar"
},
{
"name": "Github",
"url": "https://github.com/zdhxiong/mdui/blob/v2/packages/mdui/src/components/top-app-bar/top-app-bar.ts"
}
]
}
]
}