plusui-native 0.2.0

package/templates/solid/frontend/src/styles/app.css

@@ -0,0 +1,140 @@
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+body {
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  color: #fff;
+  min-height: 100vh;
+}
+
+.app {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+}
+
+.app-header {
+  padding: 3rem 2rem;
+  text-align: center;
+}
+
+.app-header h1 {
+  font-size: 3rem;
+  font-weight: 700;
+  margin-bottom: 0.5rem;
+  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
+}
+
+.app-header p {
+  font-size: 1.2rem;
+  opacity: 0.9;
+}
+
+.app-content {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 2rem;
+  gap: 2rem;
+}
+
+.card {
+  background: rgba(255, 255, 255, 0.1);
+  backdrop-filter: blur(10px);
+  border-radius: 1rem;
+  padding: 2rem;
+  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  min-width: 400px;
+  text-align: center;
+}
+
+.card h2 {
+  margin-bottom: 1rem;
+  font-size: 1.3rem;
+  font-weight: 600;
+}
+
+.button-group {
+  display: flex;
+  gap: 0.75rem;
+  justify-content: center;
+  flex-wrap: wrap;
+}
+
+.button {
+  background: rgba(255, 255, 255, 0.2);
+  color: #fff;
+  border: 2px solid rgba(255, 255, 255, 0.3);
+  padding: 0.75rem 1.5rem;
+  font-size: 1rem;
+  font-weight: 600;
+  border-radius: 0.5rem;
+  cursor: pointer;
+  transition: all 0.3s ease;
+}
+
+.button:hover {
+  background: rgba(255, 255, 255, 0.3);
+  transform: translateY(-2px);
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
+}
+
+.button:active {
+  transform: translateY(0);
+}
+
+.button-danger {
+  background: rgba(231, 76, 60, 0.6);
+  border-color: rgba(231, 76, 60, 0.8);
+}
+
+.button-danger:hover {
+  background: rgba(231, 76, 60, 0.8);
+}
+
+.info-text {
+  margin-top: 1rem;
+  padding: 0.75rem 1rem;
+  background: rgba(255, 255, 255, 0.15);
+  border-radius: 0.5rem;
+  font-size: 1rem;
+  animation: fadeIn 0.3s ease;
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(-10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.info {
+  text-align: center;
+  opacity: 0.8;
+}
+
+.info p {
+  margin: 0.5rem 0;
+}
+
+.info code {
+  background: rgba(0, 0, 0, 0.2);
+  padding: 0.2rem 0.5rem;
+  border-radius: 0.25rem;
+  font-family: 'Courier New', monospace;
+}

package/templates/solid/frontend/tsconfig.json

@@ -0,0 +1,22 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "skipLibCheck": true,
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "preserve",
+    "jsxImportSource": "solid-js",
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true
+  },
+  "include": ["src"],
+  "references": [{ "path": "./tsconfig.node.json" }]
+}

package/templates/solid/frontend/tsconfig.node.json

@@ -0,0 +1,11 @@
+{
+  "compilerOptions": {
+    "composite": true,
+    "skipLibCheck": true,
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "allowSyntheticDefaultImports": true,
+    "strict": true
+  },
+  "include": ["vite.config.ts"]
+}

package/templates/solid/frontend/vite.config.ts

@@ -0,0 +1,14 @@
+import { defineConfig } from 'vite';
+import solid from 'vite-plugin-solid';
+
+export default defineConfig({
+  plugins: [solid()],
+  build: {
+    outDir: 'dist',
+    emptyOutDir: true,
+  },
+  server: {
+    port: 5173,
+    strictPort: true,
+  },
+});

package/templates/solid/main.cpp.template

@@ -0,0 +1,192 @@
+#include <plusui/app.hpp>
+#include <plusui/window.hpp>
+#include <iostream>
+#include "generated/assets.h"
+
+// ============================================================================
+// {{PROJECT_NAME}} - Configuration
+// ============================================================================
+// Change these values to configure your app. All options are true/false toggles
+// or simple values. Easy to customize without digging through code.
+// ============================================================================
+
+// ----------------------------------------------------------------------------
+// APP CONFIGURATION (Application-level settings)
+// ----------------------------------------------------------------------------
+struct AppConfig {
+    // --- Identity ---
+    std::string name = "{{PROJECT_NAME}}";    // Your app name (used for window title, etc.)
+    std::string version = "0.1.0";
+    
+    // --- App Type ---
+    bool headless = false;        // No window, background app only
+    bool singleInstance = true;   // Only allow one instance of the app
+    
+    // --- Startup ---
+    bool autoStart = false;       // Launch on system startup
+    bool hiddenOnStartup = false; // Start hidden
+    
+    // --- Security ---
+    bool webSecurity = true;      // Enable web security (CORS, etc.)
+    bool allowFileAccess = false; // Allow file:// URLs
+} appConfig;
+
+// ----------------------------------------------------------------------------
+// WINDOW CONFIGURATION (Window appearance and behavior)
+// ----------------------------------------------------------------------------
+struct WindowConfig {
+    // --- Size & Position ---
+    int width = 1200;
+    int height = 800;
+    int minWidth = 400;           // Minimum window width
+    int minHeight = 300;          // Minimum window height
+    int maxWidth = 0;             // 0 = no limit
+    int maxHeight = 0;            // 0 = no limit
+    bool centerOnStartup = true;  // Center window on launch
+    
+    // --- Appearance ---
+    bool showTitlebar = true;     // Show native titlebar (set false for frameless)
+    bool showBorder = true;       // Show window border
+    bool transparent = false;     // Transparent window background
+    double opacity = 1.0;         // Window opacity 0.0 (invisible) to 1.0 (solid)
+    
+    // --- Behavior ---
+    bool resizable = true;        // Allow user to resize window
+    bool minimizable = true;      // Show minimize button
+    bool maximizable = true;      // Show maximize button
+    bool closable = true;         // Show close button
+    bool alwaysOnTop = false;     // Keep window above all others
+    bool showInTaskbar = true;    // Show in taskbar (false = hidden from taskbar)
+    bool fullscreen = false;      // Start in fullscreen mode
+    
+    // --- Dev Tools ---
+    bool devTools = true;         // Enable DevTools (F12, right-click inspect)
+    bool contextMenu = true;      // Enable right-click context menu
+    
+    // --- WebView ---
+    bool scrollbars = false;      // Show scrollbars in webview (false = hidden)
+} windowConfig;
+
+// ----------------------------------------------------------------------------
+// SERVICES CONFIGURATION (Optional features)
+// ----------------------------------------------------------------------------
+struct ServicesConfig {
+    bool enableClipboard = true;  // Enable clipboard read/write from frontend
+    bool enableDisplay = true;    // Enable multi-display detection
+    bool enableKeyboard = true;   // Enable keyboard shortcuts/hotkeys
+    bool enableMenu = true;       // Enable custom menu bar
+} servicesConfig;
+
+// ============================================================================
+// WEBGPU CONFIGURATION (Optional - 3D Graphics & GPU Compute)
+// ============================================================================
+// WebGPU provides native GPU acceleration for rendering and compute shaders.
+// Requires: PLUSUI_ENABLE_WEBGPU build flag
+//
+// Usage in frontend:
+//   const adapter = await navigator.gpu.requestAdapter();
+//   const device = await adapter.requestDevice();
+//   const canvas = document.querySelector('canvas');
+//   const context = canvas.getContext('webgpu');
+//   context.configure({ device, format: 'bgra8unorm' });
+//
+// See: https://www.w3.org/TR/webgpu/ for full API documentation
+// ============================================================================
+struct WebGPUConfig {
+    bool enabled = false;         // Enable WebGPU support
+    bool validateAPI = true;      // Enable validation in debug builds
+    bool verbose = false;         // Enable verbose logging for debugging
+} webgpuConfig;
+
+// ============================================================================
+// MAIN - Application Entry Point
+// ============================================================================
+int main() {
+    // Use your app name as the variable name
+    auto {{PROJECT_NAME_LOWER}} = plusui::createApp()
+        .title(appConfig.name)
+        .width(windowConfig.width)
+        .height(windowConfig.height)
+        .centered(windowConfig.centerOnStartup)
+        .resizable(windowConfig.resizable)
+        .decorations(windowConfig.showTitlebar && windowConfig.showBorder)
+        .transparent(windowConfig.transparent)
+        .devtools(windowConfig.devTools)
+        .alwaysOnTop(windowConfig.alwaysOnTop)
+        .skipTaskbar(!windowConfig.showInTaskbar)
+        .scrollbars(windowConfig.scrollbars);
+    
+    auto mainWindow = {{PROJECT_NAME_LOWER}}.build();
+    
+    // Set app icon from embedded assets
+    mainWindow.window().setIconFromMemory(ASSET_ICON_PNG, ASSET_ICON_PNG_LEN);
+    
+    // Set tray icon from embedded assets
+    mainWindow.tray().setIconFromMemory(ASSET_ICON_PNG, ASSET_ICON_PNG_LEN);
+    mainWindow.tray().setTooltip(appConfig.name);
+    mainWindow.tray().setVisible(true);
+    
+    // Apply additional settings
+    if (windowConfig.opacity < 1.0) {
+        mainWindow.window().setTransparency(windowConfig.opacity);
+    }
+    if (windowConfig.fullscreen) {
+        mainWindow.window().setFullscreen(true);
+    }
+    
+    // ========================================
+    // SYSTEM TRAY (if enabled)
+    // ========================================
+    // HEADLESS / HIDDEN STARTUP
+    // ========================================
+    if (appConfig.headless || appConfig.hiddenOnStartup) {
+        mainWindow.window().hide();
+    }
+    
+    // ========================================
+    // NAVIGATION - Load Frontend
+    // ========================================
+    #ifdef PLUSUI_DEV_MODE
+        mainWindow.navigate("http://localhost:5173");
+    #else
+        mainWindow.loadFile("frontend/dist/index.html");
+    #endif
+    
+    // ========================================
+    // CUSTOM C++ FUNCTIONS (expose to frontend)
+    // ========================================
+    // {{PROJECT_NAME_LOWER}}.bind("getVersion", [](const std::string& args) {
+    //     return "\"" + appConfig.version + "\"";
+    // });
+    // Call from JS: const version = await app.invoke('getVersion');
+    
+    // ========================================
+    // RUN APPLICATION
+    // ========================================
+    plusui::App runtime;
+    runtime.run();
+    
+    return 0;
+}
+
+// ============================================================================
+// FRONTEND API REFERENCE
+// ============================================================================
+// import { win, browser, router, app, display, clipboard } from 'plusui-native-core';
+//
+// WINDOW: win.minimize(), win.maximize(), win.close(), win.center(),
+//         win.setSize(w, h), win.setPosition(x, y), win.setTitle(str),
+//         win.setFullscreen(bool), win.setAlwaysOnTop(bool),
+//         win.getSize(), win.getPosition(), win.isMaximized(), win.isVisible()
+//
+// BROWSER: browser.navigate(url), browser.goBack(), browser.goForward(),
+//          browser.reload(), browser.getUrl(), browser.canGoBack()
+//
+// ROUTER: router.setRoutes({'/': 'url'}), router.push('/path')
+//
+// APP: app.quit(), app.invoke('customFn', args)
+//
+// DISPLAY: display.getAll(), display.getPrimary(), display.getCurrent()
+//
+// CLIPBOARD: clipboard.writeText(str), clipboard.readText(), clipboard.clear()
+

package/templates/solid/package.json.template

@@ -0,0 +1,23 @@
+{
+  "name": "{{PROJECT_NAME_LOWER}}",
+  "version": "{{PROJECT_VERSION}}",
+  "description": "A PlusUI desktop application",
+  "type": "module",
+  "scripts": {
+    "dev": "plusui dev",
+    "dev:frontend": "plusui dev:frontend",
+    "dev:backend": "plusui dev:backend",
+    "bind": "plusui bind",
+    "bindgen": "plusui bindgen",
+    "build": "plusui build",
+    "build:frontend": "plusui build:frontend",
+    "build:backend": "plusui build:backend",
+    "build:all": "plusui build:all",
+    "start": "plusui run",
+    "clean": "plusui clean"
+  },
+  "devDependencies": {
+    "plusui-native": "file:../../Tools/plusui-cli"
+  }
+}
+