Siirry sisältöön

Panel

Panel-komponentti mahdollistaa saman aihealueen sisältöjen ryhmittelyn selkeisiin asiakokonaisuuksiin.

Julkaistu versiossa 2.0.0

React API

Panel

  • animate

    Kääntää avattavan paneelin animaatiot päälle/pois.

    Tyyppi: boolean

    Oletusarvo: true

  • as

    Renderöitävä HTML-elementti

    Tyyppi: ElementType

    Oletusarvo: defaultElement as E

  • children

    Komponentin sisältö

    Tyyppi: ReactNode

  • className

    CSS-apuluokat ulkoasun muokkaamiseen.

    Tyyppi: string

  • heading

    Paneelin otsikko

    Tyyppi: ReactNode

  • headingAs

    Paneelin otsikkotaso (h1-h6).

    Tyyppi: ElementType<HTMLAttributes<HTMLHeadingElement>, keyof IntrinsicElements>

    Oletusarvo: h2

  • headingId

    Paneelin otsikolle välitettävä id.

    Tyyppi: string

  • id

    Paneelin id. Mikäli id:tä ei anneta komponentille luodaan uniikki id.

    Tyyppi: string

  • isOpen

    Avattavan/suljettavan paneelin tila.

    Tyyppi: boolean

  • legend

    Määrittää käytetäänkö legend-elementtiä (käytössä vain komponentin ollessa fieldset).

    Tyyppi: boolean

    Oletusarvo: true

  • legendText

    Legend-elementille välitettävä teksti (oletuksena sama kuin heading, käytössä vain komponentin ollessa fieldset).

    Tyyppi: ReactNode

  • onClick

    Avattavan/suljettavan paneelin otsikon onClick-funktio.

    Tyyppi: (e: MouseEvent<HTMLButtonElement, MouseEvent>) => void

  • testId

    Komponentin juurielementille data-testid-attribuuttiin välitettävä arvo testausta varten.

    Tyyppi: string

  • variant

    Komponentin väri / tyyppi

    Tyyppi: "primary" | "danger" | "success" | "light" | "dark"

    Oletusarvo: primary

PanelBody

  • as

    Renderöitävä HTML-elementti

    Tyyppi: ElementType

    Oletusarvo: "div" as E

  • children

    Komponentin sisältö

    Tyyppi: ReactNode

  • className

    CSS-apuluokat ulkoasun muokkaamiseen.

    Tyyppi: string

  • testId

    Komponentin juurielementille data-testid-attribuuttiin välitettävä arvo testausta varten.

    Tyyppi: string

PanelActions

  • as

    Renderöitävä HTML-elementti

    Tyyppi: ElementType

    Oletusarvo: "div" as E

  • children

    Komponentin sisältö

    Tyyppi: ReactNode

  • className

    CSS-apuluokat ulkoasun muokkaamiseen.

    Tyyppi: string

  • testId

    Komponentin juurielementille data-testid-attribuuttiin välitettävä arvo testausta varten.

    Tyyppi: string