Version Packages (#2811)

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

.eslintrc.js

@@ -46,7 +46,8 @@ module.exports = {
     },
     {
       files: ["**/*.test.*", "**/__tests__/*"],
-      extends: ["plugin:jest/recommended", "plugin:testing-library/react"],
+      plugins: ["vitest"],
+      extends: ["plugin:vitest/recommended", "plugin:testing-library/react"],
     },
 
     {
@@ -71,7 +72,6 @@ module.exports = {
           "error",
           "aksel.nav.no/website/pages/",
         ],
-        "@typescript-eslint/ban-ts-comment": "off", // Temporary
       },
     },
     {

.github/PULL_REQUEST_TEMPLATE.md

@@ -21,7 +21,7 @@ add links to project-tasks, slack discussions etc here
 - 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.
+- Is the component sufficiently complex to warrant tests? Add some unit-tests for vitest.
 
 #### Component-updates 🎉
 

.github/workflows/aksel-dev.yml

@@ -14,12 +14,18 @@ jobs:
       contents: "read"
       id-token: "write"
     steps:
+      - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
         with:
           node-version: "20"
-      - uses: actions/checkout@v3
+          cache: yarn
+      - name: set-env for yarn install to @navikt scope
+        shell: bash
+        run: echo "NPM_AUTH_TOKEN=${{ secrets.READER_TOKEN }}" >> $GITHUB_ENV
+
       - name: add tokens to .env
         run: |
+          echo "SLACK_BOT_TOKEN=${{ secrets.SLACK_BOT_TOKEN }}" >> aksel.nav.no/website/.env
           echo "SANITY_WRITE_KEY=${{ secrets.SANITY_FEEDBACK_WRITE_KEY }}" >> aksel.nav.no/website/.env
           echo "SANITY_PREVIEW_TOKEN=${{ secrets.SANITY_PREVIEW_TOKEN }}" >> aksel.nav.no/website/.env
           echo "SANITY_PRIVATE_NO_DRAFTS=${{ secrets.SANITY_PRIVATE_NO_DRAFTS }}" >> aksel.nav.no/website/.env
@@ -29,14 +35,6 @@ jobs:
         run: |
           echo "User-agent: *\nDisallow: /" > aksel.nav.no/website/public/robots.txt
 
-      - name: Restore cache
-        uses: actions/cache@v3
-        with:
-          path: "**/node_modules"
-          key: ${{ runner.os }}-dev-${{ github.sha }}
-          restore-keys: |
-            ${{ runner.os }}-dev-
-
       - name: Install dependencies
         run: yarn
 
@@ -46,11 +44,13 @@ jobs:
           yarn workspace aksel.nav.no build:next
 
       - name: Upload static files to NAV CDN
-        uses: navikt/frontend/actions/cdn-upload/v1@main
+        uses: nais/deploy/actions/cdn-upload/v2@master
         with:
-          cdn-team-name: aksel
+          team: designsystem
           source: ./aksel.nav.no/website/.next/static
           destination: "/website/_next"
+          project_id: ${{ vars.NAIS_MANAGEMENT_PROJECT_ID }}
+          identity_provider: ${{ secrets.NAIS_WORKLOAD_IDENTITY_PROVIDER }}
 
       - name: Get complete tag
         run: echo "TAG=DEV-$( date +%s )" >> $GITHUB_ENV

.github/workflows/aksel-prod.yml

@@ -14,22 +14,20 @@ jobs:
     name: Update component data
     runs-on: ubuntu-latest
     steps:
+      - uses: actions/checkout@v3
+
       - uses: actions/setup-node@v3
         with:
           node-version: "20"
-      - uses: actions/checkout@v3
+          cache: yarn
+      - name: set-env for yarn install to @navikt scope
+        shell: bash
+        run: echo "NPM_AUTH_TOKEN=${{ secrets.READER_TOKEN }}" >> $GITHUB_ENV
+
       - name: add tokens to .env
         run: |
           echo "SANITY_WRITE_KEY=${{ secrets.SANITY_FEEDBACK_WRITE_KEY }}" >> aksel.nav.no/website/.env
 
-      - name: Restore cache
-        uses: actions/cache@v3
-        with:
-          path: "**/node_modules"
-          key: ${{ runner.os }}-prod-${{ github.sha }}
-          restore-keys: |
-            ${{ runner.os }}-prod-
-
       - name: Install dependencies
         run: yarn
 
@@ -49,25 +47,24 @@ jobs:
       contents: "read"
       id-token: "write"
     steps:
+      - uses: actions/checkout@v3
+
       - uses: actions/setup-node@v3
         with:
           node-version: "20"
-      - uses: actions/checkout@v3
+          cache: yarn
+      - name: set-env for yarn install to @navikt scope
+        shell: bash
+        run: echo "NPM_AUTH_TOKEN=${{ secrets.READER_TOKEN }}" >> $GITHUB_ENV
+
       - name: add tokens to .env
         run: |
+          echo "SLACK_BOT_TOKEN=${{ secrets.SLACK_BOT_TOKEN }}" >> aksel.nav.no/website/.env
           echo "SANITY_WRITE_KEY=${{ secrets.SANITY_FEEDBACK_WRITE_KEY }}" >> aksel.nav.no/website/.env
           echo "SANITY_PREVIEW_TOKEN=${{ secrets.SANITY_PREVIEW_TOKEN }}" >> aksel.nav.no/website/.env
           echo "SANITY_PRIVATE_NO_DRAFTS=${{ secrets.SANITY_PRIVATE_NO_DRAFTS }}" >> aksel.nav.no/website/.env
           echo "USE_CDN_ASSETS=true" >> aksel.nav.no/website/.env
 
-      - name: Restore cache
-        uses: actions/cache@v3
-        with:
-          path: "**/node_modules"
-          key: ${{ runner.os }}-prod-${{ github.sha }}
-          restore-keys: |
-            ${{ runner.os }}-prod-
-
       - name: Install dependencies
         run: yarn
 
@@ -75,17 +72,19 @@ jobs:
         run: yarn boot
 
       - name: Tests
-        run: yarn workspace aksel.nav.no test
+        run: yarn workspace website test
 
       - name: Build application
         run: yarn workspace aksel.nav.no build:next
 
       - name: Upload static files to NAV CDN
-        uses: navikt/frontend/actions/cdn-upload/v1@main
+        uses: nais/deploy/actions/cdn-upload/v2@master
         with:
-          cdn-team-name: aksel
+          team: designsystem
           source: ./aksel.nav.no/website/.next/static
           destination: "/website/_next"
+          project_id: ${{ vars.NAIS_MANAGEMENT_PROJECT_ID }}
+          identity_provider: ${{ secrets.NAIS_WORKLOAD_IDENTITY_PROVIDER }}
 
       - name: Get complete tag
         run: echo "TAG=PROD-$( date +%s )" >> $GITHUB_ENV

.github/workflows/backup-sanity.yml

@@ -11,17 +11,15 @@ jobs:
       - uses: actions/checkout@v3
         with:
           fetch-depth: 0 # Required to retrieve git history
+
       - uses: actions/setup-node@v3
         with:
           node-version: "20"
+          cache: yarn
+      - name: set-env for yarn install to @navikt scope
+        shell: bash
+        run: echo "NPM_AUTH_TOKEN=${{ secrets.READER_TOKEN }}" >> $GITHUB_ENV
 
-      - name: Restore cache
-        uses: actions/cache@v3
-        with:
-          path: "**/node_modules"
-          key: ${{ runner.os }}-build-${{ github.sha }}
-          restore-keys: |
-            ${{ runner.os }}-build-
       - name: Install dependencies
         run: cd aksel.nav.no/website && yarn
 

.github/workflows/ci.yml

@@ -24,14 +24,9 @@ jobs:
         with:
           node-version: "20"
           cache: yarn
-
-      - name: Restore cache
-        uses: actions/cache@v3
-        with:
-          path: "**/node_modules"
-          key: ${{ runner.os }}-test-${{ github.sha }}
-          restore-keys: |
-            ${{ runner.os }}-test
+      - name: set-env for yarn install to @navikt scope
+        shell: bash
+        run: echo "NPM_AUTH_TOKEN=${{ secrets.READER_TOKEN }}" >> $GITHUB_ENV
 
       - name: Install dependencies
         run: yarn

.github/workflows/e2e.yml

@@ -19,6 +19,10 @@ jobs:
       - uses: actions/setup-node@v3
         with:
           node-version: "20"
+          cache: yarn
+      - name: set-env for yarn install to @navikt scope
+        shell: bash
+        run: echo "NPM_AUTH_TOKEN=${{ secrets.READER_TOKEN }}" >> $GITHUB_ENV
 
       - name: add tokens to .env
         run: |
@@ -26,14 +30,6 @@ jobs:
           echo "SANITY_PREVIEW_TOKEN=${{ secrets.SANITY_PREVIEW_TOKEN }}" >> aksel.nav.no/website/.env
           echo "SANITY_PRIVATE_NO_DRAFTS=${{ secrets.SANITY_PRIVATE_NO_DRAFTS }}" >> aksel.nav.no/website/.env
 
-      - name: Restore cache
-        uses: actions/cache@v3
-        with:
-          path: "**/node_modules"
-          key: ${{ runner.os }}-e2e-${{ github.sha }}
-          restore-keys: |
-            ${{ runner.os }}-e2e-
-
       - name: Install dependencies
         run: yarn
 

.github/workflows/push-to-cdn.yaml

@@ -20,11 +20,13 @@ jobs:
       - uses: "actions/checkout@v3"
 
       - id: upload
-        uses: navikt/frontend/actions/cdn-upload/v1@main
+        uses: nais/deploy/actions/cdn-upload/v2@master
         with:
-          cdn-team-name: aksel
+          team: aksel
           source: ./fonts
           destination: "" # uploads folder to team root
+          project_id: ${{ vars.NAIS_MANAGEMENT_PROJECT_ID }}
+          identity_provider: ${{ secrets.NAIS_WORKLOAD_IDENTITY_PROVIDER }}
 
       - run: echo uploaded file ${{ steps.upload.outputs.uploaded }}
         shell: bash

.github/workflows/release.yml

@@ -30,19 +30,14 @@ jobs:
         with:
           node-version: "20"
           cache: yarn
+      - name: set-env for yarn install to @navikt scope
+        shell: bash
+        run: echo "NPM_AUTH_TOKEN=${{ secrets.READER_TOKEN }}" >> $GITHUB_ENV
 
       - uses: denoland/setup-deno@v1
         with:
           deno-version: v1.x
 
-      - name: Restore cache
-        uses: actions/cache@v3
-        with:
-          path: "**/node_modules"
-          key: ${{ runner.os }}-prod-${{ github.sha }}
-          restore-keys: |
-            ${{ runner.os }}-prod
-
       - name: Install dependencies
         run: yarn
 
@@ -85,11 +80,13 @@ jobs:
 
       - name: Upload updated icon.zip to NAV CDN
         if: steps.changesets.outputs.published == 'true'
-        uses: navikt/frontend/actions/cdn-upload/v1@main
+        uses: nais/deploy/actions/cdn-upload/v2@master
         with:
-          cdn-team-name: aksel
+          team: aksel
           source: ./@navikt/aksel-icons/aksel-icons.zip
           destination: "/icons/zip"
+          project_id: ${{ vars.NAIS_MANAGEMENT_PROJECT_ID }}
+          identity_provider: ${{ secrets.NAIS_WORKLOAD_IDENTITY_PROVIDER }}
 
       - name: Get @navikt/ds-css version
         run: |
@@ -99,8 +96,10 @@ jobs:
 
       - name: Upload CSS to NAV CDN
         if: steps.changesets.outputs.published == 'true'
-        uses: navikt/frontend/actions/cdn-upload/v1@main
+        uses: nais/deploy/actions/cdn-upload/v2@master
         with:
-          cdn-team-name: aksel
+          team: aksel
           source: ./@navikt/core/css/dist/version/${{env.version}}
           destination: "@navikt/ds-css"
+          project_id: ${{ vars.NAIS_MANAGEMENT_PROJECT_ID }}
+          identity_provider: ${{ secrets.NAIS_WORKLOAD_IDENTITY_PROVIDER }}

.storybook/main.ts

@@ -4,10 +4,7 @@ import turbosnap from "vite-plugin-turbosnap";
 export default {
   staticDirs: ["./public"],
 
-  stories: () => [
-    "../@navikt/**/*.stories.@(js|jsx|ts|tsx|mdx)",
-    "./*.stories.mdx",
-  ],
+  stories: () => ["../@navikt/**/*.stories.@(js|jsx|ts|tsx|mdx)", "./*.mdx"],
   addons: [
     "@storybook/addon-a11y",
     "@xfinx/storybook-addon-html",
@@ -29,14 +26,12 @@ export default {
         },
       },
     },
+    "storybook-addon-pseudo-states",
   ],
   framework: {
     name: "@storybook/react-vite",
     options: {},
   },
-  features: {
-    storyStoreV7: true,
-  },
   docs: {
     autodocs: "tag",
   },

.yarnrc.yml

@@ -2,6 +2,12 @@ enableImmutableInstalls: false
 
 nodeLinker: node-modules
 
+npmScopes:
+  navikt:
+    npmAlwaysAuth: true
+    npmAuthToken: "${NPM_AUTH_TOKEN:-}"
+    npmRegistryServer: "https://npm.pkg.github.com"
+
 plugins:
   - path: .yarn/plugins/@yarnpkg/plugin-workspace-tools.cjs
     spec: "@yarnpkg/plugin-workspace-tools"

@navikt/aksel-icons/CHANGELOG.md

@@ -1,5 +1,27 @@
 # @navikt/aksel-icons
 
+## 6.3.4
+
+## 6.3.3
+
+## 6.3.2
+
+## 6.3.1
+
+## 6.3.0
+
+## 6.2.0
+
+### Minor Changes
+
+- Ikoner: Nytt ikon `archive` ([#2772](https://github.com/navikt/aksel/pull/2772))
+
+- Ikoner: Nytt ikon `opensource` ([#2787](https://github.com/navikt/aksel/pull/2787))
+
+## 6.1.1
+
+## 6.1.0
+
 ## 6.0.0
 
 ### Major Changes
@@ -8,7 +30,7 @@
 
 ### Minor Changes
 
-- SSR: ds-react og aksel-icons støtter nå `use-client` og kan brukes i nextjs app-router uten lokal re-eksportering. ([#2623](https://github.com/navikt/aksel/pull/2623))
+- SSR: ds-react og aksel-icons støtter nå `use client` og kan brukes i nextjs app-router uten lokal re-eksportering. ([#2623](https://github.com/navikt/aksel/pull/2623))
 
 ## 5.18.3
 

@navikt/aksel-icons/__tests__/validate-config.test.ts

@@ -1,7 +1,8 @@
-const fastglob = require("fast-glob");
-const path = require("path");
-const jsYaml = require("js-yaml");
-const fs = require("fs");
+import fastglob from "fast-glob";
+import fs from "fs";
+import jsYaml from "js-yaml";
+import path from "path";
+import { describe, expect, test } from "vitest";
 
 const basePath = path.resolve(__dirname, "../icons");
 
@@ -11,7 +12,7 @@ const ymlList = fastglob
 
 describe(`Each icons YML-config is valid`, () => {
   ymlList.forEach((file) => {
-    it(`${file} has valid YML-config`, () => {
+    test(`${file} has valid YML-config`, () => {
       const ymlData = jsYaml.load(fs.readFileSync(`${basePath}/${file}`), {
         schema: jsYaml.JSON_SCHEMA,
       });

@navikt/aksel-icons/__tests__/validate-files.test.ts

@@ -1,5 +1,6 @@
-const fastglob = require("fast-glob");
-const path = require("path");
+import fastglob from "fast-glob";
+import path from "path";
+import { describe, expect, test } from "vitest";
 
 const basePath = path.resolve(__dirname, "../icons");
 
@@ -12,7 +13,7 @@ const ymlList = fastglob
   .map((fileN) => path.basename(fileN));
 
 describe(`Each SVG-file has a matching YML file`, () => {
-  it(`must have a corresponding YML file`, () => {
+  test(`must have a corresponding YML file`, () => {
     expect(
       ymlList
         .map((yml) => yml.replace(".yml", ".svg"))
@@ -22,7 +23,7 @@ describe(`Each SVG-file has a matching YML file`, () => {
 });
 
 describe(`Each YML-file has a matching SVG file`, () => {
-  it(`must have a corresponding SVG file`, () => {
+  test(`must have a corresponding SVG file`, () => {
     expect(
       svgList
         .map((svg) => svg.replace(".svg", ".yml"))

@navikt/aksel-icons/__tests__/validate-svg-parsing.test.ts

@@ -1,3 +1,4 @@
+import { describe, expect, test } from "vitest";
 import { parseIcon } from "../config/parse-svg";
 
 describe(`SVG should be correctly parsed`, () => {
@@ -27,7 +28,7 @@ describe(`SVG should be correctly parsed`, () => {
   </svg>
   `;
 
-  it("a", () => {
+  test("a", () => {
     expect(parseIcon(simpleSvg)).toEqual(simpleSvgResult);
     expect(parseIcon(advancedSvg)).toEqual(advancedSvgResult);
   });

@navikt/aksel-icons/__tests__/validate-svg.test.ts

@@ -4,6 +4,7 @@ import { select, selectAll } from "hast-util-select";
 import { basename } from "path";
 import parse from "rehype-parse";
 import { unified } from "unified";
+import { describe, expect, test } from "vitest";
 
 const basePath = "./icons";
 
@@ -18,39 +19,44 @@ describe(`Each icons has a valid code`, () => {
         .use(parse, { fragment: true, space: "svg" })
         .parse(readFileSync(`${basePath}/${file}`));
 
-      it(`has valid attributes on root-node`, () => {
-        const properties = Object.keys(
-          select(":root", iconAst).properties,
-        ).sort();
+      test(`has valid attributes on root-node`, () => {
+        const root = select(":root", iconAst);
+        const properties =
+          root && root.properties ? Object.keys(root.properties).sort() : [];
 
         expect(properties).toStrictEqual(
           ["viewBox", "xmlns", "height", "width", "fill"].sort(),
         );
       });
 
-      it(`has valid xml-attr`, () => {
-        const xmlns = select(":root", iconAst).properties.xmlns;
+      test(`has valid xml-attr`, () => {
+        const root = select(":root", iconAst);
+        const xmlns = root && root.properties ? root.properties.xmlns : null;
         expect(xmlns).toBe("http://www.w3.org/2000/svg");
       });
 
-      it(`has valid viewbox`, () => {
-        const viewbox = select(":root", iconAst).properties.viewBox;
+      test(`has valid viewbox`, () => {
+        const root = select(":root", iconAst);
+        const viewbox =
+          root && root.properties ? root.properties.viewBox : null;
         expect(viewbox).toBe("0 0 24 24");
       });
 
-      it(`root fill is none`, () => {
-        const fill = select(":root", iconAst).properties.fill;
+      test(`root fill is none`, () => {
+        const root = select(":root", iconAst);
+        const fill = root && root.properties ? root.properties.fill : null;
         expect(fill).toBe("none");
       });
 
-      it(`has valid width and height`, () => {
-        const width = select(":root", iconAst).properties.width;
-        const height = select(":root", iconAst).properties.height;
+      test(`has valid width and height`, () => {
+        const root = select(":root", iconAst);
+        const width = root && root.properties ? root.properties.width : null;
+        const height = root && root.properties ? root.properties.height : null;
         expect(width).toBe("24");
         expect(height).toBe("24");
       });
 
-      it(`has valid stroke`, () => {
+      test(`has valid stroke`, () => {
         const nodes = selectAll("*", iconAst);
 
         nodes.forEach((n) => {
@@ -59,7 +65,7 @@ describe(`Each icons has a valid code`, () => {
         });
       });
 
-      it(`has valid stroke-width`, () => {
+      test(`has valid stroke-width`, () => {
         const nodes = selectAll("*", iconAst);
         nodes.forEach((n) => {
           n.properties?.strokeWidth &&

@navikt/aksel-icons/figma-plugin/manifest.json

@@ -6,5 +6,8 @@
   "ui": "dist/index.html",
   "capabilities": [],
   "enableProposedApi": false,
-  "editorType": ["figma", "figjam"]
+  "editorType": ["figma", "figjam"],
+  "networkAccess": {
+    "allowedDomains": ["none"]
+  }
 }

@navikt/aksel-icons/icons/Archive.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M3.25 4C3.25 3.58579 3.58579 3.25 4 3.25H20C20.4142 3.25 20.75 3.58579 20.75 4V8C20.75 8.41421 20.4142 8.75 20 8.75H19.75V19C19.75 19.9665 18.9665 20.75 18 20.75H6C5.0335 20.75 4.25 19.9665 4.25 19V8.75H4C3.58579 8.75 3.25 8.41421 3.25 8V4ZM5.75 8.75H18.25V19C18.25 19.1381 18.1381 19.25 18 19.25H6C5.86193 19.25 5.75 19.1381 5.75 19V8.75ZM4.75 4.75V7.25H19.25V4.75H4.75ZM14 13.25C14.4142 13.25 14.75 12.9142 14.75 12.5C14.75 12.0858 14.4142 11.75 14 11.75H10C9.58579 11.75 9.25 12.0858 9.25 12.5C9.25 12.9142 9.58579 13.25 10 13.25H14Z" fill="#23262A"/>
+</svg>

@navikt/aksel-icons/icons/Archive.yml

@@ -0,0 +1,10 @@
+name: Archive
+category: Interface
+sub_category: Communication
+keywords:
+  - arkiv
+  - box
+  - boks
+variant: Stroke
+updated_at: 22.02.2024
+created_at: 22.02.2024

@navikt/aksel-icons/icons/ArchiveFill.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4 3.25C3.58579 3.25 3.25 3.58579 3.25 4V7.5C3.25 7.91421 3.58579 8.25 4 8.25H20C20.4142 8.25 20.75 7.91421 20.75 7.5V4C20.75 3.58579 20.4142 3.25 20 3.25H4ZM19.5 9.25C19.6381 9.25 19.75 9.36193 19.75 9.5V19C19.75 19.9665 18.9665 20.75 18 20.75H6C5.0335 20.75 4.25 19.9665 4.25 19V9.5C4.25 9.36193 4.36193 9.25 4.5 9.25H19.5ZM14.75 12.5C14.75 12.9142 14.4142 13.25 14 13.25H10C9.58579 13.25 9.25 12.9142 9.25 12.5C9.25 12.0858 9.58579 11.75 10 11.75H14C14.4142 11.75 14.75 12.0858 14.75 12.5Z" fill="#23262A"/>
+</svg>

@navikt/aksel-icons/icons/ArchiveFill.yml

@@ -0,0 +1,10 @@
+name: ArchiveFill
+category: Interface
+sub_category: Communication
+keywords:
+  - arkiv
+  - box
+  - boks
+variant: Fill
+updated_at: 22.02.2024
+created_at: 22.02.2024

@navikt/aksel-icons/icons/ArrowCirclepath.yml

@@ -13,5 +13,5 @@ keywords:
   - reload
   - oppdater
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 14.02.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/ArrowDownRight.yml

@@ -9,5 +9,5 @@ keywords:
   - nivå
   - innrykk
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 16.01.2024
 created_at: 04.12.2023

@navikt/aksel-icons/icons/ArrowRedo.yml

@@ -13,5 +13,5 @@ keywords:
   - forward
   - videresend
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 23.02.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/ArrowsCirclepath.yml

@@ -13,5 +13,5 @@ keywords:
   - oppfrisking
   - oppdatering
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 29.02.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/ArrowsUpDown.yml

@@ -9,5 +9,5 @@ keywords:
   - sortering
   - sorting
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 22.02.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/Branching.yml

@@ -15,5 +15,5 @@ keywords:
   - Sammenføye
   - Kildekontroll
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 18.01.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/ChevronDownDouble.yml

@@ -5,5 +5,5 @@ keywords:
   - ned
   - down
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 25.01.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/ChevronLeftDouble.yml

@@ -5,5 +5,5 @@ keywords:
   - left
   - venstre
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 11.03.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/ChevronUpDouble.yml

@@ -5,5 +5,5 @@ keywords:
   - opp
   - up
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 25.01.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/ChevronUpDown.yml

@@ -8,5 +8,5 @@ keywords:
   - Utvide/skjule
   - vise/skjule
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 04.03.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/Code.yml

@@ -15,5 +15,5 @@ keywords:
   - markup-språk
   - kildekode
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 01.03.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/Download.yml

@@ -7,5 +7,5 @@ keywords:
   - downloading
   - last ned
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 08.03.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/Escalator.yml

@@ -5,5 +5,5 @@ keywords:
   - trapp
   - rulletrapp
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 12.03.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/Expand.yml

@@ -9,5 +9,5 @@ keywords:
   - open
   - åpne
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 24.01.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/Hourglass.yml

@@ -13,5 +13,5 @@ keywords:
   - fremdrift
   - nedtelling
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 21.02.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/HourglassBottomFilled.yml

@@ -13,5 +13,5 @@ keywords:
   - fremdrift
   - nedtelling
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 22.01.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/HourglassTopFilled.yml

@@ -13,5 +13,5 @@ keywords:
   - fremdrift
   - nedtelling
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 16.01.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/Migration.yml

@@ -8,5 +8,5 @@ keywords:
   - replace
   - new version
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 18.01.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/OpenSource.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.06458 4.26481C7.76736 2.95822 9.85369 2.25 12 2.25C14.1463 2.25 16.2326 2.95821 17.9354 4.2648C19.6382 5.57139 20.8623 7.40334 21.4178 9.47651C21.9733 11.5497 21.8292 13.7482 21.0078 15.7312C20.1865 17.7141 18.7338 19.3706 16.875 20.4437C16.7027 20.5432 16.498 20.5702 16.3059 20.5187C16.1138 20.4672 15.9499 20.3415 15.8505 20.1692L12.7005 14.7133C12.601 14.541 12.5741 14.3363 12.6256 14.1442C12.677 13.952 12.8027 13.7882 12.975 13.6887C13.3468 13.4741 13.6373 13.1428 13.8016 12.7462C13.9658 12.3496 13.9947 11.9099 13.8836 11.4953C13.7725 11.0807 13.5276 10.7143 13.1871 10.453C12.8465 10.1916 12.4293 10.05 12 10.05C11.5707 10.05 11.1535 10.1916 10.8129 10.453C10.4724 10.7143 10.2275 11.0807 10.1164 11.4953C10.0053 11.9099 10.0342 12.3496 10.1984 12.7462C10.3627 13.1428 10.6533 13.4741 11.025 13.6887C11.1973 13.7882 11.323 13.952 11.3744 14.1442C11.4259 14.3363 11.399 14.541 11.2995 14.7133L8.14952 20.1692C8.05007 20.3415 7.88625 20.4672 7.69412 20.5187C7.50198 20.5702 7.29727 20.5432 7.125 20.4437C5.26625 19.3706 3.81354 17.7141 2.99218 15.7312C2.17082 13.7482 2.02672 11.5497 2.58223 9.47652C3.13773 7.40334 4.3618 5.5714 6.06458 4.26481ZM12 3.75C10.1839 3.75 8.41854 4.34926 6.97772 5.45484C5.53691 6.56041 4.50116 8.11052 4.03112 9.86474C3.56107 11.619 3.683 13.4793 4.378 15.1571C4.97686 16.6029 5.97237 17.8436 7.24256 18.7401L9.66674 14.5413C9.29868 14.2034 9.00613 13.7874 8.81262 13.3203C8.52199 12.6186 8.471 11.8407 8.66756 11.1071C8.86412 10.3735 9.29725 9.72526 9.89978 9.26293C10.5023 8.8006 11.2405 8.55 12 8.55C12.7595 8.55 13.4977 8.8006 14.1002 9.26293C14.7028 9.72526 15.1359 10.3735 15.3324 11.1071C15.529 11.8407 15.478 12.6186 15.1874 13.3203C14.9939 13.7874 14.7013 14.2034 14.3333 14.5413L16.7574 18.7401C18.0276 17.8436 19.0231 16.6029 19.622 15.1571C20.317 13.4793 20.4389 11.619 19.9689 9.86474C19.4988 8.11052 18.4631 6.56041 17.0223 5.45483C15.5815 4.34926 13.8161 3.75 12 3.75Z" fill="#23262A"/>
+</svg>

@navikt/aksel-icons/icons/OpenSource.yml

@@ -0,0 +1,19 @@
+name: OpenSource
+category: Development
+sub_category: Development
+keywords:
+  - location
+  - tracking
+  - identification
+  - signaling
+  - broadcasting
+  - detection
+  - lokalisering
+  - sporing
+  - identifikasjon
+  - signalisering
+  - kringkasting
+  - deteksjon
+variant: Stroke
+updated_at: 08.03.2024
+created_at: 07.03.2023

@navikt/aksel-icons/icons/OpenSourceFill.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.06458 4.26481C7.76736 2.95822 9.85369 2.25 12 2.25C14.1463 2.25 16.2326 2.95821 17.9354 4.2648C19.6382 5.57139 20.8623 7.40334 21.4178 9.47651C21.9733 11.5497 21.8292 13.7482 21.0078 15.7312C20.1865 17.7141 18.7338 19.3706 16.875 20.4437C16.7027 20.5432 16.498 20.5702 16.3059 20.5187C16.1138 20.4672 15.9499 20.3415 15.8505 20.1692L12.7005 14.7133C12.601 14.541 12.5741 14.3363 12.6256 14.1442C12.677 13.952 12.8027 13.7882 12.975 13.6887C13.3468 13.4741 13.6373 13.1428 13.8016 12.7462C13.9658 12.3496 13.9947 11.9099 13.8836 11.4953C13.7725 11.0807 13.5276 10.7143 13.1871 10.453C12.8465 10.1916 12.4293 10.05 12 10.05C11.5707 10.05 11.1535 10.1916 10.8129 10.453C10.4724 10.7143 10.2275 11.0807 10.1164 11.4953C10.0053 11.9099 10.0342 12.3496 10.1984 12.7462C10.3627 13.1428 10.6533 13.4741 11.025 13.6887C11.1973 13.7882 11.323 13.952 11.3744 14.1442C11.4259 14.3363 11.399 14.541 11.2995 14.7133L8.14952 20.1692C8.05007 20.3415 7.88625 20.4672 7.69412 20.5187C7.50198 20.5702 7.29727 20.5432 7.125 20.4437C5.26625 19.3706 3.81354 17.7141 2.99218 15.7312C2.17082 13.7482 2.02672 11.5497 2.58223 9.47652C3.13773 7.40334 4.3618 5.5714 6.06458 4.26481Z" fill="#23262A"/>
+</svg>

@navikt/aksel-icons/icons/OpenSourceFill.yml

@@ -0,0 +1,19 @@
+name: OpenSourceFill
+category: Development
+sub_category: Development
+keywords:
+  - location
+  - tracking
+  - identification
+  - signaling
+  - broadcasting
+  - detection
+  - lokalisering
+  - sporing
+  - identifikasjon
+  - signalisering
+  - kringkasting
+  - deteksjon
+variant: Fill
+updated_at: 08.03.2024
+created_at: 07.03.2023

@navikt/aksel-icons/icons/PasswordHidden.yml

@@ -9,5 +9,5 @@ keywords:
   - hidden
   - show/hide
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 18.01.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/Tag.svg

@@ -1,3 +1,3 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M12.4445 6.61612C12.679 6.3817 12.9969 6.25 13.3284 6.25H17.5C17.6381 6.25 17.75 6.36193 17.75 6.5V10.6716C17.75 11.0031 17.6183 11.321 17.3839 11.5555L9.17678 19.7626C9.07915 19.8602 8.92086 19.8602 8.82322 19.7626L4.23744 15.1768C4.13981 15.0791 4.13981 14.9209 4.23744 14.8232L12.4445 6.61612ZM13.3284 4.75C12.5991 4.75 11.8996 5.03973 11.3839 5.55546L3.17678 13.7626C2.49336 14.446 2.49336 15.554 3.17678 16.2374L7.76256 20.8232C8.44598 21.5066 9.55402 21.5066 10.2374 20.8232L18.4445 12.6161C18.9603 12.1004 19.25 11.4009 19.25 10.6716V6.5C19.25 5.5335 18.4665 4.75 17.5 4.75H13.3284ZM14.5 11C15.3284 11 16 10.3284 16 9.5C16 8.67157 15.3284 8 14.5 8C13.6716 8 13 8.67157 13 9.5C13 10.3284 13.6716 11 14.5 11Z" fill="#23262A"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.4403 5.61612C13.6748 5.3817 13.9927 5.25 14.3242 5.25H18.4958C18.6339 5.25 18.7458 5.36193 18.7458 5.5V9.67157C18.7458 10.0031 18.6141 10.321 18.3797 10.5555L10.1726 18.7626C10.0749 18.8602 9.91664 18.8602 9.81901 18.7626L5.23323 14.1768C5.1356 14.0791 5.1356 13.9209 5.23323 13.8232L13.4403 5.61612ZM14.3242 3.75C13.5949 3.75 12.8954 4.03973 12.3797 4.55546L4.17257 12.7626C3.48915 13.446 3.48915 14.554 4.17257 15.2374L8.75835 19.8232C9.44177 20.5066 10.5498 20.5066 11.2332 19.8232L19.4403 11.6161C19.9561 11.1004 20.2458 10.4009 20.2458 9.67157V5.5C20.2458 4.5335 19.4623 3.75 18.4958 3.75H14.3242ZM15.4958 10C16.3242 10 16.9958 9.32843 16.9958 8.5C16.9958 7.67157 16.3242 7 15.4958 7C14.6674 7 13.9958 7.67157 13.9958 8.5C13.9958 9.32843 14.6674 10 15.4958 10Z" fill="#23262A"/>
 </svg>

@navikt/aksel-icons/icons/Tag.yml

@@ -12,5 +12,5 @@ keywords:
   - organisering
   - identifisering
 variant: Stroke
-updated_at: 12.12.2023
+updated_at: 13.03.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/TagFill.svg

@@ -1,3 +1,3 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M13.3284 4.75C12.5991 4.75 11.8996 5.03973 11.3839 5.55546L3.17678 13.7626C2.49336 14.446 2.49336 15.554 3.17678 16.2374L7.76256 20.8232C8.44598 21.5066 9.55402 21.5066 10.2374 20.8232L18.4445 12.6161C18.9603 12.1004 19.25 11.4009 19.25 10.6716V6.5C19.25 5.5335 18.4665 4.75 17.5 4.75H13.3284ZM14.5 11C15.3284 11 16 10.3284 16 9.5C16 8.67157 15.3284 8 14.5 8C13.6716 8 13 8.67157 13 9.5C13 10.3284 13.6716 11 14.5 11Z" fill="#23262A"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M14.3242 3.75C13.5949 3.75 12.8954 4.03973 12.3797 4.55546L4.17257 12.7626C3.48915 13.446 3.48915 14.554 4.17257 15.2374L8.75835 19.8232C9.44177 20.5066 10.5498 20.5066 11.2332 19.8232L19.4403 11.6161C19.9561 11.1004 20.2458 10.4009 20.2458 9.67157V5.5C20.2458 4.5335 19.4623 3.75 18.4958 3.75H14.3242ZM15.4958 10C16.3242 10 16.9958 9.32843 16.9958 8.5C16.9958 7.67157 16.3242 7 15.4958 7C14.6674 7 13.9958 7.67157 13.9958 8.5C13.9958 9.32843 14.6674 10 15.4958 10Z" fill="#23262A"/>
 </svg>

@navikt/aksel-icons/icons/TagFill.yml

@@ -12,5 +12,5 @@ keywords:
   - organisering
   - identifisering
 variant: Fill
-updated_at: 12.12.2023
+updated_at: 13.03.2024
 created_at: 07.03.2023

@navikt/aksel-icons/icons/Weight.yml

@@ -6,5 +6,5 @@ keywords:
   - vektløfting
   - tungt
 variant: Stroke
-updated_at: 04.12.2023
+updated_at: 11.03.2024
 created_at: 07.03.2023

@navikt/aksel-icons/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/aksel-icons",
-  "version": "6.0.0",
+  "version": "6.3.4",
   "author": "Aksel | NAV",
   "homepage": "https://aksel.nav.no/ikoner",
   "repository": {
@@ -61,9 +61,10 @@
     "update-metadata": "node config/metadata.js",
     "write-packagejson": "echo '{\"type\": \"module\"}' > dist/react/esm/package.json",
     "build": "yarn copy && yarn create-icons && concurrently \"tsc\" \"tsc -p tsconfig.esm.json && tsc-alias -p tsconfig.esm.json && yarn write-packagejson\" && node config/cleanTypes.js && yarn update-metadata && yarn parse-svg",
-    "test": "NODE_OPTIONS=--experimental-vm-modules jest",
     "fetch-new:icons": "node config/figma/index.mjs",
-    "zip:icons": "node config/zip.js"
+    "zip:icons": "node config/zip.js",
+    "test": "vitest run",
+    "test:watch": "vitest watch"
   },
   "devDependencies": {
     "@svgr/cli": "6.5.1",
@@ -74,7 +75,6 @@
     "dotenv": "^10.0.0",
     "fast-glob": "3.2.11",
     "hast-util-select": "5.0.5",
-    "jest": "^29.0.0",
     "js-yaml": "^4.1.0",
     "lodash.camelcase": "4.3.0",
     "lodash.startcase": "4.4.0",
@@ -82,15 +82,7 @@
     "rehype-parse": "8.0.4",
     "tsc-alias": "1.8.8",
     "typescript": "^5.1.6",
-    "unified": "10.1.2"
-  },
-  "jest": {
-    "transformIgnorePatterns": [
-      "node_modules/unified/*"
-    ],
-    "testMatch": [
-      "**/__tests__/*.js",
-      "**/__tests__/*.mjs"
-    ]
+    "unified": "10.1.2",
+    "vitest": "^1.2.2"
   }
 }

@navikt/aksel-stylelint/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @navikt/aksel-stylelint
 
+## 6.3.4
+
+## 6.3.3
+
+## 6.3.2
+
+## 6.3.1
+
+## 6.3.0
+
+## 6.2.0
+
+## 6.1.1
+
+## 6.1.0
+
 ## 6.0.0
 
 ### Major Changes

@navikt/aksel-stylelint/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/aksel-stylelint",
-  "version": "6.0.0",
+  "version": "6.3.4",
   "author": "Aksel | NAV",
   "homepage": "https://aksel.nav.no/grunnleggende/kode/stylelint",
   "repository": {
@@ -26,7 +26,7 @@
     "/dist"
   ],
   "scripts": {
-    "test": "jest",
+    "test": "yarn build && node --import tsx --test ./dist/**/*.test.js",
     "copy-css": "node -e \"require('fs').copyFileSync('../core/css/dist/index.css','dist/index.css')\"",
     "copy-tokens": "node -e \"require('fs').copyFileSync('../core/css/tokens.json','dist/tokens.json')\"",
     "copy": "yarn copy-css && yarn copy-tokens",
@@ -35,26 +35,14 @@
     "dev": "yarn watch:lint"
   },
   "devDependencies": {
-    "@navikt/ds-css": "^6.0.0",
-    "@navikt/ds-tokens": "^6.0.0",
-    "@types/jest": "^29.0.0",
+    "@navikt/ds-css": "^6.3.4",
+    "@navikt/ds-tokens": "^6.3.4",
     "concurrently": "7.2.1",
-    "copyfiles": "2.4.1",
-    "jest": "^29.0.0",
-    "jest-preset-stylelint": "^6.1.0",
     "postcss-selector-parser": "^6.0.13",
     "postcss-value-parser": "^4.2.0",
     "stylelint": "^14.8.5",
-    "ts-jest": "^29.0.0",
+    "stylelint-test-rule-node": "^0.2.1",
+    "tsx": "^4.7.1",
     "typescript": "^5.1.6"
-  },
-  "jest": {
-    "preset": "jest-preset-stylelint",
-    "testMatch": [
-      "**/*.test.ts"
-    ],
-    "transform": {
-      "^.+\\.ts?$": "ts-jest"
-    }
   }
 }

@navikt/aksel-stylelint/src/rules/aksel-design-token-exists/index.test.ts

@@ -1,7 +1,7 @@
-import { getTestRule } from "jest-preset-stylelint";
+import { testRule } from "stylelint-test-rule-node";
 import rule, { messages } from ".";
 
-getTestRule()({
+testRule({
   plugins: ["./dist/index.js"],
   ruleName: rule.ruleName,
   config: true,

@navikt/aksel-stylelint/src/rules/aksel-design-token-no-component-reference/index.test.ts

@@ -1,7 +1,7 @@
-import { getTestRule } from "jest-preset-stylelint";
+import { testRule } from "stylelint-test-rule-node";
 import rule, { messages } from ".";
 
-getTestRule()({
+testRule({
   plugins: ["./dist/index.js"],
   ruleName: rule.ruleName,
   config: true,

@navikt/aksel-stylelint/src/rules/aksel-design-token-no-global-override/index.test.ts

@@ -1,7 +1,7 @@
-import { getTestRule } from "jest-preset-stylelint";
+import { testRule } from "stylelint-test-rule-node";
 import rule, { messages } from ".";
 
-getTestRule()({
+testRule({
   plugins: ["./dist/index.js"],
   ruleName: rule.ruleName,
   config: true,

@navikt/aksel-stylelint/src/rules/aksel-no-class-override/index.test.ts

@@ -1,7 +1,7 @@
-import { getTestRule } from "jest-preset-stylelint";
+import { testRule } from "stylelint-test-rule-node";
 import rule, { messages } from ".";
 
-getTestRule()({
+testRule({
   plugins: ["./dist/index.js"],
   ruleName: rule.ruleName,
   config: true,

@navikt/aksel-stylelint/src/rules/aksel-no-deprecated-classes/index.test.ts

@@ -1,8 +1,8 @@
-import { getTestRule } from "jest-preset-stylelint";
+import { testRule } from "stylelint-test-rule-node";
 import rule, { messages } from ".";
 import { deprecations } from "../../deprecations";
 
-getTestRule()({
+testRule({
   plugins: ["./dist/index.js"],
   ruleName: rule.ruleName,
   config: true,

@navikt/aksel-stylelint/src/rules/aksel-no-internal-tokens/index.test.ts

@@ -1,7 +1,7 @@
-import { getTestRule } from "jest-preset-stylelint";
+import { testRule } from "stylelint-test-rule-node";
 import rule, { messages } from ".";
 
-getTestRule()({
+testRule({
   plugins: ["./dist/index.js"],
   ruleName: rule.ruleName,
   config: true,

@navikt/aksel-stylelint/tsconfig.json

@@ -6,7 +6,7 @@
     "target": "es2020",
     "preserveWatchOutput": true,
     "declaration": false,
-    "types": ["node", "jest", "@types/jest"],
+    "types": ["node"],
     "outDir": "dist",
     "rootDir": "./src",
     "resolveJsonModule": true,

@navikt/aksel/CHANGELOG.md

@@ -1,5 +1,61 @@
 # @navikt/aksel
 
+## 6.3.4
+
+### Patch Changes
+
+- Updated dependencies [[`a2af9bcc3`](https://github.com/navikt/aksel/commit/a2af9bcc37eb12cc7cf3a1596d57dc0421898657)]:
+  - @navikt/ds-css@6.3.4
+
+## 6.3.3
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @navikt/ds-css@6.3.3
+
+## 6.3.2
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @navikt/ds-css@6.3.2
+
+## 6.3.1
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @navikt/ds-css@6.3.1
+
+## 6.3.0
+
+### Patch Changes
+
+- Updated dependencies [[`25e0d15d6`](https://github.com/navikt/aksel/commit/25e0d15d67cebd36ee58aa3b7d9f1c7104d92de6)]:
+  - @navikt/ds-css@6.3.0
+
+## 6.2.0
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @navikt/ds-css@6.2.0
+
+## 6.1.1
+
+### Patch Changes
+
+- Updated dependencies [[`9510327ab`](https://github.com/navikt/aksel/commit/9510327abe96142943c6e92bd7c7da93a9721fd5), [`3d2eab4fd`](https://github.com/navikt/aksel/commit/3d2eab4fda07cac8071822e1f8e8fc5f69e7d234)]:
+  - @navikt/ds-css@6.1.1
+
+## 6.1.0
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @navikt/ds-css@6.1.0
+
 ## 6.0.0
 
 ### Major Changes

@navikt/aksel/jest.config.js

@@ -1,8 +0,0 @@
-const config = {
-  transform: { "^.+\\.js?$": "ts-jest", "^.+\\.ts?$": "ts-jest" },
-  testMatch: ["**/tests/*.test.ts"],
-  verbose: true,
-  rootDir: ".",
-};
-
-module.exports = config;

@navikt/aksel/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/aksel",
-  "version": "6.0.0",
+  "version": "6.3.4",
   "description": "Aksel command line interface. Handles css-imports, codemods and more",
   "author": "Aksel | NAV designsystem team",
   "license": "MIT",
@@ -18,8 +18,8 @@
     "clean": "rimraf dist",
     "build": "yarn clean && tsc -p tsconfig.json",
     "dev": "tsc --watch -p tsconfig.json",
-    "test": "yarn build && NODE_OPTIONS=--experimental-vm-modules yarn jest",
-    "test:watch": "NODE_OPTIONS=--experimental-vm-modules yarn jest --watch"
+    "test": "vitest run",
+    "test:watch": "vitest watch"
   },
   "bin": "./dist/index.js",
   "repository": {
@@ -29,7 +29,7 @@
   },
   "homepage": "https://aksel.nav.no/grunnleggende/kode/kommandolinje",
   "dependencies": {
-    "@navikt/ds-css": "6.0.0",
+    "@navikt/ds-css": "6.3.4",
     "axios": "1.6.0",
     "chalk": "4.1.0",
     "clipboardy": "^2.3.0",
@@ -44,12 +44,9 @@
     "react-scanner": "^1.1.0"
   },
   "devDependencies": {
-    "@types/inquirer": "^9.0.3",
-    "@types/jest": "^29.0.0",
-    "jest": "^29.0.0",
     "rimraf": "3.0.2",
-    "ts-jest": "^29.0.0",
-    "typescript": "^5.1.6"
+    "typescript": "^5.1.6",
+    "vitest": "^1.2.2"
   },
   "sideEffects": false,
   "engines": {

@navikt/aksel/src/codemod/tests/migrations.test.ts

@@ -1,5 +1,6 @@
 import fs from "fs";
 import path from "path";
+import { describe, expect, test } from "vitest";
 import { getMigrationNames, getMigrationPath } from "../migrations";
 
 describe("migrations", () => {

@navikt/aksel/src/codemod/utils/check.ts

@@ -2,6 +2,7 @@ import { applyTransform } from "jscodeshift/dist/testUtils";
 import fs from "node:fs";
 import path from "node:path";
 import prettier from "prettier";
+import { describe, expect, test } from "vitest";
 
 interface TestT {
   fixture: string;
@@ -15,7 +16,7 @@ export function check(
   { fixture, migration, extension = "js", options = {} }: TestT,
 ) {
   describe(migration, () => {
-    it(fixture, async () => {
+    test(fixture, async () => {
       const fixtureDir = path.join(dirName);
       const inputPath = path.join(fixtureDir, `${fixture}.input.${extension}`);
       const parser = extension;

@navikt/aksel/src/codemod/utils/tests/translate-token.test.ts

@@ -1,7 +1,6 @@
+import { describe, expect, test } from "vitest";
 import { translateToken } from "../translate-token";
 
-jest.autoMockOff();
-
 const tokens = [
   {
     name: "--navds-global-color-red-100",

@navikt/aksel/tsconfig.json

@@ -6,12 +6,13 @@
     "target": "es2015",
     "preserveWatchOutput": true,
     "declaration": false,
-    "types": ["node", "jest"],
+    "types": ["node"],
     "outDir": "dist",
     "rootDir": "./src",
     "resolveJsonModule": true,
-    "allowJs": true
+    "allowJs": true,
+    "skipLibCheck": true
   },
   "include": ["src/**/*.ts"],
-  "exclude": ["node_modules", "dist", "jest.config.js", "**/tests/**"]
+  "exclude": ["node_modules", "dist", "**/tests/**"]
 }

@navikt/core/css/CHANGELOG.md

@@ -1,5 +1,35 @@
 # @navikt/ds-css
 
+## 6.3.4
+
+### Patch Changes
+
+- ReadMore: Padding-right på button er bumpet noen px ([#2806](https://github.com/navikt/aksel/pull/2806))
+
+## 6.3.3
+
+## 6.3.2
+
+## 6.3.1
+
+## 6.3.0
+
+### Minor Changes
+
+- FileUpload: Ny komponent `FileUpload` for å håndtere opplasting av filer, Dropzone og fil-visning ([#2504](https://github.com/navikt/aksel/pull/2504))
+
+## 6.2.0
+
+## 6.1.1
+
+### Patch Changes
+
+- Link: Fjern hover-farge ([#2767](https://github.com/navikt/aksel/pull/2767))
+
+- Modal: Får nå fokus når åpnes i Safari ([#2688](https://github.com/navikt/aksel/pull/2688))
+
+## 6.1.0
+
 ## 6.0.0
 
 ### Major Changes

@navikt/core/css/config/_mappings.js

@@ -120,6 +120,11 @@ const StyleMappings = {
       dependencies: [typoCss],
     },
     { component: "Fieldset", main: formCss, dependencies: [typoCss] },
+    {
+      component: "FileUpload",
+      main: formCss,
+      dependencies: [typoCss, "button.css", "loader.css", "link.css"],
+    },
     { component: "Grid", main: "grid.css", dependencies: [typoCss] },
     {
       component: "GuidePanel",

@navikt/core/css/form/file-upload.css

@@ -0,0 +1,230 @@
+/**
+* Makes it easier for user to use FileItem in semantic lists
+*/
+.navds-file-upload :is(ul, li) {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+/**
+ * FileUpload.Dropzone
+ */
+
+.navds-dropzone__area {
+  --__ac-dropzone-background: var(--a-surface-subtle);
+  --__ac-dropzone-text-color: var(--a-text-default);
+  --__ac-dropzone-padding: var(--a-spacing-6);
+  --__ac-dropzone-icon-padding: var(--a-spacing-2);
+  --__ac-dropzone-animation-length-long: 0.6s;
+  --__ac-dropzone-animation-length-short: 250ms;
+  --__ac-dropzone-animation-ease-out: cubic-bezier(0.3, 1, 0.3, 1);
+  --__ac-dropzone-animation-over-under: cubic-bezier(0.3, 1.4, 0.3, 1);
+
+  position: relative;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  gap: var(--a-spacing-4);
+  text-align: center;
+  padding: var(--__ac-dropzone-padding);
+  outline: 1px dashed var(--a-border-subtle);
+  outline-offset: -1px;
+  border-radius: var(--a-border-radius-large);
+  background-color: var(--__ac-dropzone-background);
+  color: var(--__ac-dropzone-text-color);
+  transition: background-color var(--__ac-dropzone-animation-length-short) var(--__ac-dropzone-animation-ease-out);
+  cursor: pointer;
+}
+
+.navds-dropzone__area:hover {
+  box-shadow: inset 0 2px 4px 1px rgb(11 11 11/ 0.05);
+  outline-color: var(--a-border-default);
+}
+
+.navds-dropzone--disabled > .navds-dropzone__area:hover {
+  outline-color: var(--a-border-subtle);
+  box-shadow: initial;
+  cursor: default;
+}
+
+.navds-dropzone--dragging > .navds-dropzone__area {
+  --__ac-dropzone-background: var(--a-surface-action-subtle-hover);
+}
+
+.navds-dropzone--dragging > .navds-dropzone__area::after {
+  outline: 1px dashed var(--a-border-subtle);
+  outline-offset: -1px;
+  color: var(--a-text-action-selected);
+  background-color: var(--a-surface-hover);
+  content: "";
+  inset: 0;
+  position: absolute;
+  -webkit-backdrop-filter: blur(8px);
+  backdrop-filter: blur(8px);
+  box-shadow: inset 0 2px 7px 3px rgb(11 11 11/ 0.1);
+  border-radius: var(--a-border-radius-large);
+  animation: akselDropzoneDragoverAnimation var(--__ac-dropzone-animation-length-short) var(--__ac-dropzone-animation-ease-out);
+}
+
+@keyframes akselDropzoneDragoverAnimation {
+  0% {
+    -webkit-backdrop-filter: blur(0);
+    backdrop-filter: blur(0);
+    background-color: var(--a-surface-transparent);
+  }
+
+  70% {
+    -webkit-backdrop-filter: blur(8px);
+    backdrop-filter: blur(8px);
+  }
+
+  100% {
+    background-color: var(--a-surface-hover);
+  }
+}
+
+.navds-dropzone__area-icon {
+  display: grid;
+  padding: var(--__ac-dropzone-icon-padding);
+  visibility: hidden;
+}
+
+.navds-dropzone--error:where(:not(.navds-dropzone--dragging)) > .navds-dropzone__area {
+  outline-color: var(--a-surface-danger);
+  outline-width: 2px;
+}
+
+.navds-dropzone__area:hover > .navds-dropzone__area-button {
+  color: var(--ac-button-secondary-hover-text, var(--__ac-button-secondary-hover-text, var(--a-text-action-on-action-subtle)));
+  background-color: var(
+    --ac-button-secondary-hover-bg,
+    var(--__ac-button-secondary-hover-bg, var(--a-surface-action-subtle-hover))
+  );
+}
+
+.navds-dropzone__area:active .navds-dropzone__area-button {
+  color: var(--ac-button-secondary-active-text, var(--__ac-button-secondary-active-text, var(--a-text-on-action)));
+  background-color: var(--ac-button-secondary-active-bg, var(--__ac-button-secondary-active-bg, var(--a-surface-action-active)));
+  box-shadow: none;
+}
+
+.navds-dropzone__area-release {
+  top: var(--__ac-dropzone-padding);
+  display: grid;
+  position: absolute;
+  z-index: 1;
+  pointer-events: none;
+  transition:
+    top var(--__ac-dropzone-animation-length-long) var(--__ac-dropzone-animation-over-under),
+    transform var(--__ac-dropzone-animation-length-long) var(--__ac-dropzone-animation-over-under);
+}
+
+.navds-dropzone__area-release__icon {
+  display: grid;
+  padding: var(--__ac-dropzone-icon-padding);
+  border-radius: var(--a-border-radius-full);
+  background-color: var(--a-surface-neutral-subtle);
+  transition:
+    background-color 300ms var(--__ac-dropzone-animation-ease-out),
+    font-size 300ms var(--__ac-dropzone-animation-ease-out);
+  font-size: 1.5rem;
+}
+
+.navds-dropzone--dragging .navds-dropzone__area-release > .navds-dropzone__area-release__icon {
+  background-color: transparent;
+  font-size: 2rem;
+}
+
+.navds-dropzone__area-release__text {
+  visibility: hidden;
+}
+
+.navds-dropzone--dragging .navds-dropzone__area-release > .navds-dropzone__area-release__text {
+  transition: visibility var(--__ac-dropzone-animation-length-long) var(--__ac-dropzone-animation-over-under);
+  visibility: visible;
+}
+
+.navds-dropzone--dragging .navds-dropzone__area-release {
+  color: var(--a-text-action-selected);
+  top: 50%;
+  transform: translateY(-50%);
+}
+
+.navds-dropzone__area-disabled {
+  color: var(--a-text-subtle);
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  gap: var(--a-spacing-2);
+}
+
+/**
+ * FileUpload.Item
+ */
+
+.navds-file-item__inner {
+  outline: 1px solid var(--a-border-subtle);
+  outline-offset: -1px;
+  transition: outline-color 250ms cubic-bezier(0, 0.3, 0.15, 1);
+  border-radius: var(--a-border-radius-large);
+  padding: var(--a-spacing-3);
+  display: flex;
+  gap: var(--a-spacing-3);
+  align-items: flex-start;
+}
+
+.navds-file-item--error > .navds-file-item__inner {
+  outline: 2px solid var(--a-surface-danger);
+}
+
+.navds-file-item__icon {
+  background-color: var(--a-surface-neutral-subtle);
+  color: var(--a-icon-default);
+  border-radius: var(--a-border-radius-xlarge);
+  min-height: 3rem;
+  min-width: 3rem;
+  display: grid;
+  place-content: center;
+  transition: background-color 250ms cubic-bezier(0, 0.3, 0.15, 1);
+}
+
+.navds-file-item__icon--loading {
+  background-color: transparent;
+}
+
+.navds-file-item__file-info {
+  word-break: break-word;
+}
+
+.navds-file-item__button {
+  margin-left: auto;
+}
+
+.navds-file-item__error {
+  color: var(--a-text-danger);
+  display: grid;
+  transition-property: grid-template-rows, padding-top;
+  transition-duration: 250ms;
+  transition-timing-function: cubic-bezier(0, 0.3, 0.15, 1);
+  overflow: hidden;
+  grid-template-rows: 0fr;
+}
+
+.navds-file-item--error .navds-file-item__error {
+  grid-template-rows: 1fr;
+  padding-top: var(--a-spacing-1);
+}
+
+.navds-file-item__error-content > svg {
+  flex-shrink: 0;
+  height: 1rem;
+  margin-top: 0.1rem;
+}
+
+.navds-file-item__error-content {
+  min-height: 0;
+  display: flex;
+  gap: var(--a-spacing-1);
+}

@navikt/core/css/form/form.css

@@ -18,13 +18,15 @@
 }
 
 .navds-form-field .navds-error-message,
-.navds-fieldset .navds-error-message {
+.navds-fieldset .navds-error-message,
+.navds-file-item .navds-error-message {
   display: flex;
   gap: var(--a-spacing-2);
 }
 
 .navds-form-field .navds-error-message::before,
-.navds-fieldset .navds-error-message::before {
+.navds-fieldset .navds-error-message::before,
+.navds-file-item .navds-error-message::before {
   content: "•";
 }
 

@navikt/core/css/form/index.css

@@ -2,6 +2,7 @@
   Order matters; rearrange with care
 */
 @import "fieldset.css";
+@import "file-upload.css";
 @import "form.css";
 @import "error-summary.css";
 @import "confirmation-panel.css";

@navikt/core/css/link.css

@@ -20,7 +20,6 @@
 
 .navds-link:hover {
   text-decoration: none;
-  color: var(--ac-link-hover-text, var(--a-text-action-hover));
 }
 
 .navds-link.navds-link--remove-underline {

@navikt/core/css/modal.css

@@ -146,7 +146,7 @@
 
 @keyframes akselModalFadeIn {
   from {
-    opacity: 0;
+    opacity: 0.0001; /* Safari will not set focus inside the modal when it opens if we set this to 0 */
     transform: translate3d(0, calc(5% + 4px), 0);
   }
 

@navikt/core/css/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/ds-css",
-  "version": "6.0.0",
+  "version": "6.3.4",
   "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": "^6.0.0",
+    "@navikt/ds-tokens": "^6.3.4",
     "cssnano": "6.0.0",
     "fast-glob": "3.2.11",
     "lodash": "4.17.21",

@navikt/core/css/read-more.css

@@ -8,12 +8,12 @@
   gap: var(--a-spacing-05);
   color: var(--ac-read-more-text, var(--a-text-action));
   border-radius: var(--a-border-radius-small);
-  padding: var(--a-spacing-1) var(--a-spacing-1) var(--a-spacing-1) var(--a-spacing-05);
+  padding: var(--a-spacing-1) var(--a-spacing-2) var(--a-spacing-1) var(--a-spacing-05);
   text-align: start;
 }
 
 .navds-read-more--small .navds-read-more__button {
-  padding: var(--a-spacing-05) var(--a-spacing-1) var(--a-spacing-05) var(--a-spacing-05);
+  padding: var(--a-spacing-05) var(--a-spacing-1-alt) var(--a-spacing-05) var(--a-spacing-05);
 }
 
 @media (forced-colors: active) {

@navikt/core/css/tokens.json

@@ -174,7 +174,6 @@
   },
   "link": {
     "--ac-link-text": "--a-text-action",
-    "--ac-link-hover-text": "--a-text-action-hover",
     "--ac-link-focus-text": "--a-text-on-action",
     "--ac-link-focus-bg": "--a-border-focus",
     "--ac-link-focus-border": "--a-border-focus",

@navikt/core/react/CHANGELOG.md

@@ -1,5 +1,101 @@
 # @navikt/ds-react
 
+## 6.3.4
+
+### Patch Changes
+
+- Switch: Fikset edgecase der checked Switch var visuelt unchecked ([#2810](https://github.com/navikt/aksel/pull/2810))
+
+- FileUpload.Dropzone: id prop settes på button ([#2817](https://github.com/navikt/aksel/pull/2817))
+
+- Updated dependencies []:
+  - @navikt/ds-tokens@6.3.4
+  - @navikt/aksel-icons@6.3.4
+
+## 6.3.3
+
+### Patch Changes
+
+- FileUpload.Dropzone: Fiks feil med duplisert id ([#2805](https://github.com/navikt/aksel/pull/2805))
+
+- useDatePicker: `isInvalid`-key i onValidate var hadde flipper boolean i noen tilfeller ([#2809](https://github.com/navikt/aksel/pull/2809))
+
+- Updated dependencies []:
+  - @navikt/ds-tokens@6.3.3
+  - @navikt/aksel-icons@6.3.3
+
+## 6.3.2
+
+### Patch Changes
+
+- FileUpload: Fiks feil ved import av json ([#2803](https://github.com/navikt/aksel/pull/2803))
+
+- Updated dependencies []:
+  - @navikt/ds-tokens@6.3.2
+  - @navikt/aksel-icons@6.3.2
+
+## 6.3.1
+
+### Patch Changes
+
+- FileUpload: Disabled dropzone stopper opplasting ([#2798](https://github.com/navikt/aksel/pull/2798))
+
+- Updated dependencies []:
+  - @navikt/ds-tokens@6.3.1
+  - @navikt/aksel-icons@6.3.1
+
+## 6.3.0
+
+### Minor Changes
+
+- Allow Combobox options as objects to support separate display text and value ([#2716](https://github.com/navikt/aksel/pull/2716))
+
+- FileUpload: Ny komponent `FileUpload` for å håndtere opplasting av filer, Dropzone og fil-visning ([#2504](https://github.com/navikt/aksel/pull/2504))
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @navikt/ds-tokens@6.3.0
+  - @navikt/aksel-icons@6.3.0
+
+## 6.2.0
+
+### Patch Changes
+
+- Select: Fjern 'multiple' fra SelectProps ([#2782](https://github.com/navikt/aksel/pull/2782))
+
+- Updated dependencies [[`331b4c4c0`](https://github.com/navikt/aksel/commit/331b4c4c00c323ad7a212bcd45889d2b80c09dee), [`dc5ea3b84`](https://github.com/navikt/aksel/commit/dc5ea3b8420a02690bc88dbbbb97eefe4ee7564d)]:
+  - @navikt/aksel-icons@6.2.0
+  - @navikt/ds-tokens@6.2.0
+
+## 6.1.1
+
+### Patch Changes
+
+- Modal: Fikser uønsket lukking ved klikk-og-dra mellom backdrop og modal (f.eks. ved markering av tekst) dersom `closeOnBackdropClick` er `true`. ([#2752](https://github.com/navikt/aksel/pull/2752))
+
+- Modal: Endre title på lukkeknapp til bare 'Lukk' ([#2688](https://github.com/navikt/aksel/pull/2688))
+
+- Updated dependencies []:
+  - @navikt/ds-tokens@6.1.1
+  - @navikt/aksel-icons@6.1.1
+
+## 6.1.0
+
+### Minor Changes
+
+- Komponenter støtter nå lokal import `@navikt/ds-react/Button`, [Dokumentasjon](https://aksel.nav.no/grunnleggende/kode/nextjs). ([#2745](https://github.com/navikt/aksel/pull/2745))
+
+### Patch Changes
+
+- Modal: Bedre feilmeldinger ved feil bruk av props ([#2744](https://github.com/navikt/aksel/pull/2744))
+
+- Modal: Ikke opphev scroll lock ved lukking av nesta modal (DatePicker) ([#2743](https://github.com/navikt/aksel/pull/2743))
+
+- Updated dependencies []:
+  - @navikt/ds-tokens@6.1.0
+  - @navikt/aksel-icons@6.1.0
+
 ## 6.0.0
 
 ### Major Changes
@@ -24,7 +120,7 @@
 
 ### Minor Changes
 
-- SSR: ds-react og aksel-icons støtter nå `use-client` og kan brukes i nextjs app-router uten lokal re-eksportering. ([#2623](https://github.com/navikt/aksel/pull/2623))
+- SSR: ds-react og aksel-icons støtter nå `use client` og kan brukes i nextjs app-router uten lokal re-eksportering. ([#2623](https://github.com/navikt/aksel/pull/2623))
 
 ### Patch Changes
 
@@ -1100,7 +1196,7 @@
 
 ### Patch Changes
 
-- CopyButton: Fjernet use-client directive fra komponent. (warning i vite/rollup)
+- CopyButton: Fjernet use client directive fra komponent. (warning i vite/rollup)
 
 ## 3.2.0
 

@navikt/core/react/jest-setup.ts

@@ -1,7 +0,0 @@
-import "@testing-library/jest-dom/extend-expect";
-
-global.ResizeObserver = jest.fn().mockImplementation(() => ({
-  observe: jest.fn(),
-  unobserve: jest.fn(),
-  disconnect: jest.fn(),
-}));

@navikt/core/react/jest.config.js

@@ -1,7 +0,0 @@
-module.exports = {
-  transform: {
-    "^.+\\.tsx?$": "ts-jest",
-  },
-  setupFilesAfterEnv: ["<rootDir>/jest-setup.ts"],
-  testEnvironment: "jsdom",
-};

@navikt/core/react/package.json

@@ -1,13 +1,14 @@
 {
   "name": "@navikt/ds-react",
-  "version": "6.0.0",
-  "description": "Aksel react-components for NAV designsystem",
-  "author": "Aksel | NAV designsystem team",
+  "version": "6.3.4",
+  "description": "React components from the Norwegian Labour and Welfare Administration.",
+  "author": "Aksel, a team part of the Norwegian Labour and Welfare Administration.",
   "license": "MIT",
   "keywords": [
     "react",
     "typescript",
-    "javascript"
+    "javascript",
+    "NAV"
   ],
   "repository": {
     "type": "git",
@@ -38,6 +39,516 @@
         "default": "./cjs/index.js"
       }
     },
+    "./Accordion": {
+      "import": {
+        "types": "./esm/accordion/index.d.ts",
+        "default": "./esm/accordion/index.js"
+      },
+      "require": {
+        "types": "./cjs/accordion/index.d.ts",
+        "default": "./cjs/accordion/index.js"
+      }
+    },
+    "./Alert": {
+      "import": {
+        "types": "./esm/alert/index.d.ts",
+        "default": "./esm/alert/index.js"
+      },
+      "require": {
+        "types": "./cjs/alert/index.d.ts",
+        "default": "./cjs/alert/index.js"
+      }
+    },
+    "./Button": {
+      "import": {
+        "types": "./esm/button/index.d.ts",
+        "default": "./esm/button/index.js"
+      },
+      "require": {
+        "types": "./cjs/button/index.d.ts",
+        "default": "./cjs/button/index.js"
+      }
+    },
+    "./Chat": {
+      "import": {
+        "types": "./esm/chat/index.d.ts",
+        "default": "./esm/chat/index.js"
+      },
+      "require": {
+        "types": "./cjs/chat/index.d.ts",
+        "default": "./cjs/chat/index.js"
+      }
+    },
+    "./Chips": {
+      "import": {
+        "types": "./esm/chips/index.d.ts",
+        "default": "./esm/chips/index.js"
+      },
+      "require": {
+        "types": "./cjs/chips/index.d.ts",
+        "default": "./cjs/chips/index.js"
+      }
+    },
+    "./CopyButton": {
+      "import": {
+        "types": "./esm/copybutton/index.d.ts",
+        "default": "./esm/copybutton/index.js"
+      },
+      "require": {
+        "types": "./cjs/copybutton/index.d.ts",
+        "default": "./cjs/copybutton/index.js"
+      }
+    },
+    "./DatePicker": {
+      "import": {
+        "types": "./esm/date/datepicker/index.d.ts",
+        "default": "./esm/date/datepicker/index.js"
+      },
+      "require": {
+        "types": "./cjs/date/datepicker/index.d.ts",
+        "default": "./cjs/date/datepicker/index.js"
+      }
+    },
+    "./MonthPicker": {
+      "import": {
+        "types": "./esm/date/monthpicker/index.d.ts",
+        "default": "./esm/date/monthpicker/index.js"
+      },
+      "require": {
+        "types": "./cjs/date/monthpicker/index.d.ts",
+        "default": "./cjs/date/monthpicker/index.js"
+      }
+    },
+    "./Dropdown": {
+      "import": {
+        "types": "./esm/dropdown/index.d.ts",
+        "default": "./esm/dropdown/index.js"
+      },
+      "require": {
+        "types": "./cjs/dropdown/index.d.ts",
+        "default": "./cjs/dropdown/index.js"
+      }
+    },
+    "./ExpansionCard": {
+      "import": {
+        "types": "./esm/expansion-card/index.d.ts",
+        "default": "./esm/expansion-card/index.js"
+      },
+      "require": {
+        "types": "./cjs/expansion-card/index.d.ts",
+        "default": "./cjs/expansion-card/index.js"
+      }
+    },
+    "./GuidePanel": {
+      "import": {
+        "types": "./esm/guide-panel/index.d.ts",
+        "default": "./esm/guide-panel/index.js"
+      },
+      "require": {
+        "types": "./cjs/guide-panel/index.d.ts",
+        "default": "./cjs/guide-panel/index.js"
+      }
+    },
+    "./HelpText": {
+      "import": {
+        "types": "./esm/help-text/index.d.ts",
+        "default": "./esm/help-text/index.js"
+      },
+      "require": {
+        "types": "./cjs/help-text/index.d.ts",
+        "default": "./cjs/help-text/index.js"
+      }
+    },
+    "./InternalHeader": {
+      "import": {
+        "types": "./esm/internal-header/index.d.ts",
+        "default": "./esm/internal-header/index.js"
+      },
+      "require": {
+        "types": "./cjs/internal-header/index.d.ts",
+        "default": "./cjs/internal-header/index.js"
+      }
+    },
+    "./Bleed": {
+      "import": {
+        "types": "./esm/layout/bleed/index.d.ts",
+        "default": "./esm/layout/bleed/index.js"
+      },
+      "require": {
+        "types": "./cjs/layout/bleed/index.d.ts",
+        "default": "./cjs/layout/bleed/index.js"
+      }
+    },
+    "./Box": {
+      "import": {
+        "types": "./esm/layout/box/index.d.ts",
+        "default": "./esm/layout/box/index.js"
+      },
+      "require": {
+        "types": "./cjs/layout/box/index.d.ts",
+        "default": "./cjs/layout/box/index.js"
+      }
+    },
+    "./HGrid": {
+      "import": {
+        "types": "./esm/layout/grid/index.d.ts",
+        "default": "./esm/layout/grid/index.js"
+      },
+      "require": {
+        "types": "./cjs/layout/grid/index.d.ts",
+        "default": "./cjs/layout/grid/index.js"
+      }
+    },
+    "./Page": {
+      "import": {
+        "types": "./esm/layout/page/index.d.ts",
+        "default": "./esm/layout/page/index.js"
+      },
+      "require": {
+        "types": "./cjs/layout/page/index.d.ts",
+        "default": "./cjs/layout/page/index.js"
+      }
+    },
+    "./Responsive": {
+      "import": {
+        "types": "./esm/layout/responsive/index.d.ts",
+        "default": "./esm/layout/responsive/index.js"
+      },
+      "require": {
+        "types": "./cjs/layout/responsive/index.d.ts",
+        "default": "./cjs/layout/responsive/index.js"
+      }
+    },
+    "./Stack": {
+      "import": {
+        "types": "./esm/layout/stack/index.d.ts",
+        "default": "./esm/layout/stack/index.js"
+      },
+      "require": {
+        "types": "./cjs/layout/stack/index.d.ts",
+        "default": "./cjs/layout/stack/index.js"
+      }
+    },
+    "./Link": {
+      "import": {
+        "types": "./esm/link/index.d.ts",
+        "default": "./esm/link/index.js"
+      },
+      "require": {
+        "types": "./cjs/link/index.d.ts",
+        "default": "./cjs/link/index.js"
+      }
+    },
+    "./LinkPanel": {
+      "import": {
+        "types": "./esm/link-panel/index.d.ts",
+        "default": "./esm/link-panel/index.js"
+      },
+      "require": {
+        "types": "./cjs/link-panel/index.d.ts",
+        "default": "./cjs/link-panel/index.js"
+      }
+    },
+    "./List": {
+      "import": {
+        "types": "./esm/list/index.d.ts",
+        "default": "./esm/list/index.js"
+      },
+      "require": {
+        "types": "./cjs/list/index.d.ts",
+        "default": "./cjs/list/index.js"
+      }
+    },
+    "./Loader": {
+      "import": {
+        "types": "./esm/loader/index.d.ts",
+        "default": "./esm/loader/index.js"
+      },
+      "require": {
+        "types": "./cjs/loader/index.d.ts",
+        "default": "./cjs/loader/index.js"
+      }
+    },
+    "./Modal": {
+      "import": {
+        "types": "./esm/modal/index.d.ts",
+        "default": "./esm/modal/index.js"
+      },
+      "require": {
+        "types": "./cjs/modal/index.d.ts",
+        "default": "./cjs/modal/index.js"
+      }
+    },
+    "./Portal": {
+      "import": {
+        "types": "./esm/portal/index.d.ts",
+        "default": "./esm/portal/index.js"
+      },
+      "require": {
+        "types": "./cjs/portal/index.d.ts",
+        "default": "./cjs/portal/index.js"
+      }
+    },
+    "./Pagination": {
+      "import": {
+        "types": "./esm/pagination/index.d.ts",
+        "default": "./esm/pagination/index.js"
+      },
+      "require": {
+        "types": "./cjs/pagination/index.d.ts",
+        "default": "./cjs/pagination/index.js"
+      }
+    },
+    "./Popover": {
+      "import": {
+        "types": "./esm/popover/index.d.ts",
+        "default": "./esm/popover/index.js"
+      },
+      "require": {
+        "types": "./cjs/popover/index.d.ts",
+        "default": "./cjs/popover/index.js"
+      }
+    },
+    "./Provider": {
+      "import": {
+        "types": "./esm/provider/index.d.ts",
+        "default": "./esm/provider/index.js"
+      },
+      "require": {
+        "types": "./cjs/provider/index.d.ts",
+        "default": "./cjs/provider/index.js"
+      }
+    },
+    "./ReadMore": {
+      "import": {
+        "types": "./esm/read-more/index.d.ts",
+        "default": "./esm/read-more/index.js"
+      },
+      "require": {
+        "types": "./cjs/read-more/index.d.ts",
+        "default": "./cjs/read-more/index.js"
+      }
+    },
+    "./Skeleton": {
+      "import": {
+        "types": "./esm/skeleton/index.d.ts",
+        "default": "./esm/skeleton/index.js"
+      },
+      "require": {
+        "types": "./cjs/skeleton/index.d.ts",
+        "default": "./cjs/skeleton/index.js"
+      }
+    },
+    "./Stepper": {
+      "import": {
+        "types": "./esm/stepper/index.d.ts",
+        "default": "./esm/stepper/index.js"
+      },
+      "require": {
+        "types": "./cjs/stepper/index.d.ts",
+        "default": "./cjs/stepper/index.js"
+      }
+    },
+    "./Table": {
+      "import": {
+        "types": "./esm/table/index.d.ts",
+        "default": "./esm/table/index.js"
+      },
+      "require": {
+        "types": "./cjs/table/index.d.ts",
+        "default": "./cjs/table/index.js"
+      }
+    },
+    "./Tabs": {
+      "import": {
+        "types": "./esm/tabs/index.d.ts",
+        "default": "./esm/tabs/index.js"
+      },
+      "require": {
+        "types": "./cjs/tabs/index.d.ts",
+        "default": "./cjs/tabs/index.js"
+      }
+    },
+    "./Tag": {
+      "import": {
+        "types": "./esm/tag/index.d.ts",
+        "default": "./esm/tag/index.js"
+      },
+      "require": {
+        "types": "./cjs/tag/index.d.ts",
+        "default": "./cjs/tag/index.js"
+      }
+    },
+    "./Timeline": {
+      "import": {
+        "types": "./esm/timeline/index.d.ts",
+        "default": "./esm/timeline/index.js"
+      },
+      "require": {
+        "types": "./cjs/timeline/index.d.ts",
+        "default": "./cjs/timeline/index.js"
+      }
+    },
+    "./ToggleGroup": {
+      "import": {
+        "types": "./esm/toggle-group/index.d.ts",
+        "default": "./esm/toggle-group/index.js"
+      },
+      "require": {
+        "types": "./cjs/toggle-group/index.d.ts",
+        "default": "./cjs/toggle-group/index.js"
+      }
+    },
+    "./Tooltip": {
+      "import": {
+        "types": "./esm/tooltip/index.d.ts",
+        "default": "./esm/tooltip/index.js"
+      },
+      "require": {
+        "types": "./cjs/tooltip/index.d.ts",
+        "default": "./cjs/tooltip/index.js"
+      }
+    },
+    "./Typography": {
+      "import": {
+        "types": "./esm/typography/index.d.ts",
+        "default": "./esm/typography/index.js"
+      },
+      "require": {
+        "types": "./cjs/typography/index.d.ts",
+        "default": "./cjs/typography/index.js"
+      }
+    },
+    "./Utils": {
+      "import": {
+        "types": "./esm/util/index.d.ts",
+        "default": "./esm/util/index.js"
+      },
+      "require": {
+        "types": "./cjs/util/index.d.ts",
+        "default": "./cjs/util/index.js"
+      }
+    },
+    "./Checkbox": {
+      "import": {
+        "types": "./esm/form/checkbox/index.d.ts",
+        "default": "./esm/form/checkbox/index.js"
+      },
+      "require": {
+        "types": "./cjs/form/checkbox/index.d.ts",
+        "default": "./cjs/form/checkbox/index.js"
+      }
+    },
+    "./Radio": {
+      "import": {
+        "types": "./esm/form/radio/index.d.ts",
+        "default": "./esm/form/radio/index.js"
+      },
+      "require": {
+        "types": "./cjs/form/radio/index.d.ts",
+        "default": "./cjs/form/radio/index.js"
+      }
+    },
+    "./Combobox": {
+      "import": {
+        "types": "./esm/form/combobox/index.d.ts",
+        "default": "./esm/form/combobox/index.js"
+      },
+      "require": {
+        "types": "./cjs/form/combobox/index.d.ts",
+        "default": "./cjs/form/combobox/index.js"
+      }
+    },
+    "./ConfirmationPanel": {
+      "import": {
+        "types": "./esm/form/confirmation-panel/index.d.ts",
+        "default": "./esm/form/confirmation-panel/index.js"
+      },
+      "require": {
+        "types": "./cjs/form/confirmation-panel/index.d.ts",
+        "default": "./cjs/form/confirmation-panel/index.js"
+      }
+    },
+    "./ErrorSummary": {
+      "import": {
+        "types": "./esm/form/error-summary/index.d.ts",
+        "default": "./esm/form/error-summary/index.js"
+      },
+      "require": {
+        "types": "./cjs/form/error-summary/index.d.ts",
+        "default": "./cjs/form/error-summary/index.js"
+      }
+    },
+    "./Fieldset": {
+      "import": {
+        "types": "./esm/form/fieldset/index.d.ts",
+        "default": "./esm/form/fieldset/index.js"
+      },
+      "require": {
+        "types": "./cjs/form/fieldset/index.d.ts",
+        "default": "./cjs/form/fieldset/index.js"
+      }
+    },
+    "./Search": {
+      "import": {
+        "types": "./esm/form/search/index.d.ts",
+        "default": "./esm/form/search/index.js"
+      },
+      "require": {
+        "types": "./cjs/form/search/index.d.ts",
+        "default": "./cjs/form/search/index.js"
+      }
+    },
+    "./Select": {
+      "import": {
+        "types": "./esm/form/select/index.d.ts",
+        "default": "./esm/form/select/index.js"
+      },
+      "require": {
+        "types": "./cjs/form/select/index.d.ts",
+        "default": "./cjs/form/select/index.js"
+      }
+    },
+    "./Switch": {
+      "import": {
+        "types": "./esm/form/switch/index.d.ts",
+        "default": "./esm/form/switch/index.js"
+      },
+      "require": {
+        "types": "./cjs/form/switch/index.d.ts",
+        "default": "./cjs/form/switch/index.js"
+      }
+    },
+    "./Textarea": {
+      "import": {
+        "types": "./esm/form/textarea/index.d.ts",
+        "default": "./esm/form/textarea/index.js"
+      },
+      "require": {
+        "types": "./cjs/form/textarea/index.d.ts",
+        "default": "./cjs/form/textarea/index.js"
+      }
+    },
+    "./TextField": {
+      "import": {
+        "types": "./esm/form/textfield/index.d.ts",
+        "default": "./esm/form/textfield/index.js"
+      },
+      "require": {
+        "types": "./cjs/form/textfield/index.d.ts",
+        "default": "./cjs/form/textfield/index.js"
+      }
+    },
+    "./FileUpload": {
+      "import": {
+        "types": "./esm/form/file-upload/index.d.ts",
+        "default": "./esm/form/file-upload/index.js"
+      },
+      "require": {
+        "types": "./cjs/form/file-upload/index.d.ts",
+        "default": "./cjs/form/file-upload/index.js"
+      }
+    },
     "./package.json": "./package.json"
   },
   "scripts": {
@@ -46,12 +557,13 @@
     "clean": "rimraf cjs esm",
     "build": "concurrently \"tsc -p tsconfig.build.json\" \"tsc -p tsconfig.esm.json && tsc-alias -p tsconfig.esm.json && yarn write-packagejson\" ",
     "watch": "tsc --watch -p tsconfig.esm.json",
-    "test": "TZ=UTC jest"
+    "test": "TZ=UTC vitest run -c tests/vitest.config.ts",
+    "test:watch": "vitest watch"
   },
   "dependencies": {
     "@floating-ui/react": "0.25.4",
-    "@navikt/aksel-icons": "^6.0.0",
-    "@navikt/ds-tokens": "^6.0.0",
+    "@navikt/aksel-icons": "^6.3.4",
+    "@navikt/ds-tokens": "^6.3.4",
     "@radix-ui/react-tabs": "1.0.0",
     "@radix-ui/react-toggle-group": "1.0.0",
     "clsx": "^2.1.0",
@@ -64,21 +576,18 @@
     "@testing-library/react": "^13.3.0",
     "@testing-library/user-event": "^14.2.0",
     "@types/faker": "5.5.8",
-    "@types/jest": "^29.0.0",
     "concurrently": "7.2.1",
-    "copyfiles": "^2.4.1",
     "faker": "5.5.3",
     "fast-glob": "3.2.11",
-    "jest": "^29.0.0",
-    "jest-environment-jsdom": "^29.0.0",
+    "jsdom": "24.0.0",
     "react-dom": "^18.0.0",
     "react-router-dom": "^6.3.0",
     "rimraf": "3.0.2",
     "swr": "^1.1.2",
-    "ts-jest": "^29.0.0",
     "ts-node": "^10.9.1",
     "tsc-alias": "1.8.8",
-    "typescript": "^5.1.6"
+    "typescript": "^5.1.6",
+    "vitest": "^1.2.2"
   },
   "peerDependencies": {
     "@types/react": "^17.0.30 || ^18.0.0",

@navikt/core/react/src/accordion/Accordion.tsx

@@ -31,11 +31,11 @@ interface AccordionComponent
 
 export interface AccordionProps extends React.HTMLAttributes<HTMLDivElement> {
   /**
-   * @default 'default'
+   * @default "default"
    */
   variant?: "default" | "neutral";
   /**
-   * @default 'small'
+   * @default "small"
    */
   headingSize?: "large" | "medium" | "small" | "xsmall";
   /**
@@ -43,12 +43,12 @@ export interface AccordionProps extends React.HTMLAttributes<HTMLDivElement> {
    */
   size?: "large" | "medium" | "small";
   /**
-   * Whether to indent content or not
+   * Whether to indent content or not.
    * @default true
    */
   indent?: boolean;
   /**
-   * Instances of Accordion.Item
+   * Instances of `Accordion.Item`.
    */
   children: React.ReactNode;
 }

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

@@ -162,9 +162,7 @@ export const Variants: Story = {
 
 export const ControlledState: Story = {
   render: () => {
-    // eslint-disable-next-line react-hooks/rules-of-hooks
     const [open, setOpen] = useState(false);
-    // eslint-disable-next-line react-hooks/rules-of-hooks
     const [open2, setOpen2] = useState(false);
 
     return (

@navikt/core/react/src/accordion/index.ts

@@ -1 +1,14 @@
+"use client";
 export { type AccordionProps, default as Accordion } from "./Accordion";
+export {
+  default as AccordionHeader,
+  type AccordionHeaderProps,
+} from "./AccordionHeader";
+export {
+  default as AccordionContent,
+  type AccordionContentProps,
+} from "./AccordionContent";
+export {
+  default as AccordionItem,
+  type AccordionItemProps,
+} from "./AccordionItem";

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

@@ -12,37 +12,39 @@ import { BodyLong } from "../typography";
 
 export interface AlertProps extends React.HTMLAttributes<HTMLDivElement> {
   /**
-   * Alert content
+   * Alert content.
    */
   children: React.ReactNode;
   /**
-   * Changes colors and icon usage when changed
+   * Changes colors and icon usage when changed.
    */
   variant: "error" | "warning" | "info" | "success";
   /**
-   * Changes padding and font-sizes
-   * @default medium
+   * Changes padding and font-sizes.
+   * @default "medium"
    */
   size?: "medium" | "small";
   /**
-   * Removes border-radius
+   * Removes `border-radius`.
    * @default false
    */
   fullWidth?: boolean;
   /**
-   * Removes background from Alert
+   * Removes background from Alert.
    * @default false
    */
   inline?: boolean;
   /**
-   * Removes close-button(X) when false
-   * Requires onClose to be set
+   * 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
+   * Callback for alert wanting to close.
+   *
+   * **Requires closeButton to be true**.
    */
   onClose?: () => void;
 }

@navikt/core/react/src/alert/index.ts

@@ -1,2 +1,2 @@
-export { default as Alert } from "./Alert";
-export { type AlertProps } from "./Alert";
+"use client";
+export { default as Alert, type AlertProps } from "./Alert";

@navikt/core/react/src/button/Button.tsx

@@ -11,11 +11,11 @@ import { OverridableComponent } from "../util/types";
 export interface ButtonProps
   extends React.ButtonHTMLAttributes<HTMLButtonElement> {
   /**
-   * Button content
+   * Button content.
    */
   children?: React.ReactNode;
   /**
-   * Changes design and interaction-visuals
+   * Changes design and interaction-visuals.
    * @default "primary"
    */
   variant?:
@@ -27,26 +27,27 @@ export interface ButtonProps
     | "tertiary-neutral"
     | "danger";
   /**
-   * Changes padding, height and font-size
-   * @default medium
+   * Changes padding, height, and font-size.
+   * @default "medium"
    */
   size?: "medium" | "small" | "xsmall";
   /**
+   * **Avoid using if possible for accessibility purposes**.
+   *
    * Prevent the user from interacting with the button: it cannot be pressed or focused.
-   * @note Avoid using if possible for accessibility purposes
    */
   disabled?: boolean;
   /**
-   * Replaces button content with a Loader component, keeps width
+   * Replaces button content with a Loader component, keeps width.
    * @default false
    */
   loading?: boolean;
   /**
-   * Button Icon
+   * Button Icon.
    */
   icon?: React.ReactNode;
   /**
-   * Icon position in Button
+   * Icon position in Button.
    * @default "left"
    */
   iconPosition?: "left" | "right";

@navikt/core/react/src/button/index.ts

@@ -1,2 +1,2 @@
-export { default as Button } from "./Button";
-export { type ButtonProps } from "./Button";
+"use client";
+export { default as Button, type ButtonProps } from "./Button";

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

@@ -2,7 +2,7 @@ import cl from "clsx";
 import React, { HTMLAttributes, forwardRef } from "react";
 import { Detail } from "../typography";
 
-export interface BubbleProps extends HTMLAttributes<HTMLDivElement> {
+export interface ChatBubbleProps extends HTMLAttributes<HTMLDivElement> {
   /**
    * Bubble text
    */
@@ -21,7 +21,7 @@ export interface BubbleProps extends HTMLAttributes<HTMLDivElement> {
   toptextPosition?: "left" | "right";
 }
 
-const Bubble = forwardRef<HTMLDivElement, BubbleProps>(
+const Bubble = forwardRef<HTMLDivElement, ChatBubbleProps>(
   ({ children, className, name, timestamp, toptextPosition, ...rest }, ref) => {
     return (
       <div ref={ref} className={cl("navds-chat__bubble", className)} {...rest}>

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

@@ -8,15 +8,15 @@ export const SIZES = ["medium", "small"] as const;
 
 export interface ChatProps extends HTMLAttributes<HTMLDivElement> {
   /**
-   * Children of type <Chat.Bubble />
+   * Children of type `<Chat.Bubble />`.
    */
   children: React.ReactNode;
   /**
-   * Chat-message name
+   * Chat-message name.
    */
   name?: string;
   /**
-   * Timestamp for sent message
+   * Timestamp for sent message.
    */
   timestamp?: string;
   /**
@@ -30,17 +30,17 @@ export interface ChatProps extends HTMLAttributes<HTMLDivElement> {
    */
   variant?: "subtle" | "info" | "neutral";
   /**
-   * Positions avatar and bubbles
+   * Positions avatar and bubbles.
    * @default "left"
    */
   position?: (typeof POSITIONS)[number];
   /**
-   * Hoizontal position of toptext
+   * Horizontal position of toptext.
    * @default Same as position
    */
   toptextPosition?: (typeof POSITIONS)[number];
   /**
-   * Affects padding and font size in bubbles
+   * Affects padding and font size in bubbles.
    * @default "medium"
    */
   size?: (typeof SIZES)[number];

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

@@ -1,7 +1,7 @@
 import { Meta, StoryObj } from "@storybook/react";
 import React from "react";
-import { Chat, VStack } from "../index";
-import { POSITIONS, SIZES } from "./Chat";
+import { VStack } from "../layout/stack";
+import Chat, { POSITIONS, SIZES } from "./Chat";
 
 export default {
   title: "ds-react/Chat",

@navikt/core/react/src/chat/index.ts

@@ -1 +1,3 @@
+"use client";
 export { default as Chat, type ChatProps } from "./Chat";
+export { default as ChatBubble, type ChatBubbleProps } from "./Bubble";

@navikt/core/react/src/chips/Chips.tsx

@@ -1,13 +1,13 @@
 import cl from "clsx";
 import React, { HTMLAttributes, forwardRef } from "react";
 import { OverridableComponent } from "../util/types";
-import RemovableChips, { RemovableChipsProps } from "./Removable";
-import ToggleChips, { ToggleChipsProps } from "./Toggle";
+import RemovableChips, { ChipsRemovableProps } from "./Removable";
+import ToggleChips, { ChipsToggleProps } from "./Toggle";
 
 export interface ChipsProps extends HTMLAttributes<HTMLUListElement> {
   children: React.ReactNode;
   /**
-   * Changes padding and font-sizes
+   * Changes padding and font-sizes.
    * @default "medium"
    */
   size?: "medium" | "small";
@@ -22,13 +22,13 @@ interface ChipsComponent
    * @see 🏷️ {@link ToggleChipsProps}
    * @see [🤖 OverridableComponent](https://aksel.nav.no/grunnleggende/kode/overridablecomponent) support
    */
-  Toggle: OverridableComponent<ToggleChipsProps, HTMLButtonElement>;
+  Toggle: OverridableComponent<ChipsToggleProps, HTMLButtonElement>;
   /**
-   * Remove filter or the likes on click
+   * Remove filter or the likes on click.
    * @see 🏷️ {@link RemovableChipsProps}
    * @see [🤖 OverridableComponent](https://aksel.nav.no/grunnleggende/kode/overridablecomponent) support
    */
-  Removable: OverridableComponent<RemovableChipsProps, HTMLButtonElement>;
+  Removable: OverridableComponent<ChipsRemovableProps, HTMLButtonElement>;
 }
 
 /**

@navikt/core/react/src/chips/Removable.tsx

@@ -3,7 +3,7 @@ import React, { forwardRef } from "react";
 import { XMarkIcon } from "@navikt/aksel-icons";
 import { composeEventHandlers } from "../util/composeEventHandlers";
 
-export interface RemovableChipsProps
+export interface ChipsRemovableProps
   extends React.ButtonHTMLAttributes<HTMLButtonElement> {
   children: string;
   /**
@@ -24,7 +24,7 @@ export interface RemovableChipsProps
 
 export const RemovableChips = forwardRef<
   HTMLButtonElement,
-  RemovableChipsProps
+  ChipsRemovableProps
 >(
   (
     {

@navikt/core/react/src/chips/Toggle.tsx

@@ -2,7 +2,7 @@ import cl from "clsx";
 import React, { forwardRef } from "react";
 import { OverridableComponent } from "../util/types";
 
-export interface ToggleChipsProps
+export interface ChipsToggleProps
   extends React.ButtonHTMLAttributes<HTMLButtonElement> {
   children: string;
   /**
@@ -22,7 +22,7 @@ export interface ToggleChipsProps
 }
 
 export const ToggleChips: OverridableComponent<
-  ToggleChipsProps,
+  ChipsToggleProps,
   HTMLButtonElement
 > = forwardRef(
   (

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

@@ -1,13 +1,18 @@
-import { Meta } from "@storybook/react";
+import { Meta, StoryObj } from "@storybook/react";
 import React, { useState } from "react";
 import { Chips } from ".";
 
 const meta: Meta<typeof Chips> = {
   title: "ds-react/Chips",
   component: Chips,
+  parameters: {
+    chromatic: { disable: true },
+  },
 };
 export default meta;
 
+type Story = StoryObj<typeof Chips>;
+
 const options = ["Norsk", "Dansk", "Svensk", "Tysk", "Spansk"];
 
 export const Default = (props) => {
@@ -220,3 +225,36 @@ export const Small = () => {
     </div>
   );
 };
+
+export const Chromatic: Story = {
+  render: () => (
+    <div>
+      <div>
+        <h2>Default</h2>
+        <Default />
+      </div>
+      <div>
+        <h2>Toggle</h2>
+        <h3>Medium</h3>
+        <Toggle size="medium" />
+        <h3>Small</h3>
+        <Toggle size="small" />
+      </div>
+      <div>
+        <h2>Removable</h2>
+        <Removable />
+      </div>
+      <div>
+        <h2>Regular</h2>
+        <Regular />
+      </div>
+      <div>
+        <h2>Small</h2>
+        <Small />
+      </div>
+    </div>
+  ),
+  parameters: {
+    chromatic: { disable: false },
+  },
+};

@navikt/core/react/src/chips/index.ts

@@ -1 +1,7 @@
+"use client";
 export { default as Chips, type ChipsProps } from "./Chips";
+export {
+  RemovableChips as ChipsRemovable,
+  type ChipsRemovableProps,
+} from "./Removable";
+export { ToggleChips as ChipsToggle, type ChipsToggleProps } from "./Toggle";

@navikt/core/react/src/copybutton/CopyButton.tsx

@@ -14,7 +14,7 @@ import copy from "../util/copy";
 export interface CopyButtonProps
   extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children"> {
   /**
-   * 'xsmall' should only be used in tables
+   * `"xsmall"` should _only_ be used in tables.
    * @default "medium"
    */
   size?: "medium" | "small" | "xsmall";
@@ -23,11 +23,11 @@ export interface CopyButtonProps
    */
   variant?: "action" | "neutral";
   /**
-   * Text to copy to clipboard
+   * Text to copy to clipboard.
    */
   copyText: string;
   /**
-   *  Optional text in button
+   *  Optional text in button.
    */
   text?: string;
   /**
@@ -36,36 +36,38 @@ export interface CopyButtonProps
    */
   activeText?: string;
   /**
-   * Callback when 'copied'-state is active
+   * Callback that is called when internal copy-state changes.
+   *
+   * @param state `true` when copy-state is activated, `false` when copy-state is deactivated.
    */
   onActiveChange?: (state: boolean) => void;
   /**
-   *  Icon shown when button is not clicked
+   *  Icon shown when button is not clicked.
    * @default <FilesIcon />
    */
   icon?: React.ReactNode;
   /**
-   * Icon shown when active
+   * Icon shown when active.
    * @default <CheckmarkIcon />
    */
   activeIcon?: React.ReactNode;
   /**
-   * Timeout duration in milliseconds
+   * Timeout duration in milliseconds.
    * @default 2000
    */
   activeDuration?: number;
   /**
-   * Accessible label for icon (ignored if text is set)
-   * @default 'Kopier'
+   * Accessible label for icon (ignored if text is set).
+   * @default "Kopier"
    */
   title?: string;
   /**
-   * Accessible label for icon in active-state (ignored if text is set)
-   * @default 'Kopiert'
+   * Accessible label for icon in active-state (ignored if text is set).
+   * @default "Kopiert"
    */
   activeTitle?: string;
   /**
-   * Icon position in button
+   * Icon position in button.
    * @default "left"
    */
   iconPosition?: "left" | "right";

@navikt/core/react/src/copybutton/copy-button.stories.tsx

@@ -32,6 +32,9 @@ export const Default: Story = {
     text: "",
     activeText: "",
   },
+  parameters: {
+    chromatic: { disable: true },
+  },
 };
 
 export const Interaction: Story = {
@@ -210,3 +213,49 @@ export const Disabled: Story = {
     </div>
   ),
 };
+
+export const Chromatic: Story = {
+  render: (...props) => (
+    <div>
+      <div>
+        <h2>Variants</h2>
+        {Variants.render?.(...props)}
+      </div>
+      <div>
+        <h2>IconPosition</h2>
+        {IconPosition.render?.(...props)}
+      </div>
+      <div>
+        <h2>Sizes</h2>
+        {Sizes.render?.(...props)}
+      </div>
+      <div>
+        <h2>Texts</h2>
+        {Texts.render?.(...props)}
+      </div>
+      <div>
+        <h2>Icons</h2>
+        {Icons.render?.(...props)}
+      </div>
+      <div>
+        <h2>InlineDemo</h2>
+        {InlineDemo.render?.(...props)}
+      </div>
+      <div>
+        <h2>WithTooltip</h2>
+        {WithTooltip.render?.(...props)}
+      </div>
+      <div>
+        <h2>Duration</h2>
+        {Duration.render?.(...props)}
+      </div>
+      <div>
+        <h2>Disabled</h2>
+        {Disabled.render?.(...props)}
+      </div>
+    </div>
+  ),
+  parameters: {
+    chromatic: { disable: false },
+  },
+};

@navikt/core/react/src/copybutton/index.ts

@@ -1 +1,2 @@
+"use client";
 export { default as CopyButton, type CopyButtonProps } from "./CopyButton";