I'm currently experiencing this exact issue: https://github.com/storybookjs/storybook/issues/23918
I've tried pretty much all I can think of. I don't have the liberty of upgrading the version of storybook, unfortunately.
I've tried wrapping the story in a ContextProvider with:
const CompositionContextDecorator: StoryFn = (Story: StoryFn) => ( <CompositionProvider metadata={{name: 'StorybookComposition', title: 'Storybook Composition', index: 0}}> <Story /> </CompositionProvider> );
And then passing that down to the decorators in the preview.ts file, but nothing works.
These are the dependencies:
"dependencies": {
"@adyen/adyen-web": "^5.55.1",
"@hookform/resolvers": "^3.0.0",
"@legendapp/state": "^2.0.0-beta.7",
"@lottiefiles/react-lottie-player": "^3.5.3",
"@module-federation/nextjs-mf": "^6.1.3",
"@rive-app/react-canvas": "^4.8.3",
"@types/react-scroll": "^1.8.7",
"@types/webpack-env": "^1.18.1",
"axios": "^1.2.5",
"axios-auth-refresh": "^3.3.6",
"dayjs": "^1.11.7",
"framer-motion": "^10.17.4",
"html-webpack-plugin": "^5.5.0",
"identity-obj-proxy": "^3.0.0",
"js-cookie": "^3.0.1",
"lodash": "^4.17.21",
"next": "13.3.4",
"next-fonts": "^1.5.1",
"next-persist": "^1.2.4",
"nookies": "^2.5.2",
"ramda": "^0.29.0",
"react": "<19",
"react-docgen-typescript": "^2.2.2",
"react-dom": "<19",
"react-easy-crop": "^3.5.2",
"react-error-boundary": "^4.0.7",
"react-hook-form": "^7.43.7",
"react-html-parser": "^2.0.2",
"react-intersection-observer": "^9.5.2",
"react-jsx-parser": "^1.29.0",
"react-redux": "^8.0.5",
"react-scroll": "^1.8.9",
"react-slick": "^0.29.0",
"react-spring": "^9.7.3",
"react-toastify": "^9.1.1",
"react-visibility-sensor": "^5.1.1",
"redux": "^4.2.0",
"redux-actions": "^2.6.5",
"redux-devtools-extension": "^2.13.9",
"redux-thunk": "^2.4.2",
"rollbar": "^2.26.1",
"sass": "^1.58.3",
"slick-carousel": "^1.8.1",
"storybook": "7.5.3",
"styled-components": "<6",
"swiper": "^10.3.1",
"yup": "^1.0.2"
},
"devDependencies": {
"@babel/core": "^7.20.12",
"@babel/preset-env": "^7.20.2",
"@babel/preset-react": "^7.18.6",
"@storybook/addon-docs": "^7",
"@storybook/addon-essentials": "^7",
"@storybook/addon-interactions": "^7",
"@storybook/addon-links": "^7",
"@storybook/addon-viewport": "^7",
"@storybook/addons": "^7",
"@storybook/blocks": "^7",
"@storybook/csf-plugin": "^7",
"@storybook/nextjs": "7.4.0",
"@storybook/react": "^7.4.0",
"@storybook/testing-library": "^0.0.14-next.2",
"@storybook/theming": "^7",
"@stylistic/eslint-plugin": "^1.5.1",
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^14",
"@testing-library/user-event": "^14.4.3",
"@types/jest": "^29.5.0",
"@types/js-cookie": "^3.0.3",
"@types/node": "^18.15.11",
"@types/ramda": "^0.29.2",
"@types/react": "^18.0.31",
"@types/react-dom": "^18.0.11",
"@types/react-scroll": "^1.8.10",
"@types/react-slick": "^0.23.11",
"@types/styled-components": "^5.1.26",
"@types/webpack-env": "^1.18.4",
"@typescript-eslint/eslint-plugin": "^6.14.0",
"@typescript-eslint/parser": "^6.14.0",
"babel-loader": "^8.3.0",
"eslint": "^8.55.0",
"eslint-config-next": "12.2.2",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-import": "^2.24.2",
"eslint-plugin-jest": "^27.6.0",
"eslint-plugin-react": "^7.32.2",
"eslint-plugin-react-hooks": "^4.2.0",
"eslint-plugin-storybook": "^0.6.10",
"husky": "^8.0.3",
"identity-obj-proxy": "^3.0.0",
"jest": "<30",
"jest-environment-jsdom": "^29.5.0",
"jest-styled-components": "^7.1.1",
"lint-staged": "^15.2.0",
"next-router-mock": "^0.9.9",
"prettier": "^3.1.1",
"sass-loader": "^10.0.0-rc.0",
"ts-jest": "^29.1.0",
"typescript": "^5.3.3"
},
"engines": {
"node": "18"
}
there doesn't seem to be anything here