chore(cli): integrate cli wizard only with storybook-plugin >=1 (#6765)

* chore(cli): integrate cli wizard only with storybook-plugin >=1

* chore:

Author: johnjenkins

packages/cli/src/_test_/task-add.spec.ts

@@ -33,6 +33,7 @@ vi.mock('../wizard/init/steps', () => ({
   ],
   promptAddCapabilities: vi.fn().mockResolvedValue({ toInstall: [], toConfigure: [] }),
   promptCustomPackages: vi.fn().mockResolvedValue([]),
+  withVersionRanges: (packages: string[]) => packages,
 }));
 
 import { readFile } from 'node:fs/promises';

packages/cli/src/_test_/task-init.spec.ts

@@ -49,6 +49,7 @@ vi.mock('../wizard/init/steps', () => ({
   needsStencilConfig: vi.fn().mockReturnValue(false),
   promptMonorepo: vi.fn().mockResolvedValue(false),
   promptWorkspaceCoreName: vi.fn().mockResolvedValue('core'),
+  withVersionRanges: (packages: string[]) => packages,
 }));
 vi.mock('../wizard/init/apply', () => ({
   applyPackageJsonFields: vi.fn().mockResolvedValue(undefined),

packages/cli/src/task-add.ts

@@ -14,6 +14,7 @@ import {
   type KnownIntegration,
   promptAddCapabilities,
   promptCustomPackages,
+  withVersionRanges,
 } from './wizard/init/steps.js';
 import { defaultProjectConfig, detectWorkspaceRoot, toProjectConfig } from './wizard/project.js';
 import { printSplash } from './wizard/splash.js';
@@ -93,7 +94,7 @@ export async function taskAdd(packages: string[], strictConfig?: ValidatedConfig
     } else {
       const s = p.spinner();
       s.start(`Installing ${packagesToInstall.join(', ')}`);
-      await addDevDependency(packagesToInstall, { cwd, silent: true });
+      await addDevDependency(withVersionRanges(packagesToInstall), { cwd, silent: true });
       s.stop('Installed');
     }
   }

packages/cli/src/task-init.ts

@@ -32,6 +32,7 @@ import {
   promptOutputs,
   promptProjectName,
   promptWorkspaceCoreName,
+  withVersionRanges,
 } from './wizard/init/steps.js';
 import {
   defaultProjectConfig,
@@ -145,7 +146,7 @@ export async function taskInit(
     const pkgs = selectedIntegrations.map((i) => i.package);
     s3.start(`Installing ${pkgs.join(', ')}`);
     // Integration packages (e.g. output target plugins) are deps of the core package
-    await addDevDependency(pkgs, { cwd: coreDir, silent: true });
+    await addDevDependency(withVersionRanges(pkgs), { cwd: coreDir, silent: true });
     s3.stop('Integrations installed');
   }
 
@@ -248,7 +249,7 @@ async function addCapabilities(cwd: string, strictConfig?: ValidatedConfig): Pro
     const s = p.spinner();
     const pkgs = toInstall.map((i) => i.package);
     s.start(`Installing ${pkgs.join(', ')}`);
-    await addDevDependency(pkgs, { cwd, silent: true });
+    await addDevDependency(withVersionRanges(pkgs), { cwd, silent: true });
     s.stop('Dependencies installed');
   }
 

packages/cli/src/wizard/init/steps.ts

@@ -15,6 +15,8 @@ export interface KnownIntegration {
   requiresStencilConfig?: true;
   /** When true, this integration publishes its own package and benefits from a monorepo workspace. */
   needsWorkspace?: true;
+  /** Semver range appended (as `package@range`) when installing this integration. */
+  versionRange?: string;
 }
 
 /** Well-known integrations the CLI can offer before any packages are installed. */
@@ -56,6 +58,7 @@ export const KNOWN_INTEGRATIONS: KnownIntegration[] = [
     displayName: 'Storybook',
     description: 'Component development & documentation',
     group: 'Tooling',
+    versionRange: '>=1.0.0-0',
   },
 
   // Framework integrations
@@ -92,6 +95,17 @@ export const KNOWN_INTEGRATIONS: KnownIntegration[] = [
   },
 ];
 
+const versionRangeByPackage = new Map(
+  KNOWN_INTEGRATIONS.filter((i) => i.versionRange).map((i) => [i.package, i.versionRange!]),
+);
+
+export function withVersionRanges(packages: string[]): string[] {
+  return packages.map((pkg) => {
+    const range = versionRangeByPackage.get(pkg);
+    return range ? `${pkg}@${range}` : pkg;
+  });
+}
+
 export async function promptOutputs(): Promise<OutputKey[]> {
   const picks = await p.multiselect<OutputKey>({
     message: 'Outputs:',