Version Packages (#2084)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

.changeset/config.json

@@ -1,6 +1,9 @@
 {
   "$schema": "https://unpkg.com/@changesets/config@2.2.0/schema.json",
-  "changelog": ["@changesets/changelog-github", { "repo": "navikt/aksel" }],
+  "changelog": [
+    "@svitejs/changesets-changelog-github-compact",
+    { "repo": "navikt/aksel" }
+  ],
   "commit": false,
   "fixed": [
     [

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,17 +1,44 @@
-### :memo: PR Checklist
+### Description
 
-<!-- Remove non-relevant fields -->
+<!-- PR description/motivation
+add links to project-tasks, slack discussions etc here
+-->
 
-- [ ] :sparkles: New component? Add CSS-mappings to `@navikt/core/css/config/_mappings.js`.
+### Change summary
 
-- [ ] :wastebasket: Are you deprecating a CSS class? (are you removing the last known reference to a CSS class?). Add it to `@navikt/aksel-stylelint/src/deprecations.ts` with a suitable description.
+<!-- Short summary of changes in PR
+- added variant x
+- fixed bug in y
+-->
 
-- [ ] :balance_scale: Is the feature/component/code sufficiently complex to warrant tests? Add some unit-tests :test_tube:
+### PR Checklist 📝 (Remove fields after check!)
 
-- [ ] :balance_scale: Does the feature/component add some complex user-interactions? Consider adding some [interaction-tests with storybook](https://storybook.js.org/docs/react/writing-tests/interaction-testing) :test_tube:
+#### New component? ✨
 
-- [ ] :boom: Are there breaking changes? Consider adding a codemod for easier migration.
+- Check that component-styling is correctly configured in `@navikt/core/css/config/_mappings.js`. This is needed for correct build and CDN upload.
+- Check that styling is correctly exported from `@navikt/core/css/index.css`
+- Check that correct tokens for component is documented in `@navikt/core/css/tokens.json`
+- Check that only needed components and types are exported from `@navikt/core/react/src/index.ts`
+- Add JSDoc to component (see other components for reference)
+- Create storybook-stories for relevant component variations and compositions. Stories are used for [visual regression testing](https://www.chromatic.com/docs/), so make sure they are complete.
+- Is the component sufficiently complex to warrant tests? Add some unit-tests for jest.
 
-- [ ] :test_tube: Are all variations and cases shown in the storybook stories? Stories are used for [visual regression testing](https://www.chromatic.com/docs/), so make sure they are complete.
+#### Component-updates 🎉
 
-- [ ] Run `yarn changeset` for version and changelog generation
+- Revalidate if everything under `New component` is still accounted for
+- Deprecating/removing a CSS class? Add it to `@navikt/aksel-stylelint/src/deprecations.ts` with a suitable description. This helps stylelint-users keep their code clean and bug-free.
+
+#### Documentation 📝
+
+- Add/update component-demos for component `aksel.nav.no/website/pages/eksempler`
+- Create/Update documentation in sanity if needed
+  Note: Props, tokens and examples only updates to sanity on merge to main
+
+#### Versioning 🏷️
+
+- Run `yarn changeset` to generate a version-entry for change.
+- - Bug/hotfix: Patch
+- - New feature: Minor
+- - Breaking change: Major
+- Adding breaking changes? Consider adding a codemod for easier migration.
+- Breaking changes also needs documentation under "Migration"-page on website

@navikt/aksel-icons/CHANGELOG.md

@@ -1,237 +1,91 @@
 # @navikt/aksel-icons
 
-## 4.4.0
+## 4.5.0
 
-## 4.3.0
+## 4.4.2
 
-## 4.2.0
-
-## 4.1.7
-
-## 4.1.6
+## 4.4.1
 
 ## 4.1.5
 
 ### Patch Changes
 
-- [#2054](https://github.com/navikt/aksel/pull/2054) [`8f16d1571`](https://github.com/navikt/aksel/commit/8f16d1571ec7cf452c09618a9a918ee2a634c75a) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :tada: Nye ikoner
-
-  - ChevronRightLast
-  - ChevronLeftLast
-
-## 4.1.4
-
-## 4.1.3
-
-## 4.1.2
-
-## 4.1.1
-
-## 4.1.0
-
-## 4.0.0
-
-## 3.4.2
-
-## 3.4.1
-
-## 3.4.0
-
-## 3.3.1
-
-## 3.3.0
-
-## 3.2.4
+- Nye ikoner `ChevronRightLast` og `ChevronLeftLast` ([PR](https://github.com/navikt/aksel/pull/2054))
 
 ## 3.2.3
 
 ### Patch Changes
 
-- [#1998](https://github.com/navikt/aksel/pull/1998) [`53c98181c`](https://github.com/navikt/aksel/commit/53c98181c327ead3406bec3487c10232af7d463a) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :tada: Nye ikoner!
-
-  - :sparkles: FileParagraph
-  - :sparkles: FilePlus
-
-## 3.2.2
-
-## 3.2.1
-
-## 3.2.0
-
-## 3.1.3
-
-## 3.1.2
-
-## 3.1.1
-
-## 3.1.0
-
-## 3.0.1
-
-## 3.0.0
+- Nye ikoner `FileParagraph` og `FilePlus` ([PR](https://github.com/navikt/aksel/pull/1998))
 
 ## 2.9.8
 
 ### Patch Changes
 
-- [#1959](https://github.com/navikt/aksel/pull/1959) [`8790c5997`](https://github.com/navikt/aksel/commit/8790c5997e0d647419bdb5080c86781d08c196b8) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :lipstick: Statusikoner er nå tydeligere og mer konsistente.
+- Oppdatert Statusikoner til å være tydeligere og mer konsistente. ([PR](https://github.com/navikt/aksel/pull/1959))
 
 ## 2.9.7
 
 ### Patch Changes
 
-- :bug: CheckmarkIcon
+- Fikset `CheckmarkIcon`-bug
 
 ## 2.9.6
 
 ### Patch Changes
 
-- [#1956](https://github.com/navikt/aksel/pull/1956) [`8c8559009`](https://github.com/navikt/aksel/commit/8c8559009982911bc4402913656ba4cc6a223dd1) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :bug: Fikset CheckmarkCircleIcon
-
-## 2.9.5
-
-## 2.9.4
+- Fikset `CheckmarkCircleIcon`-bug ([PR](https://github.com/navikt/aksel/pull/1956))
 
 ## 2.9.3
 
 ### Patch Changes
 
-- [#1950](https://github.com/navikt/aksel/pull/1950) [`c03d53d5a`](https://github.com/navikt/aksel/commit/c03d53d5aa2dc7f06a223d48069fa21ee39bb396) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :sparkles: Nye ikoner
-
-  - :tada: BulletList
-  - :tada: NumberList
-
-## 2.9.2
-
-## 2.9.1
-
-## 2.9.0
-
-## 2.8.16
+- Nye ikoner `BulletList` og `NumberList` ([PR](https://github.com/navikt/aksel/pull/1950))
 
 ## 2.8.15
 
 ### Patch Changes
 
-- [#1928](https://github.com/navikt/aksel/pull/1928) [`dfe923582`](https://github.com/navikt/aksel/commit/dfe923582a57b41c77cfb4fbfa7c56be047ef2b0) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :tada: Lagt til nye ikoner :tada:
-
-  - HandKnot.svg
-  - HandKnotFilled.svg
-
-- [#1930](https://github.com/navikt/aksel/pull/1930) [`6682be1c8`](https://github.com/navikt/aksel/commit/6682be1c8e6562213c64e5be4bed70fef54ab865) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Alle pakker implementerer nå npm provenance (beta)
-
-## 2.8.14
+- :tada: Nye ikoner `HandKnot` og `HandKnotFilled` ([PR](https://github.com/navikt/aksel/pull/1928))
 
 ## 2.8.13
 
 ### Patch Changes
 
-- [#1921](https://github.com/navikt/aksel/pull/1921) [`ecd6241e5`](https://github.com/navikt/aksel/commit/ecd6241e5751519fbda800a5f41a613957dbf77c) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Oppdatert ikoner :tada:
-
-## 2.8.12
+- Oppdatert `InformationSquare`-ikon ([PR](https://github.com/navikt/aksel/pull/1921))
 
 ## 2.8.11
 
 ### Patch Changes
 
-- [#1909](https://github.com/navikt/aksel/pull/1909) [`270427910`](https://github.com/navikt/aksel/commit/2704279107a5fbf93048de37d014e78f6721438f) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Oppdatert ikoner
-
-## 2.8.10
-
-## 2.8.9
+- Oppdatert `VideoSlack`, `Questionmark` og `Information`-ikoner ([PR](https://github.com/navikt/aksel/pull/1909))
 
 ## 2.8.8
 
 ### Patch Changes
 
-- [`ed8e28454`](https://github.com/navikt/aksel/commit/ed8e284540a9e3a5be7d1d5e393f31db86962613) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :sparkles: Nye ikoner
-
-  - :tada: VideoSlash
-  - :tada: VideoSlashFill
-
-## 2.8.7
-
-## 2.8.6
-
-## 2.8.5
+- Nye ikoner `VideoSlash` og `VideoSlashFill`
 
 ## 2.8.4
 
 ### Patch Changes
 
-- Fikset Sourcemap-bug i Aksel-icons
-
-## 2.8.3
-
-## 2.8.2
-
-## 2.8.1
-
-## 2.8.0
-
-## 2.7.8
+- Fikset Sourcemap-bug
 
 ## 2.7.7
 
 ### Patch Changes
 
-- [`a22ac3eb7`](https://github.com/navikt/aksel/commit/a22ac3eb78135bf93d4771802475396849809c03) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :Sparkles: Nye ikoner
-
-  - :tada: CaretUpDownFilledDown
-  - :tada: CaretUpDownFilledUp
-  - :tada: CloudDown
-  - :tada: CloudDownFill
-  - :tada: CloudUp
-  - :tada: CloudUpFill
-  - :tada: HddDown
-  - :tada: HddDownFill
-  - :tada: HddUp
-  - :tada: HddUpFill
-  - :tada: Inbox
-  - :tada: InboxDown
-  - :tada: InboxDownFill
-  - :tada: InboxFill
-  - :tada: InboxUp
-  - :tada: InboxUpFill
-  - :tada: ShoppingBasket
-  - :tada: ShoppingBasketFill
-
-## 2.7.6
-
-## 2.7.5
+- Nye ikoner `CaretUpDownFilledDown`, `CaretUpDownFilledUp`, `CloudDown`, `CloudDownFill`, `CloudUp`, `CloudUpFill`, `HddDown`, `HddDownFill`, `HddUp`, `HddUpFill`, `Inbox`, `InboxDown`, `InboxDownFill`, `InboxFill`, `InboxUp`, `InboxUpFill`, `ShoppingBasket`, `ShoppingBasketFill`
 
 ## 2.7.4
 
 ### Patch Changes
 
-- [#1852](https://github.com/navikt/aksel/pull/1852) [`a4fd1dd22`](https://github.com/navikt/aksel/commit/a4fd1dd227b9b56b747f962aa0c2b2dc9b4e30a4) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Oppdatert ikonpakke med nye ikoner :rocket:
-
-  - :tada: CaretDownFill
-  - :tada: CaretLeft
-  - :tada: CaretLeftFill
-  - :tada: CaretLeftRight
-  - :tada: CaretLeftRightFill
-  - :tada: CaretRight
-  - :tada: CaretRightFill
-  - :tada: CaretUpDownFill
-  - :tada: CaretUpFill
-  - :tada: Escalator
-  - :tada: Moon
-  - :tada: MoonFill
-  - :fire: EscalatorStroke
-
-## 2.7.3
-
-## 2.7.2
-
-## 2.7.1
-
-### Patch Changes
-
-- [`7d9517cf9`](https://github.com/navikt/aksel/commit/7d9517cf90331b57441a0787a04eef66efd1b9b0) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Public-access for ny ikonpakke i GPR
+- Nye ikoner, `CaretDownFill`, `CaretLeft`, `CaretLeftFill`, `CaretLeftRight`, `CaretLeftRightFill`, `CaretRight`, `CaretRightFill`, `CaretUpDownFill`, `CaretUpFill`, `Escalator`, `Moon`, `MoonFill`. Fjernet `EscalatorStroke` ([PR](https://github.com/navikt/aksel/pull/1852))
 
 ## 2.7.0
 
 ### Minor Changes
 
-- [#1847](https://github.com/navikt/aksel/pull/1847) [`de291a972`](https://github.com/navikt/aksel/commit/de291a9722c262d40fecaec7be55b71f86e60160) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Ny ikonpakke med for core icons 3! `@navikt/aksel-icons`
+- Ny ikonpakke med for core icons 3! `@navikt/aksel-icons` ([PR](https://github.com/navikt/aksel/pull/1847))

@navikt/aksel-icons/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/aksel-icons",
-  "version": "4.4.0",
+  "version": "4.5.0",
   "author": "Aksel | NAV",
   "homepage": "https://aksel.nav.no/ikoner",
   "repository": {

@navikt/aksel-stylelint/CHANGELOG.md

@@ -1,60 +1,31 @@
 # @navikt/aksel-stylelint
 
-## 4.4.0
+## 4.5.0
 
-## 4.3.0
+## 4.4.2
 
-## 4.2.0
-
-### Minor Changes
-
-- [#2048](https://github.com/navikt/aksel/pull/2048) [`b1625ba38`](https://github.com/navikt/aksel/commit/b1625ba3882b430d678d0623922d7fb56aa724b3) Thanks [@HalvorHaugan](https://github.com/HalvorHaugan)! - Oppdatert Chat
-
-  - :sparkles: Ny prop `size` som kan settes til "small" for en mer kompakt layout
-  - :sparkles: Ny prop `variant` som erstatter `backgroundColor` og `avatarBgColor`
-  - :sparkles: `avatar` er nå valgfritt
-  - :wheelchair: Forbedret UU
-  - :lipstick: Oppdatert utseende
-
-## 4.1.7
-
-## 4.1.6
-
-## 4.1.5
-
-## 4.1.4
-
-## 4.1.3
-
-## 4.1.2
-
-## 4.1.1
+## 4.4.1
 
 ## 4.1.0
 
 ### Minor Changes
 
-- [#2035](https://github.com/navikt/aksel/pull/2035) [`7b42f536a`](https://github.com/navikt/aksel/commit/7b42f536aa90c1b5dbe2b19f1bbe292701546420) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :tada: Oppdatert Chips
-
-  - Toggle Chips har nå varianter: neutral og action
-  - Toggle Chips har nå en ny prop: `checkmark` som slår av/på checkmark ved selected-state
-
-## 4.0.0
+- Deprecated klassenavn `navds-chips--icon-left` ([PR](https://github.com/navikt/aksel/pull/2035))
 
 ## 3.4.2
 
 ### Patch Changes
 
-- [#2017](https://github.com/navikt/aksel/pull/2017) [`7615dbbb5`](https://github.com/navikt/aksel/commit/7615dbbb54c7c96e2252366188547b27b2ac1142) Thanks [@JulianNymark](https://github.com/JulianNymark)! - add missing dependency
+- La til riktige dependencies ([PR](https://github.com/navikt/aksel/pull/2017))
 
 ## 3.4.1
 
 ### Patch Changes
 
-- :bug: Stylelint hotfix, inkluderer nå dist-mappe (kanskje..)
+- Inkluderer nå dist-mappe i release
 
 ## 3.4.0
 
 ### Minor Changes
 
-- [#1973](https://github.com/navikt/aksel/pull/1973) [`61c411421`](https://github.com/navikt/aksel/commit/61c4114214841ec42f48e1abd0d72d2a42d265ab) Thanks [@JulianNymark](https://github.com/JulianNymark)! - add stylelint plugin
+- Stylelint-pakke for Aksel ([PR](https://github.com/navikt/aksel/pull/1973))

@navikt/aksel-stylelint/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/aksel-stylelint",
-  "version": "4.4.0",
+  "version": "4.5.0",
   "author": "Aksel | NAV",
   "homepage": "https://aksel.nav.no/grunnleggende/kode/stylelint",
   "repository": {
@@ -35,8 +35,8 @@
     "dev": "yarn watch:lint"
   },
   "devDependencies": {
-    "@navikt/ds-css": "^4.4.0",
-    "@navikt/ds-tokens": "^4.4.0",
+    "@navikt/ds-css": "^4.5.0",
+    "@navikt/ds-tokens": "^4.5.0",
     "@types/jest": "^29.0.0",
     "concurrently": "7.2.1",
     "copyfiles": "2.4.1",

@navikt/aksel/CHANGELOG.md

@@ -1,292 +1,36 @@
 # @navikt/aksel
 
-## 4.4.0
+## 4.5.0
 
 ### Patch Changes
 
-- Updated dependencies [[`de3626958`](https://github.com/navikt/aksel/commit/de3626958266d1271840fa341c36500ab66b573d)]:
-  - @navikt/ds-css@4.4.0
+- Updated dependencies [[`b05958863`](https://github.com/navikt/aksel/commit/b05958863b1adadb1b6a3fcceb4477e7411b66b5), [`b05958863`](https://github.com/navikt/aksel/commit/b05958863b1adadb1b6a3fcceb4477e7411b66b5)]:
+  - @navikt/ds-css@4.5.0
 
-## 4.3.0
-
-### Patch Changes
-
-- Updated dependencies [[`99c08b8e4`](https://github.com/navikt/aksel/commit/99c08b8e4ab33acd20a21719986452652ffe3c57), [`d39ed906c`](https://github.com/navikt/aksel/commit/d39ed906c61149ac823ebab2e8974a105e592163)]:
-  - @navikt/ds-css@4.3.0
-
-## 4.2.0
-
-### Patch Changes
-
-- Updated dependencies [[`b1625ba38`](https://github.com/navikt/aksel/commit/b1625ba3882b430d678d0623922d7fb56aa724b3)]:
-  - @navikt/ds-css@4.2.0
-
-## 4.1.7
-
-### Patch Changes
-
-- Updated dependencies [[`42b5af64a`](https://github.com/navikt/aksel/commit/42b5af64ab35d0f2d126d41f8fc3e61fe2834b36)]:
-  - @navikt/ds-css@4.1.7
-
-## 4.1.6
+## 4.4.2
 
 ### Patch Changes
 
 - Updated dependencies []:
-  - @navikt/ds-css@4.1.6
+  - @navikt/ds-css@4.4.2
 
-## 4.1.5
+## 4.4.1
 
 ### Patch Changes
 
-- Updated dependencies []:
-  - @navikt/ds-css@4.1.5
-
-## 4.1.4
-
-### Patch Changes
-
-- Updated dependencies [[`e06096105`](https://github.com/navikt/aksel/commit/e060961050c75ec815e5c125001f1ff99106e298)]:
-  - @navikt/ds-css@4.1.4
-
-## 4.1.3
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@4.1.3
-
-## 4.1.2
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@4.1.2
-
-## 4.1.1
-
-### Patch Changes
-
-- Updated dependencies [[`91343563c`](https://github.com/navikt/aksel/commit/91343563c916a554d8ade5401c28ab4c3b3e26af)]:
-  - @navikt/ds-css@4.1.1
-
-## 4.1.0
-
-### Patch Changes
-
-- Updated dependencies [[`7b42f536a`](https://github.com/navikt/aksel/commit/7b42f536aa90c1b5dbe2b19f1bbe292701546420), [`c028f36e2`](https://github.com/navikt/aksel/commit/c028f36e2bc58223ebf8b655980dde7eafb30add), [`b2f796d68`](https://github.com/navikt/aksel/commit/b2f796d681f1c1d76d26d1fd743268c8c618a854), [`db8c38a09`](https://github.com/navikt/aksel/commit/db8c38a094cd183db54aebecb62d5b223920a040)]:
-  - @navikt/ds-css@4.1.0
+- Updated dependencies [[`415632675`](https://github.com/navikt/aksel/commit/4156326752eaf7a97855b33653850362dada8788)]:
+  - @navikt/ds-css@4.4.1
 
 ## 4.0.0
 
 ### Major Changes
 
-- [#2026](https://github.com/navikt/aksel/pull/2026) [`895bdc08e`](https://github.com/navikt/aksel/commit/895bdc08e50647d9b9186cbf0e9ab069323de56c) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :test-tube: Datepicker og Monthpicker er nå ute av beta. Kjør codemod for migrering, eller `cmd/ctrl + shift + f` og erstatt `UNSAFE_` med ``
+- Codemod for migrering av Datepicker/Monthpicker ut av Beta. `npx @navikt/aksel codemod v4-date` ([PR](https://github.com/navikt/aksel/pull/2026))
 
-  - UNSAFE-prefix er fjernet fra Datepicker og Monthpicker
-
-  ```bash
-  npx @navikt/aksel codemod v4-date
-  ```
-
-- [#2026](https://github.com/navikt/aksel/pull/2026) [`895bdc08e`](https://github.com/navikt/aksel/commit/895bdc08e50647d9b9186cbf0e9ab069323de56c) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :truck: Komponenter i `@navikt/ds-react-internal` er flyttet over til `@navikt/ds-react`
-
-  - `<Header />` er renamet til `<InternalHeader />`
-  - Dropdown, Timeline og InternalHeader(Header) er flyttet over til `@navikt/ds-react`
-  - All styling fra `@navikt/ds-css-internal` er flyttet til `@navikt/ds-css` og classname-prefix er endret fra `navdsi` -> `navds` for flyttede komponenter. Sett opp [stylelint med configen vår](https://aksel.nav.no/grunnleggende/kode/stylelint), så vil du få feilmelding om du bruker gamle klassenavn.
-  - Fikset cascading-problem mellom dropdown og popover. Dropdown blir ikke lengre påvirket av import-rekkefølge av popover.
-  - Styling for flyttede komponenter finnes nå på CDN (https://aksel.nav.no/grunnleggende/kode/css-import)
-
-  Kjør codemod for migrering:
-
-  ```bash
-  // React
-  npx @navikt/aksel codemod v4-internal-react
-
-  // CSS
-  npx @navikt/aksel codemod v4-internal-css
-  ```
-
-### Patch Changes
-
-- Updated dependencies [[`895bdc08e`](https://github.com/navikt/aksel/commit/895bdc08e50647d9b9186cbf0e9ab069323de56c), [`895bdc08e`](https://github.com/navikt/aksel/commit/895bdc08e50647d9b9186cbf0e9ab069323de56c)]:
-  - @navikt/ds-css@4.0.0
-
-## 3.4.2
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@3.4.2
-
-## 3.4.1
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@3.4.1
-
-## 3.4.0
-
-### Patch Changes
-
-- Updated dependencies [[`b958d41a2`](https://github.com/navikt/aksel/commit/b958d41a20c66327658514fcf24ae20893c9531a)]:
-  - @navikt/ds-css@3.4.0
-
-## 3.3.1
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@3.3.1
-
-## 3.3.0
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@3.3.0
-
-## 3.2.4
-
-### Patch Changes
-
-- Updated dependencies [[`30eee0dac`](https://github.com/navikt/aksel/commit/30eee0dac4e3e5a1379033283a6885e646e80458)]:
-  - @navikt/ds-css@3.2.4
-
-## 3.2.3
-
-### Patch Changes
-
-- Updated dependencies [[`475e994f4`](https://github.com/navikt/aksel/commit/475e994f494b2080ffc05eb1684b6a244e3e2969), [`444e905e0`](https://github.com/navikt/aksel/commit/444e905e01965fd5cac40ff20c5225b072e67221)]:
-  - @navikt/ds-css@3.2.3
-
-## 3.2.2
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@3.2.2
-
-## 3.2.1
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@3.2.1
-
-## 3.2.0
-
-### Patch Changes
-
-- Updated dependencies [[`affcab14c`](https://github.com/navikt/aksel/commit/affcab14c3d536929dfa64a36f5b43f9d0e8c3b7)]:
-  - @navikt/ds-css@3.2.0
-
-## 3.1.3
-
-### Patch Changes
-
-- Updated dependencies [[`e8ecf309a`](https://github.com/navikt/aksel/commit/e8ecf309a910e47fd3cea6c54cd993ab1196910f)]:
-  - @navikt/ds-css@3.1.3
-
-## 3.1.2
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@3.1.2
-
-## 3.1.1
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@3.1.1
-
-## 3.1.0
-
-### Patch Changes
-
-- Updated dependencies [[`9d2cd9e7f`](https://github.com/navikt/aksel/commit/9d2cd9e7fffb3cf6310c88229ee39ea85db19bca), [`f1c4c46eb`](https://github.com/navikt/aksel/commit/f1c4c46ebb0522561483f18e3b86b190cf9cc372)]:
-  - @navikt/ds-css@3.1.0
-
-## 3.0.1
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@3.0.1
-
-## 3.0.0
-
-### Patch Changes
-
-- Updated dependencies [[`166ee5feb`](https://github.com/navikt/aksel/commit/166ee5feb3c987c4e633eb449812116bfd865d3f), [`166ee5feb`](https://github.com/navikt/aksel/commit/166ee5feb3c987c4e633eb449812116bfd865d3f)]:
-  - @navikt/ds-css@3.0.0
-
-## 2.9.8
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@2.9.8
-
-## 2.9.7
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@2.9.7
-
-## 2.9.6
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@2.9.6
-
-## 2.9.5
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@2.9.5
+- Codemods for migrering fra `@navikt/ds-react-internal` til `@navikt/ds-react` [Guide](https://aksel.nav.no/grunnleggende/kode/migrering#h3b8538e1981d) ([PR](https://github.com/navikt/aksel/pull/2026))
 
 ## 2.9.4
 
 ### Patch Changes
 
-- [#1952](https://github.com/navikt/aksel/pull/1952) [`27b2b4a11`](https://github.com/navikt/aksel/commit/27b2b4a11caf5ca05c96c686c453653d8a900e5f) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :truck: Flyttet Codemods from `@navikt/ds-codemods` -> `@navikt/aksel`.
-
-  - `@navikt/ds-codemods` vil bli deprecated ettehvert.
-
-- Updated dependencies []:
-  - @navikt/ds-css@2.9.4
-
-## 2.9.3
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@2.9.3
-
-## 2.9.2
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@2.9.2
-
-## 2.9.1
-
-### Patch Changes
-
-- Updated dependencies []:
-  - @navikt/ds-css@2.9.1
-
-## 2.9.0
-
-### Patch Changes
-
-- Updated dependencies [[`657b7f3f3`](https://github.com/navikt/aksel/commit/657b7f3f3e62c5ce3173e6c95a29fcd237ce7343)]:
-  - @navikt/ds-css@2.9.0
+- :truck: Flyttet Codemods fra `@navikt/ds-codemods` -> `@navikt/aksel`. `@navikt/ds-codemods` regnes nå som deprecated ([PR](https://github.com/navikt/aksel/pull/1952))

@navikt/aksel/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/aksel",
-  "version": "4.4.0",
+  "version": "4.5.0",
   "description": "Aksel command line interface. Handles css-imports, codemods and more",
   "author": "Aksel | NAV designsystem team",
   "license": "MIT",
@@ -29,7 +29,7 @@
   },
   "homepage": "https://aksel.nav.no/grunnleggende/kode/kommandolinje",
   "dependencies": {
-    "@navikt/ds-css": "4.4.0",
+    "@navikt/ds-css": "4.5.0",
     "axios": "1.3.6",
     "chalk": "4.1.0",
     "clipboardy": "^2.3.0",

@navikt/core/css/CHANGELOG.md

@@ -1,528 +1,263 @@
 # @navikt/ds-css
 
+## 4.5.0
+
+### Minor Changes
+
+- - Alert: La til `closeButton`-prop ([#2079](https://github.com/navikt/aksel/pull/2079))
+
+### Patch Changes
+
+- - Button: Fikset outline-bug i tertiary-variant ved `:active`-state ([#2079](https://github.com/navikt/aksel/pull/2079))
+
+## 4.4.2
+
+## 4.4.1
+
+### Patch Changes
+
+- :lipstick: Chat: fjernet border, satt avatar svg til 24x24px, byttet om "subtle" og "neutral" ([#2077](https://github.com/navikt/aksel/pull/2077))
+
 ## 4.4.0
 
 ### Minor Changes
 
-- [#2041](https://github.com/navikt/aksel/pull/2041) [`de3626958`](https://github.com/navikt/aksel/commit/de3626958266d1271840fa341c36500ab66b573d) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Shadow-tokens er oppdatert til mer tydeligere varianter
+- Shadow-tokens er oppdatert: Datepicker har nå ikke border, Modal bruker shadow-xlarge, LinkCard bruker shadow-xsmall ([PR](https://github.com/navikt/aksel/pull/2041))
 
 ## 4.3.0
 
 ### Minor Changes
 
-- [#2069](https://github.com/navikt/aksel/pull/2069) [`99c08b8e4`](https://github.com/navikt/aksel/commit/99c08b8e4ab33acd20a21719986452652ffe3c57) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Popover og Helptext har nå luft mot siden av skjerm på mindre flater
+- Popover/Helptext: Maksbredde på 100vw - 1.5rem. Treffer ikke lengre kanten på skjermen. ([PR](https://github.com/navikt/aksel/pull/2069))
 
 ### Patch Changes
 
-- [#2067](https://github.com/navikt/aksel/pull/2067) [`d39ed906c`](https://github.com/navikt/aksel/commit/d39ed906c61149ac823ebab2e8974a105e592163) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :bug: Nested ExpansionCard fikk styling fra parent
+- ExpansionCard: Ved nesting av komponetene fikk man styling fra parent ([PR](https://github.com/navikt/aksel/pull/2067))
 
 ## 4.2.0
 
 ### Minor Changes
 
-- [#2048](https://github.com/navikt/aksel/pull/2048) [`b1625ba38`](https://github.com/navikt/aksel/commit/b1625ba3882b430d678d0623922d7fb56aa724b3) Thanks [@HalvorHaugan](https://github.com/HalvorHaugan)! - Oppdatert Chat
-
-  - :sparkles: Ny prop `size` som kan settes til "small" for en mer kompakt layout
-  - :sparkles: Ny prop `variant` som erstatter `backgroundColor` og `avatarBgColor`
-  - :sparkles: `avatar` er nå valgfritt
-  - :wheelchair: Forbedret UU
-  - :lipstick: Oppdatert utseende
-
-## 4.1.7
-
-### Patch Changes
-
-- [`42b5af64a`](https://github.com/navikt/aksel/commit/42b5af64ab35d0f2d126d41f8fc3e61fe2834b36) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Fikset jsdom-problemer ved rendring av Timeline
-
-## 4.1.6
-
-## 4.1.5
+- Chat: `small`-size, innebygde varianter for farge og oppdatert utseende. ([PR](https://github.com/navikt/aksel/pull/2048))
 
 ## 4.1.4
 
 ### Patch Changes
 
-- [#2049](https://github.com/navikt/aksel/pull/2049) [`e06096105`](https://github.com/navikt/aksel/commit/e060961050c75ec815e5c125001f1ff99106e298) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :bug: Subtle-description på form-elementer brakk bruk av Readmore
-
-## 4.1.3
-
-## 4.1.2
+- Readmore: setter nå eksplisitt color for å ikke arve text-subtle fra parent. ([PR](https://github.com/navikt/aksel/pull/2049))
 
 ## 4.1.1
 
 ### Patch Changes
 
-- [`91343563c`](https://github.com/navikt/aksel/commit/91343563c916a554d8ade5401c28ab4c3b3e26af) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :bug: Fikset markering av tekst i skeleton.
+- :bug: Fikset cursor-markering av tekst i skeleton.
 
 ## 4.1.0
 
 ### Minor Changes
 
-- [#2035](https://github.com/navikt/aksel/pull/2035) [`7b42f536a`](https://github.com/navikt/aksel/commit/7b42f536aa90c1b5dbe2b19f1bbe292701546420) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :tada: Oppdatert Chips
+- Chips: `neutral` og `action`-varianter av Chips.Toggle. Opt-out mulighet for Checkmark. Oppdatert checkmark-ikon ([PR](https://github.com/navikt/aksel/pull/2035))
 
-  - Toggle Chips har nå varianter: neutral og action
-  - Toggle Chips har nå en ny prop: `checkmark` som slår av/på checkmark ved selected-state
-
-- [#2036](https://github.com/navikt/aksel/pull/2036) [`b2f796d68`](https://github.com/navikt/aksel/commit/b2f796d681f1c1d76d26d1fd743268c8c618a854) Thanks [@KenAJoh](https://github.com/KenAJoh)! - - Oppdatert text-subtle og icon-subtle tokens til 700-skala (tidligere 600).
-
-  - Icon-subtle bruker nå grayalpha.
-  - Alle description-felter på fieldsets har nå text-subtle som farge.
-
-- [#1821](https://github.com/navikt/aksel/pull/1821) [`db8c38a09`](https://github.com/navikt/aksel/commit/db8c38a094cd183db54aebecb62d5b223920a040) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :tada: Ny komponent Skeleton!
-
-  - varianter: text, circle, rounded og rectangle
-
-### Patch Changes
-
-- [#2027](https://github.com/navikt/aksel/pull/2027) [`c028f36e2`](https://github.com/navikt/aksel/commit/c028f36e2bc58223ebf8b655980dde7eafb30add) Thanks [@JulianNymark](https://github.com/JulianNymark)! - :sparkles: La til `indent`-prop på Accordion
+- Alle description-felter på fieldsets har nå `text-subtle` som farge. ([PR](https://github.com/navikt/aksel/pull/2036))
 
 ## 4.0.0
 
 ### Major Changes
 
-- [#2026](https://github.com/navikt/aksel/pull/2026) [`895bdc08e`](https://github.com/navikt/aksel/commit/895bdc08e50647d9b9186cbf0e9ab069323de56c) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :test-tube: Datepicker og Monthpicker er nå ute av beta. Kjør codemod for migrering, eller `cmd/ctrl + shift + f` og erstatt `UNSAFE_` med ``
+- All styling fra `@navikt/ds-css-internal` er flyttet til `@navikt/ds-css`. ([PR](https://github.com/navikt/aksel/pull/2026))
 
-  - UNSAFE-prefix er fjernet fra Datepicker og Monthpicker
+- classname-prefix er endret fra `navdsi` -> `navds` for flyttede komponenter.
 
-  ```bash
-  npx @navikt/aksel codemod v4-date
-  ```
+- Fikset cascading-problem mellom dropdown og popover. Dropdown blir ikke lengre påvirket av import-rekkefølge av popover.
 
-- [#2026](https://github.com/navikt/aksel/pull/2026) [`895bdc08e`](https://github.com/navikt/aksel/commit/895bdc08e50647d9b9186cbf0e9ab069323de56c) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :truck: Komponenter i `@navikt/ds-react-internal` er flyttet over til `@navikt/ds-react`
-
-  - `<Header />` er renamet til `<InternalHeader />`
-  - Dropdown, Timeline og InternalHeader(Header) er flyttet over til `@navikt/ds-react`
-  - All styling fra `@navikt/ds-css-internal` er flyttet til `@navikt/ds-css` og classname-prefix er endret fra `navdsi` -> `navds` for flyttede komponenter. Sett opp [stylelint med configen vår](https://aksel.nav.no/grunnleggende/kode/stylelint), så vil du få feilmelding om du bruker gamle klassenavn.
-  - Fikset cascading-problem mellom dropdown og popover. Dropdown blir ikke lengre påvirket av import-rekkefølge av popover.
-  - Styling for flyttede komponenter finnes nå på CDN (https://aksel.nav.no/grunnleggende/kode/css-import)
-
-  Kjør codemod for migrering:
-
-  ```bash
-  // React
-  npx @navikt/aksel codemod v4-internal-react
-
-  // CSS
-  npx @navikt/aksel codemod v4-internal-css
-  ```
-
-## 3.4.2
-
-## 3.4.1
+- Styling for flyttede komponenter finnes nå på CDN [Guide](https://aksel.nav.no/grunnleggende/kode/css-import)
 
 ## 3.4.0
 
 ### Minor Changes
 
-- [#2010](https://github.com/navikt/aksel/pull/2010) [`b958d41a2`](https://github.com/navikt/aksel/commit/b958d41a20c66327658514fcf24ae20893c9531a) Thanks [@HalvorHaugan](https://github.com/HalvorHaugan)! - Ny variant "moderate" i Tag
-
-## 3.3.1
-
-## 3.3.0
-
-## 3.2.4
-
-### Patch Changes
-
-- [#2000](https://github.com/navikt/aksel/pull/2000) [`30eee0dac`](https://github.com/navikt/aksel/commit/30eee0dac4e3e5a1379033283a6885e646e80458) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :bug: Search støtter nå htmlSize-prop
+- Tag: `moderate`-variant ([PR](https://github.com/navikt/aksel/pull/2010))
 
 ## 3.2.3
 
 ### Patch Changes
 
-- [#1993](https://github.com/navikt/aksel/pull/1993) [`475e994f4`](https://github.com/navikt/aksel/commit/475e994f494b2080ffc05eb1684b6a244e3e2969) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :bug: Fikset small-variant av datepicker-input
+- Datepicker: Fikset small-variant av datepicker-input. ([PR](https://github.com/navikt/aksel/pull/1993))
 
-  - :recycle: Refactored Datepicker.Input-button for bugfix
-
-- [#1994](https://github.com/navikt/aksel/pull/1994) [`444e905e0`](https://github.com/navikt/aksel/commit/444e905e01965fd5cac40ff20c5225b072e67221) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :tada: CopyButton har nå en `xsmall`-variant
-
-  - Kan nå lettere brukes i tabeller
-
-## 3.2.2
-
-## 3.2.1
-
-## 3.2.0
-
-### Minor Changes
-
-- [#1982](https://github.com/navikt/aksel/pull/1982) [`affcab14c`](https://github.com/navikt/aksel/commit/affcab14c3d536929dfa64a36f5b43f9d0e8c3b7) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :sparkles: Ny komponent `<CopyButton />`!
-
-  - Erstatter `<CopyToClipboard />` fra `@navikt/ds-react-internal`
-  - CopyToClipboard er markert som deprecated. Den vil fortsatt fungere, men noen lintere vil kunne ende opp med å klage på den.
+- CopyButton: `xsmall`-size for bruk i tabeller ([PR](https://github.com/navikt/aksel/pull/1994))
 
 ## 3.1.3
 
 ### Patch Changes
 
-- [#1976](https://github.com/navikt/aksel/pull/1976) [`e8ecf309a`](https://github.com/navikt/aksel/commit/e8ecf309a910e47fd3cea6c54cd993ab1196910f) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :lipstick: Oppdatert utseende for ToggleGroup
-
-  - Medium og Small er begge 10px lavere
-  - Mindre border-radius
-
-## 3.1.2
-
-## 3.1.1
+- :lipstick: Oppdatert utseende for ToggleGroup. `Medium` og `Small`-size er begge 10px lavere, mindre border-radius ([PR](https://github.com/navikt/aksel/pull/1976))
 
 ## 3.1.0
 
 ### Minor Changes
 
-- [#1966](https://github.com/navikt/aksel/pull/1966) [`f1c4c46eb`](https://github.com/navikt/aksel/commit/f1c4c46ebb0522561483f18e3b86b190cf9cc372) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :lipstick: Alle komponenter bruker nå default `:focus-visible` for fokusmarkering.
-  (Alle komponenter som bruker `:focus-visible` har også en fallback for `:focus`)
+- Alle komponenter bruker nå default `:focus-visible` for fokusmarkering. Medfølger også fallback for `:focus` ([PR](https://github.com/navikt/aksel/pull/1966))
 
 ### Patch Changes
 
-- [#1967](https://github.com/navikt/aksel/pull/1967) [`9d2cd9e7f`](https://github.com/navikt/aksel/commit/9d2cd9e7fffb3cf6310c88229ee39ea85db19bca) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :lipstick: Oppdatert Label og Description spacing for skjemakomponenter
-
-## 3.0.1
+- Oppdatert Label og Description spacing for skjemakomponenter ([PR](https://github.com/navikt/aksel/pull/1967))
 
 ## 3.0.0
 
 ### Major Changes
 
-- [#1964](https://github.com/navikt/aksel/pull/1964) [`166ee5feb`](https://github.com/navikt/aksel/commit/166ee5feb3c987c4e633eb449812116bfd865d3f) Thanks [@KenAJoh](https://github.com/KenAJoh)! - **Accordion**
-
-  - Accordion oppdatet til å ha chevron left-aligned.
-  - Neutral-variant lagt til
-  - Diverse nye size-options for heading og paddinger.
-  - Deler av Accordion-CSS er refaktorert. Dette vil kunne brekke overskrevne stiler.
-
-- [#1964](https://github.com/navikt/aksel/pull/1964) [`166ee5feb`](https://github.com/navikt/aksel/commit/166ee5feb3c987c4e633eb449812116bfd865d3f) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Aksels løsninger bruker nå `@navikt/aksel-icons`
-
-  **Sideeffects av ikonendringer**
-
-  - Komponenter som tidligere brukte Expand-ikon har fått oppdatert animasjon (table, readmore og accordion)
-  - Alert bruker samme ikonstørrelse for alle størrelser
-  - Chips har justert padding/ikonstørrelser
-  - Datepicker hover-bug på knapper er fikset
-  - Helptekst bruker nå et custom-ikon.
-  - Select har fått justert padding rundt ikon
-  - Switch bruker samme checkmark som checkbox, er nå avrundet
-  - ReadMore har justert margin for alignment med ikon, fjernet content-animasjon
-  - Tabs bruker default text-default nå
-  - Stepper har endret hvordan den styler checkmark-ikon.
-
-## 2.9.8
-
-## 2.9.7
-
-## 2.9.6
-
-## 2.9.5
-
-## 2.9.4
-
-## 2.9.3
-
-## 2.9.2
-
-## 2.9.1
+- Accordion: Chevron er left-aligned, deler av styling er refaktorert, `size`-props og `neutral`-variant ([PR](https://github.com/navikt/aksel/pull/1964))
 
 ## 2.9.0
 
 ### Minor Changes
 
-- [#1941](https://github.com/navikt/aksel/pull/1941) [`657b7f3f3`](https://github.com/navikt/aksel/commit/657b7f3f3e62c5ce3173e6c95a29fcd237ce7343) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :tada: CSS nå tilgjengelig som separate filer
-
-  - Kan lastest fra CDN
-  - Tilbys nå i minified-versjoner
-  - Kommandoline: `npx @navikt/aksel css-imports` for å raskt komme i gang med CSS-optimalisering
-
-## 2.8.16
-
-## 2.8.15
-
-### Patch Changes
-
-- [#1930](https://github.com/navikt/aksel/pull/1930) [`6682be1c8`](https://github.com/navikt/aksel/commit/6682be1c8e6562213c64e5be4bed70fef54ab865) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Alle pakker implementerer nå npm provenance (beta)
-
-## 2.8.14
-
-### Patch Changes
-
-- [`f0d9a8853`](https://github.com/navikt/aksel/commit/f0d9a8853f56854a4049bd3f6cc34968e9d6c380) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Fixes shown month on open in Datepicker/MonthPicker, better handling of out-of-range 'today'
-
-## 2.8.13
-
-## 2.8.12
-
-## 2.8.11
-
-## 2.8.10
+- CSS nå tilgjengelig som separate filer: Kan lastest fra CDN, minified-versjoner tilgjengelig ([PR](https://github.com/navikt/aksel/pull/1941))
 
 ## 2.8.9
 
 ### Patch Changes
 
-- [#1905](https://github.com/navikt/aksel/pull/1905) [`212194964`](https://github.com/navikt/aksel/commit/212194964c4dd576e1ffc031316dff8cbe5016a2) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :sparkles: Padding/border-radius tokens for button.css
-
-## 2.8.8
+- Button: Padding/border-radius tokens ([PR](https://github.com/navikt/aksel/pull/1905))
 
 ## 2.8.7
 
 ### Patch Changes
 
-- [`7f3f025db`](https://github.com/navikt/aksel/commit/7f3f025db2ad605df4240605a733d10d08db753a) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Fikset typografi for radio, checkbox. Button token for tertiary
+- Button: token for tertiary
 
 ## 2.8.6
 
 ### Patch Changes
 
-- [`2eb358ad8`](https://github.com/navikt/aksel/commit/2eb358ad888979d21c385b3900973946f3f466be) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Alert, Chips og ErrorSummary har nå bedre utvalg av tokens
+- Alert, Chips og ErrorSummary har nå bedre utvalg av tokens
 
 ## 2.8.5
 
 ### Patch Changes
 
-- [`f66437082`](https://github.com/navikt/aksel/commit/f664370826ed51bda7ad681e1f1799c26d2c1f0a) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :art: Accordion-tokens for header bakgrunn
+- Accordion: tokens for header-bakgrunn
 
-- [#1879](https://github.com/navikt/aksel/pull/1879) [`55b585618`](https://github.com/navikt/aksel/commit/55b585618341a4d8bf26ed9b9e129d897b1600dc) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :bug: Fikset tekstfarge i select på iphone
-
-## 2.8.4
-
-## 2.8.3
+- Select: Fikset tekstfarge på iphone ([PR](https://github.com/navikt/aksel/pull/1879))
 
 ## 2.8.2
 
 ### Patch Changes
 
-- [#1870](https://github.com/navikt/aksel/pull/1870) [`9c495cf50`](https://github.com/navikt/aksel/commit/9c495cf5037a7453e51e273ab93e4232576f4958) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Oppdatert typografi for ExpansioCard
-
-## 2.8.1
-
-## 2.8.0
-
-### Minor Changes
-
-- [#1820](https://github.com/navikt/aksel/pull/1820) [`c6d51a019`](https://github.com/navikt/aksel/commit/c6d51a01902e4fd7916a422e17ed175f39acd458) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :tada: Ny komponent! ExpansionCard. Oppfølger fra gammel Ekspanderbartpanel.
+- ExpansioCard: Oppdatert typografi ([PR](https://github.com/navikt/aksel/pull/1870))
 
 ## 2.7.8
 
 ### Patch Changes
 
-- [#1863](https://github.com/navikt/aksel/pull/1863) [`7ace69f21`](https://github.com/navikt/aksel/commit/7ace69f215760bbb5bf997670c897403d8ee558d) Thanks [@it-vegard](https://github.com/it-vegard)! - Added focus indicator for tabpanel
-
-## 2.7.7
-
-## 2.7.6
+- Tabs: La til focus-markering for Tabs.Panel ([PR](https://github.com/navikt/aksel/pull/1863))
 
 ## 2.7.5
 
 ### Patch Changes
 
-- :bug: Fikset token-bug i togglegroup
-
-## 2.7.4
-
-## 2.7.3
-
-## 2.7.2
-
-## 2.7.1
-
-## 2.7.0
-
-## 2.6.2
-
-## 2.6.1
-
-## 2.6.0
-
-## 2.5.1
-
-## 2.5.0
+- ToggleGroup: Fikset token-bug
 
 ## 2.4.3
 
 ### Patch Changes
 
-- [`f962bc781`](https://github.com/navikt/aksel/commit/f962bc7816027c24e334d9754c3e07cda951cf56) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Fikset disabled-opacity bug i select for Chrome
+- Select: Fikset disabled + opacity bug for Chrome
 
 ## 2.4.2
 
 ### Patch Changes
 
-- [#1823](https://github.com/navikt/aksel/pull/1823) [`a7ce61f84`](https://github.com/navikt/aksel/commit/a7ce61f840e5bfaafc4f70e550167fe0095555b8) Thanks [@kschieren](https://github.com/kschieren)! - added support for nested lists
-
-## 2.4.1
-
-## 2.4.0
-
-### Minor Changes
-
-- [#1807](https://github.com/navikt/aksel/pull/1807) [`70eeb24b3`](https://github.com/navikt/aksel/commit/70eeb24b38ac871c7f2e31e1621b949669c401b6) Thanks [@kschieren](https://github.com/kschieren)! - Added List component
+- List: La til støtte for nesting ([PR](https://github.com/navikt/aksel/pull/1823))
 
 ## 2.3.1
 
 ### Patch Changes
 
-- [`241b2e678`](https://github.com/navikt/aksel/commit/241b2e678f1f40909e2d36fe095dcbce8673f174) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Fikset feil bruk av fallback-tokens i textarea, timeline
+- Fikset feil bruk av fallback-tokens i Textarea og Timeline
 
 ## 2.3.0
 
 ### Minor Changes
 
-- [#1813](https://github.com/navikt/aksel/pull/1813) [`7702c6527`](https://github.com/navikt/aksel/commit/7702c65275a4d86a8260852d091e6dd4cfe9217c) Thanks [@ingfo](https://github.com/ingfo)! - Fiksa sentrering av tekst i Select i Firefox
+- Select: Fikset sentrering av tekst i Firefox ([PR](https://github.com/navikt/aksel/pull/1813))
 
 ### Patch Changes
 
-- [`51b62cca7`](https://github.com/navikt/aksel/commit/51b62cca7b857e92669cd0b09e620b131faf80e5) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Select small 34px høyde -> 32px
+- Select: `small`-variant er nå 32px (var 34px)
 
 ## 2.2.0
 
 ### Minor Changes
 
-- [#1789](https://github.com/navikt/aksel/pull/1789) [`c0929a534`](https://github.com/navikt/aksel/commit/c0929a534dc8effece5435f8be550cb7931a52b1) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Button og ToggleGroup har nå en neutral-variant, oppdatert neutral-tokens
+- ToggleGroup: `Neutral`-variant. ([PR](https://github.com/navikt/aksel/pull/1789))
 
-## 2.1.7
-
-## 2.1.6
-
-## 2.1.5
-
-## 2.1.4
-
-## 2.1.3
+- Button: `Neutral`-variant.
 
 ## 2.1.2
 
 ### Patch Changes
 
-- [`62f36da5e`](https://github.com/navikt/aksel/commit/62f36da5e74fc7f53414d42b310c3b57597795bc) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Small textfield har nå 8px horisontal padding (4px før)
-
-## 2.1.1
-
-## 2.1.0
-
-## 2.0.18
-
-## 2.0.17
-
-## 2.0.16
-
-## 2.0.15
-
-### Patch Changes
-
-- [#1748](https://github.com/navikt/aksel/pull/1748) [`22dfd8e60`](https://github.com/navikt/aksel/commit/22dfd8e60315c421749394d35e41f412a00a7593) Thanks [@KenAJoh](https://github.com/KenAJoh)! - toptextPosition prop i Chat for horisontal plassering av navn og dato.
-
-## 2.0.14
-
-## 2.0.13
+- TextField: `small`-variant har nå 8px horisontal padding (før 4px)
 
 ## 2.0.12
 
 ### Patch Changes
 
-- [#1737](https://github.com/navikt/aksel/pull/1737) [`8a1ef5e7e`](https://github.com/navikt/aksel/commit/8a1ef5e7e2c066cb80c13e14329e1585e2c427f8) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :bug: Fikset default visuell error-state for radio
-
-## 2.0.11
-
-## 2.0.10
-
-## 2.0.9
-
-## 2.0.8
-
-## 2.0.7
-
-## 2.0.6
+- Radio: Fikset default visuell error-state ([PR](https://github.com/navikt/aksel/pull/1737))
 
 ## 2.0.5
 
 ### Patch Changes
 
-- Reverserte border-width endrind i button
-
-## 2.0.4
-
-## 2.0.3
-
-## 2.0.2
+- Button: Reverserte border-width endrinder (var 1.5px, nå 2px)
 
 ## 2.0.1
 
 ### Patch Changes
 
-- [`e8007328d`](https://github.com/navikt/aksel/commit/e8007328db3f6d5be696cf24f03304c79be0f3f7) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Bugfixer ved bruk av tokens
+- Bugfixer ved bruk av tokens oppdatert i v2.0.0
 
 ## 2.0.0
 
 ### Major Changes
 
-- [`6b96e4833`](https://github.com/navikt/aksel/commit/6b96e48330c2e013a1acee85cefccd9ccc1aece4) Thanks [@KenAJoh](https://github.com/KenAJoh)! - v2: Tokens update and font-loading
+- Fontlasting: Fonter lastes nå fra NAV-CDN
 
-## 1.5.10
+- Tokens: Alle komponenter bruker nå semantiske tokens for som standard, med innebygd støtte for komponent-spesifikke tokens.
 
 ## 1.5.9
 
 ### Patch Changes
 
-- 4px -> 2px gap chips-toggle active
-
-## 1.5.8
-
-## 1.5.7
-
-## 1.5.6
-
-## 1.5.5
-
-## 1.5.4
-
-### Patch Changes
-
-- [#1709](https://github.com/navikt/aksel/pull/1709) [`77302a30b`](https://github.com/navikt/aksel/commit/77302a30b8eef8dc00b2d2e9c904a3f57da81a11) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Oppdatert ikoner
+- Chips: 4px -> 2px gap mellom checkmark i Chips.Toggle
 
 ## 1.5.3
 
 ### Patch Changes
 
-- Byttet om på alt-farge rekkefølge
-
-## 1.5.2
-
-### Patch Changes
-
-- :memo: Rename FilterChips to ToggleChips
+- Tokens: Byttet om på rekkefølge av alt-farger
 
 ## 1.5.1
 
 ### Patch Changes
 
-- Flex-wrap chips.css
+- Chips. Bruker nå standard flex-wrap
 
 ## 1.5.0
 
 ### Minor Changes
 
-- [#1684](https://github.com/navikt/aksel/pull/1684) [`e19bf67b3`](https://github.com/navikt/aksel/commit/e19bf67b337dea39989c68b5e9c2591cf0d5b40f) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :sparkles: Oppdaterte tag-varianter
-
-- [#1668](https://github.com/navikt/aksel/pull/1668) [`97c5f60e9`](https://github.com/navikt/aksel/commit/97c5f60e9111da7e08f55c8d0aa29581f0a9b1ca) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Chips komponent :sparkles:
-
-## 1.4.4
-
-## 1.4.3
-
-### Patch Changes
-
-- :sparkles: Validering og inputFormat i Date-komponenter
-
-## 1.4.2
-
-## 1.4.1
-
-### Patch Changes
-
-- [`3c08651df`](https://github.com/navikt/aksel/commit/3c08651df28c3e19dd8c8a7a1d0032200bec473d) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Date-komponenter følger språkrådets dato-formatering for måneder.
-
-## 1.4.0
+- Tag: `filled`-varianter ([PR](https://github.com/navikt/aksel/pull/1684))
 
 ## 1.3.39
 
 ### Patch Changes
 
-- [`40f0b3340`](https://github.com/navikt/aksel/commit/40f0b3340d01bf85fecc04f2f3a8e8b2acf996f1) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Bump for latest-tag
+- Fikset bruk av `:watch` for diverse parsere (less, parcel)
 
-## 1.3.38
+## 1.3.24
+
+### Patch Changes
+
+- Tokens tilgjengeligjøres nå også på `:host`. Dette lar shadow-dom brukere konsumere tokens direkte.

@navikt/core/css/alert.css

@@ -24,6 +24,7 @@
   font-size: 1.5rem;
   align-self: flex-start;
   height: var(--a-font-line-height-xlarge);
+  margin: var(--a-spacing-1);
   background: radial-gradient(circle, var(--a-surface-default) 50%, 0, transparent);
 }
 
@@ -73,3 +74,11 @@
   border: none;
   padding: 0;
 }
+
+.navds-alert__button-wrapper {
+  align-self: flex-start;
+  flex: 1;
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: flex-end;
+}

@navikt/core/css/button.css

@@ -294,7 +294,6 @@
 .navds-button--tertiary:active {
   color: var(--ac-button-tertiary-active-text, var(--a-text-on-action));
   background-color: var(--ac-button-tertiary-active-bg, var(--a-surface-action-active));
-  box-shadow: inset 0 0 0 1px var(--a-surface-default);
 }
 
 .navds-button--tertiary:active:hover {
@@ -346,7 +345,6 @@
 .navds-button--tertiary-neutral:active {
   color: var(--ac-button-tertiary-neutral-active-text, var(--a-text-on-neutral));
   background-color: var(--ac-button-tertiary-neutral-active-bg, var(--a-surface-neutral-active));
-  box-shadow: inset 0 0 0 1px var(--a-surface-default);
 }
 
 .navds-button--tertiary-neutral:active:hover {

@navikt/core/css/chat.css

@@ -26,7 +26,6 @@
   align-items: center;
   box-shadow: var(--a-shadow-xsmall);
   background-color: var(--ac-chat-avatar-bg, var(--a-surface-neutral-subtle));
-  border: 1px solid var(--ac-chat-border-color, var(--a-border-subtle));
   border-radius: var(--a-border-radius-full);
   color: var(--ac-chat-avatar-color, var(--a-text-default));
   display: flex;
@@ -35,14 +34,16 @@
   overflow: hidden;
   height: 2.5rem;
   width: 2.5rem;
+  line-height: 2.5rem; /* Makes text properly vertically centered in Chrome */
   font-size: 1.06rem;
   letter-spacing: 0.024rem;
 }
 
 .navds-chat__avatar svg {
   align-self: center;
-  height: 100%;
   width: 100%;
+  max-width: 1.5rem;
+  max-height: 1.5rem;
 }
 
 .navds-chat__bubble {
@@ -50,7 +51,6 @@
   box-shadow: var(--a-shadow-xsmall);
   width: fit-content;
   background-color: var(--ac-chat-bubble-bg, var(--a-surface-neutral-subtle));
-  border: 1px solid var(--ac-chat-border-color, var(--a-border-subtle));
   border-radius: var(--a-border-radius-xlarge);
   border-bottom-left-radius: 2px;
   display: flex;
@@ -72,8 +72,8 @@
   background-color: var(--a-surface-info-subtle);
 }
 
-.navds-chat--neutral .navds-chat__bubble,
-.navds-chat--neutral .navds-chat__avatar {
+.navds-chat--subtle .navds-chat__bubble,
+.navds-chat--subtle .navds-chat__avatar {
   background-color: var(--a-surface-default);
 }
 

@navikt/core/css/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/ds-css",
-  "version": "4.4.0",
+  "version": "4.5.0",
   "description": "CSS for NAV Designsystem",
   "author": "Aksel | NAV designsystem team",
   "keywords": [
@@ -27,7 +27,7 @@
     "css:get-version": "node config/get-version.js"
   },
   "devDependencies": {
-    "@navikt/ds-tokens": "^4.4.0",
+    "@navikt/ds-tokens": "^4.5.0",
     "cssnano": "6.0.0",
     "fast-glob": "3.2.11",
     "lodash": "4.17.21",

@navikt/core/css/tokens.json

@@ -80,7 +80,6 @@
     "--ac-button-tertiary-neutral-active-hover-bg": "--a-surface-neutral-active"
   },
   "chat": {
-    "--ac-chat-border-color": "--a-border-subtle",
     "--ac-chat-avatar-bg": "--a-surface-neutral-subtle",
     "--ac-chat-avatar-color": "--a-text-default",
     "--ac-chat-bubble-bg": "--a-surface-neutral-subtle",

@navikt/core/react/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/ds-react",
-  "version": "4.4.0",
+  "version": "4.5.0",
   "description": "Aksel react-components for NAV designsystem",
   "author": "Aksel | NAV designsystem team",
   "license": "MIT",
@@ -38,7 +38,7 @@
   },
   "dependencies": {
     "@floating-ui/react": "0.24.1",
-    "@navikt/aksel-icons": "^4.4.0",
+    "@navikt/aksel-icons": "^4.5.0",
     "@radix-ui/react-tabs": "1.0.0",
     "@radix-ui/react-toggle-group": "1.0.0",
     "clsx": "^1.2.1",

@navikt/core/react/src/alert/Alert.tsx

@@ -3,10 +3,12 @@ import {
   CheckmarkCircleFillIcon,
   ExclamationmarkTriangleFillIcon,
   XMarkOctagonFillIcon,
+  XMarkIcon,
 } from "@navikt/aksel-icons";
 import cl from "clsx";
 import React, { forwardRef } from "react";
 import { BodyLong } from "../typography/BodyLong";
+import { Button } from "../button";
 
 export interface AlertProps extends React.HTMLAttributes<HTMLDivElement> {
   /**
@@ -32,6 +34,17 @@ export interface AlertProps extends React.HTMLAttributes<HTMLDivElement> {
    * @default false
    */
   inline?: boolean;
+  /**
+   * Removes close-button(X) when false
+   * Requires onClose to be set
+   * @default true
+   */
+  closeButton?: boolean;
+  /**
+   * Callback for alert wanting to close
+   * requires closeButton to be true
+   */
+  onClose?: () => void;
 }
 
 const Icon = ({ variant, ...props }) => {
@@ -71,27 +84,45 @@ export const Alert = forwardRef<HTMLDivElement, AlertProps>(
       size = "medium",
       fullWidth = false,
       inline = false,
+      closeButton = false,
+      onClose,
       ...rest
     },
     ref
-  ) => (
-    <div
-      {...rest}
-      ref={ref}
-      className={cl(
-        className,
-        "navds-alert",
-        `navds-alert--${variant}`,
-        `navds-alert--${size}`,
-        { "navds-alert--full-width": fullWidth, "navds-alert--inline": inline }
-      )}
-    >
-      <Icon variant={variant} className="navds-alert__icon" />
-      <BodyLong as="div" size={size} className="navds-alert__wrapper">
-        {children}
-      </BodyLong>
-    </div>
-  )
+  ) => {
+    return (
+      <div
+        {...rest}
+        ref={ref}
+        className={cl(
+          className,
+          "navds-alert",
+          `navds-alert--${variant}`,
+          `navds-alert--${size}`,
+          {
+            "navds-alert--full-width": fullWidth,
+            "navds-alert--inline": inline,
+          }
+        )}
+      >
+        <Icon variant={variant} className="navds-alert__icon" />
+        <BodyLong as="div" size={size} className="navds-alert__wrapper">
+          {children}
+        </BodyLong>
+        {closeButton && !inline && (
+          <div className="navds-alert__button-wrapper">
+            <Button
+              className="navds-alert__button"
+              size="small"
+              variant="tertiary-neutral"
+              onClick={onClose}
+              icon={<XMarkIcon title="Lukk Alert" />}
+            />
+          </div>
+        )}
+      </div>
+    );
+  }
 );
 
 export default Alert;

@navikt/core/react/src/alert/alert.stories.tsx

@@ -2,6 +2,8 @@ import type { Meta, StoryObj } from "@storybook/react";
 import React from "react";
 import { Alert } from ".";
 import { BodyLong, Heading as DsHeading, Link } from "..";
+import { within, userEvent } from "@storybook/testing-library";
+import { expect } from "@storybook/jest";
 
 const meta: Meta<typeof Alert> = {
   title: "ds-react/Alert",
@@ -20,22 +22,14 @@ const variants: Array<"error" | "warning" | "info" | "success"> = [
 ];
 
 export const Default: Story = {
-  render: (props) => (
-    <Alert
-      variant={props.variant}
-      size={props.size}
-      fullWidth={props.fullWidth}
-      inline={props.inline}
-    >
-      {props.children}
-    </Alert>
-  ),
+  render: (props) => <Alert {...props} />,
 
   args: {
     children: "Id elit esse enim reprehenderit enim nisi veniam nostrud.",
     fullWidth: false,
     variant: "info",
     size: "medium",
+    closeButton: false,
   },
   argTypes: {
     variant: {
@@ -50,21 +44,39 @@ export const Default: Story = {
       },
       options: ["medium", "small"],
     },
+    closeButton: {
+      type: "boolean",
+    },
   },
 };
 
-export const Small = () => {
-  return (
-    <div className="colgap">
-      {variants.map((variant, i) => (
-        <Alert key={variant} variant={variant} size="small">
-          {new Array(i + 1).fill(
-            "Id elit esse enim reprehenderit enim nisi veniam nostrud."
-          )}
-        </Alert>
-      ))}
-    </div>
-  );
+export const Small = {
+  render: (props) => {
+    return (
+      <div className="colgap">
+        {variants.map((variant, i) => (
+          <Alert
+            key={variant}
+            variant={variant}
+            size="small"
+            closeButton={props.closeButton}
+          >
+            {new Array(i + 1).fill(
+              "Id elit esse enim reprehenderit enim nisi veniam nostrud."
+            )}
+          </Alert>
+        ))}
+      </div>
+    );
+  },
+  args: {
+    closeButton: false,
+  },
+  argtypes: {
+    closeButton: {
+      type: "boolean",
+    },
+  },
 };
 
 export const FullWidth = () => {
@@ -147,3 +159,44 @@ export const Links = () => {
     </div>
   );
 };
+
+const AlertWithCloseButton = ({ children }: { children?: React.ReactNode }) => {
+  let [show, setShow] = React.useState(true);
+
+  return (
+    show && (
+      <Alert variant="success" closeButton onClose={() => setShow(false)}>
+        {children || "Content"}
+      </Alert>
+    )
+  );
+};
+
+export const WithCloseButton: Story = {
+  render: () => {
+    return (
+      <div className="colgap">
+        <AlertWithCloseButton />
+        <AlertWithCloseButton>
+          <BodyLong>
+            Ullamco ullamco laborum et commodo sint culpa cupidatat culpa qui
+            laboris ex. Labore ex occaecat proident qui qui fugiat magna. Fugiat
+            sint commodo consequat eu aute.
+          </BodyLong>
+          <Link href="#">Id elit esse enim reprehenderit</Link>
+        </AlertWithCloseButton>
+      </div>
+    );
+  },
+  play: async ({ canvasElement, step }) => {
+    const canvas = within(canvasElement);
+    const buttons = canvas.getAllByTitle("Lukk Alert");
+
+    await step("click button", async () => {
+      await userEvent.click(buttons[0]);
+    });
+
+    const buttonsAfter = canvas.getAllByTitle("Lukk Alert");
+    expect(buttonsAfter.length).toBe(1);
+  },
+};

@navikt/core/react/src/chat/Chat.tsx

@@ -26,7 +26,7 @@ export interface ChatProps extends HTMLAttributes<HTMLDivElement> {
   /**
    * Changes background color on avatar and bubbles.
    * Avoid using the same background as the surface behind Chat.
-   * @default "subtle"
+   * @default "neutral"
    */
   variant?: "subtle" | "info" | "neutral";
   /**
@@ -92,7 +92,7 @@ export const Chat = forwardRef<HTMLDivElement, ChatProps>(
       timestamp,
       avatar,
       position = "left",
-      variant = "subtle",
+      variant = "neutral",
       avatarBgColor,
       backgroundColor,
       toptextPosition,

@navikt/core/react/src/form/Textarea.tsx

@@ -203,8 +203,8 @@ export const Counter = ({ maxLength, currentLength, size, i18n }) => {
       size={size}
     >
       {difference < 0
-        ? `${Math.abs(difference)} ${i18n?.counterLeft ?? "tegn for mye"}`
-        : `${difference} ${i18n?.counterTooMuch ?? "tegn igjen"}`}
+        ? `${Math.abs(difference)} ${i18n?.counterTooMuch ?? "tegn for mye"}`
+        : `${difference} ${i18n?.counterLeft ?? "tegn igjen"}`}
     </BodyShort>
   );
 };

@navikt/core/tailwind/CHANGELOG.md

@@ -1,261 +1,33 @@
 # @navikt/ds-tailwind
 
+## 4.5.0
+
+## 4.4.2
+
+## 4.4.1
+
 ## 4.4.0
 
-## 4.3.0
+### Minor Changes
 
-## 4.2.0
+- Shadow-tokens er oppdatert ([PR](https://github.com/navikt/aksel/pull/2041))
 
-## 4.1.7
-
-## 4.1.6
-
-## 4.1.5
-
-## 4.1.4
-
-## 4.1.3
-
-## 4.1.2
-
-## 4.1.1
+- Oppdatert text-subtle og icon-subtle tokens til 700-skala (tidligere 600). ([PR](https://github.com/navikt/aksel/pull/2036))
 
 ## 4.1.0
 
-## 4.0.0
+### Minor Changes
 
-## 3.4.2
-
-## 3.4.1
-
-## 3.4.0
-
-## 3.3.1
-
-## 3.3.0
-
-## 3.2.4
-
-## 3.2.3
-
-## 3.2.2
-
-## 3.2.1
-
-## 3.2.0
-
-## 3.1.3
-
-## 3.1.2
-
-## 3.1.1
-
-## 3.1.0
-
-## 3.0.1
-
-## 3.0.0
-
-## 2.9.8
-
-## 2.9.7
-
-## 2.9.6
-
-## 2.9.5
-
-## 2.9.4
-
-## 2.9.3
-
-## 2.9.2
-
-## 2.9.1
-
-## 2.9.0
-
-## 2.8.16
-
-## 2.8.15
-
-### Patch Changes
-
-- [#1930](https://github.com/navikt/aksel/pull/1930) [`6682be1c8`](https://github.com/navikt/aksel/commit/6682be1c8e6562213c64e5be4bed70fef54ab865) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Alle pakker implementerer nå npm provenance (beta)
-
-## 2.8.14
-
-## 2.8.13
-
-## 2.8.12
-
-## 2.8.11
-
-## 2.8.10
-
-## 2.8.9
-
-## 2.8.8
-
-## 2.8.7
-
-## 2.8.6
-
-## 2.8.5
-
-## 2.8.4
-
-## 2.8.3
-
-## 2.8.2
-
-## 2.8.1
-
-## 2.8.0
-
-## 2.7.8
-
-## 2.7.7
-
-## 2.7.6
-
-## 2.7.5
-
-## 2.7.4
-
-## 2.7.3
-
-## 2.7.2
-
-## 2.7.1
-
-## 2.7.0
-
-## 2.6.2
-
-## 2.6.1
-
-## 2.6.0
-
-## 2.5.1
+- :tada: Fargetokens for datavisualisering. ([PR](https://github.com/navikt/aksel/pull/2032))
 
 ## 2.5.0
 
 ### Minor Changes
 
-- [#1832](https://github.com/navikt/aksel/pull/1832) [`8893b5c82`](https://github.com/navikt/aksel/commit/8893b5c82daf7c23897019fda912e702a1f05eaa) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Breakpoint-tokens for ds-tokens og ds-tailwind
-
-## 2.4.3
-
-## 2.4.2
-
-### Patch Changes
-
-- [#1823](https://github.com/navikt/aksel/pull/1823) [`a7ce61f84`](https://github.com/navikt/aksel/commit/a7ce61f840e5bfaafc4f70e550167fe0095555b8) Thanks [@kschieren](https://github.com/kschieren)! - added support for nested lists
-
-## 2.4.1
-
-## 2.4.0
-
-## 2.3.1
-
-## 2.3.0
-
-## 2.2.0
-
-## 2.1.7
-
-## 2.1.6
-
-## 2.1.5
-
-## 2.1.4
-
-## 2.1.3
-
-## 2.1.2
-
-## 2.1.1
-
-## 2.1.0
-
-## 2.0.18
-
-## 2.0.17
-
-## 2.0.16
-
-## 2.0.15
-
-## 2.0.14
-
-## 2.0.13
-
-## 2.0.12
-
-## 2.0.11
-
-## 2.0.10
-
-## 2.0.9
-
-## 2.0.8
-
-## 2.0.7
-
-## 2.0.6
-
-## 2.0.5
-
-## 2.0.4
-
-## 2.0.3
-
-## 2.0.2
-
-## 2.0.1
+- Breakpoint-tokens er lagt til. Overskriver native tailwind-breakpoints ([PR](https://github.com/navikt/aksel/pull/1832))
 
 ## 2.0.0
 
 ### Major Changes
 
-- [`6b96e4833`](https://github.com/navikt/aksel/commit/6b96e48330c2e013a1acee85cefccd9ccc1aece4) Thanks [@KenAJoh](https://github.com/KenAJoh)! - v2: Tokens update and font-loading
-
-## 1.5.10
-
-## 1.5.9
-
-## 1.5.8
-
-## 1.5.7
-
-## 1.5.6
-
-## 1.5.5
-
-## 1.5.4
-
-## 1.5.3
-
-## 1.5.2
-
-## 1.5.1
-
-## 1.5.0
-
-## 1.4.4
-
-## 1.4.3
-
-## 1.4.2
-
-## 1.4.1
-
-## 1.4.0
-
-## 1.3.39
-
-### Patch Changes
-
-- [`40f0b3340`](https://github.com/navikt/aksel/commit/40f0b3340d01bf85fecc04f2f3a8e8b2acf996f1) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Bump for latest-tag
-
-## 1.3.38
+- Alle token er oppdatert til nytt format. ([Guide](https://aksel.nav.no/grunnleggende/kode/migrering#h76f47744d112))

@navikt/core/tailwind/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/ds-tailwind",
-  "version": "4.4.0",
+  "version": "4.5.0",
   "description": "Tailwind config based on @navikt/ds-tokens",
   "author": "Aksel | NAV designsystem team",
   "keywords": [
@@ -22,7 +22,7 @@
     "directory": "@navikt/core/tailwind"
   },
   "devDependencies": {
-    "@navikt/ds-tokens": "^4.4.0",
+    "@navikt/ds-tokens": "^4.5.0",
     "@types/jest": "^29.0.0",
     "color": "4.2.3",
     "jest": "^29.0.0",

@navikt/core/tokens/CHANGELOG.md

@@ -1,295 +1,47 @@
 # @navikt/ds-tokens
 
+## 4.5.0
+
+## 4.4.2
+
+## 4.4.1
+
 ## 4.4.0
 
 ### Minor Changes
 
-- [#2041](https://github.com/navikt/aksel/pull/2041) [`de3626958`](https://github.com/navikt/aksel/commit/de3626958266d1271840fa341c36500ab66b573d) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Shadow-tokens er oppdatert til mer tydeligere varianter
-
-## 4.3.0
-
-## 4.2.0
-
-## 4.1.7
-
-## 4.1.6
-
-## 4.1.5
-
-## 4.1.4
-
-## 4.1.3
-
-## 4.1.2
-
-## 4.1.1
+- Shadow-tokens er oppdatert til mer tydeligere varianter ([PR](https://github.com/navikt/aksel/pull/2041))
 
 ## 4.1.0
 
 ### Minor Changes
 
-- [#2032](https://github.com/navikt/aksel/pull/2032) [`6aca0a4b6`](https://github.com/navikt/aksel/commit/6aca0a4b6aa063a2fdbb30f679c871898074dd74) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :tada: Fargetokens for datavisualisering.
+- :tada: Fargetokens for datavisualisering. ([PR](https://github.com/navikt/aksel/pull/2032))
 
-  6 varianter for surface,surface-subtle og border.
-
-  ```css
-  background-color: var(--a-data-surface-1-subtle);
-  border-color: var(--a-data-1-border);
-  ```
-
-- [#2036](https://github.com/navikt/aksel/pull/2036) [`b2f796d68`](https://github.com/navikt/aksel/commit/b2f796d681f1c1d76d26d1fd743268c8c618a854) Thanks [@KenAJoh](https://github.com/KenAJoh)! - - Oppdatert text-subtle og icon-subtle tokens til 700-skala (tidligere 600).
-  - Icon-subtle bruker nå grayalpha.
-  - Alle description-felter på fieldsets har nå text-subtle som farge.
-
-## 4.0.0
-
-## 3.4.2
-
-## 3.4.1
-
-## 3.4.0
-
-### Minor Changes
-
-- [#2010](https://github.com/navikt/aksel/pull/2010) [`b958d41a2`](https://github.com/navikt/aksel/commit/b958d41a20c66327658514fcf24ae20893c9531a) Thanks [@HalvorHaugan](https://github.com/HalvorHaugan)! - Ny variant "moderate" i Tag
-
-## 3.3.1
-
-## 3.3.0
-
-## 3.2.4
-
-## 3.2.3
-
-## 3.2.2
-
-## 3.2.1
-
-## 3.2.0
-
-## 3.1.3
-
-## 3.1.2
-
-## 3.1.1
-
-## 3.1.0
-
-## 3.0.1
-
-## 3.0.0
-
-## 2.9.8
-
-## 2.9.7
-
-## 2.9.6
-
-## 2.9.5
-
-## 2.9.4
-
-## 2.9.3
-
-## 2.9.2
-
-## 2.9.1
-
-## 2.9.0
-
-## 2.8.16
-
-## 2.8.15
-
-### Patch Changes
-
-- [#1930](https://github.com/navikt/aksel/pull/1930) [`6682be1c8`](https://github.com/navikt/aksel/commit/6682be1c8e6562213c64e5be4bed70fef54ab865) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Alle pakker implementerer nå npm provenance (beta)
-
-## 2.8.14
-
-## 2.8.13
-
-## 2.8.12
-
-## 2.8.11
-
-## 2.8.10
-
-## 2.8.9
-
-## 2.8.8
-
-## 2.8.7
-
-## 2.8.6
-
-## 2.8.5
-
-## 2.8.4
-
-## 2.8.3
-
-## 2.8.2
-
-## 2.8.1
-
-## 2.8.0
-
-## 2.7.8
-
-## 2.7.7
-
-## 2.7.6
-
-## 2.7.5
-
-## 2.7.4
-
-## 2.7.3
-
-## 2.7.2
-
-## 2.7.1
-
-## 2.7.0
-
-## 2.6.2
-
-## 2.6.1
-
-## 2.6.0
-
-## 2.5.1
+- Oppdatert text-subtle og icon-subtle tokens til 700-skala (tidligere 600). ([PR](https://github.com/navikt/aksel/pull/2036))
 
 ## 2.5.0
 
 ### Minor Changes
 
-- [#1832](https://github.com/navikt/aksel/pull/1832) [`8893b5c82`](https://github.com/navikt/aksel/commit/8893b5c82daf7c23897019fda912e702a1f05eaa) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Breakpoint-tokens for ds-tokens og ds-tailwind
-
-## 2.4.3
-
-## 2.4.2
-
-### Patch Changes
-
-- [#1823](https://github.com/navikt/aksel/pull/1823) [`a7ce61f84`](https://github.com/navikt/aksel/commit/a7ce61f840e5bfaafc4f70e550167fe0095555b8) Thanks [@kschieren](https://github.com/kschieren)! - added support for nested lists
-
-## 2.4.1
-
-## 2.4.0
-
-## 2.3.1
-
-## 2.3.0
+- Breakpoint-tokens lagt til ([PR](https://github.com/navikt/aksel/pull/1832))
 
 ## 2.2.0
 
 ### Minor Changes
 
-- [#1787](https://github.com/navikt/aksel/pull/1787) [`43463444b`](https://github.com/navikt/aksel/commit/43463444b8a2d178bf1435b88ad2d8719b41e65b) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Justeringer i semantiske fargetokens, statusfarger nå mer tydelig
+- Justeringer av semantiske fargetokens, statusfarger nå mer tydelig ([PR](https://github.com/navikt/aksel/pull/1787))
 
-- [#1789](https://github.com/navikt/aksel/pull/1789) [`c0929a534`](https://github.com/navikt/aksel/commit/c0929a534dc8effece5435f8be550cb7931a52b1) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Button og ToggleGroup har nå en neutral-variant, oppdatert neutral-tokens
-
-## 2.1.7
-
-## 2.1.6
-
-## 2.1.5
-
-## 2.1.4
-
-## 2.1.3
-
-## 2.1.2
-
-## 2.1.1
+- Oppdatert neutral-tokens ([PR](https://github.com/navikt/aksel/pull/1789))
 
 ## 2.1.0
 
 ### Patch Changes
 
-- [#1665](https://github.com/navikt/aksel/pull/1665) [`6ab84e581`](https://github.com/navikt/aksel/commit/6ab84e581f8d3e850bcec340608354335506a051) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :sparkles: Ny Timeline-komponent for interne-flater
-  :bug: Fikset feil danger-hover token
-
-## 2.0.18
-
-## 2.0.17
-
-## 2.0.16
-
-## 2.0.15
-
-## 2.0.14
-
-## 2.0.13
-
-## 2.0.12
-
-## 2.0.11
-
-## 2.0.10
-
-## 2.0.9
-
-## 2.0.8
-
-## 2.0.7
-
-## 2.0.6
-
-## 2.0.5
-
-## 2.0.4
-
-## 2.0.3
-
-## 2.0.2
-
-## 2.0.1
+- Fikset feil danger-hover token ([PR](https://github.com/navikt/aksel/pull/1665))
 
 ## 2.0.0
 
 ### Major Changes
 
-- [`6b96e4833`](https://github.com/navikt/aksel/commit/6b96e48330c2e013a1acee85cefccd9ccc1aece4) Thanks [@KenAJoh](https://github.com/KenAJoh)! - v2: Tokens update and font-loading
-
-## 1.5.10
-
-## 1.5.9
-
-## 1.5.8
-
-## 1.5.7
-
-## 1.5.6
-
-## 1.5.5
-
-## 1.5.4
-
-## 1.5.3
-
-## 1.5.2
-
-## 1.5.1
-
-## 1.5.0
-
-## 1.4.4
-
-## 1.4.3
-
-## 1.4.2
-
-## 1.4.1
-
-## 1.4.0
-
-## 1.3.39
-
-### Patch Changes
-
-- [`40f0b3340`](https://github.com/navikt/aksel/commit/40f0b3340d01bf85fecc04f2f3a8e8b2acf996f1) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Bump for latest-tag
-
-## 1.3.38
+- Alle token er oppdatert til nytt format. ([Guide](https://aksel.nav.no/grunnleggende/kode/migrering#h76f47744d112))

@navikt/core/tokens/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/ds-tokens",
-  "version": "4.4.0",
+  "version": "4.5.0",
   "description": "Design-tokens for NAV designsystem",
   "author": "Aksel | NAV designsystem team",
   "keywords": [

aksel.nav.no/package.json

@@ -15,11 +15,11 @@
     "website"
   ],
   "dependencies": {
-    "@navikt/aksel-icons": "^4.4.0",
-    "@navikt/ds-css": "^4.4.0",
-    "@navikt/ds-react": "^4.4.0",
-    "@navikt/ds-tailwind": "^4.4.0",
-    "@navikt/ds-tokens": "^4.4.0"
+    "@navikt/aksel-icons": "^4.5.0",
+    "@navikt/ds-css": "^4.5.0",
+    "@navikt/ds-react": "^4.5.0",
+    "@navikt/ds-tailwind": "^4.5.0",
+    "@navikt/ds-tokens": "^4.5.0"
   },
   "devDependencies": {
     "prettier-plugin-tailwindcss": "^0.2.3"

aksel.nav.no/website/components/layout/WithSidebar.tsx

@@ -89,7 +89,7 @@ export const WithSidebar = ({
                   {
                     "bg-surface-subtle flex items-center justify-between":
                       variant === "page",
-                    "bg-deepblue-700/80 grid py-[4.25rem] pb-6":
+                    "bg-deepblue-700/70 grid py-[4.25rem] pb-6":
                       variant !== "page",
                     "before:from-deepblue-700 before:absolute before:inset-0 before:-z-10 before:rounded-xl before:bg-gradient-to-br before:via-blue-500 before:to-violet-700":
                       variant !== "page",

aksel.nav.no/website/components/layout/footer/Footer.tsx

@@ -116,7 +116,7 @@ function FooterLink({ children, href }) {
   return (
     <li>
       <Link
-        className="text-text-on-inverted focus:shadow-focus focus:text-text-default flex w-fit items-center gap-1 no-underline hover:underline focus:bg-blue-200 focus:shadow-blue-200"
+        className="text-text-on-inverted focus:shadow-focus focus:text-text-default flex w-fit items-center gap-1 underline hover:no-underline focus:bg-blue-200 focus:shadow-blue-200"
         href={href}
         onClick={(e) =>
           logNav(

aksel.nav.no/website/components/layout/header/Hamburger.tsx

@@ -66,7 +66,7 @@ export const Hamburger = () => {
           aria={{ modal: true }}
           overlayClassName={styles.modalOverlay}
           contentLabel="Meny"
-          className="bg-surface-default absolute left-4 top-0 right-4 block rounded py-14 px-11 sm:right-6 sm:left-auto sm:w-96 sm:max-w-[90%] lg:hidden"
+          className="bg-surface-default shadow-xlarge absolute left-4 right-4 top-0 block rounded px-11 py-14 sm:left-auto sm:right-6 sm:w-96 sm:max-w-[90%] lg:hidden"
         >
           <nav aria-label="hovedmeny">
             <ul>
@@ -75,7 +75,7 @@ export const Hamburger = () => {
                 onClick={() => setOpen(false)}
                 className={cl(
                   styles.akselTertiaryButton,
-                  "absolute top-2 right-2"
+                  "absolute right-2 top-2"
                 )}
                 icon={<XMarkIcon title="lukk meny" fontSize="1.5rem" />}
               />

aksel.nav.no/website/components/layout/header/search/utils/fuse-search.ts

@@ -16,7 +16,7 @@ export function fuseSearch(results: any[], query: string) {
     ],
     includeScore: true,
     shouldSort: true,
-    minMatchCharLength: 3,
+    minMatchCharLength: 2,
     includeMatches: true,
     threshold: 0.3,
     location: 120,

aksel.nav.no/website/components/layout/sidebar/Sidebar.tsx

@@ -28,13 +28,13 @@ const NavItem = ({
           );
         }}
         className={cl(
-          "hover:text-deepblue-800 focus-visible:shadow-focus text-medium relative  flex overflow-hidden rounded-sm py-1 pl-4 pr-2 leading-snug before:rounded-full hover:before:transition-colors focus:outline-none",
+          "hover:text-deepblue-800 focus-visible:shadow-focus text-medium relative flex  overflow-hidden py-1 pl-4 pr-2 leading-snug before:rounded-full hover:before:transition-colors focus:outline-none focus-visible:z-10 focus-visible:rounded-sm",
           {
             "before:border-l-border-action-selected before:absolute before:left-0 before:top-1/2 before:h-6 before:-translate-y-1/2 before:border-l-[4px]":
               isActive,
             "text-deepblue-800 font-semibold": isActive,
             "text-text-subtle": !isActive,
-            "before:absolute before:left-0 before:h-full before:border-l before:border-l-gray-200 hover:before:top-1/2  hover:before:h-6 hover:before:-translate-y-1/2 hover:before:border-l-2 hover:before:border-l-gray-400":
+            "before:absolute before:left-0 before:top-0 before:h-full before:border-l before:border-l-gray-200 hover:before:top-1/2  hover:before:h-6 hover:before:min-h-[70%] hover:before:-translate-y-1/2 hover:before:border-l-2 hover:before:border-l-gray-400":
               !isActive,
           }
         )}
@@ -87,7 +87,7 @@ const Dropdown = ({
       >
         <Detail
           as="span"
-          className="group-focus-visible:shadow-focus group-hover:bg-surface-neutral-subtle group-active:bg-bg-surface-neutral-subtle-hover mt-6 flex w-full items-center justify-between rounded-sm pl-2 font-semibold transition first:mt-0"
+          className="group-focus-visible:shadow-focus group-hover:bg-surface-neutral-subtle group-active:bg-surface-neutral-subtle-hover mt-6 flex w-full items-center justify-between rounded-sm pl-2 font-semibold transition-colors first:mt-0"
         >
           {title}
           <span className="flex h-6 w-6  items-center justify-center rounded">

aksel.nav.no/website/components/sanity-modules/ComponentOverview.tsx

@@ -35,11 +35,10 @@ const ComponentOverview = ({ node }: { node: ArticleListT }) => {
       <ul className="grid grid-cols-[repeat(auto-fill,_minmax(min(17rem,_100%),_1fr))] gap-6">
         {sorted.map((x) => (
           <li key={x._id}>
-            <div className="bg-surface-subtle focus-within:ring-border-focus ring-border-subtle hover:shadow-medium min-h-56 group relative rounded-2xl focus-within:ring-[3px] hover:ring-1">
+            <div className="bg-surface-subtle focus-within:ring-border-focus shadow-xsmall hover:shadow-small min-h-56 group relative rounded-2xl focus-within:ring-[3px]">
               <div
                 className={cl(
-                  "flex max-h-44 items-center justify-center overflow-hidden rounded-t-2xl",
-                  "filter",
+                  "flex max-h-44 items-center justify-center overflow-hidden rounded-t-2xl filter",
                   {
                     "hue-rotate-[65deg]": x?.status?.tag === "beta",
                     grayscale: x?.status?.tag === "deprecated",
@@ -105,10 +104,10 @@ const ComponentOverview = ({ node }: { node: ArticleListT }) => {
                     <Heading
                       as="a"
                       size="small"
-                      className="z-10 before:absolute before:inset-0 focus:outline-none group-hover:underline"
+                      className="z-10 underline before:absolute before:inset-0 focus:outline-none"
                     >
                       {x.heading}
-                      <span className="absolute top-4 left-4">
+                      <span className="absolute left-4 top-4">
                         <StatusTag status={x?.status?.tag} />
                       </span>
                     </Heading>

aksel.nav.no/website/components/sanity-modules/cards/ArtikkelCard.tsx

@@ -31,7 +31,7 @@ const ArtikkelCard = ({
   );
 
   return (
-    <div className="hover:shadow-small focus-within:ring-border-focus bg-surface-default ring-border-subtle group relative rounded-lg p-3 pb-16 ring-1 focus-within:ring-[3px] sm:p-5 sm:pb-16">
+    <div className="shadow-xsmall hover:shadow-small focus-within:ring-border-focus bg-surface-default group relative rounded-lg p-3 pb-16 focus-within:ring-[3px] sm:p-5 sm:pb-16">
       <NextLink
         href={{
           pathname: `/${slug}`,
@@ -52,7 +52,7 @@ const ArtikkelCard = ({
         <Heading
           level={level}
           size="small"
-          className="text-deepblue-700 group-hover:underline"
+          className="text-deepblue-700 underline group-hover:no-underline"
         >
           {heading}
         </Heading>

aksel.nav.no/website/components/sanity-modules/cards/BloggCard.tsx

@@ -19,7 +19,7 @@ const BloggCard = ({
       <Heading size="medium" as="div">
         <NextLink href={`/${blog.slug}`} passHref legacyBehavior>
           <Link
-            className="text-deepblue-500 no-underline hover:underline"
+            className="text-deepblue-500 underline hover:no-underline"
             onClick={(e) =>
               logNav(
                 "blogg-card",

aksel.nav.no/website/components/sanity-modules/cards/GodPraksisCard.tsx

@@ -18,7 +18,7 @@ const GodPraksisCard = ({ node }: { node: AkselTemaT }) => {
   }
 
   return (
-    <li className="ring-border-subtle bg-surface-default hover:shadow-small focus-within:ring-border-focus relative grid rounded-lg p-6 ring-1  focus-within:ring-[3px]">
+    <li className="bg-surface-default focus-within:ring-border-focus shadow-xsmall hover:shadow-small group relative grid rounded-lg p-6 focus-within:ring-[3px]">
       <div className="relative mb-4 h-16 w-16">
         <Image
           src={urlFor(node?.pictogram).auto("format").url()}
@@ -39,7 +39,7 @@ const GodPraksisCard = ({ node }: { node: AkselTemaT }) => {
             e.currentTarget.getAttribute("href")
           )
         }
-        className="navds-heading--medium text-deepblue-700 navds-heading  mb-4 no-underline after:absolute after:inset-0 after:rounded-lg focus:outline-none group-hover:underline"
+        className="navds-heading--medium text-deepblue-700 navds-heading  mb-4 underline after:absolute after:inset-0 after:rounded-lg focus:outline-none group-hover:no-underline"
       >
         {node.title}
       </NextLink>

aksel.nav.no/website/components/sanity-modules/cards/InnholdsKort.tsx

@@ -11,13 +11,13 @@ const InnholdsKort = ({ node }: { node: InnholdsKortPrinsipperT }) => {
   }
 
   return (
-    <article className="shadow-small last-of-type:mb-18 focus-within:ring-border-focus hover:shadow-medium group relative mb-7 rounded-lg bg-white p-4 ring-1 ring-gray-900/10 focus-within:ring sm:p-8">
+    <article className="last-of-type:mb-18 focus-within:ring-border-focus shadow-xsmall hover:shadow-small group relative mb-7 rounded-lg bg-white p-4 focus-within:ring sm:p-8">
       <Heading
         spacing
         size="small"
         level="3"
         id={node._key}
-        className="text-deepblue-500 scroll-mt-28 focus:outline-none group-hover:underline"
+        className="text-deepblue-500 scroll-mt-28 underline focus:outline-none group-hover:no-underline"
       >
         <NextLink
           href={`/${node?.lenke}`}

aksel.nav.no/website/components/sanity-modules/cards/RelatertInnhold.tsx

@@ -37,7 +37,7 @@ const RelatertInnhold = ({ node }: { node: RelatertInnholdT }) => {
               e.currentTarget.getAttribute("href")
             )
           }
-          className="toc-ignore shadow-small focus-visible:shadow-focus bg-surface-default ring-border-subtle group grid rounded border-2 border-transparent px-4 py-3 ring-1 focus:outline-none"
+          className="toc-ignore shadow-xsmall hover:shadow-small focus-visible:shadow-focus bg-surface-default group grid rounded border-2 border-transparent px-4 py-3 focus:outline-none"
         >
           <Heading
             as="span"

aksel.nav.no/website/components/sanity-modules/frontpage-blocks/Card.tsx

@@ -51,8 +51,7 @@ const Card = ({
     <div
       className={cl(
         "bg-surface-default group relative rounded-lg",
-        "focus-within:ring-border-focus ring-border-subtle-hover focus-within:ring-[3px]",
-        "shadow-[0_0_1px_rgb(0_0_0/0.3),0_1px_3px_rgb(0_0_0/0.15)]",
+        "focus-within:ring-border-focus ring-border-subtle-hover shadow-xsmall hover:shadow-small focus-within:ring-[3px]",
         `transition-[opacity,transform] duration-700`,
         {
           "translate-y-0 opacity-100": visible,
@@ -120,7 +119,11 @@ const Card = ({
               )
             }
           >
-            <Heading level="3" size="small" className="group-hover:underline">
+            <Heading
+              level="3"
+              size="small"
+              className="underline group-hover:no-underline"
+            >
               {article.heading}
             </Heading>
           </NextLink>

aksel.nav.no/website/components/sanity-modules/frontpage-blocks/Highlight.tsx

@@ -75,8 +75,9 @@ export const Highlight = ({
           text={article.tema ? article.tema[0] : undefined}
           beta={article?.status?.tag === "beta"}
         />
-        <NextLink href={`/${article.slug.current}`} passHref legacyBehavior>
+        <Heading size="large" level="3">
           <Link
+            as={NextLink}
             onClick={(e) =>
               logNav(
                 "artikkel-kort",
@@ -84,13 +85,12 @@ export const Highlight = ({
                 e.currentTarget.getAttribute("href")
               )
             }
-            className="text-text-default mb-5 mt-2 no-underline hover:underline"
+            href={`/${article.slug.current}`}
+            className="text-text-default mb-5 mt-2 underline hover:no-underline"
           >
-            <Heading size="large" level="3">
-              {article?.heading}
-            </Heading>
+            {article?.heading}
           </Link>
-        </NextLink>
+        </Heading>
         <BodyLong className="mb-4" size="small">
           {article?.ingress ?? article.seo?.meta}
         </BodyLong>

aksel.nav.no/website/components/website-modules/IntroCards.tsx

@@ -24,9 +24,9 @@ export const IntroCards = ({
             href={href}
             passHref
             className={cl(
-              "focus-visible:shadow-focus ring-border-subtle text-deepblue-700 bg-surface-default hover:shadow-small hover:ring-border-subtle group z-10 rounded-lg p-4 ring-1 hover:ring-1 focus:outline-none",
+              "focus-visible:shadow-focus text-deepblue-700 bg-surface-default shadow-xsmall hover:shadow-small group z-10 rounded-lg p-4 focus:outline-none",
               {
-                "shadow-small max-w-md": variant === "forside",
+                "max-w-md": variant === "forside",
               }
             )}
             prefetch={false}
@@ -44,7 +44,7 @@ export const IntroCards = ({
                 className="text-deepblue-500 shrink-0 text-2xl"
                 role="img"
               />
-              <span className="text-xl font-semibold group-hover:underline">
+              <span className="text-xl font-semibold underline group-hover:no-underline">
                 {title}
               </span>
             </span>

aksel.nav.no/website/components/website-modules/blogg-page/BloggList.tsx

@@ -40,7 +40,7 @@ export const BloggList = ({
 
         <div>
           <NextLink href={`/${blogg.slug}`} passHref legacyBehavior>
-            <Link className="text-deepblue-500 no-underline hover:underline">
+            <Link className="text-deepblue-500 underline hover:no-underline">
               <Heading size="small" level="2">
                 {blogg.heading}
               </Heading>
@@ -88,7 +88,7 @@ export const BloggList = ({
         </div>
         <div className="md:hidden">
           <NextLink href={`/${blogg.slug}`} passHref legacyBehavior>
-            <Link className="text-deepblue-500 no-underline hover:underline">
+            <Link className="text-deepblue-500 underline hover:no-underline">
               <Heading size="small" level="2">
                 {blogg.heading}
               </Heading>

aksel.nav.no/website/components/website-modules/blogg-page/HighlightedBlogg.tsx

@@ -41,7 +41,7 @@ export const HighlightedBlogg = ({
           )}
         </div>
         <NextLink href={`/${blogg.slug}`} passHref legacyBehavior>
-          <Link className="text-deepblue-500 no-underline hover:underline">
+          <Link className="text-deepblue-500 underline hover:no-underline">
             <Heading size="large" level="2">
               {blogg.heading}
             </Heading>
@@ -82,7 +82,7 @@ export const HighlightedBlogg = ({
           )}
         </div>
         <NextLink href={`/${blogg.slug}`} passHref legacyBehavior>
-          <Link className="text-deepblue-500 no-underline hover:underline">
+          <Link className="text-deepblue-500 underline hover:no-underline">
             <Heading size="large" level="2">
               {blogg.heading}
             </Heading>

aksel.nav.no/website/components/website-modules/examples/examples.module.css

@@ -1,3 +1,8 @@
+.examples a {
+  text-underline-offset: initial;
+  text-decoration-thickness: auto;
+}
+
 .container {
   display: flex;
   align-items: center;

aksel.nav.no/website/components/website-modules/examples/withDsExample.tsx

@@ -11,7 +11,7 @@ export const withDsExample = (
 ) => {
   const DsHOC = (props: any) => (
     <div
-      className={cl({
+      className={cl(styles.examples, {
         "bg-gray-900": variant === "inverted",
         "bg-bg-subtle": variant === "subtle",
         [styles.containerStatic]: variant === "static",

aksel.nav.no/website/components/website-modules/icon-page/Page.tsx

@@ -120,7 +120,7 @@ export const IconPage = ({ name }: { name: string }) => {
               <TitleLinks />
             </div>
 
-            <div className="bg-surface-default shadow-small ring-border-subtle z-10 mb-8 mt-16 h-full w-full rounded-2xl ring-1">
+            <div className="bg-surface-default shadow-large z-10 mb-8 mt-16 h-full w-full rounded-2xl">
               <div className="border-b-border-subtle bg-surface-default sticky top-0 z-20 grid items-center rounded-t-2xl border-b p-1">
                 <form
                   onSubmit={(e) => e.preventDefault()}

aksel.nav.no/website/components/website-modules/utils/date-string.ts

@@ -1,4 +1,7 @@
 export const dateStr = async (date: string) => {
+  if (!date) {
+    return "";
+  }
   const format = (await import("date-fns/format")).default;
   const locale = (await import("date-fns/locale/nb")).default;
   return format(new Date(date), "d. MMMM YYY", { locale: locale });

aksel.nav.no/website/package.json

@@ -18,7 +18,8 @@
     "update:props": "ts-node --project tsconfig.tsnode.json ./scripts/update-props",
     "update:tokens": "ts-node --project tsconfig.tsnode.json ./scripts/update-tokens",
     "update:eksempler": "ts-node --project tsconfig.tsnode.json ./scripts/examples/update-sanity",
-    "update:sanity": "yarn update:tokens && yarn update:props && yarn update:eksempler",
+    "update:changelog": "ts-node --project tsconfig.tsnode.json ./scripts/changelog",
+    "update:sanity": "yarn update:tokens && yarn update:props && yarn update:eksempler && yarn update:changelog",
     "analyze": "cross-env ANALYZE=true yarn build",
     "test": "jest",
     "playwright": "playwright test",
@@ -72,6 +73,8 @@
     "@next/bundle-analyzer": "^12.1.0",
     "@next/eslint-plugin-next": "^12.2.0",
     "@playwright/test": "1.35.1",
+    "@sanity/block-tools": "^3.12.2",
+    "@sanity/schema": "^3.12.2",
     "@testing-library/jest-dom": "^5.16.0",
     "@testing-library/react": "^13.3.0",
     "@types/jest": "^29.0.0",
@@ -83,11 +86,13 @@
     "dotenv": "^10.0.0",
     "jest": "^29.0.0",
     "jest-environment-jsdom": "^29.0.0",
+    "jsdom": "^22.1.0",
     "json5": "2.2.1",
     "pino-pretty": "^10.0.0",
     "postcss": "^8.4.0",
     "postcss-import": "^14.1.0",
     "postcss-loader": "7.0.0",
+    "showdown": "^2.1.0",
     "start-server-and-test": "^1.14.0",
     "ts-jest": "^29.0.0",
     "ts-node": "10.9.0",

aksel.nav.no/website/pages/_app.tsx

@@ -3,11 +3,11 @@ import {
   usePageView,
 } from "components/website-modules/utils/amplitude";
 import { useScrollToHashOnPageLoad } from "components/website-modules/utils/util";
+import dynamic from "next/dynamic";
 import Head from "next/head";
 import { Router } from "next/router";
 import { useEffect } from "react";
 import { IdContext } from "../components/website-modules/utils/contexts/id-context";
-import dynamic from "next/dynamic";
 import "../styles/index.css";
 
 initAmplitude();

aksel.nav.no/website/pages/eksempler/alert/med-lukkeknapp.tsx

@@ -0,0 +1,53 @@
+import { Alert, AlertProps } from "@navikt/ds-react";
+import { withDsExample } from "components/website-modules/examples/withDsExample";
+import React from "react";
+
+const AlertWithCloseButton = ({
+  children,
+  variant,
+}: {
+  children?: React.ReactNode;
+  variant: AlertProps["variant"];
+}) => {
+  const [show, setShow] = React.useState(true);
+
+  return (
+    show && (
+      <Alert variant={variant} closeButton onClose={() => setShow(false)}>
+        {children || "Content"}
+      </Alert>
+    )
+  );
+};
+
+const Example = () => {
+  return (
+    <div className="grid gap-4">
+      <AlertWithCloseButton variant="info">
+        Hvis du er mellom 62 og 67 år når du søker, må du som hovedregel ha hatt
+        en pensjonsgivende inntekt som tilsvarer x G, året før du fikk nedsatt
+        arbeidsevnen.
+      </AlertWithCloseButton>
+      <AlertWithCloseButton variant="success">
+        Søknad er sendt inn!
+      </AlertWithCloseButton>
+      <AlertWithCloseButton variant="warning">
+        Du må være registrert hos NAV for å bruke aktivitetsplanen.
+      </AlertWithCloseButton>
+      <AlertWithCloseButton variant="error">
+        Noe gikk galt! Prøv igjen om noen minutter.
+      </AlertWithCloseButton>
+    </div>
+  );
+};
+
+export default withDsExample(Example);
+
+/* Storybook story */
+export const Demo = {
+  render: Example,
+};
+
+export const args = {
+  index: 1,
+};

aksel.nav.no/website/pages/eksempler/chat/colors.tsx

@@ -12,7 +12,7 @@ const Example = () => {
         name="Ola Normann"
         timestamp="01.01.21 14:00"
         position="right"
-        variant="neutral"
+        variant="subtle"
       >
         <Chat.Bubble>Hei Eva.</Chat.Bubble>
         <Chat.Bubble>

aksel.nav.no/website/pages/eksempler/dropdown/default.tsx

@@ -1,6 +1,8 @@
+/* eslint-disable @typescript-eslint/no-empty-function */
 import { Button } from "@navikt/ds-react";
 import { Dropdown } from "@navikt/ds-react";
 import { withDsExample } from "components/website-modules/examples/withDsExample";
+import Link from "next/link";
 
 const Example = () => {
   return (
@@ -12,17 +14,25 @@ const Example = () => {
             <Dropdown.Menu.GroupedList.Heading>
               Systemer og oppslagsverk
             </Dropdown.Menu.GroupedList.Heading>
-            <Dropdown.Menu.GroupedList.Item>
+            <Dropdown.Menu.GroupedList.Item onClick={() => {}}>
               Gosys
             </Dropdown.Menu.GroupedList.Item>
-            <Dropdown.Menu.GroupedList.Item>
+            <Dropdown.Menu.GroupedList.Item as="a" href="https://nav.no">
               Infotrygd
             </Dropdown.Menu.GroupedList.Item>
           </Dropdown.Menu.GroupedList>
           <Dropdown.Menu.Divider />
           <Dropdown.Menu.List>
-            <Dropdown.Menu.List.Item>Gosys</Dropdown.Menu.List.Item>
-            <Dropdown.Menu.List.Item>Infotrygd</Dropdown.Menu.List.Item>
+            <Dropdown.Menu.List.Item as={Link} href="https://nav.no">
+              Kontakt
+            </Dropdown.Menu.List.Item>
+            <Dropdown.Menu.List.Item
+              as={Link}
+              href="https://nav.no"
+              target="_blank"
+            >
+              Hjelp (åpner i en ny fane)
+            </Dropdown.Menu.List.Item>
           </Dropdown.Menu.List>
         </Dropdown.Menu>
       </Dropdown>

aksel.nav.no/website/pages/eksempler/skeleton/card.tsx

@@ -3,7 +3,7 @@ import { withDsExample } from "components/website-modules/examples/withDsExample
 
 const Example = () => {
   return (
-    <div className="shadow-medium ring-border-subtle w-56 rounded-lg p-6 ring-1">
+    <div className="shadow-xsmall w-56 rounded-lg p-6 ">
       <Skeleton variant="circle" width={60} height={60} />
       <Skeleton variant="text" width="100%" />
       <Skeleton variant="text" width="100%" />

aksel.nav.no/website/pages/god-praksis/artikler/[slug].tsx

@@ -102,7 +102,7 @@ export const getStaticProps = async ({
       id: page?._id ?? "",
       title: page?.heading ?? "",
       verifiedDate: await dateStr(
-        page?.updateInfo?.lastVerified ?? page.publishedAt ?? page._updatedAt
+        page?.updateInfo?.lastVerified ?? page?.publishedAt ?? page?._updatedAt
       ),
       publishDate: await dateStr(page?.publishedAt ?? page?._updatedAt),
     },
@@ -250,21 +250,16 @@ const Page = ({
                 <div className="mt-8 flex flex-wrap gap-2">
                   {filteredTema.map(({ title, slug }: any) => (
                     <span key={title}>
-                      <NextLink
-                        key={title}
+                      <BodyShort
                         href={`/god-praksis/${slug.current}`}
-                        passHref
-                        legacyBehavior
+                        key={title}
+                        size="small"
+                        as={NextLink}
+                        className="min-h-8 text-deepblue-800 focus-visible:shadow-focus bg-surface-neutral-subtle hover:bg-surface-neutral-subtle-hover ring-border-subtle flex items-center  justify-center gap-[2px] rounded-full pl-4 pr-1 ring-1 ring-inset focus:outline-none"
                       >
-                        <BodyShort
-                          size="small"
-                          as="a"
-                          className="min-h-8 text-deepblue-800 focus-visible:shadow-focus flex items-center justify-center gap-[2px] rounded-full bg-gray-200 pl-4 pr-1 capitalize no-underline hover:underline focus:outline-none"
-                        >
-                          {title}
-                          <ChevronRightIcon aria-hidden fontSize="1.25rem" />
-                        </BodyShort>
-                      </NextLink>
+                        {title}
+                        <ChevronRightIcon aria-hidden fontSize="1.25rem" />
+                      </BodyShort>
                     </span>
                   ))}
                 </div>

aksel.nav.no/website/pages/grunnleggende/[...slug].tsx

@@ -80,7 +80,7 @@ export const getStaticProps = async ({
       title: page?.heading ?? "",
       id: page?._id ?? "",
       refs: [],
-      publishDate: await dateStr(page._updatedAt),
+      publishDate: await dateStr(page?._updatedAt ?? page?._createdAt),
     },
     notFound: !page && !preview,
     revalidate: 60,

aksel.nav.no/website/pages/komponenter/[...slug].tsx

@@ -143,7 +143,7 @@ export const getStaticProps = async ({
       preview,
       title: page?.heading ?? "",
       id: page?._id ?? "",
-      publishDate: await dateStr(page._updatedAt),
+      publishDate: await dateStr(page?._updatedAt ?? page?._createdAt),
     },
     notFound: !page && !preview,
     revalidate: 60,

aksel.nav.no/website/pages/produktbloggen/[slug].tsx

@@ -67,7 +67,7 @@ export const getServerSideProps: GetServerSideProps = async (
       preview: context.preview ?? false,
       id: blogg?._id ?? "",
       title: blogg?.heading ?? "",
-      publishDate: await dateStr(blogg?.publishedAt ?? blogg._createdAt),
+      publishDate: await dateStr(blogg?.publishedAt ?? blogg?._createdAt),
     },
     notFound: !blogg && !context.preview,
   };

aksel.nav.no/website/scripts/changelog.ts

@@ -0,0 +1,61 @@
+import fs from "fs";
+import { JSDOM } from "jsdom";
+import { htmlToBlocks } from "@sanity/block-tools";
+import { Schema } from "@sanity/schema";
+import showdown from "showdown";
+import dotenv from "dotenv";
+
+import { noCdnClient } from "../sanity/interface/client.server";
+
+dotenv.config();
+
+main();
+
+export async function main() {
+  const token = process.env.SANITY_WRITE_KEY;
+  const client = noCdnClient(token);
+  const changelog = fs.readFileSync("../../CHANGELOG.md", "utf-8");
+
+  const converter = new showdown.Converter();
+  converter.setOption("emoji", true);
+
+  const html = converter.makeHtml(changelog);
+
+  const defaultSchema = Schema.compile({
+    name: "test",
+    types: [
+      {
+        type: "object",
+        name: "blogPost",
+        fields: [
+          {
+            title: "Body",
+            name: "body",
+            type: "array",
+            of: [{ type: "block" }],
+          },
+        ],
+      },
+    ],
+  });
+
+  const blockContentType = defaultSchema
+    .get("blogPost")
+    .fields.find((field) => field.name === "body").type;
+
+  const blocks = htmlToBlocks(html, blockContentType, {
+    parseHtml: (html) => new JSDOM(html).window.document,
+  });
+  blocks.shift();
+
+  client
+    .patch("75351662-ecb0-455a-b9a5-59f319e423fa")
+    .set({ content: blocks })
+    .commit()
+    .then(() => {
+      console.log("Hurray, updated changelog!");
+    })
+    .catch((err) => {
+      console.error("Oh no, the changelog-update failed: ", err.message);
+    });
+}

aksel.nav.no/website/styles/global.css

@@ -31,6 +31,8 @@ p {
 a {
   color: inherit;
   text-decoration: inherit;
+  text-underline-offset: 2px;
+  text-decoration-thickness: 0.0625em;
 }
 
 [id] {

examples/shadow-dom/package.json

@@ -10,8 +10,8 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "@navikt/ds-css": "4.4.0",
-    "@navikt/ds-react": "4.4.0",
+    "@navikt/ds-css": "4.5.0",
+    "@navikt/ds-react": "4.5.0",
     "react": "^18.0.0",
     "react-dom": "^18.0.0"
   },

package.json

@@ -210,7 +210,6 @@
     "url": "https://github.com/navikt/aksel.git"
   },
   "devDependencies": {
-    "@changesets/changelog-github": "0.4.8",
     "@changesets/cli": "2.25.0",
     "@storybook/addon-a11y": "7.0.4",
     "@storybook/addon-actions": "7.0.4",
@@ -224,6 +223,7 @@
     "@storybook/react-vite": "7.0.4",
     "@storybook/testing-library": "^0.1.0",
     "@storybook/theming": "7.0.4",
+    "@svitejs/changesets-changelog-github-compact": "^1.1.0",
     "@typescript-eslint/parser": "^5.41.0",
     "@whitespace/storybook-addon-html": "^5.0.3",
     "chromatic": "6.5.4",

scripts/deno/createMainChangelog.ts

@@ -2,29 +2,28 @@ import { readFileSync, writeFileSync } from "node:fs";
 import {
   List,
   ListItem,
-  Root,
-  Text,
-  Link,
   Paragraph,
   PhrasingContent,
+  Root,
+  Text,
 } from "npm:@types/mdast";
 import { Node } from "npm:@types/unist";
 import { heading, root, text } from "npm:mdast-builder";
 import remarkParse from "npm:remark-parse";
 import remarkStringify from "npm:remark-stringify";
 import { unified } from "npm:unified";
-import { EXIT, SKIP, CONTINUE, visit } from "npm:unist-util-visit";
+import { CONTINUE, EXIT, SKIP, visit } from "npm:unist-util-visit";
 import { visitParents } from "npm:unist-util-visit-parents";
 import { getChangelogs } from "./utils.ts";
 
 /**
  * Small diagram of the process:
 
-           original 
+           original
         markdown files
                |
                V
-          custom JSON 
+          custom JSON
         representation
          of changelog
                |
@@ -60,20 +59,7 @@ const upsertEntry = (
   changelog[lastSeenVersion] = updatedVersion;
 };
 
-const PROrCommitHashLink = (node: Root): Link | null => {
-  let infoLink: Link | null = null;
-  visit(node, (someChildNode) => {
-    if (someChildNode.type === "link") {
-      infoLink = structuredClone(someChildNode);
-      return EXIT;
-    }
-  });
-
-  return infoLink;
-};
-
 const processNode = (node: Root) => {
-  const infoLink = PROrCommitHashLink(node) || text("");
   visitParents(node, (childNode, ancestors) => {
     if (childNode.type === "text" && childNode.value.startsWith("! -")) {
       const parent = ancestors.findLast(
@@ -95,7 +81,6 @@ const processNode = (node: Root) => {
         }
       });
       parent.children.push(text(" ") as PhrasingContent);
-      parent.children.push(infoLink as PhrasingContent);
     }
   });
 };
@@ -202,18 +187,34 @@ const parseMarkdownFiles = async (filePaths: string[]): Promise<Changelog> => {
   return changelog;
 };
 
+const semverSort = (a: string, b: string): number => {
+  const [aMajor, aMinor, aPatch] = a.split(".").map((v) => parseInt(v));
+  const [bMajor, bMinor, bPatch] = b.split(".").map((v) => parseInt(v));
+
+  if (aMajor !== bMajor) {
+    return aMajor - bMajor;
+  } else if (aMinor !== bMinor) {
+    return aMinor - bMinor;
+  } else {
+    return aPatch - bPatch;
+  }
+};
+
 const createMainChangelog = async (changelog: Changelog): Promise<string> => {
   const headings = [];
-  Object.entries(changelog).forEach(([version, versionEntry]) => {
-    headings.push(heading(2, [text(version)]));
-    for (const [packageName, changes] of Object.entries(versionEntry)) {
-      headings.push(heading(3, [text(packageName)]));
-      for (const change of changes) {
-        processNode(change as Root);
-        headings.push(change);
+  Object.entries(changelog)
+    .sort((a, b) => semverSort(a[0], b[0]))
+    .reverse()
+    .forEach(([version, versionEntry]) => {
+      headings.push(heading(2, [text(version)]));
+      for (const [packageName, changes] of Object.entries(versionEntry)) {
+        headings.push(heading(3, [text(packageName)]));
+        for (const change of changes) {
+          processNode(change as Root);
+          headings.push(change);
+        }
       }
-    }
-  });
+    });
 
   headings.unshift(heading(1, [text("Changelog")]));
 

yarn.lock

@@ -2112,17 +2112,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@changesets/changelog-github@npm:0.4.8":
-  version: 0.4.8
-  resolution: "@changesets/changelog-github@npm:0.4.8"
-  dependencies:
-    "@changesets/get-github-info": ^0.5.2
-    "@changesets/types": ^5.2.1
-    dotenv: ^8.1.0
-  checksum: 8a357cc08757e0eeca267ee05141f68bef936582abef8b78a5d30d99f5a86e41b7d3debba70992b73b2f57b0fc6201ec1cc3c65116930167ee3197b427b865c5
-  languageName: node
-  linkType: hard
-
 "@changesets/cli@npm:2.25.0":
   version: 2.25.0
   resolution: "@changesets/cli@npm:2.25.0"
@@ -3798,7 +3787,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@navikt/aksel-icons@^4.3.0, @navikt/aksel-icons@workspace:@navikt/aksel-icons":
+"@navikt/aksel-icons@^4.4.0, @navikt/aksel-icons@workspace:@navikt/aksel-icons":
   version: 0.0.0-use.local
   resolution: "@navikt/aksel-icons@workspace:@navikt/aksel-icons"
   dependencies:
@@ -3825,8 +3814,8 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@navikt/aksel-stylelint@workspace:@navikt/aksel-stylelint"
   dependencies:
-    "@navikt/ds-css": ^4.3.0
-    "@navikt/ds-tokens": ^4.3.0
+    "@navikt/ds-css": ^4.4.0
+    "@navikt/ds-tokens": ^4.4.0
     "@types/jest": ^29.0.0
     concurrently: 7.2.1
     copyfiles: 2.4.1
@@ -3843,7 +3832,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@navikt/aksel@workspace:@navikt/aksel"
   dependencies:
-    "@navikt/ds-css": 4.3.0
+    "@navikt/ds-css": 4.4.0
     "@types/inquirer": ^9.0.3
     "@types/jest": ^29.0.0
     axios: 1.3.6
@@ -3867,11 +3856,11 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@navikt/ds-css@*, @navikt/ds-css@4.3.0, @navikt/ds-css@^4.3.0, @navikt/ds-css@workspace:@navikt/core/css":
+"@navikt/ds-css@*, @navikt/ds-css@4.4.0, @navikt/ds-css@^4.4.0, @navikt/ds-css@workspace:@navikt/core/css":
   version: 0.0.0-use.local
   resolution: "@navikt/ds-css@workspace:@navikt/core/css"
   dependencies:
-    "@navikt/ds-tokens": ^4.3.0
+    "@navikt/ds-tokens": ^4.4.0
     cssnano: 6.0.0
     fast-glob: 3.2.11
     lodash: 4.17.21
@@ -3884,12 +3873,12 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@navikt/ds-react@*, @navikt/ds-react@4.3.0, @navikt/ds-react@^4.3.0, @navikt/ds-react@workspace:@navikt/core/react":
+"@navikt/ds-react@*, @navikt/ds-react@4.4.0, @navikt/ds-react@^4.4.0, @navikt/ds-react@workspace:@navikt/core/react":
   version: 0.0.0-use.local
   resolution: "@navikt/ds-react@workspace:@navikt/core/react"
   dependencies:
     "@floating-ui/react": 0.24.1
-    "@navikt/aksel-icons": ^4.3.0
+    "@navikt/aksel-icons": ^4.4.0
     "@radix-ui/react-tabs": 1.0.0
     "@radix-ui/react-toggle-group": 1.0.0
     "@testing-library/dom": 8.13.0
@@ -3925,11 +3914,11 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@navikt/ds-tailwind@^4.3.0, @navikt/ds-tailwind@workspace:@navikt/core/tailwind":
+"@navikt/ds-tailwind@^4.4.0, @navikt/ds-tailwind@workspace:@navikt/core/tailwind":
   version: 0.0.0-use.local
   resolution: "@navikt/ds-tailwind@workspace:@navikt/core/tailwind"
   dependencies:
-    "@navikt/ds-tokens": ^4.3.0
+    "@navikt/ds-tokens": ^4.4.0
     "@types/jest": ^29.0.0
     color: 4.2.3
     jest: ^29.0.0
@@ -3940,7 +3929,7 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@navikt/ds-tokens@^4.3.0, @navikt/ds-tokens@workspace:@navikt/core/tokens":
+"@navikt/ds-tokens@^4.4.0, @navikt/ds-tokens@workspace:@navikt/core/tokens":
   version: 0.0.0-use.local
   resolution: "@navikt/ds-tokens@workspace:@navikt/core/tokens"
   dependencies:
@@ -4521,6 +4510,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@sanity/block-tools@npm:^3.12.2":
+  version: 3.12.2
+  resolution: "@sanity/block-tools@npm:3.12.2"
+  dependencies:
+    get-random-values-esm: ^1.0.0
+    lodash: ^4.17.21
+  checksum: 5f913740a570a8e74d0e5356af5ab43a3f07816ab952cb1b5c5e5d19867ab4b4a21af7f2414d0ffc9cf34f8f93583e6701cec1424b6c20034bb50a599c3d7421
+  languageName: node
+  linkType: hard
+
 "@sanity/cli@npm:3.9.1":
   version: 3.9.1
   resolution: "@sanity/cli@npm:3.9.1"
@@ -4834,6 +4833,21 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@sanity/schema@npm:^3.12.2":
+  version: 3.12.2
+  resolution: "@sanity/schema@npm:3.12.2"
+  dependencies:
+    "@sanity/generate-help-url": ^3.0.0
+    "@sanity/types": 3.12.2
+    arrify: ^1.0.1
+    humanize-list: ^1.0.1
+    leven: ^3.1.0
+    lodash: ^4.17.21
+    object-inspect: ^1.6.0
+  checksum: 123ce5510bc08d9f89f1d85655485398d85e2f408fbb44bde35c9a24d88569f6872217b819362350753d9e94bc23638c122232fb9b09ec7676b3c079fbddd801
+  languageName: node
+  linkType: hard
+
 "@sanity/slate-react@npm:2.30.1":
   version: 2.30.1
   resolution: "@sanity/slate-react@npm:2.30.1"
@@ -4879,6 +4893,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@sanity/types@npm:3.12.2":
+  version: 3.12.2
+  resolution: "@sanity/types@npm:3.12.2"
+  dependencies:
+    "@sanity/client": ^6.1.1
+    "@types/react": ^18.0.25
+  checksum: 03ab23a01cbab05b5eadd97a6edd464538f90a04f41e8160c3445b8bcd55896924638284f6632be03a3574fcaa866d954dcd8f9e4f0c8bbe7e7b3175155bcde2
+  languageName: node
+  linkType: hard
+
 "@sanity/types@npm:3.9.1":
   version: 3.9.1
   resolution: "@sanity/types@npm:3.9.1"
@@ -6421,6 +6445,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@svitejs/changesets-changelog-github-compact@npm:^1.1.0":
+  version: 1.1.0
+  resolution: "@svitejs/changesets-changelog-github-compact@npm:1.1.0"
+  dependencies:
+    "@changesets/get-github-info": ^0.5.2
+    dotenv: ^16.0.3
+  checksum: 51a8727f6ee5d0eddc48c24ef1b809d714d1d1b04cbb4bbb33f39e3096708e7f5957274a2fcaa8eeb273a16295f0f612ca4d7e5e672dfce558e1f3d7faeb1815
+  languageName: node
+  linkType: hard
+
 "@swc/helpers@npm:0.5.1":
   version: 0.5.1
   resolution: "@swc/helpers@npm:0.5.1"
@@ -7962,11 +7996,11 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "aksel.nav.no@workspace:aksel.nav.no"
   dependencies:
-    "@navikt/aksel-icons": ^4.3.0
-    "@navikt/ds-css": ^4.3.0
-    "@navikt/ds-react": ^4.3.0
-    "@navikt/ds-tailwind": ^4.3.0
-    "@navikt/ds-tokens": ^4.3.0
+    "@navikt/aksel-icons": ^4.4.0
+    "@navikt/ds-css": ^4.4.0
+    "@navikt/ds-react": ^4.4.0
+    "@navikt/ds-tailwind": ^4.4.0
+    "@navikt/ds-tokens": ^4.4.0
     prettier-plugin-tailwindcss: ^0.2.3
   languageName: unknown
   linkType: soft
@@ -7975,7 +8009,6 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "aksel@workspace:."
   dependencies:
-    "@changesets/changelog-github": 0.4.8
     "@changesets/cli": 2.25.0
     "@storybook/addon-a11y": 7.0.4
     "@storybook/addon-actions": 7.0.4
@@ -7989,6 +8022,7 @@ __metadata:
     "@storybook/react-vite": 7.0.4
     "@storybook/testing-library": ^0.1.0
     "@storybook/theming": 7.0.4
+    "@svitejs/changesets-changelog-github-compact": ^1.1.0
     "@typescript-eslint/parser": ^5.41.0
     "@whitespace/storybook-addon-html": ^5.0.3
     chromatic: 6.5.4
@@ -10076,7 +10110,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"commander@npm:^9.3.0":
+"commander@npm:^9.0.0, commander@npm:^9.3.0":
   version: 9.5.0
   resolution: "commander@npm:9.5.0"
   checksum: c7a3e27aa59e913b54a1bafd366b88650bc41d6651f0cbe258d4ff09d43d6a7394232a4dadd0bf518b3e696fdf595db1028a0d82c785b88bd61f8a440cecfade
@@ -10808,6 +10842,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"cssstyle@npm:^3.0.0":
+  version: 3.0.0
+  resolution: "cssstyle@npm:3.0.0"
+  dependencies:
+    rrweb-cssom: ^0.6.0
+  checksum: 31f694dfed9998ed93570fe539610837b878193dd8487c33cb12db8004333c53c2a3904166288bbec68388c72fb01014d46d3243ddfb02fe845989d852c06f27
+  languageName: node
+  linkType: hard
+
 "csstype@npm:^3.0.2, csstype@npm:^3.1.2":
   version: 3.1.2
   resolution: "csstype@npm:3.1.2"
@@ -10996,6 +11039,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"data-urls@npm:^4.0.0":
+  version: 4.0.0
+  resolution: "data-urls@npm:4.0.0"
+  dependencies:
+    abab: ^2.0.6
+    whatwg-mimetype: ^3.0.0
+    whatwg-url: ^12.0.0
+  checksum: 006e869b5bf079647949a3e9b1dd69d84b2d5d26e6b01c265485699bc96e83817d4b5aae758b2910a4c58c0601913f3a0034121c1ca2da268e9a244c57515b15
+  languageName: node
+  linkType: hard
+
 "dataloader@npm:^1.4.0":
   version: 1.4.0
   resolution: "dataloader@npm:1.4.0"
@@ -11122,7 +11176,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"decimal.js@npm:^10.4.2":
+"decimal.js@npm:^10.4.2, decimal.js@npm:^10.4.3":
   version: 10.4.3
   resolution: "decimal.js@npm:10.4.3"
   checksum: 796404dcfa9d1dbfdc48870229d57f788b48c21c603c3f6554a1c17c10195fc1024de338b0cf9e1efe0c7c167eeb18f04548979bcc5fdfabebb7cc0ae3287bae
@@ -11628,10 +11682,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"dotenv@npm:^8.1.0":
-  version: 8.6.0
-  resolution: "dotenv@npm:8.6.0"
-  checksum: 38e902c80b0666ab59e9310a3d24ed237029a7ce34d976796349765ac96b8d769f6df19090f1f471b77a25ca391971efde8a1ea63bb83111bd8bec8e5cc9b2cd
+"dotenv@npm:^16.0.3":
+  version: 16.3.1
+  resolution: "dotenv@npm:16.3.1"
+  checksum: 15d75e7279018f4bafd0ee9706593dd14455ddb71b3bcba9c52574460b7ccaf67d5cf8b2c08a5af1a9da6db36c956a04a1192b101ee102a3e0cf8817bbcf3dfd
   languageName: node
   linkType: hard
 
@@ -16635,6 +16689,42 @@ __metadata:
   languageName: node
   linkType: hard
 
+"jsdom@npm:^22.1.0":
+  version: 22.1.0
+  resolution: "jsdom@npm:22.1.0"
+  dependencies:
+    abab: ^2.0.6
+    cssstyle: ^3.0.0
+    data-urls: ^4.0.0
+    decimal.js: ^10.4.3
+    domexception: ^4.0.0
+    form-data: ^4.0.0
+    html-encoding-sniffer: ^3.0.0
+    http-proxy-agent: ^5.0.0
+    https-proxy-agent: ^5.0.1
+    is-potential-custom-element-name: ^1.0.1
+    nwsapi: ^2.2.4
+    parse5: ^7.1.2
+    rrweb-cssom: ^0.6.0
+    saxes: ^6.0.0
+    symbol-tree: ^3.2.4
+    tough-cookie: ^4.1.2
+    w3c-xmlserializer: ^4.0.0
+    webidl-conversions: ^7.0.0
+    whatwg-encoding: ^2.0.0
+    whatwg-mimetype: ^3.0.0
+    whatwg-url: ^12.0.1
+    ws: ^8.13.0
+    xml-name-validator: ^4.0.0
+  peerDependencies:
+    canvas: ^2.5.0
+  peerDependenciesMeta:
+    canvas:
+      optional: true
+  checksum: d955ab83a6dad3e6af444098d30647c719bbb4cf97de053aa5751c03c8d6f3283d8c4d7fc2774c181f1d432fb0250e7332bc159e6b466424f4e337d73adcbf30
+  languageName: node
+  linkType: hard
+
 "jsesc@npm:^2.5.1":
   version: 2.5.2
   resolution: "jsesc@npm:2.5.2"
@@ -18572,7 +18662,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"nwsapi@npm:^2.2.2":
+"nwsapi@npm:^2.2.2, nwsapi@npm:^2.2.4":
   version: 2.2.5
   resolution: "nwsapi@npm:2.2.5"
   checksum: 3acfe387214e2a9a03960662ad600ecb41fc24385c9de91262a881608407f02d14686e5df3e6e87af0cf7b173ed2a6a202a569ab7bef376ec1841cd9b6cbf0a6
@@ -19164,7 +19254,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"parse5@npm:^7.0.0, parse5@npm:^7.1.1":
+"parse5@npm:^7.0.0, parse5@npm:^7.1.1, parse5@npm:^7.1.2":
   version: 7.1.2
   resolution: "parse5@npm:7.1.2"
   dependencies:
@@ -20456,7 +20546,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"punycode@npm:^2.1.0, punycode@npm:^2.1.1":
+"punycode@npm:^2.1.0, punycode@npm:^2.1.1, punycode@npm:^2.3.0":
   version: 2.3.0
   resolution: "punycode@npm:2.3.0"
   checksum: 39f760e09a2a3bbfe8f5287cf733ecdad69d6af2fe6f97ca95f24b8921858b91e9ea3c9eeec6e08cede96181b3bb33f95c6ffd8c77e63986508aa2e8159fa200
@@ -21787,6 +21877,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"rrweb-cssom@npm:^0.6.0":
+  version: 0.6.0
+  resolution: "rrweb-cssom@npm:0.6.0"
+  checksum: 182312f6e4f41d18230ccc34f14263bc8e8a6b9d30ee3ec0d2d8e643c6f27964cd7a8d638d4a00e988d93e8dc55369f4ab5a473ccfeff7a8bab95b36d2b5499c
+  languageName: node
+  linkType: hard
+
 "run-async@npm:^2.2.0":
   version: 2.4.1
   resolution: "run-async@npm:2.4.1"
@@ -22311,8 +22408,8 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "shadow-dom@workspace:examples/shadow-dom"
   dependencies:
-    "@navikt/ds-css": 4.3.0
-    "@navikt/ds-react": 4.3.0
+    "@navikt/ds-css": 4.4.0
+    "@navikt/ds-react": 4.4.0
     "@types/react": ^18.0.0
     "@types/react-dom": ^18.0.0
     "@vitejs/plugin-react": ^2.1.0
@@ -22424,6 +22521,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"showdown@npm:^2.1.0":
+  version: 2.1.0
+  resolution: "showdown@npm:2.1.0"
+  dependencies:
+    commander: ^9.0.0
+  bin:
+    showdown: bin/showdown.js
+  checksum: 9e33607612c4465f9ef39de356e2cee512e248eb71d4725e1d4353cf3ab4bbe89a94601ce6bfbd8245000633693c8b90e7d85a9613dfeba7704a7422cee78282
+  languageName: node
+  linkType: hard
+
 "side-channel@npm:^1.0.4":
   version: 1.0.4
   resolution: "side-channel@npm:1.0.4"
@@ -24054,6 +24162,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"tr46@npm:^4.1.1":
+  version: 4.1.1
+  resolution: "tr46@npm:4.1.1"
+  dependencies:
+    punycode: ^2.3.0
+  checksum: aeeb821ac2cd792e63ec84888b4fd6598ac6ed75d861579e21a5cf9d4ee78b2c6b94e7d45036f2ca2088bc85b9b46560ad23c4482979421063b24137349dbd96
+  languageName: node
+  linkType: hard
+
 "tr46@npm:~0.0.3":
   version: 0.0.3
   resolution: "tr46@npm:0.0.3"
@@ -25295,12 +25412,14 @@ __metadata:
     "@next/eslint-plugin-next": ^12.2.0
     "@playwright/test": 1.35.1
     "@sanity/block-content-to-react": ^3.0.0
+    "@sanity/block-tools": ^3.12.2
     "@sanity/client": ^6.1.3
     "@sanity/code-input": 4.1.1
     "@sanity/color-input": ^3.1.0
     "@sanity/icons": 2.3.1
     "@sanity/image-url": 1.0.2
     "@sanity/preview-kit": ^1.5.4
+    "@sanity/schema": ^3.12.2
     "@sanity/table": 1.0.1
     "@sanity/ui": ^1.3.0
     "@sanity/vision": 3.12.1
@@ -25321,6 +25440,7 @@ __metadata:
     fuse.js: ^6.6.2
     jest: ^29.0.0
     jest-environment-jsdom: ^29.0.0
+    jsdom: ^22.1.0
     json5: 2.2.1
     lodash: ^4.17.21
     next: ^13.2.1
@@ -25342,6 +25462,7 @@ __metadata:
     sanity-plugin-asset-source-unsplash: ^1.1.0
     sanity-plugin-media: ^2.0.5
     sharp: 0.31.3
+    showdown: ^2.1.0
     sitemap: ^7.0.0
     start-server-and-test: ^1.14.0
     styled-components: ^5.2
@@ -25380,6 +25501,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"whatwg-url@npm:^12.0.0, whatwg-url@npm:^12.0.1":
+  version: 12.0.1
+  resolution: "whatwg-url@npm:12.0.1"
+  dependencies:
+    tr46: ^4.1.1
+    webidl-conversions: ^7.0.0
+  checksum: 8698993b763c1e7eda5ed16c31dab24bca6489626aca7caf8b5a2b64684dda6578194786f10ec42ceb1c175feea16d0a915096e6419e08d154ce551c43176972
+  languageName: node
+  linkType: hard
+
 "whatwg-url@npm:^5.0.0":
   version: 5.0.0
   resolution: "whatwg-url@npm:5.0.0"
@@ -25594,7 +25725,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"ws@npm:^8.11.0, ws@npm:^8.2.3":
+"ws@npm:^8.11.0, ws@npm:^8.13.0, ws@npm:^8.2.3":
   version: 8.13.0
   resolution: "ws@npm:8.13.0"
   peerDependencies: