{
  "type": "component",
  "meta": {
    "docsUrl": "https://v1.quasar.dev/vue-components/stepper"
  },
  "behavior": {
    "$listeners": {
      "desc": "All native events are being propagated (you don't need the '.native' modifier)"
    }
  },
  "props": {
    "value": {
      "type": "Any",
      "desc": "Model of the component defining current panel's name; If used as Number, it does not defines panel index though but slide name's which may be an Integer; Either use this property (along with a listener for 'input' event) OR use v-model directive",
      "examples": [
        "v-model=\"panelName\""
      ],
      "category": "model"
    },
    "keep-alive": {
      "type": "Boolean",
      "desc": "Equivalent to using Vue's native <keep-alive> component on the content",
      "category": "behavior"
    },
    "animated": {
      "type": "Boolean",
      "desc": "Enable transitions between panel (also see 'transition-prev' and 'transition-next' props)",
      "category": "behavior"
    },
    "infinite": {
      "type": "Boolean",
      "desc": "Makes component appear as infinite (when reaching last panel, next one will become the first one)",
      "category": "behavior"
    },
    "swipeable": {
      "type": "Boolean",
      "desc": "Enable swipe events (may interfere with content's touch/mouse events)",
      "category": "behavior"
    },
    "vertical": {
      "type": "Boolean",
      "desc": "Put Stepper in vertical mode (instead of horizontal by default)",
      "category": "behavior"
    },
    "transition-prev": {
      "type": "String",
      "desc": "One of Quasar's embedded transitions (has effect only if 'animated' prop is set)",
      "examples": [
        "fade",
        "slide-down"
      ],
      "category": "behavior",
      "default": "slide-right/slide-down"
    },
    "transition-next": {
      "type": "String",
      "desc": "One of Quasar's embedded transitions (has effect only if 'animated' prop is set)",
      "examples": [
        "fade",
        "slide-down"
      ],
      "category": "behavior",
      "default": "slide-left/slide-up"
    },
    "dark": {
      "type": "Boolean",
      "desc": "Notify the component that the background is a dark color",
      "category": "style"
    },
    "flat": {
      "type": "Boolean",
      "desc": "Applies a 'flat' design (no default shadow)",
      "category": "style"
    },
    "bordered": {
      "type": "Boolean",
      "desc": "Applies a default border to the component",
      "category": "style"
    },
    "alternative-labels": {
      "type": "Boolean",
      "desc": "Use alternative labels - stacks the icon on top of the label (applies only to horizontal stepper)",
      "category": "header"
    },
    "header-nav": {
      "type": "Boolean",
      "desc": "Allow navigation through the header",
      "category": "behavior"
    },
    "contracted": {
      "type": "Boolean",
      "desc": "Hide header labels on narrow windows",
      "category": "header|behavior"
    },
    "inactive-icon": {
      "type": "String",
      "desc": "Icon name following Quasar convention; Make sure you have the icon library installed unless you are using 'img:' prefix",
      "examples": [
        "map",
        "ion-add",
        "img:https://cdn.quasar.dev/logo/svg/quasar-logo.svg",
        "img:statics/path/to/some_image.png"
      ],
      "category": "header"
    },
    "inactive-color": {
      "type": "String",
      "desc": "Color name for component from the Quasar Color Palette",
      "examples": [
        "primary",
        "teal-10"
      ],
      "category": "header"
    },
    "done-icon": {
      "type": "String",
      "desc": "Icon name following Quasar convention; Make sure you have the icon library installed unless you are using 'img:' prefix",
      "examples": [
        "map",
        "ion-add",
        "img:https://cdn.quasar.dev/logo/svg/quasar-logo.svg",
        "img:statics/path/to/some_image.png"
      ],
      "category": "header"
    },
    "done-color": {
      "type": "String",
      "desc": "Color name for component from the Quasar Color Palette",
      "examples": [
        "primary",
        "teal-10"
      ],
      "category": "header"
    },
    "active-icon": {
      "type": "String",
      "desc": "Icon name following Quasar convention; Make sure you have the icon library installed unless you are using 'img:' prefix",
      "examples": [
        "map",
        "ion-add",
        "img:https://cdn.quasar.dev/logo/svg/quasar-logo.svg",
        "img:statics/path/to/some_image.png"
      ],
      "category": "header"
    },
    "active-color": {
      "type": "String",
      "desc": "Color name for component from the Quasar Color Palette",
      "examples": [
        "primary",
        "teal-10"
      ],
      "category": "header"
    },
    "error-icon": {
      "type": "String",
      "desc": "Icon name following Quasar convention; Make sure you have the icon library installed unless you are using 'img:' prefix",
      "examples": [
        "map",
        "ion-add",
        "img:https://cdn.quasar.dev/logo/svg/quasar-logo.svg",
        "img:statics/path/to/some_image.png"
      ],
      "category": "header"
    },
    "error-color": {
      "type": "String",
      "desc": "Color name for component from the Quasar Color Palette",
      "examples": [
        "primary",
        "teal-10"
      ],
      "category": "header"
    },
    "header-class": {
      "type": "String",
      "desc": "Class definitions to be attributed to the header",
      "examples": [
        "my-special-class"
      ],
      "category": "style"
    }
  },
  "slots": {
    "default": {
      "desc": "Suggestion: QStep"
    },
    "navigation": {
      "desc": "Slot specific for the global navigation; Suggestion: QStepperNavigation"
    },
    "message": {
      "desc": "Slot specific for putting a message on top of each step (if horizontal stepper) or above steps (if vertical); Suggestion: QBanner, div.q-pa-lg"
    }
  },
  "events": {
    "input": {
      "desc": "Emitted when the component changes the model; This event _isn't_ fired if the model is changed externally; Is also used by v-model",
      "params": {
        "value": {
          "type": [
            "String",
            "Number"
          ],
          "desc": "New current panel name",
          "examples": [
            "dashboard"
          ]
        }
      }
    },
    "before-transition": {
      "desc": "Emitted before transitioning to a new panel",
      "params": {
        "newVal": {
          "type": [
            "String",
            "Number"
          ],
          "desc": "Panel name towards transition is going",
          "examples": [
            "dashboard"
          ]
        },
        "oldVal": {
          "type": [
            "String",
            "Number"
          ],
          "desc": "Panel name from which transition is happening",
          "examples": [
            "dashboard"
          ]
        }
      }
    },
    "transition": {
      "desc": "Emitted after component transitioned to a new panel",
      "params": {
        "newVal": {
          "type": [
            "String",
            "Number"
          ],
          "desc": "Panel name towards transition has occurred",
          "examples": [
            "dashboard"
          ]
        },
        "oldVal": {
          "type": [
            "String",
            "Number"
          ],
          "desc": "Panel name from which transition has happened",
          "examples": [
            "dashboard"
          ]
        }
      }
    }
  },
  "methods": {
    "next": {
      "desc": "Go to next panel"
    },
    "previous": {
      "desc": "Go to previous panel"
    },
    "goTo": {
      "desc": "Go to specific panel",
      "params": {
        "panelName": {
          "type": [
            "String",
            "Number"
          ],
          "desc": "Panel's name, which may be a String or Number; Number does not refers to panel index, but to its name, which may be an Integer",
          "required": true,
          "examples": [
            "dashboard"
          ]
        }
      }
    }
  }
}