@sb1/ffe-accordion-react 100.8.2 → 100.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +58 -13
  2. package/package.json +6 -6
package/README.md CHANGED
@@ -1,28 +1,73 @@
1
1
  # @sb1/ffe-accordion-react
2
2
 
3
- ## Install
3
+ ## Beskrivelse
4
+
5
+ Kollapsbare seksjoner for å organisere innhold. `Accordion` er wrapper-komponenten, `AccordionItem` representerer hver seksjon.
6
+
7
+ ## Installasjon
4
8
 
5
9
  ```bash
6
10
  npm install --save @sb1/ffe-accordion-react
7
11
  ```
8
12
 
9
- ## Usage
13
+ ## Bruk
10
14
 
11
- Full documentation on accordion usage is available at https://design.sparebank1.no/komponenter/accordion/.
15
+ Full dokumentasjon: https://sparebank1.github.io/designsystem/
12
16
 
13
- This package depends on `@sb1/ffe-collapse-react` and `@sb1/ffe-icons-react`.
14
- Make sure you import the less-files.
17
+ Avhengig av `@sb1/ffe-collapse-react` og `@sb1/ffe-icons-react`. Importer styling:
15
18
 
16
- ## Development
19
+ ```css
20
+ @import '@sb1/ffe-accordion/css/accordion.css';
21
+ ```
17
22
 
18
- To start a local development server, run the following from the designsystem root folder:
23
+ ## Eksempler
19
24
 
20
- ```bash
21
- npm install
22
- npm run build
23
- npm start
25
+ ### Enkel bruk
26
+
27
+ ```tsx
28
+ import { Accordion, AccordionItem } from '@sb1/ffe-accordion-react';
29
+
30
+ function MyComponent() {
31
+ return (
32
+ <Accordion headingLevel={2}>
33
+ <AccordionItem heading="Første seksjon">
34
+ Innhold for første seksjon
35
+ </AccordionItem>
36
+ <AccordionItem heading="Andre seksjon" defaultOpen>
37
+ Denne seksjonen er åpen som standard
38
+ </AccordionItem>
39
+ </Accordion>
40
+ );
41
+ }
42
+ ```
43
+
44
+ ### Kontrollert modus
45
+
46
+ ```tsx
47
+ import { useState } from 'react';
48
+ import { Accordion, AccordionItem } from '@sb1/ffe-accordion-react';
49
+
50
+ function MyComponent() {
51
+ const [isOpen, setIsOpen] = useState(false);
52
+
53
+ return (
54
+ <Accordion headingLevel={2}>
55
+ <AccordionItem
56
+ heading="Kontrollert seksjon"
57
+ isOpen={isOpen}
58
+ onToggleOpen={setIsOpen}
59
+ >
60
+ Denne seksjonen styres av ekstern state
61
+ </AccordionItem>
62
+ </Accordion>
63
+ );
64
+ }
24
65
  ```
25
66
 
26
- A local instance of `Storybook` with live reloading will run at http://localhost:6006/.
67
+ ## Utvikling
68
+
69
+ ```bash
70
+ npm install && npm run build && npm start
71
+ ```
27
72
 
28
- Example implementations using the latest versions of all components are also available at https://sparebank1.github.io/designsystem.
73
+ Storybook kjører på http://localhost:6006/.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sb1/ffe-accordion-react",
3
- "version": "100.8.2",
3
+ "version": "100.9.0",
4
4
  "license": "MIT",
5
5
  "author": "SpareBank 1",
6
6
  "files": [
@@ -24,13 +24,13 @@
24
24
  "test:watch": "ffe-buildtool jest --watch"
25
25
  },
26
26
  "dependencies": {
27
- "@sb1/ffe-accordion": "^100.8.2",
28
- "@sb1/ffe-collapse-react": "^100.8.2",
29
- "@sb1/ffe-icons-react": "^100.8.2",
27
+ "@sb1/ffe-accordion": "^100.9.0",
28
+ "@sb1/ffe-collapse-react": "^100.9.0",
29
+ "@sb1/ffe-icons-react": "^100.9.0",
30
30
  "classnames": "^2.3.1"
31
31
  },
32
32
  "devDependencies": {
33
- "@sb1/ffe-buildtool": "^100.8.2",
33
+ "@sb1/ffe-buildtool": "^100.9.0",
34
34
  "react": "^18.2.0",
35
35
  "react-dom": "^18.2.0"
36
36
  },
@@ -40,5 +40,5 @@
40
40
  "publishConfig": {
41
41
  "access": "public"
42
42
  },
43
- "gitHead": "50fbbbdb2023a60add7158e8c5bd6443c4f9c95e"
43
+ "gitHead": "41f20cf10bec5ebe53036c282690983d2114fb45"
44
44
  }