@motiadev/workbench 0.8.2-beta.140-362903 → 0.8.2-beta.140-424079

package/dist/motia-plugin/hmr.d.ts

@@ -1,5 +1,7 @@
+import type { Printer } from '@motiadev/core';
 import type { HmrContext, ModuleNode } from 'vite';
 import type { WorkbenchPlugin } from './types';
+export declare function isConfigFile(file: string): boolean;
 /**
  * Checks if a file change should trigger HMR for plugins.
  *
@@ -14,6 +16,7 @@ export declare function shouldInvalidatePlugins(file: string, plugins: Workbench
  *
  * @param ctx - Vite's HMR context
  * @param plugins - Current plugin configurations
+ * @param printer - Printer instance for logging
  * @returns Array of modules to update, or undefined to continue with default behavior
  */
-export declare function handlePluginHotUpdate(ctx: HmrContext, plugins: WorkbenchPlugin[]): ModuleNode[] | void;
+export declare function handlePluginHotUpdate(ctx: HmrContext, plugins: WorkbenchPlugin[], printer: Printer): ModuleNode[] | undefined;

package/dist/motia-plugin/hmr.js

@@ -1,9 +1,20 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.isConfigFile = isConfigFile;
 exports.shouldInvalidatePlugins = shouldInvalidatePlugins;
 exports.handlePluginHotUpdate = handlePluginHotUpdate;
+const path_1 = __importDefault(require("path"));
+const resolver_1 = require("./resolver");
 const types_1 = require("./types");
 const utils_1 = require("./utils");
+const WATCHED_EXTENSIONS = ['.ts', '.tsx', '.js', '.jsx', '.css', '.scss', '.less'];
+function isConfigFile(file) {
+    const normalizedFile = (0, utils_1.normalizePath)(file);
+    return normalizedFile.endsWith('motia.config.ts') || normalizedFile.endsWith('motia.config.js');
+}
 /**
  * Checks if a file change should trigger HMR for plugins.
  *
@@ -13,19 +24,28 @@ const utils_1 = require("./utils");
  */
 function shouldInvalidatePlugins(file, plugins) {
     const normalizedFile = (0, utils_1.normalizePath)(file);
-    // Check if the changed file is a local plugin
+    const absoluteFile = path_1.default.isAbsolute(normalizedFile) ? normalizedFile : path_1.default.resolve(process.cwd(), normalizedFile);
+    if (isConfigFile(file)) {
+        return true;
+    }
+    const hasWatchedExtension = WATCHED_EXTENSIONS.some((ext) => absoluteFile.endsWith(ext));
+    if (!hasWatchedExtension) {
+        return false;
+    }
     for (const plugin of plugins) {
-        if (plugin.packageName.startsWith('~/')) {
-            const pluginPath = plugin.packageName.replace('~/', '');
-            if (normalizedFile.includes(pluginPath)) {
+        if ((0, utils_1.isLocalPlugin)(plugin.packageName)) {
+            const resolved = (0, resolver_1.resolvePluginPackage)(plugin);
+            const pluginAbsolutePath = path_1.default.isAbsolute(resolved.resolvedPath)
+                ? resolved.resolvedPath
+                : path_1.default.resolve(process.cwd(), resolved.resolvedPath);
+            const normalizedPluginPath = pluginAbsolutePath.endsWith(path_1.default.sep)
+                ? pluginAbsolutePath
+                : `${pluginAbsolutePath}${path_1.default.sep}`;
+            if (absoluteFile.startsWith(normalizedPluginPath) || absoluteFile === pluginAbsolutePath) {
                 return true;
             }
         }
     }
-    // Check if it's a plugin configuration file
-    if (normalizedFile.endsWith('motia.config.ts') || normalizedFile.endsWith('motia.config.js')) {
-        return true;
-    }
     return false;
 }
 /**
@@ -34,33 +54,63 @@ function shouldInvalidatePlugins(file, plugins) {
  *
  * @param ctx - Vite's HMR context
  * @param plugins - Current plugin configurations
+ * @param printer - Printer instance for logging
  * @returns Array of modules to update, or undefined to continue with default behavior
  */
-function handlePluginHotUpdate(ctx, plugins) {
-    const { file, server } = ctx;
-    console.log('[motia-plugins] HMR: File changed:', file);
+function handlePluginHotUpdate(ctx, plugins, printer) {
+    const { file, server, timestamp } = ctx;
+    printer.printPluginLog(`HMR: File changed: ${(0, utils_1.normalizePath)(file)}`);
     // Check if this change affects plugins
     if (!shouldInvalidatePlugins(file, plugins)) {
         return; // Let Vite handle it normally
     }
-    console.log('[motia-plugins] HMR: Plugin configuration or local plugin changed, invalidating virtual module');
+    if (isConfigFile(file)) {
+        printer.printPluginLog('HMR: Config file changed, triggering full page reload');
+        printer.printPluginWarn('Configuration changes require a server restart for full effect. Please restart the dev server to apply all changes.');
+        server.ws.send({
+            type: 'full-reload',
+            path: '*',
+        });
+        return;
+    }
+    printer.printPluginLog('HMR: Plugin change detected, invalidating virtual module');
     // Find the virtual module
     const virtualModule = server.moduleGraph.getModuleById(types_1.CONSTANTS.RESOLVED_VIRTUAL_MODULE_ID);
-    if (virtualModule) {
-        // Invalidate the virtual module to force regeneration
-        server.moduleGraph.invalidateModule(virtualModule);
-        console.log('[motia-plugins] HMR: Virtual module invalidated');
-    }
-    // Return modules to update (includes the virtual module and any dependent modules)
-    const modulesToUpdate = [];
-    if (virtualModule) {
-        modulesToUpdate.push(virtualModule);
-    }
-    // Add any modules that import the virtual module
-    const importers = virtualModule?.importers || new Set();
-    for (const importer of importers) {
-        modulesToUpdate.push(importer);
-        console.log('[motia-plugins] HMR: Invalidating importer:', importer.id);
+    if (!virtualModule) {
+        printer.printPluginWarn('HMR: Virtual module not found, triggering full reload');
+        server.ws.send({
+            type: 'full-reload',
+            path: '*',
+        });
+        return;
     }
+    server.moduleGraph.invalidateModule(virtualModule, new Set(), timestamp);
+    printer.printPluginLog('HMR: Virtual module invalidated');
+    const modulesToUpdate = [virtualModule];
+    const processedModules = new Set([virtualModule]);
+    // Recursively add all importers
+    const addImporters = (module) => {
+        for (const importer of module.importers) {
+            if (!processedModules.has(importer)) {
+                processedModules.add(importer);
+                modulesToUpdate.push(importer);
+                server.moduleGraph.invalidateModule(importer, new Set(), timestamp);
+                addImporters(importer);
+            }
+        }
+    };
+    addImporters(virtualModule);
+    server.ws.send({
+        type: 'update',
+        updates: modulesToUpdate
+            .filter((m) => m.url)
+            .map((m) => ({
+            type: m.type === 'css' ? 'css-update' : 'js-update',
+            path: m.url,
+            acceptedPath: m.url,
+            timestamp,
+        })),
+    });
+    printer.printPluginLog(`HMR: Updated ${modulesToUpdate.length} module(s)`);
     return modulesToUpdate;
 }

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

@@ -1,27 +1,3 @@
 import type { Plugin } from 'vite';
 import type { WorkbenchPlugin } from './types';
-/**
- * Vite plugin for loading and managing Motia workbench plugins.
- *
- * Features:
- * - Hot Module Replacement (HMR) support
- * - Runtime validation with detailed error messages
- * - Verbose logging for debugging
- * - CSS injection for plugin styles
- *
- * @param plugins - Array of plugin configurations
- * @param options - Optional loader configuration
- * @returns Vite plugin instance
- *
- * @example
- * ```ts
- * export default defineConfig({
- *   plugins: [
- *     motiaPluginsPlugin([
- *       { packageName: '@my-org/plugin', label: 'My Plugin' }
- *     ])
- *   ]
- * })
- * ```
- */
 export default function motiaPluginsPlugin(plugins: WorkbenchPlugin[]): Plugin;

package/dist/motia-plugin/index.js

@@ -1,6 +1,11 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = motiaPluginsPlugin;
+const core_1 = require("@motiadev/core");
+const path_1 = __importDefault(require("path"));
 const generator_1 = require("./generator");
 const hmr_1 = require("./hmr");
 const resolver_1 = require("./resolver");
@@ -31,6 +36,7 @@ const validator_1 = require("./validator");
  * })
  * ```
  */
+const printer = new core_1.Printer(process.cwd());
 function motiaPluginsPlugin(plugins) {
     let devServer = null;
     try {
@@ -38,25 +44,29 @@ function motiaPluginsPlugin(plugins) {
             failFast: false,
         });
         if (!validationResult.valid) {
-            console.error('[motia-plugins] Plugin configuration validation failed:');
-            validationResult.errors.forEach((err) => console.error(`[motia-plugins]   ${err}`));
+            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) {
-            validationResult.warnings.forEach((warning) => console.warn('[motia-plugins]', warning));
+            for (const warning of validationResult.warnings) {
+                printer.printPluginWarn(warning);
+            }
         }
     }
     catch (error) {
-        console.error('[motia-plugins] Failed to validate plugins:', error);
+        printer.printPluginError(`Failed to validate plugins: ${error}`);
         throw error;
     }
     const alias = (0, resolver_1.createAliasConfig)(plugins);
-    console.log(`[motia-plugins] Initialized with ${plugins.length} plugin(s)`);
+    printer.printPluginLog(`Initialized with ${plugins.length} plugin(s)`);
     return {
         name: 'vite-plugin-motia-plugins',
         enforce: 'pre',
         buildStart() {
-            console.log('[motia-plugins] Build started');
+            printer.printPluginLog('Build started');
         },
         config: () => ({
             resolve: {
@@ -65,7 +75,30 @@ function motiaPluginsPlugin(plugins) {
         }),
         configureServer(server) {
             devServer = server;
-            console.log('[motia-plugins] Dev server configured, HMR enabled');
+            printer.printPluginLog('Dev server configured, HMR enabled');
+            const configPaths = [path_1.default.join(process.cwd(), 'motia.config.ts'), path_1.default.join(process.cwd(), 'motia.config.js')];
+            for (const configPath of configPaths) {
+                server.watcher.add(configPath);
+            }
+            printer.printPluginLog('Watching for config file changes');
+            const localPlugins = plugins.filter((p) => (0, utils_1.isLocalPlugin)(p.packageName));
+            if (localPlugins.length > 0) {
+                printer.printPluginLog(`Watching ${localPlugins.length} local plugin(s)`);
+                for (const plugin of localPlugins) {
+                    const resolved = (0, resolver_1.resolvePluginPackage)(plugin);
+                    const watchPath = resolved.resolvedPath;
+                    server.watcher.add(watchPath);
+                    printer.printPluginLog(`Watching: ${watchPath}`);
+                }
+                server.watcher.on('change', (file) => {
+                    const normalizedFile = (0, utils_1.normalizePath)(file);
+                    printer.printPluginLog(`File watcher detected change: ${normalizedFile}`);
+                });
+                server.watcher.on('add', (file) => {
+                    const normalizedFile = (0, utils_1.normalizePath)(file);
+                    printer.printPluginLog(`File watcher detected new file: ${normalizedFile}`);
+                });
+            }
         },
         resolveId(id) {
             if (id === types_1.CONSTANTS.VIRTUAL_MODULE_ID) {
@@ -76,14 +109,14 @@ function motiaPluginsPlugin(plugins) {
             if (id !== types_1.CONSTANTS.RESOLVED_VIRTUAL_MODULE_ID) {
                 return null;
             }
-            console.log('[motia-plugins] Loading plugins virtual module');
-            console.log('[motia-plugins] Generating plugin code...');
+            printer.printPluginLog('Loading plugins virtual module');
+            printer.printPluginLog('Generating plugin code...');
             const code = (0, generator_1.generatePluginCode)(plugins);
             if (!(0, generator_1.isValidCode)(code)) {
-                console.error('[motia-plugins] Generated code is invalid or empty');
+                printer.printPluginError('Generated code is invalid or empty');
                 return 'export const plugins = []';
             }
-            console.log('[motia-plugins] Plugin code generated successfully');
+            printer.printPluginLog('Plugin code generated successfully');
             return code;
         },
         async transform(code, id) {
@@ -91,7 +124,7 @@ function motiaPluginsPlugin(plugins) {
             if (!normalizedId.endsWith('src/index.css')) {
                 return null;
             }
-            console.log('[motia-plugins] Injecting plugin CSS imports');
+            printer.printPluginLog('Injecting plugin CSS imports');
             const cssImports = (0, generator_1.generateCssImports)(plugins);
             if (!cssImports) {
                 return null;
@@ -103,16 +136,17 @@ function motiaPluginsPlugin(plugins) {
         },
         handleHotUpdate(ctx) {
             if (!devServer) {
+                printer.printPluginWarn('HMR: Dev server not available');
                 return;
             }
-            const modulesToUpdate = (0, hmr_1.handlePluginHotUpdate)(ctx, plugins);
-            if (modulesToUpdate) {
-                console.log('[motia-plugins] Hot reloaded plugins');
+            const modulesToUpdate = (0, hmr_1.handlePluginHotUpdate)(ctx, plugins, printer);
+            if (modulesToUpdate && modulesToUpdate.length > 0) {
+                printer.printPluginLog(`HMR: Successfully updated ${modulesToUpdate.length} module(s)`);
                 return modulesToUpdate;
             }
         },
         buildEnd() {
-            console.log('[motia-plugins] Build ended');
+            printer.printPluginLog('Build ended');
         },
     };
 }

package/dist/src/App.js

@@ -1,31 +1,33 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo } from 'react';
+import { useEffect, useMemo } from 'react';
 import { FlowPage } from './components/flow/flow-page';
 import { FlowTabMenuItem } from './components/flow/flow-tab-menu-item';
 import { registerPluginTabs } from './lib/plugins';
 import { getViewModeFromURL } from './lib/utils';
 import { ProjectViewMode } from './project-view-mode';
-import { setAppTabs, TabLocation } from './stores/use-app-tabs-store';
+import { TabLocation, useAppTabsStore } from './stores/use-app-tabs-store';
 import { SystemViewMode } from './system-view-mode';
 const TAB_IDS = {
     FLOW: 'flow',
     LOGS: 'logs',
 };
-const registerDefaultTabs = () => {
-    const topTabs = [
-        {
-            id: TAB_IDS.FLOW,
-            tabLabel: FlowTabMenuItem,
-            content: FlowPage,
-        },
-    ];
-    const bottomTabs = [];
-    setAppTabs(TabLocation.TOP, topTabs);
-    setAppTabs(TabLocation.BOTTOM, bottomTabs);
-};
-registerDefaultTabs();
-registerPluginTabs();
+const topTabs = [
+    {
+        id: TAB_IDS.FLOW,
+        tabLabel: FlowTabMenuItem,
+        content: FlowPage,
+    },
+];
 export const App = () => {
+    const setTabs = useAppTabsStore((state) => state.setTabs);
+    const addTab = useAppTabsStore((state) => state.addTab);
+    useEffect(() => {
+        const timeout = setTimeout(() => {
+            setTabs(TabLocation.TOP, topTabs);
+            registerPluginTabs(addTab);
+        }, 10);
+        return () => clearTimeout(timeout);
+    }, [setTabs, addTab]);
     const viewMode = useMemo(getViewModeFromURL, []);
     const ViewComponent = viewMode === 'project' ? ProjectViewMode : SystemViewMode;
     return _jsx(ViewComponent, {});

package/dist/src/lib/plugins.d.ts

@@ -1 +1,2 @@
-export declare const registerPluginTabs: () => void;
+import { type AppTab, TabLocation } from '@/stores/use-app-tabs-store';
+export declare const registerPluginTabs: (addTab: (position: TabLocation, tab: AppTab) => void) => void;

package/dist/src/lib/plugins.js

@@ -2,9 +2,9 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import { plugins } from 'virtual:motia-plugins';
 import { DynamicIcon, dynamicIconImports } from 'lucide-react/dynamic';
 import { memo } from 'react';
-import { addAppTab, TabLocation } from '@/stores/use-app-tabs-store';
+import { TabLocation } from '@/stores/use-app-tabs-store';
 import { isValidTabLocation } from './utils';
-export const registerPluginTabs = () => {
+export const registerPluginTabs = (addTab) => {
     if (!Array.isArray(plugins)) {
         console.warn('[Motia] Invalid plugins configuration: expected array');
         return;
@@ -42,7 +42,7 @@ export const registerPluginTabs = () => {
                 return _jsx(Component, { ...props });
             });
             PluginContent.displayName = `${plugin.label}Content`;
-            addAppTab(tabLocation, {
+            addTab(tabLocation, {
                 id: plugin.label.toLowerCase(),
                 tabLabel: PluginTabLabel,
                 content: PluginContent,

package/dist/src/stores/use-app-tabs-store.d.ts

@@ -14,5 +14,3 @@ export interface AppTabsState {
     removeTab: (position: TabLocation, id: string) => void;
 }
 export declare const useAppTabsStore: import("zustand").UseBoundStore<import("zustand").StoreApi<AppTabsState>>;
-export declare const setAppTabs: (position: TabLocation, tabs: AppTab[]) => void;
-export declare const addAppTab: (position: TabLocation, tab: AppTab) => void;

package/dist/src/stores/use-app-tabs-store.js

@@ -29,9 +29,3 @@ export const useAppTabsStore = create((set) => ({
         },
     })),
 }));
-export const setAppTabs = (position, tabs) => {
-    useAppTabsStore.getState().setTabs(position, tabs);
-};
-export const addAppTab = (position, tab) => {
-    useAppTabsStore.getState().addTab(position, tab);
-};