storybook-onbook-plugin 0.1.0 → 0.2.0

package/README.md

@@ -55,6 +55,26 @@ storybookOnlookPlugin({
 });
 ```
 
+## CLI
+
+Generate screenshots for all stories:
+
+```bash
+# With Storybook already running
+npx generate-screenshots
+
+# Start Storybook automatically
+npx generate-screenshots --start
+
+# Custom Storybook URL
+npx generate-screenshots --url http://localhost:9009
+
+# Custom start command
+npx generate-screenshots --start --cmd "bun run storybook"
+```
+
+Screenshots are saved to `.storybook-cache/screenshots/`.
+
 ## CI/Chromatic
 
 The plugin auto-disables when `CHROMATIC` or `CI` environment variables are set.

package/dist/cli/generate-screenshots.d.ts

@@ -0,0 +1,3 @@
+#!/usr/bin/env node
+export {};
+//# sourceMappingURL=generate-screenshots.d.ts.map

package/dist/cli/generate-screenshots.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"generate-screenshots.d.ts","sourceRoot":"","sources":["../../src/cli/generate-screenshots.ts"],"names":[],"mappings":""}

package/dist/cli/generate-screenshots.js

@@ -0,0 +1,169 @@
+#!/usr/bin/env node
+import { spawn } from 'node:child_process';
+import { generateAllScreenshots } from '../screenshot-service/index.js';
+import { getBrowser } from '../screenshot-service/utils/browser/index.js';
+function parseArgs() {
+    const args = process.argv.slice(2);
+    const options = {
+        url: 'http://localhost:6006',
+        startStorybook: false,
+        storybookCmd: 'npm run storybook',
+    };
+    for (let i = 0; i < args.length; i++) {
+        const arg = args[i];
+        const nextArg = args[i + 1];
+        if (arg === '--url' && nextArg) {
+            options.url = nextArg;
+            i++;
+        }
+        else if (arg === '--start') {
+            options.startStorybook = true;
+        }
+        else if (arg === '--cmd' && nextArg) {
+            options.storybookCmd = nextArg;
+            i++;
+        }
+        else if (arg === '--help' || arg === '-h') {
+            console.log(`
+Usage: generate-screenshots [options]
+
+Options:
+  --url <url>     Storybook URL (default: http://localhost:6006)
+  --start         Start Storybook before generating screenshots
+  --cmd <command> Command to start Storybook (default: npm run storybook)
+  --help, -h      Show this help message
+
+Examples:
+  # With Storybook already running
+  generate-screenshots
+
+  # Start Storybook automatically
+  generate-screenshots --start
+
+  # Custom URL
+  generate-screenshots --url http://localhost:9009
+
+  # Custom start command
+  generate-screenshots --start --cmd "bun run storybook"
+`);
+            process.exit(0);
+        }
+    }
+    return options;
+}
+async function fetchStoryIndex(url) {
+    const indexUrl = `${url}/index.json`;
+    try {
+        const response = await fetch(indexUrl);
+        if (!response.ok) {
+            throw new Error(`Failed to fetch story index: ${response.statusText}`);
+        }
+        const data = (await response.json());
+        return Object.values(data.entries);
+    }
+    catch (error) {
+        console.error('Error fetching story index:', error);
+        console.error(`Make sure Storybook is running at ${url}`);
+        process.exit(1);
+    }
+}
+async function startStorybook(cmd) {
+    console.log(`🚀 Starting Storybook with: ${cmd}`);
+    const [command, ...args] = cmd.split(' ');
+    if (!command) {
+        throw new Error('Invalid storybook command');
+    }
+    const storybookProcess = spawn(command, [...args, '--', '--no-open'], {
+        cwd: process.cwd(),
+        stdio: 'pipe',
+        shell: true,
+    });
+    return new Promise((resolve, reject) => {
+        let started = false;
+        const timeout = setTimeout(() => {
+            if (!started) {
+                storybookProcess.kill();
+                reject(new Error('Storybook failed to start within 60 seconds'));
+            }
+        }, 60000);
+        storybookProcess.stdout?.on('data', (data) => {
+            const output = data.toString();
+            console.log(output);
+            if (output.includes('Local:') || output.includes('localhost:')) {
+                if (!started) {
+                    started = true;
+                    clearTimeout(timeout);
+                    console.log('✅ Storybook is ready!');
+                    resolve(storybookProcess);
+                }
+            }
+        });
+        storybookProcess.stderr?.on('data', (data) => {
+            console.error(data.toString());
+        });
+        storybookProcess.on('error', (error) => {
+            clearTimeout(timeout);
+            reject(error);
+        });
+    });
+}
+async function warmupStorybook(url, firstStoryId) {
+    console.log('🔥 Warming up Storybook...');
+    const browser = await getBrowser();
+    const context = await browser.newContext();
+    const page = await context.newPage();
+    try {
+        const warmupUrl = `${url}/iframe.html?id=${firstStoryId}&viewMode=story`;
+        await page.goto(warmupUrl, { timeout: 15000 });
+        await page.waitForLoadState('networkidle');
+        console.log('✅ Storybook warmed up');
+    }
+    catch (error) {
+        console.log('⚠️ Warmup had issues, proceeding anyway:', error);
+    }
+    finally {
+        await context.close();
+    }
+}
+async function main() {
+    const options = parseArgs();
+    console.log('📸 Generating Storybook screenshots...');
+    let storybookProcess = null;
+    try {
+        if (options.startStorybook) {
+            storybookProcess = await startStorybook(options.storybookCmd);
+        }
+        console.log(`Using Storybook URL: ${options.url}`);
+        // Fetch all stories
+        const stories = await fetchStoryIndex(options.url);
+        console.log(`Found ${stories.length} stories`);
+        const firstStory = stories[0];
+        if (!firstStory) {
+            throw new Error('No stories found');
+        }
+        // Warm up Storybook
+        await warmupStorybook(options.url, firstStory.id);
+        // Generate screenshots
+        await generateAllScreenshots(stories.map((story) => ({
+            id: story.id,
+            importPath: story.importPath,
+        })), options.url);
+        console.log('✅ Screenshot generation complete!');
+    }
+    catch (error) {
+        console.error('❌ Error during screenshot generation:', error);
+        throw error;
+    }
+    finally {
+        if (storybookProcess) {
+            console.log('🛑 Stopping Storybook...');
+            storybookProcess.kill();
+        }
+    }
+}
+main()
+    .then(() => process.exit(0))
+    .catch((error) => {
+    console.error('Fatal error:', error);
+    process.exit(1);
+});

package/dist/handlers/handleStoryFileChange/handleStoryFileChange.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"handleStoryFileChange.d.ts","sourceRoot":"","sources":["../../../src/handlers/handleStoryFileChange/handleStoryFileChange.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC;AA4FvC,wBAAgB,qBAAqB,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,UAAU,2CAiClE"}

package/dist/{onlook-plugin/handlers → handlers}/handleStoryFileChange/handleStoryFileChange.js

@@ -1,7 +1,7 @@
 import path from 'node:path';
-import { generateScreenshot } from '../../screenshot-service/index';
-import { computeFileHash } from '../../utils/fileSystem/index';
-import { updateManifest } from '../../utils/manifest/index';
+import { generateScreenshot } from '../../screenshot-service/index.js';
+import { computeFileHash } from '../../utils/fileSystem/index.js';
+import { updateManifest } from '../../utils/manifest/index.js';
 // Cache for Storybook's index.json
 let cachedIndex = null;
 let indexFetchPromise = null;

package/dist/handlers/handleStoryFileChange/index.d.ts

@@ -0,0 +1,2 @@
+export { handleStoryFileChange } from './handleStoryFileChange.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/handlers/handleStoryFileChange/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/handlers/handleStoryFileChange/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC"}

package/dist/handlers/handleStoryFileChange/index.js

@@ -0,0 +1 @@
+export { handleStoryFileChange } from './handleStoryFileChange.js';

package/dist/index.d.ts

@@ -1,2 +1,2 @@
-export { storybookOnlookPlugin, type OnlookPluginOptions } from './onlook-plugin/index';
+export { type OnlookPluginOptions, storybookOnlookPlugin, } from './storybook-onlook-plugin.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,KAAK,mBAAmB,EAAE,MAAM,uBAAuB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,mBAAmB,EACxB,qBAAqB,GACtB,MAAM,8BAA8B,CAAC"}

package/dist/index.js

@@ -1 +1 @@
-export { storybookOnlookPlugin } from './onlook-plugin/index';
+export { storybookOnlookPlugin, } from './storybook-onlook-plugin.js';

package/dist/screenshot-service/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../src/screenshot-service/constants.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS,QAA+C,CAAC;AACtE,eAAO,MAAM,eAAe,QAAsC,CAAC;AACnE,eAAO,MAAM,aAAa,QAAwC,CAAC;AAInE,eAAO,MAAM,cAAc,OAAO,CAAC;AACnC,eAAO,MAAM,eAAe,OAAO,CAAC;AAGpC,eAAO,MAAM,mBAAmB,MAAM,CAAC;AACvC,eAAO,MAAM,oBAAoB,MAAM,CAAC"}

package/dist/screenshot-service/index.d.ts

@@ -0,0 +1,5 @@
+export { generateAllScreenshots } from './screenshot-service.js';
+export type { Manifest, ScreenshotMetadata } from './types.js';
+export { closeBrowser } from './utils/browser/index.js';
+export { generateScreenshot, getScreenshotPath, screenshotExists, } from './utils/screenshot/index.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/screenshot-service/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/screenshot-service/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AAEjE,YAAY,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAE/D,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EACL,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,GACjB,MAAM,6BAA6B,CAAC"}

package/dist/screenshot-service/index.js

@@ -0,0 +1,5 @@
+// Main API
+export { generateAllScreenshots } from './screenshot-service.js';
+// Re-export screenshot utilities
+export { closeBrowser } from './utils/browser/index.js';
+export { generateScreenshot, getScreenshotPath, screenshotExists, } from './utils/screenshot/index.js';

package/dist/screenshot-service/screenshot-service.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"screenshot-service.d.ts","sourceRoot":"","sources":["../../src/screenshot-service/screenshot-service.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,wBAAsB,sBAAsB,CAC1C,OAAO,EAAE,KAAK,CAAC;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,UAAU,EAAE,MAAM,CAAA;CAAE,CAAC,EAClD,YAAY,GAAE,MAAgC,GAC7C,OAAO,CAAC,IAAI,CAAC,CAsCf"}

package/dist/{onlook-plugin/screenshot-service → screenshot-service}/screenshot-service.js

@@ -1,7 +1,7 @@
-import { computeFileHash } from '../utils/fileSystem/index';
-import { updateManifest } from '../utils/manifest/index';
-import { closeBrowser } from './utils/browser/index';
-import { generateScreenshot } from './utils/screenshot/index';
+import { computeFileHash } from '../utils/fileSystem/index.js';
+import { updateManifest } from '../utils/manifest/index.js';
+import { closeBrowser } from './utils/browser/index.js';
+import { generateScreenshot } from './utils/screenshot/index.js';
 /**
  * Generate screenshots for all stories (parallelized for speed)
  */

package/dist/screenshot-service/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/screenshot-service/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,kBAAkB;IACjC,QAAQ,EAAE,MAAM,CAAC;IACjB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE;QACX,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;IACF,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;AAED,MAAM,WAAW,QAAQ;IACvB,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;CAC7C"}

package/dist/screenshot-service/utils/browser/browser.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"browser.d.ts","sourceRoot":"","sources":["../../../../src/screenshot-service/utils/browser/browser.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,OAAO,EAAY,MAAM,YAAY,CAAC;AAIpD;;GAEG;AACH,wBAAsB,UAAU,IAAI,OAAO,CAAC,OAAO,CAAC,CAOnD;AAED;;GAEG;AACH,wBAAsB,YAAY,kBAUjC"}

package/dist/screenshot-service/utils/browser/index.d.ts

@@ -0,0 +1,2 @@
+export { closeBrowser, getBrowser } from './browser.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/screenshot-service/utils/browser/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/screenshot-service/utils/browser/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC"}

package/dist/screenshot-service/utils/browser/index.js

@@ -0,0 +1 @@
+export { closeBrowser, getBrowser } from './browser.js';

package/dist/screenshot-service/utils/screenshot/index.d.ts

@@ -0,0 +1,2 @@
+export { captureScreenshotBuffer, generateScreenshot, getScreenshotPath, screenshotExists, } from './screenshot.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/screenshot-service/utils/screenshot/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/screenshot-service/utils/screenshot/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,GACjB,MAAM,iBAAiB,CAAC"}

package/dist/{onlook-plugin/screenshot-service → screenshot-service}/utils/screenshot/index.js

@@ -1 +1 @@
-export { captureScreenshotBuffer, generateScreenshot, getScreenshotPath, screenshotExists, } from './screenshot';
+export { captureScreenshotBuffer, generateScreenshot, getScreenshotPath, screenshotExists, } from './screenshot.js';

package/dist/{onlook-plugin/screenshot-service → screenshot-service}/utils/screenshot/screenshot.d.ts

@@ -1,4 +1,4 @@
-import type { BoundingBox } from '../../types';
+import type { BoundingBox } from '../../types.js';
 export interface ScreenshotResult {
     buffer: Buffer;
     boundingBox: BoundingBox | null;

package/dist/screenshot-service/utils/screenshot/screenshot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"screenshot.d.ts","sourceRoot":"","sources":["../../../../src/screenshot-service/utils/screenshot/screenshot.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAGlD,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,WAAW,GAAG,IAAI,CAAC;CACjC;AAED,MAAM,WAAW,wBAAwB;IACvC,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,WAAW,GAAG,IAAI,CAAC;CACjC;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAGlF;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAGlF;AAED;;GAEG;AACH,wBAAsB,uBAAuB,CAC3C,OAAO,EAAE,MAAM,EACf,KAAK,EAAE,OAAO,GAAG,MAAM,EACvB,KAAK,GAAE,MAAuB,EAC9B,MAAM,GAAE,MAAwB,EAChC,YAAY,GAAE,MAAgC,GAC7C,OAAO,CAAC,gBAAgB,CAAC,CAiG3B;AAED;;GAEG;AACH,wBAAsB,kBAAkB,CACtC,OAAO,EAAE,MAAM,EACf,KAAK,EAAE,OAAO,GAAG,MAAM,EACvB,YAAY,GAAE,MAAgC,GAC7C,OAAO,CAAC,wBAAwB,GAAG,IAAI,CAAC,CAwB1C"}

package/dist/{onlook-plugin/screenshot-service → screenshot-service}/utils/screenshot/screenshot.js

@@ -1,8 +1,8 @@
 import fs from 'node:fs';
 import path from 'node:path';
-import { ensureCacheDirectories } from '../../../utils/fileSystem/index';
-import { MIN_COMPONENT_HEIGHT, MIN_COMPONENT_WIDTH, SCREENSHOTS_DIR, VIEWPORT_HEIGHT, VIEWPORT_WIDTH, } from '../../constants';
-import { getBrowser } from '../browser/index';
+import { ensureCacheDirectories } from '../../../utils/fileSystem/index.js';
+import { MIN_COMPONENT_HEIGHT, MIN_COMPONENT_WIDTH, SCREENSHOTS_DIR, VIEWPORT_HEIGHT, VIEWPORT_WIDTH, } from '../../constants.js';
+import { getBrowser } from '../browser/index.js';
 /**
  * Get screenshot file path
  */

package/dist/storybook-onlook-plugin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"storybook-onlook-plugin.d.ts","sourceRoot":"","sources":["../src/storybook-onlook-plugin.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAU,YAAY,EAAiB,MAAM,MAAM,CAAC;AAoBhE,MAAM,MAAM,mBAAmB,GAAG;IAChC,qCAAqC;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,iEAAiE;IACjE,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;CAC3B,CAAC;AAqHF,wBAAgB,qBAAqB,CAAC,OAAO,GAAE,mBAAwB,GAAG,YAAY,EAAE,CAwCvF"}

package/dist/{onlook-plugin/storybook-onlook-plugin.js → storybook-onlook-plugin.js}

@@ -1,10 +1,10 @@
 import fs from 'node:fs';
 import path, { dirname, join, relative } from 'node:path';
 import { fileURLToPath } from 'node:url';
-import { componentLocPlugin } from '../component-loc/index';
-import { handleStoryFileChange } from './handlers/handleStoryFileChange/index';
-import { captureScreenshotBuffer } from './screenshot-service/utils/screenshot/index';
-import { findGitRoot } from './utils/findGitRoot/index';
+import { componentLocPlugin } from './component-loc/index.js';
+import { handleStoryFileChange } from './handlers/handleStoryFileChange/index.js';
+import { captureScreenshotBuffer } from './screenshot-service/utils/screenshot/index.js';
+import { findGitRoot } from './utils/findGitRoot/index.js';
 // Calculate storybook location relative to git root
 const __dirname = dirname(fileURLToPath(import.meta.url));
 const storybookDir = join(__dirname, '..');
@@ -114,10 +114,7 @@ export function storybookOnlookPlugin(options = {}) {
         return [];
     }
     const port = options.port ?? 6006;
-    const allowedOrigins = [
-        ...DEFAULT_ALLOWED_ORIGINS,
-        ...(options.allowedOrigins ?? []),
-    ];
+    const allowedOrigins = [...DEFAULT_ALLOWED_ORIGINS, ...(options.allowedOrigins ?? [])];
     const mainPlugin = {
         name: 'storybook-onlook-plugin',
         config() {

package/dist/utils/fileSystem/fileSystem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fileSystem.d.ts","sourceRoot":"","sources":["../../../src/utils/fileSystem/fileSystem.ts"],"names":[],"mappings":"AAIA;;GAEG;AACH,wBAAgB,sBAAsB,SAOrC;AAED;;GAEG;AACH,wBAAgB,eAAe,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAMxD"}

package/dist/{onlook-plugin/utils → utils}/fileSystem/fileSystem.js

@@ -1,6 +1,6 @@
 import crypto from 'node:crypto';
 import fs from 'node:fs';
-import { CACHE_DIR, SCREENSHOTS_DIR } from '../../screenshot-service/constants';
+import { CACHE_DIR, SCREENSHOTS_DIR } from '../../screenshot-service/constants.js';
 /**
  * Ensure cache directories exist
  */

package/dist/{onlook-plugin/utils → utils}/fileSystem/index.d.ts

@@ -1,2 +1,2 @@
-export { computeFileHash, ensureCacheDirectories } from './fileSystem';
+export { computeFileHash, ensureCacheDirectories } from './fileSystem.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/utils/fileSystem/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/fileSystem/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/{onlook-plugin/utils → utils}/fileSystem/index.js

@@ -1 +1 @@
-export { computeFileHash, ensureCacheDirectories } from './fileSystem';
+export { computeFileHash, ensureCacheDirectories } from './fileSystem.js';

package/dist/utils/findGitRoot/findGitRoot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"findGitRoot.d.ts","sourceRoot":"","sources":["../../../src/utils/findGitRoot/findGitRoot.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,wBAAgB,WAAW,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAW5D"}

package/dist/utils/findGitRoot/index.d.ts

@@ -0,0 +1,2 @@
+export { findGitRoot } from './findGitRoot.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/utils/findGitRoot/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/findGitRoot/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/utils/findGitRoot/index.js

@@ -0,0 +1 @@
+export { findGitRoot } from './findGitRoot.js';

package/dist/utils/manifest/index.d.ts

@@ -0,0 +1,2 @@
+export { getManifestEntry, loadManifest, saveManifest, updateManifest, } from './manifest.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/utils/manifest/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/manifest/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,gBAAgB,EAChB,YAAY,EACZ,YAAY,EACZ,cAAc,GACf,MAAM,eAAe,CAAC"}

package/dist/{onlook-plugin/utils → utils}/manifest/index.js

@@ -1 +1 @@
-export { getManifestEntry, loadManifest, saveManifest, updateManifest } from './manifest';
+export { getManifestEntry, loadManifest, saveManifest, updateManifest, } from './manifest.js';

package/dist/{onlook-plugin/utils → utils}/manifest/manifest.d.ts

@@ -1,4 +1,4 @@
-import type { Manifest, ScreenshotMetadata } from '../../screenshot-service/types';
+import type { Manifest, ScreenshotMetadata } from '../../screenshot-service/types.js';
 /**
  * Load manifest from disk
  */

package/dist/utils/manifest/manifest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"manifest.d.ts","sourceRoot":"","sources":["../../../src/utils/manifest/manifest.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AAGtF;;GAEG;AACH,wBAAgB,YAAY,IAAI,QAAQ,CAMvC;AAED;;GAEG;AACH,wBAAgB,YAAY,CAAC,QAAQ,EAAE,QAAQ,QAG9C;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,MAAM,GAAG,kBAAkB,GAAG,IAAI,CAG3E;AAED;;GAEG;AACH,wBAAgB,cAAc,CAC5B,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,MAAM,EAClB,QAAQ,EAAE,MAAM,EAChB,WAAW,CAAC,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,GAAG,IAAI,QAgBvD"}

package/dist/{onlook-plugin/utils → utils}/manifest/manifest.js

@@ -1,6 +1,6 @@
 import fs from 'node:fs';
-import { MANIFEST_PATH } from '../../screenshot-service/constants';
-import { ensureCacheDirectories } from '../fileSystem/index';
+import { MANIFEST_PATH } from '../../screenshot-service/constants.js';
+import { ensureCacheDirectories } from '../fileSystem/index.js';
 /**
  * Load manifest from disk
  */

package/package.json

@@ -1,11 +1,22 @@
 {
   "name": "storybook-onbook-plugin",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "type": "module",
+  "bin": {
+    "generate-screenshots": "./dist/cli/generate-screenshots.js"
+  },
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
       "import": "./dist/index.js"
+    },
+    "./screenshot-service": {
+      "types": "./dist/screenshot-service/index.d.ts",
+      "import": "./dist/screenshot-service/index.js"
+    },
+    "./screenshot-service/browser": {
+      "types": "./dist/screenshot-service/utils/browser/index.d.ts",
+      "import": "./dist/screenshot-service/utils/browser/index.js"
     }
   },
   "files": [

package/dist/component-loc/component-loc.d.ts

@@ -1,7 +0,0 @@
-import type { Plugin } from 'vite';
-type ComponentLocPluginOptions = {
-    include?: RegExp;
-};
-export declare function componentLocPlugin(options?: ComponentLocPluginOptions): Plugin;
-export default componentLocPlugin;
-//# sourceMappingURL=component-loc.d.ts.map

package/dist/component-loc/component-loc.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"component-loc.d.ts","sourceRoot":"","sources":["../../src/component-loc/component-loc.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,MAAM,CAAC;AAEnC,KAAK,yBAAyB,GAAG;IAC/B,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,OAAO,GAAE,yBAA8B,GAAG,MAAM,CAgFlF;AAED,eAAe,kBAAkB,CAAC"}

package/dist/component-loc/component-loc.js

@@ -1,58 +0,0 @@
-import path from 'node:path';
-import generateModule from '@babel/generator';
-import { parse } from '@babel/parser';
-import traverseModule from '@babel/traverse';
-import * as t from '@babel/types';
-export function componentLocPlugin(options = {}) {
-    const include = options.include ?? /\.(jsx|tsx)$/;
-    // @babel/traverse and @babel/generator are CommonJS modules with default exports.
-    // When imported in an ESM context, the default export may be on `.default` or directly on the module.
-    // This workaround handles both cases to ensure compatibility across different bundler configurations.
-    const traverse = traverseModule.default ??
-        traverseModule;
-    const generate = generateModule.default ??
-        generateModule;
-    let root;
-    return {
-        name: 'onbook-component-loc',
-        enforce: 'pre',
-        apply: 'serve',
-        configResolved(config) {
-            root = config.root;
-        },
-        transform(code, id) {
-            const filepath = id.split('?', 1)[0];
-            if (!filepath || filepath.includes('node_modules'))
-                return null;
-            if (!include.test(filepath))
-                return null;
-            const ast = parse(code, {
-                sourceType: 'module',
-                plugins: ['jsx', 'typescript'],
-                sourceFilename: filepath,
-            });
-            let mutated = false;
-            // Get relative path from project root
-            const relativePath = path.relative(root, filepath);
-            traverse(ast, {
-                JSXElement(nodePath) {
-                    const opening = nodePath.node.openingElement;
-                    const element = nodePath.node;
-                    if (!opening.loc || !element.loc)
-                        return;
-                    const alreadyTagged = opening.attributes.some((attribute) => t.isJSXAttribute(attribute) &&
-                        attribute.name.name === 'data-component-file');
-                    if (alreadyTagged)
-                        return;
-                    opening.attributes.push(t.jsxAttribute(t.jsxIdentifier('data-component-file'), t.stringLiteral(relativePath)), t.jsxAttribute(t.jsxIdentifier('data-component-start'), t.stringLiteral(`${element.loc.start.line}:${element.loc.start.column}`)), t.jsxAttribute(t.jsxIdentifier('data-component-end'), t.stringLiteral(`${element.loc.end.line}:${element.loc.end.column}`)));
-                    mutated = true;
-                },
-            });
-            if (!mutated)
-                return null;
-            const output = generate(ast, { retainLines: true, sourceMaps: true, sourceFileName: id }, code);
-            return { code: output.code, map: output.map };
-        },
-    };
-}
-export default componentLocPlugin;

package/dist/component-loc/index.d.ts

@@ -1,2 +0,0 @@
-export { componentLocPlugin } from './component-loc';
-//# sourceMappingURL=index.d.ts.map

package/dist/component-loc/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/component-loc/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/component-loc/index.js

@@ -1 +0,0 @@
-export { componentLocPlugin } from './component-loc';

package/dist/onlook-plugin/handlers/handleStoryFileChange/handleStoryFileChange.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"handleStoryFileChange.d.ts","sourceRoot":"","sources":["../../../../src/onlook-plugin/handlers/handleStoryFileChange/handleStoryFileChange.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC;AA4FvC,wBAAgB,qBAAqB,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,UAAU,2CAiClE"}

package/dist/onlook-plugin/handlers/handleStoryFileChange/index.d.ts

@@ -1,2 +0,0 @@
-export { handleStoryFileChange } from './handleStoryFileChange';
-//# sourceMappingURL=index.d.ts.map

package/dist/onlook-plugin/handlers/handleStoryFileChange/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/onlook-plugin/handlers/handleStoryFileChange/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC"}

package/dist/onlook-plugin/handlers/handleStoryFileChange/index.js

@@ -1 +0,0 @@
-export { handleStoryFileChange } from './handleStoryFileChange';

package/dist/onlook-plugin/index.d.ts

@@ -1,2 +0,0 @@
-export { storybookOnlookPlugin, type OnlookPluginOptions } from './storybook-onlook-plugin';
-//# sourceMappingURL=index.d.ts.map

package/dist/onlook-plugin/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/onlook-plugin/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,KAAK,mBAAmB,EAAE,MAAM,2BAA2B,CAAC"}

package/dist/onlook-plugin/index.js

@@ -1 +0,0 @@
-export { storybookOnlookPlugin } from './storybook-onlook-plugin';

package/dist/onlook-plugin/screenshot-service/constants.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../src/onlook-plugin/screenshot-service/constants.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS,QAA+C,CAAC;AACtE,eAAO,MAAM,eAAe,QAAsC,CAAC;AACnE,eAAO,MAAM,aAAa,QAAwC,CAAC;AAInE,eAAO,MAAM,cAAc,OAAO,CAAC;AACnC,eAAO,MAAM,eAAe,OAAO,CAAC;AAGpC,eAAO,MAAM,mBAAmB,MAAM,CAAC;AACvC,eAAO,MAAM,oBAAoB,MAAM,CAAC"}

package/dist/onlook-plugin/screenshot-service/index.d.ts

@@ -1,5 +0,0 @@
-export { generateAllScreenshots } from './screenshot-service';
-export type { Manifest, ScreenshotMetadata } from './types';
-export { closeBrowser } from './utils/browser/index';
-export { generateScreenshot, getScreenshotPath, screenshotExists, } from './utils/screenshot/index';
-//# sourceMappingURL=index.d.ts.map

package/dist/onlook-plugin/screenshot-service/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/onlook-plugin/screenshot-service/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,sBAAsB,EAAE,MAAM,sBAAsB,CAAC;AAE9D,YAAY,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAE5D,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EACL,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,GACjB,MAAM,0BAA0B,CAAC"}

package/dist/onlook-plugin/screenshot-service/index.js

@@ -1,5 +0,0 @@
-// Main API
-export { generateAllScreenshots } from './screenshot-service';
-// Re-export screenshot utilities
-export { closeBrowser } from './utils/browser/index';
-export { generateScreenshot, getScreenshotPath, screenshotExists, } from './utils/screenshot/index';

package/dist/onlook-plugin/screenshot-service/screenshot-service.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"screenshot-service.d.ts","sourceRoot":"","sources":["../../../src/onlook-plugin/screenshot-service/screenshot-service.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,wBAAsB,sBAAsB,CAC1C,OAAO,EAAE,KAAK,CAAC;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,UAAU,EAAE,MAAM,CAAA;CAAE,CAAC,EAClD,YAAY,GAAE,MAAgC,GAC7C,OAAO,CAAC,IAAI,CAAC,CAsCf"}

package/dist/onlook-plugin/screenshot-service/types.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/onlook-plugin/screenshot-service/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,kBAAkB;IACjC,QAAQ,EAAE,MAAM,CAAC;IACjB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE;QACX,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;IACF,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;AAED,MAAM,WAAW,QAAQ;IACvB,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;CAC7C"}

package/dist/onlook-plugin/screenshot-service/utils/browser/browser.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"browser.d.ts","sourceRoot":"","sources":["../../../../../src/onlook-plugin/screenshot-service/utils/browser/browser.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,OAAO,EAAY,MAAM,YAAY,CAAC;AAIpD;;GAEG;AACH,wBAAsB,UAAU,IAAI,OAAO,CAAC,OAAO,CAAC,CAOnD;AAED;;GAEG;AACH,wBAAsB,YAAY,kBAUjC"}

package/dist/onlook-plugin/screenshot-service/utils/browser/index.d.ts

@@ -1,2 +0,0 @@
-export { closeBrowser, getBrowser } from './browser';
-//# sourceMappingURL=index.d.ts.map

package/dist/onlook-plugin/screenshot-service/utils/browser/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/onlook-plugin/screenshot-service/utils/browser/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC"}

package/dist/onlook-plugin/screenshot-service/utils/browser/index.js

@@ -1 +0,0 @@
-export { closeBrowser, getBrowser } from './browser';

package/dist/onlook-plugin/screenshot-service/utils/screenshot/index.d.ts

@@ -1,2 +0,0 @@
-export { captureScreenshotBuffer, generateScreenshot, getScreenshotPath, screenshotExists, } from './screenshot';
-//# sourceMappingURL=index.d.ts.map

package/dist/onlook-plugin/screenshot-service/utils/screenshot/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/onlook-plugin/screenshot-service/utils/screenshot/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,GACjB,MAAM,cAAc,CAAC"}

package/dist/onlook-plugin/screenshot-service/utils/screenshot/screenshot.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"screenshot.d.ts","sourceRoot":"","sources":["../../../../../src/onlook-plugin/screenshot-service/utils/screenshot/screenshot.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,WAAW,GAAG,IAAI,CAAC;CACjC;AAED,MAAM,WAAW,wBAAwB;IACvC,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,WAAW,GAAG,IAAI,CAAC;CACjC;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAGlF;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAGlF;AAED;;GAEG;AACH,wBAAsB,uBAAuB,CAC3C,OAAO,EAAE,MAAM,EACf,KAAK,EAAE,OAAO,GAAG,MAAM,EACvB,KAAK,GAAE,MAAuB,EAC9B,MAAM,GAAE,MAAwB,EAChC,YAAY,GAAE,MAAgC,GAC7C,OAAO,CAAC,gBAAgB,CAAC,CAiG3B;AAED;;GAEG;AACH,wBAAsB,kBAAkB,CACtC,OAAO,EAAE,MAAM,EACf,KAAK,EAAE,OAAO,GAAG,MAAM,EACvB,YAAY,GAAE,MAAgC,GAC7C,OAAO,CAAC,wBAAwB,GAAG,IAAI,CAAC,CAwB1C"}

package/dist/onlook-plugin/storybook-onlook-plugin.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"storybook-onlook-plugin.d.ts","sourceRoot":"","sources":["../../src/onlook-plugin/storybook-onlook-plugin.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAU,YAAY,EAAiB,MAAM,MAAM,CAAC;AAoBhE,MAAM,MAAM,mBAAmB,GAAG;IAChC,qCAAqC;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,iEAAiE;IACjE,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;CAC3B,CAAC;AAqHF,wBAAgB,qBAAqB,CAAC,OAAO,GAAE,mBAAwB,GAAG,YAAY,EAAE,CA2CvF"}

package/dist/onlook-plugin/utils/fileSystem/fileSystem.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"fileSystem.d.ts","sourceRoot":"","sources":["../../../../src/onlook-plugin/utils/fileSystem/fileSystem.ts"],"names":[],"mappings":"AAIA;;GAEG;AACH,wBAAgB,sBAAsB,SAOrC;AAED;;GAEG;AACH,wBAAgB,eAAe,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAMxD"}

package/dist/onlook-plugin/utils/fileSystem/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/onlook-plugin/utils/fileSystem/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC"}

package/dist/onlook-plugin/utils/findGitRoot/findGitRoot.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"findGitRoot.d.ts","sourceRoot":"","sources":["../../../../src/onlook-plugin/utils/findGitRoot/findGitRoot.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,wBAAgB,WAAW,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAW5D"}

package/dist/onlook-plugin/utils/findGitRoot/index.d.ts

@@ -1,2 +0,0 @@
-export { findGitRoot } from './findGitRoot';
-//# sourceMappingURL=index.d.ts.map

package/dist/onlook-plugin/utils/findGitRoot/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/onlook-plugin/utils/findGitRoot/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC"}

package/dist/onlook-plugin/utils/findGitRoot/index.js

@@ -1 +0,0 @@
-export { findGitRoot } from './findGitRoot';

package/dist/onlook-plugin/utils/manifest/index.d.ts

@@ -1,2 +0,0 @@
-export { getManifestEntry, loadManifest, saveManifest, updateManifest } from './manifest';
-//# sourceMappingURL=index.d.ts.map

package/dist/onlook-plugin/utils/manifest/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/onlook-plugin/utils/manifest/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC"}

package/dist/onlook-plugin/utils/manifest/manifest.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"manifest.d.ts","sourceRoot":"","sources":["../../../../src/onlook-plugin/utils/manifest/manifest.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGnF;;GAEG;AACH,wBAAgB,YAAY,IAAI,QAAQ,CAMvC;AAED;;GAEG;AACH,wBAAgB,YAAY,CAAC,QAAQ,EAAE,QAAQ,QAG9C;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,MAAM,GAAG,kBAAkB,GAAG,IAAI,CAG3E;AAED;;GAEG;AACH,wBAAgB,cAAc,CAC5B,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,MAAM,EAClB,QAAQ,EAAE,MAAM,EAChB,WAAW,CAAC,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,GAAG,IAAI,QAgBvD"}