From d3172bc68610d55e5374c719451b1a1a75fe3096 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marianne=20R=C3=B8svik?= Date: Tue, 19 Sep 2023 23:18:26 +0200 Subject: [PATCH 1/9] docs: guidelines for accordion --- .../src/components/Accordion/Accordion.mdx | 104 +++++++++++++++--- .../Accordion/Accordion.stories.tsx | 42 +++++++ packages/react/src/components/Alert/Alert.mdx | 12 +- 3 files changed, 131 insertions(+), 27 deletions(-) diff --git a/packages/react/src/components/Accordion/Accordion.mdx b/packages/react/src/components/Accordion/Accordion.mdx index 05ac664636..d34534999f 100644 --- a/packages/react/src/components/Accordion/Accordion.mdx +++ b/packages/react/src/components/Accordion/Accordion.mdx @@ -14,26 +14,17 @@ import { Accordion } from '.'; # Accordion -Accordion er en vertikalt stablet gruppe interaktive overskrifter som hver inneholder en tittel, en kort tekst eller et miniatyrbilde som representerer -en seksjon av innholdet. Overskriftene fungerer som kontroller som lar brukere vise eller skjule de tilknyttede seksjonene med innhold. -Accordion brukes ofte for å redusere behovet for å skrolle ned når man presenterer flere seksjoner med innhold på en enkelt side. +Med `Accordion` kan du presentere mye innhold på liten plass i en eller flere rader. Hele raden er klikkbar og lar brukere åpne eller lukke visningen av innholdet under. -## Props +**Vær oppmerksom på:** - - - -### Accordion.Item +- Ved å legge innhold i `Accordion` risikerer du at det ikke blir sett av brukerne. Innhold som er viktig bør _ikke_ skjules. +- Ikke legg en `Accordion` inni en annen. - - -### Accordion.Header +
- - -### Accordion.Content - - + + ## Bruk @@ -55,8 +46,85 @@ import { Accordion } from '@digdir/design-system-react'; ; ``` -## Varianter +## Eksempler + +
+### Med ramme + +`Accordion` kan vises med ramme. Dette kan passe i tilfeller der accordions ikke fyller hele siden, eller når det kun er en rad. + + + +### Med farger + +`Accordion` kan vises i farger fra ditt brand. + + + +
+ +## Retningslinjer + +Tester viser at brukerne sjeldnere ser på skjult innhold, enn det som er synlig direkte på siden. Ikke bruk `Accordion` til å skjule innhold for å gjøre siden "ryddigere". Finn ut om du faktisk må skjule innhold og vær klar over hvorfor du gjør det. Tenk over om det er lurt å vise det viktigste innholdet i åpen status når brukeren kommer inn på siden. + +Hvis innholdet er for langt eller komplisert, bør du heller omformulere teksten og/eller eventuelt fordele den på flere sider. + +### Egnet til + +- samle innhold som er litt lengre +- gjøre det frivillig å se innhold som er litt mindre viktig enn alltid synlig innhold +- vise ofte stilte spørsmål +- vise tilleggsinformasjon som kan være til hjelp for brukerne -### Kontrollert +### Ikke egnet til + +- vise små mengder innhold +- vise informasjon hvis det bare er ett element +- vise viktig innhold som alle bør se når de kommer til siden (for eksempel feilmeldinger) +- gi mer informasjon om et spørsmål i et skjema – det innholdet bør brukeren se med en gang +- velge mellom ulike alternativer +- skjule innhold fra søkeresultater eller oversikter/tabeller +- dele opp en logisk flyt eller en rekke med handlinger, da bør du heller bruke en trinnvis liste + +### Unngå + +- Ikke legg en `Accordion` inni en annen, det vi kaller nøstede lister. + +
+ +## Tekst i komponenten + +Accordion skal brukes til tekst som er maks. to avsnitt lang innenfor hvert nedtrekk. Sørg for at overskriften gir en god beskrivelse av hva innholdet i accordion er. En tydelig og beskrivende overskrift skal gjøre brukerne nysgjerrig på innholdet. Overskriftene til accordion kan ha stor betydning for om brukerne finner det de trenger, om innholdet blir lest og om det kan regnes som tilgjengelig for alle brukere. «Vis mer» eller «Les mer her» er ikke gode nok titler. Har du en accordion med mange nedtrekk, kan du ha en hovedoverskrift eller temaoverskrift over hele listen. + +
+ +## Tilgjengelighet + +[`Chevron`](https://aksel.nav.no/ikoner/ChevronDown)-ikonet er bevisst plassert til venstre for teksten, av hensyn til brukeren med nedsatt synsfelt. Der er det lettere for brukeren å se det (fordi vi leser fra venstre). Mange brukere tror at de må peke på og velge ikonet for å åpne. + +Ikke plasser andre interaktive elementer inn i `Accordion`-header, da hele raden skal være klikkbar. Ikonet og teksten skal _ikke_ lenke til ulike handlinger (for eksempel at teksten går videre til en side, mens ikonet åpner listen). Brukerne forventer ikke at ikon og tekst skal gi ulikt resultat når de velger dem. + +`Tab` : Flytter fokus til neste element som kan ha fokus \ +`Shift` + `Tab` : Flytter fokus til forrige element som kan ha fokus \ +`Space` : Aktiverer knapp \ +`Enter` : Aktiverer knapp + +
+ +## Andre props + +### Accordion.Item + + + +#### Kontrollert + +### Accordion.Header + + + +### Accordion.Content + + diff --git a/packages/react/src/components/Accordion/Accordion.stories.tsx b/packages/react/src/components/Accordion/Accordion.stories.tsx index 2b643d0219..c7cbb1bab0 100644 --- a/packages/react/src/components/Accordion/Accordion.stories.tsx +++ b/packages/react/src/components/Accordion/Accordion.stories.tsx @@ -33,6 +33,48 @@ export const Preview: StoryFn = (args) => ( ); +export const AccordionBorder: StoryFn = (args) => ( + + + Hva er Lorem Ipsum? + + Lorem Ipsum er rett og slett dummytekst fra og for trykkeindustrien. + Lorem Ipsum har vært bransjens standard for dummytekst helt siden + 1500-tallet, da en ukjent boktrykker stokket en mengde bokstaver for å + lage et prøveeksemplar av en bok. + + + +); + +export const AccordionColor: StoryFn = (args) => ( + + + Hva er Lorem Ipsum? + + Lorem Ipsum er rett og slett dummytekst fra og for trykkeindustrien. + Lorem Ipsum har vært bransjens standard for dummytekst helt siden + 1500-tallet, da en ukjent boktrykker stokket en mengde bokstaver for å + lage et prøveeksemplar av en bok. + + + + Hvor kommer det fra? + + I motsetning til hva mange tror, er ikke Lorem Ipsum bare tilfeldig + tekst. Dets røtter springer helt tilbake til et stykke klassisk latinsk + litteratur fra 45 år f.kr., hvilket gjør det over 2000 år gammelt. + + + +); + // Default values are selected in Controls Preview.args = { border: false, diff --git a/packages/react/src/components/Alert/Alert.mdx b/packages/react/src/components/Alert/Alert.mdx index da5b6aceb7..8728dd45bb 100644 --- a/packages/react/src/components/Alert/Alert.mdx +++ b/packages/react/src/components/Alert/Alert.mdx @@ -27,9 +27,9 @@ import { Alert } from '@digdir/design-system-react'; You are using the Alert component!; ``` -## Varianter med eksempler +## Eksempler -`Alert` har flere varianter fordi den kan brukes til fire ulike budskap: Informasjon, advarsler, suksess og feilmelding. +`Alert` kan brukes til fire ulike budskap: Informasjon, advarsler, suksess og feilmelding. Den kan også brukes sammen med andre komponenter og stiler. Her er noen eksempler.
@@ -57,13 +57,7 @@ Bruk `danger` for å informere om noe som er kritisk eller som hindrer brukeren -## Andre eksempler - -`Alert` kan brukes sammen med andre komponenter og stiler. Her er noen eksempler. - -
- -### Med overskrift +### Med og uten overskrift Hvis meldingen er lenger enn en setning kan det være nyttig å bruke en overskrift til å fremheve det viktigste. Dette kan gjøres ved bruk av [Typografi](/docs/felles-typography--docs)-komponentene. Husk å velge riktig overskriftsnivå ut fra plassen alert har i innholdsstrukturen på siden. From 6554e4d35aee98b2476748a79879b54060a097f4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marianne=20R=C3=B8svik?= Date: Wed, 20 Sep 2023 22:26:45 +0200 Subject: [PATCH 2/9] docs: accordion guidelines - move controlled example --- .../src/components/Accordion/Accordion.mdx | 12 +++++++----- .../components/Accordion/Accordion.stories.tsx | 18 ++++++++++++++---- 2 files changed, 21 insertions(+), 9 deletions(-) diff --git a/packages/react/src/components/Accordion/Accordion.mdx b/packages/react/src/components/Accordion/Accordion.mdx index d34534999f..1163c83283 100644 --- a/packages/react/src/components/Accordion/Accordion.mdx +++ b/packages/react/src/components/Accordion/Accordion.mdx @@ -61,6 +61,12 @@ import { Accordion } from '@digdir/design-system-react'; +### Kontrollert + +`Accordion` kan kontrolleres + + +
## Retningslinjer @@ -111,16 +117,12 @@ Ikke plasser andre interaktive elementer inn i `Accordion`-header, da hele raden
-## Andre props +## Sub-komponenter av Accordion ### Accordion.Item -#### Kontrollert - - - ### Accordion.Header diff --git a/packages/react/src/components/Accordion/Accordion.stories.tsx b/packages/react/src/components/Accordion/Accordion.stories.tsx index c7cbb1bab0..ba4996c374 100644 --- a/packages/react/src/components/Accordion/Accordion.stories.tsx +++ b/packages/react/src/components/Accordion/Accordion.stories.tsx @@ -89,15 +89,25 @@ export const Controlled: StoryFn = () => { setOpen(!open)}> - Accordion header text + Hva er Lorem Ipsum? - Accordion content + + Lorem Ipsum er rett og slett dummytekst fra og for trykkeindustrien. + Lorem Ipsum har vært bransjens standard for dummytekst helt siden + 1500-tallet, da en ukjent boktrykker stokket en mengde bokstaver for å + lage et prøveeksemplar av en bok. + setOpen2(!open2)}> - Accordion header text + Hvor kommer det fra? - Accordion content + + I motsetning til hva mange tror, er ikke Lorem Ipsum bare tilfeldig + tekst. Dets røtter springer helt tilbake til et stykke klassisk + latinsk litteratur fra 45 år f.kr., hvilket gjør det over 2000 år + gammelt. + ); From a0a8c8a4a50345b576a322d978cdb1d83d28d1db Mon Sep 17 00:00:00 2001 From: Michael Marszalek Date: Thu, 21 Sep 2023 08:00:17 +0200 Subject: [PATCH 3/9] Updated controlled example --- .../src/components/Accordion/Accordion.mdx | 10 +++-- .../Accordion/Accordion.stories.tsx | 38 ++++++++++--------- 2 files changed, 27 insertions(+), 21 deletions(-) diff --git a/packages/react/src/components/Accordion/Accordion.mdx b/packages/react/src/components/Accordion/Accordion.mdx index d34534999f..1a1842090f 100644 --- a/packages/react/src/components/Accordion/Accordion.mdx +++ b/packages/react/src/components/Accordion/Accordion.mdx @@ -61,6 +61,12 @@ import { Accordion } from '@digdir/design-system-react'; +#### Kontrollert + +`Accordion` holder selv orden på når den er lukket/åpen, men kan kontrollers utenfra. + + +
## Retningslinjer @@ -117,10 +123,6 @@ Ikke plasser andre interaktive elementer inn i `Accordion`-header, da hele raden -#### Kontrollert - - - ### Accordion.Header diff --git a/packages/react/src/components/Accordion/Accordion.stories.tsx b/packages/react/src/components/Accordion/Accordion.stories.tsx index c7cbb1bab0..2c0763260d 100644 --- a/packages/react/src/components/Accordion/Accordion.stories.tsx +++ b/packages/react/src/components/Accordion/Accordion.stories.tsx @@ -1,6 +1,8 @@ import React, { useState } from 'react'; import type { Meta, StoryFn } from '@storybook/react'; +import { Button } from '../'; + import { Accordion } from '.'; export default { @@ -33,7 +35,7 @@ export const Preview: StoryFn = (args) => ( ); -export const AccordionBorder: StoryFn = (args) => ( +export const AccordionBorder: StoryFn = () => ( = (args) => ( ); -export const AccordionColor: StoryFn = (args) => ( +export const AccordionColor: StoryFn = () => ( = () => { const [open, setOpen] = useState(false); - const [open2, setOpen2] = useState(false); return ( - - - setOpen(!open)}> - Accordion header text - - Accordion content - - - setOpen2(!open2)}> - Accordion header text - - Accordion content - - + <> + + + + setOpen(!open)}> + Accordion header text + + Accordion content + + + setOpen(!open)}> + Accordion header text + + Accordion content + + + ); }; From 9a481de018627813fc765ea9ff3b2f53b1959943 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marianne=20R=C3=B8svik?= Date: Tue, 26 Sep 2023 12:53:06 +0200 Subject: [PATCH 4/9] docs: replaced lorum ipsum with example content --- .../src/components/Accordion/Accordion.mdx | 2 +- .../Accordion/Accordion.stories.tsx | 84 ++++++++++++------- 2 files changed, 55 insertions(+), 31 deletions(-) diff --git a/packages/react/src/components/Accordion/Accordion.mdx b/packages/react/src/components/Accordion/Accordion.mdx index 1a1842090f..315f6f5cc8 100644 --- a/packages/react/src/components/Accordion/Accordion.mdx +++ b/packages/react/src/components/Accordion/Accordion.mdx @@ -63,7 +63,7 @@ import { Accordion } from '@digdir/design-system-react'; #### Kontrollert -`Accordion` holder selv orden på når den er lukket/åpen, men kan kontrollers utenfra. +`Accordion` holder selv orden på når den er lukket/åpen, men kan kontrolleres utenfra. diff --git a/packages/react/src/components/Accordion/Accordion.stories.tsx b/packages/react/src/components/Accordion/Accordion.stories.tsx index 2c0763260d..295117d52f 100644 --- a/packages/react/src/components/Accordion/Accordion.stories.tsx +++ b/packages/react/src/components/Accordion/Accordion.stories.tsx @@ -2,7 +2,7 @@ import React, { useState } from 'react'; import type { Meta, StoryFn } from '@storybook/react'; import { Button } from '../'; - +import { Link } from '../'; import { Accordion } from '.'; export default { @@ -16,20 +16,24 @@ export default { export const Preview: StoryFn = (args) => ( - Hva er Lorem Ipsum? + + Hvem kan registrere seg i Frivillighetsregisteret? + - Lorem Ipsum er rett og slett dummytekst fra og for trykkeindustrien. - Lorem Ipsum har vært bransjens standard for dummytekst helt siden - 1500-tallet, da en ukjent boktrykker stokket en mengde bokstaver for å - lage et prøveeksemplar av en bok. + For å kunne bli registrert i Frivillighetsregisteret, må organisasjonen + drive frivillig virksomhet. Det er bare foreninger, stiftelser og + aksjeselskap som kan registreres. Virksomheten kan ikke dele ut midler + til fysiske personer. Virksomheten må ha et styre. - Hvor kommer det fra? + + Hvordan går jeg fram for å registrere i Frivillighetsregisteret? + - I motsetning til hva mange tror, er ikke Lorem Ipsum bare tilfeldig - tekst. Dets røtter springer helt tilbake til et stykke klassisk latinsk - litteratur fra 45 år f.kr., hvilket gjør det over 2000 år gammelt. + Virksomheten må være registrert i Enhetsregisteret før den kan bli + registrert i Frivillighetsregisteret. Du kan registrere i begge + registrene samtidig i Samordnet registermelding. @@ -41,13 +45,8 @@ export const AccordionBorder: StoryFn = () => ( color='subtle' > - Hva er Lorem Ipsum? - - Lorem Ipsum er rett og slett dummytekst fra og for trykkeindustrien. - Lorem Ipsum har vært bransjens standard for dummytekst helt siden - 1500-tallet, da en ukjent boktrykker stokket en mengde bokstaver for å - lage et prøveeksemplar av en bok. - + Vedlegg + Vedlegg 1, vedlegg 2, vedlegg 3 ); @@ -58,20 +57,21 @@ export const AccordionColor: StoryFn = () => ( color='secondary' > - Hva er Lorem Ipsum? + + Hvordan får jeg tildelt et jegernummer? + - Lorem Ipsum er rett og slett dummytekst fra og for trykkeindustrien. - Lorem Ipsum har vært bransjens standard for dummytekst helt siden - 1500-tallet, da en ukjent boktrykker stokket en mengde bokstaver for å - lage et prøveeksemplar av en bok. + Du vil automatisk få tildelt jegernummer og bli registrert i + Jegerregisteret når du har bestått jegerprøven. - Hvor kommer det fra? + + Jeg har glemt jegernummeret mitt. Hvor finner jeg dette? + - I motsetning til hva mange tror, er ikke Lorem Ipsum bare tilfeldig - tekst. Dets røtter springer helt tilbake til et stykke klassisk latinsk - litteratur fra 45 år f.kr., hvilket gjør det over 2000 år gammelt. + Du kan finne dette ved å logge inn på{' '} + Min jegerside @@ -89,18 +89,42 @@ export const Controlled: StoryFn = () => { return ( <> +
setOpen(!open)}> - Accordion header text + Enkeltpersonforetak + + + Skal du starte for deg selv? Enkeltpersonforetak er ofte den + enkleste måten å etablere bedrift på. Denne organisasjonsformen har + noen fordeler. Og noen ulemper. Det gir deg stor grad av frihet, men + kan også gi betydelig risiko fordi du har personlig ansvar for + økonomien. + + + + setOpen(!open)}> + Aksjeselskap (AS) - Accordion content + + Planlegger du å starte næringsvirksomhet alene eller sammen med + andre? Innebærer næringsvirksomheten en økonomisk risiko? Vil du ha + rettigheter som arbeidstaker og muligheten til at andre vil + investere i selskapet ditt? Da kan aksjeselskap være en + hensiktsmessig organisasjonsform. + setOpen(!open)}> - Accordion header text + Ansvarlig selskap (ANS/DA) - Accordion content + + Er dere minst to personer som skal starte opp egen virksomhet? + Samarbeider du godt med den/de som du skal starte opp sammen med? + Krever virksomheten få investeringer og tar du liten økonomisk + risiko? Da kan du vurdere å etablere et ansvarlig selskap. + From 90dcefe98afaa3c28130d50344711d7e8a492e73 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marianne=20R=C3=B8svik?= Date: Thu, 28 Sep 2023 07:48:11 +0200 Subject: [PATCH 5/9] Update packages/react/src/components/Accordion/Accordion.stories.tsx Co-authored-by: Tomas Engebretsen --- packages/react/src/components/Accordion/Accordion.stories.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/components/Accordion/Accordion.stories.tsx b/packages/react/src/components/Accordion/Accordion.stories.tsx index 295117d52f..95989a903d 100644 --- a/packages/react/src/components/Accordion/Accordion.stories.tsx +++ b/packages/react/src/components/Accordion/Accordion.stories.tsx @@ -71,7 +71,7 @@ export const AccordionColor: StoryFn = () => ( Du kan finne dette ved å logge inn på{' '} - Min jegerside + Min jegerside From e473213704301eed57c8f7db6f8c1af42a10495b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marianne=20R=C3=B8svik?= Date: Thu, 28 Sep 2023 07:49:19 +0200 Subject: [PATCH 6/9] Update packages/react/src/components/Accordion/Accordion.stories.tsx Co-authored-by: Tomas Engebretsen --- packages/react/src/components/Accordion/Accordion.stories.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/components/Accordion/Accordion.stories.tsx b/packages/react/src/components/Accordion/Accordion.stories.tsx index 95989a903d..e3940350e0 100644 --- a/packages/react/src/components/Accordion/Accordion.stories.tsx +++ b/packages/react/src/components/Accordion/Accordion.stories.tsx @@ -98,7 +98,7 @@ export const Controlled: StoryFn = () => { Skal du starte for deg selv? Enkeltpersonforetak er ofte den enkleste måten å etablere bedrift på. Denne organisasjonsformen har - noen fordeler. Og noen ulemper. Det gir deg stor grad av frihet, men + både fordeler og ulemper. Det gir deg stor grad av frihet, men kan også gi betydelig risiko fordi du har personlig ansvar for økonomien. From 3e1592cc6da99ec642568007525d8c77ad52d6cc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marianne=20R=C3=B8svik?= Date: Thu, 28 Sep 2023 07:49:30 +0200 Subject: [PATCH 7/9] Update packages/react/src/components/Accordion/Accordion.mdx Co-authored-by: Tomas Engebretsen --- packages/react/src/components/Accordion/Accordion.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/components/Accordion/Accordion.mdx b/packages/react/src/components/Accordion/Accordion.mdx index 315f6f5cc8..2483fe5e1a 100644 --- a/packages/react/src/components/Accordion/Accordion.mdx +++ b/packages/react/src/components/Accordion/Accordion.mdx @@ -100,7 +100,7 @@ Hvis innholdet er for langt eller komplisert, bør du heller omformulere teksten ## Tekst i komponenten -Accordion skal brukes til tekst som er maks. to avsnitt lang innenfor hvert nedtrekk. Sørg for at overskriften gir en god beskrivelse av hva innholdet i accordion er. En tydelig og beskrivende overskrift skal gjøre brukerne nysgjerrig på innholdet. Overskriftene til accordion kan ha stor betydning for om brukerne finner det de trenger, om innholdet blir lest og om det kan regnes som tilgjengelig for alle brukere. «Vis mer» eller «Les mer her» er ikke gode nok titler. Har du en accordion med mange nedtrekk, kan du ha en hovedoverskrift eller temaoverskrift over hele listen. +Accordion skal brukes til maksimalt to avsnitt innenfor hvert nedtrekk. Sørg for at overskriften gir en god beskrivelse av hva innholdet i accordion er. En tydelig og beskrivende overskrift skal gjøre brukerne nysgjerrige på innholdet. Overskriftene til accordion kan ha stor betydning for om brukerne finner det de trenger, om innholdet blir lest og om det kan regnes som tilgjengelig for alle brukere. «Vis mer» eller «Les mer her» er ikke gode nok titler. Har du en accordion med mange nedtrekk, kan du ha en hovedoverskrift eller temaoverskrift over hele listen.
From fd479eff19639f8d1ca12d28f34cc12241f20be1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marianne=20R=C3=B8svik?= Date: Thu, 28 Sep 2023 07:49:43 +0200 Subject: [PATCH 8/9] Update packages/react/src/components/Accordion/Accordion.stories.tsx Co-authored-by: Tomas Engebretsen --- packages/react/src/components/Accordion/Accordion.stories.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/components/Accordion/Accordion.stories.tsx b/packages/react/src/components/Accordion/Accordion.stories.tsx index e3940350e0..f787ac6236 100644 --- a/packages/react/src/components/Accordion/Accordion.stories.tsx +++ b/packages/react/src/components/Accordion/Accordion.stories.tsx @@ -110,7 +110,7 @@ export const Controlled: StoryFn = () => { Planlegger du å starte næringsvirksomhet alene eller sammen med andre? Innebærer næringsvirksomheten en økonomisk risiko? Vil du ha - rettigheter som arbeidstaker og muligheten til at andre vil + rettigheter som arbeidstaker og muligheten til at andre kan investere i selskapet ditt? Da kan aksjeselskap være en hensiktsmessig organisasjonsform. From 1674b9830f601b4aeec7b33910cafcdb51be3cea Mon Sep 17 00:00:00 2001 From: Michael Marszalek Date: Thu, 28 Sep 2023 09:00:04 +0200 Subject: [PATCH 9/9] =?UTF-8?q?=F0=9F=9A=A8=20Fixed=20linter=20warnings=20?= =?UTF-8?q?&=20errors?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../react/src/components/Accordion/Accordion.stories.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/react/src/components/Accordion/Accordion.stories.tsx b/packages/react/src/components/Accordion/Accordion.stories.tsx index f787ac6236..31e469ab89 100644 --- a/packages/react/src/components/Accordion/Accordion.stories.tsx +++ b/packages/react/src/components/Accordion/Accordion.stories.tsx @@ -1,8 +1,8 @@ import React, { useState } from 'react'; import type { Meta, StoryFn } from '@storybook/react'; -import { Button } from '../'; -import { Link } from '../'; +import { Button, Link } from '../'; + import { Accordion } from '.'; export default { @@ -98,8 +98,8 @@ export const Controlled: StoryFn = () => { Skal du starte for deg selv? Enkeltpersonforetak er ofte den enkleste måten å etablere bedrift på. Denne organisasjonsformen har - både fordeler og ulemper. Det gir deg stor grad av frihet, men - kan også gi betydelig risiko fordi du har personlig ansvar for + både fordeler og ulemper. Det gir deg stor grad av frihet, men kan + også gi betydelig risiko fordi du har personlig ansvar for økonomien.