# Install

```shell
npm i @vaadin/details
npm i @mate/component-addons
```

# Import

```javascript
import '@vaadin/details';
import '@mate/component-addons';
```

# Variants

## Mate summary

```html
<vaadin-details>
    <mate-details-summary title-text="Title" slot="summary"></mate-details-summary>
    Inhaltsbereich in dem beliebiger Inhalt stehen kann
</vaadin-details>
```

## Object header

```html
<vaadin-details>
    <mate-details-summary title-text="Title" slot="summary" theme="object-header">
        <span theme="badge" slot="title">Information</span>
        <span theme="badge" slot="title">Information</span>
        <vaadin-button theme="icon" slot="action">
            <span theme="icon">delete</span>
        </vaadin-button>
        <vaadin-button theme="icon" slot="action">
            <span theme="icon">content_copy</span>
        </vaadin-button>
    </mate-details-summary>
    Inhaltsbereich in dem beliebiger Inhalt stehen kann
</vaadin-details>
```