FeatureIntro

@/components/ui/FeatureIntro

«Psst, ny ting»-kort for en ny brukervendt evne — plasseres INLINE ved siden av funksjonen, vises én gang per nettleser.

Når brukes den

Bruk når en leveranse gir en ny synlig evne: en ny seksjon, en knapp med ny funksjon, eller automatikk som endrer hva flaten viser.
plassering="under" (default) når kortet står under funksjonen (pil opp); "over" når det står over (pil ned).
cta er valgfri — en primærhandling ved siden av «Skjønner», f.eks. «Se hvordan».
Ikke bruk for hver småjustering — rene visuelle endringer og feilrettinger utløser ikke en FeatureIntro (regel/ny-funksjon-far-funksjonsintro).

Eksempler

Under funksjonen (default), med CTA

Standardplasseringen — kortet peker opp mot funksjonen det introduserer.

↑ f.eks. en ny knapp her

<FeatureIntro
  id="bankavstemming-2026-09"
  tittel="Ny: bankavstemming"
  beskrivelse="Innbetalinger matches nå automatisk mot fakturaer."
  cta={{ tekst: 'Se hvordan', onClick: visDemo }}
/>

Over funksjonen, uten CTA

plassering="over" for når kortet ligger over den nye seksjonen. Uten cta vises kun «Skjønner».

↓ f.eks. en ny seksjon her

Props

Sveip tabellen for å se hele innholdet

Navn

Type

Default

Beskrivelse

id *

string

—

Unik nøkkel for engangsvakten, f.eks. "okonomi-sveip-2026-08".

tittel *

string

—

Overskriften, vist ved siden av et «Nytt»-merke.

children

ReactNode

—

Fritekst/markup i stedet for beskrivelse, når innholdet trenger mer enn ett avsnitt.

beskrivelse

string

—

Kort forklaring under tittelen.

cta

{ tekst: string; onClick: () => void }

—

Valgfri primærhandling ved siden av «Skjønner».

plassering

'over' | 'under'

'under'

Hvilken side av funksjonen kortet ligger på — styrer hvilken vei pilen peker.

className

string

—

Ekstra klasser.

Regler

regel/ny-funksjon-far-funksjonsintro

Beslektede komponenter

callout

badge