LinkBox

React API

LinkBox

Ref-prop välitetään komponentin link-elementille.

• appearance

  Määrittää täytetäänkö linkki yhdellä värillä vai käytetäänkö reunaviivaa.

  Tyyppi: "solid" | "outline"

  Oletusarvo: solid

• arrowType

  Linkin nuolen tyyppi.

  Tyyppi: "caret" | "arrow"

  Oletusarvo: caret

• as

  Renderöitävä HTML-elementti

  Tyyppi: ElementType

• children

  Komponentin sisältö.

  Tyyppi: ReactNode

• className

  CSS-apuluokat ulkoasun muokkaamiseen.

  Tyyppi: string

• contentAs

  Vaihtaa linkin sisäisen HTML-elementin tyyppiä.

  Tyyppi: ElementType<HTMLAttributes<HTMLElement>>

  Oletusarvo: span

• icon

  Linkin sisältöä kuvaava kuvake

  Tyyppi: Element

• infoText

  Linkin lisätietoteksti.

  Tyyppi: string

• newTabLabel

  Piilotettu teksti aukeaa uuteen välilehteen -kuvakkeelle.

  Tyyppi: string

  Oletusarvo: Avautuu uuteen välilehteen

• ref

  Komponentin ref, joka tyypittyy renderöitävän HTML-elementin mukaan.

  Tyyppi: any

• rounded

  Pyöristää linkin reunat. Käytetään toistaiseksi vain Kanta-teemassa ja neliön muotoisten linkkien kanssa.

  Tyyppi: boolean

• shadow

  Asettaa linkin varjostuksen

  Tyyppi: boolean

  Oletusarvo: false

• square

  Neliön muotoinen linkki.

  Tyyppi: boolean

• testId

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

  Tyyppi: string

• textColor

  Linkin tekstiväri

  Tyyppi: "dark"

• textSize

  Linkkitekstin koko.

  Tyyppi: "base" | "lg"

  Oletusarvo: base

LinkBoxGroupContainer

• children

  Komponentin sisältö.

  Tyyppi: ReactNode

• className

  CSS-apuluokat ulkoasun muokkaamiseen.

  Tyyppi: string

• testId

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

  Tyyppi: string

LinkBoxGroup

• align

  Määrittää miten elementit tasataan. Käytössä vain layout=group asetuksen kanssa.

  Tyyppi: "center" | "left"

• alignStack

  Määrittää miten elementit tasataan, kun ne pinoutuvat kahteen riviin. Käytössä vain layout=group asetuksen kanssa.

  Tyyppi: "center" | "left"

• children

  Komponentin sisältö.

  Tyyppi: ReactNode

• className

  CSS-apuluokat ulkoasun muokkaamiseen.

  Tyyppi: string

• layout

  Määrittää kuinka linkit ryhmitellään. Vaihtoehdot: group = neljän elementin ryhmä, grid = vapaasti juokseva grid, none = räätälöintiin tarkoitettu vaihtoehto ilman ulkoasua.

  Tyyppi: "grid" | "group" | "none"

  Oletusarvo: group

• testId

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

  Tyyppi: string

LinkBoxGroupItem

• children

  Komponentin sisältö.

  Tyyppi: ReactNode

• className

  CSS-apuluokat ulkoasun muokkaamiseen.

  Tyyppi: string

• testId

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

  Tyyppi: string

LinkBoxList

• as

  Renderöitävä HTML-elementti

  Tyyppi: "ul"

• cols

  Palstojen leveys, joka ei mukaudu eri breakpointeilla. Käytä tätä, jos sama leveys toimii kaikilla breakpointeilla.

  Tyyppi: ColumnSize

• columns

  Palstojen määrä

  Tyyppi: 1 | 2 | 3 | 4

  Oletusarvo: 1

• gx

  Määrittää palstojen välisen tilan horisontaalisesti. Arvot (0 | 2 | 4 | 6 | 8) kasvavat 0.50rem (8px) välein.

  Tyyppi: GapSize

  Oletusarvo: 4

• gy

  Määrittää palstojen välisen tilan vertikaalisesti. Arvot (0 | 2 | 4 | 6 | 8) kasvavat 0.50rem (8px) välein.

  Tyyppi: GapSize

  Oletusarvo: 4

• lg

  Palstojen leveys lg-breakpointille

  Tyyppi: ColumnSize

• md

  Palstojen leveys md-breakpointille

  Tyyppi: ColumnSize

• sm

  Palstojen leveys sm-breakpointille

  Tyyppi: ColumnSize

• testId

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

  Tyyppi: string

• xl

  Palstojen leveys xl-breakpointille

  Tyyppi: ColumnSize

• xxl

  Palstojen leveys 2xl-breakpointille

  Tyyppi: ColumnSize

• xxxl

  Palstojen leveys 3xl-breakpointille

  Tyyppi: ColumnSize

LinkBoxListItem

• children

  Komponentin sisältö.

  Tyyppi: ReactNode

• className

  CSS-apuluokat ulkoasun muokkaamiseen.

  Tyyppi: string

• testId

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

  Tyyppi: string