Akordion

Penggunaan

import {
  AccordionTrigger,
  AccordionContent,
  Accordion,
  AccordionItem,
} from "@govtechmy/myds-react/accordion";

export default () => (
  <Accordion>
    <AccordionItem>
      <AccordionTrigger></AccordionTrigger>
      <AccordionContent></AccordionContent>
    </AccordionItem>
  </Accordion>
);

Contoh

Jenis

Gunakan prop type untuk menukar cara kandungan dipaparkan!

• single: hanya benarkan satu kandungan ditunjukkan pada satu masa

• multiple: benarkan beberapa kandungan ditunjukkan pada masa yang sama.

Boleh Dilipat

Gunakan prop collapsible untuk menentukan sama ada semua akordion boleh dilipat! Secara lalai, ia ditetapkan kepada true. Sila ambil perhatian ini hanya berfungsi apabila type="single".

Dilumpuh

Prop disabled wujud dalam kedua-dua komponen Accordion dan AccordionItem.

Menetapkan disabled kepada true dalam Accordion akan melumpuhkan semua komponen AccordionItem, manakala dalam AccordionItem akan melumpuhkan AccordionItem yang berkenaan.

Props

Accordion

AccordionItem

AccordionTrigger

AccordionContent