plusui-native 0.2.0

package/README.md

@@ -0,0 +1,162 @@
+# PlusUI
+
+Build C++ desktop apps with web tech. Like Tauri, but for C++.
+
+## Quick Start
+
+```bash
+# Install CLI globally
+npm install -g plusui-cli
+
+# Create a new project
+plusui create myapp
+cd myapp
+
+# Install dependencies
+npm install
+
+# Run in development mode (with HMR)
+npm run dev
+
+# Build for production
+npm run build
+```
+
+## Project Structure
+
+```
+myapp/
+├── src/
+│   ├── main.cpp          # C++ backend
+│   ├── index.html        # Frontend entry
+│   └── ...
+├── plusui-core/         # Framework (git submodule)
+├── package.json
+└── CMakeLists.txt
+```
+
+## C++ API
+
+```cpp
+#include <plusui/app.hpp>
+
+int main() {
+    auto wv = plusui::createApp()
+        .title("My App")
+        .width(1024)
+        .height(768)
+        .build();
+
+    // Navigate to frontend
+    wv.navigate("file://${CMAKE_CURRENT_SOURCE_DIR}/src/index.html");
+
+    // Listen for events from frontend
+    wv.on("greet", [](const std::string& name) {
+        std::cout << "Hello, " << name << "!" << std::endl;
+    });
+
+    // Run the app
+    plusui::createApp().run();
+    return 0;
+}
+```
+
+## TypeScript API
+
+```typescript
+import { createPlusUI } from '@plusui/core';
+
+const plusui = createPlusUI();
+
+// Call C++ function
+const result = await plusui.invoke<number>('add', [1, 2]);
+
+// Listen for events
+plusui.on('server-event', (data) => {
+    console.log('Received:', data);
+});
+
+// Emit event to C++
+plusui.emit('greet', 'World');
+
+// One-time listener
+plusui.once('ready', () => {
+    console.log('App ready!');
+});
+```
+
+## Events vs Invoke
+
+| Method | Direction | Use Case |
+|--------|-----------|----------|
+| `invoke()` | Frontend → Backend | Request/response |
+| `emit()` | Frontend → Backend | Fire-and-forget |
+| `on()` | Bidirectional | Subscriptions |
+
+## Configuration
+
+```typescript
+const plusui = createPlusUI({
+    title: 'My App',
+    width: 800,
+    height: 600,
+    resizable: true,
+    devtools: true,
+});
+```
+
+## Building
+
+```bash
+# Development (auto-rebuild + HMR)
+npm run dev
+
+# Production build
+npm run build
+
+# Run built app
+npm run start
+
+# Regenerate bindings manually (app-level)
+npm run bind
+```
+
+Bindgen runs per app project (typically `src/features` -> `src/Bindings_Generated`).
+`dev` and all `build` commands auto-refresh bindings first when `src/features` exists.
+
+## Requirements
+
+- **Windows**: WebView2 Runtime (pre-installed on Win10/11)
+- **macOS**: Xcode Command Line Tools
+- **Linux**: WebKit2GTK (`sudo apt install libwebkit2gtk-4.0-dev`)
+
+## Architecture
+
+```
+┌─────────────────────────────────────┐
+│           Frontend (Web)            │
+│    React / Vue / Svelte / Vanilla   │
+└─────────────────┬───────────────────┘
+                  │ Events / Invoke
+┌─────────────────▼───────────────────┐
+│         TypeScript SDK              │
+│       @plusui/core                 │
+└─────────────────┬───────────────────┘
+                  │ JSON IPC
+┌─────────────────▼───────────────────┐
+│         C++ Core                    │
+│    plusui::createApp()             │
+│         webview.h                   │
+└─────────────────┬───────────────────┘
+                  │
+┌─────────────────▼───────────────────┐
+│        Native WebView               │
+│   Windows: WebView2 (Edge)         │
+│   macOS: WKWebView (WebKit)        │
+│   Linux: WebKitGTK                 │
+└─────────────────────────────────────┘
+```
+
+## License
+
+MIT

package/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "plusui-native",
+  "version": "0.2.0",
+  "description": "PlusUI CLI - Build C++ desktop apps with web tech",
+  "main": "src/index.js",
+  "type": "module",
+  "bin": {
+    "plusui": "./src/index.js"
+  },
+  "scripts": {
+    "start": "node src/index.js",
+    "dev": "node src/index.js dev"
+  },
+  "keywords": ["desktop", "cpp", "webview", "gui"],
+  "license": "MIT",
+  "dependencies": {
+    "chokidar": "^3.5.3",
+    "vite": "^5.0.0",
+    "commander": "^12.0.0",
+    "chalk": "^5.3.0",
+    "ora": "^8.0.0",
+    "semver": "^7.6.0",
+    "which": "^4.0.0",
+    "execa": "^8.0.1",
+    "@plusui-native/builder": "*",
+    "@plusui-native/bindgen": "*"
+  },
+  "peerDependencies": {
+    "plusui-native-core": "*",
+    "plusui-native-bindgen": "*"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "preferGlobal": true
+}

package/src/assets/icon-generator.js

@@ -0,0 +1,251 @@
+#!/usr/bin/env node
+
+/**
+ * Icon Generator for PlusUI
+ * Generates all platform-specific icon formats from a single source icon
+ * 
+ * Supports:
+ * - Windows: .ico (16x16, 32x32, 48x48, 64x64, 128x128, 256x256)
+ * - macOS: .icns (16x16@1x/2x, 32x32@1x/2x, 128x128@1x/2x, 256x256@1x/2x, 512x512@1x/2x)
+ * - Linux: PNG (16x16, 32x32, 48x48, 64x64, 128x128, 256x256, 512x512)
+ * - Tray icons: 16x16, 32x32 (for system tray)
+ * - Taskbar/Title bar: 32x32, 48x48
+ */
+
+import { readFile, writeFile, mkdir } from 'fs/promises';
+import { existsSync } from 'fs';
+import { join, basename, extname } from 'path';
+import { execSync } from 'child_process';
+
+const SIZES = {
+    windows: [16, 32, 48, 64, 128, 256],
+    macos: [16, 32, 128, 256, 512],
+    linux: [16, 32, 48, 64, 128, 256, 512],
+    tray: [16, 32],
+    taskbar: [32, 48],
+};
+
+class IconGenerator {
+    constructor() {
+        this.hasSharp = this.checkSharp();
+        this.hasImageMagick = this.checkImageMagick();
+    }
+
+    checkSharp() {
+        try {
+            require.resolve('sharp');
+            return true;
+        } catch {
+            return false;
+        }
+    }
+
+    checkImageMagick() {
+        try {
+            execSync('magick -version', { stdio: 'ignore' });
+            return true;
+        } catch {
+            try {
+                execSync('convert -version', { stdio: 'ignore' });
+                return true;
+            } catch {
+                return false;
+            }
+        }
+    }
+
+    async checkDependencies() {
+        if (!this.hasSharp && !this.hasImageMagick) {
+            console.log('⚠️  No image processor found.');
+            console.log('\nOption 1 (Recommended): Install Sharp');
+            console.log('  npm install sharp --save-dev');
+            console.log('\nOption 2: Install ImageMagick');
+            console.log('  Windows: winget install ImageMagick.ImageMagick');
+            console.log('  macOS: brew install imagemagick');
+            console.log('  Linux: sudo apt install imagemagick');
+            return false;
+        }
+        return true;
+    }
+
+    async resizeWithSharp(inputPath, outputPath, size) {
+        const sharp = require('sharp');
+        await sharp(inputPath)
+            .resize(size, size, {
+                fit: 'contain',
+                background: { r: 0, g: 0, b: 0, alpha: 0 }
+            })
+            .png()
+            .toFile(outputPath);
+    }
+
+    async resizeWithImageMagick(inputPath, outputPath, size) {
+        const cmd = this.hasImageMagick && execSync('which magick 2>/dev/null', { encoding: 'utf8' }).trim()
+            ? 'magick'
+            : 'convert';
+        
+        execSync(
+            `${cmd} "${inputPath}" -resize ${size}x${size} -background none -gravity center -extent ${size}x${size} "${outputPath}"`,
+            { stdio: 'ignore' }
+        );
+    }
+
+    async resize(inputPath, outputPath, size) {
+        if (this.hasSharp) {
+            await this.resizeWithSharp(inputPath, outputPath, size);
+        } else {
+            await this.resizeWithImageMagick(inputPath, outputPath, size);
+        }
+    }
+
+    async generateWindowsIco(inputPath, outputPath) {
+        console.log('  📦 Generating Windows .ico...');
+        const tempDir = join(process.cwd(), '.icon-temp');
+        await mkdir(tempDir, { recursive: true });
+
+        const pngPaths = [];
+        for (const size of SIZES.windows) {
+            const pngPath = join(tempDir, `icon_${size}.png`);
+            await this.resize(inputPath, pngPath, size);
+            pngPaths.push(pngPath);
+        }
+
+        // Try to use ImageMagick to create .ico
+        if (this.hasImageMagick) {
+            try {
+                const cmd = execSync('which magick 2>/dev/null', { encoding: 'utf8' }).trim() ? 'magick' : 'convert';
+                execSync(`${cmd} ${pngPaths.join(' ')} "${outputPath}"`, { stdio: 'ignore' });
+                console.log('     ✓ Created app.ico');
+            } catch (e) {
+                console.log('     ⚠️  Could not create .ico, using PNG fallback');
+                // Copy largest PNG as fallback
+                const fallback = pngPaths[pngPaths.length - 1];
+                await writeFile(outputPath.replace('.ico', '.png'), await readFile(fallback));
+            }
+        } else {
+            // Just copy PNGs
+            for (let i = 0; i < SIZES.windows.length; i++) {
+                const size = SIZES.windows[i];
+                const dest = outputPath.replace('.ico', `_${size}.png`);
+                await writeFile(dest, await readFile(pngPaths[i]));
+                console.log(`     ✓ Created icon_${size}.png`);
+            }
+        }
+
+        // Cleanup temp
+        for (const p of pngPaths) {
+            try { await rm(p); } catch {}
+        }
+    }
+
+    async generateMacOSIcns(inputPath, outputPath) {
+        console.log('  🍎 Generating macOS .icns...');
+        const iconsetDir = outputPath.replace('.icns', '.iconset');
+        await mkdir(iconsetDir, { recursive: true });
+
+        const sizes = [
+            [16, 'icon_16x16.png'],
+            [32, 'icon_16x16@2x.png'],
+            [32, 'icon_32x32.png'],
+            [64, 'icon_32x32@2x.png'],
+            [128, 'icon_128x128.png'],
+            [256, 'icon_128x128@2x.png'],
+            [256, 'icon_256x256.png'],
+            [512, 'icon_256x256@2x.png'],
+            [512, 'icon_512x512.png'],
+            [1024, 'icon_512x512@2x.png'],
+        ];
+
+        for (const [size, filename] of sizes) {
+            const dest = join(iconsetDir, filename);
+            await this.resize(inputPath, dest, size);
+        }
+
+        // Try to create .icns on macOS
+        if (process.platform === 'darwin') {
+            try {
+                execSync(`iconutil -c icns "${iconsetDir}" -o "${outputPath}"`, { stdio: 'ignore' });
+                console.log('     ✓ Created app.icns');
+            } catch {
+                console.log('     ⚠️  Could not create .icns, keeping .iconset folder');
+            }
+        } else {
+            console.log('     ℹ️  .iconset folder created (use iconutil on macOS to convert)');
+        }
+    }
+
+    async generateLinuxIcons(inputPath, outputDir) {
+        console.log('  🐧 Generating Linux icons...');
+        await mkdir(outputDir, { recursive: true });
+
+        for (const size of SIZES.linux) {
+            const dest = join(outputDir, `icon_${size}x${size}.png`);
+            await this.resize(inputPath, dest, size);
+            console.log(`     ✓ Created icon_${size}x${size}.png`);
+        }
+    }
+
+    async generateTrayIcons(inputPath, outputDir) {
+        console.log('  🔔 Generating tray icons...');
+        await mkdir(outputDir, { recursive: true });
+
+        for (const size of SIZES.tray) {
+            const dest = join(outputDir, `tray_${size}x${size}.png`);
+            await this.resize(inputPath, dest, size);
+            console.log(`     ✓ Created tray_${size}x${size}.png`);
+        }
+    }
+
+    async generate(inputPath, outputBase) {
+        console.log(`\n🎨 Generating icons from: ${basename(inputPath)}\n`);
+
+        if (!existsSync(inputPath)) {
+            throw new Error(`Input icon not found: ${inputPath}`);
+        }
+
+        const hasDeps = await this.checkDependencies();
+        if (!hasDeps) {
+            throw new Error('Missing dependencies');
+        }
+
+        // Create output directories
+        const dirs = {
+            windows: join(outputBase, 'windows'),
+            macos: join(outputBase, 'macos'),
+            linux: join(outputBase, 'linux'),
+            tray: join(outputBase, 'tray'),
+        };
+
+        for (const dir of Object.values(dirs)) {
+            await mkdir(dir, { recursive: true });
+        }
+
+        // Generate platform-specific icons
+        await this.generateWindowsIco(inputPath, join(dirs.windows, 'app.ico'));
+        await this.generateMacOSIcns(inputPath, join(dirs.macos, 'app.icns'));
+        await this.generateLinuxIcons(inputPath, dirs.linux);
+        await this.generateTrayIcons(inputPath, dirs.tray);
+
+        console.log('\n✨ Icon generation complete!\n');
+        console.log('Generated icons:');
+        console.log(`  📁 ${dirs.windows}`);
+        console.log(`  📁 ${dirs.macos}`);
+        console.log(`  📁 ${dirs.linux}`);
+        console.log(`  📁 ${dirs.tray}`);
+    }
+}
+
+// CLI
+if (import.meta.url === `file://${process.argv[1]}`) {
+    const args = process.argv.slice(2);
+    const inputPath = args[0] || join(process.cwd(), 'assets', 'icon.png');
+    const outputBase = args[1] || join(process.cwd(), 'assets', 'icons');
+
+    const generator = new IconGenerator();
+    generator.generate(inputPath, outputBase).catch(err => {
+        console.error('❌ Error:', err.message);
+        process.exit(1);
+    });
+}
+
+export { IconGenerator };