@datatechsolutions/ui 2.11.50 → 2.11.52

package/dist/astrlabe/workflow-canvas.js

@@ -1,19 +1,19 @@
 "use client";
 'use strict';
 
-var chunkYDZRHVCW_js = require('../chunk-YDZRHVCW.js');
-require('../chunk-KEUOCEOO.js');
-require('../chunk-YXN2K77G.js');
+var chunkAFVXNLGI_js = require('../chunk-AFVXNLGI.js');
+require('../chunk-2BUYACAN.js');
 require('../chunk-S7KHTUHA.js');
 require('../chunk-UZ3CMNUJ.js');
 require('../chunk-P4YYEM4B.js');
 require('../chunk-PWBWP5FJ.js');
+require('../chunk-YXN2K77G.js');
 
 
 
 Object.defineProperty(exports, "Workspace", {
   enumerable: true,
-  get: function () { return chunkYDZRHVCW_js.Workspace; }
+  get: function () { return chunkAFVXNLGI_js.Workspace; }
 });
 //# sourceMappingURL=workflow-canvas.js.map
 //# sourceMappingURL=workflow-canvas.js.map

package/dist/astrlabe/workflow-canvas.mjs

@@ -1,10 +1,10 @@
 "use client";
-export { Workspace } from '../chunk-DFOPQKPU.mjs';
-import '../chunk-DNGI4ASL.mjs';
-import '../chunk-7VJ7CMMT.mjs';
+export { Workspace } from '../chunk-HOCGFL5J.mjs';
+import '../chunk-F2V7GC3Y.mjs';
 import '../chunk-QWG2FMUN.mjs';
 import '../chunk-D2JF6C3E.mjs';
 import '../chunk-OZNTQROP.mjs';
 import '../chunk-TLPPVL3W.mjs';
+import '../chunk-7VJ7CMMT.mjs';
 //# sourceMappingURL=workflow-canvas.mjs.map
 //# sourceMappingURL=workflow-canvas.mjs.map

package/dist/{chunk-KEUOCEOO.js → chunk-2BUYACAN.js}

@@ -1,9 +1,9 @@
 "use client";
 'use strict';
 
-var chunkYXN2K77G_js = require('./chunk-YXN2K77G.js');
 var chunkS7KHTUHA_js = require('./chunk-S7KHTUHA.js');
 var chunkUZ3CMNUJ_js = require('./chunk-UZ3CMNUJ.js');
+var chunkYXN2K77G_js = require('./chunk-YXN2K77G.js');
 var Headless6 = require('@headlessui/react');
 var clsx = require('clsx');
 var React12 = require('react');
@@ -2032,6 +2032,222 @@ function MetricCard({
     icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex h-10 w-10 items-center justify-center rounded-lg ${iconStyles[variant]}`, children: icon })
   ] }) });
 }
+
+// src/types/chart-spec.ts
+var DEFAULT_COLORS = [
+  "#6366f1",
+  // indigo-500
+  "#10b981",
+  // emerald-500
+  "#f59e0b",
+  // amber-500
+  "#ef4444",
+  // red-500
+  "#0ea5e9",
+  // sky-500
+  "#8b5cf6"
+  // violet-500
+];
+function computeSeries(spec) {
+  return spec.series.map((series, index) => ({
+    name: series.name,
+    color: series.color ?? DEFAULT_COLORS[index % DEFAULT_COLORS.length] ?? DEFAULT_COLORS[0],
+    values: spec.data.map((point) => {
+      const raw = point[series.name];
+      const num = typeof raw === "number" ? raw : Number(raw);
+      return Number.isFinite(num) ? num : 0;
+    })
+  }));
+}
+function computeDomain(spec, series) {
+  if (spec.yAxis.domain) return spec.yAxis.domain;
+  const allValues = series.flatMap((row) => row.values);
+  if (allValues.length === 0) return [0, 1];
+  const min = Math.min(...allValues);
+  const max = Math.max(...allValues);
+  if (min === max) {
+    const padded = Math.abs(min) * 0.1 || 1;
+    return [min - padded, max + padded];
+  }
+  const padding = (max - min) * 0.1;
+  return [min - padding, max + padding];
+}
+function yScale(value, domain, height) {
+  const [min, max] = domain;
+  if (max === min) return height / 2;
+  const normalized = (value - min) / (max - min);
+  return height - normalized * height;
+}
+function xScale(index, count, width) {
+  if (count <= 1) return width / 2;
+  return index / (count - 1) * width;
+}
+var MARGIN = { top: 24, right: 16, bottom: 32, left: 48 };
+function ChartRenderer({ spec, width = 640, height = 280, className }) {
+  const innerWidth = width - MARGIN.left - MARGIN.right;
+  const innerHeight = height - MARGIN.top - MARGIN.bottom;
+  const seriesComputed = computeSeries(spec);
+  const domain = computeDomain(spec, seriesComputed);
+  const count = spec.data.length;
+  const yTicks = buildTicks(domain[0], domain[1], 4);
+  return /* @__PURE__ */ jsxRuntime.jsxs("figure", { className: className ?? "w-full", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("figcaption", { className: "mb-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: spec.title }),
+      spec.subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-slate-500 dark:text-slate-400", children: spec.subtitle })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "svg",
+      {
+        role: "img",
+        "aria-label": spec.title,
+        viewBox: `0 0 ${width} ${height}`,
+        className: "w-full overflow-visible text-slate-600 dark:text-slate-400",
+        children: /* @__PURE__ */ jsxRuntime.jsxs("g", { transform: `translate(${MARGIN.left},${MARGIN.top})`, children: [
+          yTicks.map((tick) => {
+            const y = yScale(tick, domain, innerHeight);
+            return /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
+              /* @__PURE__ */ jsxRuntime.jsx("line", { x1: 0, x2: innerWidth, y1: y, y2: y, stroke: "currentColor", strokeOpacity: 0.08 }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "text",
+                {
+                  x: -8,
+                  y,
+                  textAnchor: "end",
+                  dominantBaseline: "middle",
+                  className: "fill-current text-[10px] font-mono",
+                  children: formatTick(tick, spec.yAxis.unit)
+                }
+              )
+            ] }, `y-${tick}`);
+          }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "line",
+            {
+              x1: 0,
+              x2: innerWidth,
+              y1: innerHeight,
+              y2: innerHeight,
+              stroke: "currentColor",
+              strokeOpacity: 0.2
+            }
+          ),
+          count > 0 && renderXLabels(spec.data, count, innerWidth, innerHeight),
+          seriesComputed.map(
+            (series, index) => spec.type === "bar" ? renderBars(series, index, seriesComputed.length, count, domain, innerWidth, innerHeight) : renderLine(series, spec.type, count, domain, innerWidth, innerHeight)
+          ),
+          spec.annotations?.map((annotation, index) => {
+            const xIndex = spec.data.findIndex((point) => point.x === annotation.x);
+            if (xIndex < 0) return null;
+            const x = xScale(xIndex, count, innerWidth);
+            const color = annotation.color ?? "#f43f5e";
+            return /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "line",
+                {
+                  x1: x,
+                  x2: x,
+                  y1: 0,
+                  y2: innerHeight,
+                  stroke: color,
+                  strokeDasharray: "4 3",
+                  strokeWidth: 1
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "text",
+                {
+                  x: x + 4,
+                  y: 10,
+                  fill: color,
+                  className: "text-[10px] font-medium",
+                  children: annotation.label
+                }
+              )
+            ] }, `ann-${index}`);
+          })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "mt-2 flex flex-wrap gap-3 text-xs text-slate-600 dark:text-slate-400", children: seriesComputed.map((series) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-center gap-1.5", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          className: "inline-block h-2 w-2 rounded-full",
+          style: { backgroundColor: series.color },
+          "aria-hidden": true
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { children: series.name })
+    ] }, series.name)) })
+  ] });
+}
+function buildTicks(min, max, count) {
+  const step = (max - min) / (count - 1);
+  const ticks = [];
+  for (let index = 0; index < count; index += 1) {
+    ticks.push(min + step * index);
+  }
+  return ticks;
+}
+function formatTick(value, unit) {
+  const formatted = Math.abs(value) >= 1e3 ? value.toFixed(0) : value.toFixed(Math.abs(value) < 10 ? 2 : 1);
+  return unit ? `${formatted}${unit}` : formatted;
+}
+function renderXLabels(data, count, width, height) {
+  const indexes = count > 6 ? [0, Math.floor(count / 3), Math.floor(2 * count / 3), count - 1] : Array.from({ length: count }, (_, index) => index);
+  return indexes.map((index) => {
+    const x = xScale(index, count, width);
+    const label = String(data[index]?.x ?? "");
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "text",
+      {
+        x,
+        y: height + 16,
+        textAnchor: "middle",
+        className: "fill-current text-[10px] font-mono",
+        children: label
+      },
+      `x-${index}`
+    );
+  });
+}
+function renderLine(series, type, count, domain, width, height) {
+  const points = series.values.map((value, index) => ({
+    x: xScale(index, count, width),
+    y: yScale(value, domain, height)
+  }));
+  const linePath = points.reduce((acc, point, index) => index === 0 ? `M${point.x},${point.y}` : `${acc} L${point.x},${point.y}`, "");
+  const areaPath = type === "area" && points.length > 0 ? `${linePath} L${points[points.length - 1]?.x ?? 0},${height} L${points[0]?.x ?? 0},${height} Z` : null;
+  return /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
+    areaPath && /* @__PURE__ */ jsxRuntime.jsx("path", { d: areaPath, fill: series.color, fillOpacity: 0.15 }),
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: linePath, stroke: series.color, strokeWidth: 2, fill: "none" }),
+    points.map((point, index) => /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: point.x, cy: point.y, r: 2.5, fill: series.color }, `${series.name}-${index}`))
+  ] }, series.name);
+}
+function renderBars(series, seriesIndex, seriesCount, count, domain, width, height) {
+  const slot = count > 1 ? width / (count - 1) : width;
+  const barWidth = Math.max(2, slot * 0.8 / seriesCount);
+  const offset = seriesCount * barWidth / 2;
+  return /* @__PURE__ */ jsxRuntime.jsx("g", { children: series.values.map((value, index) => {
+    const cx = xScale(index, count, width);
+    const barX = cx - offset + seriesIndex * barWidth;
+    const y = yScale(value, domain, height);
+    const barHeight = height - y;
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "rect",
+      {
+        x: barX,
+        y,
+        width: barWidth,
+        height: Math.max(0, barHeight),
+        fill: series.color,
+        fillOpacity: 0.85,
+        rx: 2
+      },
+      `${series.name}-${index}`
+    );
+  }) }, series.name);
+}
 function AgentAnalysisCard({ name, avatar, duration, output }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "liquid-surface rounded-xl p-3 transition-all duration-300", children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 mb-1.5", children: [
@@ -20257,6 +20473,7 @@ exports.CardTitle = CardTitle;
 exports.CategoryBadge = CategoryBadge;
 exports.CategoryTab = CategoryTab;
 exports.CategoryTabs = CategoryTabs;
+exports.ChartRenderer = ChartRenderer;
 exports.ChipPicker = ChipPicker;
 exports.CircularRefreshIndicator = CircularRefreshIndicator;
 exports.Code = Code;
@@ -20628,6 +20845,8 @@ exports.buttonTap = buttonTap;
 exports.cardHover = cardHover;
 exports.cardHoverReduced = cardHoverReduced;
 exports.cardPress = cardPress;
+exports.computeDomain = computeDomain;
+exports.computeSeries = computeSeries;
 exports.createMotionProps = createMotionProps;
 exports.durations = durations;
 exports.durationsReduced = durationsReduced;
@@ -20890,5 +21109,7 @@ exports.useGeoMapState = useGeoMapState;
 exports.useNotifications = useNotifications;
 exports.usePlatformShellStore = usePlatformShellStore;
 exports.usePullToRefresh = usePullToRefresh;
-//# sourceMappingURL=chunk-KEUOCEOO.js.map
-//# sourceMappingURL=chunk-KEUOCEOO.js.map
+exports.xScale = xScale;
+exports.yScale = yScale;
+//# sourceMappingURL=chunk-2BUYACAN.js.map
+//# sourceMappingURL=chunk-2BUYACAN.js.map