rk-designsystem 1.2.5 → 1.3.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.
- package/README.md +38 -2
- package/dist/componentlibrary.es.js +1806 -1340
- package/dist/componentlibrary.umd.js +182 -145
- package/dist/index.d.ts +188 -106
- package/dist/rk-designsystem.css +1 -1
- package/dist/styles.css +15 -0
- package/package.json +5 -4
package/README.md
CHANGED
|
@@ -66,6 +66,11 @@ The design system includes the following components:
|
|
|
66
66
|
npm install rk-designsystem
|
|
67
67
|
```
|
|
68
68
|
|
|
69
|
+
> Since v2 the library declares `@digdir/designsystemet-react` and
|
|
70
|
+
> `@digdir/designsystemet-css` as peer dependencies (`^1.13.2`) and requires
|
|
71
|
+
> React `>=18.3.1`. npm 7+ installs peers automatically; with older
|
|
72
|
+
> setups install them alongside the package.
|
|
73
|
+
|
|
69
74
|
### 2. Setup Layout with Font
|
|
70
75
|
|
|
71
76
|
For Next.js projects, use `next/font` for optimal font loading:
|
|
@@ -216,6 +221,29 @@ The guide remains the main human-readable reference. The manifest is additive an
|
|
|
216
221
|
|
|
217
222
|
This guide provides a set of standards and best practices for creating new components. Following these guidelines ensures that our component library remains consistent, accessible, and easy to maintain.
|
|
218
223
|
|
|
224
|
+
## Migrating to v2
|
|
225
|
+
|
|
226
|
+
v2 collects the breaking changes below. (Note: 1.2.5 already contained the
|
|
227
|
+
Button prop removals, mislabeled as a patch — 1.2.5 is deprecated.)
|
|
228
|
+
|
|
229
|
+
- **Peer dependencies:** `@digdir/designsystemet-react` and
|
|
230
|
+
`@digdir/designsystemet-css` (`^1.13.2`) are peers; React `>=18.3.1 || ^19`.
|
|
231
|
+
- **`import 'rk-designsystem/styles'` now delivers everything:** Digdir base,
|
|
232
|
+
the Røde Kors theme, the component CSS and Source Sans 3.
|
|
233
|
+
- **Button:** `shape`/`pill` and `soft` props are removed — styling comes
|
|
234
|
+
from the design tokens.
|
|
235
|
+
- **CrossCorner is removed:** use `GraphicElement` with `shape="angle"`.
|
|
236
|
+
- **Footer:** `showCrossCorners` is renamed `showGraphicElements`.
|
|
237
|
+
- **Alert:** `title` renders visibly (previously a native tooltip); pass
|
|
238
|
+
`titleLevel` (2–6) when it should be a real heading.
|
|
239
|
+
- **DateInput:** invalid input is no longer silently rewritten (45 stays 45);
|
|
240
|
+
a built-in inline validation message appears on blur (`showValidationMessage`
|
|
241
|
+
to opt out), with `minDate`/`maxDate` (default 1900–2100) and an
|
|
242
|
+
`onValidationChange` callback. A label (or `aria-label`/`aria-labelledby`)
|
|
243
|
+
is required at type level.
|
|
244
|
+
- **DatePicker:** days outside the month are disabled for all input methods;
|
|
245
|
+
the calendar is a real ARIA grid with arrow-key navigation.
|
|
246
|
+
|
|
219
247
|
## Getting Started (for Contributors)
|
|
220
248
|
|
|
221
249
|
Follow these steps to get the local development environment running. All commands should be run from the root of the project.
|
|
@@ -231,6 +259,14 @@ pnpm build
|
|
|
231
259
|
pnpm storybook
|
|
232
260
|
```
|
|
233
261
|
|
|
262
|
+
## Testing
|
|
263
|
+
|
|
264
|
+
Testing i dette repoet følger Norges Røde Kors' testpolicy og overordnede teststrategi. Se **[TESTING.md](./TESTING.md)** for testplanen: testnivåer, risikobasert prioritering, kriterier for «klar til produksjon», feilhåndtering og rapportering. Kort versjon:
|
|
265
|
+
|
|
266
|
+
- Stories er testene: hver offentlig komponent har en assertion-bærende kontraktstory i ekte nettleser, og komponenter med brukeradferd har risikobaserte interaksjonstester. Automatisk WCAG-sjekk inngår i begge nivåer (brudd feiler bygget).
|
|
267
|
+
- Full regresjon (`npm test`) kjøres på hver pull request og hver push til `main` — ingenting merges eller publiseres utestet.
|
|
268
|
+
- Feil meldes som GitHub Issues med bug-malen; alvorlighetsgrad og reproduksjonssteg er påkrevd.
|
|
269
|
+
|
|
234
270
|
## Core Principles
|
|
235
271
|
|
|
236
272
|
Every component we build should adhere to these core principles:
|
|
@@ -317,9 +353,9 @@ Your Storybook file is the official documentation. It must be clear and comprehe
|
|
|
317
353
|
|
|
318
354
|
## Using NAV/Aksel Icons
|
|
319
355
|
|
|
320
|
-
This library is designed to work seamlessly with the official icon set from NAV/Aksel.
|
|
356
|
+
This library is designed to work seamlessly with the official icon set from NAV/Aksel. Since v2, `@navikt/aksel-icons` ships as a regular dependency of `rk-designsystem` — no separate install needed. To use the icons directly in your own code:
|
|
321
357
|
|
|
322
|
-
### Install
|
|
358
|
+
### Install (only for direct use in your app)
|
|
323
359
|
|
|
324
360
|
```bash
|
|
325
361
|
# npm
|