vaderjs-native 1.0.21 → 1.0.22

package/cli.ts

@@ -7,25 +7,15 @@ import readline from "readline";
 const cwd = process.cwd();
 
 /* ------------------------------- utils ------------------------------- */
-
 function ask(question: string): Promise<string> {
-  const rl = readline.createInterface({
-    input: process.stdin,
-    output: process.stdout,
-  });
+  const rl = readline.createInterface({ input: process.stdin, output: process.stdout });
   return new Promise((resolve) =>
-    rl.question(question + " ", (answer) => {
-      rl.close();
-      resolve(answer.trim());
-    })
+    rl.question(question + " ", (answer) => { rl.close(); resolve(answer.trim()); })
   );
 }
 
 async function run(cmd: string, args: string[] = []): Promise<void> {
-  const proc = Bun.spawn([cmd, ...args], {
-    stdout: "inherit",
-    stderr: "inherit",
-  });
+  const proc = Bun.spawn([cmd, ...args], { stdout: "inherit", stderr: "inherit" });
   const status = await proc.exited;
   if (status !== 0) process.exit(status);
 }
@@ -40,7 +30,6 @@ function getFlags() {
 }
 
 /* ------------------------- UI Frameworks ------------------------- */
-
 const UI_FRAMEWORKS = {
   none: {
     name: "None (Basic)",
@@ -52,28 +41,28 @@ const UI_FRAMEWORKS = {
     name: "VaderUI (DaisyUI)",
     runtimeDeps: ["vaderjs-daisyui", "daisyui", "tailwindcss", "postcss", "autoprefixer"],
     devDeps: ["@tailwindcss/postcss"],
+    configPlugin: "await daisyui()",
     cssFile: `@import "tailwindcss"; @plugin "daisyui";`,
-    description: "DaisyUI components for Vader.js",
+    description: "A comprehensive DaisyUI component library for Vader.js",
   },
   bootstrap: {
     name: "Bootstrap 5",
     runtimeDeps: ["vaderjs-bootstrap", "bootstrap"],
     devDeps: [],
+    configPlugin: "bootstrap",
     cssFile: `/* Import Bootstrap CSS in your HTML or via CDN */`,
     description: "Bootstrap 5 components rebuilt for Vader.js",
   },
 };
 
 /* ---------------------------- initProject ---------------------------- */
-
 export async function initProject(dir?: string) {
   const flags = getFlags();
   const autoYes = flags.has("--yes");
-  const projectDir = path.resolve(cwd, dir || ".");
+  console.log("🚀 Initializing Vader.js project");
 
-  if (!fsSync.existsSync(projectDir)) {
-    await fs.mkdir(projectDir, { recursive: true });
-  }
+  const projectDir = path.resolve(cwd, dir || ".");
+  if (!fsSync.existsSync(projectDir)) await fs.mkdir(projectDir, { recursive: true });
 
   const files = fsSync.readdirSync(projectDir);
   if (files.length && !autoYes) {
@@ -81,13 +70,13 @@ export async function initProject(dir?: string) {
     if (confirm !== "y") process.exit(0);
   }
 
-  // Language selection
-  console.log("\nSelect language:\n1. JavaScript\n2. TypeScript");
+  // Language
+  console.log("\nSelect language:\n 1. JavaScript\n 2. TypeScript");
   const useTypeScript = (await ask("Choose (1-2):")) === "2";
   const fileExt = useTypeScript ? "tsx" : "jsx";
   const configExt = useTypeScript ? "ts" : "js";
 
-  // Framework selection
+  // Framework
   console.log("\nSelect a UI framework:");
   Object.values(UI_FRAMEWORKS).forEach((f, i) => {
     console.log(`  ${i + 1}. ${f.name}`);
@@ -95,13 +84,14 @@ export async function initProject(dir?: string) {
   });
   const keys = Object.keys(UI_FRAMEWORKS);
   let frameworkKey = keys[parseInt(await ask(`Choose (1-${keys.length}):`)) - 1];
-  const framework = UI_FRAMEWORKS[frameworkKey];
+  let framework = UI_FRAMEWORKS[frameworkKey];
 
   // Platforms
   console.log("\nSelect platforms to support:");
   const android = (await ask("Include Android support? (y/n):")).toLowerCase() === "y";
   const windows = (await ask("Include Windows support? (y/n):")).toLowerCase() === "y";
 
+  // Create folders
   logSection("📁 Creating folders");
   for (const d of ["app", "src", "public"]) {
     const p = path.join(projectDir, d);
@@ -110,10 +100,45 @@ export async function initProject(dir?: string) {
   if (android) await fs.mkdir(path.join(projectDir, "assets/android"), { recursive: true });
   if (windows) await fs.mkdir(path.join(projectDir, "assets/windows"), { recursive: true });
 
+  // Starter app
   logSection("🧱 Writing files");
+  let appCode = "";
+  if (frameworkKey === "daisyui") {
+    appCode = `import * as Vader from "vaderjs-native";
+import { useState } from "vaderjs-native";
+import Button from "vaderjs-daisyui/Components/Actions/Button";
+import { Card } from "vaderjs-daisyui/Components/Data/Display/Card";
+import { Badge } from "vaderjs-daisyui/Components/Data/Display/Badge";
 
-  // Starter app
-  const appCode = `import * as Vader from "vaderjs-native";
+function Main() {
+  const [count, setCount] = useState(0);
+  return (
+    <div className="min-h-screen bg-base-200 p-8">
+      <div className="max-w-4xl mx-auto text-center">
+        <h1 className="text-4xl font-bold text-primary mb-4">🎉 Welcome to Vader.js!</h1>
+        <p className="text-lg text-base-content">With ${framework.name} components</p>
+        <Badge color="primary" className="mt-2">v1.0.0</Badge>
+      </div>
+
+      <Card className="mt-8 p-6" title="Interactive Demo">
+        <div className="flex flex-col md:flex-row justify-between items-center gap-4">
+          <div>
+            <p className="text-xl font-semibold">Counter: {count}</p>
+          </div>
+          <div className="flex gap-3">
+            <Button color="primary" onClick={() => setCount(count + 1)}>Increment</Button>
+            <Button color="secondary" onClick={() => setCount(0)}>Reset</Button>
+            <Button color="accent" onClick={() => alert(\`Count is: \${count}\`)}>Show Alert</Button>
+          </div>
+        </div>
+      </Card>
+    </div>
+  );
+}
+
+Vader.render(Vader.createElement(Main), document.getElementById("app"));`;
+  } else {
+    appCode = `import * as Vader from "vaderjs-native";
 import { useState } from "vaderjs-native";
 
 function Main() {
@@ -128,8 +153,9 @@ function Main() {
   );
 }
 
-Vader.render(Vader.createElement(Main), document.getElementById("app"));
-`;
+Vader.render(Vader.createElement(Main), document.getElementById("app"));`;
+  }
+
   await fs.writeFile(path.join(projectDir, `app/index.${fileExt}`), appCode);
   await fs.writeFile(path.join(projectDir, "public/styles.css"), framework.cssFile || "");
   console.log("created app/index & styles");
@@ -149,36 +175,46 @@ Vader.render(Vader.createElement(Main), document.getElementById("app"));
   console.log("created jsconfig.json");
 
   // Config file
-  const configContent = `import defineConfig from "vaderjs-native/config";
+  let configImport = "";
+  let configPlugins = "[]";
+  if (framework.configPlugin) {
+    if (frameworkKey === "daisyui") configImport = 'import daisyui from "vaderjs-daisyui";\n';
+    if (frameworkKey === "bootstrap") configImport = 'import bootstrap from "vaderjs-bootstrap";\n';
+    configPlugins = `[${framework.configPlugin}]`;
+  }
+
+  const configContent = `${configImport}import defineConfig from "vaderjs-native/config";
 
 export default defineConfig({
-  app: { name: "${path.basename(projectDir)}" },
+  app: {
+    name: "${path.basename(projectDir)}",
+    id: "com.example.${path.basename(projectDir).toLowerCase()}",
+    version: { code: 1, name: "1.0.0" },
+  },
   platforms: {
-    ${android ? `android: { minSdk: 24, targetSdk: 34 },` : ""}
-    web: { title: "${path.basename(projectDir)}" },
-    ${windows ? `windows: { width: 1200, height: 800 },` : ""}
+    ${android ? `android: { minSdk: 24, targetSdk: 34, permissions: ["INTERNET","ACCESS_NETWORK_STATE"], icon: "./assets/android/icon.png", splash: "./assets/android/splash.png" },` : ""}
+    web: { title: "${path.basename(projectDir)}", themeColor: "#111827" },
+    ${windows ? `windows: { width: 1200, height: 800, title: "${path.basename(projectDir)}" },` : ""}
   },
-  plugins: [],
+  plugins: ${configPlugins}
 });
 `;
-  const configExtFinal = useTypeScript ? "ts" : "js";
-  await fs.writeFile(path.join(projectDir, `vaderjs.config.${configExtFinal}`), configContent);
+
+  await fs.writeFile(path.join(projectDir, `vaderjs.config.${configExt}`), configContent);
+  console.log(`created vaderjs.config.${configExt}`);
 
   // Package.json
   const pkgPath = path.join(projectDir, "package.json");
   let pkg = fsSync.existsSync(pkgPath)
     ? JSON.parse(await fs.readFile(pkgPath, "utf8"))
-    : {
-        name: path.basename(projectDir),
-        version: "1.0.0",
-        type: "module",
-        scripts: { dev: "bun run vaderjs dev", build: "bun run vaderjs build", serve: "bun run vaderjs serve" },
-        dependencies: { "vaderjs-native": "latest" },
-        devDependencies: {},
-      };
+    : { name: path.basename(projectDir), version: "1.0.0", type: "module", scripts: {}, dependencies: { "vaderjs-native": "latest" }, devDependencies: {} };
+
+  pkg.devDependencies = pkg.devDependencies || {};
+  pkg.dependencies = pkg.dependencies || {};
 
   let shouldInstall = false;
 
+  // TypeScript
   if (useTypeScript) {
     pkg.devDependencies.typescript = "^5.0.0";
     pkg.devDependencies["@types/bun"] = "latest";
@@ -186,27 +222,25 @@ export default defineConfig({
     shouldInstall = true;
   }
 
-  // Runtime & dev deps
+  // Add framework deps
   if (framework.runtimeDeps) framework.runtimeDeps.forEach((d) => { pkg.dependencies[d] = "latest"; shouldInstall = true; });
   if (framework.devDeps) framework.devDeps.forEach((d) => { pkg.devDependencies[d] = "latest"; shouldInstall = true; });
 
   await fs.writeFile(pkgPath, JSON.stringify(pkg, null, 2));
+
   if (shouldInstall) {
     logSection("📦 Installing dependencies");
     await run("bun", ["install"]);
-  } else {
-    console.log("📦 Dependencies already satisfied");
   }
 
   console.log("\n✅ Project ready!");
-};
+}
 
 /* ---------------------------- addPlugin ---------------------------- */
 export async function addPlugin(name: string) {
   if (!name) return console.error("Please specify a plugin to add.");
   const flags = getFlags();
   const force = flags.has("--force");
-
   const pkgName = name.startsWith("vaderjs-") ? name : `vaderjs-${name}`;
   const importName = pkgName.replace(/^vaderjs-/, "").replace(/-/g, "_");
 
@@ -216,22 +250,19 @@ export async function addPlugin(name: string) {
   const configPathTS = path.join(cwd, "vaderjs.config.ts");
   const configPathJS = path.join(cwd, "vaderjs.config.js");
   const configPath = fsSync.existsSync(configPathTS) ? configPathTS : configPathJS;
-  if (!fsSync.existsSync(configPath)) return console.warn("⚠️ Config file not found");
+  if (!fsSync.existsSync(configPath)) return console.warn("⚠️ Config not found, skipping plugin registration");
 
   let config = await fs.readFile(configPath, "utf8");
-  if (!config.includes(`from "${pkgName}"`)) {
-    config = `import ${importName} from "${pkgName}";\n` + config.replace(/plugins:\s*\[/, `plugins: [${importName}, `);
-    await fs.writeFile(configPath, config);
-    console.log("✔ Plugin registered");
-  } else {
-    console.log("ℹ️ Plugin already registered");
-  }
+  if (config.includes(`from "${pkgName}"`)) return console.log("ℹ️ Plugin already registered");
+
+  config = `import ${importName} from "${pkgName}";\n` + config.replace(/plugins:\s*\[/, `plugins: [${importName}, `);
+  await fs.writeFile(configPath, config);
+  console.log("✔ Plugin registered");
 }
 
 /* ---------------------------- removePlugin ---------------------------- */
 export async function removePlugin(name: string) {
   if (!name) return console.error("Please specify a plugin to remove.");
-
   const pkgName = name.startsWith("vaderjs-") ? name : `vaderjs-${name}`;
   const importName = pkgName.replace(/^vaderjs-/, "").replace(/-/g, "_");
 
@@ -244,9 +275,8 @@ export async function removePlugin(name: string) {
   if (!fsSync.existsSync(configPath)) return;
 
   let config = await fs.readFile(configPath, "utf8");
-  config = config
-    .replace(new RegExp(`import ${importName} from ".*?";\\n?`, "g"), "")
-    .replace(new RegExp(`\\b${importName},?\\s*`, "g"), "");
+  config = config.replace(new RegExp(`import ${importName} from ".*?";\\n?`, "g"), "")
+                 .replace(new RegExp(`\\b${importName},?\\s*`, "g"), "");
   await fs.writeFile(configPath, config);
   console.log("✔ Plugin removed");
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "vaderjs-native",
-    "version": "1.0.21",
+    "version": "1.0.22",
     "description": "Build Native Applications using Vaderjs framework.",
     "bin": {
         "vaderjs": "./main.ts"