vuetify
Version:
Vue Material Component Framework
1,244 lines • 2.18 MB
JSON
{
"$schema": "http://json.schemastore.org/web-types",
"framework": "vue",
"name": "vuetify",
"version": "3.8.10",
"contributions": {
"html": {
"types-syntax": "typescript",
"description-markup": "markdown",
"tags": [
{
"name": "VAlert",
"source": {
"module": "./src/components/index.ts",
"symbol": "VAlert"
},
"description": "",
"doc-url": "https://vuetifyjs.com/api/v-alert",
"attributes": [
{
"name": "title",
"description": "Specify a title text for the component.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "text",
"description": "Specify content text for the component.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "border",
"description": "Adds a colored border to the component.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean | 'top' | 'end' | 'bottom' | 'start'"
}
},
{
"name": "borderColor",
"description": "Specifies the color of the border. Only used in combination with **border** prop. Accepts any color value.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "closable",
"description": "Adds a close icon that can hide the alert.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "closeIcon",
"description": "Change the default icon used for **closable** alerts.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"default": "'$close'",
"value": {
"kind": "expression",
"type": "| string\n | (string | [string, number])[]\n | (new () => any)\n | FunctionalComponent"
}
},
{
"name": "type",
"description": "Create a specialized alert that uses a contextual color and has a pre-defined icon.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"value": {
"kind": "expression",
"type": "'success' | 'info' | 'warning' | 'error'"
}
},
{
"name": "closeLabel",
"description": "Text used for *aria-label* on **closable** alerts. Can also be customized globally in [Internationalization](/customization/internationalization).",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"default": "'$vuetify.close'",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "icon",
"description": "Apply a specific icon using the [v-icon](/components/icons/) component.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"default": "null",
"value": {
"kind": "expression",
"type": "| false\n | string\n | (string | [string, number])[]\n | (new () => any)\n | FunctionalComponent"
}
},
{
"name": "modelValue",
"description": "Controls whether the component is visible or hidden.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"default": "true",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "prominent",
"description": "Displays a larger vertically centered icon to draw more attention.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "density",
"description": "Adjusts the vertical height used by the component.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"default": "'default'",
"value": {
"kind": "expression",
"type": "'default' | 'comfortable' | 'compact'"
}
},
{
"name": "height",
"description": "Sets the height for the component.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "maxHeight",
"description": "Sets the maximum height for the component.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "maxWidth",
"description": "Sets the maximum width for the component.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "minHeight",
"description": "Sets the minimum height for the component.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "minWidth",
"description": "Sets the minimum width for the component.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "width",
"description": "Sets the width for the component.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "elevation",
"description": "Designates an elevation applied to the component between 0 and 24. You can find more information on the [elevation page](/styles/elevation).",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "location",
"description": "Specifies the component's location. Can combine by using a space separated string.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"value": {
"kind": "expression",
"type": "<a href=\"https://github.com/vuetifyjs/vuetify/blob/master/packages/vuetify/src/util/anchor.ts#L8-L14\" target=\"_blank\">Anchor</a>"
}
},
{
"name": "position",
"description": "Sets the position for the component.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"value": {
"kind": "expression",
"type": "'fixed' | 'static' | 'relative' | 'absolute' | 'sticky'"
}
},
{
"name": "rounded",
"description": "Designates the **border-radius** applied to the component. This can be **0**, **xs**, **sm**, true, **lg**, **xl**, **pill**, **circle**, and **shaped**. Find more information on available border radius classes on the [Border Radius page](/styles/border-radius).",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"value": {
"kind": "expression",
"type": "string | number | boolean"
}
},
{
"name": "tile",
"description": "Removes the component's border-radius.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "tag",
"description": "Specify a custom tag used on the root element.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"default": "'div'",
"value": {
"kind": "expression",
"type": "string | (new () => any) | FunctionalComponent"
}
},
{
"name": "theme",
"description": "Specify a theme for this component and all of its children.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "color",
"description": "Applies specified color to the control - supports utility colors (for example `success` or `purple`) or css color (`#033` or `rgba(255, 0, 0, 0.5)`). Find a list of built-in classes on the [colors page](/styles/colors#material-colors).",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "variant",
"description": "Applies a distinct style to the component.",
"doc-url": "https://vuetifyjs.com/api/VAlert#props",
"default": "'flat'",
"value": {
"kind": "expression",
"type": "'text' | 'flat' | 'elevated' | 'tonal' | 'outlined' | 'plain'"
}
}
],
"events": [
{
"name": "click:close",
"description": "Emitted when close icon is clicked.",
"doc-url": "https://vuetifyjs.com/api/v-alert#events",
"arguments": [
{
"name": "argument",
"type": "[MouseEvent]\n"
}
]
},
{
"name": "update:modelValue",
"description": "Event that is emitted when the component's model changes.",
"doc-url": "https://vuetifyjs.com/api/v-alert#events",
"arguments": [
{
"name": "argument",
"type": "[boolean]\n"
}
]
}
],
"slots": [
{
"name": "default",
"description": "The default Vue slot.",
"doc-url": "https://vuetifyjs.com/api/v-alert#slots"
},
{
"name": "prepend",
"description": "Slot for icon at beginning of alert.",
"doc-url": "https://vuetifyjs.com/api/v-alert#slots"
},
{
"name": "title",
"description": "Slot for the component's title content.",
"doc-url": "https://vuetifyjs.com/api/v-alert#slots"
},
{
"name": "text",
"description": "Slot for the component's text content.",
"doc-url": "https://vuetifyjs.com/api/v-alert#slots"
},
{
"name": "append",
"description": "Slot for icon at end of alert.",
"doc-url": "https://vuetifyjs.com/api/v-alert#slots"
},
{
"name": "close",
"description": "Slot for icon used in **dismissible** prop.",
"doc-url": "https://vuetifyjs.com/api/v-alert#slots",
"vue-properties": [
{
"name": "props",
"type": "Record<string, any>"
}
]
}
],
"vue-model": {
"prop": "modelValue",
"event": "update:modelValue"
}
},
{
"name": "VAlertTitle",
"source": {
"module": "./src/components/index.ts",
"symbol": "VAlertTitle"
},
"description": "",
"doc-url": "https://vuetifyjs.com/api/v-alert-title",
"attributes": [
{
"name": "tag",
"description": "Specify a custom tag used on the root element.",
"doc-url": "https://vuetifyjs.com/api/VAlertTitle#props",
"default": "'div'",
"value": {
"kind": "expression",
"type": "string"
}
}
],
"events": [],
"slots": [
{
"name": "default",
"description": "The default Vue slot.",
"doc-url": "https://vuetifyjs.com/api/v-alert-title#slots"
}
],
"vue-model": {
"prop": "modelValue",
"event": "update:modelValue"
}
},
{
"name": "VApp",
"source": {
"module": "./src/components/index.ts",
"symbol": "VApp"
},
"description": "",
"doc-url": "https://vuetifyjs.com/api/v-app",
"attributes": [
{
"name": "fullHeight",
"description": "Sets the component height to 100%.",
"doc-url": "https://vuetifyjs.com/api/VApp#props",
"default": "true",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "overlaps",
"description": "**FOR INTERNAL USE ONLY**",
"doc-url": "https://vuetifyjs.com/api/VApp#props",
"default": "[]",
"value": {
"kind": "expression",
"type": "string[]"
}
},
{
"name": "theme",
"description": "Specify a theme for this component and all of its children.",
"doc-url": "https://vuetifyjs.com/api/VApp#props",
"value": {
"kind": "expression",
"type": "string"
}
}
],
"events": [],
"slots": [
{
"name": "default",
"description": "The default Vue slot.",
"doc-url": "https://vuetifyjs.com/api/v-app#slots"
}
],
"vue-model": {
"prop": "modelValue",
"event": "update:modelValue"
}
},
{
"name": "VAppBar",
"source": {
"module": "./src/components/index.ts",
"symbol": "VAppBar"
},
"description": "",
"doc-url": "https://vuetifyjs.com/api/v-app-bar",
"attributes": [
{
"name": "flat",
"description": "Removes the component's **box-shadow**.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "tag",
"description": "Specify a custom tag used on the root element.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"default": "'header'",
"value": {
"kind": "expression",
"type": "string | (new () => any) | FunctionalComponent"
}
},
{
"name": "name",
"description": "Assign a specific name for layout registration.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "title",
"description": "Specify a title text for the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "height",
"description": "Designates a specific height for the toolbar. Overrides the heights imposed by other props, e.g. **prominent**, **dense**, **extended**, etc.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"default": "64",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "theme",
"description": "Specify a theme for this component and all of its children.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "image",
"description": "Specifies a [v-img](/components/images) as the component's background.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "collapse",
"description": "Morphs the component into a collapsed state, reducing its maximum width.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "modelValue",
"description": "The v-model value of the component. If component supports the **multiple** prop, this defaults to an empty array.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"default": "true",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "location",
"description": "Aligns the component towards the top or bottom.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"default": "'top'",
"value": {
"kind": "expression",
"type": "'top' | 'bottom'"
}
},
{
"name": "absolute",
"description": "Applies position: absolute to the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "color",
"description": "Applies specified color to the control - supports utility colors (for example `success` or `purple`) or css color (`#033` or `rgba(255, 0, 0, 0.5)`). Find a list of built-in classes on the [colors page](/styles/colors#material-colors).",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "density",
"description": "Adjusts the vertical height used by the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"default": "'default'",
"value": {
"kind": "expression",
"type": "'default' | 'prominent' | 'comfortable' | 'compact'"
}
},
{
"name": "extended",
"description": "Use this prop to increase the height of the toolbar _without_ using the `extension` slot for adding content. May be used in conjunction with the **extension-height** prop, and any of the other props that affect the height of the toolbar, e.g. **prominent**, **dense**, etc., **WITH THE EXCEPTION** of **height**.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "extensionHeight",
"description": "Designate an explicit height for the `extension` slot.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"default": "48",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "floating",
"description": "Applies **display: inline-flex** to the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "border",
"description": "Applies utility border classes to the component. To use it, you need to omit the `border-` prefix, (for example use `border-sm` as `border=\"sm\"`). Find a list of the built-in border classes on the [borders page](/styles/borders).",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"default": "false",
"value": {
"kind": "expression",
"type": "string | number | boolean"
}
},
{
"name": "elevation",
"description": "Designates an elevation applied to the component between 0 and 24. You can find more information on the [elevation page](/styles/elevation).",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "rounded",
"description": "Designates the **border-radius** applied to the component. This can be **0**, **xs**, **sm**, true, **lg**, **xl**, **pill**, **circle**, and **shaped**. Find more information on available border radius classes on the [Border Radius page](/styles/border-radius).",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"value": {
"kind": "expression",
"type": "string | number | boolean"
}
},
{
"name": "tile",
"description": "Removes any applied **border-radius** from the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "order",
"description": "Adjust the order of the component in relation to its registration order.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"default": "0",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "scrollTarget",
"description": "The element to target for scrolling events. Uses `window` by default.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "scrollThreshold",
"description": "The amount of scroll distance down before **scroll-behavior** activates.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"default": "300",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "scrollBehavior",
"description": "Specify an action to take when the scroll position of **scroll-target** reaches **scroll-threshold**. Accepts any combination of hide, inverted, collapse, elevate, and fade-image. Multiple values can be used, separated by a space.",
"doc-url": "https://vuetifyjs.com/api/VAppBar#props",
"value": {
"kind": "expression",
"type": "| (string & {})\n | 'hide'\n | 'fully-hide'\n | 'inverted'\n | 'collapse'\n | 'elevate'\n | 'fade-image'"
}
}
],
"events": [
{
"name": "update:modelValue",
"description": "Event that is emitted when the component's model changes.",
"doc-url": "https://vuetifyjs.com/api/v-app-bar#events",
"arguments": [
{
"name": "argument",
"type": "[boolean]\n"
}
]
}
],
"slots": [
{
"name": "default",
"description": "The default Vue slot.",
"doc-url": "https://vuetifyjs.com/api/v-app-bar#slots"
},
{
"name": "image",
"description": "Expects the [`v-img`](/components/images/) component.",
"doc-url": "https://vuetifyjs.com/api/v-app-bar#slots"
},
{
"name": "prepend",
"description": "Adds an item outside the input and before input content.",
"doc-url": "https://vuetifyjs.com/api/v-app-bar#slots"
},
{
"name": "append",
"description": "Adds an item inside the input and after input content.",
"doc-url": "https://vuetifyjs.com/api/v-app-bar#slots"
},
{
"name": "title",
"description": "Slot for the component's title content.",
"doc-url": "https://vuetifyjs.com/api/v-app-bar#slots"
},
{
"name": "extension",
"description": "Slot positioned directly under the main content of the toolbar. Height of this slot can be set explicitly with the **extension-height** prop.",
"doc-url": "https://vuetifyjs.com/api/v-app-bar#slots"
}
],
"vue-model": {
"prop": "modelValue",
"event": "update:modelValue"
}
},
{
"name": "VAppBarNavIcon",
"source": {
"module": "./src/components/index.ts",
"symbol": "VAppBarNavIcon"
},
"description": "",
"doc-url": "https://vuetifyjs.com/api/v-app-bar-nav-icon",
"attributes": [
{
"name": "symbol",
"description": "The [Symbol](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Symbol) used to hook into group functionality for components like [v-btn-toggle](/components/btn-toggle) and [v-bottom-navigation](/components/bottom-navigations/).",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "any"
}
},
{
"name": "text",
"description": "Specify content text for the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "string | number | boolean"
}
},
{
"name": "flat",
"description": "Removes the button box shadow. This is different than using the 'flat' variant.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "replace",
"description": "Setting **replace** prop will call `router.replace()` instead of `router.push()` when clicked, so the navigation will not leave a history record. You can find more information about the [replace](https://router.vuejs.org/api/#replace) prop on the vue-router documentation.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "border",
"description": "Applies utility border classes to the component. To use it, you need to omit the `border-` prefix, (for example use `border-sm` as `border=\"sm\"`). Find a list of the built-in border classes on the [borders page](/styles/borders).",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "false",
"value": {
"kind": "expression",
"type": "string | number | boolean"
}
},
{
"name": "icon",
"description": "Apply a specific icon using the [v-icon](/components/icons/) component. The button will become _round_.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "'$menu'",
"value": {
"kind": "expression",
"type": "| boolean\n | string\n | (string | [string, number])[]\n | (new () => any)\n | FunctionalComponent"
}
},
{
"name": "density",
"description": "Adjusts the vertical height used by the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "'default'",
"value": {
"kind": "expression",
"type": "'default' | 'comfortable' | 'compact'"
}
},
{
"name": "height",
"description": "Sets the height for the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "maxHeight",
"description": "Sets the maximum height for the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "maxWidth",
"description": "Sets the maximum width for the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "minHeight",
"description": "Sets the minimum height for the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "minWidth",
"description": "Sets the minimum width for the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "width",
"description": "Sets the width for the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "elevation",
"description": "Designates an elevation applied to the component between 0 and 24. You can find more information on the [elevation page](/styles/elevation).",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "location",
"description": "Specifies the component's location. Can combine by using a space separated string.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "<a href=\"https://github.com/vuetifyjs/vuetify/blob/master/packages/vuetify/src/util/anchor.ts#L8-L14\" target=\"_blank\">Anchor</a>"
}
},
{
"name": "position",
"description": "Sets the position for the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "'fixed' | 'static' | 'relative' | 'absolute' | 'sticky'"
}
},
{
"name": "rounded",
"description": "Designates the **border-radius** applied to the component. This can be **0**, **xs**, **sm**, true, **lg**, **xl**, **pill**, **circle**, and **shaped**. Find more information on available border radius classes on the [Border Radius page](/styles/border-radius).",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "string | number | boolean"
}
},
{
"name": "tile",
"description": "Removes any applied **border-radius** from the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "tag",
"description": "Specify a custom tag used on the root element.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "'button'",
"value": {
"kind": "expression",
"type": "string | (new () => any) | FunctionalComponent"
}
},
{
"name": "theme",
"description": "Specify a theme for this component and all of its children.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "color",
"description": "Applies specified color to the control - supports utility colors (for example `success` or `purple`) or css color (`#033` or `rgba(255, 0, 0, 0.5)`). Find a list of built-in classes on the [colors page](/styles/colors#material-colors).",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "variant",
"description": "Applies a distinct style to the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "'text'",
"value": {
"kind": "expression",
"type": "'text' | 'flat' | 'elevated' | 'tonal' | 'outlined' | 'plain'"
}
},
{
"name": "disabled",
"description": "Removes the ability to click or target the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "size",
"description": "Sets the height and width of the component. Default unit is px. Can also use the following predefined sizes: **x-small**, **small**, **default**, **large**, and **x-large**.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "'default'",
"value": {
"kind": "expression",
"type": "string | number"
}
},
{
"name": "value",
"description": "The value used when the component is selected in a group. If not provided, a unique ID will be used.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "any"
}
},
{
"name": "active",
"description": "Controls the **active** state of the item. This is typically used to highlight the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "activeColor",
"description": "The applied color when the component is in an active state.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "baseColor",
"description": "Sets the color of component when not focused.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "prependIcon",
"description": "Creates a [v-icon](/api/v-icon/) component in the **prepend** slot before default content.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "| string\n | (string | [string, number])[]\n | (new () => any)\n | FunctionalComponent"
}
},
{
"name": "appendIcon",
"description": "Creates a [v-icon](/api/v-icon/) component after default content in the **append** slot.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "| string\n | (string | [string, number])[]\n | (new () => any)\n | FunctionalComponent"
}
},
{
"name": "block",
"description": "Expands the button to 100% of available space.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "readonly",
"description": "Puts the button in a readonly state. Cannot be clicked or navigated to by keyboard.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "slim",
"description": "Reduces padding to 0 8px.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "stacked",
"description": "Displays the button as a flex-column.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "ripple",
"description": "Applies the [v-ripple](/directives/ripple) directive.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "true",
"value": {
"kind": "expression",
"type": "boolean | { class: string }"
}
},
{
"name": "selectedClass",
"description": "Configure the active CSS class applied when an item is selected.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "loading",
"description": "Displays linear progress bar. Can either be a String which specifies which color is applied to the progress bar (any material color or theme color - **primary**, **secondary**, **success**, **info**, **warning**, **error**) or a Boolean which uses the component **color** (set by color prop - if it's supported by the component) or the primary color.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "false",
"value": {
"kind": "expression",
"type": "string | boolean"
}
},
{
"name": "href",
"description": "Designates the component as anchor and applies the **href** attribute.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "exact",
"description": "Exactly match the link. Without this, '/' will match every route. You can find more information about the [**exact** prop](https://router.vuejs.org/api/#exact) on the vue-router documentation.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "to",
"description": "Denotes the target route of the link. You can find more information about the [**to** prop](https://router.vuejs.org/api/#to) on the vue-router documentation.",
"doc-url": "https://vuetifyjs.com/api/VAppBarNavIcon#props",
"value": {
"kind": "expression",
"type": "string | RouteLocationAsRelativeGeneric | RouteLocationAsPathGeneric"
}
}
],
"events": [],
"slots": [
{
"name": "default",
"description": "The default Vue slot.",
"doc-url": "https://vuetifyjs.com/api/v-app-bar-nav-icon#slots"
},
{
"name": "prepend",
"description": "Adds an item outside the input and before input content.",
"doc-url": "https://vuetifyjs.com/api/v-app-bar-nav-icon#slots"
},
{
"name": "append",
"description": "Adds an item inside the input and after input content.",
"doc-url": "https://vuetifyjs.com/api/v-app-bar-nav-icon#slots"
},
{
"name": "loader",
"description": "Slot for custom loader (displayed when [loading](#props-loading) prop is equal to true).",
"doc-url": "https://vuetifyjs.com/api/v-app-bar-nav-icon#slots"
}
],
"vue-model": {
"prop": "modelValue",
"event": "update:modelValue"
}
},
{
"name": "VAppBarTitle",
"source": {
"module": "./src/components/index.ts",
"symbol": "VAppBarTitle"
},
"description": "",
"doc-url": "https://vuetifyjs.com/api/v-app-bar-title",
"attributes": [
{
"name": "tag",
"description": "Specify a custom tag used on the root element.",
"doc-url": "https://vuetifyjs.com/api/VAppBarTitle#props",
"default": "'div'",
"value": {
"kind": "expression",
"type": "string | (new () => any) | FunctionalComponent"
}
},
{
"name": "text",
"description": "Specify content text for the component.",
"doc-url": "https://vuetifyjs.com/api/VAppBarTitle#props",
"value": {
"kind": "expression",
"type": "string"
}
}
],
"events": [],
"slots": [
{
"name": "default",
"description": "The default Vue slot.",
"doc-url": "https://vuetifyjs.com/api/v-app-bar-title#slots"
},
{
"name": "text",
"description": "Slot for the component's text content.",
"doc-url": "https://vuetifyjs.com/api/v-app-bar-title#slots"
}
],
"vue-model": {
"prop": "modelValue",
"event": "update:modelValue"
}
},
{
"name": "VAutocomplete",
"source": {
"module": "./src/components/index.ts",
"symbol": "VAutocomplete"
},
"description": "",
"doc-url": "https://vuetifyjs.com/api/v-autocomplete",
"attributes": [
{
"name": "flat",
"description": "Removes box shadow when using a variant with elevation.",
"doc-url": "https://vuetifyjs.com/api/VAutocomplete#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "search",
"description": "Text input used to filter items.",
"doc-url": "https://vuetifyjs.com/api/VAutocomplete#props",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "type",
"description": "Sets input type.",
"doc-url": "https://vuetifyjs.com/api/VAutocomplete#props",
"default": "'text'",
"value": {
"kind": "expression",
"type": "string"
}
},
{
"name": "modelValue",
"description": "The v-model value of the component. If component supports the **multiple** prop, this defaults to an empty array.",
"doc-url": "https://vuetifyjs.com/api/VAutocomplete#props",
"default": "null",
"value": {
"kind": "expression",
"type": "any"
}
},
{
"name": "error",
"description": "Puts the input in a manual error state.",
"doc-url": "https://vuetifyjs.com/api/VAutocomplete#props",
"default": "false",
"value": {
"kind": "expression",
"type": "boolean"
}
},
{
"name": "reverse",
"description": "Reverses the orientation.",
"doc-url": "https://vuetifyjs.com/api/VAutocomplete#props",
"default": "false",
"value": {
"kind": "ex