create-vidra-app 0.1.2 → 0.1.4

package/dist/index.js

@@ -1,6 +1,6 @@
 // src/index.ts
-import prompts from "prompts";
-import chalk2 from "chalk";
+import prompts2 from "prompts";
+import chalk3 from "chalk";
 import fs2 from "fs-extra";
 import path2 from "path";
 import { randomUUID } from "crypto";
@@ -112,6 +112,140 @@ var applyReplacements = (str, replacements) => {
   return str;
 };
 
+// src/doctor.ts
+import { execFileSync } from "child_process";
+import prompts from "prompts";
+import chalk2 from "chalk";
+var DOTNET = process.platform === "win32" ? "dotnet.exe" : "dotnet";
+var MAUI_DOCS = "https://learn.microsoft.com/dotnet/maui/get-started/installation";
+var bufToStr = (v) => v == null ? "" : Buffer.isBuffer(v) ? v.toString() : v;
+var run = (cmd, args) => {
+  try {
+    const stdout = execFileSync(cmd, args, {
+      encoding: "utf-8",
+      stdio: ["ignore", "pipe", "pipe"]
+    });
+    return { found: true, ok: true, stdout: stdout ?? "", stderr: "" };
+  } catch (e) {
+    const err = e;
+    return {
+      found: err.code !== "ENOENT",
+      ok: false,
+      stdout: bufToStr(err.stdout),
+      stderr: bufToStr(err.stderr)
+    };
+  }
+};
+var hasNet10Sdk = (listSdksOutput) => listSdksOutput.split(/\r?\n/).some((line) => /^10\./.test(line.trim()));
+var newestNet10Sdk = (listSdksOutput) => listSdksOutput.split(/\r?\n/).map((line) => line.trim().split(/\s+/)[0]).filter((v) => /^10\./.test(v)).sort(
+  (a, b) => a.localeCompare(b, void 0, { numeric: true, sensitivity: "base" })
+).pop();
+var outputMentionsMaui = (workloadListOutput) => /\bmaui\b/i.test(workloadListOutput);
+var checkDotnetSdk = () => {
+  const res = run(DOTNET, ["--list-sdks"]);
+  if (!res.found) {
+    return {
+      name: ".NET SDK",
+      status: "missing",
+      detail: "`dotnet` was not found on your PATH",
+      fix: "Install the .NET 10 SDK \u2014 https://dotnet.microsoft.com/download"
+    };
+  }
+  if (!res.ok && !res.stdout) {
+    return {
+      name: ".NET SDK",
+      status: "unknown",
+      detail: "could not run `dotnet --list-sdks`"
+    };
+  }
+  if (hasNet10Sdk(res.stdout)) {
+    const newest = newestNet10Sdk(res.stdout);
+    return {
+      name: ".NET SDK",
+      status: "ok",
+      detail: newest ? `found ${newest}` : "found 10.x"
+    };
+  }
+  return {
+    name: ".NET SDK",
+    status: "missing",
+    detail: "no 10.x SDK installed",
+    fix: "Install the .NET 10 SDK \u2014 https://dotnet.microsoft.com/download"
+  };
+};
+var isMauiWorkloadInstalled = () => outputMentionsMaui(run(DOTNET, ["workload", "list"]).stdout);
+var isInteractive = () => Boolean(process.stdin.isTTY && process.stdout.isTTY);
+var installWorkload = (csprojPath) => {
+  const args = csprojPath ? ["workload", "restore", csprojPath] : ["workload", "install", "maui"];
+  console.log();
+  console.log(`  ${chalk2.dim(`Running: ${DOTNET} ${args.join(" ")}`)}`);
+  console.log(
+    `  ${chalk2.dim(
+      "This can download several hundred MB and take a few minutes."
+    )}`
+  );
+  console.log();
+  try {
+    execFileSync(DOTNET, args, { stdio: "inherit" });
+    return true;
+  } catch {
+    console.error();
+    console.error(`  ${chalk2.red("Workload install failed.")}`);
+    console.error(
+      `  ${chalk2.dim(
+        "If this is a permissions error, your SDK is in a system location and needs elevation:"
+      )}`
+    );
+    console.error(`      ${chalk2.cyan("sudo dotnet workload install maui")}`);
+    console.error();
+    return false;
+  }
+};
+var ensureMauiWorkload = async (opts = {}) => {
+  const dotnet = checkDotnetSdk();
+  if (dotnet.status === "missing") {
+    console.log();
+    console.log(`  ${chalk2.yellow("!")} ${dotnet.name} \u2014 ${dotnet.detail}`);
+    if (dotnet.fix) {
+      console.log(`      ${chalk2.dim("fix:")} ${chalk2.cyan(dotnet.fix)}`);
+    }
+    return false;
+  }
+  if (dotnet.status === "unknown") return true;
+  if (isMauiWorkloadInstalled()) return true;
+  console.log();
+  console.log(
+    `  ${chalk2.yellow("!")} The .NET MAUI workload is required but not installed.`
+  );
+  const interactive = opts.interactive ?? isInteractive();
+  if (interactive) {
+    let install = false;
+    try {
+      const res = await prompts({
+        type: "confirm",
+        name: "install",
+        message: "Install the .NET MAUI workload now?",
+        initial: true
+      });
+      install = Boolean(res.install);
+    } catch {
+      install = false;
+    }
+    if (install) {
+      if (installWorkload(opts.csprojPath) && isMauiWorkloadInstalled()) {
+        console.log(`  ${chalk2.green("\u2713")} MAUI workload installed.`);
+        return true;
+      }
+      return false;
+    }
+  }
+  console.log(
+    `      ${chalk2.dim("run:")} ${chalk2.cyan("dotnet workload install maui")}`
+  );
+  console.log(`      ${chalk2.dim("docs:")} ${chalk2.cyan(MAUI_DOCS)}`);
+  return false;
+};
+
 // src/index.ts
 var __dirname = path2.dirname(fileURLToPath(import.meta.url));
 var CLI_ROOT = path2.resolve(__dirname, "..");
@@ -124,13 +258,13 @@ var VIDRA_VERSION = "0.1.0";
 var SDK_VERSION = "0.1.0";
 var main = async () => {
   console.log();
-  console.log(chalk2.bold("  create-vidra-app"));
-  console.log(chalk2.dim("  Scaffold a new Vidra application\n"));
+  console.log(chalk3.bold("  create-vidra-app"));
+  console.log(chalk3.dim("  Scaffold a new Vidra application\n"));
   const args = parseArgs(process.argv);
   let projectDir = args._[0];
   let appId = args["app-id"];
   if (!projectDir) {
-    const res = await prompts(
+    const res = await prompts2(
       {
         type: "text",
         name: "projectDir",
@@ -147,7 +281,7 @@ var main = async () => {
   const appTitle = toTitleCase(projectDir);
   const appGuid = randomUUID().toUpperCase();
   if (!appId) {
-    const res = await prompts(
+    const res = await prompts2(
       {
         type: "text",
         name: "appId",
@@ -162,7 +296,7 @@ var main = async () => {
   const root = path2.resolve(projectDir);
   if (fs2.existsSync(root) && fs2.readdirSync(root).length > 0) {
     console.error(
-      chalk2.red(
+      chalk3.red(
         `
   Directory "${projectDir}" already exists and is not empty.
 `
@@ -171,9 +305,9 @@ var main = async () => {
     process.exit(1);
   }
   console.log();
-  console.log(`  ${chalk2.dim("Project:")}    ${chalk2.cyan(projectName)}`);
-  console.log(`  ${chalk2.dim("Directory:")}  ${chalk2.cyan(root)}`);
-  console.log(`  ${chalk2.dim("App ID:")}     ${chalk2.cyan(appId)}`);
+  console.log(`  ${chalk3.dim("Project:")}    ${chalk3.cyan(projectName)}`);
+  console.log(`  ${chalk3.dim("Directory:")}  ${chalk3.cyan(root)}`);
+  console.log(`  ${chalk3.dim("App ID:")}     ${chalk3.cyan(appId)}`);
   console.log();
   const isMonorepo = fs2.existsSync(path2.join(LOCAL_SDK_DIR, "package.json"));
   const localFeedExists = isMonorepo && fs2.existsSync(LOCAL_FEED_DIR);
@@ -193,51 +327,65 @@ var main = async () => {
   };
   const templateDir = path2.join(TEMPLATES_DIR, "react-vite");
   await scaffoldDir(templateDir, root, replacements);
-  console.log(chalk2.dim("  Creating solution..."));
+  console.log(chalk3.dim("  Creating solution..."));
   exec(`dotnet new sln -n ${projectName} --force`, root);
   const slnFile = fs2.existsSync(path2.join(root, `${projectName}.slnx`)) ? `${projectName}.slnx` : `${projectName}.sln`;
   exec(
     `dotnet sln ${slnFile} add src/${projectName}.Host/${projectName}.Host.csproj`,
     root
   );
-  console.log(chalk2.dim("  Installing npm dependencies..."));
+  console.log(chalk3.dim("  Installing npm dependencies..."));
   const uiDir = path2.join(root, "ui");
   const rootNpmOk = tryExec("npm install", root);
   const uiNpmOk = tryExec("npm install", uiDir);
   const npmOk = rootNpmOk && uiNpmOk;
   console.log();
-  console.log(chalk2.green("  Done! ") + "Your Vidra app is ready.\n");
+  console.log(chalk3.green("  Done! ") + "Your Vidra app is ready.\n");
   if (localFeedExists) {
     console.log(
-      chalk2.dim("  NuGet:") + " local feed \u2192 " + chalk2.cyan(LOCAL_FEED_DIR)
+      chalk3.dim("  NuGet:") + " local feed \u2192 " + chalk3.cyan(LOCAL_FEED_DIR)
     );
   } else if (isMonorepo) {
     console.log(
-      chalk2.yellow("  Note: ") + "Local NuGet feed not found. Run " + chalk2.cyan("./pack-local.sh") + " in the Vidra repo, then update NuGet.Config."
+      chalk3.yellow("  Note: ") + "Local NuGet feed not found. Run " + chalk3.cyan("./pack-local.sh") + " in the Vidra repo, then update NuGet.Config."
     );
   }
   if (isMonorepo) {
     console.log(
-      chalk2.dim("  npm:  ") + " @vidra-dev/sdk \u2192 " + chalk2.cyan(LOCAL_SDK_DIR)
+      chalk3.dim("  npm:  ") + " @vidra-dev/sdk \u2192 " + chalk3.cyan(LOCAL_SDK_DIR)
     );
     console.log(
-      chalk2.dim("  npm:  ") + " create-vidra-app \u2192 " + chalk2.cyan(LOCAL_CLI_DIR)
+      chalk3.dim("  npm:  ") + " create-vidra-app \u2192 " + chalk3.cyan(LOCAL_CLI_DIR)
     );
   }
   console.log();
   if (!npmOk) {
     console.log(
-      chalk2.yellow("  Note: ") + "`npm install` had errors. Re-run " + chalk2.cyan("npm install") + " in the project root and in " + chalk2.cyan("ui/") + " to retry.\n"
+      chalk3.yellow("  Note: ") + "`npm install` had errors. Re-run " + chalk3.cyan("npm install") + " in the project root and in " + chalk3.cyan("ui/") + " to retry.\n"
     );
   }
-  console.log(chalk2.bold("  Next steps:\n"));
+  const hostCsproj = path2.join(
+    root,
+    "src",
+    `${projectName}.Host`,
+    `${projectName}.Host.csproj`
+  );
+  const prereqsReady = await ensureMauiWorkload({ csprojPath: hostCsproj });
+  console.log(chalk3.bold("  Next steps:\n"));
   console.log(`    cd ${projectDir}`);
   console.log(
-    `    npm run dev  ${chalk2.dim("# starts Vite + MAUI host together")}`
+    `    npm run dev  ${chalk3.dim("# starts Vite + MAUI host together")}`
   );
+  if (!prereqsReady) {
+    console.log(
+      `    ${chalk3.dim("# tip: run")} ${chalk3.cyan(
+        "vidra doctor"
+      )} ${chalk3.dim("to verify your setup first")}`
+    );
+  }
   console.log();
 };
 main().catch((e) => {
-  console.error(chalk2.red(e.message));
+  console.error(chalk3.red(e.message));
   process.exit(1);
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-vidra-app",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "description": "Scaffold a new Vidra application (React + .NET MAUI)",
   "type": "module",
   "bin": {

package/templates/react-vite/README.md

@@ -6,9 +6,19 @@ A cross-platform application built with [Vidra](https://github.com/user/vidra)
 
 ### Prerequisites
 
-- [.NET 10 SDK](https://dotnet.microsoft.com/download) with MAUI workload
+- [.NET 10 SDK](https://dotnet.microsoft.com/download)
+- The .NET MAUI workload: `dotnet workload install maui`
 - [Node.js](https://nodejs.org/) 18+
-- Windows development must be run from a Windows machine with the MAUI Windows workload installed
+- macOS targets require Xcode; Windows targets must be built on Windows
+
+Not sure if you're set up? Run:
+
+```bash
+vidra doctor
+```
+
+It checks your .NET SDK, the MAUI workload, and (on macOS) Xcode, and prints the
+exact command to fix anything that's missing.
 
 ### Development
 

package/templates/react-vite/ui/src/App.tsx

@@ -181,58 +181,87 @@ const App = () => {
       windowSupport.setFullscreen);
 
   return (
-    <div className="container">
-      <h1>{{appTitle}}</h1>
-      <p className="subtitle">React + .NET MAUI</p>
-
-      <div className="card">
-        <p className="counter">
-          Counter: <strong>{count}</strong>
-          <span className="counter-hint">Incremented by .NET every 10s</span>
-        </p>
-      </div>
-
-      <div className="card">
-        <p className="result">{info}</p>
-
-        <div className="actions">
-          <button onClick={handleGetAppInfo}>Get App Info</button>
-          <button onClick={handleReadClipboard}>Read Clipboard</button>
-          <button onClick={handleNotification}>Send Notification</button>
-          <button onClick={handleCapabilities}>List Capabilities</button>
-        </div>
-
-        {caps && (
-          <pre className="capabilities">{JSON.stringify(caps, null, 2)}</pre>
-        )}
-      </div>
-
-      <div className="card">
-        <p className="window-summary">{windowSummary}</p>
-
-        <div className="actions">
-          <button onClick={handleGetWindowInfo}>Get Window Info</button>
-          <button onClick={handleRenameWindow}>Rename Window</button>
-          <button onClick={handleResizeWindow}>Resize Window</button>
-          {windowSupport?.center && <button onClick={handleCenterWindow}>Center Window</button>}
-          {windowSupport?.maximize && (
-            <>
-              <button onClick={handleMaximizeWindow}>Maximize Window</button>
-              <button onClick={handleRestoreWindow}>Restore Window</button>
-            </>
+    <div className="app">
+      <main className="container">
+        <header className="hero">
+          <span className="badge">
+            <span className="dot" />
+            React + .NET MAUI
+          </span>
+          <h1 className="title">{{appTitle}}</h1>
+          <p className="tagline">
+            A cross-platform desktop app with a native bridge.
+          </p>
+        </header>
+
+        <section className="card counter-card">
+          <div className="counter-meta">
+            <span className="counter-label">Live counter</span>
+            <span className="counter-sub">Incremented by .NET every 10s</span>
+          </div>
+          <span className="counter-value">{count}</span>
+        </section>
+
+        <section className="card">
+          <h2 className="card-title">Native modules</h2>
+
+          <div className="actions">
+            <button onClick={handleGetAppInfo}>Get App Info</button>
+            <button onClick={handleReadClipboard}>Read Clipboard</button>
+            <button onClick={handleNotification}>Send Notification</button>
+            <button onClick={handleCapabilities}>List Capabilities</button>
+          </div>
+
+          <p className="result">{info}</p>
+
+          {caps && (
+            <pre className="capabilities">{JSON.stringify(caps, null, 2)}</pre>
           )}
-          {windowSupport?.minimize && (
-            <button onClick={handleMinimizeWindow}>Minimize Window</button>
+        </section>
+
+        <section className="card">
+          <h2 className="card-title">Window controls</h2>
+
+          <div className="actions">
+            <button onClick={handleGetWindowInfo}>Get Window Info</button>
+            <button onClick={handleRenameWindow}>Rename Window</button>
+            <button onClick={handleResizeWindow}>Resize Window</button>
+            {windowSupport?.center && (
+              <button onClick={handleCenterWindow}>Center Window</button>
+            )}
+            {windowSupport?.maximize && (
+              <>
+                <button onClick={handleMaximizeWindow}>Maximize Window</button>
+                <button onClick={handleRestoreWindow}>Restore Window</button>
+              </>
+            )}
+            {windowSupport?.minimize && (
+              <button onClick={handleMinimizeWindow}>Minimize Window</button>
+            )}
+          </div>
+
+          <p className="window-summary">{windowSummary}</p>
+
+          {!showsAdvancedWindowActions && windowSupport && (
+            <p className="note">
+              This runtime currently supports title and size updates only.
+              Unsupported window actions are hidden automatically based on native
+              support metadata.
+            </p>
           )}
-        </div>
+        </section>
 
-        {!showsAdvancedWindowActions && windowSupport && (
-          <p className="result">
-            This runtime currently supports title and size updates only. Unsupported window actions
-            are hidden automatically based on native support metadata.
-          </p>
-        )}
-      </div>
+        <footer className="footer">
+          Built with{" "}
+          <a
+            href="https://github.com/rzamfiriu/vidra"
+            target="_blank"
+            rel="noreferrer"
+          >
+            Vidra
+          </a>
+        </footer>
+      </main>
     </div>
   );
 };