Skip to content

Commit 250b69e

Browse files
richard smithcolinrotherham
richard smith
authored and
colinrotherham
committed
Updating component library to latest Storybook for React
1 parent 54aa686 commit 250b69e

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

51 files changed

+923
-800
lines changed

‎.storybook/main.ts‎

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,21 +4,29 @@ import tsConfigPaths from 'vite-tsconfig-paths';
44

55
const config: StorybookConfig = {
66
stories: ['../stories/**/*.stories.@(ts|tsx)', '../stories/**/*.mdx'],
7-
addons: ['@storybook/addon-links', '@storybook/addon-essentials'],
7+
addons: ['@storybook/addon-links', '@storybook/addon-docs'],
88
framework: {
99
name: '@storybook/react-vite',
1010
options: {},
1111
},
12-
docs: {
13-
autodocs: true,
14-
},
12+
1513
typescript: {
1614
reactDocgen: 'react-docgen-typescript',
1715
},
16+
1817
viteFinal(config) {
1918
return mergeConfig(config, {
2019
plugins: [tsConfigPaths()],
20+
css: {
21+
preprocessorOptions: {
22+
scss: {
23+
quietDeps: true,
24+
loadPaths: ['node_modules'],
25+
},
26+
},
27+
},
2128
});
2229
},
2330
};
31+
2432
export default config;

‎.storybook/manager.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { addons } from '@storybook/manager-api';
1+
import { addons } from 'storybook/manager-api';
22
import nhsTheme from './theme';
33
import { startCase, upperFirst } from 'lodash';
44

‎.storybook/preview.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import './storybook.scss';
2-
import { type Preview } from '@storybook/react';
2+
import { type Preview } from '@storybook/react-vite';
33

44
const preview: Preview = {
55
parameters: {
@@ -18,6 +18,8 @@ const preview: Preview = {
1818
},
1919
},
2020
},
21+
22+
tags: ['autodocs'],
2123
};
2224

2325
export default preview;

‎.storybook/storybook.scss‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
1-
// Allow current nhsuk styles to override legacy
2-
@import 'nhsuk-frontend/dist/nhsuk';
1+
@forward 'nhsuk-frontend/dist/nhsuk';
32

43
.tag-wrapper {
54
display: flex;

‎.storybook/theme.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { create } from '@storybook/theming/create';
1+
import { create } from 'storybook/theming/create';
22
import packageJson from '../package.json' with { type: 'json' };
33

44
export default create({

‎package.json‎

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,10 @@
11
{
22
"name": "nhsuk-react-components",
33
"version": "6.0.0-beta.0",
4+
"license": "MIT",
45
"author": {
56
"name": "NHS England"
67
},
7-
"files": [
8-
"src",
9-
"dist"
10-
],
118
"sideEffects": false,
129
"type": "module",
1310
"imports": {
@@ -49,10 +46,22 @@
4946
"main": "dist/cjs/index.cjs",
5047
"module": "dist/esm/index.js",
5148
"types": "dist/esm/index.d.ts",
49+
"typesVersions": {
50+
"*": {
51+
"react": [
52+
"node_modules/react/index.d.ts"
53+
]
54+
}
55+
},
56+
"files": [
57+
"src",
58+
"dist"
59+
],
5260
"scripts": {
53-
"cleanup": "rm -rf dist/ > /dev/null && rm -rf lib/ > /dev/null",
54-
"storybook": "NODE_ENV=development storybook dev -p 6006",
61+
"cleanup": "rm -rf dist/ lib/ >/dev/null 2>&1 || true",
5562
"build": "yarn cleanup && rollup -c",
63+
"storybook": "NODE_ENV=development storybook dev -p 6006",
64+
"build-storybook": "storybook build",
5665
"test": "jest",
5766
"test:watch": "jest --watch",
5867
"lint": "yarn lint:types && yarn lint:js && yarn lint:prettier",
@@ -62,10 +71,8 @@
6271
"lint:js": "eslint . --max-warnings 0",
6372
"lint:js:fix": "yarn lint:js --fix",
6473
"lint:types": "tsc --build tsconfig.json --pretty",
65-
"build-storybook": "storybook build",
6674
"prepublishOnly": "yarn lint && yarn test && yarn storybook --smoke-test"
6775
},
68-
"license": "MIT",
6976
"devDependencies": {
7077
"@babel/core": "^7.28.4",
7178
"@babel/preset-env": "^7.28.3",
@@ -77,15 +84,9 @@
7784
"@rollup/plugin-commonjs": "^28.0.6",
7885
"@rollup/plugin-node-resolve": "^16.0.1",
7986
"@rollup/plugin-typescript": "^12.1.4",
80-
"@storybook/addon-actions": "^8.6.14",
81-
"@storybook/addon-essentials": "^8.6.14",
82-
"@storybook/addon-links": "^8.6.14",
83-
"@storybook/blocks": "^8.6.14",
84-
"@storybook/manager-api": "^8.6.14",
85-
"@storybook/preview-api": "^8.6.14",
86-
"@storybook/react": "^8.6.14",
87-
"@storybook/react-vite": "^8.6.14",
88-
"@storybook/theming": "^8.6.14",
87+
"@storybook/addon-docs": "9.1.10",
88+
"@storybook/addon-links": "^9.1.10",
89+
"@storybook/react-vite": "^9.1.10",
8990
"@testing-library/dom": "^10.4.1",
9091
"@testing-library/jest-dom": "^6.9.1",
9192
"@testing-library/react": "^16.3.0",
@@ -99,7 +100,6 @@
99100
"babel-jest": "^30.2.0",
100101
"babel-plugin-module-resolver": "^5.0.2",
101102
"babel-plugin-replace-import-extension": "^1.1.5",
102-
"chromatic": "^6.17.3",
103103
"classnames": "^2.5.1",
104104
"eslint": "^9.37.0",
105105
"eslint-config-prettier": "^10.1.8",
@@ -120,13 +120,13 @@
120120
"react-dom": "^19.2.0",
121121
"rollup": "^4.52.4",
122122
"rollup-plugin-preserve-directives": "^0.4.0",
123-
"sass": "^1.53.0",
124-
"storybook": "^8.6.14",
123+
"sass-embedded": "^1.93.2",
124+
"storybook": "^9.1.10",
125125
"tslib": "^2.8.1",
126126
"typescript": "5.3.3",
127127
"typescript-eslint": "^8.45.0",
128-
"vite": "^4.5.3",
129-
"vite-tsconfig-paths": "^4.3.2"
128+
"vite": "^7.1.9",
129+
"vite-tsconfig-paths": "^5.1.4"
130130
},
131131
"peerDependencies": {
132132
"classnames": ">=2.5.0",

‎stories/Content Presentation/Details.stories.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { type Meta, type StoryObj } from '@storybook/react';
1+
import { type Meta, type StoryObj } from '@storybook/react-vite';
22
import { Details } from '#components';
33

44
/**

‎stories/Content Presentation/DoAndDontList.stories.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { type Meta, type StoryObj } from '@storybook/react';
1+
import { type Meta, type StoryObj } from '@storybook/react-vite';
22
import { DoAndDontList } from '#components';
33

44
/**

‎stories/Content Presentation/Hero.stories.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { type Meta, type StoryObj } from '@storybook/react';
1+
import { type Meta, type StoryObj } from '@storybook/react-vite';
22
import { Hero } from '#components';
33

44
const meta: Meta<typeof Hero> = {

‎stories/Content Presentation/Icons.stories.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { type Meta, type StoryObj } from '@storybook/react';
1+
import { type Meta, type StoryObj } from '@storybook/react-vite';
22
import {
33
ArrowLeftIcon,
44
ArrowRightCircleIcon,

0 commit comments

Comments
 (0)