npm - @mastra/playground-ui - Versions diffs - 40.0.0 → 40.0.1-alpha.1 - Mend

@mastra/playground-ui 40.0.0 → 40.0.1-alpha.1

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 (35) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -1,5 +1,25 @@
 # @mastra/playground-ui
+## 40.0.1-alpha.1
+### Patch Changes
+- Fixed signal details pages so their sidebars can scroll within the Studio route, removed the scatter plot tab, and cleaned up unused signal points APIs. ([#19005](https://github.com/mastra-ai/mastra/pull/19005))
+- Updated dependencies [[`e8eaf3a`](https://github.com/mastra-ai/mastra/commit/e8eaf3aea09d51c131b5d369aee459442f416efc), [`d1c930f`](https://github.com/mastra-ai/mastra/commit/d1c930f713d1de09d5f3cd665cb79a8b7ebd7ec7), [`02634f7`](https://github.com/mastra-ai/mastra/commit/02634f700051e014a125d0d10165e3c9b8414e95)]:
+  - @mastra/core@1.50.1-alpha.1
+  - @mastra/client-js@1.31.1-alpha.1
+  - @mastra/react@1.2.4-alpha.1
+## 40.0.1-alpha.0
+### Patch Changes
+- Updated dependencies [[`e900f25`](https://github.com/mastra-ai/mastra/commit/e900f25dfe2c9237f15b26cb109ac55aa9de3000)]:
+  - @mastra/core@1.50.1-alpha.0
+  - @mastra/client-js@1.31.1-alpha.0
+  - @mastra/react@1.2.4-alpha.0
 ## 40.0.0
 ### Patch Changes

package/dist/components/ScatterPlotChart.cjs.js CHANGED Viewed

@@ -2,13 +2,170 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-const scatterPlotChart = require('../scatter-plot-chart-CFZO31md.cjs');
+const jsxRuntime = require('react/jsx-runtime');
+const recharts = require('recharts');
+const spacings = require('../spacings-BP8L49kn.cjs');
+const utils_cn = require('../cn-vA5sWo9W.cjs');
+function ScatterPlotChartTooltip({
+  active,
+  payload,
+  xKey,
+  yKey,
+  nameKey,
+  formatX,
+  formatY,
+  formatTooltipLabel
+}) {
+  const point = payload?.[0]?.payload;
+  if (!active || !point) return null;
+  const label = formatTooltipLabel?.(point) ?? (nameKey ? point[nameKey] : void 0);
+  const xValue = point[xKey];
+  const yValue = point[yKey];
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-md border border-border1 bg-surface2 px-3 py-2 text-xs shadow-lg", children: [
+    label !== void 0 && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-1 font-medium text-icon6", children: String(label) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-1 text-icon2", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-neutral3", children: "X:" }),
+        " ",
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono", children: formatX ? formatX(xValue, point) : String(xValue) })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-neutral3", children: "Y:" }),
+        " ",
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono", children: formatY ? formatY(yValue, point) : String(yValue) })
+      ] })
+    ] })
+  ] });
+}
+function getScatterPlotPointColor(point, colorKey) {
+  const color = colorKey ? point[colorKey] : void 0;
+  return typeof color === "string" && color.length > 0 ? color : spacings.Colors.accent3;
+}
+function getScatterPlotClickedPoint(payload) {
+  return payload?.payload;
+}
+function formatScatterPlotAxisTick(value, formatter) {
+  return (formatter?.(value, {}) ?? String(value)).replace(/\s+/g, " ");
+}
-exports.ScatterPlotChart = scatterPlotChart.ScatterPlotChart;
-exports.ScatterPlotChartTooltip = scatterPlotChart.ScatterPlotChartTooltip;
-exports.formatScatterPlotAxisTick = scatterPlotChart.formatScatterPlotAxisTick;
-exports.getScatterPlotClickedPoint = scatterPlotChart.getScatterPlotClickedPoint;
-exports.getScatterPlotPointColor = scatterPlotChart.getScatterPlotPointColor;
+const LABEL_COLOR = "#a1a1aa";
+const DEFAULT_POINT_SIZE = 48;
+const CHART_MARGIN = { top: 16, right: 16, bottom: 16, left: 16 };
+function ScatterPlotChart({
+  data,
+  xKey,
+  yKey,
+  nameKey,
+  colorKey,
+  height = 210,
+  xLabel,
+  yLabel,
+  xDomain,
+  yDomain,
+  formatX,
+  formatY,
+  formatTooltipLabel,
+  onPointClick,
+  className
+}) {
+  const isClickable = typeof onPointClick === "function";
+  const fillsContainer = height === "100%";
+  if (data.length === 0) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: utils_cn.cn(
+          "flex items-center justify-center rounded-md border border-border1 text-ui-sm text-neutral3",
+          className
+        ),
+        style: { height },
+        children: "No data to display"
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils_cn.cn(fillsContainer && "flex h-full min-h-0 flex-col", className), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils_cn.cn(fillsContainer && "min-h-0 flex-1"), style: { height: fillsContainer ? void 0 : height }, children: /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(recharts.ScatterChart, { data, margin: CHART_MARGIN, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(recharts.CartesianGrid, { stroke: spacings.Colors.neutral3, strokeDasharray: "4 4", strokeOpacity: 0.18, vertical: false }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      recharts.XAxis,
+      {
+        dataKey: xKey,
+        name: xLabel,
+        type: "number",
+        tick: { fontSize: 10, fill: LABEL_COLOR, fontFamily: "var(--font-mono)" },
+        tickLine: false,
+        axisLine: false,
+        domain: xDomain,
+        tickFormatter: (value) => formatScatterPlotAxisTick(value, formatX)
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      recharts.YAxis,
+      {
+        dataKey: yKey,
+        name: yLabel,
+        type: "number",
+        tick: { fontSize: 10, fill: LABEL_COLOR, fontFamily: "var(--font-mono)" },
+        tickLine: false,
+        axisLine: false,
+        width: 44,
+        domain: yDomain,
+        tickFormatter: (value) => formatScatterPlotAxisTick(value, formatY)
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(recharts.ZAxis, { range: [DEFAULT_POINT_SIZE, DEFAULT_POINT_SIZE] }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      recharts.Tooltip,
+      {
+        cursor: { stroke: spacings.Colors.neutral3, strokeOpacity: 0.16 },
+        content: /* @__PURE__ */ jsxRuntime.jsx(
+          ScatterPlotChartTooltip,
+          {
+            xKey,
+            yKey,
+            nameKey,
+            formatX,
+            formatY,
+            formatTooltipLabel
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      recharts.Scatter,
+      {
+        data,
+        fill: spacings.Colors.accent3,
+        shape: (props) => {
+          const point = props.payload ?? {};
+          const cx = props.cx;
+          const cy = props.cy;
+          if (typeof cx !== "number" || typeof cy !== "number") return /* @__PURE__ */ jsxRuntime.jsx("g", {});
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            "circle",
+            {
+              cx,
+              cy,
+              r: 4,
+              fill: getScatterPlotPointColor(point, colorKey),
+              opacity: 0.9,
+              style: { cursor: isClickable ? "pointer" : void 0 }
+            }
+          );
+        },
+        onClick: (_, payload) => {
+          const point = getScatterPlotClickedPoint(payload);
+          if (point) onPointClick?.(point);
+        }
+      }
+    )
+  ] }) }) }) });
+}
+exports.ScatterPlotChart = ScatterPlotChart;
+exports.ScatterPlotChartTooltip = ScatterPlotChartTooltip;
+exports.formatScatterPlotAxisTick = formatScatterPlotAxisTick;
+exports.getScatterPlotClickedPoint = getScatterPlotClickedPoint;
+exports.getScatterPlotPointColor = getScatterPlotPointColor;
 //# sourceMappingURL=ScatterPlotChart.cjs.js.map

package/dist/components/ScatterPlotChart.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ScatterPlotChart.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}
1	+ {"version":3,"file":"ScatterPlotChart.cjs.js","sources":["../../src/ds/components/ScatterPlotChart/scatter-plot-chart-tooltip.tsx","../../src/ds/components/ScatterPlotChart/scatter-plot-chart-utils.ts","../../src/ds/components/ScatterPlotChart/scatter-plot-chart.tsx"],"sourcesContent":["import type { ScatterPlotChartFormatter } from './scatter-plot-chart';\n\ntype ScatterTooltipPayload = Array<{\n color?: string;\n payload?: Record<string, unknown>;\n}>;\n\nexport function ScatterPlotChartTooltip({\n active,\n payload,\n xKey,\n yKey,\n nameKey,\n formatX,\n formatY,\n formatTooltipLabel,\n}: {\n active?: boolean;\n payload?: ScatterTooltipPayload;\n xKey: string;\n yKey: string;\n nameKey?: string;\n formatX?: ScatterPlotChartFormatter;\n formatY?: ScatterPlotChartFormatter;\n formatTooltipLabel?: (point: Record<string, unknown>) => string;\n}) {\n const point = payload?.[0]?.payload;\n if (!active \|\| !point) return null;\n\n const label = formatTooltipLabel?.(point) ?? (nameKey ? point[nameKey] : undefined);\n const xValue = point[xKey];\n const yValue = point[yKey];\n\n return (\n <div className=\"rounded-md border border-border1 bg-surface2 px-3 py-2 text-xs shadow-lg\">\n {label !== undefined && <p className=\"mb-1 font-medium text-icon6\">{String(label)}</p>}\n <div className=\"grid gap-1 text-icon2\">\n <p>\n <span className=\"text-neutral3\">X:</span>{' '}\n <span className=\"font-mono\">{formatX ? formatX(xValue, point) : String(xValue)}</span>\n </p>\n <p>\n <span className=\"text-neutral3\">Y:</span>{' '}\n <span className=\"font-mono\">{formatY ? formatY(yValue, point) : String(yValue)}</span>\n </p>\n </div>\n </div>\n );\n}\n","import type { ScatterPlotChartFormatter } from './scatter-plot-chart';\nimport { Colors } from '@/ds/tokens';\n\nexport function getScatterPlotPointColor(point: Record<string, unknown>, colorKey?: string) {\n const color = colorKey ? point[colorKey] : undefined;\n return typeof color === 'string' && color.length > 0 ? color : Colors.accent3;\n}\n\nexport function getScatterPlotClickedPoint(payload: unknown) {\n return (payload as { payload?: Record<string, unknown> } \| undefined)?.payload;\n}\n\nexport function formatScatterPlotAxisTick(value: unknown, formatter?: ScatterPlotChartFormatter) {\n return (formatter?.(value, {}) ?? String(value)).replace(/\\s+/g, '\\u00A0');\n}\n","import { CartesianGrid, ResponsiveContainer, Scatter, ScatterChart, Tooltip, XAxis, YAxis, ZAxis } from 'recharts';\nimport { ScatterPlotChartTooltip } from './scatter-plot-chart-tooltip';\nimport {\n formatScatterPlotAxisTick,\n getScatterPlotClickedPoint,\n getScatterPlotPointColor,\n} from './scatter-plot-chart-utils';\nimport { Colors } from '@/ds/tokens';\nimport { cn } from '@/lib/utils';\n\nconst LABEL_COLOR = '#a1a1aa';\nconst DEFAULT_POINT_SIZE = 48;\nconst CHART_MARGIN = { top: 16, right: 16, bottom: 16, left: 16 };\n\nexport type ScatterPlotChartDomain = [number \| 'auto', number \| 'auto'];\nexport type ScatterPlotChartFormatter = (value: unknown, point: Record<string, unknown>) => string;\nexport type ScatterPlotChartPointClickHandler = (point: Record<string, unknown>) => void;\n\nexport type ScatterPlotChartProps = {\n data: Array<Record<string, unknown>>;\n xKey: string;\n yKey: string;\n nameKey?: string;\n colorKey?: string;\n height?: React.CSSProperties['height'];\n xLabel?: string;\n yLabel?: string;\n xDomain?: ScatterPlotChartDomain;\n yDomain?: ScatterPlotChartDomain;\n formatX?: ScatterPlotChartFormatter;\n formatY?: ScatterPlotChartFormatter;\n formatTooltipLabel?: (point: Record<string, unknown>) => string;\n onPointClick?: ScatterPlotChartPointClickHandler;\n className?: string;\n};\n\nexport function ScatterPlotChart({\n data,\n xKey,\n yKey,\n nameKey,\n colorKey,\n height = 210,\n xLabel,\n yLabel,\n xDomain,\n yDomain,\n formatX,\n formatY,\n formatTooltipLabel,\n onPointClick,\n className,\n}: ScatterPlotChartProps) {\n const isClickable = typeof onPointClick === 'function';\n const fillsContainer = height === '100%';\n\n if (data.length === 0) {\n return (\n <div\n className={cn(\n 'flex items-center justify-center rounded-md border border-border1 text-ui-sm text-neutral3',\n className,\n )}\n style={{ height }}\n >\n No data to display\n </div>\n );\n }\n\n return (\n <div className={cn(fillsContainer && 'flex h-full min-h-0 flex-col', className)}>\n <div className={cn(fillsContainer && 'min-h-0 flex-1')} style={{ height: fillsContainer ? undefined : height }}>\n <ResponsiveContainer width=\"100%\" height=\"100%\">\n <ScatterChart data={data} margin={CHART_MARGIN}>\n <CartesianGrid stroke={Colors.neutral3} strokeDasharray=\"4 4\" strokeOpacity={0.18} vertical={false} />\n <XAxis\n dataKey={xKey}\n name={xLabel}\n type=\"number\"\n tick={{ fontSize: 10, fill: LABEL_COLOR, fontFamily: 'var(--font-mono)' }}\n tickLine={false}\n axisLine={false}\n domain={xDomain}\n tickFormatter={value => formatScatterPlotAxisTick(value, formatX)}\n />\n <YAxis\n dataKey={yKey}\n name={yLabel}\n type=\"number\"\n tick={{ fontSize: 10, fill: LABEL_COLOR, fontFamily: 'var(--font-mono)' }}\n tickLine={false}\n axisLine={false}\n width={44}\n domain={yDomain}\n tickFormatter={value => formatScatterPlotAxisTick(value, formatY)}\n />\n <ZAxis range={[DEFAULT_POINT_SIZE, DEFAULT_POINT_SIZE]} />\n <Tooltip\n cursor={{ stroke: Colors.neutral3, strokeOpacity: 0.16 }}\n content={\n <ScatterPlotChartTooltip\n xKey={xKey}\n yKey={yKey}\n nameKey={nameKey}\n formatX={formatX}\n formatY={formatY}\n formatTooltipLabel={formatTooltipLabel}\n />\n }\n />\n <Scatter\n data={data}\n fill={Colors.accent3}\n shape={(props: unknown) => {\n const point = (props as { payload?: Record<string, unknown> }).payload ?? {};\n const cx = (props as { cx?: number }).cx;\n const cy = (props as { cy?: number }).cy;\n if (typeof cx !== 'number' \|\| typeof cy !== 'number') return <g />;\n return (\n <circle\n cx={cx}\n cy={cy}\n r={4}\n fill={getScatterPlotPointColor(point, colorKey)}\n opacity={0.9}\n style={{ cursor: isClickable ? 'pointer' : undefined }}\n />\n );\n }}\n onClick={(_: unknown, payload: unknown) => {\n const point = getScatterPlotClickedPoint(payload);\n if (point) onPointClick?.(point);\n }}\n />\n </ScatterChart>\n </ResponsiveContainer>\n </div>\n </div>\n );\n}\n"],"names":["jsxs","jsx","Colors","cn","ResponsiveContainer","ScatterChart","CartesianGrid","XAxis","YAxis","ZAxis","Tooltip","Scatter"],"mappings":"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"}

package/dist/components/ScatterPlotChart.es.js CHANGED Viewed

@@ -1,2 +1,163 @@
-export { S as ScatterPlotChart, a as ScatterPlotChartTooltip, f as formatScatterPlotAxisTick, g as getScatterPlotClickedPoint, b as getScatterPlotPointColor } from '../scatter-plot-chart-B3hfFMKS.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { ResponsiveContainer, ScatterChart, CartesianGrid, XAxis, YAxis, ZAxis, Tooltip, Scatter } from 'recharts';
+import { C as Colors } from '../spacings-C87dXiT-.js';
+import { c as cn } from '../cn-BakJzhuv.js';
+function ScatterPlotChartTooltip({
+  active,
+  payload,
+  xKey,
+  yKey,
+  nameKey,
+  formatX,
+  formatY,
+  formatTooltipLabel
+}) {
+  const point = payload?.[0]?.payload;
+  if (!active || !point) return null;
+  const label = formatTooltipLabel?.(point) ?? (nameKey ? point[nameKey] : void 0);
+  const xValue = point[xKey];
+  const yValue = point[yKey];
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-md border border-border1 bg-surface2 px-3 py-2 text-xs shadow-lg", children: [
+    label !== void 0 && /* @__PURE__ */ jsx("p", { className: "mb-1 font-medium text-icon6", children: String(label) }),
+    /* @__PURE__ */ jsxs("div", { className: "grid gap-1 text-icon2", children: [
+      /* @__PURE__ */ jsxs("p", { children: [
+        /* @__PURE__ */ jsx("span", { className: "text-neutral3", children: "X:" }),
+        " ",
+        /* @__PURE__ */ jsx("span", { className: "font-mono", children: formatX ? formatX(xValue, point) : String(xValue) })
+      ] }),
+      /* @__PURE__ */ jsxs("p", { children: [
+        /* @__PURE__ */ jsx("span", { className: "text-neutral3", children: "Y:" }),
+        " ",
+        /* @__PURE__ */ jsx("span", { className: "font-mono", children: formatY ? formatY(yValue, point) : String(yValue) })
+      ] })
+    ] })
+  ] });
+}
+function getScatterPlotPointColor(point, colorKey) {
+  const color = colorKey ? point[colorKey] : void 0;
+  return typeof color === "string" && color.length > 0 ? color : Colors.accent3;
+}
+function getScatterPlotClickedPoint(payload) {
+  return payload?.payload;
+}
+function formatScatterPlotAxisTick(value, formatter) {
+  return (formatter?.(value, {}) ?? String(value)).replace(/\s+/g, " ");
+}
+const LABEL_COLOR = "#a1a1aa";
+const DEFAULT_POINT_SIZE = 48;
+const CHART_MARGIN = { top: 16, right: 16, bottom: 16, left: 16 };
+function ScatterPlotChart({
+  data,
+  xKey,
+  yKey,
+  nameKey,
+  colorKey,
+  height = 210,
+  xLabel,
+  yLabel,
+  xDomain,
+  yDomain,
+  formatX,
+  formatY,
+  formatTooltipLabel,
+  onPointClick,
+  className
+}) {
+  const isClickable = typeof onPointClick === "function";
+  const fillsContainer = height === "100%";
+  if (data.length === 0) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "flex items-center justify-center rounded-md border border-border1 text-ui-sm text-neutral3",
+          className
+        ),
+        style: { height },
+        children: "No data to display"
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx("div", { className: cn(fillsContainer && "flex h-full min-h-0 flex-col", className), children: /* @__PURE__ */ jsx("div", { className: cn(fillsContainer && "min-h-0 flex-1"), style: { height: fillsContainer ? void 0 : height }, children: /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxs(ScatterChart, { data, margin: CHART_MARGIN, children: [
+    /* @__PURE__ */ jsx(CartesianGrid, { stroke: Colors.neutral3, strokeDasharray: "4 4", strokeOpacity: 0.18, vertical: false }),
+    /* @__PURE__ */ jsx(
+      XAxis,
+      {
+        dataKey: xKey,
+        name: xLabel,
+        type: "number",
+        tick: { fontSize: 10, fill: LABEL_COLOR, fontFamily: "var(--font-mono)" },
+        tickLine: false,
+        axisLine: false,
+        domain: xDomain,
+        tickFormatter: (value) => formatScatterPlotAxisTick(value, formatX)
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      YAxis,
+      {
+        dataKey: yKey,
+        name: yLabel,
+        type: "number",
+        tick: { fontSize: 10, fill: LABEL_COLOR, fontFamily: "var(--font-mono)" },
+        tickLine: false,
+        axisLine: false,
+        width: 44,
+        domain: yDomain,
+        tickFormatter: (value) => formatScatterPlotAxisTick(value, formatY)
+      }
+    ),
+    /* @__PURE__ */ jsx(ZAxis, { range: [DEFAULT_POINT_SIZE, DEFAULT_POINT_SIZE] }),
+    /* @__PURE__ */ jsx(
+      Tooltip,
+      {
+        cursor: { stroke: Colors.neutral3, strokeOpacity: 0.16 },
+        content: /* @__PURE__ */ jsx(
+          ScatterPlotChartTooltip,
+          {
+            xKey,
+            yKey,
+            nameKey,
+            formatX,
+            formatY,
+            formatTooltipLabel
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Scatter,
+      {
+        data,
+        fill: Colors.accent3,
+        shape: (props) => {
+          const point = props.payload ?? {};
+          const cx = props.cx;
+          const cy = props.cy;
+          if (typeof cx !== "number" || typeof cy !== "number") return /* @__PURE__ */ jsx("g", {});
+          return /* @__PURE__ */ jsx(
+            "circle",
+            {
+              cx,
+              cy,
+              r: 4,
+              fill: getScatterPlotPointColor(point, colorKey),
+              opacity: 0.9,
+              style: { cursor: isClickable ? "pointer" : void 0 }
+            }
+          );
+        },
+        onClick: (_, payload) => {
+          const point = getScatterPlotClickedPoint(payload);
+          if (point) onPointClick?.(point);
+        }
+      }
+    )
+  ] }) }) }) });
+}
+export { ScatterPlotChart, ScatterPlotChartTooltip, formatScatterPlotAxisTick, getScatterPlotClickedPoint, getScatterPlotPointColor };
 //# sourceMappingURL=ScatterPlotChart.es.js.map

package/dist/components/ScatterPlotChart.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ScatterPlotChart.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
1	+ {"version":3,"file":"ScatterPlotChart.es.js","sources":["../../src/ds/components/ScatterPlotChart/scatter-plot-chart-tooltip.tsx","../../src/ds/components/ScatterPlotChart/scatter-plot-chart-utils.ts","../../src/ds/components/ScatterPlotChart/scatter-plot-chart.tsx"],"sourcesContent":["import type { ScatterPlotChartFormatter } from './scatter-plot-chart';\n\ntype ScatterTooltipPayload = Array<{\n color?: string;\n payload?: Record<string, unknown>;\n}>;\n\nexport function ScatterPlotChartTooltip({\n active,\n payload,\n xKey,\n yKey,\n nameKey,\n formatX,\n formatY,\n formatTooltipLabel,\n}: {\n active?: boolean;\n payload?: ScatterTooltipPayload;\n xKey: string;\n yKey: string;\n nameKey?: string;\n formatX?: ScatterPlotChartFormatter;\n formatY?: ScatterPlotChartFormatter;\n formatTooltipLabel?: (point: Record<string, unknown>) => string;\n}) {\n const point = payload?.[0]?.payload;\n if (!active \|\| !point) return null;\n\n const label = formatTooltipLabel?.(point) ?? (nameKey ? point[nameKey] : undefined);\n const xValue = point[xKey];\n const yValue = point[yKey];\n\n return (\n <div className=\"rounded-md border border-border1 bg-surface2 px-3 py-2 text-xs shadow-lg\">\n {label !== undefined && <p className=\"mb-1 font-medium text-icon6\">{String(label)}</p>}\n <div className=\"grid gap-1 text-icon2\">\n <p>\n <span className=\"text-neutral3\">X:</span>{' '}\n <span className=\"font-mono\">{formatX ? formatX(xValue, point) : String(xValue)}</span>\n </p>\n <p>\n <span className=\"text-neutral3\">Y:</span>{' '}\n <span className=\"font-mono\">{formatY ? formatY(yValue, point) : String(yValue)}</span>\n </p>\n </div>\n </div>\n );\n}\n","import type { ScatterPlotChartFormatter } from './scatter-plot-chart';\nimport { Colors } from '@/ds/tokens';\n\nexport function getScatterPlotPointColor(point: Record<string, unknown>, colorKey?: string) {\n const color = colorKey ? point[colorKey] : undefined;\n return typeof color === 'string' && color.length > 0 ? color : Colors.accent3;\n}\n\nexport function getScatterPlotClickedPoint(payload: unknown) {\n return (payload as { payload?: Record<string, unknown> } \| undefined)?.payload;\n}\n\nexport function formatScatterPlotAxisTick(value: unknown, formatter?: ScatterPlotChartFormatter) {\n return (formatter?.(value, {}) ?? String(value)).replace(/\\s+/g, '\\u00A0');\n}\n","import { CartesianGrid, ResponsiveContainer, Scatter, ScatterChart, Tooltip, XAxis, YAxis, ZAxis } from 'recharts';\nimport { ScatterPlotChartTooltip } from './scatter-plot-chart-tooltip';\nimport {\n formatScatterPlotAxisTick,\n getScatterPlotClickedPoint,\n getScatterPlotPointColor,\n} from './scatter-plot-chart-utils';\nimport { Colors } from '@/ds/tokens';\nimport { cn } from '@/lib/utils';\n\nconst LABEL_COLOR = '#a1a1aa';\nconst DEFAULT_POINT_SIZE = 48;\nconst CHART_MARGIN = { top: 16, right: 16, bottom: 16, left: 16 };\n\nexport type ScatterPlotChartDomain = [number \| 'auto', number \| 'auto'];\nexport type ScatterPlotChartFormatter = (value: unknown, point: Record<string, unknown>) => string;\nexport type ScatterPlotChartPointClickHandler = (point: Record<string, unknown>) => void;\n\nexport type ScatterPlotChartProps = {\n data: Array<Record<string, unknown>>;\n xKey: string;\n yKey: string;\n nameKey?: string;\n colorKey?: string;\n height?: React.CSSProperties['height'];\n xLabel?: string;\n yLabel?: string;\n xDomain?: ScatterPlotChartDomain;\n yDomain?: ScatterPlotChartDomain;\n formatX?: ScatterPlotChartFormatter;\n formatY?: ScatterPlotChartFormatter;\n formatTooltipLabel?: (point: Record<string, unknown>) => string;\n onPointClick?: ScatterPlotChartPointClickHandler;\n className?: string;\n};\n\nexport function ScatterPlotChart({\n data,\n xKey,\n yKey,\n nameKey,\n colorKey,\n height = 210,\n xLabel,\n yLabel,\n xDomain,\n yDomain,\n formatX,\n formatY,\n formatTooltipLabel,\n onPointClick,\n className,\n}: ScatterPlotChartProps) {\n const isClickable = typeof onPointClick === 'function';\n const fillsContainer = height === '100%';\n\n if (data.length === 0) {\n return (\n <div\n className={cn(\n 'flex items-center justify-center rounded-md border border-border1 text-ui-sm text-neutral3',\n className,\n )}\n style={{ height }}\n >\n No data to display\n </div>\n );\n }\n\n return (\n <div className={cn(fillsContainer && 'flex h-full min-h-0 flex-col', className)}>\n <div className={cn(fillsContainer && 'min-h-0 flex-1')} style={{ height: fillsContainer ? undefined : height }}>\n <ResponsiveContainer width=\"100%\" height=\"100%\">\n <ScatterChart data={data} margin={CHART_MARGIN}>\n <CartesianGrid stroke={Colors.neutral3} strokeDasharray=\"4 4\" strokeOpacity={0.18} vertical={false} />\n <XAxis\n dataKey={xKey}\n name={xLabel}\n type=\"number\"\n tick={{ fontSize: 10, fill: LABEL_COLOR, fontFamily: 'var(--font-mono)' }}\n tickLine={false}\n axisLine={false}\n domain={xDomain}\n tickFormatter={value => formatScatterPlotAxisTick(value, formatX)}\n />\n <YAxis\n dataKey={yKey}\n name={yLabel}\n type=\"number\"\n tick={{ fontSize: 10, fill: LABEL_COLOR, fontFamily: 'var(--font-mono)' }}\n tickLine={false}\n axisLine={false}\n width={44}\n domain={yDomain}\n tickFormatter={value => formatScatterPlotAxisTick(value, formatY)}\n />\n <ZAxis range={[DEFAULT_POINT_SIZE, DEFAULT_POINT_SIZE]} />\n <Tooltip\n cursor={{ stroke: Colors.neutral3, strokeOpacity: 0.16 }}\n content={\n <ScatterPlotChartTooltip\n xKey={xKey}\n yKey={yKey}\n nameKey={nameKey}\n formatX={formatX}\n formatY={formatY}\n formatTooltipLabel={formatTooltipLabel}\n />\n }\n />\n <Scatter\n data={data}\n fill={Colors.accent3}\n shape={(props: unknown) => {\n const point = (props as { payload?: Record<string, unknown> }).payload ?? {};\n const cx = (props as { cx?: number }).cx;\n const cy = (props as { cy?: number }).cy;\n if (typeof cx !== 'number' \|\| typeof cy !== 'number') return <g />;\n return (\n <circle\n cx={cx}\n cy={cy}\n r={4}\n fill={getScatterPlotPointColor(point, colorKey)}\n opacity={0.9}\n style={{ cursor: isClickable ? 'pointer' : undefined }}\n />\n );\n }}\n onClick={(_: unknown, payload: unknown) => {\n const point = getScatterPlotClickedPoint(payload);\n if (point) onPointClick?.(point);\n }}\n />\n </ScatterChart>\n </ResponsiveContainer>\n </div>\n </div>\n );\n}\n"],"names":[],"mappings":"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"}