@onlook/storybook-plugin 0.3.0 → 0.3.2

package/README.md

@@ -57,20 +57,17 @@ storybookOnlookPlugin({
 
 ## CLI
 
-Generate screenshots for all stories:
+The binary is named `onlook-storybook`. Since it differs from the package name, use `-p` with `bunx`:
 
 ```bash
-# With Storybook already running
-npx generate-screenshots
+# bun
+bunx -p @onlook/storybook-plugin onlook-storybook generate-screenshots
 
-# Start Storybook automatically
-npx generate-screenshots --start
+# npm
+npx onlook-storybook generate-screenshots
 
-# Custom Storybook URL
-npx generate-screenshots --url http://localhost:9009
-
-# Custom start command
-npx generate-screenshots --start --cmd "bun run storybook"
+# With options
+bunx -p @onlook/storybook-plugin onlook-storybook generate-screenshots -c 10 -t 30000
 ```
 
 Screenshots are saved to `.storybook-cache/screenshots/`.

package/dist/index.js

@@ -496,16 +496,17 @@ function storybookOnlookPlugin(options = {}) {
   const mainPlugin = {
     name: "storybook-onlook-plugin",
     config() {
+      const isE2B = !!process.env.E2B_SANDBOX;
       return {
         server: {
-          // E2B sandbox HMR configuration
-          hmr: {
-            // E2B sandboxes use HTTPS, so we need secure WebSocket
-            protocol: "wss",
-            // E2B routes through standard HTTPS port 443
-            clientPort: 443,
-            // The actual Storybook server port inside the sandbox
-            port
+          // Only override HMR for E2B sandboxes (wss + port 443)
+          // Local dev uses Vite's default HMR which works out of the box
+          ...isE2B && {
+            hmr: {
+              protocol: "wss",
+              clientPort: 443,
+              port
+            }
           },
           cors: {
             origin: allowedOrigins
@@ -527,7 +528,13 @@ function storybookOnlookPlugin(options = {}) {
       console.log("[STORYBOOK_PLUGIN] Configuring preview server middleware");
       server.middlewares.use(serveMetadataAndScreenshots);
     },
-    handleHotUpdate: handleStoryFileChange
+    // Only auto-regenerate screenshots in E2B sandboxes where Onbook
+    // consumes them. In local dev this blocks HMR with 36 Playwright
+    // page loads per save. Screenshots are still available on-demand
+    // via /api/capture-screenshot and the CLI.
+    ...process.env.E2B_SANDBOX && {
+      handleHotUpdate: handleStoryFileChange
+    }
   };
   return [componentLocPlugin(), mainPlugin];
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onlook/storybook-plugin",
-  "version": "0.3.0",
+  "version": "0.3.2",
   "type": "module",
   "bin": {
     "onlook-storybook": "./dist/cli/index.js"
@@ -8,15 +8,15 @@
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "import": "./dist/index.js"
+      "default": "./dist/index.js"
     },
     "./screenshot-service": {
       "types": "./dist/screenshot-service/index.d.ts",
-      "import": "./dist/screenshot-service/index.js"
+      "default": "./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"
+      "default": "./dist/screenshot-service/utils/browser/index.js"
     }
   },
   "files": [