llm-usage-metrics 0.4.1 → 0.4.3

package/dist/index.js

@@ -2580,7 +2580,7 @@ function renderCommitBarLabels(monthlyRows, chartLeft, stepX, maxCommits, chartT
   return monthlyRows.map((row, i) => {
     const x = chartLeft + i * stepX;
     const yTop = scaleY(row.commitCount, maxCommits, chartTop, chartBottom);
-    return `<text x="${x.toFixed(2)}" y="${(yTop - 8).toFixed(0)}" text-anchor="middle" font-size="12" font-weight="600" fill="${shareTheme.textSecondary}" font-family="${shareTheme.font}">${formatInteger(row.commitCount)}</text>`;
+    return `<text x="${x.toFixed(2)}" y="${(yTop - 8).toFixed(0)}" text-anchor="middle" font-size="12" font-weight="600" fill="${shareTheme.textSecondary}" font-family="${shareTheme.font}">${escapeSvg(formatInteger(row.commitCount))}</text>`;
   }).join("\n");
 }
 function renderUsdDataLabels(monthlyRows, usdPoints) {
@@ -5337,6 +5337,7 @@ function emitEnvVarOverrides(activeEnvOverrides, diagnosticsLogger) {
 }
 
 // src/cli/share-artifact.ts
+import { spawn as spawn3 } from "child_process";
 import { writeFile as writeFile4 } from "fs/promises";
 import path13 from "path";
 async function writeShareSvgFile(fileName, svgContent) {
@@ -5344,6 +5345,78 @@ async function writeShareSvgFile(fileName, svgContent) {
   await writeFile4(outputPath, svgContent, "utf8");
   return outputPath;
 }
+function stringifyError(error) {
+  if (error instanceof Error) {
+    return error.message;
+  }
+  return String(error);
+}
+function resolveOpenCommand(filePath, platform) {
+  if (platform === "win32") {
+    return {
+      command: "cmd",
+      args: ["/c", "start", "", filePath]
+    };
+  }
+  if (platform === "darwin") {
+    return {
+      command: "open",
+      args: [filePath]
+    };
+  }
+  return {
+    command: "xdg-open",
+    args: [filePath]
+  };
+}
+async function spawnDetached(command, args) {
+  await new Promise((resolve, reject) => {
+    const child = spawn3(command, args, {
+      detached: true,
+      stdio: "ignore",
+      windowsHide: true
+    });
+    const cleanup = () => {
+      child.removeListener("error", onError);
+      child.removeListener("spawn", onSpawn);
+    };
+    const onError = (error) => {
+      cleanup();
+      reject(error);
+    };
+    const onSpawn = () => {
+      cleanup();
+      child.unref();
+      resolve();
+    };
+    child.once("error", onError);
+    child.once("spawn", onSpawn);
+  });
+}
+async function openShareSvgFile(filePath, deps = {}) {
+  const platform = deps.platform ?? process.platform;
+  const runDetached = deps.spawnDetached ?? spawnDetached;
+  const { command, args } = resolveOpenCommand(filePath, platform);
+  await runDetached(command, args);
+}
+async function writeAndOpenShareSvgFile(fileName, svgContent, deps = {}) {
+  const writeShareSvg = deps.writeShareSvgFileFn ?? writeShareSvgFile;
+  const openShareSvg = deps.openShareSvgFileFn ?? openShareSvgFile;
+  const outputPath = await writeShareSvg(fileName, svgContent);
+  try {
+    await openShareSvg(outputPath);
+    return {
+      outputPath,
+      opened: true
+    };
+  } catch (error) {
+    return {
+      outputPath,
+      opened: false,
+      openErrorMessage: stringifyError(error)
+    };
+  }
+}
 
 // src/render/table-text-layout.ts
 var ansiEscapePattern = new RegExp(String.raw`\u001B\[[0-9;]*m`, "gu");
@@ -6454,11 +6527,18 @@ async function runEfficiencyReport(granularity, options) {
     });
   }
   if (preparedReport.shareSvg) {
-    const outputPath = await writeShareSvgFile(
+    const shareResult = await writeAndOpenShareSvgFile(
       "efficiency-monthly-share.svg",
       preparedReport.shareSvg
     );
-    logger.info(`Wrote efficiency share SVG: ${outputPath}`);
+    logger.info(`Wrote efficiency share SVG: ${shareResult.outputPath}`);
+    if (shareResult.opened) {
+      logger.info(`Opened efficiency share SVG: ${shareResult.outputPath}`);
+    } else {
+      logger.warn(
+        `Could not open efficiency share SVG: ${shareResult.outputPath} (${shareResult.openErrorMessage})`
+      );
+    }
   }
   console.log(preparedReport.output);
 }
@@ -7227,11 +7307,18 @@ async function runOptimizeReport(granularity, options) {
     });
   }
   if (preparedReport.shareSvg) {
-    const outputPath = await writeShareSvgFile(
+    const shareResult = await writeAndOpenShareSvgFile(
       "optimize-monthly-share.svg",
       preparedReport.shareSvg
     );
-    logger.info(`Wrote optimize share SVG: ${outputPath}`);
+    logger.info(`Wrote optimize share SVG: ${shareResult.outputPath}`);
+    if (shareResult.opened) {
+      logger.info(`Opened optimize share SVG: ${shareResult.outputPath}`);
+    } else {
+      logger.warn(
+        `Could not open optimize share SVG: ${shareResult.outputPath} (${shareResult.openErrorMessage})`
+      );
+    }
   }
   console.log(preparedReport.output);
 }
@@ -7296,6 +7383,11 @@ var H3 = 560;
 var ACCENT_H3 = 4;
 var FOOTER_H3 = 36;
 var pad3 = { top: 140, right: 80, bottom: 60 + FOOTER_H3, left: 200 };
+var STAT_X = 60;
+var STAT_VALUE_FONT_SIZE = 52;
+var STAT_VALUE_WIDTH_FACTOR = 0.6;
+var SOURCE_PILLS_MIN_X = pad3.left + 10;
+var SOURCE_PILLS_STAT_GAP = 24;
 function extractPeriodSourceRows(rows) {
   return rows.filter((r) => r.rowType === "period_source");
 }
@@ -7333,16 +7425,10 @@ function buildStackedValues(series) {
   return stacked;
 }
 function renderAccentBar() {
-  return [
-    `<defs><linearGradient id="accent-grad" x1="0" y1="0" x2="1" y2="0">`,
-    `  <stop offset="0%" stop-color="#10b981"/>`,
-    `  <stop offset="100%" stop-color="#06b6d4"/>`,
-    `</linearGradient></defs>`,
-    `<rect width="${W3}" height="${ACCENT_H3}" fill="url(#accent-grad)"/>`
-  ].join("\n");
+  return `<rect width="${W3}" height="${ACCENT_H3}" fill="url(#accent-grad)"/>`;
 }
 function renderStatColumn(totalTokens, costUsd, sourceCount) {
-  const x = 60;
+  const x = STAT_X;
   const baseY = ACCENT_H3 + 48;
   let svg = "";
   svg += `<text x="${x}" y="${baseY}" fill="${shareTheme.textPrimary}" font-family="${shareTheme.font}" font-size="52" font-weight="800">${escapeSvg(formatCompact(totalTokens))}</text>
@@ -7357,9 +7443,9 @@ function renderStatColumn(totalTokens, costUsd, sourceCount) {
 `;
   return svg;
 }
-function renderSourcePills(series) {
+function renderSourcePills(series, startX) {
   let svg = "";
-  let cx = pad3.left + 10;
+  let cx = Math.max(SOURCE_PILLS_MIN_X, startX);
   const pillY = ACCENT_H3 + 30;
   for (const s of series) {
     const label = `${s.source}  ${formatCompact(s.total)}`;
@@ -7376,6 +7462,10 @@ function renderSourcePills(series) {
   }
   return svg;
 }
+function estimateStatValueRightEdge(totalTokens) {
+  const value = formatCompact(totalTokens);
+  return STAT_X + value.length * STAT_VALUE_FONT_SIZE * STAT_VALUE_WIDTH_FACTOR;
+}
 function renderCommandBadge(command) {
   const textW = command.length * 9;
   const badgeW = textW + 28;
@@ -7500,6 +7590,7 @@ function renderUsageShareSvg(usageData, granularity) {
   const toX = (p) => chartLeft + (periodCount <= 1 ? chartW / 2 : p / (periodCount - 1) * chartW);
   const toChartY = (val) => scaleY(val, maxY, chartTop, chartBottom);
   const commandText = `llm-usage ${granularity} --share`;
+  const sourcePillsStartX = estimateStatValueRightEdge(totalTokens) + SOURCE_PILLS_STAT_GAP;
   let chartContent;
   if (periodCount === 0) {
     chartContent = `<text x="${(W3 / 2).toFixed(0)}" y="${(H3 / 2).toFixed(0)}" text-anchor="middle" font-size="20" fill="${shareTheme.textSecondary}" font-family="${shareTheme.font}">No usage data available</text>`;
@@ -7524,6 +7615,10 @@ function renderUsageShareSvg(usageData, granularity) {
   }
   return `<svg xmlns="http://www.w3.org/2000/svg" width="${W3}" height="${H3}" viewBox="0 0 ${W3} ${H3}">
 <defs>
+  <linearGradient id="accent-grad" x1="0" y1="0" x2="1" y2="0">
+    <stop offset="0%" stop-color="#10b981"/>
+    <stop offset="100%" stop-color="#06b6d4"/>
+  </linearGradient>
   <clipPath id="chart-clip">
     <rect x="${chartLeft}" y="${chartTop - 4}" width="${chartW}" height="${chartH + 8}"/>
   </clipPath>
@@ -7532,7 +7627,7 @@ function renderUsageShareSvg(usageData, granularity) {
 <rect width="${W3}" height="${H3}" fill="${shareTheme.bg}"/>
 ${renderAccentBar()}
 ${renderStatColumn(totalTokens, totalCost, activeSeries.length)}
-${renderSourcePills(activeSeries)}
+${renderSourcePills(activeSeries, sourcePillsStartX)}
 ${renderCommandBadge(commandText)}
 ${renderGridLines(chartLeft, chartRight, chartTop, chartH, maxY)}
 ${chartContent}
@@ -7586,11 +7681,18 @@ async function runUsageReport(granularity, options) {
     });
   }
   if (preparedReport.shareSvg) {
-    const outputPath = await writeShareSvgFile(
+    const shareResult = await writeAndOpenShareSvgFile(
       resolveShareFileName(granularity),
       preparedReport.shareSvg
     );
-    logger.info(`Wrote usage share SVG: ${outputPath}`);
+    logger.info(`Wrote usage share SVG: ${shareResult.outputPath}`);
+    if (shareResult.opened) {
+      logger.info(`Opened usage share SVG: ${shareResult.outputPath}`);
+    } else {
+      logger.warn(
+        `Could not open usage share SVG: ${shareResult.outputPath} (${shareResult.openErrorMessage})`
+      );
+    }
   }
   console.log(preparedReport.output);
 }
@@ -7761,7 +7863,7 @@ function loadPackageMetadataFromRuntime() {
 var { packageName, packageVersion } = loadPackageMetadataFromRuntime();
 var updateRuntimeConfig = getUpdateNotifierRuntimeConfig();
 var cli = createCli({ version: packageVersion });
-try {
+async function main() {
   const updateResult = await checkForUpdatesAndMaybeRestart({
     packageName,
     currentVersion: packageVersion,
@@ -7773,9 +7875,10 @@ try {
   } else {
     await cli.parseAsync(process.argv);
   }
-} catch (error) {
+}
+main().catch((error) => {
   const message = error instanceof Error ? error.message : String(error);
   console.error(message);
   process.exitCode = 1;
-}
+});
 //# sourceMappingURL=index.js.map