@web-types/vue-router/vue-router.web-types.json

Web-types for vue-router

{
  "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
  "name": "vue-router",
  "version": "3.1.0",
  "framework": "vue",
  "contributions": {
    "html": {
      "description-markup": "markdown",
      "types-syntax": "typescript",
      "tags": [
        {
          "name": "RouterLink",
          "doc-url": "https://router.vuejs.org/api/#to",
          "description": "`<router-link>` is the component for enabling user navigation in a router-enabled app. The target location is specified with the `to` prop. It renders as an `<a>` tag with correct `href` by default, but can be configured with the `tag` prop. In addition, the link automatically gets an active CSS class when the target route is active.",
          "attributes": [
            {
              "name": "to",
              "required": true,
              "doc-url": "https://router.vuejs.org/api/#to",
              "description": "Denotes the target route of the link. When clicked, the value of the `to` prop will be passed to `router.push()` internally, so the value can be either a string or a location descriptor object.",
              "value": {
                "kind": "expression",
                "type": [
                  "string",
                  "object"
                ]
              }
            },
            {
              "name": "tag",
              "value": {
                "kind": "expression",
                "type": "string"
              },
              "default": "'a'",
              "doc-url": "https://router.vuejs.org/api/#tag",
              "description": "Sometimes we want `<router-link>` to render as another tag, e.g `<li>`. Then we can use `tag` prop to specify which tag to render to, and it will still listen to click events for navigation."
            },
            {
              "name": "exact",
              "value": {
                "kind": "expression",
                "type": "boolean"
              },
              "default": "false",
              "doc-url": "https://router.vuejs.org/api/#exact",
              "description": "The default active class matching behavior is **inclusive match**. For example, `<router-link to=\"/a\">` will get this class applied as long as the current path starts with `/a/` or is `/a`.\n\nOne consequence of this is that `<router-link to=\"/\">` will be active for every route! To force the link into \"exact match mode\", use the `exact` prop"
            },
            {
              "name": "append",
              "value": {
                "kind": "expression",
                "type": "boolean"
              },
              "default": "false",
              "doc-url": "https://router.vuejs.org/api/#append",
              "description": "Setting `append` prop always appends the relative path to the current path. "
            },
            {
              "name": "replace",
              "value": {
                "kind": "expression",
                "type": "boolean"
              },
              "default": "false",
              "doc-url": "https://router.vuejs.org/api/#replace",
              "description": "Setting `replace` prop will call `router.replace()` instead of `router.push()` when clicked, so the navigation will not leave a history record."
            },
            {
              "name": "activeClass",
              "value": {
                "kind": "expression",
                "type": "string"
              },
              "default": "'router-link-active'",
              "doc-url": "https://router.vuejs.org/api/#active-class",
              "description": "Configure the active CSS class applied when the link is active. Note the default value can also be configured globally via the `linkActiveClass` router constructor option."
            },
            {
              "name": "exactActiveClass",
              "value": {
                "kind": "expression",
                "type": "string"
              },
              "default": "'router-link-exact-active'",
              "doc-url": "https://router.vuejs.org/api/#exact-active-class",
              "description": "Configure the active CSS class applied when the link is active with exact match. Note the default value can also be configured globally via the `linkExactActiveClass` router constructor option."
            },
            {
              "name": "ariaCurrentValue",
              "value": {
                "kind": "expression",
                "type": "'page' | 'step' | 'location' | 'date' | 'time'"
              },
              "default": "'page'",
              "doc-url": "https://router.vuejs.org/api/#aria-current-value",
              "description": "Configure the value of `aria-current` when the link is active with exact match. It must be one of the allowed values for aria-current in the ARIA spec. In most cases, the default of `page` should be the best fit."
            },
            {
              "name": "event",
              "value": {
                "kind": "expression",
                "type": [
                  "string",
                  "string[]"
                ]
              },
              "default": "'click'",
              "doc-url": "https://router.vuejs.org/api/#event",
              "description": "Specify the event(s) that can trigger the link navigation."
            }
          ],
          "slots": [
            {
              "name": "default",
              "vue-properties": [
                {
                  "name": "href",
                  "description": "Resolved url. This would be the `href` attribute of an `a` element",
                  "type": "string"
                },
                {
                  "name": "route",
                  "description": "Resolved normalized location",
                  "type": "object"
                },
                {
                  "name": "navigate",
                  "description": "Function to trigger the navigation. **It will automatically prevent events when necessary**, the same way `router-link` does",
                  "type": "() => any"
                },
                {
                  "name": "isActive",
                  "description": "`true` if the active class should be applied. Allows to apply an arbitrary class",
                  "type": "boolean"
                },
                {
                  "name": "isExactActive",
                  "description": "`true` if the exact active class should be applied. Allows to apply an arbitrary class",
                  "type": "boolean"
                }
              ]
            }
          ]
        },
        {
          "name": "RouterView",
          "doc-url": "https://router.vuejs.org/api/#router-view",
          "description": "The `<router-view>` component is a functional component that renders the matched component for the given path. Components rendered in `<router-view>` can also contain their own `<router-view>`, which will render components for nested paths.",
          "attributes": [
            {
              "name": "name",
              "value": {
                "kind": "expression",
                "type": "string"
              },
              "default": "'default'",
              "doc-url": "https://router.vuejs.org/api/#name",
              "description": "When a `<router-view>` has a name, it will render the component with the corresponding name in the matched route record's components option. See Named Views for an example."
            }
          ]
        }
      ]
    }
  }
}