Unable to install beta v2 after installing Storybook v7-beta63

[arianaamx-motorway]

Affected design types

• figma
• figspec
• link
• image
• iframe

Describe the bug

Updated the Storybook to v7.beta63, and now I can't install storybook-addon-designs betav2.
Using: npm install --save-dev storybook-addon-designs@beta

Error message:

npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: -----
npm ERR! Found: @storybook/[email protected]
npm ERR! node_modules/@storybook/addon-docs
npm ERR!   @storybook/addon-docs@"7.0.0-beta.63" from @storybook/[email protected]
npm ERR!   node_modules/@storybook/addon-essentials
npm ERR!     dev @storybook/addon-essentials@"^7.0.0-beta.63" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! dev storybook-addon-designs@"7.0.0-beta.2" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: @storybook/[email protected]
npm ERR! node_modules/@storybook/addon-docs
npm ERR!   peer @storybook/addon-docs@"^6.4.0 || ^7.0.0" from [email protected]
npm ERR!   node_modules/storybook-addon-designs
npm ERR!     dev storybook-addon-designs@"7.0.0-beta.2" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

Installed @storybook/addons directly, still getting the error:

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: -----
npm ERR! Found: @storybook/[email protected]
npm ERR! node_modules/@storybook/addons
npm ERR!   dev @storybook/addons@"^7.0.0-beta.63" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer @storybook/addons@"^6.4.0 || ^7.0.0" from [email protected]
npm ERR! node_modules/storybook-addon-designs
npm ERR!   dev storybook-addon-designs@"7.0.0-beta.2" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

Package.json

"devDependencies": {
    "@storybook/addon-a11y": "^7.0.0-beta.63",
    "@storybook/addon-actions": "^7.0.0-beta.63",
    "@storybook/addon-essentials": "^7.0.0-beta.63",
    "@storybook/addon-links": "^7.0.0-beta.63",
    "@storybook/addon-storysource": "^7.0.0-beta.63",
    "@storybook/react": "^7.0.0-beta.63",
    "@storybook/react-vite": "^7.0.0-beta.63",
    "storybook": "^7.0.0-beta.63",
    "storybook-dark-mode": "^1.1.0",
}

How to reproduce the bug?

1. npm install -D storybook@next @storybook/addon-essentials
2. npm install --save-dev storybook-addon-designs@beta

Expected behaviour

There shouldn't be any errors when trying to install the addon.

Environment

• Chrome / Chromium / Chromium based browsers
• Firefox
• macOS Safari
• iOS Safari
• Samsung Internet
• Other

Affected versions

Trying to upgrade to beta v2, until then 6.3.1

Storybook versions

7.0.0-beta.63

[toyopilgrim]

I've encountered the same error on yarn check. It seems not specific to 7.0.0-beta.63.
I confirmed that the errors on 7.0.0-beta.46 and 7.0.0-rc.1. By using [email protected], I could avoid the error.

yarn check

error "storybook-addon-designs#@storybook/addon-docs@^6.4.0 || ^7.0.0" doesn't satisfy found match of "@storybook/[email protected]"
[8](https://github.com/linkx-dev/aml-poc-frontend/actions/runs/4395011815/jobs/7696469312#step:6:9)
error "storybook-addon-designs#@storybook/components@^6.4.0 || ^7.0.0" doesn't satisfy found match of "@storybook/[email protected]"
[9](https://github.com/linkx-dev/aml-poc-frontend/actions/runs/4395011815/jobs/7696469312#step:6:10)
error "storybook-addon-designs#@storybook/theming@^6.4.0 || ^7.0.0" doesn't satisfy found match of "@storybook/[email protected]"

[itzikd15]

i got the same error as well, downgrading to:
"storybook-addon-designs": "6.3.1",
solved the issue for me as well, thanks!

[darroshi]

@itzikd15 did you use
"storybook-addon-designs": "6.3.1",
with storybook 7.0.0-rc.1 ?
I tried, and the Design tab doesn't appear.

[itzikd15]

i noticed i don't have it either. my solution for now is to do "npm install --legacy-peer-deps" until the fix it.

[itzikd15]

currently on Storybook 7.0.0-rc.5 and still it doesn't work.
is it possible to change in this file:
https://github.com/storybookjs/addon-designs/blob/master/packages/storybook-addon-designs/package.json

at the peerDependencies part:

"peerDependencies": {
    "@storybook/addon-docs": "^6.4.0 || ^7.0.0",
    "@storybook/addons": "^6.4.0 || ^7.0.0",
    "@storybook/api": "^6.4.0 || ^7.0.0",
    "@storybook/components": "^6.4.0 || ^7.0.0",
    "@storybook/theming": "^6.4.0 || ^7.0.0",
    "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
    "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
  },

the option to support version 7 beta and alpha for the @storybook dependencies
@pocka

i created a pull request
#189

[pocka]

SB7 is now stable. For compatibility issues, please refer to #191 (SB7 support is in-progress #192).