refactor: use "previewable" to describe "component or story" (#1932)

.eslintignore

@@ -1,5 +1,5 @@
 dist
-component-analyzer/react/types
+analyzer/react/types
 framework-plugins/vue2/preview/modules
 framework-plugins/vue3/preview/modules
 framework-plugins/*/tests/apps

.github/workflows/release-components.yaml

@@ -65,7 +65,7 @@ jobs:
             fi
           fi
       - run: |
-          cd component-analyzer/api
+          cd analyzer/api
           if ! pnpm publish --no-git-checks --access public 2>error.log; then
             if grep -q -F 'You cannot publish over the previously published versions' error.log; then
               echo "Package is already published. Ignoring the following:"
@@ -76,7 +76,7 @@ jobs:
             fi
           fi
       - run: |
-          cd component-analyzer/react
+          cd analyzer/react
           if ! pnpm publish --no-git-checks --access public 2>error.log; then
             if grep -q -F 'You cannot publish over the previously published versions' error.log; then
               echo "Package is already published. Ignoring the following:"

component-analyzer/api/package.json → analyzer/api/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@previewjs/component-analyzer-api",
+  "name": "@previewjs/analyzer-api",
   "version": "0.0.1",
   "license": "MIT",
   "author": {

component-analyzer/api/src/api.ts → analyzer/api/src/api.ts

@@ -7,27 +7,27 @@ import type {
 import type { Reader } from "@previewjs/vfs";
 import type { Logger } from "pino";
 
-export type ComponentAnalyzer = {
+export type Analyzer = {
   typeAnalyzer: Omit<TypeAnalyzer, "dispose">;
-  detectComponents: (filePaths: string[]) => Promise<{
+  analyze: (filePaths: string[]) => Promise<{
     components: Component[];
     stories: Story[];
   }>;
   dispose: () => void;
 };
 
-export type ComponentAnalyzerFactory = (options: {
+export type AnalyzerFactory = (options: {
   rootDir: string;
   reader?: Reader;
   logger?: Logger;
-}) => ComponentAnalyzer;
+}) => Analyzer;
 
-export interface BaseComponent {
-  componentId: string;
+export interface BasePreviewable {
+  id: string;
   sourcePosition: FileSourcePosition;
 }
 
-export interface Component extends BaseComponent {
+export interface Component extends BasePreviewable {
   exported: boolean;
   extractProps: () => Promise<ComponentProps>;
 }
@@ -37,7 +37,7 @@ export interface ComponentProps {
   types: CollectedTypes;
 }
 
-export interface Story extends BaseComponent {
+export interface Story extends BasePreviewable {
   extractArgs: () => Promise<StoryArgs | null>;
   associatedComponent: BasicComponent | null;
 }
@@ -52,4 +52,4 @@ export type FileSourcePosition = {
   end: number;
 };
 
-export type BasicComponent = Pick<Component, "componentId" | "extractProps">;
+export type BasicComponent = Pick<Component, "id" | "extractProps">;

component-analyzer/api/src/factory.ts → analyzer/api/src/factory.ts

@@ -1,16 +1,14 @@
 import { createFileSystemReader } from "@previewjs/vfs";
 import createLogger from "pino";
 import prettyLogger from "pino-pretty";
-import type { ComponentAnalyzer, ComponentAnalyzerFactory } from "./api";
+import type { Analyzer, AnalyzerFactory } from "./api";
 
-type ComponentAnalyzerFactoryOptions = Parameters<ComponentAnalyzerFactory>[0];
+type AnalyzerFactoryOptions = Parameters<AnalyzerFactory>[0];
 
 export function factoryWithDefaultOptions(
-  factory: (
-    options: Required<ComponentAnalyzerFactoryOptions>
-  ) => ComponentAnalyzer
-): ComponentAnalyzerFactory {
-  return (options: ComponentAnalyzerFactoryOptions) =>
+  factory: (options: Required<AnalyzerFactoryOptions>) => Analyzer
+): AnalyzerFactory {
+  return (options: AnalyzerFactoryOptions) =>
     factory({
       ...options,
       reader: options.reader || createFileSystemReader(),

component-analyzer/api/src/index.ts → analyzer/api/src/index.ts

@@ -1,3 +1,3 @@
 export * from "./api";
-export * from "./component-id";
 export * from "./factory";
+export * from "./previewable-id";

analyzer/api/src/previewable-id.ts

@@ -0,0 +1,21 @@
+export function generatePreviewableId(options: {
+  filePath: string;
+  name: string;
+}) {
+  return `${options.filePath.replace(/\\/g, "/")}:${options.name}`;
+}
+
+export function decodePreviewableId(id: string): {
+  filePath: string;
+  name: string;
+} {
+  const colonPosition = id.lastIndexOf(":");
+  if (colonPosition === -1) {
+    throw new Error(`Invalid previewable ID: "${id}"`);
+  }
+  const [filePath, name] = id.split(":") as [string, string];
+  return {
+    filePath,
+    name,
+  };
+}

component-analyzer/react/package.json → analyzer/react/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@previewjs/component-analyzer-react",
+  "name": "@previewjs/analyzer-react",
   "version": "0.0.1",
   "license": "MIT",
   "author": {
@@ -24,7 +24,7 @@
     "test": "vitest"
   },
   "dependencies": {
-    "@previewjs/component-analyzer-api": "^0.0.1",
+    "@previewjs/analyzer-api": "^0.0.1",
     "@previewjs/serializable-values": "^7.0.3",
     "@previewjs/storybook-helpers": "^4.0.0",
     "@previewjs/type-analyzer": "^9.0.0",