create-athenea-app 0.1.1 → 1.0.0

package/README.md

@@ -1,19 +1,36 @@
 # create-athenea-app
 
-Paquete CLI para generar un proyecto basado en esta plantilla.
+CLI para generar una app de escritorio lista para laburar con **Electron + Preact + Vite**.
 
-Uso (cuando este publicado):
+Usa [electron-vite](https://electron-vite.org/) para un flujo de desarrollo integrado:
+
+- **HMR real** para el renderer (Preact)
+- **Hot reload** para main y preload
+- **Build unificado** de main, preload y renderer
+- **electron-builder** listo para empaquetar
+
+## Uso
 
 ```bash
 npm create athenea-app@latest
 ```
 
-Tambien podes pasar el nombre directo:
+O con nombre directo:
 
 ```bash
 npm create athenea-app@latest mi-proyecto
 ```
 
-Opciones:
+## Opciones
+
+- `--no-install`: no ejecuta `npm install` automaticamente
+- `--help`: muestra la ayuda
+
+## Stack incluido
 
-- `--no-install`: no ejecuta `npm install`
+- **Electron** - App de escritorio multiplataforma
+- **Preact** - UI rapida y liviana (3kB)
+- **preact-iso** - Routing simple
+- **Vite** - Dev server ultra rapido + build optimizado
+- **electron-vite** - Integra Vite con Electron (main + preload + renderer)
+- **electron-builder** - Empaquetado para Windows, macOS, Linux

package/bin/index.js

@@ -189,34 +189,26 @@ function bmpSolid24(width, height, r, g, b) {
   return Buffer.concat([fileHeader, dib, pixels]);
 }
 
-async function ensureWhiteBuildAssets(projectDir) {
-  const assetsDir = path.join(projectDir, "assets");
-  const publicDir = path.join(projectDir, "public");
-  await fsp.mkdir(assetsDir, { recursive: true });
-  await fsp.mkdir(publicDir, { recursive: true });
+async function ensureBuildAssets(projectDir) {
+  // electron-vite usa "resources" como directorio de assets para main/preload
+  const resourcesDir = path.join(projectDir, "resources");
+  await fsp.mkdir(resourcesDir, { recursive: true });
 
   const png256 = pngSolidRGBA(256, 256, 255, 255, 255, 255);
   const ico = icoFromPng(png256, 256);
-  await fsp.writeFile(path.join(assetsDir, "build.ico"), ico);
+
+  // PNG para Linux, ICO para Windows
+  await fsp.writeFile(path.join(resourcesDir, "icon.png"), png256);
+  await fsp.writeFile(path.join(resourcesDir, "icon.ico"), ico);
 
   await fsp.writeFile(
-    path.join(assetsDir, "installer-sidebar.bmp"),
+    path.join(resourcesDir, "installer-sidebar.bmp"),
     bmpSolid24(164, 314, 255, 255, 255),
   );
   await fsp.writeFile(
-    path.join(assetsDir, "installer-header.bmp"),
+    path.join(resourcesDir, "installer-header.bmp"),
     bmpSolid24(150, 57, 255, 255, 255),
   );
-
-  const viteSvgPath = path.join(publicDir, "vite.svg");
-  if (!fs.existsSync(viteSvgPath)) {
-    const svg =
-      '<?xml version="1.0" encoding="UTF-8"?>\n' +
-      '<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 64 64">\n' +
-      '  <rect width="64" height="64" fill="#ffffff"/>\n' +
-      "</svg>\n";
-    await fsp.writeFile(viteSvgPath, svg, "utf8");
-  }
 }
 
 async function npmInstall(projectDir) {
@@ -282,24 +274,39 @@ async function main() {
     __APP_APP_ID__: appId,
   };
 
+  // Reemplazar tokens en los archivos correspondientes (nueva estructura electron-vite)
   await Promise.all([
-    replaceTokensInFile(path.join(targetDir, "electron.js"), tokenMap),
-    replaceTokensInFile(path.join(targetDir, "index.html"), tokenMap),
+    replaceTokensInFile(
+      path.join(targetDir, "src", "main", "index.js"),
+      tokenMap,
+    ),
+    replaceTokensInFile(
+      path.join(targetDir, "src", "renderer", "index.html"),
+      tokenMap,
+    ),
     replaceTokensInFile(path.join(targetDir, "README.md"), tokenMap),
     replaceTokensInFile(
-      path.join(targetDir, "src", "routes", "Home", "Home.jsx"),
+      path.join(
+        targetDir,
+        "src",
+        "renderer",
+        "src",
+        "routes",
+        "Home",
+        "Home.jsx",
+      ),
       tokenMap,
     ),
   ]);
 
-  await ensureWhiteBuildAssets(targetDir);
+  await ensureBuildAssets(targetDir);
 
   console.log("");
   console.log(`Proyecto creado en: ${targetDir}`);
   console.log("");
   console.log("Siguientes pasos:");
   console.log(`  cd ${npmName}`);
-  console.log("  npm run dev:electron");
+  console.log("  npm run dev");
 
   if (!noInstall) {
     console.log("");

package/package.json

@@ -1,15 +1,17 @@
 {
   "name": "create-athenea-app",
-  "version": "0.1.1",
+  "version": "1.0.0",
   "type": "module",
-  "description": "Creador de proyectos Athenea (Electron + Preact + Vite)",
+  "description": "CLI para scaffoldear apps de escritorio con Electron + Preact + Vite (DX rapida: dev server, hot reload, build y empaquetado)",
   "keywords": [
     "create",
     "starter",
     "template",
     "electron",
+    "electron-vite",
     "preact",
-    "vite"
+    "vite",
+    "desktop"
   ],
   "bin": {
     "create-athenea-app": "bin/index.js"

package/template/README.md

@@ -1,19 +1,57 @@
 # **APP_TITLE**
 
-Proyecto generado con `create-athenea-app`.
+Aplicación de escritorio creada con [Athenea](https://github.com/tu-usuario/athenea-desktop).
+
+## Stack
+
+- **Electron** - Framework para apps de escritorio
+- **electron-vite** - Build tool optimizado para Electron
+- **Preact** - UI library liviana (3KB)
+- **preact-iso** - Router minimalista
+
+## Estructura
+
+```
+src/
+├── main/           # Proceso principal de Electron
+│   └── index.js
+├── preload/        # Scripts de preload (bridge seguro)
+│   └── index.js
+└── renderer/       # Aplicación frontend
+    ├── index.html
+    ├── public/     # Assets estáticos
+    └── src/        # Código fuente React/Preact
+        ├── main.jsx
+        ├── app.jsx
+        ├── components/
+        └── routes/
+```
 
 ## Scripts
 
 ```bash
-npm run dev:electron
-npm run build
-npm run pack
-npm run dist
+# Desarrollo
+npm run dev          # Inicia en modo desarrollo (Windows)
+npm run dev:linux    # Inicia en modo desarrollo (Linux)
+
+# Build
+npm run build        # Compila la aplicación
+npm run pack         # Empaqueta sin crear instalador
+npm run dist         # Crea instaladores para la plataforma actual
+npm run dist:win     # Crea instalador para Windows
+npm run dist:linux   # Crea instalador para Linux
 ```
 
-## Branding
+## IPC disponible
+
+El preload expone `window.electronAPI` con:
 
-- Nombre del instalador/app: `package.json` -> `build.productName`
-- ID de la app: `package.json` -> `build.appId`
-- Titulos: `electron.js` y `index.html`
-- Recursos de instalador (placeholders blancos): `assets/build.ico` y `assets/installer-*.bmp`
+```javascript
+// Guardar/leer configuración persistente
+await window.electronAPI.settings.get();
+await window.electronAPI.settings.set({ key: "value" });
+
+// Abrir ventana secundaria con una ruta específica
+window.electronAPI.window.openRoute("/mi-ruta");
+window.electronAPI.window.openRoute({ route: "/mi-ruta", title: "Mi Ventana" });
+```

package/template/electron.vite.config.js

@@ -0,0 +1,43 @@
+import { defineConfig, externalizeDepsPlugin } from "electron-vite";
+import preact from "@preact/preset-vite";
+import { resolve } from "path";
+
+export default defineConfig({
+  main: {
+    plugins: [externalizeDepsPlugin()],
+    build: {
+      rollupOptions: {
+        input: {
+          index: resolve(__dirname, "src/main/index.js"),
+        },
+      },
+    },
+  },
+  preload: {
+    plugins: [externalizeDepsPlugin()],
+    build: {
+      rollupOptions: {
+        input: {
+          index: resolve(__dirname, "src/preload/index.js"),
+        },
+      },
+    },
+  },
+  renderer: {
+    root: "src/renderer",
+    publicDir: "public",
+    build: {
+      rollupOptions: {
+        input: {
+          index: resolve(__dirname, "src/renderer/index.html"),
+        },
+      },
+    },
+    plugins: [preact()],
+    resolve: {
+      alias: {
+        "@": resolve(__dirname, "src/renderer/src"),
+      },
+    },
+  },
+});

package/template/package.json

@@ -1,103 +1,55 @@
 {
-  "name": "__APP_TITLE__",
+  "name": "my-athenea-app",
   "private": true,
-  "version": "0.1.1",
+  "version": "0.1.0",
+  "description": "Aplicación de escritorio creada con Athenea",
+  "author": "Developer",
   "type": "module",
-  "main": "electron.js",
+  "main": "./out/main/index.js",
   "engines": {
     "node": ">=22.0.0"
   },
   "scripts": {
-    "dev": "vite --host --port 0",
-    "electron": "cross-env NODE_OPTIONS=\"--experimental-require-module --no-warnings\" electron .",
-    "dev:electron": "node scripts/dev-electron.mjs",
-    "copy-preload": "node -e \"const fs=require('fs'); if(!fs.existsSync('dist')) fs.mkdirSync('dist'); fs.copyFileSync('preload.cjs','dist/preload.cjs')\"",
-    "build": "vite build && npm run copy-preload",
-    "preview": "vite preview",
+    "dev": "electron-vite dev",
+    "dev:linux": "electron-vite dev -- --no-sandbox",
+    "build": "electron-vite build",
+    "preview": "electron-vite preview",
     "pack": "npm run build && electron-builder --dir",
     "dist": "npm run build && electron-builder",
     "dist:linux": "npm run build && electron-builder --linux",
-    "dist:win": "npm run build && electron-builder --win",
-    "lint": "eslint .",
-    "format": "prettier --write .",
-    "typecheck": "tsc --noEmit",
-    "test": "vitest",
-    "postinstall": "electron-builder install-app-deps"
+    "dist:win": "npm run build && electron-builder --win"
   },
   "dependencies": {
-    "@preact/signals": "^2.5.1",
-    "@tanstack/react-table": "^8.21.3",
-    "dayjs": "^1.11.13",
-    "electron-log": "^5.4.3",
-    "electron-updater": "^6.6.2",
-    "jwt-decode": "^4.0.0",
-    "keytar": "7.9.0",
-    "ky": "^1.2.4",
-    "pdf-to-printer": "5.6.1",
     "preact": "^10.26.2",
-    "preact-iso": "^2.9.1",
-    "sweetalert2": "^11.26.10",
-    "zod": "^3.23.8",
-    "zustand": "^5.0.3"
+    "preact-iso": "^2.9.1"
   },
   "devDependencies": {
-    "@eslint/eslintrc": "^3.3.1",
-    "@eslint/js": "^9.39.1",
     "@preact/preset-vite": "^2.10.1",
-    "@testing-library/preact": "3.2.3",
-    "@types/node": "^22.7.8",
-    "@typescript-eslint/eslint-plugin": "^8.46.4",
-    "@typescript-eslint/parser": "^8.46.4",
-    "autoprefixer": "^10.4.20",
-    "concurrently": "^8.2.0",
-    "cross-env": "^7.0.3",
-    "dotenv": "^16.4.5",
     "electron": "^35.1.4",
     "electron-builder": "^24.13.1",
-    "eslint": "^9.39.1",
-    "eslint-config-prettier": "^10.1.8",
-    "eslint-plugin-prettier": "^5.5.4",
-    "eslint-plugin-react-hooks": "^7.0.1",
-    "postcss": "^8.4.47",
-    "prettier": "^3.6.2",
-    "tailwindcss": "^3.4.14",
-    "typescript": "^5.9.3",
-    "vite": "^7.2.2",
-    "vite-tsconfig-paths": "^5.0.0",
-    "vitest": "^4.0.8",
-    "wait-on": "^7.0.1"
-  },
-  "overrides": {
-    "tar": "7.5.7"
+    "electron-vite": "^5.0.0",
+    "vite": "^7.2.2"
   },
   "build": {
-    "appId": "__APP_APP_ID__",
-    "productName": "__APP_TITLE__",
+    "appId": "com.example.app",
+    "productName": "App",
     "asar": true,
-    "asarUnpack": [
-      "**/*.node",
-      "preload.cjs",
-      "node_modules/pdf-to-printer/**/*"
-    ],
     "directories": {
-      "buildResources": "assets",
-      "output": "../release"
+      "buildResources": "resources",
+      "output": "release"
     },
-    "extraResources": [],
     "files": [
-      "dist/**/*",
-      "electron.js",
-      "preload.cjs",
+      "out/**/*",
       "!**/*.map",
-      "!**/node_modules/*/{CHANGELOG.md,README.md,README,readme.md,readme}",
-      "!**/node_modules/*/{test,__tests__,tests,powered-test,example,examples}"
+      "!src/**/*",
+      "!electron.vite.config.*"
     ],
     "win": {
       "target": [
         "nsis"
       ],
       "signAndEditExecutable": false,
-      "icon": "assets/build.ico"
+      "icon": "resources/icon.ico"
     },
     "nsis": {
       "oneClick": false,
@@ -105,19 +57,18 @@
       "allowToChangeInstallationDirectory": true,
       "createDesktopShortcut": true,
       "createStartMenuShortcut": true,
-      "installerIcon": "assets/build.ico",
-      "uninstallerIcon": "assets/build.ico",
-      "installerSidebar": "assets/installer-sidebar.bmp",
-      "uninstallerSidebar": "assets/installer-sidebar.bmp",
-      "installerHeader": "assets/installer-header.bmp"
+      "installerIcon": "resources/icon.ico",
+      "uninstallerIcon": "resources/icon.ico",
+      "installerSidebar": "resources/installer-sidebar.bmp",
+      "uninstallerSidebar": "resources/installer-sidebar.bmp",
+      "installerHeader": "resources/installer-header.bmp"
     },
     "linux": {
       "target": [
-        "AppImage",
-        "deb"
+        "AppImage"
       ],
-      "category": "Office",
-      "maintainer": "tu-email@ejemplo.com"
+      "icon": "resources/icon.png",
+      "category": "Office"
     }
   }
 }

package/template/resources/.gitkeep

@@ -0,0 +1,2 @@
+# Este directorio contiene los recursos para electron-builder
+# Los iconos se generan automáticamente al crear el proyecto

package/template/src/main/index.js

@@ -0,0 +1,152 @@
+import { app, BrowserWindow, ipcMain, screen } from "electron";
+import path, { join } from "path";
+import fs from "fs";
+
+// ------------------- VENTANA PRINCIPAL -------------------
+
+/** @type {BrowserWindow | null} */
+let mainWindow = null;
+
+/** @type {Map<string, BrowserWindow>} */
+const childWindowsByRoute = new Map();
+
+const settingsPath = path.join(app.getPath("userData"), "settings.json");
+
+function createWindow() {
+  const { width: screenWidth, height: screenHeight } =
+    screen.getPrimaryDisplay().workAreaSize;
+
+  mainWindow = new BrowserWindow({
+    width: screenWidth,
+    height: screenHeight,
+    title: __APP_TITLE_JSON__,
+    webPreferences: {
+      preload: join(__dirname, "../preload/index.mjs"),
+      sandbox: false,
+      contextIsolation: true,
+      nodeIntegration: false,
+    },
+  });
+
+  mainWindow.setMenuBarVisibility(false);
+  mainWindow.setAutoHideMenuBar(true);
+  mainWindow.maximize();
+
+  // electron-vite: usa ELECTRON_RENDERER_URL en dev
+  if (process.env.ELECTRON_RENDERER_URL) {
+    mainWindow.loadURL(process.env.ELECTRON_RENDERER_URL);
+    mainWindow.webContents.openDevTools();
+  } else {
+    mainWindow.loadFile(join(__dirname, "../renderer/index.html"));
+  }
+
+  mainWindow.on("minimize", () => {
+    for (const [, child] of childWindowsByRoute) {
+      if (!child.isDestroyed() && !child.isMinimized()) {
+        child.minimize();
+      }
+    }
+  });
+
+  mainWindow.on("restore", () => {
+    for (const [, child] of childWindowsByRoute) {
+      if (!child.isDestroyed()) {
+        child.restore();
+      }
+    }
+  });
+}
+
+app.whenReady().then(() => {
+  createWindow();
+});
+
+app.on("window-all-closed", () => {
+  if (process.platform !== "darwin") app.quit();
+});
+
+app.on("activate", () => {
+  if (BrowserWindow.getAllWindows().length === 0) {
+    createWindow();
+  }
+});
+
+// ------------------- HELPERS SETTINGS -------------------
+
+function readSettings() {
+  try {
+    if (!fs.existsSync(settingsPath)) return {};
+    return JSON.parse(fs.readFileSync(settingsPath, "utf-8"));
+  } catch {
+    return {};
+  }
+}
+
+function writeSettings(data) {
+  try {
+    fs.writeFileSync(settingsPath, JSON.stringify(data, null, 2), "utf-8");
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+// ------------------- IPC -------------------
+
+ipcMain.handle("settings:get", () => readSettings());
+
+ipcMain.handle("settings:set", (_event, data) => {
+  const current = readSettings();
+  const merged = { ...current, ...data };
+  writeSettings(merged);
+  return merged;
+});
+
+ipcMain.on("window:openRoute", (_event, options) => {
+  const route = typeof options === "string" ? options : options?.route;
+  const title = typeof options === "object" ? options.title : null;
+  if (!route) return;
+
+  const routeKey = String(route);
+  const existing = childWindowsByRoute.get(routeKey);
+  if (existing && !existing.isDestroyed()) {
+    if (existing.isMinimized()) existing.restore();
+    existing.focus();
+    return;
+  }
+
+  const child = new BrowserWindow({
+    width: 1200,
+    height: 700,
+    title: title || __APP_TITLE_JSON__,
+    webPreferences: {
+      preload: join(__dirname, "../preload/index.mjs"),
+      sandbox: false,
+      contextIsolation: true,
+      nodeIntegration: false,
+    },
+  });
+
+  child.setMenuBarVisibility(false);
+  child.setAutoHideMenuBar(true);
+  if (mainWindow && !mainWindow.isDestroyed()) {
+    child.setParentWindow(mainWindow);
+  }
+  childWindowsByRoute.set(routeKey, child);
+
+  if (process.env.ELECTRON_RENDERER_URL) {
+    child.loadURL(
+      `${process.env.ELECTRON_RENDERER_URL}?route=${encodeURIComponent(route)}&child=1`,
+    );
+    child.webContents.openDevTools();
+  } else {
+    child.loadFile(join(__dirname, "../renderer/index.html"), {
+      query: { route, child: "1" },
+    });
+  }
+
+  child.on("closed", () => {
+    const current = childWindowsByRoute.get(routeKey);
+    if (current === child) childWindowsByRoute.delete(routeKey);
+  });
+});

package/template/src/preload/index.js

@@ -0,0 +1,11 @@
+import { contextBridge, ipcRenderer } from "electron";
+
+contextBridge.exposeInMainWorld("electronAPI", {
+  settings: {
+    get: () => ipcRenderer.invoke("settings:get"),
+    set: (data) => ipcRenderer.invoke("settings:set", data),
+  },
+  window: {
+    openRoute: (options) => ipcRenderer.send("window:openRoute", options),
+  },
+});

package/template/{index.html → src/renderer/index.html}

@@ -2,12 +2,12 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="vite.svg" />
+    <link rel="icon" type="image/svg+xml" href="./public/logo.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>__APP_TITLE__</title>
   </head>
   <body>
     <div id="app"></div>
-    <script type="module" src="src/main.jsx"></script>
+    <script type="module" src="./src/main.jsx"></script>
   </body>
 </html>

package/template/src/renderer/public/logo.svg

@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
+  <defs>
+    <linearGradient id="grad" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" style="stop-color:#667eea;stop-opacity:1" />
+      <stop offset="100%" style="stop-color:#764ba2;stop-opacity:1" />
+    </linearGradient>
+  </defs>
+  <circle cx="50" cy="50" r="45" fill="url(#grad)"/>
+  <text x="50" y="62" font-family="Arial, sans-serif" font-size="36" font-weight="bold" fill="white" text-anchor="middle">A</text>
+</svg>

package/template/src/renderer/src/app.css

@@ -0,0 +1,22 @@
+#app {
+  max-width: 1280px;
+  margin: 0 auto;
+  padding: 2rem;
+  text-align: center;
+}
+
+.logo {
+  height: 6em;
+  padding: 1.5em;
+}
+.logo:hover {
+  filter: drop-shadow(0 0 2em #646cffaa);
+}
+
+.card {
+  padding: 2em;
+}
+
+.read-the-docs {
+  color: #888;
+}

package/template/src/{main.jsx → renderer/src/app.jsx}

@@ -1,16 +1,13 @@
-import { render } from "preact";
 import { LocationProvider, Router, Route } from "preact-iso";
 import Home from "./routes/Home/Home";
-import "./index.css";
 
-function App() {
+export default function App() {
   return (
     <LocationProvider>
       <Router>
         <Route path="/" component={Home} />
+        <Route default component={Home} />
       </Router>
     </LocationProvider>
   );
 }
-
-render(<App />, document.getElementById("app"));

package/template/src/renderer/src/components/Counter/Counter.jsx

@@ -0,0 +1,14 @@
+import { useState } from "preact/hooks";
+import "./style.css";
+
+export function Counter() {
+  const [count, setCount] = useState(0);
+
+  return (
+    <div class="counter">
+      <button onClick={() => setCount(count - 1)}>-</button>
+      <p>{count}</p>
+      <button onClick={() => setCount(count + 1)}>+</button>
+    </div>
+  );
+}

package/template/src/renderer/src/components/Counter/style.css

@@ -0,0 +1,46 @@
+/* counter.css */
+.counter {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 1rem;
+  padding: 1.5rem;
+  background-color: #f8f9fa;
+  border: 1px solid #e0e0e0;
+  border-radius: 12px;
+  width: fit-content;
+  margin: 2rem auto;
+  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
+}
+
+.counter p {
+  margin: 0;
+  font-size: 1.5rem;
+  font-weight: 500;
+  color: #333;
+  min-width: 2rem;
+  text-align: center;
+}
+
+.counter button {
+  background-color: #ffffff;
+  border: 1px solid #ccc;
+  border-radius: 8px;
+  width: 2.5rem;
+  height: 2.5rem;
+  font-size: 1.2rem;
+  font-weight: 600;
+  color: #333;
+  cursor: pointer;
+  transition: all 0.2s ease-in-out;
+}
+
+.counter button:hover {
+  background-color: #f0f0f0;
+  border-color: #999;
+}
+
+.counter button:active {
+  background-color: #e0e0e0;
+  transform: scale(0.96);
+}

package/template/src/renderer/src/index.css

@@ -0,0 +1,23 @@
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+html,
+body {
+  height: 100%;
+  overflow: hidden;
+}
+
+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;
+}
+
+#app {
+  height: 100%;
+}

package/template/src/renderer/src/main.jsx

@@ -0,0 +1,5 @@
+import { render } from "preact";
+import App from "./app.jsx";
+import "./index.css";
+
+render(<App />, document.getElementById("app"));

package/template/src/{routes → renderer/src/routes}/Home/Home.jsx

@@ -1,11 +1,12 @@
 import { Counter } from "../../components/Counter/Counter";
+
 import "./style.css";
 
 export default function Home() {
   return (
     <div className="home">
-      <h1 className="home-title">Bienvenido a __APP_TITLE__</h1>
-      <img className="home-logo" src="/logo.svg" alt="" />
+      <h1 className="home-title">¡Bienvenido a __APP_TITLE__!</h1>
+      <img className="home-logo" src="../../public/logo.svg" alt="" />
       <Counter />
     </div>
   );

package/template/src/renderer/src/routes/Home/style.css

@@ -0,0 +1,48 @@
+.home {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 2rem;
+  background-color: #f8f9fa;
+  height: 100vh;
+  box-sizing: border-box;
+  font-family: "Inter", system-ui, sans-serif;
+  color: #333;
+}
+
+.home-title {
+  font-size: 2.4rem;
+  font-weight: 600;
+  margin-bottom: 1.5rem;
+  color: #2c3e50;
+  letter-spacing: 0.5px;
+  text-align: center;
+}
+
+.home-logo {
+  width: 180px;
+  height: auto;
+  margin-bottom: 1.5rem;
+  animation: pulse-logo 8s ease-in-out infinite;
+  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.1));
+  transition: transform 0.3s ease;
+}
+
+@keyframes pulse-logo {
+  0% {
+    transform: scale(1);
+  }
+  25% {
+    transform: scale(1.1);
+  }
+  50% {
+    transform: scale(1.25);
+  }
+  75% {
+    transform: scale(1.1);
+  }
+  100% {
+    transform: scale(1);
+  }
+}

package/template/electron.js

@@ -1,230 +0,0 @@
-import { app, BrowserWindow, ipcMain, dialog, screen } from "electron";
-import path from "path";
-import { fileURLToPath } from "url";
-import fs from "fs";
-import os from "os";
-import keytar from "keytar";
-import pdfPrinter from "pdf-to-printer";
-import { spawn } from "child_process";
-import log from "electron-log";
-
-// Inicializar logger
-log.initialize();
-log.transports.file.level = "info";
-log.info("Iniciando aplicacion...");
-
-const { print: printPDF, getPrinters } = pdfPrinter;
-const __dirname = path.dirname(fileURLToPath(import.meta.url));
-
-app.commandLine.appendSwitch("disable-features", "Autofill");
-if (!app.isPackaged || process.env.ELECTRON_DISABLE_SANDBOX === "1") {
-  app.commandLine.appendSwitch("no-sandbox");
-}
-
-let backendProcess = null;
-
-function getBackendPath() {
-  const isWin = process.platform === "win32";
-  const executableName = isWin
-    ? "api_billing_software.exe"
-    : "api_billing_software";
-
-  if (app.isPackaged) {
-    return path.join(
-      process.resourcesPath,
-      "api_billing_software",
-      executableName,
-    );
-  }
-
-  return path.join(
-    __dirname,
-    "..",
-    "backend",
-    "dist",
-    "api_billing_software",
-    executableName,
-  );
-}
-
-function startBackend() {
-  const backendPath = getBackendPath();
-  log.info("Intentando iniciar backend desde:", backendPath);
-
-  if (!fs.existsSync(backendPath)) {
-    log.error("No se encontro el ejecutable del backend en:", backendPath);
-    return;
-  }
-
-  backendProcess = spawn(backendPath, [], {
-    cwd: path.dirname(backendPath),
-    stdio: "pipe",
-    windowsHide: true,
-  });
-
-  backendProcess.on("close", () => {
-    backendProcess = null;
-  });
-}
-
-function stopBackend() {
-  if (backendProcess) {
-    backendProcess.kill();
-    backendProcess = null;
-  }
-}
-
-/** @type {BrowserWindow | null} */
-let mainWindow = null;
-
-/** @type {Map<string, BrowserWindow>} */
-const childWindowsByRoute = new Map();
-
-const settingsPath = path.join(app.getPath("userData"), "settings.json");
-
-function createWindow() {
-  const isDev = !app.isPackaged;
-  const devServerUrl = process.env.DEV_SERVER_URL || "http://localhost:5171";
-  const { width: screenWidth, height: screenHeight } =
-    screen.getPrimaryDisplay().workAreaSize;
-
-  mainWindow = new BrowserWindow({
-    width: screenWidth,
-    height: screenHeight,
-    title: __APP_TITLE_JSON__,
-    webPreferences: {
-      preload: path.join(__dirname, "preload.cjs"),
-      devTools: isDev,
-      contextIsolation: true,
-      nodeIntegration: false,
-    },
-  });
-
-  mainWindow.setMenuBarVisibility(false);
-  mainWindow.setAutoHideMenuBar(true);
-  mainWindow.maximize();
-
-  if (isDev) {
-    mainWindow.loadURL(devServerUrl);
-    mainWindow.webContents.openDevTools();
-  } else {
-    const indexPath = path.join(__dirname, "dist", "index.html");
-    mainWindow.loadFile(indexPath, { query: { route: "/" } });
-  }
-
-  mainWindow.on("minimize", () => {
-    for (const [, child] of childWindowsByRoute) {
-      if (!child.isDestroyed() && !child.isMinimized()) child.minimize();
-    }
-  });
-
-  mainWindow.on("restore", () => {
-    for (const [, child] of childWindowsByRoute) {
-      if (!child.isDestroyed()) child.restore();
-    }
-  });
-}
-
-app.whenReady().then(() => {
-  startBackend();
-  createWindow();
-});
-
-app.on("will-quit", () => {
-  stopBackend();
-});
-
-app.on("window-all-closed", () => {
-  if (process.platform !== "darwin") app.quit();
-});
-
-app.on("activate", () => {
-  if (BrowserWindow.getAllWindows().length === 0) createWindow();
-});
-
-function readSettings() {
-  try {
-    if (!fs.existsSync(settingsPath)) return {};
-    return JSON.parse(fs.readFileSync(settingsPath, "utf-8"));
-  } catch {
-    return {};
-  }
-}
-
-function writeSettings(data) {
-  try {
-    fs.writeFileSync(settingsPath, JSON.stringify(data, null, 2), "utf-8");
-    return true;
-  } catch {
-    return false;
-  }
-}
-
-ipcMain.handle("settings:get", () => readSettings());
-ipcMain.handle("settings:set", (_event, data) => {
-  const current = readSettings();
-  const merged = { ...current, ...data };
-  writeSettings(merged);
-  return merged;
-});
-
-ipcMain.handle("printer:getPrinters", async () => {
-  return await getPrinters();
-});
-ipcMain.handle("printer:printPDF", async (_event, { filePath, options }) => {
-  try {
-    await printPDF(filePath, options || {});
-    return { ok: true };
-  } catch (err) {
-    return { ok: false, error: err?.message || String(err) };
-  }
-});
-
-ipcMain.on("window:openRoute", (_event, options) => {
-  const route = typeof options === "string" ? options : options?.route;
-  const title = typeof options === "object" ? options.title : null;
-  if (!route) return;
-
-  const routeKey = String(route);
-  const existing = childWindowsByRoute.get(routeKey);
-  if (existing && !existing.isDestroyed()) {
-    if (existing.isMinimized()) existing.restore();
-    existing.focus();
-    return;
-  }
-
-  const isDev = !app.isPackaged;
-  const devServerUrl = process.env.DEV_SERVER_URL || "http://localhost:5171";
-  const preloadPath = path.join(__dirname, "preload.cjs");
-
-  const child = new BrowserWindow({
-    width: 1200,
-    height: 700,
-    title: title || __APP_TITLE_JSON__,
-    webPreferences: {
-      preload: preloadPath,
-      devTools: isDev,
-      contextIsolation: true,
-      nodeIntegration: false,
-    },
-  });
-
-  child.setMenuBarVisibility(false);
-  child.setAutoHideMenuBar(true);
-  if (mainWindow && !mainWindow.isDestroyed())
-    child.setParentWindow(mainWindow);
-  childWindowsByRoute.set(routeKey, child);
-
-  if (isDev) {
-    child.loadURL(`${devServerUrl}?route=${encodeURIComponent(route)}&child=1`);
-    child.webContents.openDevTools();
-  } else {
-    const indexPath = path.join(__dirname, "dist", "index.html");
-    child.loadFile(indexPath, { query: { route, child: "1" } });
-  }
-
-  child.on("closed", () => {
-    const current = childWindowsByRoute.get(routeKey);
-    if (current === child) childWindowsByRoute.delete(routeKey);
-  });
-});

package/template/eslint.config.js

@@ -1,3 +0,0 @@
-import js from "@eslint/js";
-
-export default [js.configs.recommended];

package/template/preload.cjs

@@ -1,9 +0,0 @@
-const { contextBridge, ipcRenderer } = require("electron");
-
-contextBridge.exposeInMainWorld("electronAPI", {
-  settingsGet: () => ipcRenderer.invoke("settings:get"),
-  settingsSet: (data) => ipcRenderer.invoke("settings:set", data),
-  openRoute: (options) => ipcRenderer.send("window:openRoute", options),
-  getPrinters: () => ipcRenderer.invoke("printer:getPrinters"),
-  printPDF: (payload) => ipcRenderer.invoke("printer:printPDF", payload),
-});

package/template/preload.js

@@ -1 +0,0 @@
-// Compat (si alguien lo usa desde ESM). El preload real es preload.cjs

package/template/public/logo.svg

@@ -1,4 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256">
-	<rect width="256" height="256" fill="#ffffff"/>
-</svg>

package/template/scripts/dev-electron.mjs

@@ -1,71 +0,0 @@
-import { createServer } from "vite";
-import { spawn } from "child_process";
-import path from "path";
-import { fileURLToPath } from "url";
-import fs from "fs";
-
-const __dirname = path.dirname(fileURLToPath(import.meta.url));
-
-async function start() {
-  const server = await createServer({
-    server: {
-      host: "127.0.0.1",
-      port: 0,
-    },
-  });
-
-  await server.listen();
-
-  const url =
-    server.resolvedUrls?.local?.[0] ||
-    `http://localhost:${server.config.server.port || 5173}`;
-
-  console.log(`[dev-electron] Vite dev server en ${url}`);
-
-  const isWin = process.platform === "win32";
-  const localElectronBin = path.resolve(
-    __dirname,
-    "..",
-    "node_modules",
-    ".bin",
-    isWin ? "electron.cmd" : "electron",
-  );
-  const electronBin = fs.existsSync(localElectronBin)
-    ? localElectronBin
-    : "electron";
-
-  const electronProcess = spawn(electronBin, [".", "--no-sandbox"], {
-    stdio: "inherit",
-    shell: isWin,
-    env: {
-      ...process.env,
-      DEV_SERVER_URL: url,
-      NODE_OPTIONS: "--experimental-require-module --no-warnings",
-      ELECTRON_DISABLE_SANDBOX: "1",
-    },
-    cwd: path.resolve(__dirname, ".."),
-  });
-
-  const clean = () => {
-    electronProcess.kill();
-    server.close();
-  };
-
-  electronProcess.on("close", (code) => {
-    clean();
-    process.exit(code ?? 0);
-  });
-
-  const handleSignal = () => {
-    clean();
-    process.exit(0);
-  };
-
-  process.on("SIGINT", handleSignal);
-  process.on("SIGTERM", handleSignal);
-}
-
-start().catch((err) => {
-  console.error("[dev-electron] Error:", err);
-  process.exit(1);
-});

package/template/src/components/Counter/Counter.jsx

@@ -1,13 +0,0 @@
-import { useState } from "preact/hooks";
-import "./style.css";
-
-export function Counter() {
-  const [count, setCount] = useState(0);
-  return (
-    <div className="counter">
-      <button onClick={() => setCount((c) => c - 1)}>-</button>
-      <span>{count}</span>
-      <button onClick={() => setCount((c) => c + 1)}>+</button>
-    </div>
-  );
-}

package/template/src/components/Counter/style.css

@@ -1,9 +0,0 @@
-.counter {
-  display: inline-flex;
-  gap: 12px;
-  align-items: center;
-}
-
-.counter button {
-  padding: 8px 12px;
-}

package/template/src/index.css

@@ -1,7 +0,0 @@
-:root {
-  font-family: system-ui, sans-serif;
-}
-
-body {
-  margin: 0;
-}

package/template/src/routes/Home/style.css

@@ -1,13 +0,0 @@
-.home {
-  min-height: 100vh;
-  display: grid;
-  place-content: center;
-  gap: 16px;
-  text-align: center;
-}
-
-.home-logo {
-  width: 120px;
-  height: 120px;
-  margin: 0 auto;
-}

package/template/tsconfig.json

@@ -1,18 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES2022",
-    "useDefineForClassFields": true,
-    "lib": ["ES2022", "DOM", "DOM.Iterable"],
-    "module": "ESNext",
-    "skipLibCheck": true,
-    "moduleResolution": "Bundler",
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "noEmit": true,
-    "jsx": "react-jsx",
-    "jsxImportSource": "preact",
-    "strict": true,
-    "types": ["node"]
-  },
-  "include": ["src"]
-}

package/template/vite.config.js

@@ -1,25 +0,0 @@
-import { defineConfig } from "vite";
-import preact from "@preact/preset-vite";
-import path from "path";
-
-export default defineConfig({
-  plugins: [preact()],
-  base: "./",
-  publicDir: "public",
-  build: {
-    outDir: "dist",
-    assetsDir: "assets",
-    rollupOptions: {
-      output: {
-        assetFileNames: "assets/[name].[hash][extname]",
-        chunkFileNames: "assets/[name].[hash].js",
-        entryFileNames: "assets/[name].[hash].js",
-      },
-    },
-  },
-  resolve: {
-    alias: {
-      "@": path.resolve(__dirname, "./src"),
-    },
-  },
-});