@mmapp/react-compiler 0.1.0-alpha.1

package/src/cli/init.ts

@@ -0,0 +1,388 @@
+/**
+ * CLI Init Command — scaffolds a new blueprint package.
+ *
+ * Usage:
+ *   mmrc init <name> [--description "..."] [--icon "..."] [--author "..."]
+ *
+ * Creates:
+ *   packages/blueprint-<name>/
+ *   ├── package.json
+ *   ├── mm.config.ts
+ *   ├── models/
+ *   │   └── item.ts
+ *   └── app/
+ *       ├── layout.tsx
+ *       └── page.tsx
+ */
+
+import { mkdirSync, writeFileSync, existsSync } from 'fs';
+import { join } from 'path';
+
+export interface InitOptions {
+  name: string;
+  description?: string;
+  icon?: string;
+  author?: string;
+}
+
+/** Convert "my-app" to "My App" */
+function toTitleCase(slug: string): string {
+  return slug
+    .split('-')
+    .map(w => w.charAt(0).toUpperCase() + w.slice(1))
+    .join(' ');
+}
+
+/** Convert "my-app" to "MyApp" */
+function toPascalCase(slug: string): string {
+  return slug
+    .split('-')
+    .map(w => w.charAt(0).toUpperCase() + w.slice(1))
+    .join('');
+}
+
+function generatePackageJson(name: string): string {
+  return JSON.stringify(
+    {
+      name: `@mindmatrix/blueprint-${name}`,
+      version: '0.1.0',
+      private: true,
+      type: 'module',
+      scripts: {
+        build: 'mmrc build --src . --out dist',
+        dev: 'mmrc dev --src . --port 5199',
+        deploy: 'mmrc deploy --build --src .',
+      },
+      dependencies: {
+        '@mindmatrix/react': 'workspace:*',
+      },
+    },
+    null,
+    2,
+  );
+}
+
+function generateMmConfig(name: string, opts: InitOptions): string {
+  const title = toTitleCase(name);
+  const desc = opts.description ?? `${title} blueprint.`;
+  const icon = opts.icon ?? 'box';
+  const author = opts.author ?? 'MindMatrix';
+  return `import { defineBlueprint } from '@mindmatrix/react';
+
+export default defineBlueprint({
+  slug: '${name}',
+  name: '${title}',
+  version: '1.0.0',
+  description: '${desc}',
+  author: '${author}',
+  icon: '${icon}',
+  mode: 'infer',
+  defaultRuntime: 'collaborative',
+
+  models: [
+    'models/item',
+  ],
+
+  routes: [
+    { path: '/', view: 'app/page', label: 'Home' },
+  ],
+
+  dependencies: [],
+});
+`;
+}
+
+function generateModel(name: string): string {
+  const modelSlug = `${name}-item`;
+  const pascal = toPascalCase(name);
+
+  return `/**
+ * ${pascal} Item — data model with lifecycle states.
+ *
+ * States: draft → active → archived
+ */
+
+import { defineModel } from '@mindmatrix/react';
+
+export interface ${pascal}ItemFields {
+  title: string;
+  description: string;
+  priority: 'low' | 'medium' | 'high';
+  createdAt: number;
+}
+
+export default defineModel({
+  slug: '${modelSlug}',
+  version: '1.0.0',
+  category: ['model', '${name}'],
+
+  fields: {
+    title: { type: 'string', required: true },
+    description: { type: 'string', default: '' },
+    priority: { type: 'string', default: 'medium', enum: ['low', 'medium', 'high'] },
+    createdAt: { type: 'number', default: 0 },
+  },
+
+  states: {
+    draft: {
+      type: 'initial',
+      onEnter: [
+        { id: 'set-created', type: 'set_field', mode: 'auto', config: { field: 'createdAt', expression: 'NOW()' } },
+      ],
+    },
+    active: {
+      onEnter: [
+        { id: 'log-activated', type: 'log_event', mode: 'auto', config: { event: '${modelSlug}.activated' } },
+      ],
+    },
+    archived: {
+      type: 'end',
+    },
+  },
+
+  transitions: {
+    activate: {
+      from: 'draft',
+      to: 'active',
+      description: 'Publish this item',
+    },
+    archive: {
+      from: 'active',
+      to: 'archived',
+      description: 'Archive this item',
+    },
+  },
+});
+`;
+}
+
+function generateLayout(name: string): string {
+  const title = toTitleCase(name);
+
+  return `/**
+ * @workflow slug="${name}-layout" version="1.0.0" category="view"
+ *
+ * Root layout with sidebar navigation.
+ */
+
+import {
+  Row,
+  Stack,
+  Slot,
+  Text,
+  Icon,
+  Button,
+  Divider,
+} from '@mindmatrix/react/atoms';
+import { useRouter } from '@mindmatrix/react';
+
+export default function Layout({ children }: { children: React.ReactNode }) {
+  const router = useRouter();
+
+  return (
+    <Row gap={0} height="100vh" overflow="hidden">
+      {/* Sidebar */}
+      <Stack
+        width={240}
+        borderRight="1px solid token:border"
+        height="100vh"
+        background="token:surface"
+      >
+        <Row padding={12} gap={8} align="center" borderBottom="1px solid token:border">
+          <Icon name="box" size={20} color="token:primary" />
+          <Text variant="label" size="sm" value="${title}" />
+        </Row>
+
+        <Stack padding={8} gap={4}>
+          <Button variant="ghost" onPress={() => router.push('/')}>
+            <Row gap={8} align="center">
+              <Icon name="home" size={16} />
+              <Text size="sm" value="Home" />
+            </Row>
+          </Button>
+          <Button variant="ghost" onPress={() => router.push('/settings')}>
+            <Row gap={8} align="center">
+              <Icon name="settings" size={16} />
+              <Text size="sm" value="Settings" />
+            </Row>
+          </Button>
+        </Stack>
+
+        <Divider />
+        <Stack flex={1} />
+        <Row padding={12}>
+          <Text variant="muted" size="xs" value="v1.0.0" />
+        </Row>
+      </Stack>
+
+      {/* Main content */}
+      <Stack flex={1} overflow="auto">
+        {children}
+      </Stack>
+    </Row>
+  );
+}
+`;
+}
+
+function generatePage(name: string): string {
+  const title = toTitleCase(name);
+  const pascal = toPascalCase(name);
+
+  return `/**
+ * @workflow slug="${name}-home" version="1.0.0" category="page"
+ *
+ * Index page — lists items with create and search.
+ */
+
+import itemModel from '../models/item';
+import {
+  useQuery, useMutation, useRouter, useState,
+  Stack, Row, Text, Button, Icon, Card, Show, Each, TextInput, Badge,
+} from '@mindmatrix/react';
+
+const PRIORITY_COLORS: Record<string, string> = {
+  high: 'token:error',
+  medium: 'token:warning',
+  low: 'token:success',
+};
+
+export default function ${pascal}Home() {
+  const { data: items, loading } = useQuery(itemModel);
+  const mutation = useMutation(itemModel);
+  const router = useRouter();
+  const [search, setSearch] = useState('');
+
+  const activeItems = items.filter(i => i.state !== 'archived');
+  const filtered = activeItems.filter(i =>
+    i.fields.title.toLowerCase().includes(search.toLowerCase())
+  );
+
+  const handleCreate = async () => {
+    await mutation.create({ title: 'New Item', priority: 'medium' });
+  };
+
+  return (
+    <Stack gap={24} padding={24}>
+      {/* Header */}
+      <Row justify="space-between" align="center">
+        <Stack gap={4}>
+          <Text variant="h3" weight="bold" value="${title}" />
+          <Text variant="muted" size="sm" value={\`\${activeItems.length} items\`} />
+        </Stack>
+        <Button variant="primary" onPress={handleCreate}>
+          <Row gap={6} align="center">
+            <Icon name="plus" size={16} />
+            <Text value="Add Item" />
+          </Row>
+        </Button>
+      </Row>
+
+      {/* Search */}
+      <TextInput
+        value={search}
+        onChange={setSearch}
+        placeholder="Search items..."
+      />
+
+      {/* Loading */}
+      <Show when={loading}>
+        <Card padding={32}>
+          <Stack align="center">
+            <Text variant="muted" value="Loading..." />
+          </Stack>
+        </Card>
+      </Show>
+
+      {/* Empty state */}
+      <Show when={!loading && filtered.length === 0}>
+        <Card padding={32}>
+          <Stack align="center" gap={12}>
+            <Icon name="inbox" size={40} color="token:muted" />
+            <Text variant="muted" value="No items yet" />
+            <Button variant="outline" onPress={handleCreate}>
+              <Text value="Create your first item" />
+            </Button>
+          </Stack>
+        </Card>
+      </Show>
+
+      {/* Item list */}
+      <Show when={!loading && filtered.length > 0}>
+        <Stack gap={4}>
+          <Each items={filtered} keyField="id">
+            {(item) => (
+              <Card padding={12}>
+                <Row align="center" gap={12}>
+                  <Stack flex={1} gap={2}>
+                    <Text weight="medium" value={item.fields.title} />
+                    <Show when={!!item.fields.description}>
+                      <Text size="sm" variant="muted" value={item.fields.description} />
+                    </Show>
+                  </Stack>
+                  <Badge value={item.fields.priority} />
+                  <Badge value={item.state} variant={item.state === 'active' ? 'success' : 'default'} />
+                </Row>
+              </Card>
+            )}
+          </Each>
+        </Stack>
+      </Show>
+    </Stack>
+  );
+}
+`;
+}
+
+export async function init(options: InitOptions): Promise<void> {
+  const { name } = options;
+
+  // Validate name
+  if (!/^[a-z][a-z0-9-]*$/.test(name)) {
+    console.error(`[mmrc] Error: Blueprint name must be lowercase alphanumeric with hyphens (got "${name}")`);
+    process.exit(1);
+  }
+
+  // Determine output directory — look for packages/ directory (monorepo) or use cwd
+  const cwd = process.cwd();
+  const packagesDir = existsSync(join(cwd, 'packages')) ? join(cwd, 'packages') : cwd;
+  const blueprintDir = join(packagesDir, `blueprint-${name}`);
+
+  if (existsSync(blueprintDir)) {
+    console.error(`[mmrc] Error: Directory already exists: ${blueprintDir}`);
+    process.exit(1);
+  }
+
+  console.log(`[mmrc] Creating blueprint: ${name}\n`);
+
+  // Create directories
+  mkdirSync(join(blueprintDir, 'models'), { recursive: true });
+  mkdirSync(join(blueprintDir, 'app'), { recursive: true });
+
+  // Write files
+  const files: Array<[string, string]> = [
+    ['package.json', generatePackageJson(name)],
+    ['mm.config.ts', generateMmConfig(name, options)],
+    ['models/item.ts', generateModel(name)],
+    ['app/layout.tsx', generateLayout(name)],
+    ['app/page.tsx', generatePage(name)],
+  ];
+
+  for (const [relPath, content] of files) {
+    const fullPath = join(blueprintDir, relPath);
+    writeFileSync(fullPath, content, 'utf-8');
+    console.log(`  + ${relPath}`);
+  }
+
+  const title = toTitleCase(name);
+  console.log(`
+[mmrc] Blueprint "${title}" created at:
+  ${blueprintDir}
+
+Next steps:
+  1. cd ${blueprintDir.startsWith(cwd) ? blueprintDir.slice(cwd.length + 1) : blueprintDir}
+  2. mmrc dev                    # Start dev server
+  3. mmrc build                  # Compile to IR
+  4. mmrc deploy --build         # Build + deploy to backend
+`);
+}

package/src/cli/installer.ts

@@ -0,0 +1,261 @@
+/**
+ * Installer — handles install, list, update, and remove commands.
+ *
+ * Modes:
+ *   type-only (default): writes .d.ts to node_modules/@mm/<slug>/
+ *   full: uses project decompiler to generate full source in packages/<slug>/
+ */
+
+import { mkdirSync, writeFileSync, existsSync, rmSync } from 'fs';
+import { join, dirname } from 'path';
+import { fetchDefinition, searchDefinitions } from './registry-client';
+import type { RegistryConfig, WorkflowDefinitionResponse } from './registry-client';
+import { generateTypeDeclaration, generateFullSource } from './type-generator';
+import { readLockFile, upsertLockEntry, removeLockEntry } from './lock-file';
+import type { LockData } from './lock-file';
+
+export interface InstallOptions {
+  slug: string;
+  mode: 'type-only' | 'full';
+  config: RegistryConfig;
+  cwd?: string;
+}
+
+export interface InstallResult {
+  slug: string;
+  version: string;
+  mode: 'type-only' | 'full';
+  filesWritten: string[];
+}
+
+export interface ListResult {
+  entries: LockData;
+}
+
+/**
+ * Install a workflow definition package.
+ */
+export async function install(options: InstallOptions): Promise<InstallResult> {
+  const { slug, mode, config } = options;
+  const cwd = options.cwd ?? process.cwd();
+
+  console.log(`[mmrc] Installing ${slug}...`);
+
+  // 1. Fetch definition from registry
+  const def = await fetchDefinition(slug, config);
+  const version = def.version || '1.0.0';
+
+  console.log(`  Found: ${def.name || def.slug} v${version} (${def.category || 'workflow'})`);
+  console.log(`  Fields: ${def.fields?.length ?? 0}, States: ${def.states?.length ?? 0}, Transitions: ${def.transitions?.length ?? 0}`);
+
+  const filesWritten: string[] = [];
+
+  if (mode === 'full') {
+    filesWritten.push(...installFull(def, cwd));
+  } else {
+    filesWritten.push(...installTypeOnly(def, cwd));
+  }
+
+  // 4. Update lock file
+  const content = mode === 'full' ? generateFullSource(def) : generateTypeDeclaration(def);
+  upsertLockEntry(cwd, slug, version, mode, content);
+
+  console.log(`\n[mmrc] Installed ${slug}@${version} (${mode})`);
+  for (const f of filesWritten) {
+    console.log(`  + ${f}`);
+  }
+
+  return { slug, version, mode, filesWritten };
+}
+
+/**
+ * Install type-only: write .d.ts to node_modules/@mm/<slug>/
+ */
+function installTypeOnly(
+  def: WorkflowDefinitionResponse,
+  cwd: string,
+): string[] {
+  const packageDir = join(cwd, 'node_modules', '@mm', def.slug);
+  mkdirSync(packageDir, { recursive: true });
+
+  // Generate type declaration
+  const dts = generateTypeDeclaration(def);
+  const dtsPath = join(packageDir, 'index.d.ts');
+  writeFileSync(dtsPath, dts, 'utf-8');
+
+  // Generate a minimal package.json for resolution
+  const pkgJson = {
+    name: `@mm/${def.slug}`,
+    version: def.version || '1.0.0',
+    types: './index.d.ts',
+    main: './index.js',
+  };
+  writeFileSync(join(packageDir, 'package.json'), JSON.stringify(pkgJson, null, 2) + '\n', 'utf-8');
+
+  // Generate a minimal index.js stub (for runtime resolution)
+  const jsStub = [
+    `// Auto-generated stub for @mm/${def.slug}`,
+    `// This package provides type information only.`,
+    `// The actual runtime comes from the workflow engine.`,
+    `module.exports = { slug: '${def.slug}', version: '${def.version || '1.0.0'}' };`,
+    '',
+  ].join('\n');
+  writeFileSync(join(packageDir, 'index.js'), jsStub, 'utf-8');
+
+  return [
+    `node_modules/@mm/${def.slug}/index.d.ts`,
+    `node_modules/@mm/${def.slug}/package.json`,
+    `node_modules/@mm/${def.slug}/index.js`,
+  ];
+}
+
+/**
+ * Install full: use decompiler to generate project files.
+ */
+function installFull(
+  def: WorkflowDefinitionResponse,
+  cwd: string,
+): string[] {
+  const outDir = join(cwd, 'packages', def.slug);
+  mkdirSync(outDir, { recursive: true });
+
+  const filesWritten: string[] = [];
+
+  // Try to use the project decompiler for full source
+  try {
+    // Dynamic import to avoid circular dependency at module level
+    // eslint-disable-next-line @typescript-eslint/no-require-imports
+    const { decompileProjectEnhanced } = require('../decompiler/project-decompiler');
+    const result = decompileProjectEnhanced(def);
+
+    for (const file of result.files) {
+      const filePath = join(outDir, file.path);
+      mkdirSync(dirname(filePath), { recursive: true });
+      writeFileSync(filePath, file.content, 'utf-8');
+      filesWritten.push(`packages/${def.slug}/${file.path}`);
+    }
+  } catch {
+    // Fallback: generate a basic source file
+    console.log('  (decompiler unavailable, generating basic source)');
+    const source = generateFullSource(def);
+    const indexPath = join(outDir, 'index.ts');
+    writeFileSync(indexPath, source, 'utf-8');
+    filesWritten.push(`packages/${def.slug}/index.ts`);
+
+    // Generate package.json
+    const pkgJson = {
+      name: `@mm/${def.slug}`,
+      version: def.version || '1.0.0',
+      main: './index.ts',
+      types: './index.ts',
+    };
+    writeFileSync(join(outDir, 'package.json'), JSON.stringify(pkgJson, null, 2) + '\n', 'utf-8');
+    filesWritten.push(`packages/${def.slug}/package.json`);
+  }
+
+  return filesWritten;
+}
+
+/**
+ * List all installed workflow packages.
+ */
+export function list(cwd?: string): ListResult {
+  const dir = cwd ?? process.cwd();
+  const entries = readLockFile(dir);
+  return { entries };
+}
+
+/**
+ * Update all installed packages (re-fetch and regenerate).
+ */
+export async function update(config: RegistryConfig, cwd?: string): Promise<InstallResult[]> {
+  const dir = cwd ?? process.cwd();
+  const entries = readLockFile(dir);
+  const slugs = Object.keys(entries);
+
+  if (slugs.length === 0) {
+    console.log('[mmrc] No packages installed. Use `mmrc install <slug>` first.');
+    return [];
+  }
+
+  console.log(`[mmrc] Updating ${slugs.length} package(s)...`);
+  const results: InstallResult[] = [];
+
+  for (const slug of slugs) {
+    const entry = entries[slug];
+    try {
+      const result = await install({
+        slug,
+        mode: entry.mode,
+        config,
+        cwd: dir,
+      });
+      results.push(result);
+    } catch (err) {
+      console.error(`  x Failed to update ${slug}: ${err instanceof Error ? err.message : String(err)}`);
+    }
+  }
+
+  console.log(`\n[mmrc] Updated ${results.length}/${slugs.length} package(s).`);
+  return results;
+}
+
+/**
+ * Remove an installed package.
+ */
+export function remove(slug: string, cwd?: string): boolean {
+  const dir = cwd ?? process.cwd();
+  const entries = readLockFile(dir);
+
+  if (!(slug in entries)) {
+    console.error(`[mmrc] Package "${slug}" is not installed.`);
+    return false;
+  }
+
+  const entry = entries[slug];
+
+  // Remove files based on mode
+  if (entry.mode === 'type-only') {
+    const packageDir = join(dir, 'node_modules', '@mm', slug);
+    if (existsSync(packageDir)) {
+      rmSync(packageDir, { recursive: true, force: true });
+    }
+  } else {
+    const packageDir = join(dir, 'packages', slug);
+    if (existsSync(packageDir)) {
+      rmSync(packageDir, { recursive: true, force: true });
+    }
+  }
+
+  // Remove lock entry
+  removeLockEntry(dir, slug);
+  console.log(`[mmrc] Removed ${slug}.`);
+
+  return true;
+}
+
+/**
+ * Search for available workflow definitions.
+ */
+export async function search(query: string, config: RegistryConfig): Promise<void> {
+  console.log(`[mmrc] Searching for "${query}"...`);
+
+  const results = await searchDefinitions(query, config);
+
+  if (results.length === 0) {
+    console.log('  No definitions found.');
+    return;
+  }
+
+  console.log(`  Found ${results.length} definition(s):\n`);
+  for (const def of results) {
+    const fieldCount = def.fields?.length ?? 0;
+    const stateCount = def.states?.length ?? 0;
+    console.log(`  ${def.slug} v${def.version || '1.0.0'} — ${def.name || '(unnamed)'}`);
+    console.log(`    ${def.category || 'workflow'} | ${fieldCount} fields, ${stateCount} states`);
+    if (def.description) {
+      console.log(`    ${def.description}`);
+    }
+    console.log('');
+  }
+}