@mmapp/react-compiler 0.1.0-alpha.1 → 0.1.0-alpha.4

package/src/decompiler/sx-emitter.ts

@@ -1,318 +0,0 @@
-/**
- * sx-emitter — converts CanonicalStyleIR back to `sx` prop shorthand.
- *
- * This is the inverse of the sx-extractor (Appendix D). It collapses
- * expanded canonical forms back into concise sx shorthands:
- *   padding: { top: 16, right: 16, bottom: 16, left: 16 } → p: 16
- *   backgroundColor: { r: 255, g: 0, b: 0, a: 1 }        → bg: 'red'
- *   borderRadius: { topLeft: 8, ... }                       → rounded: 8
- *
- * Handles padding, margin, border-radius, colors, gap, flex, sizing,
- * opacity, overflow, position, and state overrides (hover, pressed, focus, etc.).
- */
-
-import * as t from '@babel/types';
-
-// =============================================================================
-// TRBL Helpers
-// =============================================================================
-
-interface TRBL {
-  top: number;
-  right: number;
-  bottom: number;
-  left: number;
-}
-
-function isTRBL(v: unknown): v is TRBL {
-  if (typeof v !== 'object' || v === null) return false;
-  const obj = v as Record<string, unknown>;
-  return (
-    typeof obj.top === 'number' &&
-    typeof obj.right === 'number' &&
-    typeof obj.bottom === 'number' &&
-    typeof obj.left === 'number'
-  );
-}
-
-interface FourCorners {
-  topLeft: number;
-  topRight: number;
-  bottomRight: number;
-  bottomLeft: number;
-}
-
-function isFourCorners(v: unknown): v is FourCorners {
-  if (typeof v !== 'object' || v === null) return false;
-  const obj = v as Record<string, unknown>;
-  return (
-    typeof obj.topLeft === 'number' &&
-    typeof obj.topRight === 'number' &&
-    typeof obj.bottomRight === 'number' &&
-    typeof obj.bottomLeft === 'number'
-  );
-}
-
-// =============================================================================
-// Color Helpers
-// =============================================================================
-
-interface TokenRef {
-  kind: 'token-ref';
-  name: string;
-}
-
-function isTokenRef(v: unknown): v is TokenRef {
-  if (typeof v !== 'object' || v === null) return false;
-  return (v as Record<string, unknown>).kind === 'token-ref';
-}
-
-// =============================================================================
-// Spacing Shorthand Collapse
-// =============================================================================
-
-/**
- * Collapses TRBL values into shorthand sx properties.
- * Returns an array of AST object properties.
- *
- * All uniform:        p: 16
- * Symmetric vertical: py: 8, px: 16
- * All different:      pt: 8, pr: 16, pb: 12, pl: 24
- */
-function emitSpacingShorthand(
-  prefix: 'p' | 'm',
-  trbl: TRBL,
-): t.ObjectProperty[] {
-  const { top, right, bottom, left } = trbl;
-
-  if (top === right && right === bottom && bottom === left) {
-    // All uniform → single shorthand
-    return [prop(prefix, top)];
-  }
-
-  if (top === bottom && left === right) {
-    // Symmetric → y/x shorthands
-    return [
-      prop(`${prefix}y`, top),
-      prop(`${prefix}x`, left),
-    ];
-  }
-
-  // All different → individual sides
-  return [
-    prop(`${prefix}t`, top),
-    prop(`${prefix}r`, right),
-    prop(`${prefix}b`, bottom),
-    prop(`${prefix}l`, left),
-  ];
-}
-
-// =============================================================================
-// Radius Shorthand Collapse
-// =============================================================================
-
-function emitRadiusShorthand(corners: FourCorners): t.ObjectProperty[] {
-  const { topLeft, topRight, bottomRight, bottomLeft } = corners;
-
-  if (topLeft === topRight && topRight === bottomRight && bottomRight === bottomLeft) {
-    return [prop('rounded', topLeft)];
-  }
-
-  return [
-    prop('roundedTL', topLeft),
-    prop('roundedTR', topRight),
-    prop('roundedBR', bottomRight),
-    prop('roundedBL', bottomLeft),
-  ];
-}
-
-// =============================================================================
-// Color Emission
-// =============================================================================
-
-function emitColorValue(color: unknown): t.Expression {
-  if (isTokenRef(color)) {
-    return t.stringLiteral(`token:${color.name}`);
-  }
-
-  if (typeof color === 'string') {
-    return t.stringLiteral(color);
-  }
-
-  // RGBA object → css string
-  if (typeof color === 'object' && color !== null) {
-    const c = color as Record<string, unknown>;
-    if (typeof c.r === 'number' && typeof c.g === 'number' && typeof c.b === 'number') {
-      const a = typeof c.a === 'number' ? c.a : 1;
-      if (a === 1) {
-        const hex = `#${hexByte(c.r as number)}${hexByte(c.g as number)}${hexByte(c.b as number)}`;
-        return t.stringLiteral(hex);
-      }
-      return t.stringLiteral(`rgba(${c.r}, ${c.g}, ${c.b}, ${a})`);
-    }
-  }
-
-  return t.stringLiteral('inherit');
-}
-
-function hexByte(n: number): string {
-  return Math.round(n).toString(16).padStart(2, '0');
-}
-
-// =============================================================================
-// AST Helpers
-// =============================================================================
-
-function prop(key: string, value: unknown): t.ObjectProperty {
-  return t.objectProperty(t.identifier(key), valueToExpression(value));
-}
-
-/**
- * Converts a plain JS value to a Babel AST expression node.
- */
-export function valueToExpression(value: unknown): t.Expression {
-  if (typeof value === 'string') return t.stringLiteral(value);
-  if (typeof value === 'number') return t.numericLiteral(value);
-  if (typeof value === 'boolean') return t.booleanLiteral(value);
-  if (value === null) return t.nullLiteral();
-  if (value === undefined) return t.identifier('undefined');
-
-  if (Array.isArray(value)) {
-    return t.arrayExpression(value.map(v => valueToExpression(v)));
-  }
-
-  if (typeof value === 'object') {
-    const entries = Object.entries(value as Record<string, unknown>);
-    return t.objectExpression(
-      entries.map(([k, v]) =>
-        t.objectProperty(t.identifier(k), valueToExpression(v))
-      )
-    );
-  }
-
-  return t.identifier('undefined');
-}
-
-// =============================================================================
-// State Override Keys
-// =============================================================================
-
-const STATE_TO_SX_KEY: Record<string, string> = {
-  hovered: 'hover',
-  pressed: 'pressed',
-  focused: 'focus',
-  selected: 'selected',
-  disabled: 'disabled',
-};
-
-// =============================================================================
-// Main: emitSxProp
-// =============================================================================
-
-/**
- * Converts a CanonicalStyleIR (stored as Record<string, unknown> on IRExperienceNode)
- * into a JSX `sx` attribute with collapsed shorthand properties.
- *
- * Returns null if the style is empty or undefined.
- */
-export function emitSxProp(style: Record<string, unknown>): t.JSXAttribute | null {
-  if (!style || typeof style !== 'object') return null;
-
-  const props: t.ObjectProperty[] = [];
-
-  // Padding shorthand
-  if (style.padding && isTRBL(style.padding)) {
-    props.push(...emitSpacingShorthand('p', style.padding));
-  }
-
-  // Margin shorthand
-  if (style.margin && isTRBL(style.margin)) {
-    props.push(...emitSpacingShorthand('m', style.margin));
-  }
-
-  // Background color → bg
-  if (style.backgroundColor) {
-    props.push(t.objectProperty(
-      t.identifier('bg'),
-      emitColorValue(style.backgroundColor)
-    ));
-  }
-
-  // Border radius → rounded
-  if (style.borderRadius && isFourCorners(style.borderRadius)) {
-    props.push(...emitRadiusShorthand(style.borderRadius));
-  }
-
-  // Gap
-  if (typeof style.gap === 'number') {
-    props.push(prop('gap', style.gap));
-  }
-
-  // Flex direction
-  if (typeof style.flexDirection === 'string') {
-    props.push(prop('direction', style.flexDirection));
-  }
-
-  // Justify / align
-  if (typeof style.justifyContent === 'string') {
-    props.push(prop('justify', style.justifyContent));
-  }
-  if (typeof style.alignItems === 'string') {
-    props.push(prop('align', style.alignItems));
-  }
-
-  // Sizing
-  if (style.width !== undefined) props.push(prop('w', style.width));
-  if (style.height !== undefined) props.push(prop('h', style.height));
-  if (style.minWidth !== undefined) props.push(prop('minW', style.minWidth));
-  if (style.minHeight !== undefined) props.push(prop('minH', style.minHeight));
-  if (style.maxWidth !== undefined) props.push(prop('maxW', style.maxWidth));
-  if (style.maxHeight !== undefined) props.push(prop('maxH', style.maxHeight));
-
-  // Opacity
-  if (typeof style.opacity === 'number') {
-    props.push(prop('opacity', style.opacity));
-  }
-
-  // Color
-  if (style.color) {
-    props.push(t.objectProperty(
-      t.identifier('color'),
-      emitColorValue(style.color)
-    ));
-  }
-
-  // Overflow
-  if (typeof style.overflow === 'string') {
-    props.push(prop('overflow', style.overflow));
-  }
-
-  // Position
-  if (typeof style.position === 'string') {
-    props.push(prop('position', style.position));
-  }
-
-  // State overrides → hover, pressed, focus, etc.
-  if (typeof style.states === 'object' && style.states !== null) {
-    for (const [state, override] of Object.entries(style.states as Record<string, unknown>)) {
-      const sxKey = STATE_TO_SX_KEY[state] || state;
-      if (typeof override === 'object' && override !== null) {
-        // Recursively emit the override as an sx sub-object
-        const subProp = emitSxProp(override as Record<string, unknown>);
-        if (subProp && t.isJSXExpressionContainer(subProp.value) && t.isObjectExpression(subProp.value.expression)) {
-          props.push(t.objectProperty(
-            t.identifier(sxKey),
-            subProp.value.expression
-          ));
-        }
-      }
-    }
-  }
-
-  if (props.length === 0) return null;
-
-  return t.jsxAttribute(
-    t.jsxIdentifier('sx'),
-    t.jsxExpressionContainer(t.objectExpression(props))
-  );
-}

package/src/decompiler/workspace-hydrator.ts

@@ -1,189 +0,0 @@
-/**
- * workspace-hydrator.ts — writes decompiled files to disk.
- *
- * hydrateWorkspace(path, definition) decompiles a workflow definition
- * into files and writes them to the given directory. It preserves
- * user-modified files by comparing content hashes before overwriting.
- */
-
-import { createHash } from 'crypto';
-import { existsSync, mkdirSync, readFileSync, writeFileSync } from 'fs';
-import { dirname, join } from 'path';
-import type { DecompilerInput } from './index';
-import { decompileProjectEnhanced } from './project-decompiler';
-import type { EnhancedDecompileResult } from './project-decompiler';
-
-// =============================================================================
-// Types
-// =============================================================================
-
-/** Map of relative path to generated content. */
-export type FileMap = Map<string, string>;
-
-/** Result of a workspace hydration. */
-export interface HydrationResult {
-  /** Files that were written (created or updated). */
-  written: string[];
-  /** Files that were skipped (user-modified). */
-  skipped: string[];
-  /** Files that were unchanged. */
-  unchanged: string[];
-  /** The decompile result used. */
-  decompileResult: EnhancedDecompileResult;
-}
-
-/** Hash manifest for tracking generated files. */
-interface HashManifest {
-  /** Map of relative path to content hash at generation time. */
-  files: Record<string, string>;
-  /** Timestamp of last hydration. */
-  lastHydrated: string;
-  /** Slug of the source definition. */
-  slug: string;
-}
-
-const MANIFEST_FILE = '.mm-manifest.json';
-
-// =============================================================================
-// Hash Utilities
-// =============================================================================
-
-function sha256(content: string): string {
-  return createHash('sha256').update(content, 'utf8').digest('hex');
-}
-
-function loadManifest(workspacePath: string): HashManifest | null {
-  const manifestPath = join(workspacePath, MANIFEST_FILE);
-  if (!existsSync(manifestPath)) return null;
-  try {
-    const raw = readFileSync(manifestPath, 'utf-8');
-    return JSON.parse(raw) as HashManifest;
-  } catch {
-    return null;
-  }
-}
-
-function saveManifest(workspacePath: string, manifest: HashManifest): void {
-  const manifestPath = join(workspacePath, MANIFEST_FILE);
-  writeFileSync(manifestPath, JSON.stringify(manifest, null, 2), 'utf-8');
-}
-
-// =============================================================================
-// File Writing
-// =============================================================================
-
-/**
- * Determines whether a file has been modified by the user since last hydration.
- *
- * Returns true if the file exists and its current content hash differs from
- * the hash stored in the manifest (meaning the user changed it).
- */
-function isUserModified(
-  filePath: string,
-  manifest: HashManifest | null,
-  relativePath: string,
-): boolean {
-  if (!existsSync(filePath)) return false;
-  if (!manifest) return true; // No manifest = first run, treat existing files as user-modified
-
-  const storedHash = manifest.files[relativePath];
-  if (!storedHash) return true; // File not in manifest = user created it
-
-  const currentContent = readFileSync(filePath, 'utf-8');
-  const currentHash = sha256(currentContent);
-
-  // If current hash matches stored hash, the file hasn't been touched by the user
-  return currentHash !== storedHash;
-}
-
-function ensureDir(filePath: string): void {
-  const dir = dirname(filePath);
-  if (!existsSync(dir)) {
-    mkdirSync(dir, { recursive: true });
-  }
-}
-
-// =============================================================================
-// Main: hydrateWorkspace
-// =============================================================================
-
-/**
- * Decompiles a workflow definition and writes the resulting files to disk.
- *
- * Preserves user-modified files by checking content hashes against the
- * stored manifest from the previous hydration.
- *
- * @param workspacePath - Absolute path to the target directory.
- * @param definition - The workflow definition to decompile.
- * @returns A HydrationResult describing what was written, skipped, or unchanged.
- */
-export function hydrateWorkspace(
-  workspacePath: string,
-  definition: DecompilerInput,
-): HydrationResult {
-  // Decompile
-  const decompileResult = decompileProjectEnhanced(definition);
-
-  // Load existing manifest
-  const oldManifest = loadManifest(workspacePath);
-
-  // Track results
-  const written: string[] = [];
-  const skipped: string[] = [];
-  const unchanged: string[] = [];
-  const newManifest: HashManifest = {
-    files: {},
-    lastHydrated: new Date().toISOString(),
-    slug: definition.slug,
-  };
-
-  // Write each file
-  for (const file of decompileResult.files) {
-    const fullPath = join(workspacePath, file.path);
-    const contentHash = sha256(file.content);
-    newManifest.files[file.path] = contentHash;
-
-    // Check if file exists and was user-modified
-    if (isUserModified(fullPath, oldManifest, file.path)) {
-      skipped.push(file.path);
-      // Keep the old hash in manifest so we don't overwrite next time either
-      if (oldManifest?.files[file.path]) {
-        newManifest.files[file.path] = oldManifest.files[file.path];
-      }
-      continue;
-    }
-
-    // Check if content is unchanged
-    if (existsSync(fullPath)) {
-      const existing = readFileSync(fullPath, 'utf-8');
-      if (sha256(existing) === contentHash) {
-        unchanged.push(file.path);
-        continue;
-      }
-    }
-
-    // Write the file
-    ensureDir(fullPath);
-    writeFileSync(fullPath, file.content, 'utf-8');
-    written.push(file.path);
-  }
-
-  // Save updated manifest
-  ensureDir(join(workspacePath, MANIFEST_FILE));
-  saveManifest(workspacePath, newManifest);
-
-  return { written, skipped, unchanged, decompileResult };
-}
-
-/**
- * Returns a FileMap of all decompiled files without writing to disk.
- * Useful for previewing output or testing.
- */
-export function decompileToFileMap(definition: DecompilerInput): FileMap {
-  const result = decompileProjectEnhanced(definition);
-  const map: FileMap = new Map();
-  for (const file of result.files) {
-    map.set(file.path, file.content);
-  }
-  return map;
-}