Komponenter

InternalHeader

InternalHeader samler handlinger og overordnet navigasjon for interne systemer. Handlingene som tilbys bestemmes av hvert enkelt system.

StabilOppdatert 5. mai 2026

Github Figma Endringslogg

Egnet til:

Bruk på interne flater
Navigasjon

Uegnet til:

Eksterne flater

Eksempler

App.tsx
<InternalHeader>
  <InternalHeader.Title as="h1">Sykepenger</InternalHeader.Title>
  <Spacer />
  <InternalHeader.User name="Ola Normann" />
</InternalHeader>

Retningslinjer

App-meny

App-menyen brukes til å lenke til andre fagsystemer og oppslagsverk. Lenkene åpnes i ny fane slik at systemet man er i ikke lukkes. Se eksempel "App-meny".

Brukermeny

Brukermenyen kan blant annet inneholde mer informasjon om brukeren (f.eks. fullt navn og identnummer), knapp for å logge ut og knapp for å bytte tema. Se eksempel "Brukermeny".

Figma

Vi tester Figma slots for navigasjonsknapper i InternalHeader.

En slot lar deg fritt legge til og fjerne innhold, uten noe predefinert maksantall.‌ Se hvordan i denne Figma-filen.

Props

InternalHeader

className?: Type:
string
ref?: Type:
Ref<HTMLElement>
Description:
Allows getting a ref to the component instance. Once the component unmounts, React will set ref.current to null (or call the ref with null if you passed a callback ref). React Docs

InternalHeader.Button

children: Type:
ReactNode
Description:
Application Button
isActive?: Type:
boolean
Default:
false
Description:
Active state for element.
className?: Type:
string
ref?: Type:
Ref<HTMLButtonElement>
Description:
Allows getting a ref to the component instance. Once the component unmounts, React will set ref.current to null (or call the ref with null if you passed a callback ref). React Docs
as?: Type:
React.ElementType
Description:
OverridableComponent-api

InternalHeader.Title

children: Type:
ReactNode
Description:
Application title
className?: Type:
string
ref?: Type:
Ref<HTMLAnchorElement>
Description:
Allows getting a ref to the component instance. Once the component unmounts, React will set ref.current to null (or call the ref with null if you passed a callback ref). React Docs
as?: Type:
React.ElementType
Description:
OverridableComponent-api

InternalHeader.User

name: Type:
ReactNode
Description:
User name
description?: Type:
ReactNode
Description:
User description
className?: Type:
string
ref?: Type:
Ref<HTMLDivElement>
Description:
Allows getting a ref to the component instance. Once the component unmounts, React will set ref.current to null (or call the ref with null if you passed a callback ref). React Docs

InternalHeader.UserButton

name: Type:
string
Description:
User name
description?: Type:
string
Description:
User description
className?: Type:
string
ref?: Type:
Ref<HTMLButtonElement>
Description:
Allows getting a ref to the component instance. Once the component unmounts, React will set ref.current to null (or call the ref with null if you passed a callback ref). React Docs
as?: Type:
React.ElementType
Description:
OverridableComponent-api

Tokens

Gammel dokumentasjon for disse finner du på jsDelivr

InternalHeader

Egnet til:

Uegnet til:

Eksempler

Retningslinjer

App-meny

Brukermeny

Figma

Props

InternalHeader

className?

ref?

InternalHeader.Button

children

isActive?

className?

ref?

as?

InternalHeader.Title

children

className?

ref?

as?

InternalHeader.User

name

description?

className?

ref?

InternalHeader.UserButton

name

description?

className?

ref?

as?

Tokens

Komponent-tokens ble fjernet i versjon 8