AccordionTrigger

Accordion Trigger component (header/button)

import { AccordionTrigger } from "@tetherto/mdk-react-devkit";

Prop	Status	Type	Default	Description
`timestamp`	Optional	`string \| undefined`	—	—
`showToggleIcon`	Optional	`boolean \| undefined`	—	—
`toggleIconPosition`	Optional	`TAccordionToggleIconPosition \| undefined`	—	—
`customLabel`	Optional	`React.ReactNode`	—	—

Usage

Collapsible panel with a title trigger and animated content area. Exports both a high-level Accordion wrapper and composable primitives (AccordionRoot, AccordionItem, AccordionTrigger, AccordionContent).

Notes

Accordion wraps the primitives with type="multiple" and a single hard-coded item value; use AccordionRoot directly when you need multi-item control.
toggleIconPosition="right" swaps to PlusIcon/MinusIcon style; "left" uses ChevronDown/ChevronRight.

Example

/** * Runnable example for Accordion. */import {  Accordion,  AccordionContent,  AccordionItem,  AccordionRoot,  AccordionTrigger,} from '@tetherto/mdk-react-devkit'export const AccordionExample = () => (  <div className="mdk-example-col">    <Accordion title="Basic Accordion" isOpened>      <p>Collapsed/expanded content goes here. Supports any React node as children.</p>    </Accordion>    <Accordion title="Solid Background" solidBackground>      <p>This variant uses a solid background for the accordion panel.</p>    </Accordion>    <AccordionRoot type="multiple">      <AccordionItem value="item-1">        <AccordionTrigger toggleIconPosition="right">Custom trigger position</AccordionTrigger>        <AccordionContent>          <p>Content for item 1 using low-level Accordion primitives.</p>        </AccordionContent>      </AccordionItem>      <AccordionItem value="item-2">        <AccordionTrigger>Another section</AccordionTrigger>        <AccordionContent>          <p>Content for item 2.</p>        </AccordionContent>      </AccordionItem>    </AccordionRoot>  </div>)