@datashow/super-visual-cli 0.1.0-rc.4 → 0.1.0-rc.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@datashow/super-visual-cli",
-  "version": "0.1.0-rc.4",
+  "version": "0.1.0-rc.6",
   "description": "CLI for validating, compiling, packaging, verifying, and deploying Super Visual projects.",
   "type": "module",
   "bin": {
@@ -25,10 +25,10 @@
     "access": "public"
   },
   "dependencies": {
-    "@datashow/super-visual-adapter-claude-dashboard": "0.1.0-rc.4",
-    "@datashow/super-visual-compiler": "0.1.0-rc.4",
-    "@datashow/super-visual-contracts": "0.1.0-rc.4",
-    "@datashow/super-visual-fabric": "0.1.0-rc.4",
+    "@datashow/super-visual-adapter-claude-dashboard": "0.1.0-rc.6",
+    "@datashow/super-visual-compiler": "0.1.0-rc.6",
+    "@datashow/super-visual-contracts": "0.1.0-rc.6",
+    "@datashow/super-visual-fabric": "0.1.0-rc.6",
     "@fontsource/source-serif-4": "5.3.1",
     "@nivo/bar": "0.99.0",
     "@nivo/line": "0.99.0",

package/src/main.mjs

@@ -16,7 +16,7 @@ import { resolveProjectTarget, targetUpdate, writeProjectTarget } from "./projec
 import { runSemanticPreviewTest, startSemanticPreview } from "./semantic-preview.mjs";
 
 const run = promisify(execFile);
-const VERSION = "0.1.0-rc.4";
+const VERSION = "0.1.0-rc.6";
 const FABRIC_ID_PATTERN = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;
 const SPINNER_FRAMES = ["|", "/", "-", "\\"];
 const progressStream = process.stderr;
@@ -65,7 +65,7 @@ export function stopActiveProgress() {
   activeProgress = null;
 }
 
-export function writeInitProgress(event) {
+export function writeCommandProgress(event) {
   if (event.status === "running") {
     stopActiveProgress();
     writeProgress(`> ${event.message}\n`);
@@ -87,6 +87,14 @@ export function writeInitProgress(event) {
   writeProgress(`${marker} ${event.message}\n`);
 }
 
+function printPreviewResult(result) {
+  process.stdout.write(`\nLocal preview is ready.\n`);
+  process.stdout.write(`URL: ${result.url}\n`);
+  process.stdout.write(`Workspace: ${result.workspace.displayName} (${result.workspace.id})\n`);
+  process.stdout.write(`Semantic model: ${result.semanticModel.displayName} (${result.semanticModel.id})\n`);
+  process.stdout.write("The preview is using live semantic-model data. Press Ctrl+C to stop it.\n");
+}
+
 function semanticInventory(model) {
   const tables = model.tables ?? [];
   return {
@@ -345,7 +353,7 @@ function createProgram() {
             workspaceId: options.workspaceId,
             workspaceName: options.workspaceName,
             semanticModelId: options.semanticModelId,
-            onProgress: json ? null : writeInitProgress,
+            onProgress: json ? null : writeCommandProgress,
           });
         } catch (error) {
           throw new CliUserError(error instanceof Error ? error.message : String(error), {
@@ -361,7 +369,7 @@ function createProgram() {
           semanticModel: { id: inspected.semanticModel.id, displayName: inspected.semanticModel.displayName, format: inspected.semanticModel.format },
           inventory: semanticInventory(inspected.semanticModel),
         };
-        if (!json) writeInitProgress({ status: "passed", message: `Verified workspace ${inspected.workspace.displayName} and semantic model ${inspected.semanticModel.displayName}` });
+        if (!json) writeCommandProgress({ status: "passed", message: `Verified workspace ${inspected.workspace.displayName} and semantic model ${inspected.semanticModel.displayName}` });
       } else if (!json && options.skipLiveValidation) {
         writeProgress("! Live Fabric validation skipped by request\n");
       } else if (!json) {
@@ -374,10 +382,10 @@ function createProgram() {
         title: options.title,
         app: options.app,
         force: options.force,
-        onProgress: json ? null : writeInitProgress,
+        onProgress: json ? null : writeCommandProgress,
       });
       if (options.workspaceId) {
-        if (!json) writeInitProgress({ status: "running", message: "Saving the reusable Fabric project binding" });
+        if (!json) writeCommandProgress({ status: "running", message: "Saving the reusable Fabric project binding" });
         const saved = await writeProjectTarget(result.directory, targetUpdate({
           ...options,
           workspaceName: options.workspaceName ?? liveValidation?.workspace.displayName,
@@ -385,7 +393,7 @@ function createProgram() {
           reportName: options.reportName ?? result.application.title,
         }));
         result.binding = { file: saved.file, ...saved.value };
-        if (!json) writeInitProgress({ status: "passed", message: `Saved Fabric binding to ${saved.file}` });
+        if (!json) writeCommandProgress({ status: "passed", message: `Saved Fabric binding to ${saved.file}` });
       }
       result.validation = { local: result.validation, live: liveValidation ?? { ok: true, status: "not-run", scope: "fabric-read-only" } };
       if (json) output(result, true);
@@ -434,23 +442,38 @@ function createProgram() {
     .option("--open", "open the preview in the default browser")
     .option("--timeout <seconds>", "Fabric operation timeout", "900")
     .action(async (project = ".", options, command) => {
-      await syncProjectSource(projectFile(project));
-      const loaded = await loadProject(projectFile(project));
-      const target = await resolveProjectTarget(loaded.root, options, { requireSemanticModel: true });
-      const client = new FabricHttpClient({ timeoutSeconds: Number(options.timeout) });
-      const preview = await startSemanticPreview({
-        client,
-        projectFile: projectFile(project),
-        workspaceId: target.workspaceId,
-        workspaceName: target.workspaceName,
-        semanticModelId: target.semanticModelId ?? target.managedSemanticModelId,
-        host: options.host,
-        port: Number(options.port),
-        open: Boolean(options.open),
-      });
-      const { close, ...result } = preview;
-      output(result, jsonEnabled(command));
-      await waitForPreviewShutdown({ close });
+      const json = jsonEnabled(command);
+      if (!json) writeProgress(`\nSuper Visual dev\n\n`);
+      try {
+        if (!json) writeCommandProgress({ status: "running", message: "Synchronizing the React source and report contract" });
+        await syncProjectSource(projectFile(project));
+        if (!json) writeCommandProgress({ status: "passed", message: "Synchronized the React source and report contract" });
+        if (!json) writeCommandProgress({ status: "running", message: "Loading the saved Fabric project binding" });
+        const loaded = await loadProject(projectFile(project));
+        const target = await resolveProjectTarget(loaded.root, options, { requireSemanticModel: true });
+        if (!json) writeCommandProgress({ status: "passed", message: "Loaded the Fabric workspace and semantic-model binding" });
+        const client = new FabricHttpClient({ timeoutSeconds: Number(options.timeout) });
+        const preview = await startSemanticPreview({
+          client,
+          projectFile: projectFile(project),
+          workspaceId: target.workspaceId,
+          workspaceName: target.workspaceName,
+          semanticModelId: target.semanticModelId ?? target.managedSemanticModelId,
+          host: options.host,
+          port: Number(options.port),
+          open: Boolean(options.open),
+          onProgress: json ? null : writeCommandProgress,
+        });
+        const { close, ...result } = preview;
+        if (json) output(result, true);
+        else printPreviewResult(result);
+        await waitForPreviewShutdown({ close });
+      } catch (error) {
+        throw new CliUserError(error instanceof Error ? error.message : String(error), {
+          summary: "Super Visual could not start the local semantic preview.",
+          guidance: "Check the project binding and your Fabric access, then run supervisual dev --open again.",
+        });
+      }
     });
 
   const preview = program.command("preview").description("exercise the local React host against a live semantic model");

package/src/semantic-preview.mjs

@@ -396,15 +396,18 @@ async function writePreviewHost(root, token) {
   await writeFile(path.join(root, "src", "config.ts"), `export const PREVIEW_TOKEN = ${JSON.stringify(token)};\n`);
 }
 
-export async function startSemanticPreview({ client, projectFile, workspaceId, workspaceName, semanticModelId, host = "127.0.0.1", port = 5173, open = false }) {
+export async function startSemanticPreview({ client, projectFile, workspaceId, workspaceName, semanticModelId, host = "127.0.0.1", port = 5173, open = false, onProgress = null }) {
   if (!["127.0.0.1", "localhost", "::1"].includes(host)) throw new Error("Semantic preview may bind only to a loopback host");
+  onProgress?.({ status: "running", step: "project", message: "Loading and validating the Super Visual project" });
   const loaded = await loadProject(projectFile);
   const diagnostics = validateCompilation(loaded);
   if (diagnostics.length) throw new Error(`Preview validation failed:\n- ${diagnostics.join("\n- ")}`);
-  const inspected = await inspectSemanticModel({ client, workspaceId, workspaceName, semanticModelId });
+  onProgress?.({ status: "passed", step: "project", message: "Validated the project contracts and semantic bindings" });
+  const inspected = await inspectSemanticModel({ client, workspaceId, workspaceName, semanticModelId, onProgress });
   const catalogMode = usesSemanticCatalog(loaded.broker);
   const brokerDiagnostics = previewBrokerSurfaceDiagnostics(inspected.semanticModel);
   const previewMode = catalogMode ? "catalog" : brokerDiagnostics.length ? "direct" : "managed";
+  onProgress?.({ status: "running", step: "compatibility", message: "Checking application queries against the selected semantic model" });
   const compatibility = catalogMode
     ? { ok: true, summary: { required: 1, matched: 1, missing: 0, ambiguous: 0 }, checks: [], diagnostics: [] }
     : checkSemanticCompatibility(inspected.semanticModel, loaded.semanticModel, loaded.broker);
@@ -412,19 +415,26 @@ export async function startSemanticPreview({ client, projectFile, workspaceId, w
     const messages = compatibility.diagnostics.map((item) => item.message);
     throw new Error(`Semantic preview compatibility failed:\n- ${messages.join("\n- ")}`);
   }
+  onProgress?.({ status: "passed", step: "compatibility", message: `Confirmed ${compatibility.summary.matched || compatibility.summary.required} semantic binding${compatibility.summary.required === 1 ? "" : "s"}` });
   loaded.previewMode = previewMode;
   if (catalogMode) loaded.catalogRows = semanticCatalogRows(inspected.semanticModel);
 
   const previewRoot = path.join(loaded.root, ".supervisual", "semantic-preview");
   const solutionRoot = path.join(previewRoot, "solution");
   const hostRoot = path.join(previewRoot, "host");
+  onProgress?.({ status: "running", step: "build", message: "Building the local preview runtime" });
   await buildSolution(projectFile, { outputDirectory: solutionRoot });
+  onProgress?.({ status: "passed", step: "build", message: "Built the local preview runtime" });
+  onProgress?.({ status: "running", step: "host", message: "Preparing the secure loopback preview host" });
   const token = randomBytes(24).toString("base64url");
   await writePreviewHost(hostRoot, token);
+  const aliases = dependencyAliases();
+  onProgress?.({ status: "passed", step: "host", message: "Prepared the secure loopback preview host" });
+  onProgress?.({ status: "running", step: "server", message: `Starting the preview server on ${host}:${port}` });
   const server = await createServer({
     root: hostRoot,
     logLevel: "silent",
-    resolve: { alias: dependencyAliases(), dedupe: ["react", "react-dom"] },
+    resolve: { alias: aliases, dedupe: ["react", "react-dom"] },
     server: {
       host,
       port: Number(port),
@@ -441,11 +451,13 @@ export async function startSemanticPreview({ client, projectFile, workspaceId, w
   const address = server.httpServer?.address();
   const actualPort = typeof address === "object" && address ? address.port : Number(port);
   const urlHost = host === "::1" ? "[::1]" : host;
+  const url = `http://${urlHost}:${actualPort}/`;
+  onProgress?.({ status: "passed", step: "server", message: `Preview server is ready at ${url}` });
   return {
     ok: true,
     status: "ready",
     mode: "live-semantic-model",
-    url: `http://${urlHost}:${actualPort}/`,
+    url,
     workspace: inspected.workspace,
     semanticModel: { id: inspected.semanticModel.id, displayName: inspected.semanticModel.displayName },
     compatibility: compatibility.summary,

package/templates/blank/package.json

@@ -10,6 +10,6 @@
     "verify": "supervisual verify ."
   },
   "devDependencies": {
-    "@datashow/super-visual-cli": "0.1.0-rc.4"
+    "@datashow/super-visual-cli": "0.1.0-rc.6"
   }
 }

package/templates/hello-world/package.json

@@ -10,6 +10,6 @@
     "verify": "supervisual verify ."
   },
   "devDependencies": {
-    "@datashow/super-visual-cli": "0.1.0-rc.4"
+    "@datashow/super-visual-cli": "0.1.0-rc.6"
   }
 }

package/templates/semantic-preview/src/main.tsx

@@ -165,8 +165,12 @@ class SemanticPreviewHost {
   }
 }
 
-document.documentElement.style.height = "100%";
-document.body.style.cssText = "height:100%;margin:0";
+// The compiled visual disables document scrolling because Power BI owns its
+// canvas viewport. The standalone preview owns the browser page instead, so it
+// must explicitly restore document flow for applications taller than the
+// viewport.
+document.documentElement.style.cssText = "min-height:100%;height:auto;overflow:auto";
+document.body.style.cssText = "min-height:100%;height:auto;margin:0;overflow:auto";
 const banner = document.getElementById("supervisual-preview-status")!;
 banner.style.cssText = "position:fixed;right:12px;bottom:12px;z-index:2147483647;padding:7px 10px;border-radius:5px;background:#173c36;color:white;font:12px/1.3 system-ui;box-shadow:0 2px 10px #0003";
 new SemanticPreviewHost();