create-vidra-app 0.2.2 → 0.3.0

package/dist/cli.js

@@ -33,7 +33,7 @@ import { execSync, spawn } from "child_process";
 
 // src/theme.ts
 import chalk from "chalk";
-var CLI_VERSION = "0.1.5";
+var CLI_VERSION = "0.3.0";
 var STEP_LABEL_WIDTH = 16;
 var lime = chalk.hex("#c8f751");
 var value = chalk.hex("#e8e8ec");
@@ -1034,6 +1034,83 @@ import path6 from "path";
 import fs5 from "fs-extra";
 import { execFileSync as execFileSync4, spawn as spawn2 } from "child_process";
 import { request } from "http";
+
+// src/dev-port.ts
+import { createServer } from "net";
+import prompts2 from "prompts";
+var MIN_PORT = 1;
+var MAX_PORT = 65535;
+var isValidPort = (port) => Number.isInteger(port) && port >= MIN_PORT && port <= MAX_PORT;
+var isPortAvailable = (port, hostname) => new Promise((resolve, reject) => {
+  const server = createServer();
+  server.unref();
+  server.once("error", (error) => {
+    if (error.code === "EADDRINUSE" || error.code === "EACCES") {
+      resolve(false);
+      return;
+    }
+    reject(error);
+  });
+  server.listen({ host: hostname, port, exclusive: true }, () => {
+    server.close((error) => {
+      if (error) {
+        reject(error);
+        return;
+      }
+      resolve(true);
+    });
+  });
+});
+var findNextAvailablePort = async (occupiedPort, hostname, probe = isPortAvailable) => {
+  for (let port = occupiedPort + 1; port <= MAX_PORT; port++) {
+    if (await probe(port, hostname)) return port;
+  }
+  throw new Error(`No available port found after ${occupiedPort}`);
+};
+var defaultPrompt = async (question) => {
+  const result = await prompts2(question, { onCancel: () => false });
+  return { port: result.port };
+};
+var selectDevServerUrl = async (configuredUrl, options = {}) => {
+  const url = new URL(configuredUrl);
+  const port = Number(url.port);
+  if (!isValidPort(port)) {
+    throw new Error(`Dev server URL must include a valid port: ${configuredUrl}`);
+  }
+  const probe = options.isPortAvailable ?? isPortAvailable;
+  if (await probe(port, url.hostname)) return configuredUrl;
+  const interactive = options.interactive ?? isInteractive();
+  if (!interactive) {
+    throw new Error(
+      `Port ${port} is already in use and no interactive terminal is available`
+    );
+  }
+  const suggestedPort = await findNextAvailablePort(port, url.hostname, probe);
+  const prompt = options.prompt ?? defaultPrompt;
+  const result = await prompt({
+    type: "number",
+    name: "port",
+    message: `Port ${port} is already in use. Choose another port:`,
+    initial: suggestedPort,
+    validate: async (value2) => {
+      if (!isValidPort(value2)) {
+        return `Enter a port between ${MIN_PORT} and ${MAX_PORT}`;
+      }
+      return await probe(value2, url.hostname) || `Port ${value2} is already in use`;
+    }
+  });
+  const selectedPort = result.port;
+  if (selectedPort === void 0) {
+    throw new Error("Port selection cancelled");
+  }
+  if (!isValidPort(selectedPort) || !await probe(selectedPort, url.hostname)) {
+    throw new Error(`Port ${selectedPort} is not available`);
+  }
+  url.port = String(selectedPort);
+  return url.toString();
+};
+
+// src/commands/dev.ts
 var POLL_INTERVAL_MS = 500;
 var POLL_TIMEOUT_MS = 3e4;
 var NPM_COMMAND = process.platform === "win32" ? "npm.cmd" : "npm";
@@ -1056,7 +1133,7 @@ var startSession = async (argv, opts) => {
   const targetName = args["target"] || detectPlatform();
   const verbose = !!args["verbose"];
   let hotReload = opts.hotReloadDefault && !args["no-hot-reload"];
-  const viteUrl = process.env.VIDRA_DEV_URL || "http://localhost:5173";
+  let viteUrl = process.env.VIDRA_DEV_URL || "http://localhost:5173";
   const target = TARGETS2[targetName];
   if (!target) {
     const supported = Object.keys(TARGETS2).join(", ");
@@ -1087,6 +1164,9 @@ var startSession = async (argv, opts) => {
       console.log(fixLine(blocker.fix));
     }
   }
+  if (opts.vite) {
+    viteUrl = await selectDevServerUrl(viteUrl);
+  }
   const session = new DevSession(project, target, viteUrl, verbose, {
     vite: opts.vite,
     hotReload
@@ -1117,6 +1197,14 @@ var dotnetWatchEnv = (devUrl) => ({
   DOTNET_WATCH_SUPPRESS_EMOJIS: "1",
   DOTNET_WATCH_SUPPRESS_LAUNCH_BROWSER: "1"
 });
+var buildViteArgs = (devUrl) => [
+  "run",
+  "dev",
+  "--",
+  "--port",
+  new URL(devUrl).port,
+  "--strictPort"
+];
 var HOST_READY_SENTINEL = "[vidra] host ready";
 var classifyWatchLine = (line) => {
   if (/waiting for a file to change/i.test(line)) return "appWaiting";
@@ -1223,7 +1311,7 @@ var DevSession = class {
   }
   startVite() {
     console.log(taggedRow("active", "ui", dim("starting dev server\u2026")));
-    const vite = spawn2(NPM_COMMAND, ["run", "dev"], {
+    const vite = spawn2(NPM_COMMAND, buildViteArgs(this.viteUrl), {
       cwd: this.project.uiDir,
       stdio: ["ignore", "pipe", "pipe"],
       shell: process.platform === "win32"

package/dist/index.js

@@ -329,8 +329,8 @@ var VIDRA_REPO_ROOT = path2.resolve(CLI_ROOT, "..", "..", "..");
 var LOCAL_FEED_DIR = path2.join(VIDRA_REPO_ROOT, "dist", "packages");
 var LOCAL_CLI_DIR = CLI_ROOT;
 var LOCAL_SDK_DIR = path2.join(VIDRA_REPO_ROOT, "src", "sdk", "vidra-js");
-var VIDRA_VERSION = "0.2.2";
-var SDK_VERSION = "0.1.0";
+var VIDRA_VERSION = "0.3.0";
+var SDK_VERSION = "0.2.0";
 var main = async () => {
   console.log();
   console.log(`  create-${lime("vidra")}-app`);

package/package.json

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

package/templates/react-vite/src/{{projectName}}.Host/CounterJsContract.cs

@@ -0,0 +1,10 @@
+using Vidra.Bridge;
+
+namespace {{projectName}};
+
+[JsContract("counter")]
+public interface ICounterJs
+{
+    [JsMethod("increment")]
+    Task<int> IncrementAsync();
+}

package/templates/react-vite/src/{{projectName}}.Host/MainPage.cs

@@ -22,7 +22,7 @@ public class MainPage : VidraPage
     {
         try
         {
-            var count = await Bridge.CallJsAsync<int>("counter.increment");
+            var count = await Bridge.Js().Counter.IncrementAsync();
             System.Diagnostics.Debug.WriteLine($"[MainPage] Counter is now {count}");
         }
         catch (Exception ex)

package/templates/react-vite/src/{{projectName}}.Host/{{projectName}}.Host.csproj

@@ -42,6 +42,7 @@
       preserved.
     -->
     <MtouchLink Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'maccatalyst' And '$(Configuration)' == 'Debug'">None</MtouchLink>
+    <VidraTsOutputDir>$(MSBuildProjectDirectory)/../../ui/src/generated</VidraTsOutputDir>
   </PropertyGroup>
 
   <ItemGroup>

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

@@ -1,6 +1,15 @@
 import { type MouseEvent, useEffect, useRef, useState } from "react";
-import { app, appWindow, browser, clipboard, notifications, vidra } from "@vidra-dev/sdk";
-import type { WindowInfo, WindowSupport } from "@vidra-dev/sdk";
+import {
+  app,
+  appWindow,
+  browser,
+  clipboard,
+  notifications,
+  runtime,
+  vidra,
+} from "@vidra-dev/sdk";
+import type { Capabilities, WindowInfo, WindowSupport } from "@vidra-dev/sdk";
+import { counterHandlers } from "./generated/index.js";
 
 const describeWindow = (windowInfo: WindowInfo): string => {
   const title = windowInfo.title || "(untitled)";
@@ -17,22 +26,21 @@ const App = () => {
     "Window controls are ready. Click a button to inspect or update the native window.",
   );
   const [windowSupport, setWindowSupport] = useState<WindowSupport | null>(null);
-  const [caps, setCaps] = useState<Record<string, string[]> | null>(null);
+  const [caps, setCaps] = useState<Capabilities | null>(null);
   const [count, setCount] = useState(0);
   const [csReloaded, setCsReloaded] = useState<string | null>(null);
   const countRef = useRef(0);
   const reloadFlashTimer = useRef<number | undefined>(undefined);
 
   useEffect(() => {
-    const unsubscribeCounter = vidra.handle<void, number>("counter.increment", () => {
+    const unsubscribeCounter = counterHandlers.increment(() => {
       countRef.current += 1;
       setCount(countRef.current);
       return countRef.current;
     });
 
     // Emitted by the native host when `vidra dev` hot reloads edited C#.
-    const unsubscribeHotReloaded = vidra.on<{ updatedTypes?: string[] }>(
-      "vidra.hotReloaded",
+    const unsubscribeHotReloaded = runtime.onHotReloaded(
       (data) => {
         const typeName = data?.updatedTypes?.[0]?.split(".").pop();
         setCsReloaded(typeName ? `C# reloaded · ${typeName}` : "C# reloaded");

package/templates/react-vite/ui/src/generated/counter.ts

@@ -0,0 +1,10 @@
+// Auto-generated by vidra-codegen. Do not edit.
+import type { VidraClient } from "@vidra-dev/sdk";
+
+export class CounterHandlers {
+  constructor(private client: VidraClient) {}
+
+  increment(handler: () => number | Promise<number>): () => void {
+    return this.client.unsafe.handle("counter", "increment", handler);
+  }
+}

package/templates/react-vite/ui/src/generated/index.ts

@@ -0,0 +1,9 @@
+// Auto-generated by vidra-codegen. Do not edit.
+import { vidra } from "@vidra-dev/sdk";
+import { CounterHandlers } from "./counter.js";
+
+vidra.registerGeneratedManifest("app", "d3044812d17c42049962d730fced04a6ecd711e287cdd0da7b218b327ee6cd56");
+
+export const counterHandlers = new CounterHandlers(vidra);
+
+export * from "./counter.js";

package/templates/react-vite/ui/src/generated/manifest.json

@@ -0,0 +1,17 @@
+{
+  "contracts": {
+    "counter": {
+      "nativeMethods": {},
+      "events": {},
+      "jsMethods": {
+        "increment": {
+          "returns": {
+            "kind": "primitive",
+            "tsType": "number"
+          }
+        }
+      }
+    }
+  },
+  "fingerprint": "d3044812d17c42049962d730fced04a6ecd711e287cdd0da7b218b327ee6cd56"
+}