Merge pull request #9 from elecdeer/fix/compatibility_storybook_v8.1

Compatibility storybook v8.0
elecdeer · Jul 20, 2024 · c4b9110 · c4b9110
2 parents 1f527e5 + ac641a3
commit c4b9110
Show file tree

Hide file tree

Showing 16 changed files with 2,242 additions and 265 deletions.
diff --git a/.changeset/flat-ears-occur.md b/.changeset/flat-ears-occur.md
@@ -0,0 +1,5 @@
+---
+"storybook-addon-source-link": minor
+---
+
+This addon supports not only Storybook ^8.2.0 but also ^8.0.0
diff --git a/README.md b/README.md
@@ -6,14 +6,18 @@ This addon adds links to open the source code of story or components in your edi
 
 ## Getting started
 
+### Requirements
+
+- Storybook 8.0 or later
+
 ### 1. Install the addon.
 
 ```sh
-npm install -D my-addon
+npm install -D storybook-addon-source-link
 # or
-yarn add -D my-addon
+yarn add -D storybook-addon-source-link
 # or
-pnpm add -D my-addon
+pnpm add -D storybook-addon-source-link
 ```
 
 ### 2. Register the addon in your Storybook configuration.
@@ -67,7 +71,10 @@ const preview: Preview = {
         // add a new link type
         "story-github": ({ importPath, rootPath }) => {
           if (!rootPath) return undefined;
-          const href = `https://github.com/elecdeer/storybook-addon-source-link/blob/-/packages/demo${importPath.replace(/^\./, "")}`;
+          const href = `https://github.com/elecdeer/storybook-addon-source-link/blob/-/packages/demo${importPath.replace(
+            /^\./,
+            ""
+          )}`;
           return {
             label: importPath,
             href,

diff --git a/package.json b/package.json
@@ -6,11 +6,22 @@
 		"release": "pnpm -r run build && changeset publish"
 	},
 	"devDependencies": {
+		"@biomejs/biome": "^1.8.3",
 		"@changesets/changelog-github": "^0.5.0",
 		"@changesets/cli": "^2.27.7",
 		"typescript": "^5.5.3",
-		"@biomejs/biome": "^1.8.3",
 		"zx": "^8.1.3"
 	},
+	"pnpm": {
+		"overrides": {
+			"@storybook/blocks": "8.1.11",
+			"@storybook/components": "8.1.11",
+			"@storybook/core-events": "8.1.11",
+			"@storybook/manager-api": "8.1.11",
+			"@storybook/preview-api": "8.1.11",
+			"@storybook/theming": "8.1.11",
+			"storybook": "8.1.11"
+		}
+	},
 	"packageManager": "[email protected]+sha256.b6fd0bfda555e7e584ad7e56b30c68b01d5a04f9ee93989f4b93ca8473c49c74"
 }
diff --git a/packages/addon-source-link/CHANGELOG.md b/packages/addon-source-link/CHANGELOG.md
@@ -1,5 +1,7 @@
 # storybook-addon-source-link
 
+This project adheres to [Semantic Versioning](https://semver.org/).
+
 ## 0.1.0
 
 ### Minor Changes

diff --git a/packages/addon-source-link/package.json b/packages/addon-source-link/package.json
@@ -40,21 +40,26 @@
 		"type-check": "tsc --noEmit"
 	},
 	"dependencies": {
-		"@storybook/blocks": "^8.2.2",
-		"@storybook/core": "^8.2.2",
+		"@storybook/blocks": "^8.0.0",
+		"@storybook/components": "^8.0.0",
+		"@storybook/core-events": "^8.0.0",
 		"@storybook/icons": "^1.2.9",
+		"@storybook/manager-api": "^8.0.0",
+		"@storybook/preview-api": "^8.0.0",
+		"@storybook/theming": "^8.0.0",
 		"path-browserify": "^1.0.1",
 		"react": "^18.3.1",
-		"react-dom": "^18.3.1",
-		"storybook": "8.2.2"
+		"react-dom": "^18.3.1"
 	},
 	"devDependencies": {
+		"@storybook/types": "^8.0.0",
 		"@types/node": "^20.14.9",
 		"@types/path-browserify": "^1.0.2",
 		"@types/react": "^18.3.3",
 		"@types/react-dom": "^18.3.0",
 		"npm-run-all": "^4.1.5",
-		"tsup": "^8.1.0"
+		"tsup": "^8.1.0",
+		"storybook": "^8.0.0"
 	},
 	"publishConfig": {
 		"access": "public",

diff --git a/packages/addon-source-link/src/index.ts b/packages/addon-source-link/src/index.ts
@@ -1,3 +1,3 @@
 export type { SourceLinkParameter } from "./types";
 
-export { getFileUrl, joinPath } from "./linkUtil";
+export * from "./linkUtil";
diff --git a/packages/addon-source-link/src/manager.ts b/packages/addon-source-link/src/manager.ts
@@ -1,4 +1,4 @@
-import { addons, types } from "@storybook/core/manager-api";
+import { addons, types } from "@storybook/manager-api";
 import { ADDON_ID, TOOL_ID } from "./constants";
 import { Tool } from "./manager/Tooltip";
 

diff --git a/packages/addon-source-link/src/manager/Tooltip.tsx b/packages/addon-source-link/src/manager/Tooltip.tsx
@@ -2,19 +2,13 @@ import {
 	IconButton,
 	TooltipLinkList,
 	WithTooltip,
-} from "@storybook/core/components";
-import { STORY_CHANGED } from "@storybook/core/core-events";
-import { useChannel, useStorybookApi } from "@storybook/core/manager-api";
-import { styled } from "@storybook/core/theming";
-import type { API_LeafEntry } from "@storybook/core/types";
+} from "@storybook/components";
+import { STORY_CHANGED } from "@storybook/core-events";
 import { CheckIcon, CopyIcon, JumpToIcon } from "@storybook/icons";
-import React, {
-	memo,
-	useCallback,
-	useMemo,
-	useState,
-	type ReactNode,
-} from "react";
+import { useChannel, useStorybookApi } from "@storybook/manager-api";
+import { styled } from "@storybook/theming";
+import type { API_LeafEntry } from "@storybook/types";
+import React, { memo, useCallback, useMemo, useState } from "react";
 import type { LinkEntry } from "../types";
 import { StorybookIcon, isIconName } from "./StorybookIcon";
 import { resolveLinks } from "./resolveParameter";

diff --git a/packages/addon-source-link/src/manager/resolveParameter.ts b/packages/addon-source-link/src/manager/resolveParameter.ts
@@ -1,4 +1,4 @@
-import { addons } from "@storybook/core/manager-api";
+import { addons } from "@storybook/manager-api";
 import { EVENTS } from "../constants";
 import type { LinkEntry, ResolveContext } from "../types";
 

diff --git a/packages/addon-source-link/src/preset.ts b/packages/addon-source-link/src/preset.ts
@@ -3,7 +3,7 @@
 // so often you want to delete this file and remove the reference to it in package.json#exports and package.json#bunder.nodeEntries
 // Read more about presets at https://storybook.js.org/docs/addons/writing-presets
 
-import type { Options, PresetProperty } from "@storybook/core/types";
+import type { Options, PresetProperty } from "@storybook/types";
 
 export const env: PresetProperty<"env"> = (
 	_base: unknown,

diff --git a/packages/addon-source-link/src/preview.tsx b/packages/addon-source-link/src/preview.tsx
@@ -1,5 +1,5 @@
 import { DocsContainer, type DocsContainerProps } from "@storybook/blocks";
-import type { Addon_DecoratorFunction, Renderer } from "@storybook/core/types";
+import type { Addon_DecoratorFunction, Renderer } from "@storybook/types";
 import { getFileUrl } from "./linkUtil";
 import type { SourceLinkParameter } from "./types";
 

diff --git a/packages/addon-source-link/src/preview/parameterResolver.ts b/packages/addon-source-link/src/preview/parameterResolver.ts
@@ -1,5 +1,5 @@
-import { addons } from "@storybook/core/preview-api";
-import type { Addon_DecoratorFunction } from "@storybook/core/types";
+import { addons } from "@storybook/preview-api";
+import type { Addon_DecoratorFunction } from "@storybook/types";
 import { type FC, useEffect } from "react";
 import { EVENTS } from "../constants";
 import type {

diff --git a/packages/addon-source-link/src/types.ts b/packages/addon-source-link/src/types.ts
@@ -1,5 +1,5 @@
-import type { API_LeafEntry } from "@storybook/core/types";
 import type * as iconsModule from "@storybook/icons";
+import type { API_LeafEntry } from "@storybook/types";
 
 export type IconName = Exclude<keyof typeof iconsModule, "iconList">;
 

diff --git a/packages/addon-source-link/tsup.config.ts b/packages/addon-source-link/tsup.config.ts
@@ -29,17 +29,18 @@ export default defineConfig(async (options) => {
 	//     "nodeEntries": ["./src/preset.ts"]
 	//   }
 	// }
-	const packageJson = (await readFile("./package.json", "utf8").then(
-		JSON.parse,
-	)) as BundlerConfig;
+	const packageJson = await readFile("./package.json", "utf8").then(JSON.parse);
 	const {
 		bundler: {
 			exportEntries = [],
 			managerEntries = [],
 			previewEntries = [],
 			nodeEntries = [],
 		} = {},
-	} = packageJson;
+	} = packageJson as BundlerConfig;
+
+	const dependencies = Object.keys(packageJson.dependencies || {});
+	const devDependencies = Object.keys(packageJson.devDependencies || {});
 
 	const commonConfig: Options = {
 		splitting: false,
@@ -64,6 +65,7 @@ export default defineConfig(async (options) => {
 			format: ["esm", "cjs"],
 			target: [...BROWSER_TARGET, ...NODE_TARGET],
 			platform: "neutral",
+			external: [...dependencies, ...devDependencies],
 		});
 	}
 
@@ -77,6 +79,7 @@ export default defineConfig(async (options) => {
 			format: ["esm"],
 			target: BROWSER_TARGET,
 			platform: "browser",
+			external: [...dependencies, ...devDependencies],
 		});
 	}
 
@@ -87,12 +90,11 @@ export default defineConfig(async (options) => {
 		configs.push({
 			...commonConfig,
 			entry: previewEntries,
-			dts: {
-				resolve: true,
-			},
+			// dts: { resolve: true },
 			format: ["esm", "cjs"],
 			target: BROWSER_TARGET,
 			platform: "browser",
+			external: [...dependencies, ...devDependencies],
 		});
 	}
 

diff --git a/packages/demo/package.json b/packages/demo/package.json
@@ -11,14 +11,14 @@
 		"react-dom": "^18.3.1"
 	},
 	"devDependencies": {
-		"@storybook/addon-essentials": "^8.2.2",
-		"@storybook/addon-interactions": "^8.2.2",
-		"@storybook/addon-links": "^8.2.2",
-		"@storybook/blocks": "^8.2.2",
-		"@storybook/react": "^8.2.2",
-		"@storybook/react-vite": "^8.2.2",
-		"@storybook/test": "^8.2.2",
-		"storybook": "^8.2.2",
+		"@storybook/addon-essentials": "~8.1.0",
+		"@storybook/addon-interactions": "~8.1.0",
+		"@storybook/addon-links": "~8.1.0",
+		"@storybook/blocks": "~8.1.0",
+		"@storybook/react": "~8.1.0",
+		"@storybook/react-vite": "~8.1.0",
+		"@storybook/test": "~8.1.0",
+		"storybook": "~8.1.0",
 		"storybook-addon-source-link": "workspace:*",
 		"@vitejs/plugin-react": "^4.3.1",
 		"vite": "^5.3.3"