# Install

```shell
npm i @mate-vue/accordion
```

# Import

```vue
<script setup>
import { MateAccordion, MateAccordionPanel } from '@mate-vue/accordion';
</script>
```

# Variants

## Panels with summary and icons

```vue
<template>
    <MateAccordion>
        <MateAccordionPanel title-text="First panel">
            <MateBadge slot="title">Information</MateBadge>
            <MateBadge slot="title">Information</MateBadge>
            <MateButton theme="icon" slot="action">
                <MateIcon>delete</MateIcon>
            </MateButton>
            <MateButton theme="icon" slot="action">
                <MateIcon>content_copy</MateIcon>
            </MateButton>
            <span>Content</span>
        </MateAccordionPanel>
        <MateAccordionPanel disabled title-text="Disabled panel">
            <MateBadge slot="title">Information</MateBadge>
            <MateBadge slot="title">Information</MateBadge>
            <MateButton theme="icon" slot="action">
                <MateIcon>delete</MateIcon>
            </MateButton>
            <MateButton theme="icon" slot="action">
                <MateIcon>content_copy</MateIcon>
            </MateButton>
            <span>Content</span>
        </MateAccordionPanel>
    </MateAccordion>
</template>
```