Accordion API Reference

Props

Prop	Type	Default	Description
accordionTextRef	String	''	The text to display in the accordion header
isTextRefI18	Boolean	false	Whether the header text is an i18n key

Slots

Slot	Description
accordionContent	Content to be displayed when the accordion is expanded

Methods

The component doesn't expose any methods via template refs.

Events

The component doesn't emit any events.

Example Usage

<template>
  <OAccordion accordionTextRef="Section Title">
    <template #accordionContent>
      <p>
        This is the content that will be shown when the accordion is expanded.
      </p>
      <p>You can include any HTML or components here.</p>
    </template>
  </OAccordion>
</template>

<script setup>
import { OAccordion } from "your-component-library";
</script>

Styling

The accordion can be styled using the following CSS classes:

• .accordion-container: The main container
• .accordion-header: The clickable header area
• .accordion-name: The text in the header
• .accordion-drop-icon: The dropdown icon
• .accordion-content-wrapper: The container for the content