storybookjs / addon-designs

A Storybook addon that embeds Figma, websites, or images in the addon panel.
https://storybookjs.github.io/addon-designs
MIT License
876 stars 72 forks source link

@storybook/addon-designs is out-of-date, causing dependencies to duplicate #229

Closed shirakaba closed 7 months ago

shirakaba commented 8 months ago

Affected design types

Describe the bug

The latest version of @storybook/addon-designs published to npm is 7.0.9. More precisely, the available releases are:

$ pnpm view @storybook/addon-designs versions
npm WARN Ignoring workspaces for specified package(s) 
[
  '7.0.0--canary.198.5b615de.0',
  '7.0.0--canary.198.a3d6b5a.0',
  '7.0.0--canary.198.c1879af.0',
  '7.0.0--canary.7155bcd.0',
  '7.0.0--canary.ca11952.0',
  '7.0.0',
  '7.0.1',
  '7.0.2--canary.207.ad30797.0',
  '7.0.2--canary.077fdde.0',
  '7.0.2--canary.47ee54c.0',
  '7.0.2--canary.a56cf39.0',
  '7.0.2',
  '7.0.3',
  '7.0.4',
  '7.0.5',
  '7.0.6--canary.4e50696.0',
  '7.0.6--canary.5500a94.0',
  '7.0.6',
  '7.0.7',
  '7.0.8--canary.190.369a889.0',
  '7.0.8--canary.223.4636c5d.0',
  '7.0.8--canary.223.e22dd72.0',
  '7.0.8--canary.224.a1b85df.0',
  '7.0.8--canary.1f30e44.0',
  '7.0.8',
  '7.0.9--canary.225.0c28573.0',
  '7.0.9',
  '7.0.10--canary.cae3482.0',
  '8.0.0-next.0'
]

This is leading to duplicate dependencies due to dependencies upon incompatible package version ranges. Specifically, I found that I'm stuck on @storybook/types@7.6.10, @storybook/channels@7.6.10 and @storybook/core-events@7.6.10 because the latest release of @storybook/addon-designs, v7.0.9, references them.

$ pnpm why @storybook/types
Legend: production dependency, optional only, dev only

next-web@0.1.0 /Users/jamie/app/next-web

devDependencies:
@storybook/addon-designs 7.0.9
├─┬ @storybook/addon-docs 7.6.14 peer
│ ├─┬ @storybook/blocks 7.6.14
│ │ ├─┬ @storybook/components 7.6.14
│ │ │ └── @storybook/types 7.6.14
│ │ ├─┬ @storybook/docs-tools 7.6.14
│ │ │ ├─┬ @storybook/core-common 7.6.14
│ │ │ │ └── @storybook/types 7.6.14
│ │ │ ├─┬ @storybook/preview-api 7.6.14
│ │ │ │ └── @storybook/types 7.6.14
│ │ │ └── @storybook/types 7.6.14
│ │ ├─┬ @storybook/manager-api 7.6.14
│ │ │ └── @storybook/types 7.6.14
│ │ ├─┬ @storybook/preview-api 7.6.14
│ │ │ └── @storybook/types 7.6.14
│ │ └── @storybook/types 7.6.14
│ ├─┬ @storybook/components 7.6.14
│ │ └── @storybook/types 7.6.14
│ ├─┬ @storybook/csf-plugin 7.6.14
│ │ └─┬ @storybook/csf-tools 7.6.14
│ │   └── @storybook/types 7.6.14
│ ├─┬ @storybook/csf-tools 7.6.14
│ │ └── @storybook/types 7.6.14
│ ├─┬ @storybook/preview-api 7.6.14
│ │ └── @storybook/types 7.6.14
│ └── @storybook/types 7.6.14
├─┬ @storybook/addons 7.6.10 peer
│ ├─┬ @storybook/manager-api 7.6.10
│ │ └── @storybook/types 7.6.10
│ ├─┬ @storybook/preview-api 7.6.10
│ │ └── @storybook/types 7.6.10
│ └── @storybook/types 7.6.10
├─┬ @storybook/components 7.6.14 peer
│ └── @storybook/types 7.6.14
├─┬ @storybook/manager-api 7.6.14 peer
│ └── @storybook/types 7.6.14
└─┬ @storybook/preview-api 7.6.14 peer
  └── @storybook/types 7.6.14
@storybook/addon-essentials 7.6.14
├─┬ @storybook/addon-controls 7.6.14
│ └─┬ @storybook/blocks 7.6.14
│   ├─┬ @storybook/components 7.6.14
│   │ └── @storybook/types 7.6.14
│   ├─┬ @storybook/docs-tools 7.6.14
│   │ ├─┬ @storybook/core-common 7.6.14
│   │ │ └── @storybook/types 7.6.14
│   │ ├─┬ @storybook/preview-api 7.6.14
│   │ │ └── @storybook/types 7.6.14
│   │ └── @storybook/types 7.6.14
│   ├─┬ @storybook/manager-api 7.6.14
│   │ └── @storybook/types 7.6.14
│   ├─┬ @storybook/preview-api 7.6.14
│   │ └── @storybook/types 7.6.14
│   └── @storybook/types 7.6.14
├─┬ @storybook/addon-docs 7.6.14
│ ├─┬ @storybook/blocks 7.6.14
│ │ ├─┬ @storybook/components 7.6.14
│ │ │ └── @storybook/types 7.6.14
│ │ ├─┬ @storybook/docs-tools 7.6.14
│ │ │ ├─┬ @storybook/core-common 7.6.14
│ │ │ │ └── @storybook/types 7.6.14
│ │ │ ├─┬ @storybook/preview-api 7.6.14
│ │ │ │ └── @storybook/types 7.6.14
│ │ │ └── @storybook/types 7.6.14
│ │ ├─┬ @storybook/manager-api 7.6.14
│ │ │ └── @storybook/types 7.6.14
│ │ ├─┬ @storybook/preview-api 7.6.14
│ │ │ └── @storybook/types 7.6.14
│ │ └── @storybook/types 7.6.14
│ ├─┬ @storybook/components 7.6.14
│ │ └── @storybook/types 7.6.14
│ ├─┬ @storybook/csf-plugin 7.6.14
│ │ └─┬ @storybook/csf-tools 7.6.14
│ │   └── @storybook/types 7.6.14
│ ├─┬ @storybook/csf-tools 7.6.14
│ │ └── @storybook/types 7.6.14
│ ├─┬ @storybook/preview-api 7.6.14
│ │ └── @storybook/types 7.6.14
│ └── @storybook/types 7.6.14
├─┬ @storybook/core-common 7.6.14
│ └── @storybook/types 7.6.14
├─┬ @storybook/manager-api 7.6.14
│ └── @storybook/types 7.6.14
└─┬ @storybook/preview-api 7.6.14
  └── @storybook/types 7.6.14
@storybook/addon-interactions 7.6.14
└── @storybook/types 7.6.14
@storybook/addon-onboarding 1.0.11
└─┬ @storybook/telemetry 7.6.14
  ├─┬ @storybook/core-common 7.6.14
  │ └── @storybook/types 7.6.14
  └─┬ @storybook/csf-tools 7.6.14
    └── @storybook/types 7.6.14
@storybook/blocks 7.6.14
├─┬ @storybook/components 7.6.14
│ └── @storybook/types 7.6.14
├─┬ @storybook/docs-tools 7.6.14
│ ├─┬ @storybook/core-common 7.6.14
│ │ └── @storybook/types 7.6.14
│ ├─┬ @storybook/preview-api 7.6.14
│ │ └── @storybook/types 7.6.14
│ └── @storybook/types 7.6.14
├─┬ @storybook/manager-api 7.6.14
│ └── @storybook/types 7.6.14
├─┬ @storybook/preview-api 7.6.14
│ └── @storybook/types 7.6.14
└── @storybook/types 7.6.14
@storybook/nextjs 7.6.14
├─┬ @storybook/builder-webpack5 7.6.14
│ ├─┬ @storybook/core-common 7.6.14
│ │ └── @storybook/types 7.6.14
│ ├─┬ @storybook/core-webpack 7.6.14
│ │ ├─┬ @storybook/core-common 7.6.14
│ │ │ └── @storybook/types 7.6.14
│ │ └── @storybook/types 7.6.14
│ └─┬ @storybook/preview-api 7.6.14
│   └── @storybook/types 7.6.14
├─┬ @storybook/core-common 7.6.14
│ └── @storybook/types 7.6.14
├─┬ @storybook/preset-react-webpack 7.6.14
│ ├─┬ @storybook/core-webpack 7.6.14
│ │ ├─┬ @storybook/core-common 7.6.14
│ │ │ └── @storybook/types 7.6.14
│ │ └── @storybook/types 7.6.14
│ ├─┬ @storybook/docs-tools 7.6.14
│ │ ├─┬ @storybook/core-common 7.6.14
│ │ │ └── @storybook/types 7.6.14
│ │ ├─┬ @storybook/preview-api 7.6.14
│ │ │ └── @storybook/types 7.6.14
│ │ └── @storybook/types 7.6.14
│ └─┬ @storybook/react 7.6.14
│   ├─┬ @storybook/core-client 7.6.14
│   │ └─┬ @storybook/preview-api 7.6.14
│   │   └── @storybook/types 7.6.14
│   ├─┬ @storybook/docs-tools 7.6.14
│   │ ├─┬ @storybook/core-common 7.6.14
│   │ │ └── @storybook/types 7.6.14
│   │ ├─┬ @storybook/preview-api 7.6.14
│   │ │ └── @storybook/types 7.6.14
│   │ └── @storybook/types 7.6.14
│   ├─┬ @storybook/preview-api 7.6.14
│   │ └── @storybook/types 7.6.14
│   └── @storybook/types 7.6.14
├─┬ @storybook/preview-api 7.6.14
│ └── @storybook/types 7.6.14
└─┬ @storybook/react 7.6.14
  ├─┬ @storybook/core-client 7.6.14
  │ └─┬ @storybook/preview-api 7.6.14
  │   └── @storybook/types 7.6.14
  ├─┬ @storybook/docs-tools 7.6.14
  │ ├─┬ @storybook/core-common 7.6.14
  │ │ └── @storybook/types 7.6.14
  │ ├─┬ @storybook/preview-api 7.6.14
  │ │ └── @storybook/types 7.6.14
  │ └── @storybook/types 7.6.14
  ├─┬ @storybook/preview-api 7.6.14
  │ └── @storybook/types 7.6.14
  └── @storybook/types 7.6.14
@storybook/react 7.6.14
├─┬ @storybook/core-client 7.6.14
│ └─┬ @storybook/preview-api 7.6.14
│   └── @storybook/types 7.6.14
├─┬ @storybook/docs-tools 7.6.14
│ ├─┬ @storybook/core-common 7.6.14
│ │ └── @storybook/types 7.6.14
│ ├─┬ @storybook/preview-api 7.6.14
│ │ └── @storybook/types 7.6.14
│ └── @storybook/types 7.6.14
├─┬ @storybook/preview-api 7.6.14
│ └── @storybook/types 7.6.14
└── @storybook/types 7.6.14
storybook 7.6.14
└─┬ @storybook/cli 7.6.14
  ├─┬ @storybook/codemod 7.6.14
  │ ├─┬ @storybook/csf-tools 7.6.14
  │ │ └── @storybook/types 7.6.14
  │ └── @storybook/types 7.6.14
  ├─┬ @storybook/core-common 7.6.14
  │ └── @storybook/types 7.6.14
  ├─┬ @storybook/core-server 7.6.14
  │ ├─┬ @storybook/builder-manager 7.6.14
  │ │ └─┬ @storybook/core-common 7.6.14
  │ │   └── @storybook/types 7.6.14
  │ ├─┬ @storybook/core-common 7.6.14
  │ │ └── @storybook/types 7.6.14
  │ ├─┬ @storybook/csf-tools 7.6.14
  │ │ └── @storybook/types 7.6.14
  │ ├─┬ @storybook/preview-api 7.6.14
  │ │ └── @storybook/types 7.6.14
  │ ├─┬ @storybook/telemetry 7.6.14
  │ │ ├─┬ @storybook/core-common 7.6.14
  │ │ │ └── @storybook/types 7.6.14
  │ │ └─┬ @storybook/csf-tools 7.6.14
  │ │   └── @storybook/types 7.6.14
  │ └── @storybook/types 7.6.14
  ├─┬ @storybook/csf-tools 7.6.14
  │ └── @storybook/types 7.6.14
  ├─┬ @storybook/telemetry 7.6.14
  │ ├─┬ @storybook/core-common 7.6.14
  │ │ └── @storybook/types 7.6.14
  │ └─┬ @storybook/csf-tools 7.6.14
  │   └── @storybook/types 7.6.14
  └── @storybook/types 7.6.14

How to reproduce the bug?

Create any app with Storybook, depending on both @storybook/addon-designs@7.0.9 and @storybook/react@latest, e.g.:

{
  "name": "next-web",
  "version": "0.1.0",
  "scripts": {
    "storybook": "storybook dev -p 6006",
    "storybook:doctor": "storybook doctor",
    "storybook:build": "storybook build"
  },
  "dependencies": {},
  "devDependencies": {
    "@storybook/addon-designs": "^7.0.9",
    "@storybook/react": "^7.6.14"
  }
}

Now run npm install && npm run storybook:doctor and you should get a message along these lines, showing duplicated dependencies:

╭ Diagnostics ─────────────────────────────────────────────────────────────────────╮
│                                                                                  │
│                                                                                  │
│   Attention: The following dependencies are duplicated which might cause         │
│                                                                                  │
│   unexpected behavior:                                                           │
│                                                                                  │
│   @storybook/types:                                                              │
│                                                                                  │
│   7.6.14, 7.6.10                                                                 │
│                                                                                  │
│                                                                                  │
│                                                                                  │
│   You can find more information for a given dependency by running pnpm list      │
│                                                                                  │
│   --depth=1 <package-name>                                                       │
│                                                                                  │
│                                                                                  │
│   Please try de-duplicating these dependencies by running pnpm dedupe            │
│                                                                                  │
│                                                                                  │
╰──────────────────────────────────────────────────────────────────────────────────╯

Expected behaviour

I should be able to run npx storybook@latest upgrade without finding individual packages to be causing duplicated dependencies.

Environment

Affected versions

7.0.9, 7.0.10--canary.cae3482.0

Storybook versions

7.6.14