Setup
aksel.nav.no
Props
Modal
Type |
|
---|---|
Description | Modal content |
Type |
|
---|---|
Description | Open state for modal |
Type |
|
---|---|
Description | Callback for modal wanting to close |
Type |
|
---|---|
Description | If modal should close on overlay click (click outside Modal) |
Default | true |
Type |
|
---|---|
Description | User defined classname for modal |
Type |
|
---|---|
Description | Removes close-button(X) when false |
Default | true |
Type |
|
---|---|
Description | Callback for setting parent element modal will attach to |
Type |
|
---|
Type |
|
---|
Type |
|
---|
Type |
|
---|---|
Description | Sets aria-label on modal @warning This should be set if not using 'aria-labelledby' or 'aria-describedby' |
Type |
|
---|
* Props er autogenerert fra kode, så avvik kan forekomme. Ta kontakt hvis noe ikke stemmer!
Modal.Content
Type |
|
---|---|
Description | Modal.Content content |
Type |
|
---|
Type |
|
---|
* Props er autogenerert fra kode, så avvik kan forekomme. Ta kontakt hvis noe ikke stemmer!
Retningslinjer
Husk å enten bruke aria-label
eller aria-labelledby
. Om det er brukt en beskrivende tittel i Modalen så er aria-labelledby
et godt valg for å tilgjengeliggjøre den for skjermlesere.
Sikre skjermlesere
Husk å sette hvilken element modal skal mountes
på. Dette må gjøres for å sikre at skjermlesere ikke leser opp innholdet bak modal når den er åpen.
// Eksempelbruk i en standard nextjs appuseEffect(() => {Modal.setAppElement("#__next");},[])