quasar
Version:
Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
1,260 lines • 839 kB
JSON
{
"$schema": "",
"framework": "vue",
"name": "quasar",
"version": "1.15.5",
"contributions": {
"html": {
"types-syntax": "typescript",
"tags": [
{
"name": "QAjaxBar",
"source": {
"module": "quasar",
"symbol": "QAjaxBar"
},
"attributes": [
{
"name": "position",
"value": {
"kind": "expression",
"type": "'top'|'right'|'bottom'|'left'"
},
"description": "Position within window of where QAjaxBar should be displayed\n\nExamples:\nbottom",
"doc-url": "https://v1.quasar.dev/vue-components/ajax-bar",
"default": "\"top\""
},
{
"name": "size",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Size in CSS units, including unit name\n\nExamples:\n16px\n2rem",
"doc-url": "https://v1.quasar.dev/vue-components/ajax-bar",
"default": "\"2px\""
},
{
"name": "color",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Color name for component from the Quasar Color Palette\n\nExamples:\nprimary\nteal-10",
"doc-url": "https://v1.quasar.dev/vue-components/ajax-bar"
},
{
"name": "skip-hijack",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Skip Ajax hijacking (not a reactive prop)",
"doc-url": "https://v1.quasar.dev/vue-components/ajax-bar",
"type": "boolean"
},
{
"name": "reverse",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Reverse direction of progress",
"doc-url": "https://v1.quasar.dev/vue-components/ajax-bar",
"type": "boolean"
}
],
"events": [
{
"name": "start",
"description": "Emitted when bar is triggered to appear",
"doc-url": "https://v1.quasar.dev/vue-components/ajax-bar"
},
{
"name": "stop",
"description": "Emitted when bar has finished its job",
"doc-url": "https://v1.quasar.dev/vue-components/ajax-bar"
}
],
"slots": [],
"description": "QAjaxBar - Quasar component",
"doc-url": "https://v1.quasar.dev/vue-components/ajax-bar"
},
{
"name": "QAvatar",
"source": {
"module": "quasar",
"symbol": "QAvatar"
},
"attributes": [
{
"name": "size",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Size in CSS units, including unit name or standard size name (xs|sm|md|lg|xl)\n\nExamples:\n16px\n2rem\nxs\nmd",
"doc-url": "https://v1.quasar.dev/vue-components/avatar"
},
{
"name": "font-size",
"value": {
"kind": "expression",
"type": "string"
},
"description": "The size in CSS units, including unit name, of the content (icon, text)\n\nExamples:\n18px\n2rem",
"doc-url": "https://v1.quasar.dev/vue-components/avatar"
},
{
"name": "color",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Color name for component from the Quasar Color Palette\n\nExamples:\nprimary\nteal-10",
"doc-url": "https://v1.quasar.dev/vue-components/avatar"
},
{
"name": "text-color",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Overrides text color (if needed); Color name from the Quasar Color Palette\n\nExamples:\nprimary\nteal-10",
"doc-url": "https://v1.quasar.dev/vue-components/avatar"
},
{
"name": "icon",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Icon name following Quasar convention; Make sure you have the icon library installed unless you are using 'img:' prefix\n\nExamples:\nmap\nion-add\nimg:https://cdn.quasar.dev/logo/svg/quasar-logo.svg\nimg:statics/path/to/some_image.png",
"doc-url": "https://v1.quasar.dev/vue-components/avatar"
},
{
"name": "square",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Removes border-radius so borders are squared",
"doc-url": "https://v1.quasar.dev/vue-components/avatar",
"type": "boolean"
},
{
"name": "rounded",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Applies a small standard border-radius for a squared shape of the component",
"doc-url": "https://v1.quasar.dev/vue-components/avatar",
"type": "boolean"
}
],
"slots": [
{
"name": "default",
"description": "Optional; Suggestions: one character string, <img> tag",
"doc-url": "https://v1.quasar.dev/vue-components/avatar"
}
],
"description": "QAvatar - Quasar component",
"doc-url": "https://v1.quasar.dev/vue-components/avatar"
},
{
"name": "QBadge",
"source": {
"module": "quasar",
"symbol": "QBadge"
},
"attributes": [
{
"name": "color",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Color name for component from the Quasar Color Palette\n\nExamples:\nprimary\nteal-10",
"doc-url": "https://v1.quasar.dev/vue-components/badge"
},
{
"name": "text-color",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Overrides text color (if needed); Color name from the Quasar Color Palette\n\nExamples:\nprimary\nteal-10",
"doc-url": "https://v1.quasar.dev/vue-components/badge"
},
{
"name": "floating",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Tell QBadge if it should float to the top right side of the relative positioned parent element or not",
"doc-url": "https://v1.quasar.dev/vue-components/badge",
"type": "boolean"
},
{
"name": "transparent",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Applies a 0.8 opacity; Useful especially for floating QBadge",
"doc-url": "https://v1.quasar.dev/vue-components/badge",
"type": "boolean"
},
{
"name": "multi-line",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Content can wrap to multiple lines",
"doc-url": "https://v1.quasar.dev/vue-components/badge",
"type": "boolean"
},
{
"name": "label",
"value": {
"kind": "expression",
"type": "string|number"
},
"description": "Badge's content as string; overrides default slot if specified\n\nExamples:\nJohn Doe\n22",
"doc-url": "https://v1.quasar.dev/vue-components/badge"
},
{
"name": "align",
"value": {
"kind": "expression",
"type": "'top'|'middle'|'bottom'"
},
"description": "Sets vertical-align CSS prop",
"doc-url": "https://v1.quasar.dev/vue-components/badge"
},
{
"name": "outline",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Use 'outline' design (colored text and borders only)",
"doc-url": "https://v1.quasar.dev/vue-components/badge",
"type": "boolean"
},
{
"name": "rounded",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Makes a rounded shaped badge",
"doc-url": "https://v1.quasar.dev/vue-components/badge",
"type": "boolean"
}
],
"slots": [
{
"name": "default",
"description": "This is where QBadge content goes, if not using 'label' property",
"doc-url": "https://v1.quasar.dev/vue-components/badge"
}
],
"description": "QBadge - Quasar component",
"doc-url": "https://v1.quasar.dev/vue-components/badge"
},
{
"name": "QBanner",
"source": {
"module": "quasar",
"symbol": "QBanner"
},
"attributes": [
{
"name": "inline-actions",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Display actions on same row as content",
"doc-url": "https://v1.quasar.dev/vue-components/banner",
"type": "boolean"
},
{
"name": "dense",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Dense mode; occupies less space",
"doc-url": "https://v1.quasar.dev/vue-components/banner",
"type": "boolean"
},
{
"name": "rounded",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Applies a small standard border-radius for a squared shape of the component",
"doc-url": "https://v1.quasar.dev/vue-components/banner",
"type": "boolean"
},
{
"name": "dark",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Notify the component that the background is a dark color",
"doc-url": "https://v1.quasar.dev/vue-components/banner",
"type": "boolean"
}
],
"slots": [
{
"name": "default",
"description": "This is where Banner content goes",
"doc-url": "https://v1.quasar.dev/vue-components/banner"
},
{
"name": "avatar",
"description": "Slot for displaying an avatar (suggestions: QIcon, QAvatar)",
"doc-url": "https://v1.quasar.dev/vue-components/banner"
},
{
"name": "action",
"description": "Slot for Banner action (suggestions: QBtn)",
"doc-url": "https://v1.quasar.dev/vue-components/banner"
}
],
"description": "QBanner - Quasar component",
"doc-url": "https://v1.quasar.dev/vue-components/banner"
},
{
"name": "QBar",
"source": {
"module": "quasar",
"symbol": "QBar"
},
"attributes": [
{
"name": "dense",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Dense mode; occupies less space",
"doc-url": "https://v1.quasar.dev/vue-components/bar",
"type": "boolean"
},
{
"name": "dark",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "The component background color lights up the parent's background (as opposed to default behavior which is to darken it); Works unless you specify a CSS background color for it",
"doc-url": "https://v1.quasar.dev/vue-components/bar",
"type": "boolean"
}
],
"slots": [
{
"name": "default",
"description": "Default slot in the devland unslotted content of the component",
"doc-url": "https://v1.quasar.dev/vue-components/bar"
}
],
"description": "QBar - Quasar component",
"doc-url": "https://v1.quasar.dev/vue-components/bar"
},
{
"name": "QBreadcrumbs",
"source": {
"module": "quasar",
"symbol": "QBreadcrumbs"
},
"attributes": [
{
"name": "separator",
"value": {
"kind": "expression",
"type": "string"
},
"description": "The string used to separate the breadcrumbs\n\nExamples:\n-\n|\n>",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs",
"default": "\"/\""
},
{
"name": "active-color",
"value": {
"kind": "expression",
"type": "string"
},
"description": "The color of the active breadcrumb, which can be any color from the Quasar Color Palette\n\nExamples:\nprimary\nteal-10",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs",
"default": "\"primary\""
},
{
"name": "gutter",
"value": {
"kind": "expression",
"type": "'none'|'xs'|'sm'|'md'|'lg'|'xl'"
},
"description": "The gutter value allows you control over the space between the breadcrumb elements.\n\nExamples:\nmd\nlg",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs",
"default": "\"sm\""
},
{
"name": "separator-color",
"value": {
"kind": "expression",
"type": "string"
},
"description": "The color used to color the separator, which can be any color from the Quasar Color Palette\n\nExamples:\nprimary\nteal-10",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs"
},
{
"name": "align",
"value": {
"kind": "expression",
"type": "'left'|'center'|'right'|'between'|'around'|'evenly'"
},
"description": "Specify how to align the breadcrumbs horizontally\n\nExamples:\nleft\ncenter",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs",
"default": "\"left\""
}
],
"slots": [
{
"name": "default",
"description": "Default slot in the devland unslotted content of the component",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs"
},
{
"name": "separator",
"vue-properties": [],
"description": "HTML or component you can slot in to separate the breadcrumbs",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs"
}
],
"description": "QBreadcrumbs - Quasar component",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs"
},
{
"name": "QBreadcrumbsEl",
"source": {
"module": "quasar",
"symbol": "QBreadcrumbsEl"
},
"attributes": [
{
"name": "to",
"value": {
"kind": "expression",
"type": "string|object"
},
"description": "Equivalent to Vue Router <router-link> 'to' property\n\nExamples:\n/home/dashboard\n:to=\"{ name: 'my-route-name' }\"",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs"
},
{
"name": "exact",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Equivalent to Vue Router <router-link> 'exact' property",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs",
"type": "boolean"
},
{
"name": "append",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Equivalent to Vue Router <router-link> 'append' property",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs",
"type": "boolean"
},
{
"name": "replace",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Equivalent to Vue Router <router-link> 'replace' property",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs",
"type": "boolean"
},
{
"name": "active-class",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Equivalent to Vue Router <router-link> 'active-class' property\n\nExamples:\nmy-active-class",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs"
},
{
"name": "exact-active-class",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Equivalent to Vue Router <router-link> 'active-class' property\n\nExamples:\nmy-exact-active-class",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs"
},
{
"name": "disable",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Put component in disabled mode",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs",
"type": "boolean"
},
{
"name": "label",
"value": {
"kind": "expression",
"type": "string"
},
"description": "The label text for the breadcrumb\n\nExamples:\nHome\nIndex",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs"
},
{
"name": "icon",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Icon name following Quasar convention; Make sure you have the icon library installed unless you are using 'img:' prefix\n\nExamples:\nmap\nion-add\nimg:https://cdn.quasar.dev/logo/svg/quasar-logo.svg\nimg:statics/path/to/some_image.png",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs"
}
],
"slots": [
{
"name": "default",
"description": "This is where custom content goes, unless 'icon' and 'label' props are not enough",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs"
}
],
"description": "QBreadcrumbsEl - Quasar component",
"doc-url": "https://v1.quasar.dev/vue-components/breadcrumbs"
},
{
"name": "QBtnDropdown",
"source": {
"module": "quasar",
"symbol": "QBtnDropdown"
},
"attributes": [
{
"name": "value",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Controls Menu show/hidden state; Either use this property (along with a listener for 'input' event) OR use v-model directive\n\nExamples:\nv-model=\"menuState\"",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "size",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Size in CSS units, including unit name or standard size name (xs|sm|md|lg|xl)\n\nExamples:\n16px\n2rem\nxs\nmd",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "ripple",
"value": {
"kind": "expression",
"type": "boolean|object"
},
"description": "Configure material ripple (disable it by setting it to 'false' or supply a config object)\n\nExamples:\nfalse\n{ early: true, center: true, color: 'teal', keyCodes: [] }",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"default": "true"
},
{
"name": "type",
"value": {
"kind": "expression",
"type": "'a'|'submit'|'button'|'reset'"
},
"description": "Define the button HTML DOM type\n\nExamples:\ntype=\"a\" href=\"http://some-site.net\" target=\"__blank\"",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"default": "\"button\""
},
{
"name": "to",
"value": {
"kind": "expression",
"type": "string|object"
},
"description": "Equivalent to Vue Router <router-link> 'to' property\n\nExamples:\n/home/dashboard\n:to=\"{ name: 'my-route-name' }\"",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "replace",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Equivalent to Vue Router <router-link> 'replace' property",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "append",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Equivalent to Vue Router <router-link> 'append' property",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "label",
"value": {
"kind": "expression",
"type": "string|number"
},
"description": "The text that will be shown on the button\n\nExamples:\nButton Label",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "icon",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Icon name following Quasar convention; Make sure you have the icon library installed unless you are using 'img:' prefix\n\nExamples:\nmap\nion-add\nimg:https://cdn.quasar.dev/logo/svg/quasar-logo.svg\nimg:statics/path/to/some_image.png",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "icon-right",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Icon name following Quasar convention; Make sure you have the icon library installed unless you are using 'img:' prefix\n\nExamples:\nmap\nion-add\nimg:https://cdn.quasar.dev/logo/svg/quasar-logo.svg\nimg:statics/path/to/some_image.png",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "outline",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Use 'outline' design",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "flat",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Use 'flat' design",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "unelevated",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Remove shadow",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "rounded",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Applies a more prominent border-radius for a squared shape button",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "push",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Use 'push' design",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "glossy",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Applies a glossy effect",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "fab",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Makes button size and shape to fit a Floating Action Button",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "fab-mini",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Makes button size and shape to fit a small Floating Action Button",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "padding",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Apply custom padding (vertical [horizontal]); Size in CSS units, including unit name or standard size name (none|xs|sm|md|lg|xl); Also removes the min width and height when set\n\nExamples:\n16px\n10px 5px\n2rem\nxs\nmd lg\n2px 2px 5px 7px",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "color",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Color name for component from the Quasar Color Palette\n\nExamples:\nprimary\nteal-10",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "text-color",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Overrides text color (if needed); Color name from the Quasar Color Palette\n\nExamples:\nprimary\nteal-10",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "no-caps",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Avoid turning label text into caps (which happens by default)",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "no-wrap",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Avoid label text wrapping",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "dense",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Dense mode; occupies less space",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "tabindex",
"value": {
"kind": "expression",
"type": "number|string"
},
"description": "Tabindex HTML attribute value\n\nExamples:\n0\n100",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "align",
"value": {
"kind": "expression",
"type": "'left'|'right'|'center'|'around'|'between'|'evenly'"
},
"description": "Label or content alignment",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"default": "\"center\""
},
{
"name": "stack",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Stack icon and label vertically instead of on same line (like it is by default)",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "stretch",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "When used on flexbox parent, button will stretch to parent's height",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "loading",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Put button into loading state (displays a QSpinner -- can be overridden by using a 'loading' slot)",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "disable",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Put component in disabled mode",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "split",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Split dropdown icon into its own button",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "dropdown-icon",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Icon name following Quasar convention; Make sure you have the icon library installed unless you are using 'img:' prefix\n\nExamples:\nmap\nion-add\nimg:https://cdn.quasar.dev/logo/svg/quasar-logo.svg\nimg:statics/path/to/some_image.png",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "disable-main-btn",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Disable main button (useful along with 'split' prop)",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "disable-dropdown",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Disables dropdown (dropdown button if using along 'split' prop)",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "no-icon-animation",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Disables the rotation of the dropdown icon when state is toggled",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "content-style",
"value": {
"kind": "expression",
"type": "any[]|string|object"
},
"description": "Style definitions to be attributed to the menu\n\nExamples:\nbackground-color: #ff0000\n:content-style=\"{ backgroundColor: '#ff0000' }\"",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "content-class",
"value": {
"kind": "expression",
"type": "any[]|string|object"
},
"description": "Class definitions to be attributed to the menu\n\nExamples:\nmy-special-class\n:content-class=\"{ 'my-special-class': <condition> }\"",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "cover",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Allows the menu to cover the button. When used, the 'menu-self' and 'menu-fit' props are no longer effective",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "persistent",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Allows the menu to not be dismissed by a click/tap outside of the menu or by hitting the ESC key",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "no-route-dismiss",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Changing route app won't dismiss the popup; No need to set it if 'persistent' prop is also set",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "auto-close",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Allows any click/tap in the menu to close it; Useful instead of attaching events to each menu item that should close the menu on click/tap",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"type": "boolean"
},
{
"name": "menu-anchor",
"value": {
"kind": "expression",
"type": "'top left'|'top middle'|'top right'|'top start'|'top end'|'center left'|'center middle'|'center right'|'center start'|'center end'|'bottom left'|'bottom middle'|'bottom right'|'bottom start'|'bottom end'"
},
"description": "Two values setting the starting position or anchor point of the menu relative to its target\n\nExamples:\ntop right\nbottom end",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"default": "\"bottom end\""
},
{
"name": "menu-self",
"value": {
"kind": "expression",
"type": "'top left'|'top middle'|'top right'|'top start'|'top end'|'center left'|'center middle'|'center right'|'center start'|'center end'|'bottom left'|'bottom middle'|'bottom right'|'bottom start'|'bottom end'"
},
"description": "Two values setting the menu's own position relative to its target\n\nExamples:\ntop right\nbottom end",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"default": "\"top end\""
},
{
"name": "menu-offset",
"value": {
"kind": "expression",
"type": "any[]"
},
"description": "An array of two numbers to offset the menu horizontally and vertically in pixels\n\nExamples:\n[8, 8]\n[5, 10]",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
}
],
"events": [
{
"name": "input",
"arguments": [
{
"name": "value",
"type": "boolean",
"description": "New state (showing/hidden)",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
}
],
"description": "Emitted when showing/hidden state changes; Is also used by v-model",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "show",
"arguments": [
{
"name": "evt",
"type": "object",
"description": "JS event object",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
}
],
"description": "Emitted after component has triggered show()",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "before-show",
"arguments": [
{
"name": "evt",
"type": "object",
"description": "JS event object",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
}
],
"description": "Emitted when component triggers show() but before it finishes doing it",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "hide",
"arguments": [
{
"name": "evt",
"type": "object",
"description": "JS event object",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
}
],
"description": "Emitted after component has triggered hide()",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "before-hide",
"arguments": [
{
"name": "evt",
"type": "object",
"description": "JS event object",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
}
],
"description": "Emitted when component triggers hide() but before it finishes doing it",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "click",
"arguments": [
{
"name": "evt",
"type": "object",
"description": "JS event object",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
}
],
"description": "Emitted when user clicks/taps on the main button (not the icon one, if using 'split')",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
}
],
"slots": [
{
"name": "default",
"description": "Default slot in the devland unslotted content of the component",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
},
{
"name": "label",
"description": "Customize main button's content through this slot, unless you're using the 'icon' and 'label' props",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown"
}
],
"description": "QBtnDropdown - Quasar component",
"doc-url": "https://v1.quasar.dev/vue-components/button-dropdown",
"vue-model": {
"prop": "value",
"event": "input"
}
},
{
"name": "QBtnGroup",
"source": {
"module": "quasar",
"symbol": "QBtnGroup"
},
"attributes": [
{
"name": "spread",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Spread horizontally to all available space",
"doc-url": "https://v1.quasar.dev/vue-components/button-group",
"type": "boolean"
},
{
"name": "outline",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Use 'outline' design for buttons",
"doc-url": "https://v1.quasar.dev/vue-components/button-group",
"type": "boolean"
},
{
"name": "flat",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Use 'flat' design for buttons",
"doc-url": "https://v1.quasar.dev/vue-components/button-group",
"type": "boolean"
},
{
"name": "unelevated",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Remove shadow on buttons",
"doc-url": "https://v1.quasar.dev/vue-components/button-group",
"type": "boolean"
},
{
"name": "rounded",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Applies a more prominent border-radius for squared shape buttons",
"doc-url": "https://v1.quasar.dev/vue-components/button-group",
"type": "boolean"
},
{
"name": "push",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Use 'push' design for buttons",
"doc-url": "https://v1.quasar.dev/vue-components/button-group",
"type": "boolean"
},
{
"name": "stretch",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "When used on flexbox parent, buttons will stretch to parent's height",
"doc-url": "https://v1.quasar.dev/vue-components/button-group",
"type": "boolean"
},
{
"name": "glossy",
"value": {
"kind": "expression",
"type": "boolean"
},
"description": "Applies a glossy effect",
"doc-url": "https://v1.quasar.dev/vue-components/button-group",
"type": "boolean"
}
],
"slots": [
{
"name": "default",
"description": "Suggestion: QBtn",
"doc-url": "https://v1.quasar.dev/vue-components/button-group"
}
],
"description": "QBtnGroup - Quasar component",
"doc-url": "https://v1.quasar.dev/vue-components/button-group"
},
{
"name": "QBtnToggle",
"source": {
"module": "quasar",
"symbol": "QBtnToggle"
},
"attributes": [
{
"name": "name",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Used to specify the name of the control; Useful if dealing with forms submitted directly to a URL\n\nExamples:\ncar_id",
"doc-url": "https://v1.quasar.dev/vue-components/button-toggle"
},
{
"name": "ripple",
"value": {
"kind": "expression",
"type": "boolean|object"
},
"description": "Configure material ripple (disable it by setting it to 'false' or supply a config object)\n\nExamples:\nfalse\n{ early: true, center: true, color: 'teal', keyCodes: [] }",
"doc-url": "https://v1.quasar.dev/vue-components/button-toggle",
"default": "true"
},
{
"name": "value",
"value": {
"kind": "expression",
"type": "any"
},
"description": "Model of the component; Either use this property (along with a listener for 'input' event) OR use v-model directive\n\nExamples:\nv-model=\"selected\"",
"doc-url": "https://v1.quasar.dev/vue-components/button-toggle"
},
{
"name": "options",
"value": {
"kind": "expression",
"type": "any[]"
},
"description": "Array of Objects defining each option\n\nExamples:\n[ {label: 'One', value: 'one'}, {label: 'Two', value: 'two'} ]",
"doc-url": "https://v1.quasar.dev/vue-components/button-toggle",
"required": true
},
{
"name": "color",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Color name for component from the Quasar Color Palette\n\nExamples:\nprimary\nteal-10",
"doc-url": "https://v1.quasar.dev/vue-components/button-toggle"
},
{
"name": "text-color",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Overrides text color (if needed); Color name from the Quasar Color Palette\n\nExamples:\nprimary\nteal-10",
"doc-url": "https://v1.quasar.dev/vue-components/button-toggle"
},
{
"name": "toggle-color",
"value": {
"kind": "expression",
"type": "string"
},
"description": "Color name for component from the Quasar Color Palette\n\nExamples:\nprimary\nteal-10",
"doc-url": "https://v1.quasar.dev/vue-components/button-toggle",
"default": "\"primary\""
},
{
"name": "toggle-text-color",
"value": {
"kind": "expression",