@motiadev/workbench 0.13.2-beta.164-704005 → 0.13.2-beta.164-681857

package/dist/middleware.js

@@ -1,51 +1,96 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.applyMiddleware = void 0;
-const plugin_react_1 = __importDefault(require("@vitejs/plugin-react"));
 const fs_1 = __importDefault(require("fs"));
 const path_1 = __importDefault(require("path"));
-const vite_1 = require("vite");
-const motia_plugin_1 = __importDefault(require("./motia-plugin"));
-const workbenchBasePlugin = (workbenchBase) => {
-    return {
-        name: 'html-transform',
+/**
+ * Check if pre-built client assets exist.
+ * If they do, we're in production mode and use static serving.
+ * If not, we're in development mode and use Vite middleware.
+ */
+function hasPrebuiltAssets() {
+    const clientDir = path_1.default.join(__dirname, 'client');
+    const manifestPath = path_1.default.join(clientDir, '.vite', 'manifest.json');
+    return fs_1.default.existsSync(manifestPath);
+}
+/**
+ * Development middleware using Vite for HMR and live compilation.
+ */
+async function applyDevMiddleware({ app, port, workbenchBase, plugins }) {
+    // Dynamic imports for dev dependencies (may not be installed in production)
+    const viteModule = await Promise.resolve().then(() => __importStar(require('vite')));
+    const createViteServer = viteModule.createServer;
+    const reactPlugin = await Promise.resolve().then(() => __importStar(require('@vitejs/plugin-react')));
+    const react = reactPlugin.default;
+    const motiaPluginModule = await Promise.resolve().then(() => __importStar(require('./motia-plugin')));
+    const motiaPluginsPlugin = motiaPluginModule.default;
+    const coreModule = await Promise.resolve().then(() => __importStar(require('@motiadev/core')));
+    const Printer = coreModule.Printer;
+    const printer = new Printer(process.cwd());
+    printer.printPluginLog('Starting workbench in development mode (Vite HMR)');
+    const workbenchBasePlugin = (workbenchBase) => ({
+        name: 'html-transform-base',
         transformIndexHtml: (html) => {
             return html.replace('</head>', `<script>const workbenchBase = ${JSON.stringify(workbenchBase)};</script></head>`);
         },
-    };
-};
-const processCwdPlugin = () => {
-    return {
-        name: 'html-transform',
+    });
+    const processCwdPlugin = () => ({
+        name: 'html-transform-cwd',
         transformIndexHtml: (html) => {
-            // Normalize path for cross-platform compatibility
             const cwd = process.cwd().replace(/\\/g, '/');
             return html.replace('</head>', `<script>const processCwd = "${cwd}";</script></head>`);
         },
-    };
-};
-const reoPlugin = () => {
-    return {
-        name: 'html-transform',
+    });
+    const reoPlugin = () => ({
+        name: 'html-transform-reo',
         transformIndexHtml(html) {
             const isAnalyticsEnabled = process.env.MOTIA_ANALYTICS_DISABLED !== 'true';
-            if (!isAnalyticsEnabled) {
+            if (!isAnalyticsEnabled)
                 return html;
-            }
-            // inject before </head>
             return html.replace('</head>', `
         <script type="text/javascript">
           !function(){var e,t,n;e="d8f0ce9cae8ae64",t=function(){Reo.init({clientID:"d8f0ce9cae8ae64", source: "internal"})},(n=document.createElement("script")).src="https://static.reo.dev/"+e+"/reo.js",n.defer=!0,n.onload=t,document.head.appendChild(n)}();
         </script>
     </head>`);
         },
-    };
-};
-const applyMiddleware = async ({ app, port, workbenchBase, plugins }) => {
-    const vite = await (0, vite_1.createServer)({
+    });
+    const vite = await createViteServer({
         appType: 'spa',
         root: __dirname,
         base: workbenchBase,
@@ -56,12 +101,12 @@ const applyMiddleware = async ({ app, port, workbenchBase, plugins }) => {
             hmr: { port: 21678 + port },
             fs: {
                 allow: [
-                    __dirname, // workbench root
-                    path_1.default.join(process.cwd(), './steps'), // steps directory
-                    path_1.default.join(process.cwd(), './src'), // src directory
-                    path_1.default.join(process.cwd(), './tutorial'), // tutorial directory
-                    path_1.default.join(process.cwd(), './node_modules'), // node_modules directory
-                    path_1.default.join(__dirname, './node_modules'), // node_modules directory
+                    __dirname,
+                    path_1.default.join(process.cwd(), './steps'),
+                    path_1.default.join(process.cwd(), './src'),
+                    path_1.default.join(process.cwd(), './tutorial'),
+                    path_1.default.join(process.cwd(), './node_modules'),
+                    path_1.default.join(__dirname, './node_modules'),
                 ],
             },
         },
@@ -74,10 +119,10 @@ const applyMiddleware = async ({ app, port, workbenchBase, plugins }) => {
             },
         },
         plugins: [
-            (0, plugin_react_1.default)(),
+            react(),
             processCwdPlugin(),
             reoPlugin(),
-            (0, motia_plugin_1.default)(plugins),
+            motiaPluginsPlugin(plugins),
             workbenchBasePlugin(workbenchBase),
         ],
         assetsInclude: ['**/*.png', '**/*.jpg', '**/*.jpeg', '**/*.gif', '**/*.svg', '**/*.ico', '**/*.webp', '**/*.avif'],
@@ -94,5 +139,141 @@ const applyMiddleware = async ({ app, port, workbenchBase, plugins }) => {
             next(e);
         }
     });
+}
+/**
+ * Production middleware using pre-built assets and esbuild for plugins.
+ */
+async function applyProdMiddleware({ app, workbenchBase, plugins }) {
+    const coreModule = await Promise.resolve().then(() => __importStar(require('@motiadev/core')));
+    const Printer = coreModule.Printer;
+    const printer = new Printer(process.cwd());
+    printer.printPluginLog('Starting workbench in production mode (pre-built assets)');
+    const { bundlePlugins, watchPlugins } = await Promise.resolve().then(() => __importStar(require('./plugin-bundler')));
+    const expressModule = await Promise.resolve().then(() => __importStar(require('express')));
+    const express = expressModule.default || expressModule;
+    const clientDir = path_1.default.join(__dirname, 'client');
+    const pluginsOutputDir = path_1.default.join(clientDir, '_plugins');
+    // Read build manifest
+    const manifestPath = path_1.default.join(clientDir, '.vite', 'manifest.json');
+    const manifest = JSON.parse(fs_1.default.readFileSync(manifestPath, 'utf-8'));
+    // Bundle plugins using esbuild
+    const pluginResult = plugins.length > 0
+        ? await bundlePlugins({
+            plugins,
+            outputDir: pluginsOutputDir,
+            workbenchBase,
+            processCwd: process.cwd(),
+        })
+        : null;
+    // Watch plugins for changes
+    if (pluginResult) {
+        await watchPlugins({
+            plugins,
+            outputDir: pluginsOutputDir,
+            workbenchBase,
+            processCwd: process.cwd(),
+        }, () => printer.printPluginLog('Plugins rebuilt'));
+    }
+    // Get main entry from manifest
+    const mainEntry = manifest['index.html'];
+    if (!mainEntry)
+        throw new Error('Main entry not found in manifest');
+    const mainJs = mainEntry.file;
+    const mainCss = mainEntry.css || [];
+    const processCwd = process.cwd().replace(/\\/g, '/');
+    // Build CSS links
+    const cssLinks = mainCss.map((css) => `<link rel="stylesheet" href="${workbenchBase}/${css}">`).join('\n    ');
+    // Build plugin assets
+    const pluginCssLink = pluginResult?.cssPath
+        ? `<link rel="stylesheet" href="${workbenchBase}/_plugins/plugins.css">`
+        : '';
+    const pluginScriptTag = pluginResult
+        ? `<script type="module" src="${workbenchBase}/_plugins/plugins.js"></script>`
+        : '<script>window.__MOTIA_PLUGINS__ = [];</script>';
+    const html = `<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/png" href="${workbenchBase}/icon.png" />
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap" rel="stylesheet" />
+    <link href="https://fonts.googleapis.com/css2?family=DM+Mono:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&display=swap" rel="stylesheet" />
+
+    <script>
+      const workbenchBase = ${JSON.stringify(workbenchBase)};
+      const processCwd = "${processCwd}";
+    </script>
+
+    <script>
+      function initAmplitude() {
+        window.amplitude.init('ab2408031a38aa5cb85587a27ecfc69c', {
+          autocapture: { fileDownloads: false, formInteractions: false },
+          fetchRemoteConfig: true,
+          recording: false,
+          optOut: true,
+        })
+      }
+    </script>
+    <script src="https://cdn.amplitude.com/libs/analytics-browser-2.11.1-min.js.gz" onload="initAmplitude()"></script>
+
+    ${process.env.MOTIA_ANALYTICS_DISABLED !== 'true'
+        ? `<script type="text/javascript">
+      !function(){var e,t,n;e="d8f0ce9cae8ae64",t=function(){Reo.init({clientID:"d8f0ce9cae8ae64", source: "internal"})},(n=document.createElement("script")).src="https://static.reo.dev/"+e+"/reo.js",n.defer=!0,n.onload=t,document.head.appendChild(n)}();
+    </script>`
+        : ''}
+
+    ${cssLinks}
+    ${pluginCssLink}
+
+    <script>
+      const importFile = async (path) => {
+        console.warn('importFile is not available in production mode');
+        if (path === 'tutorial/tutorial.tsx') return { steps: [] };
+        throw new Error('Dynamic file imports not supported in production mode');
+      }
+    </script>
+
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Motia Workbench</title>
+  </head>
+  <body class="dark">
+    <div id="root"></div>
+    ${pluginScriptTag}
+    <script type="module" src="${workbenchBase}/${mainJs}"></script>
+  </body>
+</html>`;
+    // Serve static assets
+    app.use(workbenchBase, express.static(clientDir, {
+        index: false,
+        maxAge: '1y',
+        immutable: true,
+    }));
+    // Serve plugin assets
+    if (pluginResult) {
+        app.use(`${workbenchBase}/_plugins`, express.static(pluginsOutputDir, { maxAge: 0 }));
+    }
+    // Serve public assets
+    app.use(workbenchBase, express.static(path_1.default.join(__dirname, 'public'), { index: false }));
+    // SPA fallback
+    app.use(`${workbenchBase}/*`, (_req, res) => {
+        res.status(200).set({ 'Content-Type': 'text/html' }).end(html);
+    });
+}
+/**
+ * Main middleware that auto-detects production vs development mode.
+ *
+ * - Production: Uses pre-built assets + esbuild for plugins
+ * - Development: Uses Vite for HMR and live compilation
+ */
+const applyMiddleware = async (params) => {
+    // Force dev mode if __MOTIA_DEV_MODE__ is set (monorepo development)
+    const forceDevMode = process.env.__MOTIA_DEV_MODE__ === 'true';
+    if (forceDevMode || !hasPrebuiltAssets()) {
+        await applyDevMiddleware(params);
+    }
+    else {
+        await applyProdMiddleware(params);
+    }
 };
 exports.applyMiddleware = applyMiddleware;

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

@@ -0,0 +1,33 @@
+import type { WorkbenchPlugin } from '../motia-plugin/types';
+export interface BundlePluginsOptions {
+    plugins: WorkbenchPlugin[];
+    outputDir: string;
+    workbenchBase: string;
+    processCwd: string;
+}
+export interface BundleResult {
+    jsPath: string;
+    cssPath: string | null;
+    manifest: {
+        workbenchBase: string;
+        processCwd: string;
+        hasPluginJs: boolean;
+        hasPluginCss: boolean;
+    };
+}
+/**
+ * Bundles plugins using esbuild (much lighter than Vite).
+ *
+ * This produces:
+ * - plugins.js: The bundled plugin code
+ * - plugins.css: Any CSS from plugins (if any)
+ * - manifest.json: Metadata for the middleware
+ */
+export declare function bundlePlugins(options: BundlePluginsOptions): Promise<BundleResult>;
+/**
+ * Watches plugins for changes and rebuilds (for development).
+ * This provides HMR-like functionality using esbuild's watch mode.
+ */
+export declare function watchPlugins(options: BundlePluginsOptions, onChange?: (result: BundleResult) => void): Promise<{
+    stop: () => void;
+}>;

package/dist/plugin-bundler/index.js

@@ -0,0 +1,283 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.bundlePlugins = bundlePlugins;
+exports.watchPlugins = watchPlugins;
+const core_1 = require("@motiadev/core");
+const esbuild = __importStar(require("esbuild"));
+const fs_1 = __importDefault(require("fs"));
+const path_1 = __importDefault(require("path"));
+const validator_1 = require("../motia-plugin/validator");
+const printer = new core_1.Printer(process.cwd());
+/**
+ * Generates the plugin code that will be injected into the workbench.
+ * In production mode, this sets window.__MOTIA_PLUGINS__ for the pre-built app.
+ */
+function generatePluginSource(plugins) {
+    if (!plugins || plugins.length === 0) {
+        return 'window.__MOTIA_PLUGINS__ = [];';
+    }
+    const packages = [...new Set(plugins.map((p) => p.packageName))];
+    const imports = packages.map((packageName, index) => `import * as plugin_${index} from '${packageName}'`).join('\n');
+    const packageMapEntries = packages.map((packageName, index) => `'${packageName}': plugin_${index}`);
+    return `
+${imports}
+
+const packageMap = {${packageMapEntries.join(',')}};
+
+const motiaPlugins = ${JSON.stringify(plugins)};
+
+const plugins = motiaPlugins.map((plugin) => {
+  const component = packageMap[plugin.packageName];
+  const config = component.config || {};
+  const componentName = config.componentName || plugin.componentName;
+
+  return {
+    label: plugin.label || config.label || 'Plugin label',
+    LabelIcon: component.LabelIcon || config.LabelIcon || null,
+    position: plugin.position || config.position || 'top',
+    props: plugin.props || config.props || {},
+    component: componentName ? component[componentName] : component.default,
+  };
+});
+
+// Set on window for pre-built workbench to access
+window.__MOTIA_PLUGINS__ = plugins;
+
+// Dispatch event to notify the app that plugins are ready
+window.dispatchEvent(new CustomEvent('motia:plugins-loaded', { detail: plugins }));
+`;
+}
+/**
+ * Generates CSS imports for plugins.
+ */
+function generateCssSource(plugins) {
+    const cssImports = plugins
+        .flatMap((plugin) => plugin.cssImports || [])
+        .filter((cssImport) => cssImport && cssImport.trim() !== '');
+    if (cssImports.length === 0) {
+        return '';
+    }
+    return cssImports.map((cssImport) => `@import '${cssImport}';`).join('\n');
+}
+/**
+ * Creates an esbuild plugin to resolve ~/ aliases to the project root.
+ * Also handles directory imports by resolving to index files.
+ */
+function createAliasPlugin(processCwd) {
+    return {
+        name: 'alias-resolver',
+        setup(build) {
+            // Resolve ~/ paths to the project root
+            build.onResolve({ filter: /^~\// }, (args) => {
+                const relativePath = args.path.slice(2); // Remove ~/
+                let absolutePath = path_1.default.resolve(processCwd, relativePath);
+                // Check if this is a directory and resolve to index file
+                if (fs_1.default.existsSync(absolutePath) && fs_1.default.statSync(absolutePath).isDirectory()) {
+                    // Try common index files
+                    const indexFiles = ['index.tsx', 'index.ts', 'index.jsx', 'index.js'];
+                    for (const indexFile of indexFiles) {
+                        const indexPath = path_1.default.join(absolutePath, indexFile);
+                        if (fs_1.default.existsSync(indexPath)) {
+                            absolutePath = indexPath;
+                            break;
+                        }
+                    }
+                }
+                return { path: absolutePath };
+            });
+        },
+    };
+}
+/**
+ * Bundles plugins using esbuild (much lighter than Vite).
+ *
+ * This produces:
+ * - plugins.js: The bundled plugin code
+ * - plugins.css: Any CSS from plugins (if any)
+ * - manifest.json: Metadata for the middleware
+ */
+async function bundlePlugins(options) {
+    const { plugins, outputDir, workbenchBase, processCwd } = options;
+    // Validate plugins
+    const validationResult = (0, validator_1.validatePlugins)(plugins, { failFast: false });
+    if (!validationResult.valid) {
+        printer.printPluginError('Plugin configuration validation failed:');
+        for (const err of validationResult.errors) {
+            printer.printPluginError(`  ${err}`);
+        }
+        throw new Error('Invalid plugin configuration. See errors above.');
+    }
+    if (validationResult.warnings.length > 0) {
+        for (const warning of validationResult.warnings) {
+            printer.printPluginWarn(warning);
+        }
+    }
+    // Ensure output directory exists
+    fs_1.default.mkdirSync(outputDir, { recursive: true });
+    const pluginSource = generatePluginSource(plugins);
+    const cssSource = generateCssSource(plugins);
+    // Write temporary source files
+    const tempDir = path_1.default.join(outputDir, '.temp');
+    fs_1.default.mkdirSync(tempDir, { recursive: true });
+    const pluginEntryPath = path_1.default.join(tempDir, 'plugins-entry.tsx');
+    fs_1.default.writeFileSync(pluginEntryPath, pluginSource);
+    const jsOutputPath = path_1.default.join(outputDir, 'plugins.js');
+    let cssOutputPath = null;
+    try {
+        // Bundle plugin JavaScript
+        await esbuild.build({
+            entryPoints: [pluginEntryPath],
+            bundle: true,
+            format: 'esm',
+            outfile: jsOutputPath,
+            platform: 'browser',
+            target: ['es2020'],
+            jsx: 'automatic',
+            minify: false, // Keep readable for debugging
+            sourcemap: true,
+            external: [
+                // External React (provided by workbench)
+                'react',
+                'react-dom',
+                'react/jsx-runtime',
+            ],
+            plugins: [createAliasPlugin(processCwd)],
+            define: {
+                'process.env.NODE_ENV': '"development"',
+            },
+            loader: {
+                '.tsx': 'tsx',
+                '.ts': 'ts',
+                '.jsx': 'jsx',
+                '.js': 'js',
+                '.css': 'css',
+            },
+            // Resolve from user's project and workbench
+            nodePaths: [
+                path_1.default.join(processCwd, 'node_modules'),
+                path_1.default.join(__dirname, '..', 'node_modules'),
+                path_1.default.join(__dirname, '..', '..', 'node_modules'),
+            ],
+        });
+        printer.printPluginLog(`Bundled ${plugins.length} plugin(s) → ${jsOutputPath}`);
+        // Bundle plugin CSS if any (non-fatal - CSS may be bundled in main app)
+        if (cssSource) {
+            cssOutputPath = path_1.default.join(outputDir, 'plugins.css');
+            const cssEntryPath = path_1.default.join(tempDir, 'plugins-entry.css');
+            fs_1.default.writeFileSync(cssEntryPath, cssSource);
+            try {
+                await esbuild.build({
+                    entryPoints: [cssEntryPath],
+                    bundle: true,
+                    outfile: cssOutputPath,
+                    loader: {
+                        '.css': 'css',
+                    },
+                    nodePaths: [path_1.default.join(processCwd, 'node_modules'), path_1.default.join(__dirname, '..', 'node_modules')],
+                    logLevel: 'silent',
+                });
+                printer.printPluginLog(`Bundled plugin CSS → ${cssOutputPath}`);
+            }
+            catch (cssError) {
+                // CSS bundling is optional - plugins may rely on pre-bundled CSS
+                printer.printPluginWarn(`Plugin CSS bundling skipped (styles may be pre-bundled)`);
+                cssOutputPath = null;
+            }
+        }
+        // Write manifest
+        const manifest = {
+            workbenchBase,
+            processCwd,
+            hasPluginJs: true,
+            hasPluginCss: cssOutputPath !== null,
+            generatedAt: new Date().toISOString(),
+        };
+        fs_1.default.writeFileSync(path_1.default.join(outputDir, 'manifest.json'), JSON.stringify(manifest, null, 2));
+        // Cleanup temp directory
+        fs_1.default.rmSync(tempDir, { recursive: true, force: true });
+        return {
+            jsPath: jsOutputPath,
+            cssPath: cssOutputPath,
+            manifest,
+        };
+    }
+    catch (error) {
+        // Cleanup on error
+        fs_1.default.rmSync(tempDir, { recursive: true, force: true });
+        throw error;
+    }
+}
+/**
+ * Watches plugins for changes and rebuilds (for development).
+ * This provides HMR-like functionality using esbuild's watch mode.
+ */
+async function watchPlugins(options, onChange) {
+    // Initial build
+    let result = await bundlePlugins(options);
+    onChange?.(result);
+    // Set up file watchers for local plugins
+    const localPlugins = options.plugins.filter((p) => p.packageName.startsWith('./') || p.packageName.startsWith('~/'));
+    if (localPlugins.length === 0) {
+        return { stop: () => { } };
+    }
+    const chokidarModule = await Promise.resolve().then(() => __importStar(require('chokidar')));
+    const chokidar = chokidarModule.default || chokidarModule;
+    const watchPaths = localPlugins.map((p) => {
+        const pluginPath = p.packageName.replace('~/', `${options.processCwd}/`);
+        return path_1.default.resolve(options.processCwd, pluginPath);
+    });
+    const watcher = chokidar.watch(watchPaths, {
+        ignoreInitial: true,
+        ignored: /node_modules/,
+    });
+    watcher.on('change', async () => {
+        try {
+            result = await bundlePlugins(options);
+            onChange?.(result);
+        }
+        catch (error) {
+            printer.printPluginError(`Failed to rebuild plugins: ${error}`);
+        }
+    });
+    return {
+        stop: () => {
+            watcher.close();
+        },
+    };
+}