diff --git a/libs/form-component/.storybook/main.ts b/libs/form-component/.storybook/main.ts index e09c2fb9e13..97af8aa0111 100644 --- a/libs/form-component/.storybook/main.ts +++ b/libs/form-component/.storybook/main.ts @@ -2,7 +2,12 @@ import type { StorybookConfig } from '@storybook/react-vite'; const config: StorybookConfig = { stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'], - addons: ['@storybook/addon-links', '@chromatic-com/storybook', '@storybook/addon-docs'], + addons: [ + '@storybook/addon-links', + '@chromatic-com/storybook', + '@storybook/addon-docs', + '@storybook/addon-a11y', + ], framework: { name: '@storybook/react-vite', options: {}, diff --git a/libs/form-component/.storybook/preview.tsx b/libs/form-component/.storybook/preview.tsx index 71974a90443..48db171f08a 100644 --- a/libs/form-component/.storybook/preview.tsx +++ b/libs/form-component/.storybook/preview.tsx @@ -8,6 +8,7 @@ const preview: Preview = { parameters: { layout: 'centered', }, + tags: ['autodocs'], decorators: [ (Story) => (
diff --git a/libs/form-component/package.json b/libs/form-component/package.json index c68dc8da2b8..60c7181fbe9 100644 --- a/libs/form-component/package.json +++ b/libs/form-component/package.json @@ -32,6 +32,7 @@ "@digdir/designsystemet-css": "1.11.1", "@digdir/designsystemet-react": "1.11.1", "@navikt/aksel-icons": "8.9.0", + "@storybook/addon-a11y": "10.2.16", "@storybook/addon-docs": "10.2.16", "@storybook/addon-links": "10.2.16", "@storybook/builder-vite": "10.2.16", @@ -43,7 +44,7 @@ "@types/react-dom": "19.2.3", "@vitejs/plugin-react": "^5.0.0", "jsdom": "^26.1.0", - "storybook": "^10.2.11", + "storybook": "10.2.16", "typescript": "5.9.3", "typescript-plugin-css-modules": "5.2.0", "vitest": "^4.1.5" diff --git a/libs/form-component/src/app-components/Button/Button.stories.tsx b/libs/form-component/src/app-components/Button/Button.stories.tsx index 37fe0545170..f0bb92475ad 100644 --- a/libs/form-component/src/app-components/Button/Button.stories.tsx +++ b/libs/form-component/src/app-components/Button/Button.stories.tsx @@ -1,4 +1,5 @@ import type { Meta, StoryObj } from '@storybook/react-vite'; +import { fn } from 'storybook/test'; import { Button } from './Button'; @@ -7,6 +8,7 @@ const meta = { component: Button, args: { children: 'Save', + onClick: fn(), }, } satisfies Meta; diff --git a/yarn.lock b/yarn.lock index b008625e89d..2d2d771a8c6 100644 --- a/yarn.lock +++ b/yarn.lock @@ -132,6 +132,7 @@ __metadata: "@digdir/designsystemet-css": "npm:1.11.1" "@digdir/designsystemet-react": "npm:1.11.1" "@navikt/aksel-icons": "npm:8.9.0" + "@storybook/addon-a11y": "npm:10.2.16" "@storybook/addon-docs": "npm:10.2.16" "@storybook/addon-links": "npm:10.2.16" "@storybook/builder-vite": "npm:10.2.16" @@ -147,7 +148,7 @@ __metadata: jsdom: "npm:^26.1.0" react-day-picker: "npm:^9.14.0" react-number-format: "npm:^5.4.5" - storybook: "npm:^10.2.11" + storybook: "npm:10.2.16" typescript: "npm:5.9.3" typescript-plugin-css-modules: "npm:5.2.0" vitest: "npm:^4.1.5" @@ -6081,6 +6082,18 @@ __metadata: languageName: node linkType: hard +"@storybook/addon-a11y@npm:10.2.16": + version: 10.2.16 + resolution: "@storybook/addon-a11y@npm:10.2.16" + dependencies: + "@storybook/global": "npm:^5.0.0" + axe-core: "npm:^4.2.0" + peerDependencies: + storybook: ^10.2.16 + checksum: 10/a7ac6f67c22eb9fcef7dd88d3c23de5563389dca958686096e6b66d29d179f684a32c0b1a3b9bd5789d5b61a26b58c119f0baa74c4ef346d2201ad5d7cd8885a + languageName: node + linkType: hard + "@storybook/addon-docs@npm:10.2.16": version: 10.2.16 resolution: "@storybook/addon-docs@npm:10.2.16" @@ -9534,6 +9547,13 @@ __metadata: languageName: node linkType: hard +"axe-core@npm:^4.2.0": + version: 4.11.4 + resolution: "axe-core@npm:4.11.4" + checksum: 10/49095daa422d05d99a90b39301a3b5c971e234a4593403dfd6701df637a3e550bcfd7bd096709c5643564dd069208513247791f367790e0605d15386fb2a7bfe + languageName: node + linkType: hard + "axios@npm:1.15.0": version: 1.15.0 resolution: "axios@npm:1.15.0" @@ -22338,7 +22358,7 @@ __metadata: languageName: node linkType: hard -"storybook@npm:^10.2.11": +"storybook@npm:10.2.16, storybook@npm:^10.2.11": version: 10.2.16 resolution: "storybook@npm:10.2.16" dependencies: