@optifye/dashboard-core 4.3.3 → 4.3.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.js +216 -3
  2. package/dist/index.mjs +217 -4
  3. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -25046,12 +25046,22 @@ var AIAgentView = () => {
25046
25046
  const parseChartPatterns = (text) => {
25047
25047
  const chartElements = [];
25048
25048
  let lastIndex = 0;
25049
+ console.log("[DEBUG] Parsing chart patterns from text:", text);
25049
25050
  const chartRegex = /\[\s*(?:Calling\s+|CALL\s+)?(create_[a-z_]+)\s*\(([\s\S]*?)\)\s*\]/g;
25050
25051
  let match;
25051
25052
  const processedIndices = /* @__PURE__ */ new Set();
25053
+ let matchCount = 0;
25052
25054
  while ((match = chartRegex.exec(text)) !== null) {
25055
+ matchCount++;
25053
25056
  const startIndex = match.index;
25054
25057
  const endIndex = startIndex + match[0].length;
25058
+ console.log(`[DEBUG] Found chart pattern #${matchCount}:`, {
25059
+ fullMatch: match[0],
25060
+ chartType: match[1],
25061
+ argsString: match[2],
25062
+ startIndex,
25063
+ endIndex
25064
+ });
25055
25065
  if (!processedIndices.has(startIndex)) {
25056
25066
  processedIndices.add(startIndex);
25057
25067
  if (startIndex > lastIndex) {
@@ -25072,7 +25082,10 @@ var AIAgentView = () => {
25072
25082
  const args = parseChartArguments(argsString);
25073
25083
  const chartElement = renderChart(chartType, args, startIndex);
25074
25084
  if (chartElement) {
25085
+ console.log(`[DEBUG] Successfully rendered chart: ${chartType}`);
25075
25086
  chartElements.push(chartElement);
25087
+ } else {
25088
+ console.warn(`[DEBUG] Chart element was null for type: ${chartType}`);
25076
25089
  }
25077
25090
  } catch (error) {
25078
25091
  console.error(`Failed to parse chart ${chartType}:`, error);
@@ -25093,6 +25106,7 @@ var AIAgentView = () => {
25093
25106
  lastIndex = endIndex;
25094
25107
  }
25095
25108
  }
25109
+ console.log(`[DEBUG] Total chart patterns found: ${matchCount}`);
25096
25110
  if (lastIndex < text.length) {
25097
25111
  const remainingText = text.substring(lastIndex);
25098
25112
  chartElements.push(
@@ -25106,22 +25120,28 @@ var AIAgentView = () => {
25106
25120
  );
25107
25121
  }
25108
25122
  if (chartElements.length === 1 && lastIndex === 0) {
25123
+ console.log("[DEBUG] No charts found in text, returning null");
25109
25124
  return null;
25110
25125
  }
25126
+ console.log(`[DEBUG] Returning ${chartElements.length} chart elements`);
25111
25127
  return chartElements;
25112
25128
  };
25113
25129
  const parseChartArguments = (argsString) => {
25114
25130
  const args = {};
25131
+ console.log("[DEBUG] Parsing chart arguments:", argsString);
25115
25132
  const jsonParamRegex = /(\w+)\s*=\s*(\[[\s\S]*?\](?=\s*(?:,|\s*\)|\s*$))|\{[\s\S]*?\}(?=\s*(?:,|\s*\)|\s*$)))/g;
25116
25133
  let jsonMatch;
25117
25134
  while ((jsonMatch = jsonParamRegex.exec(argsString)) !== null) {
25118
25135
  const paramName = jsonMatch[1];
25119
25136
  const jsonValue = jsonMatch[2];
25137
+ console.log(`[DEBUG] Found JSON parameter: ${paramName} = ${jsonValue}`);
25120
25138
  try {
25121
25139
  args[paramName] = JSON.parse(jsonValue);
25140
+ console.log(`[DEBUG] Successfully parsed ${paramName}:`, args[paramName]);
25122
25141
  argsString = argsString.replace(jsonMatch[0], "");
25123
25142
  } catch (e) {
25124
25143
  console.error(`Failed to parse ${paramName} JSON:`, e);
25144
+ console.error(`JSON value that failed:`, jsonValue);
25125
25145
  }
25126
25146
  }
25127
25147
  const argRegex = /(\w+)\s*=\s*("([^"]*)"|'([^']*)'|([^,\s\)]+))/g;
@@ -25142,11 +25162,14 @@ var AIAgentView = () => {
25142
25162
  args[key] = value;
25143
25163
  }
25144
25164
  }
25165
+ console.log("[DEBUG] Final parsed arguments:", args);
25145
25166
  return args;
25146
25167
  };
25147
25168
  const renderChart = (chartType, args, key) => {
25169
+ console.log(`[DEBUG] Attempting to render chart type: ${chartType}`, args);
25148
25170
  switch (chartType) {
25149
25171
  case "create_gauge_chart":
25172
+ console.log("[DEBUG] Rendering gauge chart");
25150
25173
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "my-6 h-64 w-full flex justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(
25151
25174
  GaugeChart,
25152
25175
  {
@@ -25161,8 +25184,9 @@ var AIAgentView = () => {
25161
25184
  }
25162
25185
  ) }, `gauge-${key}`);
25163
25186
  case "create_bar_chart":
25187
+ console.log("[DEBUG] Rendering bar chart");
25164
25188
  if (!args.data || !args.x_field || !args.y_field) {
25165
- console.error("Bar chart missing required parameters");
25189
+ console.error("Bar chart missing required parameters:", { data: !!args.data, x_field: !!args.x_field, y_field: !!args.y_field });
25166
25190
  return null;
25167
25191
  }
25168
25192
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "my-6 w-full", style: { maxWidth: args.max_width || "100%" }, children: [
@@ -25183,8 +25207,9 @@ var AIAgentView = () => {
25183
25207
  args.title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-center text-sm text-gray-600 mt-2", children: args.title })
25184
25208
  ] }, `bar-${key}`);
25185
25209
  case "create_line_chart":
25210
+ console.log("[DEBUG] Rendering line chart");
25186
25211
  if (!args.data || !args.x_field || !args.y_field) {
25187
- console.error("Line chart missing required parameters");
25212
+ console.error("Line chart missing required parameters:", { data: !!args.data, x_field: !!args.x_field, y_field: !!args.y_field });
25188
25213
  return null;
25189
25214
  }
25190
25215
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "my-6 w-full", style: {
@@ -25208,14 +25233,17 @@ var AIAgentView = () => {
25208
25233
  args.title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-center text-sm text-gray-600 mt-2", children: args.title })
25209
25234
  ] }, `line-${key}`);
25210
25235
  case "create_pie_chart":
25236
+ console.log("[DEBUG] Rendering pie chart");
25211
25237
  if (!args.data || !args.label_field || !args.value_field) {
25212
- console.error("Pie chart missing required parameters");
25238
+ console.error("Pie chart missing required parameters:", { data: !!args.data, label_field: !!args.label_field, value_field: !!args.value_field });
25239
+ console.error("Available args:", Object.keys(args));
25213
25240
  return null;
25214
25241
  }
25215
25242
  const pieData = args.data.map((item) => ({
25216
25243
  name: item[args.label_field],
25217
25244
  value: item[args.value_field]
25218
25245
  }));
25246
+ console.log("[DEBUG] Pie chart data transformed:", pieData);
25219
25247
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "my-6 w-full flex flex-col items-center", children: [
25220
25248
  args.title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-gray-700 mb-2", children: args.title }),
25221
25249
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-64 w-full max-w-md", children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -25227,6 +25255,7 @@ var AIAgentView = () => {
25227
25255
  ) })
25228
25256
  ] }, `pie-${key}`);
25229
25257
  case "create_comparison_table":
25258
+ console.log("[DEBUG] Rendering comparison table");
25230
25259
  if (!args.data) {
25231
25260
  console.error("Comparison table missing required data");
25232
25261
  return null;
@@ -25262,6 +25291,190 @@ var AIAgentView = () => {
25262
25291
  )) }, rowIdx)) })
25263
25292
  ] })
25264
25293
  ] }, `table-${key}`);
25294
+ case "create_multi_line_chart":
25295
+ console.log("[DEBUG] Rendering multi-line chart");
25296
+ if (!args.data || !args.x_field || !args.y_fields || !args.legend) {
25297
+ console.error("Multi-line chart missing required parameters:", {
25298
+ data: !!args.data,
25299
+ x_field: !!args.x_field,
25300
+ y_fields: !!args.y_fields,
25301
+ legend: !!args.legend
25302
+ });
25303
+ return null;
25304
+ }
25305
+ const colors = ["#3b82f6", "#ef4444", "#10b981", "#f59e0b", "#8b5cf6", "#06b6d4", "#84cc16", "#f97316"];
25306
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "my-6 w-full", children: [
25307
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height: 400, children: /* @__PURE__ */ jsxRuntime.jsxs(recharts.LineChart, { data: args.data, children: [
25308
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.CartesianGrid, { strokeDasharray: "3 3" }),
25309
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.XAxis, { dataKey: args.x_field }),
25310
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.YAxis, {}),
25311
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.Tooltip, {}),
25312
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.Legend, {}),
25313
+ args.y_fields.map((field, index) => /* @__PURE__ */ jsxRuntime.jsx(
25314
+ recharts.Line,
25315
+ {
25316
+ type: "monotone",
25317
+ dataKey: field,
25318
+ stroke: colors[index % colors.length],
25319
+ strokeWidth: 2,
25320
+ name: args.legend[index] || field,
25321
+ dot: { r: 4 },
25322
+ activeDot: { r: 6 }
25323
+ },
25324
+ field
25325
+ ))
25326
+ ] }) }),
25327
+ args.title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-center text-sm text-gray-600 mt-2", children: args.title })
25328
+ ] }, `multi-line-${key}`);
25329
+ case "create_stacked_bar_chart":
25330
+ console.log("[DEBUG] Rendering stacked bar chart");
25331
+ if (!args.data || !args.x_field || !args.stack_fields) {
25332
+ console.error("Stacked bar chart missing required parameters:", {
25333
+ data: !!args.data,
25334
+ x_field: !!args.x_field,
25335
+ stack_fields: !!args.stack_fields
25336
+ });
25337
+ return null;
25338
+ }
25339
+ const stackColors = ["#3b82f6", "#ef4444", "#10b981", "#f59e0b", "#8b5cf6", "#06b6d4", "#84cc16", "#f97316"];
25340
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "my-6 w-full", children: [
25341
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height: 400, children: /* @__PURE__ */ jsxRuntime.jsxs(recharts.BarChart, { data: args.data, children: [
25342
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.CartesianGrid, { strokeDasharray: "3 3" }),
25343
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.XAxis, { dataKey: args.x_field }),
25344
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.YAxis, {}),
25345
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.Tooltip, {}),
25346
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.Legend, {}),
25347
+ args.stack_fields.map((field, index) => /* @__PURE__ */ jsxRuntime.jsx(
25348
+ recharts.Bar,
25349
+ {
25350
+ dataKey: field,
25351
+ stackId: "stack",
25352
+ fill: stackColors[index % stackColors.length],
25353
+ name: field
25354
+ },
25355
+ field
25356
+ ))
25357
+ ] }) }),
25358
+ args.title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-center text-sm text-gray-600 mt-2", children: args.title })
25359
+ ] }, `stacked-bar-${key}`);
25360
+ case "create_dual_axis_chart":
25361
+ console.log("[DEBUG] Rendering dual-axis chart");
25362
+ if (!args.data || !args.x_field || !args.left_y_field || !args.right_y_field) {
25363
+ console.error("Dual-axis chart missing required parameters:", {
25364
+ data: !!args.data,
25365
+ x_field: !!args.x_field,
25366
+ left_y_field: !!args.left_y_field,
25367
+ right_y_field: !!args.right_y_field
25368
+ });
25369
+ return null;
25370
+ }
25371
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "my-6 w-full", children: [
25372
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height: 400, children: /* @__PURE__ */ jsxRuntime.jsxs(recharts.ComposedChart, { data: args.data, children: [
25373
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.CartesianGrid, { strokeDasharray: "3 3" }),
25374
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.XAxis, { dataKey: args.x_field }),
25375
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.YAxis, { yAxisId: "left", orientation: "left", label: { value: args.left_label || "", angle: -90, position: "insideLeft" } }),
25376
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.YAxis, { yAxisId: "right", orientation: "right", label: { value: args.right_label || "", angle: 90, position: "insideRight" } }),
25377
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.Tooltip, {}),
25378
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.Legend, {}),
25379
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.Bar, { yAxisId: "left", dataKey: args.left_y_field, fill: "#3b82f6", name: args.left_label || args.left_y_field }),
25380
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.Line, { yAxisId: "right", type: "monotone", dataKey: args.right_y_field, stroke: "#ef4444", strokeWidth: 2, name: args.right_label || args.right_y_field })
25381
+ ] }) }),
25382
+ args.title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-center text-sm text-gray-600 mt-2", children: args.title })
25383
+ ] }, `dual-axis-${key}`);
25384
+ case "create_scatter_plot":
25385
+ console.log("[DEBUG] Rendering scatter plot");
25386
+ if (!args.data || !args.x_field || !args.y_field || !args.group_field) {
25387
+ console.error("Scatter plot missing required parameters:", {
25388
+ data: !!args.data,
25389
+ x_field: !!args.x_field,
25390
+ y_field: !!args.y_field,
25391
+ group_field: !!args.group_field
25392
+ });
25393
+ return null;
25394
+ }
25395
+ const groupedData = args.data.reduce((acc, item) => {
25396
+ const group = item[args.group_field];
25397
+ if (!acc[group]) {
25398
+ acc[group] = [];
25399
+ }
25400
+ acc[group].push(item);
25401
+ return acc;
25402
+ }, {});
25403
+ const scatterColors = ["#3b82f6", "#ef4444", "#10b981", "#f59e0b", "#8b5cf6", "#06b6d4", "#84cc16", "#f97316"];
25404
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "my-6 w-full", children: [
25405
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height: 400, children: /* @__PURE__ */ jsxRuntime.jsxs(recharts.ScatterChart, { children: [
25406
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.CartesianGrid, { strokeDasharray: "3 3" }),
25407
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.XAxis, { dataKey: args.x_field, type: "number", name: args.x_field }),
25408
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.YAxis, { dataKey: args.y_field, type: "number", name: args.y_field }),
25409
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.Tooltip, { cursor: { strokeDasharray: "3 3" } }),
25410
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.Legend, {}),
25411
+ Object.entries(groupedData).map(([group, data], index) => /* @__PURE__ */ jsxRuntime.jsx(
25412
+ recharts.Scatter,
25413
+ {
25414
+ name: group,
25415
+ data,
25416
+ fill: scatterColors[index % scatterColors.length]
25417
+ },
25418
+ group
25419
+ ))
25420
+ ] }) }),
25421
+ args.title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-center text-sm text-gray-600 mt-2", children: args.title })
25422
+ ] }, `scatter-${key}`);
25423
+ case "create_combo_chart":
25424
+ console.log("[DEBUG] Rendering combo chart");
25425
+ if (!args.data || !args.x_field || !args.bar_field || !args.line_field) {
25426
+ console.error("Combo chart missing required parameters:", {
25427
+ data: !!args.data,
25428
+ x_field: !!args.x_field,
25429
+ bar_field: !!args.bar_field,
25430
+ line_field: !!args.line_field
25431
+ });
25432
+ return null;
25433
+ }
25434
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "my-6 w-full", children: [
25435
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height: 400, children: /* @__PURE__ */ jsxRuntime.jsxs(recharts.ComposedChart, { data: args.data, children: [
25436
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.CartesianGrid, { strokeDasharray: "3 3" }),
25437
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.XAxis, { dataKey: args.x_field }),
25438
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.YAxis, { yAxisId: "left", orientation: "left" }),
25439
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.YAxis, { yAxisId: "right", orientation: "right" }),
25440
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.Tooltip, {}),
25441
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.Legend, {}),
25442
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.Bar, { yAxisId: "left", dataKey: args.bar_field, fill: "#3b82f6", name: args.bar_field }),
25443
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.Line, { yAxisId: "right", type: "monotone", dataKey: args.line_field, stroke: "#ef4444", strokeWidth: 2, name: args.line_field })
25444
+ ] }) }),
25445
+ args.title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-center text-sm text-gray-600 mt-2", children: args.title })
25446
+ ] }, `combo-${key}`);
25447
+ case "create_area_chart":
25448
+ console.log("[DEBUG] Rendering area chart");
25449
+ if (!args.data || !args.x_field || !args.y_field) {
25450
+ console.error("Area chart missing required parameters:", {
25451
+ data: !!args.data,
25452
+ x_field: !!args.x_field,
25453
+ y_field: !!args.y_field
25454
+ });
25455
+ return null;
25456
+ }
25457
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "my-6 w-full", children: [
25458
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height: 400, children: /* @__PURE__ */ jsxRuntime.jsxs(recharts.ComposedChart, { data: args.data, children: [
25459
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.CartesianGrid, { strokeDasharray: "3 3" }),
25460
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.XAxis, { dataKey: args.x_field }),
25461
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.YAxis, {}),
25462
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.Tooltip, {}),
25463
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.Legend, {}),
25464
+ /* @__PURE__ */ jsxRuntime.jsx(
25465
+ recharts.Area,
25466
+ {
25467
+ type: "monotone",
25468
+ dataKey: args.y_field,
25469
+ stroke: "#3b82f6",
25470
+ fill: args.fill ? "#3b82f6" : "none",
25471
+ fillOpacity: args.fill ? 0.6 : 0,
25472
+ name: args.y_field
25473
+ }
25474
+ )
25475
+ ] }) }),
25476
+ args.title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-center text-sm text-gray-600 mt-2", children: args.title })
25477
+ ] }, `area-${key}`);
25265
25478
  default:
25266
25479
  console.warn(`Unknown chart type: ${chartType}`);
25267
25480
  return null;
package/dist/index.mjs CHANGED
@@ -10,7 +10,7 @@ import Hls2 from 'hls.js';
10
10
  import useSWR from 'swr';
11
11
  import { noop, warning, invariant, progress, secondsToMilliseconds, millisecondsToSeconds, memo as memo$1 } from 'motion-utils';
12
12
  import { getValueTransition, hover, press, isPrimaryPointer, GroupPlaybackControls, setDragLock, supportsLinearEasing, attachTimeline, isGenerator, calcGeneratorDuration, isWaapiSupportedEasing, mapEasingToNativeEasing, maxGeneratorDuration, generateLinearEasing, isBezierDefinition } from 'motion-dom';
13
- import { Bar, LabelList, ResponsiveContainer, BarChart as BarChart$1, CartesianGrid, XAxis, YAxis, Tooltip, ReferenceLine, Cell, PieChart, Pie, Legend, LineChart as LineChart$1, Line } from 'recharts';
13
+ import { Bar, LabelList, ResponsiveContainer, BarChart as BarChart$1, CartesianGrid, XAxis, YAxis, Tooltip, ReferenceLine, Cell, PieChart, Pie, Legend, LineChart as LineChart$1, Line, ComposedChart, Area, ScatterChart, Scatter } from 'recharts';
14
14
  import { Slot } from '@radix-ui/react-slot';
15
15
  import { Camera, ChevronDown, ChevronUp, Check, ShieldCheck, Star, Award, X, Coffee, Plus, Clock, Minus, ArrowDown, ArrowUp, Search, CheckCircle, AlertTriangle, Info, Share2, Download, User, XCircle, ChevronLeft, ChevronRight, AlertCircle, Sun, Moon, MessageSquare, Trash2, ArrowLeft, RefreshCw, Menu, Send, Copy, Edit2, UserCheck, Save, LogOut, Calendar, Settings, LifeBuoy, Loader2, ArrowLeftIcon as ArrowLeftIcon$1, Settings2, CheckCircle2, EyeOff, Eye, Zap, UserCircle } from 'lucide-react';
16
16
  import { DayPicker, useNavigation as useNavigation$1 } from 'react-day-picker';
@@ -25017,12 +25017,22 @@ var AIAgentView = () => {
25017
25017
  const parseChartPatterns = (text) => {
25018
25018
  const chartElements = [];
25019
25019
  let lastIndex = 0;
25020
+ console.log("[DEBUG] Parsing chart patterns from text:", text);
25020
25021
  const chartRegex = /\[\s*(?:Calling\s+|CALL\s+)?(create_[a-z_]+)\s*\(([\s\S]*?)\)\s*\]/g;
25021
25022
  let match;
25022
25023
  const processedIndices = /* @__PURE__ */ new Set();
25024
+ let matchCount = 0;
25023
25025
  while ((match = chartRegex.exec(text)) !== null) {
25026
+ matchCount++;
25024
25027
  const startIndex = match.index;
25025
25028
  const endIndex = startIndex + match[0].length;
25029
+ console.log(`[DEBUG] Found chart pattern #${matchCount}:`, {
25030
+ fullMatch: match[0],
25031
+ chartType: match[1],
25032
+ argsString: match[2],
25033
+ startIndex,
25034
+ endIndex
25035
+ });
25026
25036
  if (!processedIndices.has(startIndex)) {
25027
25037
  processedIndices.add(startIndex);
25028
25038
  if (startIndex > lastIndex) {
@@ -25043,7 +25053,10 @@ var AIAgentView = () => {
25043
25053
  const args = parseChartArguments(argsString);
25044
25054
  const chartElement = renderChart(chartType, args, startIndex);
25045
25055
  if (chartElement) {
25056
+ console.log(`[DEBUG] Successfully rendered chart: ${chartType}`);
25046
25057
  chartElements.push(chartElement);
25058
+ } else {
25059
+ console.warn(`[DEBUG] Chart element was null for type: ${chartType}`);
25047
25060
  }
25048
25061
  } catch (error) {
25049
25062
  console.error(`Failed to parse chart ${chartType}:`, error);
@@ -25064,6 +25077,7 @@ var AIAgentView = () => {
25064
25077
  lastIndex = endIndex;
25065
25078
  }
25066
25079
  }
25080
+ console.log(`[DEBUG] Total chart patterns found: ${matchCount}`);
25067
25081
  if (lastIndex < text.length) {
25068
25082
  const remainingText = text.substring(lastIndex);
25069
25083
  chartElements.push(
@@ -25077,22 +25091,28 @@ var AIAgentView = () => {
25077
25091
  );
25078
25092
  }
25079
25093
  if (chartElements.length === 1 && lastIndex === 0) {
25094
+ console.log("[DEBUG] No charts found in text, returning null");
25080
25095
  return null;
25081
25096
  }
25097
+ console.log(`[DEBUG] Returning ${chartElements.length} chart elements`);
25082
25098
  return chartElements;
25083
25099
  };
25084
25100
  const parseChartArguments = (argsString) => {
25085
25101
  const args = {};
25102
+ console.log("[DEBUG] Parsing chart arguments:", argsString);
25086
25103
  const jsonParamRegex = /(\w+)\s*=\s*(\[[\s\S]*?\](?=\s*(?:,|\s*\)|\s*$))|\{[\s\S]*?\}(?=\s*(?:,|\s*\)|\s*$)))/g;
25087
25104
  let jsonMatch;
25088
25105
  while ((jsonMatch = jsonParamRegex.exec(argsString)) !== null) {
25089
25106
  const paramName = jsonMatch[1];
25090
25107
  const jsonValue = jsonMatch[2];
25108
+ console.log(`[DEBUG] Found JSON parameter: ${paramName} = ${jsonValue}`);
25091
25109
  try {
25092
25110
  args[paramName] = JSON.parse(jsonValue);
25111
+ console.log(`[DEBUG] Successfully parsed ${paramName}:`, args[paramName]);
25093
25112
  argsString = argsString.replace(jsonMatch[0], "");
25094
25113
  } catch (e) {
25095
25114
  console.error(`Failed to parse ${paramName} JSON:`, e);
25115
+ console.error(`JSON value that failed:`, jsonValue);
25096
25116
  }
25097
25117
  }
25098
25118
  const argRegex = /(\w+)\s*=\s*("([^"]*)"|'([^']*)'|([^,\s\)]+))/g;
@@ -25113,11 +25133,14 @@ var AIAgentView = () => {
25113
25133
  args[key] = value;
25114
25134
  }
25115
25135
  }
25136
+ console.log("[DEBUG] Final parsed arguments:", args);
25116
25137
  return args;
25117
25138
  };
25118
25139
  const renderChart = (chartType, args, key) => {
25140
+ console.log(`[DEBUG] Attempting to render chart type: ${chartType}`, args);
25119
25141
  switch (chartType) {
25120
25142
  case "create_gauge_chart":
25143
+ console.log("[DEBUG] Rendering gauge chart");
25121
25144
  return /* @__PURE__ */ jsx("div", { className: "my-6 h-64 w-full flex justify-center", children: /* @__PURE__ */ jsx(
25122
25145
  GaugeChart,
25123
25146
  {
@@ -25132,8 +25155,9 @@ var AIAgentView = () => {
25132
25155
  }
25133
25156
  ) }, `gauge-${key}`);
25134
25157
  case "create_bar_chart":
25158
+ console.log("[DEBUG] Rendering bar chart");
25135
25159
  if (!args.data || !args.x_field || !args.y_field) {
25136
- console.error("Bar chart missing required parameters");
25160
+ console.error("Bar chart missing required parameters:", { data: !!args.data, x_field: !!args.x_field, y_field: !!args.y_field });
25137
25161
  return null;
25138
25162
  }
25139
25163
  return /* @__PURE__ */ jsxs("div", { className: "my-6 w-full", style: { maxWidth: args.max_width || "100%" }, children: [
@@ -25154,8 +25178,9 @@ var AIAgentView = () => {
25154
25178
  args.title && /* @__PURE__ */ jsx("p", { className: "text-center text-sm text-gray-600 mt-2", children: args.title })
25155
25179
  ] }, `bar-${key}`);
25156
25180
  case "create_line_chart":
25181
+ console.log("[DEBUG] Rendering line chart");
25157
25182
  if (!args.data || !args.x_field || !args.y_field) {
25158
- console.error("Line chart missing required parameters");
25183
+ console.error("Line chart missing required parameters:", { data: !!args.data, x_field: !!args.x_field, y_field: !!args.y_field });
25159
25184
  return null;
25160
25185
  }
25161
25186
  return /* @__PURE__ */ jsxs("div", { className: "my-6 w-full", style: {
@@ -25179,14 +25204,17 @@ var AIAgentView = () => {
25179
25204
  args.title && /* @__PURE__ */ jsx("p", { className: "text-center text-sm text-gray-600 mt-2", children: args.title })
25180
25205
  ] }, `line-${key}`);
25181
25206
  case "create_pie_chart":
25207
+ console.log("[DEBUG] Rendering pie chart");
25182
25208
  if (!args.data || !args.label_field || !args.value_field) {
25183
- console.error("Pie chart missing required parameters");
25209
+ console.error("Pie chart missing required parameters:", { data: !!args.data, label_field: !!args.label_field, value_field: !!args.value_field });
25210
+ console.error("Available args:", Object.keys(args));
25184
25211
  return null;
25185
25212
  }
25186
25213
  const pieData = args.data.map((item) => ({
25187
25214
  name: item[args.label_field],
25188
25215
  value: item[args.value_field]
25189
25216
  }));
25217
+ console.log("[DEBUG] Pie chart data transformed:", pieData);
25190
25218
  return /* @__PURE__ */ jsxs("div", { className: "my-6 w-full flex flex-col items-center", children: [
25191
25219
  args.title && /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-gray-700 mb-2", children: args.title }),
25192
25220
  /* @__PURE__ */ jsx("div", { className: "h-64 w-full max-w-md", children: /* @__PURE__ */ jsx(
@@ -25198,6 +25226,7 @@ var AIAgentView = () => {
25198
25226
  ) })
25199
25227
  ] }, `pie-${key}`);
25200
25228
  case "create_comparison_table":
25229
+ console.log("[DEBUG] Rendering comparison table");
25201
25230
  if (!args.data) {
25202
25231
  console.error("Comparison table missing required data");
25203
25232
  return null;
@@ -25233,6 +25262,190 @@ var AIAgentView = () => {
25233
25262
  )) }, rowIdx)) })
25234
25263
  ] })
25235
25264
  ] }, `table-${key}`);
25265
+ case "create_multi_line_chart":
25266
+ console.log("[DEBUG] Rendering multi-line chart");
25267
+ if (!args.data || !args.x_field || !args.y_fields || !args.legend) {
25268
+ console.error("Multi-line chart missing required parameters:", {
25269
+ data: !!args.data,
25270
+ x_field: !!args.x_field,
25271
+ y_fields: !!args.y_fields,
25272
+ legend: !!args.legend
25273
+ });
25274
+ return null;
25275
+ }
25276
+ const colors = ["#3b82f6", "#ef4444", "#10b981", "#f59e0b", "#8b5cf6", "#06b6d4", "#84cc16", "#f97316"];
25277
+ return /* @__PURE__ */ jsxs("div", { className: "my-6 w-full", children: [
25278
+ /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: 400, children: /* @__PURE__ */ jsxs(LineChart$1, { data: args.data, children: [
25279
+ /* @__PURE__ */ jsx(CartesianGrid, { strokeDasharray: "3 3" }),
25280
+ /* @__PURE__ */ jsx(XAxis, { dataKey: args.x_field }),
25281
+ /* @__PURE__ */ jsx(YAxis, {}),
25282
+ /* @__PURE__ */ jsx(Tooltip, {}),
25283
+ /* @__PURE__ */ jsx(Legend, {}),
25284
+ args.y_fields.map((field, index) => /* @__PURE__ */ jsx(
25285
+ Line,
25286
+ {
25287
+ type: "monotone",
25288
+ dataKey: field,
25289
+ stroke: colors[index % colors.length],
25290
+ strokeWidth: 2,
25291
+ name: args.legend[index] || field,
25292
+ dot: { r: 4 },
25293
+ activeDot: { r: 6 }
25294
+ },
25295
+ field
25296
+ ))
25297
+ ] }) }),
25298
+ args.title && /* @__PURE__ */ jsx("p", { className: "text-center text-sm text-gray-600 mt-2", children: args.title })
25299
+ ] }, `multi-line-${key}`);
25300
+ case "create_stacked_bar_chart":
25301
+ console.log("[DEBUG] Rendering stacked bar chart");
25302
+ if (!args.data || !args.x_field || !args.stack_fields) {
25303
+ console.error("Stacked bar chart missing required parameters:", {
25304
+ data: !!args.data,
25305
+ x_field: !!args.x_field,
25306
+ stack_fields: !!args.stack_fields
25307
+ });
25308
+ return null;
25309
+ }
25310
+ const stackColors = ["#3b82f6", "#ef4444", "#10b981", "#f59e0b", "#8b5cf6", "#06b6d4", "#84cc16", "#f97316"];
25311
+ return /* @__PURE__ */ jsxs("div", { className: "my-6 w-full", children: [
25312
+ /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: 400, children: /* @__PURE__ */ jsxs(BarChart$1, { data: args.data, children: [
25313
+ /* @__PURE__ */ jsx(CartesianGrid, { strokeDasharray: "3 3" }),
25314
+ /* @__PURE__ */ jsx(XAxis, { dataKey: args.x_field }),
25315
+ /* @__PURE__ */ jsx(YAxis, {}),
25316
+ /* @__PURE__ */ jsx(Tooltip, {}),
25317
+ /* @__PURE__ */ jsx(Legend, {}),
25318
+ args.stack_fields.map((field, index) => /* @__PURE__ */ jsx(
25319
+ Bar,
25320
+ {
25321
+ dataKey: field,
25322
+ stackId: "stack",
25323
+ fill: stackColors[index % stackColors.length],
25324
+ name: field
25325
+ },
25326
+ field
25327
+ ))
25328
+ ] }) }),
25329
+ args.title && /* @__PURE__ */ jsx("p", { className: "text-center text-sm text-gray-600 mt-2", children: args.title })
25330
+ ] }, `stacked-bar-${key}`);
25331
+ case "create_dual_axis_chart":
25332
+ console.log("[DEBUG] Rendering dual-axis chart");
25333
+ if (!args.data || !args.x_field || !args.left_y_field || !args.right_y_field) {
25334
+ console.error("Dual-axis chart missing required parameters:", {
25335
+ data: !!args.data,
25336
+ x_field: !!args.x_field,
25337
+ left_y_field: !!args.left_y_field,
25338
+ right_y_field: !!args.right_y_field
25339
+ });
25340
+ return null;
25341
+ }
25342
+ return /* @__PURE__ */ jsxs("div", { className: "my-6 w-full", children: [
25343
+ /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: 400, children: /* @__PURE__ */ jsxs(ComposedChart, { data: args.data, children: [
25344
+ /* @__PURE__ */ jsx(CartesianGrid, { strokeDasharray: "3 3" }),
25345
+ /* @__PURE__ */ jsx(XAxis, { dataKey: args.x_field }),
25346
+ /* @__PURE__ */ jsx(YAxis, { yAxisId: "left", orientation: "left", label: { value: args.left_label || "", angle: -90, position: "insideLeft" } }),
25347
+ /* @__PURE__ */ jsx(YAxis, { yAxisId: "right", orientation: "right", label: { value: args.right_label || "", angle: 90, position: "insideRight" } }),
25348
+ /* @__PURE__ */ jsx(Tooltip, {}),
25349
+ /* @__PURE__ */ jsx(Legend, {}),
25350
+ /* @__PURE__ */ jsx(Bar, { yAxisId: "left", dataKey: args.left_y_field, fill: "#3b82f6", name: args.left_label || args.left_y_field }),
25351
+ /* @__PURE__ */ jsx(Line, { yAxisId: "right", type: "monotone", dataKey: args.right_y_field, stroke: "#ef4444", strokeWidth: 2, name: args.right_label || args.right_y_field })
25352
+ ] }) }),
25353
+ args.title && /* @__PURE__ */ jsx("p", { className: "text-center text-sm text-gray-600 mt-2", children: args.title })
25354
+ ] }, `dual-axis-${key}`);
25355
+ case "create_scatter_plot":
25356
+ console.log("[DEBUG] Rendering scatter plot");
25357
+ if (!args.data || !args.x_field || !args.y_field || !args.group_field) {
25358
+ console.error("Scatter plot missing required parameters:", {
25359
+ data: !!args.data,
25360
+ x_field: !!args.x_field,
25361
+ y_field: !!args.y_field,
25362
+ group_field: !!args.group_field
25363
+ });
25364
+ return null;
25365
+ }
25366
+ const groupedData = args.data.reduce((acc, item) => {
25367
+ const group = item[args.group_field];
25368
+ if (!acc[group]) {
25369
+ acc[group] = [];
25370
+ }
25371
+ acc[group].push(item);
25372
+ return acc;
25373
+ }, {});
25374
+ const scatterColors = ["#3b82f6", "#ef4444", "#10b981", "#f59e0b", "#8b5cf6", "#06b6d4", "#84cc16", "#f97316"];
25375
+ return /* @__PURE__ */ jsxs("div", { className: "my-6 w-full", children: [
25376
+ /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: 400, children: /* @__PURE__ */ jsxs(ScatterChart, { children: [
25377
+ /* @__PURE__ */ jsx(CartesianGrid, { strokeDasharray: "3 3" }),
25378
+ /* @__PURE__ */ jsx(XAxis, { dataKey: args.x_field, type: "number", name: args.x_field }),
25379
+ /* @__PURE__ */ jsx(YAxis, { dataKey: args.y_field, type: "number", name: args.y_field }),
25380
+ /* @__PURE__ */ jsx(Tooltip, { cursor: { strokeDasharray: "3 3" } }),
25381
+ /* @__PURE__ */ jsx(Legend, {}),
25382
+ Object.entries(groupedData).map(([group, data], index) => /* @__PURE__ */ jsx(
25383
+ Scatter,
25384
+ {
25385
+ name: group,
25386
+ data,
25387
+ fill: scatterColors[index % scatterColors.length]
25388
+ },
25389
+ group
25390
+ ))
25391
+ ] }) }),
25392
+ args.title && /* @__PURE__ */ jsx("p", { className: "text-center text-sm text-gray-600 mt-2", children: args.title })
25393
+ ] }, `scatter-${key}`);
25394
+ case "create_combo_chart":
25395
+ console.log("[DEBUG] Rendering combo chart");
25396
+ if (!args.data || !args.x_field || !args.bar_field || !args.line_field) {
25397
+ console.error("Combo chart missing required parameters:", {
25398
+ data: !!args.data,
25399
+ x_field: !!args.x_field,
25400
+ bar_field: !!args.bar_field,
25401
+ line_field: !!args.line_field
25402
+ });
25403
+ return null;
25404
+ }
25405
+ return /* @__PURE__ */ jsxs("div", { className: "my-6 w-full", children: [
25406
+ /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: 400, children: /* @__PURE__ */ jsxs(ComposedChart, { data: args.data, children: [
25407
+ /* @__PURE__ */ jsx(CartesianGrid, { strokeDasharray: "3 3" }),
25408
+ /* @__PURE__ */ jsx(XAxis, { dataKey: args.x_field }),
25409
+ /* @__PURE__ */ jsx(YAxis, { yAxisId: "left", orientation: "left" }),
25410
+ /* @__PURE__ */ jsx(YAxis, { yAxisId: "right", orientation: "right" }),
25411
+ /* @__PURE__ */ jsx(Tooltip, {}),
25412
+ /* @__PURE__ */ jsx(Legend, {}),
25413
+ /* @__PURE__ */ jsx(Bar, { yAxisId: "left", dataKey: args.bar_field, fill: "#3b82f6", name: args.bar_field }),
25414
+ /* @__PURE__ */ jsx(Line, { yAxisId: "right", type: "monotone", dataKey: args.line_field, stroke: "#ef4444", strokeWidth: 2, name: args.line_field })
25415
+ ] }) }),
25416
+ args.title && /* @__PURE__ */ jsx("p", { className: "text-center text-sm text-gray-600 mt-2", children: args.title })
25417
+ ] }, `combo-${key}`);
25418
+ case "create_area_chart":
25419
+ console.log("[DEBUG] Rendering area chart");
25420
+ if (!args.data || !args.x_field || !args.y_field) {
25421
+ console.error("Area chart missing required parameters:", {
25422
+ data: !!args.data,
25423
+ x_field: !!args.x_field,
25424
+ y_field: !!args.y_field
25425
+ });
25426
+ return null;
25427
+ }
25428
+ return /* @__PURE__ */ jsxs("div", { className: "my-6 w-full", children: [
25429
+ /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: 400, children: /* @__PURE__ */ jsxs(ComposedChart, { data: args.data, children: [
25430
+ /* @__PURE__ */ jsx(CartesianGrid, { strokeDasharray: "3 3" }),
25431
+ /* @__PURE__ */ jsx(XAxis, { dataKey: args.x_field }),
25432
+ /* @__PURE__ */ jsx(YAxis, {}),
25433
+ /* @__PURE__ */ jsx(Tooltip, {}),
25434
+ /* @__PURE__ */ jsx(Legend, {}),
25435
+ /* @__PURE__ */ jsx(
25436
+ Area,
25437
+ {
25438
+ type: "monotone",
25439
+ dataKey: args.y_field,
25440
+ stroke: "#3b82f6",
25441
+ fill: args.fill ? "#3b82f6" : "none",
25442
+ fillOpacity: args.fill ? 0.6 : 0,
25443
+ name: args.y_field
25444
+ }
25445
+ )
25446
+ ] }) }),
25447
+ args.title && /* @__PURE__ */ jsx("p", { className: "text-center text-sm text-gray-600 mt-2", children: args.title })
25448
+ ] }, `area-${key}`);
25236
25449
  default:
25237
25450
  console.warn(`Unknown chart type: ${chartType}`);
25238
25451
  return null;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@optifye/dashboard-core",
3
- "version": "4.3.3",
3
+ "version": "4.3.4",
4
4
  "description": "Reusable UI & logic for Optifye dashboard",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",