{
  "mixins": [
    {
      "props": {
        "model-value": {
          "type": [
            "Boolean",
            "null"
          ],
          "desc": "Model of the component defining shown/hidden state; Either use this property (along with a listener for 'update:model-value' event) OR use v-model directive",
          "default": "null",
          "category": "model",
          "examples": [
            "# v-model=\"state\""
          ]
        },
        "icon": {
          "extends": "icon"
        },
        "expand-icon": {
          "extends": "icon"
        },
        "expanded-icon": {
          "extends": "icon",
          "desc": "Expand icon name (following Quasar convention) for when QExpansionItem is expanded; When used, it also disables the rotation animation of the expand icon; Make sure you have the icon library installed unless you are using 'img:' prefix"
        },
        "expand-icon-class": {
          "type": [
            "String",
            "Array",
            "Object"
          ],
          "tsType": "VueClassProp",
          "desc": "Apply custom class(es) to the expand icon item section",
          "examples": [
            "'text-purple'"
          ],
          "category": "style"
        },
        "toggle-aria-label": {
          "type": "String",
          "desc": "aria-label to be used on the expansion toggle element",
          "examples": [
            "'Open details'"
          ],
          "category": "accessibility",
          "addedIn": "v2.8.4"
        },
        "label": {
          "type": "String",
          "desc": "Header label (unless using 'header' slot)",
          "examples": [
            "'My expansion item'"
          ],
          "category": "content"
        },
        "label-lines": {
          "type": [
            "Number",
            "String"
          ],
          "desc": "Apply ellipsis when there's not enough space to render on the specified number of lines; If more than one line specified, then it will only work on webkit browsers because it uses the '-webkit-line-clamp' CSS property!",
          "examples": [
            "1",
            "'3'"
          ],
          "category": "content"
        },
        "caption": {
          "type": "String",
          "desc": "Header sub-label (unless using 'header' slot)",
          "examples": [
            "'Unread message: 5'"
          ],
          "category": "content"
        },
        "caption-lines": {
          "type": [
            "Number",
            "String"
          ],
          "desc": "Apply ellipsis when there's not enough space to render on the specified number of lines; If more than one line specified, then it will only work on webkit browsers because it uses the '-webkit-line-clamp' CSS property!",
          "examples": [
            "1",
            "'3'"
          ],
          "category": "content"
        },
        "dark": {
          "extends": "dark"
        },
        "dense": {
          "extends": "dense"
        },
        "duration": {
          "type": "Number",
          "desc": "Animation duration (in milliseconds)",
          "default": "300",
          "passthrough": "child",
          "category": "behavior"
        },
        "header-inset-level": {
          "type": "Number",
          "desc": "Apply an inset to header (unless using 'header' slot); Useful when header avatar/left side is missing but you want to align content with other items that do have a left side, or when you're building a menu",
          "examples": [
            "1"
          ],
          "category": "content"
        },
        "content-inset-level": {
          "type": "Number",
          "desc": "Apply an inset to content (changes content padding)",
          "examples": [
            "1"
          ],
          "category": "content"
        },
        "expand-separator": {
          "type": "Boolean",
          "desc": "Apply a top and bottom separator when expansion item is opened",
          "category": "content"
        },
        "default-opened": {
          "type": "Boolean",
          "desc": "Puts expansion item into open state on initial render; Overridden by v-model if used",
          "category": "behavior"
        },
        "hide-expand-icon": {
          "type": "Boolean",
          "desc": "Do not show the expand icon",
          "category": "content",
          "addedIn": "v2.8.4"
        },
        "expand-icon-toggle": {
          "type": "Boolean",
          "desc": "Applies the expansion events to the expand icon only and not to the whole header",
          "category": "behavior"
        },
        "switch-toggle-side": {
          "type": "Boolean",
          "desc": "Switch expand icon side (from default 'right' to 'left')",
          "category": "content"
        },
        "dense-toggle": {
          "type": "Boolean",
          "desc": "Use dense mode for expand icon",
          "category": "style"
        },
        "group": {
          "type": "String",
          "desc": "Register expansion item into a group (unique name that must be applied to all expansion items in that group) for coordinated open/close state within the group a.k.a. 'accordion mode'",
          "examples": [
            "'my-emails'"
          ],
          "category": "content|behavior"
        },
        "popup": {
          "type": "Boolean",
          "desc": "Put expansion list into 'popup' mode",
          "category": "behavior"
        },
        "header-style": {
          "type": [
            "String",
            "Array",
            "Object"
          ],
          "tsType": "VueStyleProp",
          "desc": "Apply custom style to the header",
          "examples": [
            "'background: #ff0000'",
            "{ backgroundColor: '#ff0000' }"
          ],
          "category": "style"
        },
        "header-class": {
          "type": [
            "String",
            "Array",
            "Object"
          ],
          "tsType": "VueClassProp",
          "desc": "Apply custom class(es) to the header",
          "examples": [
            "'my-custom-class'",
            "{ 'my-custom-class': true }"
          ],
          "category": "style"
        }
      },
      "events": {
        "update:model-value": {
          "desc": "Emitted when showing/hidden state changes; Is also used by v-model",
          "params": {
            "value": {
              "type": "Boolean",
              "desc": "New state (showing/hidden)"
            }
          }
        },
        "show": {
          "extends": "show"
        },
        "before-show": {
          "extends": "before-show"
        },
        "hide": {
          "extends": "hide"
        },
        "before-hide": {
          "extends": "before-hide"
        },
        "after-show": {
          "extends": "after-show"
        },
        "after-hide": {
          "extends": "after-hide"
        },
        "click": {
          "internal": true
        }
      },
      "methods": {
        "show": {
          "extends": "show"
        },
        "hide": {
          "extends": "hide"
        },
        "toggle": {
          "extends": "toggle"
        }
      }
    },
    {
      "props": {
        "to": {
          "type": [
            "String",
            "Object"
          ],
          "desc": "Equivalent to Vue Router <router-link> 'to' property; Superseded by 'href' prop if used",
          "examples": [
            "'/home/dashboard'",
            "{ name: 'my-route-name' }"
          ],
          "category": "navigation"
        },
        "exact": {
          "type": "Boolean",
          "desc": "Equivalent to Vue Router <router-link> 'exact' property; Superseded by 'href' prop if used",
          "category": "navigation"
        },
        "replace": {
          "type": "Boolean",
          "desc": "Equivalent to Vue Router <router-link> 'replace' property; Superseded by 'href' prop if used",
          "category": "navigation"
        },
        "active-class": {
          "type": "String",
          "desc": "Equivalent to Vue Router <router-link> 'active-class' property; Superseded by 'href' prop if used",
          "default": "'q-router-link--active'",
          "examples": [
            "'my-active-class'"
          ],
          "category": "navigation"
        },
        "exact-active-class": {
          "type": "String",
          "desc": "Equivalent to Vue Router <router-link> 'active-class' property; Superseded by 'href' prop if used",
          "default": "'q-router-link--exact-active'",
          "examples": [
            "'my-exact-active-class'"
          ],
          "category": "navigation"
        },
        "href": {
          "type": "String",
          "desc": "Native <a> link href attribute; Has priority over the 'to'/'exact'/'replace'/'active-class'/'exact-active-class' props",
          "examples": [
            "'https://quasar.dev'"
          ],
          "category": "navigation",
          "addedIn": "v2.4"
        },
        "target": {
          "type": "String",
          "desc": "Native <a> link target attribute; Use it only along with 'href' prop; Has priority over the 'to'/'exact'/'replace'/'active-class'/'exact-active-class' props",
          "examples": [
            "'_blank'",
            "'_self'",
            "'_parent'",
            "'_top'"
          ],
          "category": "navigation",
          "addedIn": "v2.4"
        },
        "disable": {
          "extends": "disable"
        },
        "model-value": {
          "type": [
            "Boolean",
            "null"
          ],
          "desc": "Model of the component defining shown/hidden state; Either use this property (along with a listener for 'update:model-value' event) OR use v-model directive",
          "default": "null",
          "category": "model",
          "examples": [
            "# v-model=\"state\""
          ]
        },
        "icon": {
          "extends": "icon"
        },
        "expand-icon": {
          "extends": "icon"
        },
        "expanded-icon": {
          "extends": "icon",
          "desc": "Expand icon name (following Quasar convention) for when QExpansionItem is expanded; When used, it also disables the rotation animation of the expand icon; Make sure you have the icon library installed unless you are using 'img:' prefix"
        },
        "expand-icon-class": {
          "type": [
            "String",
            "Array",
            "Object"
          ],
          "tsType": "VueClassProp",
          "desc": "Apply custom class(es) to the expand icon item section",
          "examples": [
            "'text-purple'"
          ],
          "category": "style"
        },
        "toggle-aria-label": {
          "type": "String",
          "desc": "aria-label to be used on the expansion toggle element",
          "examples": [
            "'Open details'"
          ],
          "category": "accessibility",
          "addedIn": "v2.8.4"
        },
        "label": {
          "type": "String",
          "desc": "Header label (unless using 'header' slot)",
          "examples": [
            "'My expansion item'"
          ],
          "category": "content"
        },
        "label-lines": {
          "type": [
            "Number",
            "String"
          ],
          "desc": "Apply ellipsis when there's not enough space to render on the specified number of lines; If more than one line specified, then it will only work on webkit browsers because it uses the '-webkit-line-clamp' CSS property!",
          "examples": [
            "1",
            "'3'"
          ],
          "category": "content"
        },
        "caption": {
          "type": "String",
          "desc": "Header sub-label (unless using 'header' slot)",
          "examples": [
            "'Unread message: 5'"
          ],
          "category": "content"
        },
        "caption-lines": {
          "type": [
            "Number",
            "String"
          ],
          "desc": "Apply ellipsis when there's not enough space to render on the specified number of lines; If more than one line specified, then it will only work on webkit browsers because it uses the '-webkit-line-clamp' CSS property!",
          "examples": [
            "1",
            "'3'"
          ],
          "category": "content"
        },
        "dark": {
          "extends": "dark"
        },
        "dense": {
          "extends": "dense"
        },
        "duration": {
          "type": "Number",
          "desc": "Animation duration (in milliseconds)",
          "default": "300",
          "passthrough": "child",
          "category": "behavior"
        },
        "header-inset-level": {
          "type": "Number",
          "desc": "Apply an inset to header (unless using 'header' slot); Useful when header avatar/left side is missing but you want to align content with other items that do have a left side, or when you're building a menu",
          "examples": [
            "1"
          ],
          "category": "content"
        },
        "content-inset-level": {
          "type": "Number",
          "desc": "Apply an inset to content (changes content padding)",
          "examples": [
            "1"
          ],
          "category": "content"
        },
        "expand-separator": {
          "type": "Boolean",
          "desc": "Apply a top and bottom separator when expansion item is opened",
          "category": "content"
        },
        "default-opened": {
          "type": "Boolean",
          "desc": "Puts expansion item into open state on initial render; Overridden by v-model if used",
          "category": "behavior"
        },
        "hide-expand-icon": {
          "type": "Boolean",
          "desc": "Do not show the expand icon",
          "category": "content",
          "addedIn": "v2.8.4"
        },
        "expand-icon-toggle": {
          "type": "Boolean",
          "desc": "Applies the expansion events to the expand icon only and not to the whole header",
          "category": "behavior"
        },
        "switch-toggle-side": {
          "type": "Boolean",
          "desc": "Switch expand icon side (from default 'right' to 'left')",
          "category": "content"
        },
        "dense-toggle": {
          "type": "Boolean",
          "desc": "Use dense mode for expand icon",
          "category": "style"
        },
        "group": {
          "type": "String",
          "desc": "Register expansion item into a group (unique name that must be applied to all expansion items in that group) for coordinated open/close state within the group a.k.a. 'accordion mode'",
          "examples": [
            "'my-emails'"
          ],
          "category": "content|behavior"
        },
        "popup": {
          "type": "Boolean",
          "desc": "Put expansion list into 'popup' mode",
          "category": "behavior"
        },
        "header-style": {
          "type": [
            "String",
            "Array",
            "Object"
          ],
          "tsType": "VueStyleProp",
          "desc": "Apply custom style to the header",
          "examples": [
            "'background: #ff0000'",
            "{ backgroundColor: '#ff0000' }"
          ],
          "category": "style"
        },
        "header-class": {
          "type": [
            "String",
            "Array",
            "Object"
          ],
          "tsType": "VueClassProp",
          "desc": "Apply custom class(es) to the header",
          "examples": [
            "'my-custom-class'",
            "{ 'my-custom-class': true }"
          ],
          "category": "style"
        }
      }
    }
  ],
  "meta": {
    "docsUrl": "https://v2.quasar.dev/vue-components/expansion-item"
  },
  "props": {
    "to": {
      "type": [
        "String",
        "Object"
      ],
      "desc": "Equivalent to Vue Router <router-link> 'to' property; Superseded by 'href' prop if used",
      "examples": [
        "'/home/dashboard'",
        "{ name: 'my-route-name' }"
      ],
      "category": "navigation"
    },
    "exact": {
      "type": "Boolean",
      "desc": "Equivalent to Vue Router <router-link> 'exact' property; Superseded by 'href' prop if used",
      "category": "navigation"
    },
    "replace": {
      "type": "Boolean",
      "desc": "Equivalent to Vue Router <router-link> 'replace' property; Superseded by 'href' prop if used",
      "category": "navigation"
    },
    "active-class": {
      "type": "String",
      "desc": "Equivalent to Vue Router <router-link> 'active-class' property; Superseded by 'href' prop if used",
      "default": "'q-router-link--active'",
      "examples": [
        "'my-active-class'"
      ],
      "category": "navigation"
    },
    "exact-active-class": {
      "type": "String",
      "desc": "Equivalent to Vue Router <router-link> 'active-class' property; Superseded by 'href' prop if used",
      "default": "'q-router-link--exact-active'",
      "examples": [
        "'my-exact-active-class'"
      ],
      "category": "navigation"
    },
    "href": {
      "type": "String",
      "desc": "Native <a> link href attribute; Has priority over the 'to'/'exact'/'replace'/'active-class'/'exact-active-class' props",
      "examples": [
        "'https://quasar.dev'"
      ],
      "category": "navigation",
      "addedIn": "v2.4"
    },
    "target": {
      "type": "String",
      "desc": "Native <a> link target attribute; Use it only along with 'href' prop; Has priority over the 'to'/'exact'/'replace'/'active-class'/'exact-active-class' props",
      "examples": [
        "'_blank'",
        "'_self'",
        "'_parent'",
        "'_top'"
      ],
      "category": "navigation",
      "addedIn": "v2.4"
    },
    "disable": {
      "extends": "disable"
    },
    "model-value": {
      "type": [
        "Boolean",
        "null"
      ],
      "desc": "Model of the component defining shown/hidden state; Either use this property (along with a listener for 'update:model-value' event) OR use v-model directive",
      "default": "null",
      "category": "model",
      "examples": [
        "# v-model=\"state\""
      ]
    },
    "icon": {
      "extends": "icon"
    },
    "expand-icon": {
      "extends": "icon"
    },
    "expanded-icon": {
      "extends": "icon",
      "desc": "Expand icon name (following Quasar convention) for when QExpansionItem is expanded; When used, it also disables the rotation animation of the expand icon; Make sure you have the icon library installed unless you are using 'img:' prefix"
    },
    "expand-icon-class": {
      "type": [
        "String",
        "Array",
        "Object"
      ],
      "tsType": "VueClassProp",
      "desc": "Apply custom class(es) to the expand icon item section",
      "examples": [
        "'text-purple'"
      ],
      "category": "style"
    },
    "toggle-aria-label": {
      "type": "String",
      "desc": "aria-label to be used on the expansion toggle element",
      "examples": [
        "'Open details'"
      ],
      "category": "accessibility",
      "addedIn": "v2.8.4"
    },
    "label": {
      "type": "String",
      "desc": "Header label (unless using 'header' slot)",
      "examples": [
        "'My expansion item'"
      ],
      "category": "content"
    },
    "label-lines": {
      "type": [
        "Number",
        "String"
      ],
      "desc": "Apply ellipsis when there's not enough space to render on the specified number of lines; If more than one line specified, then it will only work on webkit browsers because it uses the '-webkit-line-clamp' CSS property!",
      "examples": [
        "1",
        "'3'"
      ],
      "category": "content"
    },
    "caption": {
      "type": "String",
      "desc": "Header sub-label (unless using 'header' slot)",
      "examples": [
        "'Unread message: 5'"
      ],
      "category": "content"
    },
    "caption-lines": {
      "type": [
        "Number",
        "String"
      ],
      "desc": "Apply ellipsis when there's not enough space to render on the specified number of lines; If more than one line specified, then it will only work on webkit browsers because it uses the '-webkit-line-clamp' CSS property!",
      "examples": [
        "1",
        "'3'"
      ],
      "category": "content"
    },
    "dark": {
      "extends": "dark"
    },
    "dense": {
      "extends": "dense"
    },
    "duration": {
      "type": "Number",
      "desc": "Animation duration (in milliseconds)",
      "default": "300",
      "passthrough": "child",
      "category": "behavior"
    },
    "header-inset-level": {
      "type": "Number",
      "desc": "Apply an inset to header (unless using 'header' slot); Useful when header avatar/left side is missing but you want to align content with other items that do have a left side, or when you're building a menu",
      "examples": [
        "1"
      ],
      "category": "content"
    },
    "content-inset-level": {
      "type": "Number",
      "desc": "Apply an inset to content (changes content padding)",
      "examples": [
        "1"
      ],
      "category": "content"
    },
    "expand-separator": {
      "type": "Boolean",
      "desc": "Apply a top and bottom separator when expansion item is opened",
      "category": "content"
    },
    "default-opened": {
      "type": "Boolean",
      "desc": "Puts expansion item into open state on initial render; Overridden by v-model if used",
      "category": "behavior"
    },
    "hide-expand-icon": {
      "type": "Boolean",
      "desc": "Do not show the expand icon",
      "category": "content",
      "addedIn": "v2.8.4"
    },
    "expand-icon-toggle": {
      "type": "Boolean",
      "desc": "Applies the expansion events to the expand icon only and not to the whole header",
      "category": "behavior"
    },
    "switch-toggle-side": {
      "type": "Boolean",
      "desc": "Switch expand icon side (from default 'right' to 'left')",
      "category": "content"
    },
    "dense-toggle": {
      "type": "Boolean",
      "desc": "Use dense mode for expand icon",
      "category": "style"
    },
    "group": {
      "type": "String",
      "desc": "Register expansion item into a group (unique name that must be applied to all expansion items in that group) for coordinated open/close state within the group a.k.a. 'accordion mode'",
      "examples": [
        "'my-emails'"
      ],
      "category": "content|behavior"
    },
    "popup": {
      "type": "Boolean",
      "desc": "Put expansion list into 'popup' mode",
      "category": "behavior"
    },
    "header-style": {
      "type": [
        "String",
        "Array",
        "Object"
      ],
      "tsType": "VueStyleProp",
      "desc": "Apply custom style to the header",
      "examples": [
        "'background: #ff0000'",
        "{ backgroundColor: '#ff0000' }"
      ],
      "category": "style"
    },
    "header-class": {
      "type": [
        "String",
        "Array",
        "Object"
      ],
      "tsType": "VueClassProp",
      "desc": "Apply custom class(es) to the header",
      "examples": [
        "'my-custom-class'",
        "{ 'my-custom-class': true }"
      ],
      "category": "style"
    }
  },
  "slots": {
    "default": {
      "desc": "Slot used for expansion item's content"
    },
    "header": {
      "desc": "Slot used for overriding default header",
      "scope": {
        "expanded": {
          "type": "Boolean",
          "desc": "QExpansionItem expanded status",
          "addedIn": "v2.7.6"
        },
        "detailsId": {
          "type": "String",
          "desc": "QExpansionItem details panel id (for use in aria-controls)",
          "addedIn": "v2.8.4"
        },
        "show": {
          "type": "Function",
          "desc": "Triggers component to show",
          "params": {
            "evt": {
              "type": "Object",
              "required": false,
              "desc": "JS event object"
            }
          },
          "returns": null,
          "addedIn": "v2.8.4"
        },
        "hide": {
          "type": "Function",
          "desc": "Triggers component to hide",
          "params": {
            "evt": {
              "type": "Object",
              "required": false,
              "desc": "JS event object"
            }
          },
          "returns": null,
          "addedIn": "v2.8.4"
        },
        "toggle": {
          "type": "Function",
          "desc": "Triggers component to toggle between show/hide",
          "params": {
            "evt": {
              "type": "Object",
              "required": false,
              "desc": "JS event object"
            }
          },
          "returns": null,
          "addedIn": "v2.8.4"
        }
      }
    }
  },
  "events": {
    "update:model-value": {
      "desc": "Emitted when showing/hidden state changes; Is also used by v-model",
      "params": {
        "value": {
          "type": "Boolean",
          "desc": "New state (showing/hidden)"
        }
      }
    },
    "show": {
      "extends": "show"
    },
    "before-show": {
      "extends": "before-show"
    },
    "hide": {
      "extends": "hide"
    },
    "before-hide": {
      "extends": "before-hide"
    },
    "after-show": {
      "extends": "after-show"
    },
    "after-hide": {
      "extends": "after-hide"
    },
    "click": {
      "internal": true
    }
  },
  "methods": {
    "show": {
      "extends": "show"
    },
    "hide": {
      "extends": "hide"
    },
    "toggle": {
      "extends": "toggle"
    }
  }
}