Ekspanderbartpanel

Ekspanderbartpanel er et panel som kan ekspandere eller kollapse innhold. Komponenten bruker npm-pakken React-collapse og extender props fra den.

Normal

<Ekspanderbartpanel tittel="Klikk her for å åpne/lukke panelet">
  Panelet vil da ekspandere og vise innholdet.
</Ekspanderbartpanel>

Kopiert!

Endre tekststørrelse

For å endre tekst-størrelsen på åpne/lukke-knappen kan man sende inn en annen typografi-type via tittel-propen.

<Ekspanderbartpanel
  tittel={<Normaltekst>Klikk her for å åpne/lukke panelet</Normaltekst>}
>
  Panelet vil da ekspandere og vise innholdet.
</Ekspanderbartpanel>

Kopiert!

Avansert innhold i åpne/lukke-knapp

Komponentens tittel-prop støtter rikt HTML-innhold.

<Ekspanderbartpanel
  tittel={
    <div>
      <Undertittel>Klikk her for å åpne/lukke panelet</Undertittel>
      <Etikett type="suksess">En etikett</Etikett>
      <Etikett type="fokus" style={{ marginLeft: "0.5rem" }}>
        En annen etikett
      </Etikett>
    </div>
  }
>
  Panelet vil da ekspandere og vise innholdet.
</Ekspanderbartpanel>

Kopiert!