MazAccordion

MazAccordion is a standalone component that allows you to create an accordion with a title and content.

Before use it, you should install the MazUi plugin in your project, follow instructions in Getting Started

Basic usage

Content 1

Content 2

Content 3

Content 4

<script lang="ts" setup>
import MazAccordion from 'maz-ui/components/MazAccordion'
</script>

<template>
  <MazAccordion>
    <template #title-1>
      Title 1
    </template>
    <template #content-1>
      Content 1
    </template>

    <template #title-2>
      Title 2
    </template>
    <template #content-2>
      Content 2
    </template>

    <template #title-3>
      Title 3
    </template>
    <template #content-3>
      Content 3
    </template>

    <template #title-4>
      Title 4
    </template>
    <template #content-4>
      Content 4
    </template>
    <MazAccordion />
  </mazaccordion>
</template>

Props

Name	Description	Type	Required	Default	Possible values
id		string	No	-	-
model-value	v-model	number	No	0	-
content-class		ClassValue	No	-	-

Events

Event name	Payload	Description
update:model-value	any[

Slots

Name	Description	Bindings
content		isOpen boolean
title-	One slot per step: #title-<step>.	-
content-	One slot per step: #content-<step>.	isOpen boolean