@datatechsolutions/ui 2.11.51 → 2.11.53

package/dist/astrlabe/workflow-canvas.js

@@ -1,11 +1,11 @@
 "use client";
 'use strict';
 
-var chunkVZHQMOVM_js = require('../chunk-VZHQMOVM.js');
-require('../chunk-2IOPJ5BM.js');
-require('../chunk-UZ3CMNUJ.js');
+var chunk7LCEP4X5_js = require('../chunk-7LCEP4X5.js');
+require('../chunk-5N6QYUAA.js');
 require('../chunk-YXN2K77G.js');
 require('../chunk-S7KHTUHA.js');
+require('../chunk-UZ3CMNUJ.js');
 require('../chunk-P4YYEM4B.js');
 require('../chunk-PWBWP5FJ.js');
 
@@ -13,7 +13,7 @@ require('../chunk-PWBWP5FJ.js');
 
 Object.defineProperty(exports, "Workspace", {
   enumerable: true,
-  get: function () { return chunkVZHQMOVM_js.Workspace; }
+  get: function () { return chunk7LCEP4X5_js.Workspace; }
 });
 //# sourceMappingURL=workflow-canvas.js.map
 //# sourceMappingURL=workflow-canvas.js.map

package/dist/astrlabe/workflow-canvas.mjs

@@ -1,9 +1,9 @@
 "use client";
-export { Workspace } from '../chunk-XRTBXSQY.mjs';
-import '../chunk-MDD6H63O.mjs';
-import '../chunk-D2JF6C3E.mjs';
+export { Workspace } from '../chunk-PEBQWL6R.mjs';
+import '../chunk-GWLWSE2C.mjs';
 import '../chunk-7VJ7CMMT.mjs';
 import '../chunk-QWG2FMUN.mjs';
+import '../chunk-D2JF6C3E.mjs';
 import '../chunk-OZNTQROP.mjs';
 import '../chunk-TLPPVL3W.mjs';
 //# sourceMappingURL=workflow-canvas.mjs.map

package/dist/{chunk-2IOPJ5BM.js → chunk-5N6QYUAA.js}

@@ -1,9 +1,9 @@
 "use client";
 'use strict';
 
-var chunkUZ3CMNUJ_js = require('./chunk-UZ3CMNUJ.js');
 var chunkYXN2K77G_js = require('./chunk-YXN2K77G.js');
 var chunkS7KHTUHA_js = require('./chunk-S7KHTUHA.js');
+var chunkUZ3CMNUJ_js = require('./chunk-UZ3CMNUJ.js');
 var Headless6 = require('@headlessui/react');
 var clsx = require('clsx');
 var React12 = require('react');
@@ -2032,6 +2032,359 @@ 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 DashboardView({ spec, className }) {
+  const layout = spec.layout ?? "grid";
+  const hasCharts = (spec.charts?.length ?? 0) > 0;
+  const chartGrid = layout === "grid" && (spec.charts?.length ?? 0) > 1 ? "grid grid-cols-1 gap-4 lg:grid-cols-2" : "grid grid-cols-1 gap-4";
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: className ?? "space-y-6", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("header", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-xl font-semibold text-slate-900 dark:text-slate-100", children: spec.title }),
+      spec.subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-sm text-slate-500 dark:text-slate-400", children: spec.subtitle })
+    ] }),
+    spec.kpis && spec.kpis.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+      "section",
+      {
+        className: spec.kpis.length > 3 ? "grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4" : "grid grid-cols-1 gap-3 sm:grid-cols-3",
+        children: spec.kpis.map((kpi, index) => /* @__PURE__ */ jsxRuntime.jsx(KpiCard, { kpi }, `${kpi.label}-${index}`))
+      }
+    ),
+    hasCharts && /* @__PURE__ */ jsxRuntime.jsx("section", { className: chartGrid, children: spec.charts?.map((chart, index) => /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "rounded-xl border border-zinc-950/10 bg-white p-4 dark:border-white/10 dark:bg-zinc-900",
+        children: /* @__PURE__ */ jsxRuntime.jsx(ChartRenderer, { spec: chart })
+      },
+      `${chart.title}-${index}`
+    )) }),
+    spec.table && spec.table.rows.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("section", { className: "rounded-xl border border-zinc-950/10 bg-white dark:border-white/10 dark:bg-zinc-900", children: [
+      spec.table.title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "border-b border-zinc-950/10 px-5 py-3 text-sm font-semibold text-slate-900 dark:border-white/10 dark:text-slate-100", children: spec.table.title }),
+      /* @__PURE__ */ jsxRuntime.jsx(DashboardTableView, { table: spec.table })
+    ] }),
+    spec.recommendation && spec.recommendation.trim().length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("section", { className: "rounded-xl border border-indigo-500/20 bg-indigo-500/5 p-4 dark:border-indigo-400/30 dark:bg-indigo-500/10", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-sm font-semibold text-indigo-700 dark:text-indigo-300", children: "Recommendation" }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-sm text-indigo-900 dark:text-indigo-100", children: spec.recommendation })
+    ] }),
+    spec.meta && Object.keys(spec.meta).length > 0 && /* @__PURE__ */ jsxRuntime.jsx("footer", { className: "flex flex-wrap gap-4 text-[10px] text-slate-400 dark:text-slate-500", children: Object.entries(spec.meta).map(([key, value]) => /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold uppercase tracking-wide", children: key }),
+      ": ",
+      value
+    ] }, key)) })
+  ] });
+}
+function KpiCard({ kpi }) {
+  const value = typeof kpi.value === "number" ? formatNumber(kpi.value) : kpi.value;
+  const displayValue = kpi.unit ? `${value}${kpi.unit}` : value;
+  const variant = kpi.tone ?? "default";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    MetricCard,
+    {
+      title: kpi.label,
+      value: displayValue,
+      variant,
+      trend: kpi.deltaPct !== void 0 ? { value: kpi.deltaPct } : void 0
+    }
+  );
+}
+function DashboardTableView({ table }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("table", { className: "min-w-full divide-y divide-zinc-200 text-sm dark:divide-zinc-700", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("thead", { className: "bg-zinc-50 dark:bg-zinc-800/50", children: /* @__PURE__ */ jsxRuntime.jsx("tr", { children: table.columns.map((column) => /* @__PURE__ */ jsxRuntime.jsx(
+      "th",
+      {
+        scope: "col",
+        className: `px-4 py-2 text-xs font-medium uppercase tracking-wide text-slate-500 dark:text-slate-400 ${columnAlign(column.align)}`,
+        children: column.label
+      },
+      column.key
+    )) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("tbody", { className: "divide-y divide-zinc-100 dark:divide-zinc-800", children: table.rows.map((row, rowIndex) => /* @__PURE__ */ jsxRuntime.jsx("tr", { className: "hover:bg-zinc-50/70 dark:hover:bg-zinc-800/30", children: table.columns.map((column) => {
+      const raw = row[column.key] ?? "";
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        "td",
+        {
+          className: `px-4 py-2 text-slate-700 dark:text-slate-300 ${columnAlign(column.align)}`,
+          children: formatCell(raw, column.format)
+        },
+        column.key
+      );
+    }) }, rowIndex)) })
+  ] }) });
+}
+function columnAlign(align) {
+  if (align === "right") return "text-right";
+  if (align === "center") return "text-center";
+  return "text-left";
+}
+function formatCell(value, format3) {
+  if (value === null || value === void 0 || value === "") return "\u2014";
+  if (format3 === "currency" && typeof value === "number") {
+    return new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" }).format(value);
+  }
+  if (format3 === "percent" && typeof value === "number") {
+    return `${(value * 100).toFixed(1)}%`;
+  }
+  if (format3 === "number" && typeof value === "number") {
+    return formatNumber(value);
+  }
+  return String(value);
+}
+function formatNumber(value) {
+  if (Math.abs(value) >= 1e3) return new Intl.NumberFormat("en-US").format(Math.round(value));
+  return value.toFixed(Math.abs(value) < 10 ? 2 : 1);
+}
+
+// src/types/dashboard-spec.ts
+function validateDashboardSpec(spec) {
+  const issues = [];
+  const hasCharts = (spec.charts?.length ?? 0) > 0;
+  const hasKpis = (spec.kpis?.length ?? 0) > 0;
+  const hasTable = (spec.table?.rows.length ?? 0) > 0;
+  const hasRecommendation = Boolean(spec.recommendation?.trim());
+  if (!hasCharts && !hasKpis && !hasTable && !hasRecommendation) {
+    issues.push({ kind: "empty", message: "Dashboard has no content (no charts, KPIs, table, or recommendation)." });
+  }
+  spec.charts?.forEach((chart, chartIndex) => {
+    if (chart.series.length === 0) {
+      issues.push({
+        kind: "chartSeriesMissing",
+        chartIndex,
+        message: `Chart "${chart.title}" has no series.`
+      });
+    }
+  });
+  if (spec.table) {
+    const columnKeys = new Set(spec.table.columns.map((column) => column.key));
+    const reported = /* @__PURE__ */ new Set();
+    for (const row of spec.table.rows) {
+      for (const key of Object.keys(row)) {
+        if (!columnKeys.has(key) && !reported.has(key)) {
+          reported.add(key);
+          issues.push({
+            kind: "tableColumnMissing",
+            column: key,
+            message: `Table row references column "${key}" not declared in columns.`
+          });
+        }
+      }
+    }
+  }
+  return issues;
+}
 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 +20610,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;
@@ -20272,6 +20626,7 @@ exports.CountPill = CountPill;
 exports.CreateActionButton = CreateActionButton;
 exports.DE_THEME_CONFIG = DE_THEME_CONFIG;
 exports.DashboardProgressShell = DashboardProgressShell;
+exports.DashboardView = DashboardView;
 exports.DataPagination = DataPagination;
 exports.DatePicker = DatePicker;
 exports.DeleteSwipeAction = DeleteSwipeAction;
@@ -20628,6 +20983,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 +21247,8 @@ exports.useGeoMapState = useGeoMapState;
 exports.useNotifications = useNotifications;
 exports.usePlatformShellStore = usePlatformShellStore;
 exports.usePullToRefresh = usePullToRefresh;
-//# sourceMappingURL=chunk-2IOPJ5BM.js.map
-//# sourceMappingURL=chunk-2IOPJ5BM.js.map
+exports.validateDashboardSpec = validateDashboardSpec;
+exports.xScale = xScale;
+exports.yScale = yScale;
+//# sourceMappingURL=chunk-5N6QYUAA.js.map
+//# sourceMappingURL=chunk-5N6QYUAA.js.map