inconvo 1.1.2 → 1.2.1

package/README.md

@@ -13,9 +13,12 @@ npx inconvo@latest add assistant-ui-tool-components
 Options:
 
 - `--cwd <path>` – run the installer against a different project directory
-- `--path <relative>` – override the target folder (defaults to `src/components/assistant-ui/tools`)
+- `--path <relative>` – override the root folder used for file output (defaults to `src`)
 - `--overwrite` – replace any files that already exist without prompting
 - `--yes` – answer "yes" to interactive prompts
+- `--skip-install` – copy files only and skip dependency installation
+
+By default the installer writes everything under `src/`, including the tool components and their supporting `src/lib/inconvo/types.ts`. It also installs external dependencies such as `recharts` and `@tanstack/react-table` unless you opt out with `--skip-install`.
 
 ## Development
 

package/dist/commands/add.js

@@ -3,6 +3,7 @@ import path from "node:path";
 import fs from "node:fs/promises";
 import { logger } from "../lib/logger.js";
 import { confirmPrompt } from "../lib/prompt.js";
+import { installDependencies } from "../lib/install-dependencies.js";
 import { componentPacks, getPack } from "../templates/packs.js";
 export const addCommand = new Command()
     .name("add")
@@ -12,6 +13,7 @@ export const addCommand = new Command()
     .option("-o, --overwrite", "overwrite existing files without prompting", false)
     .option("-c, --cwd <cwd>", "working directory that will receive the files", process.cwd())
     .option("-p, --path <path>", "relative path where the pack should be written")
+    .option("--skip-install", "skip installing npm dependencies", false)
     .action(async (packName, opts) => {
     const pack = getPack(packName);
     if (!pack) {
@@ -68,6 +70,24 @@ export const addCommand = new Command()
     if (replaced.size) {
         logger.info(`Overwrote ${replaced.size} file(s).`);
     }
+    if (pack.dependencies) {
+        const depList = Object.entries(pack.dependencies).map(([name, version]) => `${name}@${version}`);
+        if (!depList.length)
+            return;
+        if (opts.skipInstall) {
+            logger.warn(`Skipping dependency installation (--skip-install). Please install manually:\n  ${depList.join(" ")}`);
+        }
+        else {
+            try {
+                await installDependencies(pack.dependencies, cwd);
+                logger.success("Dependencies installed.");
+            }
+            catch (error) {
+                logger.error(`Failed to install dependencies automatically. Please install manually: ${depList.join(" ")}`);
+                logger.error(error?.message ?? String(error));
+            }
+        }
+    }
     logger.success(`Installed ${pack.name}!`);
 });
 async function collectFiles(dir) {

package/dist/lib/install-dependencies.js

@@ -0,0 +1,38 @@
+import { spawn } from "node:child_process";
+import { detect } from "detect-package-manager";
+import { logger } from "./logger.js";
+const installArgsMap = {
+    npm: ["install", "--save"],
+    pnpm: ["add"],
+    yarn: ["add"],
+    bun: ["add"],
+};
+export async function installDependencies(dependencies, cwd) {
+    const depList = Object.entries(dependencies).map(([name, version]) => version ? `${name}@${version}` : name);
+    if (!depList.length)
+        return;
+    const packageManager = await detect({ cwd });
+    const args = installArgsMap[packageManager]
+        ? [...installArgsMap[packageManager], ...depList]
+        : ["install", ...depList];
+    logger.step(`Installing dependencies with ${packageManager}: ${depList.join(", ")}`);
+    await runCommand(packageManager, args, cwd);
+}
+function runCommand(command, args, cwd) {
+    return new Promise((resolve, reject) => {
+        const child = spawn(command, args, {
+            cwd,
+            stdio: "inherit",
+            shell: process.platform === "win32",
+        });
+        child.on("close", (code) => {
+            if (code === 0) {
+                resolve();
+            }
+            else {
+                reject(new Error(`${command} exited with code ${code}`));
+            }
+        });
+        child.on("error", (error) => reject(error));
+    });
+}

package/dist/templates/packs.js

@@ -3,8 +3,12 @@ export const componentPacks = {
     "assistant-ui-tool-components": {
         name: "assistant-ui-tool-components",
         description: "Inconvo-flavored assistant-ui tools and supporting components.",
-        templateDir: resolveFromRoot("templates", "assistant-ui", "tools"),
-        targetDir: "src/components/assistant-ui/tools",
+        templateDir: resolveFromRoot("templates", "assistant-ui", "src"),
+        targetDir: "src",
+        dependencies: {
+            recharts: "^3.5.1",
+            "@tanstack/react-table": "^8.21.3",
+        },
     },
 };
 export function getPack(name) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "inconvo",
-  "version": "1.1.2",
+  "version": "1.2.1",
   "description": "CLI for installing Inconvo assistant-ui tool components into any project.",
   "license": "MIT",
   "type": "module",
@@ -18,7 +18,8 @@
   },
   "dependencies": {
     "chalk": "^5.3.0",
-    "commander": "^14.0.0"
+    "commander": "^14.0.0",
+    "detect-package-manager": "^3.0.2"
   },
   "devDependencies": {
     "@semantic-release/commit-analyzer": "^13.0.1",

package/templates/assistant-ui/src/components/assistant-ui/tools/inconvo-chart-colors.ts

@@ -0,0 +1,15 @@
+const chartColorVars = [
+  "var(--chart-1)",
+  "var(--chart-2)",
+  "var(--chart-3)",
+  "var(--chart-4)",
+  "var(--chart-5)",
+];
+
+export const buildChartPalette = (seriesCount: number) => {
+  if (seriesCount <= 0) return [];
+  return Array.from({ length: seriesCount }, (_, index) => {
+    const colorIndex = index % chartColorVars.length;
+    return chartColorVars[colorIndex] ?? "var(--chart-series-primary)";
+  });
+};

package/templates/assistant-ui/{tools → src/components/assistant-ui/tools}/inconvo-chart.tsx

@@ -1,7 +1,6 @@
 "use client";
 
 import { useMemo, type ReactNode } from "react";
-import { useTheme } from "next-themes";
 import {
   ResponsiveContainer,
   LineChart as RechartsLineChart,
@@ -17,7 +16,7 @@ import {
 } from "recharts";
 
 import type { InconvoChartData, InconvoChartType } from "~/lib/inconvo/types";
-import { buildGreyscalePalette } from "~/components/assistant-ui/tools/inconvo-chart-colors";
+import { buildChartPalette } from "~/components/assistant-ui/tools/inconvo-chart-colors";
 
 interface InconvoChartProps {
   data: InconvoChartData;
@@ -107,8 +106,6 @@ export const InconvoChart = ({
   xLabel,
   yLabel,
 }: InconvoChartProps) => {
-  const { resolvedTheme } = useTheme();
-
   const chartData = useMemo(() => {
     return data.labels.map((label, index) => {
       const row: { name: string; [key: string]: string | number } = {
@@ -121,10 +118,10 @@ export const InconvoChart = ({
     });
   }, [data]);
 
-  const palette = useMemo(() => {
-    const isDarkMode = resolvedTheme === "dark";
-    return buildGreyscalePalette(data.datasets.length, isDarkMode);
-  }, [data.datasets.length, resolvedTheme]);
+  const palette = useMemo(
+    () => buildChartPalette(data.datasets.length),
+    [data.datasets.length],
+  );
 
   const axisColor = "var(--muted-foreground)";
   const textColor = "var(--foreground)";

package/templates/assistant-ui/src/lib/inconvo/types.ts

@@ -0,0 +1,118 @@
+export type InconvoChartType = "bar" | "line";
+
+export interface InconvoChartDataset {
+  name: string;
+  values: number[];
+}
+
+export interface InconvoChartData {
+  labels: string[];
+  datasets: InconvoChartDataset[];
+}
+
+export interface InconvoChart {
+  data: InconvoChartData;
+  title?: string;
+  xLabel?: string;
+  yLabel?: string;
+  type: InconvoChartType;
+}
+
+export interface InconvoTable {
+  head: string[];
+  body: string[][];
+}
+
+export type InconvoResponseType = "text" | "chart" | "table";
+
+export interface InconvoResponse {
+  id?: string;
+  conversationId?: string;
+  message: string;
+  type: InconvoResponseType;
+  chart?: InconvoChart;
+  table?: InconvoTable;
+}
+
+const isStringArray = (value: unknown): value is string[] => {
+  return Array.isArray(value) && value.every((item) => typeof item === "string");
+};
+
+const isNumberArray = (value: unknown): value is number[] => {
+  return Array.isArray(value) && value.every((item) => typeof item === "number");
+};
+
+const isDataset = (value: unknown): value is InconvoChartDataset => {
+  return (
+    typeof value === "object" &&
+    value !== null &&
+    typeof (value as InconvoChartDataset).name === "string" &&
+    isNumberArray((value as InconvoChartDataset).values)
+  );
+};
+
+const isChartData = (value: unknown): value is InconvoChartData => {
+  return (
+    typeof value === "object" &&
+    value !== null &&
+    isStringArray((value as InconvoChartData).labels) &&
+    Array.isArray((value as InconvoChartData).datasets) &&
+    (value as InconvoChartData).datasets.every(isDataset)
+  );
+};
+
+const isChart = (value: unknown): value is InconvoChart => {
+  return (
+    typeof value === "object" &&
+    value !== null &&
+    ((value as InconvoChart).type === "bar" || (value as InconvoChart).type === "line") &&
+    isChartData((value as InconvoChart).data)
+  );
+};
+
+const isTable = (value: unknown): value is InconvoTable => {
+  return (
+    typeof value === "object" &&
+    value !== null &&
+    isStringArray((value as InconvoTable).head) &&
+    Array.isArray((value as InconvoTable).body) &&
+    (value as InconvoTable).body.every(isStringArray)
+  );
+};
+
+const isInconvoResponse = (value: unknown): value is InconvoResponse => {
+  if (typeof value !== "object" || value === null) {
+    return false;
+  }
+
+  const candidate = value as InconvoResponse;
+  if (typeof candidate.message !== "string") {
+    return false;
+  }
+
+  if (candidate.type !== "text" && candidate.type !== "chart" && candidate.type !== "table") {
+    return false;
+  }
+
+  if (candidate.type === "chart" && !isChart(candidate.chart)) {
+    return false;
+  }
+
+  if (candidate.type === "table" && !isTable(candidate.table)) {
+    return false;
+  }
+
+  return true;
+};
+
+export const parseInconvoResponse = (
+  value: unknown,
+): InconvoResponse | null => {
+  try {
+    const parsed: unknown =
+      typeof value === "string" ? JSON.parse(value) : value;
+    return isInconvoResponse(parsed) ? parsed : null;
+  } catch {
+    return null;
+  }
+};

package/templates/assistant-ui/tools/inconvo-chart-colors.ts

@@ -1,27 +0,0 @@
-const clamp = (value: number, min = 0, max = 1) =>
-  Math.min(Math.max(value, min), max);
-
-const lightnessToGrayHex = (lightness: number) => {
-  const channel = Math.round(clamp(lightness) * 255)
-    .toString(16)
-    .padStart(2, "0");
-  return `#${channel}${channel}${channel}`;
-};
-
-export const buildGreyscalePalette = (
-  seriesCount: number,
-  isDarkMode: boolean,
-) => {
-  if (seriesCount <= 0) return [];
-  if (seriesCount === 1) {
-    return [lightnessToGrayHex(isDarkMode ? 0.78 : 0.5)];
-  }
-
-  const start = isDarkMode ? 0.95 : 0.8;
-  const end = isDarkMode ? 0.55 : 0.15;
-  const step = (end - start) / (seriesCount - 1);
-
-  return Array.from({ length: seriesCount }, (_, index) =>
-    lightnessToGrayHex(start + step * index),
-  );
-};