open-mcp-app-ui 0.0.3 → 0.0.6

package/dist/charts/index.d.ts

@@ -0,0 +1,124 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { CSSProperties, ReactNode } from 'react';
+export { Area, Bar, CartesianGrid, Cell, Legend, Line, Pie, PolarAngleAxis, PolarGrid, PolarRadiusAxis, Radar, Tooltip as RechartsTooltip, ReferenceArea, ReferenceLine, ResponsiveContainer, Scatter, XAxis, YAxis } from 'recharts';
+
+/**
+ * Shared chart types.
+ * Defines the theme interface and common props used across all chart wrappers.
+ */
+
+/**
+ * Color palette for multi-series charts.
+ * Each series gets the next color in the palette.
+ * Uses CSS variables from the MCP Apps spec where possible,
+ * with opacity variations for additional series.
+ */
+declare const DEFAULT_PALETTE: string[];
+/**
+ * Base props shared by all chart container wrappers.
+ */
+interface ChartContainerProps {
+    /** Chart height in pixels. Width is always 100% of parent. */
+    height?: number;
+    /** Custom color palette for series data. Overrides the default palette. */
+    colorPalette?: string[];
+    /** Additional CSS class on the outermost wrapper. */
+    className?: string;
+    /** Inline styles on the outermost wrapper. */
+    style?: CSSProperties;
+}
+
+interface ThemedLineChartProps extends ChartContainerProps {
+    /** Chart data array. Each entry is one data point. */
+    data: Record<string, unknown>[];
+    /** Child elements (Line, XAxis, YAxis, Tooltip, Legend, etc.) */
+    children: ReactNode;
+    /** Show background grid lines. */
+    grid?: boolean;
+}
+/**
+ * Themed LineChart.
+ * Automatically assigns palette colors to Line children that
+ * don't have an explicit stroke prop.
+ */
+declare const LineChart: ({ data, height, colorPalette, className, style, grid, children, }: ThemedLineChartProps) => react_jsx_runtime.JSX.Element;
+
+interface ThemedBarChartProps extends ChartContainerProps {
+    /** Chart data array. */
+    data: Record<string, unknown>[];
+    children: ReactNode;
+    grid?: boolean;
+}
+/**
+ * Themed BarChart.
+ * Automatically assigns palette colors to Bar children.
+ */
+declare const BarChart: ({ data, height, colorPalette, className, style, grid, children, }: ThemedBarChartProps) => react_jsx_runtime.JSX.Element;
+
+interface ThemedAreaChartProps extends ChartContainerProps {
+    data: Record<string, unknown>[];
+    children: ReactNode;
+    grid?: boolean;
+}
+/**
+ * Themed AreaChart.
+ * Auto-assigns palette colors with gradient fill to Area children.
+ */
+declare const AreaChart: ({ data, height, colorPalette, className, style, grid, children, }: ThemedAreaChartProps) => react_jsx_runtime.JSX.Element;
+
+interface ThemedPieChartProps extends Omit<ChartContainerProps, "height"> {
+    /** Chart height (also used for approximate width in responsive container). */
+    height?: number;
+    children: ReactNode;
+}
+/**
+ * Themed PieChart.
+ * Auto-assigns palette colors to Pie data via Cell children when no
+ * explicit fill is provided on individual data entries.
+ */
+declare const PieChart: ({ height, colorPalette, className, style, children, }: ThemedPieChartProps) => react_jsx_runtime.JSX.Element;
+
+interface ThemedScatterChartProps extends ChartContainerProps {
+    children: ReactNode;
+    grid?: boolean;
+}
+/**
+ * Themed ScatterChart.
+ * Auto-assigns palette fill colors to Scatter children.
+ */
+declare const ScatterChart: ({ height, colorPalette, className, style, grid, children, }: ThemedScatterChartProps) => react_jsx_runtime.JSX.Element;
+
+interface ThemedRadarChartProps extends ChartContainerProps {
+    data: Record<string, unknown>[];
+    children: ReactNode;
+}
+/**
+ * Themed RadarChart.
+ * Auto-assigns palette colors to Radar children.
+ */
+declare const RadarChart: ({ data, height, colorPalette, className, style, children, }: ThemedRadarChartProps) => react_jsx_runtime.JSX.Element;
+
+interface ThemedComposedChartProps extends ChartContainerProps {
+    data: Record<string, unknown>[];
+    children: ReactNode;
+    grid?: boolean;
+}
+/**
+ * Themed ComposedChart.
+ * Auto-assigns palette colors to Line, Bar, and Area children.
+ */
+declare const ComposedChart: ({ data, height, colorPalette, className, style, grid, children, }: ThemedComposedChartProps) => react_jsx_runtime.JSX.Element;
+
+/**
+ * ThemedTooltip — Pre-themed tooltip using MCP Apps spec CSS variables.
+ *
+ * Drop-in replacement for Recharts' Tooltip that automatically
+ * applies the host's theme colors for background, text, border.
+ */
+/**
+ * A themed Tooltip that reads CSS variables at render time.
+ * Forwards all standard Recharts Tooltip props.
+ */
+declare const ThemedTooltip: (props: any) => react_jsx_runtime.JSX.Element;
+
+export { AreaChart, BarChart, type ChartContainerProps, ComposedChart, DEFAULT_PALETTE, LineChart, PieChart, RadarChart, ScatterChart, ThemedTooltip as Tooltip };

package/dist/charts/index.js

@@ -0,0 +1,401 @@
+// src/charts/LineChart.tsx
+import { Children, cloneElement, isValidElement } from "react";
+import {
+  LineChart as RechartsLineChart,
+  Line as RechartsLine,
+  CartesianGrid
+} from "recharts";
+
+// src/charts/ChartContainer.tsx
+import { ResponsiveContainer } from "recharts";
+
+// src/charts/types.ts
+var DEFAULT_PALETTE = [
+  "var(--color-accent, #6366f1)",
+  "var(--color-text-secondary, #6b7280)",
+  "var(--color-ring-primary, #a78bfa)",
+  "var(--color-text-tertiary, #9ca3af)",
+  "var(--color-border-primary, #d1d5db)",
+  "color-mix(in srgb, var(--color-accent, #6366f1) 60%, transparent)",
+  "color-mix(in srgb, var(--color-accent, #6366f1) 35%, transparent)"
+];
+
+// src/charts/ChartContainer.tsx
+import { jsx } from "react/jsx-runtime";
+var ChartContainer = ({
+  height = 300,
+  className = "",
+  style,
+  children
+}) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    className: `omu-chart w-full ${className}`,
+    style: { height: `${height}px`, ...style },
+    children: /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: "100%", children })
+  }
+);
+var getSeriesColor = ({
+  index,
+  palette
+}) => {
+  const colors = palette ?? DEFAULT_PALETTE;
+  return colors[index % colors.length];
+};
+
+// src/charts/theme.ts
+var getCSSVar = ({ name, fallback }) => {
+  if (typeof window === "undefined") return fallback;
+  const value = getComputedStyle(document.documentElement).getPropertyValue(name).trim();
+  return value || fallback;
+};
+var getTooltipStyle = () => ({
+  contentStyle: {
+    backgroundColor: getCSSVar({ name: "--color-background-secondary", fallback: "#f9fafb" }),
+    border: `1px solid ${getCSSVar({ name: "--color-border-secondary", fallback: "#e5e7eb" })}`,
+    borderRadius: getCSSVar({ name: "--border-radius-md", fallback: "8px" }),
+    color: getCSSVar({ name: "--color-text-primary", fallback: "#111827" }),
+    fontSize: getCSSVar({ name: "--font-text-sm-size", fallback: "13px" }),
+    fontFamily: getCSSVar({ name: "--font-sans", fallback: "ui-sans-serif, system-ui, sans-serif" }),
+    padding: "8px 12px",
+    boxShadow: "0 4px 12px rgba(0,0,0,0.08)"
+  },
+  labelStyle: {
+    color: getCSSVar({ name: "--color-text-primary", fallback: "#111827" }),
+    fontWeight: 500,
+    marginBottom: "4px"
+  }
+});
+var getGridColor = () => getCSSVar({ name: "--color-border-secondary", fallback: "#e5e7eb" });
+
+// src/charts/LineChart.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var LineChart = ({
+  data,
+  height,
+  colorPalette,
+  className,
+  style,
+  grid = true,
+  children
+}) => {
+  let seriesIndex = 0;
+  const themedChildren = Children.map(children, (child) => {
+    if (!isValidElement(child)) return child;
+    if (child.type === RechartsLine || child.type?.displayName === "Line") {
+      const idx = seriesIndex++;
+      const existing = child.props.stroke;
+      return cloneElement(child, {
+        stroke: existing || getSeriesColor({ index: idx, palette: colorPalette }),
+        strokeWidth: child.props.strokeWidth ?? 2,
+        dot: child.props.dot ?? false,
+        activeDot: child.props.activeDot ?? { r: 4 }
+      });
+    }
+    return child;
+  });
+  return /* @__PURE__ */ jsx2(ChartContainer, { height, className, style, children: /* @__PURE__ */ jsxs(RechartsLineChart, { data, margin: { top: 5, right: 20, bottom: 5, left: 0 }, children: [
+    grid && /* @__PURE__ */ jsx2(CartesianGrid, { strokeDasharray: "3 3", stroke: getGridColor(), opacity: 0.5 }),
+    themedChildren
+  ] }) });
+};
+
+// src/charts/BarChart.tsx
+import { Children as Children2, cloneElement as cloneElement2, isValidElement as isValidElement2 } from "react";
+import {
+  BarChart as RechartsBarChart,
+  Bar as RechartsBar,
+  CartesianGrid as CartesianGrid2
+} from "recharts";
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+var BarChart = ({
+  data,
+  height,
+  colorPalette,
+  className,
+  style,
+  grid = true,
+  children
+}) => {
+  let seriesIndex = 0;
+  const themedChildren = Children2.map(children, (child) => {
+    if (!isValidElement2(child)) return child;
+    if (child.type === RechartsBar || child.type?.displayName === "Bar") {
+      const idx = seriesIndex++;
+      const existing = child.props.fill;
+      return cloneElement2(child, {
+        fill: existing || getSeriesColor({ index: idx, palette: colorPalette }),
+        radius: child.props.radius ?? [4, 4, 0, 0]
+      });
+    }
+    return child;
+  });
+  return /* @__PURE__ */ jsx3(ChartContainer, { height, className, style, children: /* @__PURE__ */ jsxs2(RechartsBarChart, { data, margin: { top: 5, right: 20, bottom: 5, left: 0 }, children: [
+    grid && /* @__PURE__ */ jsx3(CartesianGrid2, { strokeDasharray: "3 3", stroke: getGridColor(), opacity: 0.5, vertical: false }),
+    themedChildren
+  ] }) });
+};
+
+// src/charts/AreaChart.tsx
+import { Children as Children3, cloneElement as cloneElement3, isValidElement as isValidElement3 } from "react";
+import {
+  AreaChart as RechartsAreaChart,
+  Area as RechartsArea,
+  CartesianGrid as CartesianGrid3
+} from "recharts";
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+var AreaChart = ({
+  data,
+  height,
+  colorPalette,
+  className,
+  style,
+  grid = true,
+  children
+}) => {
+  let seriesIndex = 0;
+  const themedChildren = Children3.map(children, (child) => {
+    if (!isValidElement3(child)) return child;
+    if (child.type === RechartsArea || child.type?.displayName === "Area") {
+      const idx = seriesIndex++;
+      const color = child.props.stroke || getSeriesColor({ index: idx, palette: colorPalette });
+      return cloneElement3(child, {
+        stroke: color,
+        fill: child.props.fill || color,
+        fillOpacity: child.props.fillOpacity ?? 0.15,
+        strokeWidth: child.props.strokeWidth ?? 2
+      });
+    }
+    return child;
+  });
+  return /* @__PURE__ */ jsx4(ChartContainer, { height, className, style, children: /* @__PURE__ */ jsxs3(RechartsAreaChart, { data, margin: { top: 5, right: 20, bottom: 5, left: 0 }, children: [
+    grid && /* @__PURE__ */ jsx4(CartesianGrid3, { strokeDasharray: "3 3", stroke: getGridColor(), opacity: 0.5 }),
+    themedChildren
+  ] }) });
+};
+
+// src/charts/PieChart.tsx
+import { Children as Children4, cloneElement as cloneElement4, isValidElement as isValidElement4 } from "react";
+import {
+  PieChart as RechartsPieChart,
+  Pie as RechartsPie,
+  Cell
+} from "recharts";
+import { jsx as jsx5 } from "react/jsx-runtime";
+var PieChart = ({
+  height,
+  colorPalette,
+  className,
+  style,
+  children
+}) => {
+  const themedChildren = Children4.map(children, (child) => {
+    if (!isValidElement4(child)) return child;
+    if (child.type === RechartsPie || child.type?.displayName === "Pie") {
+      const props = child.props;
+      const data = props.data ?? [];
+      const hasExplicitCells = Children4.toArray(props.children).some(
+        (c) => isValidElement4(c) && (c.type === Cell || c.type?.displayName === "Cell")
+      );
+      if (!hasExplicitCells && data.length > 0) {
+        return cloneElement4(child, {
+          children: data.map((_, i) => /* @__PURE__ */ jsx5(Cell, { fill: getSeriesColor({ index: i, palette: colorPalette }) }, `cell-${i}`))
+        });
+      }
+    }
+    return child;
+  });
+  return /* @__PURE__ */ jsx5(ChartContainer, { height, className, style, children: /* @__PURE__ */ jsx5(RechartsPieChart, { children: themedChildren }) });
+};
+
+// src/charts/ScatterChart.tsx
+import { Children as Children5, cloneElement as cloneElement5, isValidElement as isValidElement5 } from "react";
+import {
+  ScatterChart as RechartsScatterChart,
+  Scatter as RechartsScatter,
+  CartesianGrid as CartesianGrid4
+} from "recharts";
+import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+var ScatterChart = ({
+  height,
+  colorPalette,
+  className,
+  style,
+  grid = true,
+  children
+}) => {
+  let seriesIndex = 0;
+  const themedChildren = Children5.map(children, (child) => {
+    if (!isValidElement5(child)) return child;
+    if (child.type === RechartsScatter || child.type?.displayName === "Scatter") {
+      const idx = seriesIndex++;
+      const existing = child.props.fill;
+      return cloneElement5(child, {
+        fill: existing || getSeriesColor({ index: idx, palette: colorPalette })
+      });
+    }
+    return child;
+  });
+  return /* @__PURE__ */ jsx6(ChartContainer, { height, className, style, children: /* @__PURE__ */ jsxs4(RechartsScatterChart, { margin: { top: 5, right: 20, bottom: 5, left: 0 }, children: [
+    grid && /* @__PURE__ */ jsx6(CartesianGrid4, { strokeDasharray: "3 3", stroke: getGridColor(), opacity: 0.5 }),
+    themedChildren
+  ] }) });
+};
+
+// src/charts/RadarChart.tsx
+import { Children as Children6, cloneElement as cloneElement6, isValidElement as isValidElement6 } from "react";
+import {
+  RadarChart as RechartsRadarChart,
+  Radar as RechartsRadar
+} from "recharts";
+import { jsx as jsx7 } from "react/jsx-runtime";
+var RadarChart = ({
+  data,
+  height,
+  colorPalette,
+  className,
+  style,
+  children
+}) => {
+  let seriesIndex = 0;
+  const themedChildren = Children6.map(children, (child) => {
+    if (!isValidElement6(child)) return child;
+    if (child.type === RechartsRadar || child.type?.displayName === "Radar") {
+      const idx = seriesIndex++;
+      const color = child.props.stroke || getSeriesColor({ index: idx, palette: colorPalette });
+      return cloneElement6(child, {
+        stroke: color,
+        fill: child.props.fill || color,
+        fillOpacity: child.props.fillOpacity ?? 0.2
+      });
+    }
+    return child;
+  });
+  return /* @__PURE__ */ jsx7(ChartContainer, { height, className, style, children: /* @__PURE__ */ jsx7(RechartsRadarChart, { data, cx: "50%", cy: "50%", outerRadius: "70%", children: themedChildren }) });
+};
+
+// src/charts/ComposedChart.tsx
+import { Children as Children7, cloneElement as cloneElement7, isValidElement as isValidElement7 } from "react";
+import {
+  ComposedChart as RechartsComposedChart,
+  Line as RechartsLine2,
+  Bar as RechartsBar2,
+  Area as RechartsArea2,
+  CartesianGrid as CartesianGrid5
+} from "recharts";
+import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
+var ComposedChart = ({
+  data,
+  height,
+  colorPalette,
+  className,
+  style,
+  grid = true,
+  children
+}) => {
+  let seriesIndex = 0;
+  const themedChildren = Children7.map(children, (child) => {
+    if (!isValidElement7(child)) return child;
+    const t = child.type;
+    const dn = t?.displayName;
+    if (t === RechartsLine2 || dn === "Line") {
+      const idx = seriesIndex++;
+      return cloneElement7(child, {
+        stroke: child.props.stroke || getSeriesColor({ index: idx, palette: colorPalette }),
+        strokeWidth: child.props.strokeWidth ?? 2,
+        dot: child.props.dot ?? false
+      });
+    }
+    if (t === RechartsBar2 || dn === "Bar") {
+      const idx = seriesIndex++;
+      return cloneElement7(child, {
+        fill: child.props.fill || getSeriesColor({ index: idx, palette: colorPalette }),
+        radius: child.props.radius ?? [4, 4, 0, 0]
+      });
+    }
+    if (t === RechartsArea2 || dn === "Area") {
+      const idx = seriesIndex++;
+      const color = child.props.stroke || getSeriesColor({ index: idx, palette: colorPalette });
+      return cloneElement7(child, {
+        stroke: color,
+        fill: child.props.fill || color,
+        fillOpacity: child.props.fillOpacity ?? 0.15,
+        strokeWidth: child.props.strokeWidth ?? 2
+      });
+    }
+    return child;
+  });
+  return /* @__PURE__ */ jsx8(ChartContainer, { height, className, style, children: /* @__PURE__ */ jsxs5(RechartsComposedChart, { data, margin: { top: 5, right: 20, bottom: 5, left: 0 }, children: [
+    grid && /* @__PURE__ */ jsx8(CartesianGrid5, { strokeDasharray: "3 3", stroke: getGridColor(), opacity: 0.5 }),
+    themedChildren
+  ] }) });
+};
+
+// src/charts/ThemedTooltip.tsx
+import { useMemo } from "react";
+import { Tooltip as RechartsTooltip } from "recharts";
+import { jsx as jsx9 } from "react/jsx-runtime";
+var ThemedTooltip = (props) => {
+  const style = useMemo(() => getTooltipStyle(), []);
+  return /* @__PURE__ */ jsx9(
+    RechartsTooltip,
+    {
+      contentStyle: style.contentStyle,
+      labelStyle: style.labelStyle,
+      cursor: { stroke: "var(--color-border-secondary, #e5e7eb)", strokeWidth: 1 },
+      ...props
+    }
+  );
+};
+
+// src/charts/index.ts
+import {
+  Line,
+  Bar,
+  Area,
+  Pie,
+  Scatter,
+  Radar,
+  Cell as Cell2,
+  XAxis,
+  YAxis,
+  CartesianGrid as CartesianGrid6,
+  Legend,
+  PolarGrid,
+  PolarAngleAxis,
+  PolarRadiusAxis,
+  Tooltip,
+  ReferenceLine,
+  ReferenceArea,
+  ResponsiveContainer as ResponsiveContainer2
+} from "recharts";
+export {
+  Area,
+  AreaChart,
+  Bar,
+  BarChart,
+  CartesianGrid6 as CartesianGrid,
+  Cell2 as Cell,
+  ComposedChart,
+  DEFAULT_PALETTE,
+  Legend,
+  Line,
+  LineChart,
+  Pie,
+  PieChart,
+  PolarAngleAxis,
+  PolarGrid,
+  PolarRadiusAxis,
+  Radar,
+  RadarChart,
+  Tooltip as RechartsTooltip,
+  ReferenceArea,
+  ReferenceLine,
+  ResponsiveContainer2 as ResponsiveContainer,
+  Scatter,
+  ScatterChart,
+  ThemedTooltip as Tooltip,
+  XAxis,
+  YAxis
+};
+//# sourceMappingURL=index.js.map

package/dist/charts/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/charts/LineChart.tsx","../../src/charts/ChartContainer.tsx","../../src/charts/types.ts","../../src/charts/theme.ts","../../src/charts/BarChart.tsx","../../src/charts/AreaChart.tsx","../../src/charts/PieChart.tsx","../../src/charts/ScatterChart.tsx","../../src/charts/RadarChart.tsx","../../src/charts/ComposedChart.tsx","../../src/charts/ThemedTooltip.tsx","../../src/charts/index.ts"],"sourcesContent":["/**\n * LineChart — Themed line/trend chart wrapper.\n *\n * Thin wrapper around Recharts' LineChart that auto-applies\n * MCP Apps spec CSS variable theming to all visual elements.\n *\n * @example\n * ```tsx\n * import { LineChart, Line, XAxis, YAxis, Tooltip } from \"open-mcp-app-ui/charts\";\n *\n * <LineChart data={data} height={300}>\n *   <XAxis dataKey=\"month\" />\n *   <YAxis />\n *   <Tooltip />\n *   <Line dataKey=\"revenue\" />\n * </LineChart>\n * ```\n */\n\nimport React, { type ReactNode, Children, cloneElement, isValidElement } from \"react\";\nimport {\n  LineChart as RechartsLineChart,\n  Line as RechartsLine,\n  CartesianGrid,\n} from \"recharts\";\nimport { ChartContainer, getSeriesColor } from \"./ChartContainer.js\";\nimport { getGridColor } from \"./theme.js\";\nimport type { ChartContainerProps } from \"./types.js\";\n\ninterface ThemedLineChartProps extends ChartContainerProps {\n  /** Chart data array. Each entry is one data point. */\n  data: Record<string, unknown>[];\n  /** Child elements (Line, XAxis, YAxis, Tooltip, Legend, etc.) */\n  children: ReactNode;\n  /** Show background grid lines. */\n  grid?: boolean;\n}\n\n/**\n * Themed LineChart.\n * Automatically assigns palette colors to Line children that\n * don't have an explicit stroke prop.\n */\nexport const LineChart = ({\n  data,\n  height,\n  colorPalette,\n  className,\n  style,\n  grid = true,\n  children,\n}: ThemedLineChartProps) => {\n  let seriesIndex = 0;\n\n  const themedChildren = Children.map(children, (child) => {\n    if (!isValidElement(child)) return child;\n    if ((child.type as any) === RechartsLine || (child.type as any)?.displayName === \"Line\") {\n      const idx = seriesIndex++;\n      const existing = (child.props as any).stroke;\n      return cloneElement(child as React.ReactElement<any>, {\n        stroke: existing || getSeriesColor({ index: idx, palette: colorPalette }),\n        strokeWidth: (child.props as any).strokeWidth ?? 2,\n        dot: (child.props as any).dot ?? false,\n        activeDot: (child.props as any).activeDot ?? { r: 4 },\n      });\n    }\n    return child;\n  });\n\n  return (\n    <ChartContainer height={height} className={className} style={style}>\n      <RechartsLineChart data={data} margin={{ top: 5, right: 20, bottom: 5, left: 0 }}>\n        {grid && <CartesianGrid strokeDasharray=\"3 3\" stroke={getGridColor()} opacity={0.5} />}\n        {themedChildren}\n      </RechartsLineChart>\n    </ChartContainer>\n  );\n};\n","/**\n * ChartContainer — Responsive wrapper for all chart types.\n *\n * Wraps Recharts' ResponsiveContainer with the theme palette context.\n * All chart wrappers use this internally. Not exported directly — each\n * chart type (LineChart, BarChart, etc.) composes it.\n */\n\nimport { type ReactNode } from \"react\";\nimport { ResponsiveContainer } from \"recharts\";\nimport { DEFAULT_PALETTE, type ChartContainerProps } from \"./types.js\";\n\n/**\n * Provides a responsive, themed container for a Recharts chart.\n * Fills 100% width of its parent and uses the specified height.\n */\nexport const ChartContainer = ({\n  height = 300,\n  className = \"\",\n  style,\n  children,\n}: ChartContainerProps & { children: ReactNode }) => (\n  <div\n    className={`omu-chart w-full ${className}`}\n    style={{ height: `${height}px`, ...style }}\n  >\n    <ResponsiveContainer width=\"100%\" height=\"100%\">\n      {children as React.ReactElement}\n    </ResponsiveContainer>\n  </div>\n);\n\n/**\n * Get the color for a given series index from the palette.\n * Wraps around if there are more series than palette entries.\n */\nexport const getSeriesColor = ({\n  index,\n  palette,\n}: {\n  index: number;\n  palette?: string[];\n}): string => {\n  const colors = palette ?? DEFAULT_PALETTE;\n  return colors[index % colors.length];\n};\n","/**\n * Shared chart types.\n * Defines the theme interface and common props used across all chart wrappers.\n */\n\nimport type { CSSProperties } from \"react\";\n\n/**\n * Color palette for multi-series charts.\n * Each series gets the next color in the palette.\n * Uses CSS variables from the MCP Apps spec where possible,\n * with opacity variations for additional series.\n */\nexport const DEFAULT_PALETTE = [\n  \"var(--color-accent, #6366f1)\",\n  \"var(--color-text-secondary, #6b7280)\",\n  \"var(--color-ring-primary, #a78bfa)\",\n  \"var(--color-text-tertiary, #9ca3af)\",\n  \"var(--color-border-primary, #d1d5db)\",\n  \"color-mix(in srgb, var(--color-accent, #6366f1) 60%, transparent)\",\n  \"color-mix(in srgb, var(--color-accent, #6366f1) 35%, transparent)\",\n];\n\n/**\n * Base props shared by all chart container wrappers.\n */\nexport interface ChartContainerProps {\n  /** Chart height in pixels. Width is always 100% of parent. */\n  height?: number;\n  /** Custom color palette for series data. Overrides the default palette. */\n  colorPalette?: string[];\n  /** Additional CSS class on the outermost wrapper. */\n  className?: string;\n  /** Inline styles on the outermost wrapper. */\n  style?: CSSProperties;\n}\n","/**\n * Chart Theme — CSS variable mapping for Recharts.\n *\n * Reads MCP Apps spec CSS variables at render time and provides\n * them as style objects for Recharts sub-components (tooltip, grid,\n * axis labels, legend). This is how charts automatically adapt to\n * the host's theme without configuration.\n */\n\n/**\n * Resolve a CSS variable value at runtime.\n * Falls back to the provided default if the variable is not set.\n */\nexport const getCSSVar = ({ name, fallback }: { name: string; fallback: string }): string => {\n  if (typeof window === \"undefined\") return fallback;\n  const value = getComputedStyle(document.documentElement).getPropertyValue(name).trim();\n  return value || fallback;\n};\n\n/**\n * Themed tooltip style object for Recharts <Tooltip>.\n * Applied via contentStyle, labelStyle, and wrapperStyle props.\n */\nexport const getTooltipStyle = () => ({\n  contentStyle: {\n    backgroundColor: getCSSVar({ name: \"--color-background-secondary\", fallback: \"#f9fafb\" }),\n    border: `1px solid ${getCSSVar({ name: \"--color-border-secondary\", fallback: \"#e5e7eb\" })}`,\n    borderRadius: getCSSVar({ name: \"--border-radius-md\", fallback: \"8px\" }),\n    color: getCSSVar({ name: \"--color-text-primary\", fallback: \"#111827\" }),\n    fontSize: getCSSVar({ name: \"--font-text-sm-size\", fallback: \"13px\" }),\n    fontFamily: getCSSVar({ name: \"--font-sans\", fallback: \"ui-sans-serif, system-ui, sans-serif\" }),\n    padding: \"8px 12px\",\n    boxShadow: \"0 4px 12px rgba(0,0,0,0.08)\",\n  },\n  labelStyle: {\n    color: getCSSVar({ name: \"--color-text-primary\", fallback: \"#111827\" }),\n    fontWeight: 500,\n    marginBottom: \"4px\",\n  },\n});\n\n/**\n * Themed grid line color for <CartesianGrid>.\n */\nexport const getGridColor = (): string =>\n  getCSSVar({ name: \"--color-border-secondary\", fallback: \"#e5e7eb\" });\n\n/**\n * Themed axis tick/label style for <XAxis> and <YAxis>.\n */\nexport const getAxisStyle = () => ({\n  tick: {\n    fill: getCSSVar({ name: \"--color-text-secondary\", fallback: \"#6b7280\" }),\n    fontSize: getCSSVar({ name: \"--font-text-xs-size\", fallback: \"11px\" }),\n    fontFamily: getCSSVar({ name: \"--font-sans\", fallback: \"ui-sans-serif, system-ui, sans-serif\" }),\n  },\n  axisLine: {\n    stroke: getCSSVar({ name: \"--color-border-secondary\", fallback: \"#e5e7eb\" }),\n  },\n  tickLine: {\n    stroke: getCSSVar({ name: \"--color-border-secondary\", fallback: \"#e5e7eb\" }),\n  },\n});\n\n/**\n * Themed legend style for <Legend>.\n */\nexport const getLegendStyle = () => ({\n  color: getCSSVar({ name: \"--color-text-secondary\", fallback: \"#6b7280\" }),\n  fontSize: getCSSVar({ name: \"--font-text-sm-size\", fallback: \"13px\" }),\n  fontFamily: getCSSVar({ name: \"--font-sans\", fallback: \"ui-sans-serif, system-ui, sans-serif\" }),\n});\n","/**\n * BarChart — Themed bar/column chart wrapper.\n */\n\nimport React, { type ReactNode, Children, cloneElement, isValidElement } from \"react\";\nimport {\n  BarChart as RechartsBarChart,\n  Bar as RechartsBar,\n  CartesianGrid,\n} from \"recharts\";\nimport { ChartContainer, getSeriesColor } from \"./ChartContainer.js\";\nimport { getGridColor } from \"./theme.js\";\nimport type { ChartContainerProps } from \"./types.js\";\n\ninterface ThemedBarChartProps extends ChartContainerProps {\n  /** Chart data array. */\n  data: Record<string, unknown>[];\n  children: ReactNode;\n  grid?: boolean;\n}\n\n/**\n * Themed BarChart.\n * Automatically assigns palette colors to Bar children.\n */\nexport const BarChart = ({\n  data,\n  height,\n  colorPalette,\n  className,\n  style,\n  grid = true,\n  children,\n}: ThemedBarChartProps) => {\n  let seriesIndex = 0;\n\n  const themedChildren = Children.map(children, (child) => {\n    if (!isValidElement(child)) return child;\n    if ((child.type as any) === RechartsBar || (child.type as any)?.displayName === \"Bar\") {\n      const idx = seriesIndex++;\n      const existing = (child.props as any).fill;\n      return cloneElement(child as React.ReactElement<any>, {\n        fill: existing || getSeriesColor({ index: idx, palette: colorPalette }),\n        radius: (child.props as any).radius ?? [4, 4, 0, 0],\n      });\n    }\n    return child;\n  });\n\n  return (\n    <ChartContainer height={height} className={className} style={style}>\n      <RechartsBarChart data={data} margin={{ top: 5, right: 20, bottom: 5, left: 0 }}>\n        {grid && <CartesianGrid strokeDasharray=\"3 3\" stroke={getGridColor()} opacity={0.5} vertical={false} />}\n        {themedChildren}\n      </RechartsBarChart>\n    </ChartContainer>\n  );\n};\n","/**\n * AreaChart — Themed area/volume chart wrapper.\n */\n\nimport React, { type ReactNode, Children, cloneElement, isValidElement } from \"react\";\nimport {\n  AreaChart as RechartsAreaChart,\n  Area as RechartsArea,\n  CartesianGrid,\n} from \"recharts\";\nimport { ChartContainer, getSeriesColor } from \"./ChartContainer.js\";\nimport { getGridColor } from \"./theme.js\";\nimport type { ChartContainerProps } from \"./types.js\";\n\ninterface ThemedAreaChartProps extends ChartContainerProps {\n  data: Record<string, unknown>[];\n  children: ReactNode;\n  grid?: boolean;\n}\n\n/**\n * Themed AreaChart.\n * Auto-assigns palette colors with gradient fill to Area children.\n */\nexport const AreaChart = ({\n  data,\n  height,\n  colorPalette,\n  className,\n  style,\n  grid = true,\n  children,\n}: ThemedAreaChartProps) => {\n  let seriesIndex = 0;\n\n  const themedChildren = Children.map(children, (child) => {\n    if (!isValidElement(child)) return child;\n    if ((child.type as any) === RechartsArea || (child.type as any)?.displayName === \"Area\") {\n      const idx = seriesIndex++;\n      const color = (child.props as any).stroke || getSeriesColor({ index: idx, palette: colorPalette });\n      return cloneElement(child as React.ReactElement<any>, {\n        stroke: color,\n        fill: (child.props as any).fill || color,\n        fillOpacity: (child.props as any).fillOpacity ?? 0.15,\n        strokeWidth: (child.props as any).strokeWidth ?? 2,\n      });\n    }\n    return child;\n  });\n\n  return (\n    <ChartContainer height={height} className={className} style={style}>\n      <RechartsAreaChart data={data} margin={{ top: 5, right: 20, bottom: 5, left: 0 }}>\n        {grid && <CartesianGrid strokeDasharray=\"3 3\" stroke={getGridColor()} opacity={0.5} />}\n        {themedChildren}\n      </RechartsAreaChart>\n    </ChartContainer>\n  );\n};\n","/**\n * PieChart — Themed pie/donut chart wrapper.\n */\n\nimport React, { type ReactNode, Children, cloneElement, isValidElement } from \"react\";\nimport {\n  PieChart as RechartsPieChart,\n  Pie as RechartsPie,\n  Cell,\n} from \"recharts\";\nimport { ChartContainer, getSeriesColor } from \"./ChartContainer.js\";\nimport type { ChartContainerProps } from \"./types.js\";\n\ninterface ThemedPieChartProps extends Omit<ChartContainerProps, \"height\"> {\n  /** Chart height (also used for approximate width in responsive container). */\n  height?: number;\n  children: ReactNode;\n}\n\n/**\n * Themed PieChart.\n * Auto-assigns palette colors to Pie data via Cell children when no\n * explicit fill is provided on individual data entries.\n */\nexport const PieChart = ({\n  height,\n  colorPalette,\n  className,\n  style,\n  children,\n}: ThemedPieChartProps) => {\n  const themedChildren = Children.map(children, (child) => {\n    if (!isValidElement(child)) return child;\n    if ((child.type as any) === RechartsPie || (child.type as any)?.displayName === \"Pie\") {\n      const props = child.props as any;\n      const data: any[] = props.data ?? [];\n      /**\n       * If the Pie has no Cell children, inject them automatically\n       * so each slice gets a palette color.\n       */\n      const hasExplicitCells = Children.toArray(props.children).some(\n        (c: any) => isValidElement(c) && ((c.type as any) === Cell || (c.type as any)?.displayName === \"Cell\")\n      );\n      if (!hasExplicitCells && data.length > 0) {\n        return cloneElement(child as React.ReactElement<any>, {\n          children: data.map((_, i) => (\n            <Cell key={`cell-${i}`} fill={getSeriesColor({ index: i, palette: colorPalette })} />\n          )),\n        });\n      }\n    }\n    return child;\n  });\n\n  return (\n    <ChartContainer height={height} className={className} style={style}>\n      <RechartsPieChart>\n        {themedChildren}\n      </RechartsPieChart>\n    </ChartContainer>\n  );\n};\n","/**\n * ScatterChart — Themed scatter/correlation chart wrapper.\n */\n\nimport React, { type ReactNode, Children, cloneElement, isValidElement } from \"react\";\nimport {\n  ScatterChart as RechartsScatterChart,\n  Scatter as RechartsScatter,\n  CartesianGrid,\n} from \"recharts\";\nimport { ChartContainer, getSeriesColor } from \"./ChartContainer.js\";\nimport { getGridColor } from \"./theme.js\";\nimport type { ChartContainerProps } from \"./types.js\";\n\ninterface ThemedScatterChartProps extends ChartContainerProps {\n  children: ReactNode;\n  grid?: boolean;\n}\n\n/**\n * Themed ScatterChart.\n * Auto-assigns palette fill colors to Scatter children.\n */\nexport const ScatterChart = ({\n  height,\n  colorPalette,\n  className,\n  style,\n  grid = true,\n  children,\n}: ThemedScatterChartProps) => {\n  let seriesIndex = 0;\n\n  const themedChildren = Children.map(children, (child) => {\n    if (!isValidElement(child)) return child;\n    if ((child.type as any) === RechartsScatter || (child.type as any)?.displayName === \"Scatter\") {\n      const idx = seriesIndex++;\n      const existing = (child.props as any).fill;\n      return cloneElement(child as React.ReactElement<any>, {\n        fill: existing || getSeriesColor({ index: idx, palette: colorPalette }),\n      });\n    }\n    return child;\n  });\n\n  return (\n    <ChartContainer height={height} className={className} style={style}>\n      <RechartsScatterChart margin={{ top: 5, right: 20, bottom: 5, left: 0 }}>\n        {grid && <CartesianGrid strokeDasharray=\"3 3\" stroke={getGridColor()} opacity={0.5} />}\n        {themedChildren}\n      </RechartsScatterChart>\n    </ChartContainer>\n  );\n};\n","/**\n * RadarChart — Themed radar/spider chart wrapper.\n */\n\nimport React, { type ReactNode, Children, cloneElement, isValidElement } from \"react\";\nimport {\n  RadarChart as RechartsRadarChart,\n  Radar as RechartsRadar,\n} from \"recharts\";\nimport { ChartContainer, getSeriesColor } from \"./ChartContainer.js\";\nimport type { ChartContainerProps } from \"./types.js\";\n\ninterface ThemedRadarChartProps extends ChartContainerProps {\n  data: Record<string, unknown>[];\n  children: ReactNode;\n}\n\n/**\n * Themed RadarChart.\n * Auto-assigns palette colors to Radar children.\n */\nexport const RadarChart = ({\n  data,\n  height,\n  colorPalette,\n  className,\n  style,\n  children,\n}: ThemedRadarChartProps) => {\n  let seriesIndex = 0;\n\n  const themedChildren = Children.map(children, (child) => {\n    if (!isValidElement(child)) return child;\n    if ((child.type as any) === RechartsRadar || (child.type as any)?.displayName === \"Radar\") {\n      const idx = seriesIndex++;\n      const color = (child.props as any).stroke || getSeriesColor({ index: idx, palette: colorPalette });\n      return cloneElement(child as React.ReactElement<any>, {\n        stroke: color,\n        fill: (child.props as any).fill || color,\n        fillOpacity: (child.props as any).fillOpacity ?? 0.2,\n      });\n    }\n    return child;\n  });\n\n  return (\n    <ChartContainer height={height} className={className} style={style}>\n      <RechartsRadarChart data={data} cx=\"50%\" cy=\"50%\" outerRadius=\"70%\">\n        {themedChildren}\n      </RechartsRadarChart>\n    </ChartContainer>\n  );\n};\n","/**\n * ComposedChart — Themed mixed chart wrapper (Bar + Line + Area in one).\n */\n\nimport React, { type ReactNode, Children, cloneElement, isValidElement } from \"react\";\nimport {\n  ComposedChart as RechartsComposedChart,\n  Line as RechartsLine,\n  Bar as RechartsBar,\n  Area as RechartsArea,\n  CartesianGrid,\n} from \"recharts\";\nimport { ChartContainer, getSeriesColor } from \"./ChartContainer.js\";\nimport { getGridColor } from \"./theme.js\";\nimport type { ChartContainerProps } from \"./types.js\";\n\ninterface ThemedComposedChartProps extends ChartContainerProps {\n  data: Record<string, unknown>[];\n  children: ReactNode;\n  grid?: boolean;\n}\n\n/**\n * Themed ComposedChart.\n * Auto-assigns palette colors to Line, Bar, and Area children.\n */\nexport const ComposedChart = ({\n  data,\n  height,\n  colorPalette,\n  className,\n  style,\n  grid = true,\n  children,\n}: ThemedComposedChartProps) => {\n  let seriesIndex = 0;\n\n  const themedChildren = Children.map(children, (child) => {\n    if (!isValidElement(child)) return child;\n    const t = child.type as any;\n    const dn = t?.displayName;\n\n    if (t === RechartsLine || dn === \"Line\") {\n      const idx = seriesIndex++;\n      return cloneElement(child as React.ReactElement<any>, {\n        stroke: (child.props as any).stroke || getSeriesColor({ index: idx, palette: colorPalette }),\n        strokeWidth: (child.props as any).strokeWidth ?? 2,\n        dot: (child.props as any).dot ?? false,\n      });\n    }\n    if (t === RechartsBar || dn === \"Bar\") {\n      const idx = seriesIndex++;\n      return cloneElement(child as React.ReactElement<any>, {\n        fill: (child.props as any).fill || getSeriesColor({ index: idx, palette: colorPalette }),\n        radius: (child.props as any).radius ?? [4, 4, 0, 0],\n      });\n    }\n    if (t === RechartsArea || dn === \"Area\") {\n      const idx = seriesIndex++;\n      const color = (child.props as any).stroke || getSeriesColor({ index: idx, palette: colorPalette });\n      return cloneElement(child as React.ReactElement<any>, {\n        stroke: color,\n        fill: (child.props as any).fill || color,\n        fillOpacity: (child.props as any).fillOpacity ?? 0.15,\n        strokeWidth: (child.props as any).strokeWidth ?? 2,\n      });\n    }\n    return child;\n  });\n\n  return (\n    <ChartContainer height={height} className={className} style={style}>\n      <RechartsComposedChart data={data} margin={{ top: 5, right: 20, bottom: 5, left: 0 }}>\n        {grid && <CartesianGrid strokeDasharray=\"3 3\" stroke={getGridColor()} opacity={0.5} />}\n        {themedChildren}\n      </RechartsComposedChart>\n    </ChartContainer>\n  );\n};\n","/**\n * ThemedTooltip — Pre-themed tooltip using MCP Apps spec CSS variables.\n *\n * Drop-in replacement for Recharts' Tooltip that automatically\n * applies the host's theme colors for background, text, border.\n */\n\nimport { useMemo } from \"react\";\nimport { Tooltip as RechartsTooltip } from \"recharts\";\nimport { getTooltipStyle } from \"./theme.js\";\n\n/**\n * A themed Tooltip that reads CSS variables at render time.\n * Forwards all standard Recharts Tooltip props.\n */\nexport const ThemedTooltip = (props: any) => {\n  const style = useMemo(() => getTooltipStyle(), []);\n  return (\n    <RechartsTooltip\n      contentStyle={style.contentStyle}\n      labelStyle={style.labelStyle}\n      cursor={{ stroke: \"var(--color-border-secondary, #e5e7eb)\", strokeWidth: 1 }}\n      {...props}\n    />\n  );\n};\n","/**\n * open-mcp-app-ui/charts\n *\n * Themed chart components built on Recharts v3.\n * Auto-styled via MCP Apps spec CSS variables.\n *\n * Usage:\n *   import { LineChart, Line, XAxis, YAxis, Tooltip } from \"open-mcp-app-ui/charts\";\n *\n *   <LineChart data={data} height={300}>\n *     <XAxis dataKey=\"month\" />\n *     <YAxis />\n *     <Tooltip />\n *     <Line dataKey=\"revenue\" />\n *   </LineChart>\n */\n\n// Themed chart wrappers\nexport { LineChart } from \"./LineChart.js\";\nexport { BarChart } from \"./BarChart.js\";\nexport { AreaChart } from \"./AreaChart.js\";\nexport { PieChart } from \"./PieChart.js\";\nexport { ScatterChart } from \"./ScatterChart.js\";\nexport { RadarChart } from \"./RadarChart.js\";\nexport { ComposedChart } from \"./ComposedChart.js\";\nexport { ThemedTooltip as Tooltip } from \"./ThemedTooltip.js\";\n\n// Re-export Recharts primitives for composition\nexport {\n  Line,\n  Bar,\n  Area,\n  Pie,\n  Scatter,\n  Radar,\n  Cell,\n  XAxis,\n  YAxis,\n  CartesianGrid,\n  Legend,\n  PolarGrid,\n  PolarAngleAxis,\n  PolarRadiusAxis,\n  Tooltip as RechartsTooltip,\n  ReferenceLine,\n  ReferenceArea,\n  ResponsiveContainer,\n} from \"recharts\";\n\n// Types\nexport type { ChartContainerProps } from \"./types.js\";\nexport { DEFAULT_PALETTE } from \"./types.js\";\n"],"mappings":"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","names":["jsx","Children","cloneElement","isValidElement","CartesianGrid","jsx","jsxs","Children","isValidElement","cloneElement","CartesianGrid","Children","cloneElement","isValidElement","CartesianGrid","jsx","jsxs","Children","isValidElement","cloneElement","CartesianGrid","Children","cloneElement","isValidElement","jsx","Children","isValidElement","cloneElement","Children","cloneElement","isValidElement","CartesianGrid","jsx","jsxs","Children","isValidElement","cloneElement","CartesianGrid","Children","cloneElement","isValidElement","jsx","Children","isValidElement","cloneElement","Children","cloneElement","isValidElement","RechartsLine","RechartsBar","RechartsArea","CartesianGrid","jsx","jsxs","Children","isValidElement","RechartsLine","cloneElement","RechartsBar","RechartsArea","CartesianGrid","jsx","Cell","CartesianGrid","ResponsiveContainer"]}