@motiadev/workbench 0.14.0-beta.165-285707 → 0.15.0-beta.165

package/dist/middleware.js

@@ -1,98 +1,706 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+import { Printer } from "@motiadev/core";
+import react from "@vitejs/plugin-react";
+import fs, { existsSync } from "fs";
+import path from "path";
+import { fileURLToPath } from "url";
+import { createServer } from "vite";
+import { z } from "zod";
+
+//#region motia-plugin/utils.ts
+/**
+* Normalizes a file path by replacing backslashes with forward slashes.
+* This is useful for consistent path comparisons across different operating systems.
+*
+* @param filePath - The file path to normalize
+* @returns The normalized file path with forward slashes
+*
+* @example
+* ```ts
+* normalizePath('C:\\Users\\file.ts') // Returns: 'C:/Users/file.ts'
+* normalizePath('/Users/file.ts')     // Returns: '/Users/file.ts'
+* ```
+*/
+function normalizePath(filePath) {
+	return filePath.replace(/\\/g, "/");
+}
+/**
+* Checks if a package name represents a local plugin (starts with ~/).
+*
+* @param packageName - The package name to check
+* @returns True if the package is a local plugin
+*
+* @example
+* ```ts
+* isLocalPlugin('~/plugins/my-plugin')     // Returns: true
+* isLocalPlugin('@my-org/my-plugin')       // Returns: false
+* isLocalPlugin('my-plugin')               // Returns: false
+* ```
+*/
+function isLocalPlugin(packageName) {
+	return packageName.startsWith("~/");
+}
+/**
+* Resolves a local plugin path to an absolute path.
+* Strips the ~/ prefix and joins with the current working directory.
+*
+* @param packageName - The local plugin package name (must start with ~/)
+* @returns The absolute path to the local plugin
+*
+* @example
+* ```ts
+* // If cwd is /Users/project
+* resolveLocalPath('~/plugins/my-plugin')
+* // Returns: '/Users/project/plugins/my-plugin'
+* ```
+*/
+function resolveLocalPath(packageName) {
+	return path.join(process.cwd(), packageName.replace("~/", ""));
+}
+/**
+* Resolves an npm package path to the node_modules directory.
+*
+* @param packageName - The npm package name
+* @returns The absolute path to the package in node_modules
+*
+* @example
+* ```ts
+* // If cwd is /Users/project
+* resolveNpmPath('@my-org/my-plugin')
+* // Returns: '/Users/project/node_modules/@my-org/my-plugin'
+* ```
+*/
+function resolveNpmPath(packageName) {
+	return path.join(process.cwd(), "node_modules", packageName);
+}
+
+//#endregion
+//#region motia-plugin/resolver.ts
+/**
+* Resolves a plugin package to its absolute path and creates an alias.
+*
+* @param plugin - The plugin configuration to resolve
+* @returns Resolved package information including path and alias
+*
+* @example
+* ```ts
+* // Local plugin
+* resolvePluginPackage({ packageName: '~/plugins/my-plugin' })
+* // Returns: {
+* //   packageName: '~/plugins/my-plugin',
+* //   resolvedPath: '/Users/project/plugins/my-plugin',
+* //   isLocal: true,
+* //   alias: '~/plugins/my-plugin'
+* // }
+*
+* // NPM package
+* resolvePluginPackage({ packageName: '@org/plugin' })
+* // Returns: {
+* //   packageName: '@org/plugin',
+* //   resolvedPath: '/Users/project/node_modules/@org/plugin',
+* //   isLocal: false,
+* //   alias: '@org/plugin'
+* // }
+* ```
+*/
+function resolvePluginPackage(plugin) {
+	const { packageName } = plugin;
+	const local = isLocalPlugin(packageName);
+	return {
+		packageName,
+		resolvedPath: normalizePath(local ? resolveLocalPath(packageName) : resolveNpmPath(packageName)),
+		isLocal: local,
+		alias: packageName
+	};
+}
+/**
+* Resolves all plugin packages and creates a Vite alias configuration.
+*
+* @param plugins - Array of plugin configurations
+* @returns Vite alias configuration object
+*
+* @example
+* ```ts
+* const plugins = [
+*   { packageName: '~/plugins/local' },
+*   { packageName: '@org/npm-plugin' }
+* ]
+* const aliases = createAliasConfig(plugins)
+* // Returns: {
+* //   '~/plugins/local': '/Users/project/plugins/local',
+* //   '@org/npm-plugin': '/Users/project/node_modules/@org/npm-plugin'
+* // }
+* ```
+*/
+function createAliasConfig(plugins) {
+	const uniquePackages = Array.from(new Set(plugins.map((p) => p.packageName)));
+	const aliases = {};
+	for (const packageName of uniquePackages) aliases[packageName] = resolvePluginPackage({ packageName }).resolvedPath;
+	return aliases;
+}
+/**
+* Gets the unique set of package names from plugins.
+*
+* @param plugins - Array of plugin configurations
+* @returns Array of unique package names
+*/
+function getUniquePackageNames(plugins) {
+	return Array.from(new Set(plugins.map((p) => p.packageName)));
+}
+
+//#endregion
+//#region motia-plugin/generator.ts
+/**
+* Generates import statements for all unique plugin packages.
+*
+* @param packages - Array of unique package names
+* @returns JavaScript code string with import statements
+*
+* @example
+* ```ts
+* generateImports(['@org/plugin-1', '~/plugins/local'])
+* // Returns:
+* // import * as plugin_0 from '@org/plugin-1'
+* // import * as plugin_1 from '~/plugins/local'
+* ```
+*/
+function generateImports(packages) {
+	return packages.map((packageName, index) => `import * as plugin_${index} from '${packageName}'`).join("\n");
+}
+/**
+* Generates the package map that links package names to their imported modules.
+*
+* @param packages - Array of unique package names
+* @returns JavaScript code string defining the package map
+*
+* @example
+* ```ts
+* generatePackageMap(['@org/plugin-1', '~/plugins/local'])
+* // Returns: const packageMap = {'@org/plugin-1': plugin_0,'~/plugins/local': plugin_1}
+* ```
+*/
+function generatePackageMap(packages) {
+	return `const packageMap = {${packages.map((packageName, index) => `'${packageName}': plugin_${index}`).join(",")}}`;
+}
+/**
+* Generates the plugin transformation logic that processes plugin configurations.
+*
+* @param plugins - Array of plugin configurations
+* @returns JavaScript code string with plugin processing logic
+*/
+function generatePluginLogic(plugins) {
+	return `
+      const motiaPlugins = ${JSON.stringify(plugins)}
+
+      export 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: plugin.labelIcon || config.labelIcon || 'toy-brick',
+          position: plugin.position || config.position || 'top',
+          props: plugin.props || config.props || {},
+          component: componentName ? component[componentName] : component.default,
+        }
+      })
+`;
+}
+/**
+* Generates the complete virtual module code for all plugins.
+* This is the main code generation function that combines all parts.
+*
+* @param plugins - Array of plugin configurations
+* @returns Complete JavaScript code string for the virtual module
+*
+* @example
+* ```ts
+* const plugins = [
+*   { packageName: '@test/plugin', label: 'Test' }
+* ]
+* const code = generatePluginCode(plugins)
+* // Returns complete module code with imports, map, and logic
+* ```
+*/
+function generatePluginCode(plugins) {
+	if (!plugins || plugins.length === 0) return "export const plugins = []";
+	const packages = getUniquePackageNames(plugins);
+	return `${generateImports(packages)}
+${generatePackageMap(packages)}
+${generatePluginLogic(plugins)}`;
+}
+/**
+* Generates CSS imports for plugins that specify cssImports.
+*
+* @param plugins - Array of plugin configurations
+* @returns CSS import statements as a string
+*
+* @example
+* ```ts
+* const plugins = [
+*   { packageName: '@test/plugin', cssImports: ['styles.css', 'theme.css'] }
+* ]
+* generateCssImports(plugins)
+* // Returns:
+* // @import 'styles.css';
+* // @import 'theme.css';
+* ```
+*/
+function generateCssImports(plugins) {
+	return plugins.flatMap((plugin) => plugin.cssImports || []).filter((cssImport) => cssImport && cssImport.trim() !== "").map((cssImport) => `@import '${cssImport}';`).join("\n");
+}
+/**
+* Checks if the generated code is valid (non-empty and has content).
+*
+* @param code - The generated code to check
+* @returns True if code is valid
+*/
+function isValidCode(code) {
+	return typeof code === "string" && code.trim().length > 0;
+}
+
+//#endregion
+//#region motia-plugin/types.ts
+/**
+* Type guard to check if position is valid.
+*/
+function isValidPosition(position) {
+	return position === "top" || position === "bottom";
+}
+/**
+* Constants used throughout the plugin system.
+*/
+const CONSTANTS = {
+	VIRTUAL_MODULE_ID: "virtual:motia-plugins",
+	RESOLVED_VIRTUAL_MODULE_ID: "\0virtual:motia-plugins",
+	LOG_PREFIX: "[motia-plugins]",
+	DEFAULTS: {
+		POSITION: "top",
+		LABEL: "Plugin label",
+		ICON: "toy-brick",
+		PROPS: {}
+	}
 };
-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"));
+
+//#endregion
+//#region motia-plugin/hmr.ts
+const WATCHED_EXTENSIONS = [
+	".ts",
+	".tsx",
+	".js",
+	".jsx",
+	".css",
+	".scss",
+	".less"
+];
+function isConfigFile(file) {
+	const normalizedFile = normalizePath(file);
+	return normalizedFile.endsWith("motia.config.ts") || normalizedFile.endsWith("motia.config.js");
+}
+/**
+* Checks if a file change should trigger HMR for plugins.
+*
+* @param file - The file path that changed
+* @param plugins - Current plugin configurations
+* @returns True if the change affects plugins
+*/
+function shouldInvalidatePlugins(file, plugins) {
+	const normalizedFile = normalizePath(file);
+	const absoluteFile = path.isAbsolute(normalizedFile) ? normalizedFile : path.resolve(process.cwd(), normalizedFile);
+	if (isConfigFile(file)) return true;
+	if (!WATCHED_EXTENSIONS.some((ext) => absoluteFile.endsWith(ext))) return false;
+	for (const plugin of plugins) if (isLocalPlugin(plugin.packageName)) {
+		const resolved = resolvePluginPackage(plugin);
+		const pluginAbsolutePath = path.isAbsolute(resolved.resolvedPath) ? resolved.resolvedPath : path.resolve(process.cwd(), resolved.resolvedPath);
+		const normalizedPluginPath = pluginAbsolutePath.endsWith(path.sep) ? pluginAbsolutePath : `${pluginAbsolutePath}${path.sep}`;
+		if (absoluteFile.startsWith(normalizedPluginPath) || absoluteFile === pluginAbsolutePath) return true;
+	}
+	return false;
+}
+/**
+* Handles hot updates for the plugin system.
+* This function is called by Vite's handleHotUpdate hook.
+*
+* @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, printer$2) {
+	const { file, server, timestamp } = ctx;
+	printer$2.printPluginLog(`HMR: File changed: ${normalizePath(file)}`);
+	if (isConfigFile(file)) {
+		printer$2.printPluginLog("HMR: Config file changed, triggering full page reload");
+		printer$2.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;
+	}
+	if (!shouldInvalidatePlugins(file, plugins)) {
+		printer$2.printPluginLog("HMR: Change outside plugin scope, delegating to Vite default handling");
+		return;
+	}
+	printer$2.printPluginLog("HMR: Plugin change detected, invalidating virtual module");
+	const virtualModule = server.moduleGraph.getModuleById(CONSTANTS.RESOLVED_VIRTUAL_MODULE_ID);
+	if (!virtualModule) {
+		printer$2.printPluginWarn("HMR: Virtual module not found, triggering full reload as fallback");
+		server.ws.send({
+			type: "full-reload",
+			path: "*"
+		});
+		return;
+	}
+	server.moduleGraph.invalidateModule(virtualModule, /* @__PURE__ */ new Set(), timestamp);
+	printer$2.printPluginLog("HMR: Virtual module invalidated");
+	const modulesToUpdateSet = new Set([virtualModule]);
+	const processedModules = new Set([virtualModule]);
+	for (const importer of virtualModule.importers) if (!processedModules.has(importer)) {
+		processedModules.add(importer);
+		modulesToUpdateSet.add(importer);
+		server.moduleGraph.invalidateModule(importer, /* @__PURE__ */ new Set(), timestamp);
+	}
+	const modulesToUpdate = Array.from(modulesToUpdateSet);
+	printer$2.printPluginLog(`HMR: Updated ${modulesToUpdate.length} module(s)`);
+	return modulesToUpdate;
+}
+
+//#endregion
+//#region motia-plugin/validator.ts
+/**
+* Zod schema for WorkbenchPlugin configuration.
+* Provides runtime type validation with detailed error messages.
+*/
+const WorkbenchPluginSchema = z.object({
+	packageName: z.string().min(1, "packageName is required and cannot be empty").refine((name) => name.startsWith("~/") || name.startsWith("@") || /^[a-z0-9-_]+$/i.test(name), { message: "packageName must be a valid npm package name or local path (starting with ~/)" }),
+	componentName: z.string().optional(),
+	position: z.enum(["top", "bottom"]).optional().refine((pos) => pos === void 0 || isValidPosition(pos), { message: "position must be either \"top\" or \"bottom\"" }),
+	label: z.string().optional(),
+	labelIcon: z.string().optional(),
+	cssImports: z.array(z.string()).optional(),
+	props: z.record(z.any(), z.any()).optional()
+});
+/**
+* Validates a single plugin configuration.
+*
+* @param plugin - The plugin configuration to validate
+* @param index - The index of the plugin in the array (for error messages)
+* @returns A validation result with errors, warnings, and normalized plugin
+*/
+function validatePluginConfig(plugin, index) {
+	const errors = [];
+	const warnings = [];
+	if (typeof plugin !== "object" || plugin === null) return {
+		valid: false,
+		errors: [`Plugin at index ${index}: expected object, got ${typeof plugin}`],
+		warnings: []
+	};
+	try {
+		const result = WorkbenchPluginSchema.safeParse(plugin);
+		if (!result.success) {
+			result.error.issues.forEach((err) => {
+				const path$1 = err.path.join(".");
+				errors.push(`Plugin at index ${index}, field "${path$1}": ${err.message}`);
+			});
+			return {
+				valid: false,
+				errors,
+				warnings
+			};
+		}
+		const validatedPlugin = result.data;
+		if (isLocalPlugin(validatedPlugin.packageName)) {
+			const resolvedPath = resolveLocalPath(validatedPlugin.packageName);
+			if (!existsSync(resolvedPath)) warnings.push(`Plugin at index ${index}: local path "${validatedPlugin.packageName}" does not exist at "${resolvedPath}". Make sure the path is correct relative to the project root.`);
+		}
+		if (!validatedPlugin.label) warnings.push(`Plugin at index ${index}: "label" not specified, will use default "${CONSTANTS.DEFAULTS.LABEL}"`);
+		if (!validatedPlugin.labelIcon) warnings.push(`Plugin at index ${index}: "labelIcon" not specified, will use default "${CONSTANTS.DEFAULTS.ICON}"`);
+		if (!validatedPlugin.position) warnings.push(`Plugin at index ${index}: "position" not specified, will use default "${CONSTANTS.DEFAULTS.POSITION}"`);
+		if (validatedPlugin.props && Object.keys(validatedPlugin.props).length === 0) warnings.push(`Plugin at index ${index}: "props" is an empty object`);
+		if (validatedPlugin.cssImports) {
+			if (validatedPlugin.cssImports.length === 0) warnings.push(`Plugin at index ${index}: "cssImports" is an empty array`);
+			validatedPlugin.cssImports.forEach((cssImport, cssIndex) => {
+				if (!cssImport || cssImport.trim() === "") warnings.push(`Plugin at index ${index}: cssImport at index ${cssIndex} is empty or whitespace`);
+			});
+		}
+		return {
+			valid: true,
+			errors: [],
+			warnings,
+			plugin: validatedPlugin
+		};
+	} catch (error) {
+		return {
+			valid: false,
+			errors: [`Plugin at index ${index}: unexpected validation error: ${error}`],
+			warnings: []
+		};
+	}
+}
+/**
+* Validates an array of plugin configurations.
+*
+* @param plugins - Array of plugin configurations to validate
+* @param options - Validation options
+* @returns Combined validation result for all plugins
+*/
+function validatePlugins(plugins, options = {}) {
+	const allErrors = [];
+	const allWarnings = [];
+	const validatedPlugins = [];
+	if (!Array.isArray(plugins)) return {
+		valid: false,
+		errors: [`Expected plugins to be an array, got ${typeof plugins}`],
+		warnings: []
+	};
+	if (plugins.length === 0) {
+		console.warn("[motia-plugins] No plugins provided to validate");
+		return {
+			valid: true,
+			errors: [],
+			warnings: ["No plugins configured"]
+		};
+	}
+	for (let i = 0; i < plugins.length; i++) {
+		const result = validatePluginConfig(plugins[i], i);
+		allErrors.push(...result.errors);
+		allWarnings.push(...result.warnings);
+		if (result.valid && result.plugin) validatedPlugins.push(result.plugin);
+		if (options.failFast && result.errors.length > 0) break;
+	}
+	const packageNames = validatedPlugins.map((p) => p.packageName);
+	const duplicates = packageNames.filter((name, index) => packageNames.indexOf(name) !== index);
+	if (duplicates.length > 0) [...new Set(duplicates)].forEach((dup) => {
+		allWarnings.push(`Duplicate package name found: "${dup}". This may cause conflicts.`);
+	});
+	const valid = allErrors.length === 0;
+	if (valid) {
+		console.log(`[motia-plugins] ✓ Validated ${validatedPlugins.length} plugin(s) successfully`);
+		if (allWarnings.length > 0) console.warn(`[motia-plugins] Found ${allWarnings.length} warning(s)`);
+	} else console.error(`[motia-plugins] ✗ Validation failed with ${allErrors.length} error(s)`);
+	return {
+		valid,
+		errors: allErrors,
+		warnings: allWarnings
+	};
+}
+
+//#endregion
+//#region motia-plugin/index.ts
+/**
+* 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' }
+*     ])
+*   ]
+* })
+* ```
+*/
+const printer$1 = new Printer(process.cwd());
+function motiaPluginsPlugin(plugins) {
+	let devServer = null;
+	try {
+		const validationResult = validatePlugins(plugins, { failFast: false });
+		if (!validationResult.valid) {
+			printer$1.printPluginError("Plugin configuration validation failed:");
+			for (const err of validationResult.errors) printer$1.printPluginError(`  ${err}`);
+			throw new Error("Invalid plugin configuration. See errors above.");
+		}
+		if (validationResult.warnings.length > 0) for (const warning of validationResult.warnings) printer$1.printPluginWarn(warning);
+	} catch (error) {
+		printer$1.printPluginError(`Failed to validate plugins: ${error}`);
+		throw error;
+	}
+	const alias = createAliasConfig(plugins);
+	printer$1.printPluginLog(`Initialized with ${plugins.length} plugin(s)`);
+	return {
+		name: "vite-plugin-motia-plugins",
+		enforce: "pre",
+		buildStart() {
+			printer$1.printPluginLog("Build started");
+		},
+		config: () => ({ resolve: { alias } }),
+		configureServer(server) {
+			devServer = server;
+			printer$1.printPluginLog("Dev server configured, HMR enabled");
+			const configPaths = [path.join(process.cwd(), "motia.config.ts"), path.join(process.cwd(), "motia.config.js")];
+			for (const configPath of configPaths) server.watcher.add(configPath);
+			printer$1.printPluginLog("Watching for config file changes");
+			const localPlugins = plugins.filter((p) => isLocalPlugin(p.packageName));
+			if (localPlugins.length > 0) {
+				printer$1.printPluginLog(`Watching ${localPlugins.length} local plugin(s)`);
+				for (const plugin of localPlugins) {
+					const watchPath = resolvePluginPackage(plugin).resolvedPath;
+					server.watcher.add(watchPath);
+					printer$1.printPluginLog(`Watching: ${watchPath}`);
+				}
+				server.watcher.on("change", (file) => {
+					const normalizedFile = normalizePath(file);
+					printer$1.printPluginLog(`File watcher detected change: ${normalizedFile}`);
+				});
+				server.watcher.on("add", (file) => {
+					const normalizedFile = normalizePath(file);
+					printer$1.printPluginLog(`File watcher detected new file: ${normalizedFile}`);
+				});
+			}
+		},
+		resolveId(id) {
+			if (id === CONSTANTS.VIRTUAL_MODULE_ID) return CONSTANTS.RESOLVED_VIRTUAL_MODULE_ID;
+		},
+		load(id) {
+			if (id !== CONSTANTS.RESOLVED_VIRTUAL_MODULE_ID) return null;
+			printer$1.printPluginLog("Loading plugins virtual module");
+			printer$1.printPluginLog("Generating plugin code...");
+			const code = generatePluginCode(plugins);
+			if (!isValidCode(code)) {
+				printer$1.printPluginError("Generated code is invalid or empty");
+				return "export const plugins = []";
+			}
+			printer$1.printPluginLog("Plugin code generated successfully");
+			return code;
+		},
+		async transform(code, id) {
+			if (!normalizePath(id).endsWith("src/index.css")) return null;
+			printer$1.printPluginLog("Injecting plugin CSS imports");
+			const cssImports = generateCssImports(plugins);
+			if (!cssImports) return null;
+			return {
+				code: `${cssImports}\n${code}`,
+				map: null
+			};
+		},
+		handleHotUpdate(ctx) {
+			if (!devServer) {
+				printer$1.printPluginWarn("HMR: Dev server not available");
+				return;
+			}
+			const modulesToUpdate = handlePluginHotUpdate(ctx, plugins, printer$1);
+			if (modulesToUpdate && modulesToUpdate.length > 0) {
+				const merged = Array.from(new Set([...ctx.modules || [], ...modulesToUpdate]));
+				printer$1.printPluginLog(`HMR: Successfully updated ${merged.length} module(s)`);
+				return merged;
+			}
+		},
+		buildEnd() {
+			printer$1.printPluginLog("Build ended");
+		}
+	};
+}
+
+//#endregion
+//#region middleware.ts
 const workbenchBasePlugin = (workbenchBase) => {
-    return {
-        name: 'html-transform',
-        transformIndexHtml: (html) => {
-            return html.replace('</head>', `<script>const workbenchBase = ${JSON.stringify(workbenchBase)};</script></head>`);
-        },
-    };
+	return {
+		name: "html-transform",
+		transformIndexHtml: (html) => {
+			return html.replace("</head>", `<script>const workbenchBase = ${JSON.stringify(workbenchBase)};<\/script></head>`);
+		}
+	};
 };
 const processCwdPlugin = () => {
-    return {
-        name: 'html-transform',
-        transformIndexHtml: (html) => {
-            // Normalize path for cross-platform compatibility
-            const cwd = process.cwd().replace(/\\/g, '/');
-            return html.replace('</head>', `<script>const processCwd = "${cwd}";</script></head>`);
-        },
-    };
+	return {
+		name: "html-transform",
+		transformIndexHtml: (html) => {
+			const cwd = process.cwd().replace(/\\/g, "/");
+			return html.replace("</head>", `<script>const processCwd = "${cwd}";<\/script></head>`);
+		}
+	};
 };
 const reoPlugin = () => {
-    return {
-        name: 'html-transform',
-        transformIndexHtml(html) {
-            const isAnalyticsEnabled = process.env.MOTIA_ANALYTICS_DISABLED !== 'true';
-            if (!isAnalyticsEnabled) {
-                return html;
-            }
-            // inject before </head>
-            return html.replace('</head>', `
+	return {
+		name: "html-transform",
+		transformIndexHtml(html) {
+			if (!(process.env.MOTIA_ANALYTICS_DISABLED !== "true")) return html;
+			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>
+        <\/script>
     </head>`);
-        },
-    };
+		}
+	};
+};
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+const warmupMotiaPlugins = async (viteServer) => {
+	try {
+		if ((await viteServer.transformRequest(CONSTANTS.VIRTUAL_MODULE_ID))?.code) printer.printPluginLog("Plugin system warmed up eagerly");
+		else printer.printPluginWarn("Plugin warm-up returned empty result");
+	} catch (error) {
+		printer.printPluginWarn(`Failed to warm up plugin system, continuing lazily: ${error}`);
+	}
 };
+const printer = new Printer(process.cwd());
 const applyMiddleware = async ({ app, port, workbenchBase, plugins }) => {
-    const vite = await (0, vite_1.createServer)({
-        appType: 'spa',
-        root: __dirname,
-        base: workbenchBase,
-        server: {
-            middlewareMode: true,
-            allowedHosts: true,
-            host: true,
-            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
-                ],
-            },
-        },
-        resolve: {
-            alias: {
-                '@': path_1.default.resolve(__dirname, './src'),
-                '@/assets': path_1.default.resolve(__dirname, './src/assets'),
-                'lucide-react/dynamic': 'lucide-react/dynamic.mjs',
-                'lucide-react': 'lucide-react/dist/cjs/lucide-react.js',
-            },
-        },
-        plugins: [
-            (0, plugin_react_1.default)(),
-            processCwdPlugin(),
-            reoPlugin(),
-            (0, motia_plugin_1.default)(plugins),
-            workbenchBasePlugin(workbenchBase),
-        ],
-        assetsInclude: ['**/*.png', '**/*.jpg', '**/*.jpeg', '**/*.gif', '**/*.svg', '**/*.ico', '**/*.webp', '**/*.avif'],
-    });
-    app.use(workbenchBase, vite.middlewares);
-    app.use(`${workbenchBase}/*`, async (req, res, next) => {
-        const url = req.originalUrl;
-        try {
-            const index = fs_1.default.readFileSync(path_1.default.resolve(__dirname, 'index.html'), 'utf-8');
-            const html = await vite.transformIndexHtml(url, index);
-            res.status(200).set({ 'Content-Type': 'text/html' }).end(html);
-        }
-        catch (e) {
-            next(e);
-        }
-    });
+	const vite = await createServer({
+		appType: "spa",
+		root: __dirname,
+		base: workbenchBase,
+		server: {
+			middlewareMode: true,
+			allowedHosts: true,
+			host: true,
+			hmr: { port: 21678 + port },
+			fs: { allow: [
+				__dirname,
+				path.join(process.cwd(), "./steps"),
+				path.join(process.cwd(), "./src"),
+				path.join(process.cwd(), "./tutorial"),
+				path.join(process.cwd(), "./node_modules"),
+				path.join(__dirname, "./node_modules")
+			] }
+		},
+		resolve: { alias: {
+			"@": path.resolve(__dirname, "./src"),
+			"@/assets": path.resolve(__dirname, "./src/assets"),
+			"lucide-react/dynamic": "lucide-react/dynamic.mjs",
+			"lucide-react": "lucide-react/dist/cjs/lucide-react.js"
+		} },
+		plugins: [
+			react({ babel: { plugins: ["babel-plugin-react-compiler"] } }),
+			processCwdPlugin(),
+			reoPlugin(),
+			motiaPluginsPlugin(plugins),
+			workbenchBasePlugin(workbenchBase)
+		],
+		assetsInclude: [
+			"**/*.png",
+			"**/*.jpg",
+			"**/*.jpeg",
+			"**/*.gif",
+			"**/*.svg",
+			"**/*.ico",
+			"**/*.webp",
+			"**/*.avif"
+		]
+	});
+	await warmupMotiaPlugins(vite);
+	app.use(workbenchBase, vite.middlewares);
+	app.use(`${workbenchBase}/*`, async (req, res, next) => {
+		const url = req.originalUrl;
+		try {
+			const index = fs.readFileSync(path.resolve(__dirname, "index.html"), "utf-8");
+			const html = await vite.transformIndexHtml(url, index);
+			res.status(200).set({ "Content-Type": "text/html" }).end(html);
+		} catch (e) {
+			next(e);
+		}
+	});
 };
-exports.applyMiddleware = applyMiddleware;
+
+//#endregion
+export { applyMiddleware };