inconvo 1.2.0 → 1.2.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "inconvo",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "description": "CLI for installing Inconvo assistant-ui tool components into any project.",
   "license": "MIT",
   "type": "module",

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

@@ -1,27 +1,15 @@
-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,
-) => {
+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 [];
-  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),
-  );
+  return Array.from({ length: seriesCount }, (_, index) => {
+    const colorIndex = index % chartColorVars.length;
+    return chartColorVars[colorIndex] ?? "var(--chart-series-primary)";
+  });
 };

package/templates/assistant-ui/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)";