pulse-js-framework 1.0.0 → 1.2.0

package/README.md

@@ -1,5 +1,8 @@
 # Pulse Framework
 
+[![CI](https://github.com/vincenthirtz/pulse-js-framework/actions/workflows/ci.yml/badge.svg)](https://github.com/vincenthirtz/pulse-js-framework/actions/workflows/ci.yml)
+[![Netlify Status](https://api.netlify.com/api/v1/badges/2597dac2-228a-4d3e-bea8-4e7ef8ac5c53/deploy-status)](https://app.netlify.com/projects/pulse-js/deploys)
+
 A declarative DOM framework with CSS selector-based structure and reactive pulsations.
 
 ## Features
@@ -10,6 +13,7 @@ A declarative DOM framework with CSS selector-based structure and reactive pulsa
 - **No Build Required** - Works directly in the browser
 - **Lightweight** - Minimal footprint, maximum performance
 - **Router & Store** - Built-in SPA routing and state management
+- **Mobile Apps** - Build native Android & iOS apps (zero dependencies)
 
 ## Installation
 
@@ -175,8 +179,67 @@ pulse create <name>    # Create new project
 pulse dev [port]       # Start dev server
 pulse build            # Build for production
 pulse compile <file>   # Compile .pulse file
+pulse mobile init      # Initialize mobile platforms
+pulse mobile build android|ios  # Build native app
+pulse mobile run android|ios    # Run on device/emulator
+```
+
+## Mobile Apps
+
+Build native Android and iOS apps from your Pulse project with zero external dependencies:
+
+```bash
+# Initialize mobile platforms
+pulse mobile init
+
+# Build your web app first
+pulse build
+
+# Build for Android (requires Android SDK)
+pulse mobile build android
+
+# Build for iOS (requires macOS + Xcode)
+pulse mobile build ios
+
+# Run on device/emulator
+pulse mobile run android
 ```
 
+### Native APIs
+
+Access native features in your Pulse app:
+
+```javascript
+import { createNativeStorage, NativeUI, onNativeReady } from 'pulse-js-framework/runtime/native';
+
+onNativeReady(({ platform }) => {
+  console.log(`Running on ${platform}`); // 'android', 'ios', or 'web'
+
+  // Persistent native storage with Pulse reactivity
+  const storage = createNativeStorage();
+  const count = storage.get('count', 0);
+  count.set(42); // Auto-persisted to native storage
+
+  // Native toast notification
+  NativeUI.toast('Hello from Pulse!');
+
+  // Haptic feedback
+  NativeUI.vibrate(100);
+});
+```
+
+**Available APIs:** Storage, Device Info, Network Status, Toast, Vibration, Clipboard, App Lifecycle
+
+## Examples
+
+- [Todo App](examples/todo) - Task management with filters and persistence
+- [Chat App](examples/chat) - Real-time messaging interface
+- [E-commerce](examples/ecommerce) - Shopping cart with product catalog
+- [Weather App](examples/meteo) - Weather dashboard with forecasts
+- [Router Demo](examples/router) - SPA routing with guards
+- [Store Demo](examples/store) - State management with undo/redo
+- [Admin Dashboard](examples/dashboard) - Complete admin UI with all features
+
 ## License
 
 MIT

package/cli/build.js

@@ -124,9 +124,12 @@ function processDirectory(srcDir, outDir) {
         "from './runtime.js'"
       );
 
+      // Minify
+      content = minifyJS(content);
+
       const outPath = join(outDir, file);
       writeFileSync(outPath, content);
-      console.log(`  Processed: ${file}`);
+      console.log(`  Processed & minified: ${file}`);
     } else {
       // Copy other files
       const outPath = join(outDir, file);
@@ -138,11 +141,11 @@ function processDirectory(srcDir, outDir) {
 /**
  * Bundle the runtime into a single file
  */
-function bundleRuntime(outDir) {
+function bundleRuntime(outDir, shouldMinify = true) {
   // For simplicity, we'll create a minimal runtime bundle
   // In production, you'd want to use a proper bundler
 
-  const runtimeCode = `
+  let runtimeCode = `
 // Pulse Runtime (bundled)
 ${readRuntimeFile('pulse.js')}
 ${readRuntimeFile('dom.js')}
@@ -150,8 +153,14 @@ ${readRuntimeFile('router.js')}
 ${readRuntimeFile('store.js')}
 `;
 
+  if (shouldMinify) {
+    runtimeCode = minifyJS(runtimeCode);
+    console.log('  Bundled & minified: runtime.js');
+  } else {
+    console.log('  Bundled: runtime.js');
+  }
+
   writeFileSync(join(outDir, 'assets', 'runtime.js'), runtimeCode);
-  console.log('  Bundled: runtime.js');
 }
 
 /**
@@ -173,6 +182,32 @@ function readRuntimeFile(filename) {
   return '';
 }
 
+/**
+ * Minify JavaScript code (simple minification)
+ */
+export function minifyJS(code) {
+  return code
+    // Remove single-line comments (but not URLs with //)
+    .replace(/(?<!:)\/\/.*$/gm, '')
+    // Remove multi-line comments
+    .replace(/\/\*[\s\S]*?\*\//g, '')
+    // Remove leading/trailing whitespace per line
+    .split('\n')
+    .map(line => line.trim())
+    .filter(line => line.length > 0)
+    .join('\n')
+    // Collapse multiple newlines
+    .replace(/\n{2,}/g, '\n')
+    // Remove spaces around operators (simple)
+    .replace(/\s*([{};,:])\s*/g, '$1')
+    .replace(/\s*=\s*/g, '=')
+    .replace(/\s*\(\s*/g, '(')
+    .replace(/\s*\)\s*/g, ')')
+    // Collapse remaining whitespace
+    .replace(/\s+/g, ' ')
+    .trim();
+}
+
 /**
  * Copy a directory recursively
  */
@@ -196,4 +231,88 @@ function copyDir(src, dest) {
   }
 }
 
-export default { buildProject };
+/**
+ * Preview production build
+ */
+export async function previewBuild(args) {
+  const port = parseInt(args[0]) || 4173;
+  const root = process.cwd();
+  const distDir = join(root, 'dist');
+
+  if (!existsSync(distDir)) {
+    console.error('No dist folder found. Run "pulse build" first.');
+    process.exit(1);
+  }
+
+  // Check if vite is available for preview
+  try {
+    const viteConfig = join(root, 'vite.config.js');
+    if (existsSync(viteConfig)) {
+      console.log('Using Vite preview...');
+      const { preview } = await import('vite');
+      const server = await preview({
+        root,
+        preview: { port }
+      });
+      server.printUrls();
+      return;
+    }
+  } catch (e) {
+    // Vite not available, use built-in server
+  }
+
+  // Built-in static server for dist
+  const { createServer } = await import('http');
+
+  const MIME_TYPES = {
+    '.html': 'text/html',
+    '.js': 'application/javascript',
+    '.css': 'text/css',
+    '.json': 'application/json',
+    '.png': 'image/png',
+    '.jpg': 'image/jpeg',
+    '.gif': 'image/gif',
+    '.svg': 'image/svg+xml',
+    '.ico': 'image/x-icon',
+    '.woff': 'font/woff',
+    '.woff2': 'font/woff2'
+  };
+
+  const server = createServer((req, res) => {
+    let pathname = new URL(req.url, `http://localhost:${port}`).pathname;
+
+    // SPA fallback - serve index.html for routes
+    if (pathname === '/' || !pathname.includes('.')) {
+      pathname = '/index.html';
+    }
+
+    const filePath = join(distDir, pathname);
+
+    if (existsSync(filePath) && statSync(filePath).isFile()) {
+      const ext = filePath.substring(filePath.lastIndexOf('.'));
+      const mimeType = MIME_TYPES[ext] || 'application/octet-stream';
+
+      res.writeHead(200, {
+        'Content-Type': mimeType,
+        'Cache-Control': 'public, max-age=31536000'
+      });
+      res.end(readFileSync(filePath));
+    } else {
+      res.writeHead(404, { 'Content-Type': 'text/plain' });
+      res.end('Not Found');
+    }
+  });
+
+  server.listen(port, () => {
+    console.log(`
+  Pulse Preview Server running at:
+
+    Local:   http://localhost:${port}/
+
+  Serving production build from: dist/
+  Press Ctrl+C to stop.
+    `);
+  });
+}
+
+export default { buildProject, previewBuild, minifyJS };

package/cli/index.js

@@ -11,7 +11,7 @@ import { existsSync, mkdirSync, writeFileSync, readFileSync, cpSync } from 'fs';
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
 
-const VERSION = '1.0.0';
+const VERSION = '1.2.0';
 
 // Command handlers
 const commands = {
@@ -20,7 +20,9 @@ const commands = {
   create: createProject,
   dev: runDev,
   build: runBuild,
-  compile: compileFile
+  preview: runPreview,
+  compile: compileFile,
+  mobile: runMobile
 };
 
 /**
@@ -50,19 +52,26 @@ Usage: pulse <command> [options]
 
 Commands:
   create <name>    Create a new Pulse project
-  dev              Start development server
-  build            Build for production
+  dev [port]       Start development server (default: 3000)
+  build            Build for production (minified)
+  preview [port]   Preview production build (default: 4173)
   compile <file>   Compile a .pulse file to JavaScript
+  mobile <cmd>     Mobile app commands (init, build, run)
   version          Show version number
   help             Show this help message
 
 Examples:
   pulse create my-app
   pulse dev
+  pulse dev 8080
   pulse build
+  pulse preview
+  pulse mobile init
+  pulse mobile build android
+  pulse mobile run ios
   pulse compile src/App.pulse
 
-Documentation: https://github.com/pulse-framework/pulse
+Documentation: https://github.com/vincenthirtz/pulse-js-framework
   `);
 }
 
@@ -282,6 +291,24 @@ async function runBuild(args) {
   await buildProject(args);
 }
 
+/**
+ * Preview production build
+ */
+async function runPreview(args) {
+  console.log('Starting Pulse preview server...');
+
+  const { previewBuild } = await import('./build.js');
+  await previewBuild(args);
+}
+
+/**
+ * Run mobile commands
+ */
+async function runMobile(args) {
+  const { handleMobileCommand } = await import('./mobile.js');
+  await handleMobileCommand(args);
+}
+
 /**
  * Compile a single .pulse file
  */