Komponenter
InternalHeader
InternalHeader samler handlinger og overordnet navigasjon for interne systemer. Handlingene som tilbys bestemmes av hvert enkelt system.
Egnet til:
- Bruk på interne flater
- Navigasjon
Uegnet til:
- Eksterne flater
Eksempler
Retningslinjer
App-meny
App-menyen inneholder lenker til andre fagsystemer og oppslagsverk. Lenkene åpnes i ny fane slik at systemet man er i ikke lukkes. Det er opp til det enkelte team hvor mange lenker de fyller den med. Se eksempel "App-meny".
Brukermeny
Ved å klikke på brukernavnet åpnes en meny som viser brukers fulle navn, identnummer samt en lenke for å logge ut av systemet. Teamene avgjør selv om de vil introdusere mer informasjon i denne konteksten. Se eksempel "Brukermeny".
Både app switcher og brukermeny bruker Dropdown.
Props
InternalHeader
className?
- Type:
string
data-color?
- Type:
(string & {}) | AkselColor
ref?
- Type:
LegacyRef<HTMLElement>
- Description:
Allows getting a ref to the component instance. Once the component unmounts, React will set
ref.current
tonull
(or call the ref withnull
if you passed a callback ref). React Docs
InternalHeader.Button
children
- Type:
ReactNode
- Description:
Application Button
className?
- Type:
string
data-color?
- Type:
(string & {}) | AkselColor
ref?
- Type:
LegacyRef<HTMLButtonElement>
- Description:
Allows getting a ref to the component instance. Once the component unmounts, React will set
ref.current
tonull
(or call the ref withnull
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
data-color?
- Type:
(string & {}) | AkselColor
ref?
- Type:
LegacyRef<HTMLAnchorElement>
- Description:
Allows getting a ref to the component instance. Once the component unmounts, React will set
ref.current
tonull
(or call the ref withnull
if you passed a callback ref). React Docs
as?
- Type:
React.ElementType
- Description:
OverridableComponent-api
InternalHeader.User
name
- Type:
string
- Description:
User name
description?
- Type:
string
- Description:
User description
className?
- Type:
string
data-color?
- Type:
(string & {}) | AkselColor
ref?
- Type:
LegacyRef<HTMLDivElement>
- Description:
Allows getting a ref to the component instance. Once the component unmounts, React will set
ref.current
tonull
(or call the ref withnull
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
data-color?
- Type:
(string & {}) | AkselColor
ref?
- Type:
LegacyRef<HTMLButtonElement>
- Description:
Allows getting a ref to the component instance. Once the component unmounts, React will set
ref.current
tonull
(or call the ref withnull
if you passed a callback ref). React Docs
as?
- Type:
React.ElementType
- Description:
OverridableComponent-api
Tokens
Deprecation warning: I det nye systemet for theming og darkmode, er komponent-tokens fjernet. Mer dokumentasjon for dette kommer, midlertidig dokumentasjon finner du her.
Token | Fallback |
---|---|
--ac-internalheader-bg | --a-surface-inverted |
--ac-internalheader-divider | --a-gray-600 |
--ac-internalheader-text | --a-text-on-inverted |
--ac-internalheader-hover-bg | --a-surface-inverted-hover |
--ac-internalheader-active-bg | --a-surface-inverted-active |