@codemoreira/esad 1.2.7 → 1.3.0

package/package.json

@@ -1,44 +1,44 @@
-{
-  "name": "@codemoreira/esad",
-  "version": "1.2.7",
-  "description": "Easy Super App Development - Zero-Config CLI and DevTools for React Native Module Federation",
-  "main": "src/plugin/index.js",
-  "types": "./src/plugin/index.d.ts",
-  "exports": {
-    ".": {
-      "types": "./src/plugin/index.d.ts",
-      "default": "./src/plugin/index.js"
-    },
-    "./plugin": {
-      "types": "./src/plugin/index.d.ts",
-      "default": "./src/plugin/index.js"
-    },
-    "./client": {
-      "types": "./src/client/index.d.ts",
-      "default": "./src/client/index.js"
-    }
-  },
-  "bin": {
-    "esad": "./bin/esad.js"
-  },
-  "files": [
-    "bin",
-    "src",
-    "README.md"
-  ],
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
-  },
-  "dependencies": {
-    "adm-zip": "^0.5.10",
-    "chalk": "^4.1.2",
-    "commander": "^11.1.0",
-    "cross-spawn": "^7.0.3",
-    "fs-extra": "^11.2.0"
-  },
-  "devDependencies": {
-    "@rspack/core": "^1.7.9",
-    "@types/react": "^19.2.14",
-    "@types/react-native": "^0.72.8"
-  }
-}
+{
+  "name": "@codemoreira/esad",
+  "version": "1.3.0",
+  "description": "Easy Super App Development - Zero-Config CLI and DevTools for React Native Module Federation",
+  "main": "src/plugin/index.js",
+  "types": "./src/plugin/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./src/plugin/index.d.ts",
+      "default": "./src/plugin/index.js"
+    },
+    "./plugin": {
+      "types": "./src/plugin/index.d.ts",
+      "default": "./src/plugin/index.js"
+    },
+    "./client": {
+      "types": "./src/client/index.d.ts",
+      "default": "./src/client/index.js"
+    }
+  },
+  "bin": {
+    "esad": "./bin/esad.js"
+  },
+  "files": [
+    "bin",
+    "src",
+    "README.md"
+  ],
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "dependencies": {
+    "adm-zip": "^0.5.10",
+    "chalk": "^4.1.2",
+    "commander": "^11.1.0",
+    "cross-spawn": "^7.0.3",
+    "fs-extra": "^11.2.0"
+  },
+  "devDependencies": {
+    "@rspack/core": "^1.7.9",
+    "@types/react": "^19.2.14",
+    "@types/react-native": "^0.72.8"
+  }
+}

package/src/cli/commands/createModule.js

@@ -2,6 +2,8 @@ const fs = require('fs-extra');
 const path = require('path');
 const { runProcess } = require('../utils/process');
 const { getWorkspaceConfig } = require('../utils/config');
+const { cloneTemplate, renameProject } = require('../utils/scaffold');
+const templatesConfig = require('../templates/templates.json');
 
 module.exports = async (moduleName) => {
   const configObj = getWorkspaceConfig();
@@ -20,25 +22,14 @@ module.exports = async (moduleName) => {
   console.log(`\n📦 Creating federated mini-app: ${finalModuleName}...\n`);
   
   try {
-    await runProcess('npx', ['react-native@latest', 'init', finalModuleName], workspaceDir);
-    console.log(`\n📦 Installing ESAD dependencies...`);
-    // Note: Assuming local link or npm install depends on final workflow
-    await runProcess('npm', ['install', '@codemoreira/esad'], targetDir);
+    // 1. Clone Template instead of react-native init
+    await cloneTemplate(templatesConfig.module, targetDir);
+    
+    // 2. Rename Project
+    await renameProject(targetDir, finalModuleName);
 
-    const rspackContent = `import { withESAD } from '@codemoreira/esad/plugin';\n\nexport default withESAD({\n  type: 'module',\n  id: '${finalModuleName}'\n});\n`
-    fs.writeFileSync(path.join(targetDir, 'rspack.config.mjs'), rspackContent);
-    console.log(`✅ Injected withESAD wrapper into rspack.config.mjs`);
-
-    // Update package.json scripts
-    const modPkgPath = path.join(targetDir, 'package.json');
-    const modPkg = fs.readJsonSync(modPkgPath);
-    modPkg.scripts = {
-      ...modPkg.scripts,
-      "start": "esad dev",
-      "deploy": "esad deploy"
-    };
-    fs.writeJsonSync(modPkgPath, modPkg, { spaces: 2 });
-    console.log(`✅ Abstracted module scripts to use ESAD CLI.`);
+    console.log(`\n📦 Installing dependencies...`);
+    await runProcess('npm', ['install'], targetDir);
 
     console.log(`\n🎉 Module ${finalModuleName} is ready!`);
   } catch (err) {

package/src/cli/commands/dev.js

@@ -2,6 +2,7 @@ const { spawn } = require('cross-spawn');
 const { getWorkspaceConfig } = require('../utils/config');
 const fs = require('fs-extra');
 const path = require('path');
+const { prepareNative } = require('../utils/scaffold');
 
 module.exports = async (options) => {
   let cwd = process.cwd();
@@ -39,6 +40,9 @@ module.exports = async (options) => {
   // Determine if it's a Host or Module
   const isHost = pkg.name.endsWith('-host') || pkg.dependencies?.['@callstack/repack'];
   
+  // 1. Initial Checks & Automated Native Preparation
+  await prepareNative(cwd, 'all');
+
   if (isHost && !options.id) {
      console.log(`\n🚀 Starting Host App Dev Server (Re.Pack/Rspack)...\n`);
      await spawn('npx', ['react-native', 'webpack-start'], { cwd, stdio: 'inherit', shell: true });

package/src/cli/commands/host.js

@@ -5,6 +5,7 @@ const { spawn } = require('cross-spawn');
 const http = require('http');
 const readline = require('readline');
 const { getWorkspaceConfig } = require('../utils/config');
+const { prepareNative } = require('../utils/scaffold');
 
 const rl = readline.createInterface({
   input: process.stdin,
@@ -38,48 +39,9 @@ module.exports = async (subcommand) => {
 
   const pkg = fs.readJsonSync(pkgPath);
 
-  // 1. Initial Checks & Prebuild
+  // 1. Initial Checks & Automated Native Preparation
   if (subcommand === 'dev' || subcommand === 'start') {
-    if (!fs.existsSync(path.join(cwd, 'android')) && !fs.existsSync(path.join(cwd, 'ios'))) {
-      console.log(`📦 Native folders not found. Running expo prebuild...`);
-      await runProcess('npx', ['expo', 'prebuild'], cwd);
-    }
-
-    // 2. Patch Native Files
-    console.log(`🔧 Patching native files for Re.Pack compatibility...`);
-    const patchFiles = async () => {
-      // Android
-      const androidMainApp = path.join(cwd, 'android/app/src/main/java');
-      if (fs.existsSync(androidMainApp)) {
-        const files = await fs.readdir(androidMainApp, { recursive: true });
-        for (const file of files) {
-          if (file.endsWith('MainApplication.kt') || file.endsWith('MainApplication.java')) {
-            const filePath = path.join(androidMainApp, file);
-            let content = await fs.readFile(filePath, 'utf8');
-            if (content.includes('.expo/.virtual-metro-entry')) {
-              content = content.replace(/.expo\/.virtual-metro-entry/g, 'index');
-              await fs.writeFile(filePath, content);
-            }
-          }
-        }
-      }
-      // iOS
-      const iosDir = path.join(cwd, 'ios');
-      if (fs.existsSync(iosDir)) {
-        const iosFiles = await fs.readdir(iosDir, { recursive: true });
-        for (const file of iosFiles) {
-          if (file.match(/AppDelegate\.(m|mm|swift)/)) {
-            const filePath = path.join(iosDir, file);
-            let content = await fs.readFile(filePath, 'utf8');
-            if (content.includes('.expo/.virtual-metro-entry')) {
-              content = content.replace(/.expo\/.virtual-metro-entry/g, 'index');
-              await fs.writeFile(filePath, content);
-            }
-          }
-        }
-      }
-    };
-    await patchFiles();
+    await prepareNative(cwd, 'all');
 
     // 3. Platform Selection
     console.log(`\nESAD Host Dev Manager`);

package/src/cli/commands/init.js

@@ -1,7 +1,8 @@
 const fs = require('fs-extra');
 const path = require('path');
 const { runProcess } = require('../utils/process');
-const templates = require('../templates/host');
+const { cloneTemplate, renameProject } = require('../utils/scaffold');
+const templatesConfig = require('../templates/templates.json');
 
 module.exports = async (projectName) => {
   const workspaceDir = path.join(process.cwd(), projectName);
@@ -41,72 +42,17 @@ module.exports = async (projectName) => {
   const hostDir = path.join(workspaceDir, hostName);
   
   try {
-    console.log(`\n📦 Scaffolding clean Expo project: ${hostName}...`);
-    await runProcess('npx', ['create-expo-app', hostName, '--template', 'blank'], workspaceDir);
+    // 1. Clone Template instead of create-expo-app
+    await cloneTemplate(templatesConfig.host, hostDir);
     
-    console.log(`\n📦 Installing ESAD, Re.Pack and UI dependencies into host...`);
-    const hostPkgPath = path.join(hostDir, 'package.json');
-    const hostPkg = fs.readJsonSync(hostPkgPath);
-    const reactVersion = hostPkg.dependencies.react;
+    // 2. Rename Project
+    await renameProject(hostDir, hostName);
 
-    const deps = [
-      '@codemoreira/esad',
-      '@callstack/repack@^5.2.5',
-      '@rspack/core@^1.7.9',
-      '@rspack/plugin-react-refresh@^1.6.1',
-      '@callstack/repack-plugin-expo-modules',
-      '@react-native-community/cli',
-      'nativewind',
-      'tailwindcss',
-      'postcss',
-      'autoprefixer',
-      'expo-secure-store',
-      'react-native-reanimated',
-      'react-native-safe-area-context',
-      'react-native-screens',
-      'expo-router',
-      `react-dom@${reactVersion}`
-    ];
-    await runProcess('npm', ['install', ...deps], hostDir); 
+    console.log(`\n📦 Installing dependencies into host...`);
+    await runProcess('npm', ['install'], hostDir); 
 
-    // Re-read package.json to get the version after npm install updated it
-    const updatedPkg = fs.readJsonSync(hostPkgPath);
-
-    // Update package.json scripts to delegate to ESAD CLI
-    updatedPkg.scripts = {
-       ...updatedPkg.scripts,
-       "start": "esad host start",
-       "android": "esad host android",
-       "ios": "esad host ios",
-       "dev": "esad host dev"
-    };
-    fs.writeJsonSync(hostPkgPath, updatedPkg, { spaces: 2 });
-    console.log(`✅ Abstracted package.json scripts to use ESAD CLI.`);
-
-    console.log(`\n🎨 Configuring NativeWind & Tailwind...`);
-    fs.writeFileSync(path.join(hostDir, 'tailwind.config.js'), templates.tailwindConfig);
-    fs.writeFileSync(path.join(hostDir, 'babel.config.js'), templates.babelConfig);
-
-    const rspackContent = `import { withESAD } from '@codemoreira/esad/plugin';\n\nexport default withESAD({\n  type: 'host',\n  id: '${hostName}'\n});\n`
-    fs.writeFileSync(path.join(hostDir, 'rspack.config.mjs'), rspackContent);
-
-    console.log(`\n🔐 Scaffolding Auth & Navigation...`);
-    fs.ensureDirSync(path.join(hostDir, 'providers'));
-    fs.ensureDirSync(path.join(hostDir, 'hooks'));
-    fs.ensureDirSync(path.join(hostDir, 'lib'));
-    fs.ensureDirSync(path.join(hostDir, 'app', '(protected)', 'module'));
-
-    fs.writeFileSync(path.join(hostDir, 'providers/auth.tsx'), templates.authProvider);
-    fs.writeFileSync(path.join(hostDir, 'app/_layout.tsx'), templates.rootLayout);
-    fs.writeFileSync(path.join(hostDir, 'app/login.tsx'), templates.loginPage);
-    fs.writeFileSync(path.join(hostDir, 'app/global.css'), templates.globalCss);
-    fs.writeFileSync(path.join(hostDir, 'lib/moduleLoader.ts'), templates.moduleLoader);
-    fs.writeFileSync(path.join(hostDir, 'index.js'), templates.indexJs);
-    fs.writeFileSync(path.join(hostDir, 'app/(protected)/index.tsx'), templates.dashboard);
-    fs.writeFileSync(path.join(hostDir, 'app/(protected)/module/[id].tsx'), templates.modulePage);
-
-    console.log(`\n🎉 ESAD Workpace Initialized!`);
-    console.log(`-> cd ${projectName}\n-> esad dev (to start Host)`);
+    console.log(`\n🎉 ESAD Workspace Initialized!`);
+    console.log(`-> cd ${projectName}/${hostName}\n-> esad host dev (to start Host)`);
   } catch (err) {
     console.error(`❌ Failed to init Host:`, err.message);
   }

package/src/cli/templates/templates.json

@@ -0,0 +1,4 @@
+{
+  "host": "https://github.com/CodeMoreira/esad-template-host",
+  "module": "https://github.com/CodeMoreira/esad-template-module"
+}

package/src/cli/utils/scaffold.js

@@ -0,0 +1,84 @@
+const { runProcess } = require('./process');
+const fs = require('fs-extra');
+const path = require('path');
+
+/**
+ * Clones a template repository and cleans up the .git folder
+ */
+async function cloneTemplate(url, dest) {
+  console.log(`\n📥 Cloning template: ${url}...`);
+  await runProcess('git', ['clone', url, dest]);
+  
+  const gitDir = path.join(dest, '.git');
+  if (fs.existsSync(gitDir)) {
+    await fs.remove(gitDir);
+    console.log(`✅ Detached from template repository.`);
+  }
+}
+
+/**
+ * Renames the project in package.json and app.json
+ */
+async function renameProject(targetDir, newName) {
+  const pkgPath = path.join(targetDir, 'package.json');
+  const appJsonPath = path.join(targetDir, 'app.json');
+
+  if (fs.existsSync(pkgPath)) {
+    const pkg = await fs.readJson(pkgPath);
+    pkg.name = newName;
+    await fs.writeJson(pkgPath, pkg, { spaces: 2 });
+    console.log(`✅ Updated package.json name: ${newName}`);
+  }
+
+  if (fs.existsSync(appJsonPath)) {
+    const appJson = await fs.readJson(appJsonPath);
+    if (appJson.expo) {
+      appJson.expo.name = newName;
+      appJson.expo.slug = newName;
+      if (appJson.expo.android) {
+        appJson.expo.android.package = `com.anonymous.${newName.replace(/[^a-zA-Z0-9]/g, '')}`;
+      }
+    } else {
+      appJson.name = newName;
+      appJson.slug = newName;
+    }
+    await fs.writeJson(appJsonPath, appJson, { spaces: 2 });
+    console.log(`✅ Updated app.json name/slug/package.`);
+  }
+}
+
+/**
+ * Prepares the native folders and applies Re.Pack patches
+ */
+async function prepareNative(cwd, platform = 'android') {
+  if (!fs.existsSync(path.join(cwd, 'android')) && (platform === 'android' || platform === 'all')) {
+    console.log(`📦 Native folder not found. Running expo prebuild...`);
+    await runProcess('npx', ['expo', 'prebuild', '--platform', 'android'], cwd);
+  }
+
+  // Apply Gradle Patch (Android)
+  const buildGradlePath = path.join(cwd, 'android/app/build.gradle');
+  if (fs.existsSync(buildGradlePath)) {
+    let content = await fs.readFile(buildGradlePath, 'utf8');
+    if (!content.includes('project.ext.react')) {
+      const patch = `\nproject.ext.react = [\n    bundleCommand: "repack-bundle",\n    bundleConfig: "rspack.config.mjs"\n]\n\n`;
+      content = content.replace(/react \{/, `${patch}react {`);
+      await fs.writeFile(buildGradlePath, content);
+      console.log(`✅ Patched android/app/build.gradle for Re.Pack.`);
+    }
+  }
+
+  // Create react-native.config.js if missing
+  const rnConfigPath = path.join(cwd, 'react-native.config.js');
+  if (!fs.existsSync(rnConfigPath)) {
+    const content = `module.exports = {\n  commands: require('@callstack/repack/commands/rspack'),\n};\n`;
+    await fs.writeFile(rnConfigPath, content);
+    console.log(`✅ Generated react-native.config.js.`);
+  }
+}
+
+module.exports = {
+  cloneTemplate,
+  renameProject,
+  prepareNative
+};

package/src/plugin/index.js

@@ -1,129 +1,128 @@
-const path = require('node:path');
-const fs = require('node:fs');
-const Repack = require('@callstack/repack');
-const { ExpoModulesPlugin } = require('@callstack/repack-plugin-expo-modules');
-const { ProvidePlugin, DefinePlugin } = require('@rspack/core');
-
-/**
- * ESAD Re.Pack Plugin Wrapper
- * Abstracts away the boilerplate of Module Federation and SDK integration for SuperApps.
- * 
- * @param {Object} env Rspack environment
- * @param {Object} options 
- * @param {string} options.type 'host' | 'module'
- * @param {string} options.id Unique module or host ID
- * @param {string} options.dirname Base directory (__dirname)
- * @param {Object} [options.shared] Additional shared dependencies
- * @param {Object} [options.exposes] Modules to expose (for modules)
- * @param {Object} [options.remotes] Remote modules (for host)
- */
-function withESAD(env, options) {
-  const isDev = env.dev !== false;
-  const dirname = options.dirname;
-  const pkgPath = path.resolve(dirname, 'package.json');
-  const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf8'));
-  const id = options.id.replace(/-/g, '_');
-
-  console.log(`[ESAD] Applying Mega-Zero-Config profile for ${options.type.toUpperCase()}: ${id}`);
-
-  const config = {
-    context: dirname,
-    entry: options.entry || './index.js',
-    output: {
-      ...Repack.getOutputOptions(env),
-    },
-    resolve: {
-      ...Repack.getResolveOptions(),
-      alias: {
-        '@': path.resolve(dirname, '.'),
-        // Internal MFv2 & Re.Pack Aliases (Magic)
-        '@module-federation/runtime/helpers': path.resolve(dirname, 'node_modules/@module-federation/runtime/dist/helpers.js'),
-        '@module-federation/error-codes/browser': path.resolve(dirname, 'node_modules/@module-federation/error-codes/dist/browser.cjs'),
-        '@module-federation/sdk': path.resolve(dirname, 'node_modules/@module-federation/sdk'),
-        
-        // ESAD SDK Aliases (Zero-Config)
-        '@codemoreira/esad/client': path.resolve(dirname, 'node_modules/@codemoreira/esad/src/client/index.js'),
-        
-        ...Repack.getResolveOptions().alias,
-        ...options.alias,
-      }
-    },
-    module: {
-      rules: [
-        {
-          oneOf: [
-            {
-              test: /\.[cm]?[jt]sx?$/,
-              include: [
-                /node_modules[\\/]react-native/,
-                /node_modules[\\/]@react-native/,
-              ],
-              type: 'javascript/auto',
-              use: {
-                loader: '@callstack/repack/babel-swc-loader',
-                options: {
-                  sourceMaps: true,
-                  parallel: true,
-                },
-              },
-            },
-            ...Repack.getJsTransformRules(),
-          ]
-        },
-        ...Repack.getAssetTransformRules(),
-      ],
-    },
-    plugins: [
-      new ProvidePlugin({
-        process: 'process/browser',
-      }),
-      new DefinePlugin({
-        'process.env.NODE_ENV': JSON.stringify(isDev ? 'development' : 'production'),
-        '__DEV__': JSON.stringify(isDev),
-      }),
-      new ExpoModulesPlugin(),
-      new Repack.RepackPlugin(),
-      new Repack.plugins.ModuleFederationPluginV2({
-        name: id,
-        filename: `${id}.container.js.bundle`,
-        remotes: options.remotes || {},
-        exposes: options.exposes || {},
-        dts: false,
-        dev: isDev,
-        shared: {
-          'react': { singleton: true, eager: true, requiredVersion: pkg.dependencies.react },
-          'react/jsx-runtime': { singleton: true, eager: true, requiredVersion: pkg.dependencies.react },
-          'react-native': { singleton: true, eager: true, requiredVersion: pkg.dependencies['react-native'] },
-          'react-native-safe-area-context': { singleton: true, eager: true, requiredVersion: pkg.dependencies['react-native-safe-area-context'] },
-          '@codemoreira/esad': { singleton: true, eager: true },
-          ...options.shared
-        }
-      })
-    ],
-  };
-
-  // Add Host-specific DevServer magic for Expo
-  if (options.type === 'host') {
-    config.devServer = {
-      setupMiddlewares: (middlewares) => {
-        middlewares.unshift((req, res, next) => {
-          if (req.url.startsWith('/.expo/.virtual-metro-entry.bundle')) {
-            const query = req.url.split('?')[1];
-            const isMap = req.url.includes('.map');
-            const target = isMap ? '/index.bundle.map' : '/index.bundle';
-            const location = query ? `${target}?${query}` : target;
-            res.writeHead(302, { Location: location });
-            res.end();
-            return;
-          }
-          next();
-        });
-        return middlewares;
-      },
-    };
-  }
-
-  return config;
-}
-
-module.exports = { withESAD };
+const path = require('node:path');
+const fs = require('node:fs');
+const Repack = require('@callstack/repack');
+const { ExpoModulesPlugin } = require('@callstack/repack-plugin-expo-modules');
+const { ProvidePlugin, DefinePlugin } = require('@rspack/core');
+
+/**
+ * ESAD Re.Pack Plugin Wrapper
+ * Abstracts away the boilerplate of Module Federation and SDK integration for SuperApps.
+ * 
+ * @param {Object} env Rspack environment
+ * @param {Object} options 
+ * @param {string} options.type 'host' | 'module'
+ * @param {string} options.id Unique module or host ID
+ * @param {string} options.dirname Base directory (__dirname)
+ * @param {Object} [options.shared] Additional shared dependencies
+ * @param {Object} [options.exposes] Modules to expose (for modules)
+ * @param {Object} [options.remotes] Remote modules (for host)
+ */
+function withESAD(env, options) {
+  const { platform, dev } = env;
+  const isDev = dev !== false;
+  const dirname = options.dirname;
+  const pkgPath = path.resolve(dirname, 'package.json');
+  const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf8'));
+  const id = options.id.replace(/-/g, '_');
+
+  console.log(`[ESAD] Applying Mega-Zero-Config profile for ${options.type.toUpperCase()} (${platform}): ${id}`);
+
+  const config = {
+    mode: isDev ? 'development' : 'production',
+    context: dirname,
+    entry: options.entry || './index.js',
+    resolve: {
+      ...Repack.getResolveOptions(),
+      alias: {
+        '@': path.resolve(dirname, '.'),
+        // Internal MFv2 & Re.Pack Aliases (Magic)
+        '@module-federation/runtime/helpers': path.resolve(dirname, 'node_modules/@module-federation/runtime/dist/helpers.js'),
+        '@module-federation/error-codes/browser': path.resolve(dirname, 'node_modules/@module-federation/error-codes/dist/browser.cjs'),
+        '@module-federation/sdk': path.resolve(dirname, 'node_modules/@module-federation/sdk'),
+        
+        // ESAD SDK Aliases (Zero-Config)
+        '@codemoreira/esad/client': path.resolve(dirname, 'node_modules/@codemoreira/esad/src/client/index.js'),
+        
+        ...Repack.getResolveOptions().alias,
+        ...(options.alias || {}),
+      }
+    },
+    module: {
+      rules: [
+        {
+          oneOf: [
+            {
+              test: /\.[cm]?[jt]sx?$/,
+              include: [
+                /node_modules[\\/]react-native/,
+                /node_modules[\\/]@react-native/,
+              ],
+              type: 'javascript/auto',
+              use: {
+                loader: '@callstack/repack/babel-swc-loader',
+                options: {
+                  sourceMaps: true,
+                  parallel: true,
+                },
+              },
+            },
+            ...Repack.getJsTransformRules(),
+          ]
+        },
+        ...Repack.getAssetTransformRules(),
+      ],
+    },
+    plugins: [
+      new ProvidePlugin({
+        process: 'process/browser',
+      }),
+      new DefinePlugin({
+        'process.env.NODE_ENV': JSON.stringify(isDev ? 'development' : 'production'),
+        '__DEV__': JSON.stringify(isDev),
+      }),
+      new ExpoModulesPlugin(),
+      new Repack.RepackPlugin(),
+      new Repack.plugins.ModuleFederationPluginV2({
+        name: id,
+        filename: `${id}.container.js.bundle`,
+        remotes: options.remotes || {},
+        ...(options.type === 'module' ? { exposes: options.exposes || {} } : {}),
+        dts: false,
+        dev: isDev,
+        shared: {
+          'react': { singleton: true, eager: true, requiredVersion: pkg.dependencies.react },
+          'react/jsx-runtime': { singleton: true, eager: true, requiredVersion: pkg.dependencies.react },
+          'react-native': { singleton: true, eager: true, requiredVersion: pkg.dependencies['react-native'] },
+          'react-native-safe-area-context': { singleton: true, eager: true, requiredVersion: pkg.dependencies['react-native-safe-area-context'] },
+          '@codemoreira/esad': { singleton: true, eager: true },
+          ...(options.shared || {})
+        }
+      })
+    ],
+  };
+
+  // Add Host-specific DevServer magic for Expo
+  if (options.type === 'host') {
+    config.devServer = {
+      setupMiddlewares: (middlewares) => {
+        middlewares.unshift((req, res, next) => {
+          if (req.url.startsWith('/.expo/.virtual-metro-entry.bundle')) {
+            const query = req.url.split('?')[1];
+            const isMap = req.url.includes('.map');
+            const target = isMap ? '/index.bundle.map' : '/index.bundle';
+            const location = query ? `${target}?${query}` : target;
+            res.writeHead(302, { Location: location });
+            res.end();
+            return;
+          }
+          next();
+        });
+        return middlewares;
+      },
+    };
+  }
+
+  return config;
+}
+
+module.exports = { withESAD };

package/src/cli/templates/host.js

@@ -1,201 +0,0 @@
-module.exports = {
-  tailwindConfig: `/** @type {import('tailwindcss').Config} */
-module.exports = {
-  content: ["./app/**/*.{js,jsx,ts,tsx}", "./components/**/*.{js,jsx,ts,tsx}", "./lib/**/*.{js,jsx,ts,tsx}"],
-  presets: [require("nativewind/preset")],
-  theme: {
-    extend: {},
-  },
-  plugins: [],
-};`,
-
-  babelConfig: `module.exports = function (api) {
-  api.cache(true);
-  return {
-    presets: [
-      ["babel-preset-expo", { jsxImportSource: "nativewind" }],
-      "nativewind/babel",
-    ],
-  };
-};`,
-
-  authProvider: `import { createContext, useEffect, useState, useContext } from "react";
-import * as SecureStore from "expo-secure-store";
-
-const AuthContext = createContext({});
-
-export function AuthProvider({ children }) {
-    const [token, setToken] = useState(null);
-    const [isInitialized, setIsInitialized] = useState(false);
-
-    useEffect(() => {
-        SecureStore.getItemAsync("token").then((val) => {
-            setToken(val);
-            setIsInitialized(true);
-        });
-    }, []);
-
-    const login = (mockToken = "session_token") => {
-        setToken(mockToken);
-        SecureStore.setItemAsync("token", mockToken);
-    };
-
-    const logout = () => {
-        setToken(null);
-        SecureStore.deleteItemAsync("token");
-    };
-
-    return (
-        <AuthContext.Provider value={{ token, login, logout, isInitialized }}>
-            {children}
-        </AuthContext.Provider>
-    );
-}
-
-export const useAuth = () => useContext(AuthContext);`,
-
-  rootLayout: `import { Stack, router } from "expo-router";
-import { useEffect } from "react";
-import { AuthProvider, useAuth } from "@/providers/auth";
-import { SafeAreaProvider } from "react-native-safe-area-context";
-import "./global.css";
-
-export default function RootLayout() {
-  return (
-    <SafeAreaProvider>
-      <AuthProvider>
-         <RootNavigation />
-      </AuthProvider>\n    </SafeAreaProvider>
-  );
-}
-
-function RootNavigation() {
-  const { token, isInitialized } = useAuth();
-
-  useEffect(() => {
-    if (!isInitialized) return;\n\n    // Global SuperApp Registry
-    globalThis.__SUPERAPP__ = {
-       getToken: () => token,
-       navigate: (route, params) => router.push({ pathname: route, params })
-    };\n  }, [isInitialized, token]);
-
-  if (!isInitialized) return null;
-
-  return (
-    <Stack screenOptions={{ headerShown: false }}>
-       <Stack.Screen name="login" redirect={!!token} />
-       <Stack.Screen name="(protected)" redirect={!token} />
-    </Stack>
-  );
-}`,
-
-  loginPage: `import { View, Text, TouchableOpacity } from "react-native";
-import { useAuth } from "@/providers/auth";
-
-export default function LoginPage() {
-  const { login } = useAuth();
-
-  return (
-    <View className="flex-1 items-center justify-center bg-slate-50 p-6">
-      <View className="w-full max-w-sm bg-white p-8 rounded-3xl shadow-xl border border-slate-100">
-        <Text className="text-3xl font-bold text-slate-900 mb-2">Welcome</Text>
-        <Text className="text-slate-500 mb-8">Sign in to access your SuperApp modules</Text>\n        
-        <TouchableOpacity 
-          onPress={() => login()}
-          className="w-full bg-indigo-600 py-4 rounded-2xl items-center shadow-lg active:bg-indigo-700"
-        >
-          <Text className="text-white font-semibold text-lg">Entrar no App</Text>
-        </TouchableOpacity>
-      </View>
-    </View>
-  );
-}`,
-
-  globalCss: `@tailwind base;\n@tailwind components;\n@tailwind utilities;`,
-
-  moduleLoader: `import { ScriptManager } from "@callstack/repack/client";
-
-export async function loadModule(config) {
-  await ScriptManager.shared.addScript({
-    id: config.id,
-    url: config.url
-  });
-
-  const container = global[config.scope];
-  if (!container) throw new Error("Module " + config.scope + " not found");
-
-  await container.init(__webpack_share_scopes__.default);
-  const factory = await container.get(config.module);
-  return factory();
-}`,
-
-  dashboard: `import { View, Text, ScrollView, TouchableOpacity } from "react-native";
-import { Link } from "expo-router";
-import { useAuth } from "@/providers/auth";
-
-const MOCK_MODULES = [
-  { id: 'mod1', name: 'Sales Dashboard', icon: '📊' },
-  { id: 'mod2', name: 'Inventory Manager', icon: '📦' },
-];
-
-export default function Dashboard() {
-  const { logout } = useAuth();
-
-  return (
-    <ScrollView className="flex-1 bg-slate-50 p-6 pt-16">
-      <View className="flex-row justify-between items-center mb-8">
-        <View>
-           <Text className="text-sm text-slate-500">Welcome back,</Text>
-           <Text className="text-2xl font-bold text-slate-900">Explorer</Text>
-        </View>
-        <TouchableOpacity onPress={logout} className="p-2">
-           <Text className="text-red-500 font-medium">Logout</Text>
-        </TouchableOpacity>
-      </View>
-
-      <Text className="text-lg font-semibold text-slate-800 mb-4">Your Modules</Text>
-      
-      {MOCK_MODULES.map(m => (
-        <Link key={m.id} href={\`/(protected)/module/\${m.id}\`} asChild>
-          <TouchableOpacity className="bg-white p-6 rounded-2xl mb-4 shadow-sm border border-slate-100 flex-row items-center">
-            <Text className="text-3xl mr-4">{m.icon}</Text>
-            <View className="flex-1">
-              <Text className="text-lg font-bold text-slate-900">{m.name}</Text>
-              <Text className="text-slate-500">Tap to open module</Text>
-            </View>
-          </TouchableOpacity>
-        </Link>
-      ))}
-    </ScrollView>
-  );
-}`,
-
-  modulePage: `import { useLocalSearchParams } from "expo-router";
-import { View, Text, ActivityIndicator } from "react-native";
-import { useEffect, useState } from "react";
-import { loadModule } from "@/lib/moduleLoader";
-
-export default function ModulePage() {
-  const { id } = useLocalSearchParams();
-  const [Module, setModule] = useState(null);
-  const [error, setError] = useState(null);
-
-  useEffect(() => {\n    // In real app, fetch config from registry by id\n    setError("Module dynamic loading requires a running CDN and Build setup.");\n  }, [id]);
-
-  if (error) return (
-    <View className="flex-1 items-center justify-center p-10 bg-white">
-       <Text className="text-red-500 text-center font-medium mb-4">{error}</Text>
-       <Text className="text-slate-400 text-center text-sm">Follow the README to setup your module registry.</Text>
-    </View>
-  );
-
-  return (
-    <View className="flex-1 bg-white items-center justify-center">
-       <ActivityIndicator size="large" color="#4f46e5" />
-       <Text className="mt-4 text-slate-500">Loading federated module...</Text>
-    </View>
-  );
-}`,
-
-  indexJs: `import "expo-router/entry";`
-};