@shapesos/clay 0.15.0 → 0.17.0

package/dist/artifacts.js

@@ -11,11 +11,11 @@ import {
   artifactToClipboardText,
   artifactTypes,
   isSafeDownloadUrl
-} from "./chunk-XFJ6XMJZ.js";
+} from "./chunk-6YZ65KPW.js";
 import "./chunk-PYDVANWI.js";
 import "./chunk-LXYCT4YO.js";
 import "./chunk-OLJIJYB5.js";
-import "./chunk-YZB6YXKK.js";
+import "./chunk-PUVZ2S3F.js";
 import "./chunk-C77QMQNT.js";
 import "./chunk-UXT2H3FM.js";
 import "./chunk-JF3P66JF.js";

package/dist/blocks.cjs

@@ -1289,6 +1289,11 @@ var CHART_PALETTE = [
 ];
 var OTHERS_SLICE_COLOR = colors["brown-60"];
 var DEFAULT_OTHERS_CATEGORY_LABELS = ["others", "other"];
+var NONE_CATEGORY_VALUES = ["", "(none)", "none", "null", "undefined", "n/a", "-"];
+function isNoneCategory(value) {
+  if (value === null || value === void 0) return true;
+  return NONE_CATEGORY_VALUES.includes(String(value).trim().toLowerCase());
+}
 function isOthersCategory(value, labels) {
   if (value === null || value === void 0) return false;
   if (labels.length === 0) return false;
@@ -1344,6 +1349,13 @@ function truncateLabel(value, maxChars) {
   if (s.length <= maxChars) return s;
   return s.slice(0, Math.max(1, maxChars - 1)).trimEnd() + "\u2026";
 }
+var compactNumberFormat = new Intl.NumberFormat("en-US", { notation: "compact", maximumFractionDigits: 1 });
+function compactNumberTickFormatter(value) {
+  if (value === null || value === void 0) return "";
+  const n = typeof value === "number" ? value : Number(value);
+  if (!Number.isFinite(n)) return String(value);
+  return compactNumberFormat.format(n);
+}
 function evenlyDistributedVisibleIndices(n, target) {
   if (n <= target) {
     return new Set(Array.from({ length: n }, (_, i) => i));
@@ -1397,7 +1409,6 @@ function BarChart({
   showGrid = true,
   showXAxis = true,
   showYAxis = true,
-  showValueLabels,
   xAxisInterval = 0,
   xAxisAngle,
   xAxisTickFormatter
@@ -1408,7 +1419,6 @@ function BarChart({
     [data, seriesKeys]
   );
   const resolvedShowLegend = showLegend ?? series.length > 1;
-  const resolvedShowValueLabels = showValueLabels ?? (!stacked && series.length === 1);
   const resolvedAngle = xAxisAngle ?? (coercedData.length >= 8 ? -30 : 0);
   const resolvedTickFormatter = (0, import_react9.useMemo)(
     () => xAxisTickFormatter ?? defaultBarTickFormatter(coercedData.length),
@@ -1431,7 +1441,7 @@ function BarChart({
         tickFormatter: resolvedTickFormatter
       }
     ) : null,
-    showYAxis ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_recharts2.YAxis, { ...CHART_AXIS_PROPS, width: 40 }) : null,
+    showYAxis ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_recharts2.YAxis, { ...CHART_AXIS_PROPS, width: 40, tickFormatter: compactNumberTickFormatter }) : null,
     showTooltip ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_recharts2.Tooltip, { cursor: { fill: BAR_TOOLTIP_CURSOR_FILL }, content: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ChartTooltipContent, {}) }) : null,
     resolvedShowLegend ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
       import_recharts2.Legend,
@@ -1450,8 +1460,7 @@ function BarChart({
         name: s.label,
         fill: colorForSeriesIndex(i, palette),
         stackId: stacked ? "default" : s.key,
-        radius: barRadius(stacked, i, series.length),
-        children: resolvedShowValueLabels ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_recharts2.LabelList, { dataKey: s.key, position: "top", style: CHART_VALUE_LABEL_STYLE }) : null
+        radius: barRadius(stacked, i, series.length)
       },
       s.key
     ))
@@ -1570,7 +1579,7 @@ function LineChart({
         tickFormatter: resolvedTickFormatter
       }
     ) : null,
-    showYAxis ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_recharts3.YAxis, { ...CHART_AXIS_PROPS, width: 40 }) : null,
+    showYAxis ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_recharts3.YAxis, { ...CHART_AXIS_PROPS, width: 40, tickFormatter: compactNumberTickFormatter }) : null,
     showTooltip ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_recharts3.Tooltip, { content: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ChartTooltipContent, {}) }) : null,
     resolvedShowLegend ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
       import_recharts3.Legend,
@@ -1628,6 +1637,42 @@ var LineChartVariantService = {
 // src/components/chart/pie-chart/pie-chart.tsx
 var import_react11 = require("react");
 var import_recharts4 = require("recharts");
+
+// src/components/chart/pie-chart/utils.ts
+function mergedOthersLabel(leftoverRows, categoryKey, othersCategoryLabels) {
+  const explicit = leftoverRows.find((row) => isOthersCategory(row[categoryKey], othersCategoryLabels));
+  if (explicit) return String(explicit[categoryKey]);
+  const fallback = othersCategoryLabels[0] ?? "Other";
+  return fallback.charAt(0).toUpperCase() + fallback.slice(1);
+}
+function buildPieSlices(data, categoryKey, valueKey, othersCategoryLabels, palette) {
+  const namedRows = [];
+  const namedColors = [];
+  const leftoverRows = [];
+  for (const row of data) {
+    const isLeftover = othersCategoryLabels.length > 0 && (isNoneCategory(row[categoryKey]) || isOthersCategory(row[categoryKey], othersCategoryLabels));
+    if (isLeftover) {
+      leftoverRows.push(row);
+    } else {
+      namedRows.push(row);
+      namedColors.push(colorForSeriesIndex(namedRows.length - 1, palette));
+    }
+  }
+  if (leftoverRows.length === 0) {
+    return { orderedData: namedRows, sliceColors: namedColors };
+  }
+  const total = leftoverRows.reduce((sum, row) => sum + (Number(row[valueKey]) || 0), 0);
+  const mergedRow = {
+    [categoryKey]: mergedOthersLabel(leftoverRows, categoryKey, othersCategoryLabels),
+    [valueKey]: total
+  };
+  return {
+    orderedData: [...namedRows, mergedRow],
+    sliceColors: [...namedColors, OTHERS_SLICE_COLOR]
+  };
+}
+
+// src/components/chart/pie-chart/pie-chart.tsx
 var import_jsx_runtime16 = require("react/jsx-runtime");
 function PieChart({
   data,
@@ -1646,23 +1691,7 @@ function PieChart({
 }) {
   const { orderedData, sliceColors } = (0, import_react11.useMemo)(() => {
     const coerced = coerceNumericColumns(data, [valueKey]);
-    const namedRows = [];
-    const namedColors = [];
-    const othersRows = [];
-    const othersColors = [];
-    for (const row of coerced) {
-      if (isOthersCategory(row[categoryKey], othersCategoryLabels)) {
-        othersRows.push(row);
-        othersColors.push(OTHERS_SLICE_COLOR);
-      } else {
-        namedRows.push(row);
-        namedColors.push(colorForSeriesIndex(namedRows.length - 1, palette));
-      }
-    }
-    return {
-      orderedData: [...namedRows, ...othersRows],
-      sliceColors: [...namedColors, ...othersColors]
-    };
+    return buildPieSlices(coerced, categoryKey, valueKey, othersCategoryLabels, palette);
   }, [data, valueKey, categoryKey, othersCategoryLabels, palette]);
   return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ChartContainer, { height, width, className, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_recharts4.PieChart, { margin: PIE_CHART_MARGIN, children: [
     showTooltip ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_recharts4.Tooltip, { content: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ChartTooltipContent, {}) }) : null,