From 365331cfe5e55c1dae497f8d873c8a935783a609 Mon Sep 17 00:00:00 2001
From: indigolain <indigo.lain@gmail.com>
Date: Fri, 15 Mar 2024 23:22:00 +0900
Subject: [PATCH] Fallback to use corresponding new packages for storybook
 version 8

---
 examples/v8-react18/package.json              |  3 +-
 packages/storycap/decl/storybook.d.ts         | 36 ++++++++++++++++++-
 packages/storycap/src/client/register.ts      | 17 ++++++---
 .../storycap/src/client/with-screenshot.ts    |  9 ++++-
 4 files changed, 58 insertions(+), 7 deletions(-)

diff --git a/examples/v8-react18/package.json b/examples/v8-react18/package.json
index 21496a3d9..3f86078dc 100644
--- a/examples/v8-react18/package.json
+++ b/examples/v8-react18/package.json
@@ -34,9 +34,10 @@
     "@storybook/addon-actions": "^8.0.0",
     "@storybook/addon-essentials": "^8.0.0",
     "@storybook/addon-links": "^8.0.0",
-    "@storybook/addons": "^7.6.17",
     "@storybook/cli": "^8.0.0",
+    "@storybook/manager-api": "^8.0.0",
     "@storybook/preset-create-react-app": "^8.0.0",
+    "@storybook/preview-api": "^8.0.0",
     "@storybook/react": "^8.0.0",
     "@storybook/react-webpack5": "^8.0.0",
     "@testing-library/react": "^14.0.0",
diff --git a/packages/storycap/decl/storybook.d.ts b/packages/storycap/decl/storybook.d.ts
index b0cdca9f2..78ea71d10 100644
--- a/packages/storycap/decl/storybook.d.ts
+++ b/packages/storycap/decl/storybook.d.ts
@@ -1,6 +1,40 @@
-declare module '@storybook/addons' {
+declare module '@storybook/manager-api' {
   import { EventEmitter } from 'events';
+  export interface API {
+    raw?: () => { id: string; kind: string; name: string }[];
+    getStorybook(): { kind: string; stories: { name: string }[] }[];
+  }
+  export interface StoryKind {
+    kind: string;
+    stories: string[];
+  }
+  export class Channel extends EventEmitter {
+    on(name: 'setStories', listener: (event: { stories: StoryKind[] }) => void): this;
+    once(name: 'setStories', listener: (event: { stories: StoryKind[] }) => void): this;
+  }
+  export interface Addons {
+    register(name: string, callback: (api: API) => void): void;
+    getChannel(): Channel;
+  }
+
+  export const addons: Addons;
+}
+declare module '@storybook/preview-api' {
+  interface MakeDecorator {
+    (options: {
+      name: string;
+      parameterName: string;
+      skipIfNoParametersOrOptions: boolean;
+      allowDeprecatedUsage: boolean;
+      wrapper: (getStory: any, context: any, args: { parameters: any; options: any }) => any;
+    }): Function;
+  }
 
+  export const makeDecorator: MakeDecorator;
+}
+declare module '@storybook/addons' {
+  // eslint-disable-next-line no-duplicate-imports
+  import { EventEmitter } from 'events';
   export interface API {
     raw?: () => { id: string; kind: string; name: string }[];
     getStorybook(): { kind: string; stories: { name: string }[] }[];
diff --git a/packages/storycap/src/client/register.ts b/packages/storycap/src/client/register.ts
index 2a57f5409..1d8c6ea10 100644
--- a/packages/storycap/src/client/register.ts
+++ b/packages/storycap/src/client/register.ts
@@ -1,7 +1,16 @@
-import { addons } from '@storybook/addons';
+import type { Addons } from '@storybook/addons';
+
+let addons: Addons | undefined;
+try {
+  addons = require('@storybook/addons').addons;
+} catch {}
+try {
+  addons = require('@storybook/manager-api').addons;
+} catch {}
 
 (window as any).__STORYCAP_MANAGED_MODE_REGISTERED__ = true;
 
-addons.register('storycap', () => {
-  // nothing to do
-});
+addons &&
+  addons.register('storycap', () => {
+    // nothing to do
+  });
diff --git a/packages/storycap/src/client/with-screenshot.ts b/packages/storycap/src/client/with-screenshot.ts
index 228902f64..f2b3e7c42 100644
--- a/packages/storycap/src/client/with-screenshot.ts
+++ b/packages/storycap/src/client/with-screenshot.ts
@@ -1,4 +1,11 @@
-import { StoryKind, makeDecorator } from '@storybook/addons';
+import type { StoryKind, MakeDecorator } from '@storybook/addons';
+let makeDecorator: MakeDecorator | undefined;
+try {
+  makeDecorator = require('@storybook/addons').makeDecorator;
+} catch {}
+try {
+  makeDecorator = require('@storybook/preview-api').makeDecorator;
+} catch {}
 
 import { ScreenshotOptions } from '../shared/types';
 import { triggerScreenshot } from './trigger-screenshot';