@shapesos/clay 0.15.0 → 0.17.0
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.
- package/README.md +14 -0
- package/dist/artifacts.cjs +52 -23
- package/dist/artifacts.cjs.map +1 -1
- package/dist/artifacts.js +2 -2
- package/dist/blocks.cjs +52 -23
- package/dist/blocks.cjs.map +1 -1
- package/dist/blocks.css +1 -1
- package/dist/blocks.js +3 -3
- package/dist/chart.cjs +52 -23
- package/dist/chart.cjs.map +1 -1
- package/dist/chart.d.cts +8 -14
- package/dist/chart.d.ts +8 -14
- package/dist/chart.js +1 -1
- package/dist/chat.cjs +52 -23
- package/dist/chat.cjs.map +1 -1
- package/dist/chat.js +4 -4
- package/dist/{chunk-MDAWYZBI.js → chunk-46ZYTBX5.js} +2 -2
- package/dist/{chunk-XFJ6XMJZ.js → chunk-6YZ65KPW.js} +2 -2
- package/dist/{chunk-3THOTQO3.js → chunk-B6GAPZ2R.js} +3 -3
- package/dist/{chunk-YZB6YXKK.js → chunk-PUVZ2S3F.js} +56 -27
- package/dist/chunk-PUVZ2S3F.js.map +1 -0
- package/dist/index.cjs +52 -23
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +4 -4
- package/package.json +1 -1
- package/dist/chunk-YZB6YXKK.js.map +0 -1
- /package/dist/{chunk-MDAWYZBI.js.map → chunk-46ZYTBX5.js.map} +0 -0
- /package/dist/{chunk-XFJ6XMJZ.js.map → chunk-6YZ65KPW.js.map} +0 -0
- /package/dist/{chunk-3THOTQO3.js.map → chunk-B6GAPZ2R.js.map} +0 -0
package/dist/chat.cjs
CHANGED
|
@@ -1298,6 +1298,11 @@ var CHART_PALETTE = [
|
|
|
1298
1298
|
];
|
|
1299
1299
|
var OTHERS_SLICE_COLOR = colors["brown-60"];
|
|
1300
1300
|
var DEFAULT_OTHERS_CATEGORY_LABELS = ["others", "other"];
|
|
1301
|
+
var NONE_CATEGORY_VALUES = ["", "(none)", "none", "null", "undefined", "n/a", "-"];
|
|
1302
|
+
function isNoneCategory(value) {
|
|
1303
|
+
if (value === null || value === void 0) return true;
|
|
1304
|
+
return NONE_CATEGORY_VALUES.includes(String(value).trim().toLowerCase());
|
|
1305
|
+
}
|
|
1301
1306
|
function isOthersCategory(value, labels) {
|
|
1302
1307
|
if (value === null || value === void 0) return false;
|
|
1303
1308
|
if (labels.length === 0) return false;
|
|
@@ -1353,6 +1358,13 @@ function truncateLabel(value, maxChars) {
|
|
|
1353
1358
|
if (s.length <= maxChars) return s;
|
|
1354
1359
|
return s.slice(0, Math.max(1, maxChars - 1)).trimEnd() + "\u2026";
|
|
1355
1360
|
}
|
|
1361
|
+
var compactNumberFormat = new Intl.NumberFormat("en-US", { notation: "compact", maximumFractionDigits: 1 });
|
|
1362
|
+
function compactNumberTickFormatter(value) {
|
|
1363
|
+
if (value === null || value === void 0) return "";
|
|
1364
|
+
const n = typeof value === "number" ? value : Number(value);
|
|
1365
|
+
if (!Number.isFinite(n)) return String(value);
|
|
1366
|
+
return compactNumberFormat.format(n);
|
|
1367
|
+
}
|
|
1356
1368
|
function evenlyDistributedVisibleIndices(n, target) {
|
|
1357
1369
|
if (n <= target) {
|
|
1358
1370
|
return new Set(Array.from({ length: n }, (_, i) => i));
|
|
@@ -1406,7 +1418,6 @@ function BarChart({
|
|
|
1406
1418
|
showGrid = true,
|
|
1407
1419
|
showXAxis = true,
|
|
1408
1420
|
showYAxis = true,
|
|
1409
|
-
showValueLabels,
|
|
1410
1421
|
xAxisInterval = 0,
|
|
1411
1422
|
xAxisAngle,
|
|
1412
1423
|
xAxisTickFormatter
|
|
@@ -1417,7 +1428,6 @@ function BarChart({
|
|
|
1417
1428
|
[data, seriesKeys]
|
|
1418
1429
|
);
|
|
1419
1430
|
const resolvedShowLegend = showLegend ?? series.length > 1;
|
|
1420
|
-
const resolvedShowValueLabels = showValueLabels ?? (!stacked && series.length === 1);
|
|
1421
1431
|
const resolvedAngle = xAxisAngle ?? (coercedData.length >= 8 ? -30 : 0);
|
|
1422
1432
|
const resolvedTickFormatter = (0, import_react9.useMemo)(
|
|
1423
1433
|
() => xAxisTickFormatter ?? defaultBarTickFormatter(coercedData.length),
|
|
@@ -1440,7 +1450,7 @@ function BarChart({
|
|
|
1440
1450
|
tickFormatter: resolvedTickFormatter
|
|
1441
1451
|
}
|
|
1442
1452
|
) : null,
|
|
1443
|
-
showYAxis ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_recharts2.YAxis, { ...CHART_AXIS_PROPS, width: 40 }) : null,
|
|
1453
|
+
showYAxis ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_recharts2.YAxis, { ...CHART_AXIS_PROPS, width: 40, tickFormatter: compactNumberTickFormatter }) : null,
|
|
1444
1454
|
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,
|
|
1445
1455
|
resolvedShowLegend ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1446
1456
|
import_recharts2.Legend,
|
|
@@ -1459,8 +1469,7 @@ function BarChart({
|
|
|
1459
1469
|
name: s.label,
|
|
1460
1470
|
fill: colorForSeriesIndex(i, palette),
|
|
1461
1471
|
stackId: stacked ? "default" : s.key,
|
|
1462
|
-
radius: barRadius(stacked, i, series.length)
|
|
1463
|
-
children: resolvedShowValueLabels ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_recharts2.LabelList, { dataKey: s.key, position: "top", style: CHART_VALUE_LABEL_STYLE }) : null
|
|
1472
|
+
radius: barRadius(stacked, i, series.length)
|
|
1464
1473
|
},
|
|
1465
1474
|
s.key
|
|
1466
1475
|
))
|
|
@@ -1579,7 +1588,7 @@ function LineChart({
|
|
|
1579
1588
|
tickFormatter: resolvedTickFormatter
|
|
1580
1589
|
}
|
|
1581
1590
|
) : null,
|
|
1582
|
-
showYAxis ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_recharts3.YAxis, { ...CHART_AXIS_PROPS, width: 40 }) : null,
|
|
1591
|
+
showYAxis ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_recharts3.YAxis, { ...CHART_AXIS_PROPS, width: 40, tickFormatter: compactNumberTickFormatter }) : null,
|
|
1583
1592
|
showTooltip ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_recharts3.Tooltip, { content: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ChartTooltipContent, {}) }) : null,
|
|
1584
1593
|
resolvedShowLegend ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
1585
1594
|
import_recharts3.Legend,
|
|
@@ -1637,6 +1646,42 @@ var LineChartVariantService = {
|
|
|
1637
1646
|
// src/components/chart/pie-chart/pie-chart.tsx
|
|
1638
1647
|
var import_react11 = require("react");
|
|
1639
1648
|
var import_recharts4 = require("recharts");
|
|
1649
|
+
|
|
1650
|
+
// src/components/chart/pie-chart/utils.ts
|
|
1651
|
+
function mergedOthersLabel(leftoverRows, categoryKey, othersCategoryLabels) {
|
|
1652
|
+
const explicit = leftoverRows.find((row) => isOthersCategory(row[categoryKey], othersCategoryLabels));
|
|
1653
|
+
if (explicit) return String(explicit[categoryKey]);
|
|
1654
|
+
const fallback = othersCategoryLabels[0] ?? "Other";
|
|
1655
|
+
return fallback.charAt(0).toUpperCase() + fallback.slice(1);
|
|
1656
|
+
}
|
|
1657
|
+
function buildPieSlices(data, categoryKey, valueKey, othersCategoryLabels, palette) {
|
|
1658
|
+
const namedRows = [];
|
|
1659
|
+
const namedColors = [];
|
|
1660
|
+
const leftoverRows = [];
|
|
1661
|
+
for (const row of data) {
|
|
1662
|
+
const isLeftover = othersCategoryLabels.length > 0 && (isNoneCategory(row[categoryKey]) || isOthersCategory(row[categoryKey], othersCategoryLabels));
|
|
1663
|
+
if (isLeftover) {
|
|
1664
|
+
leftoverRows.push(row);
|
|
1665
|
+
} else {
|
|
1666
|
+
namedRows.push(row);
|
|
1667
|
+
namedColors.push(colorForSeriesIndex(namedRows.length - 1, palette));
|
|
1668
|
+
}
|
|
1669
|
+
}
|
|
1670
|
+
if (leftoverRows.length === 0) {
|
|
1671
|
+
return { orderedData: namedRows, sliceColors: namedColors };
|
|
1672
|
+
}
|
|
1673
|
+
const total = leftoverRows.reduce((sum, row) => sum + (Number(row[valueKey]) || 0), 0);
|
|
1674
|
+
const mergedRow = {
|
|
1675
|
+
[categoryKey]: mergedOthersLabel(leftoverRows, categoryKey, othersCategoryLabels),
|
|
1676
|
+
[valueKey]: total
|
|
1677
|
+
};
|
|
1678
|
+
return {
|
|
1679
|
+
orderedData: [...namedRows, mergedRow],
|
|
1680
|
+
sliceColors: [...namedColors, OTHERS_SLICE_COLOR]
|
|
1681
|
+
};
|
|
1682
|
+
}
|
|
1683
|
+
|
|
1684
|
+
// src/components/chart/pie-chart/pie-chart.tsx
|
|
1640
1685
|
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
1641
1686
|
function PieChart({
|
|
1642
1687
|
data,
|
|
@@ -1655,23 +1700,7 @@ function PieChart({
|
|
|
1655
1700
|
}) {
|
|
1656
1701
|
const { orderedData, sliceColors } = (0, import_react11.useMemo)(() => {
|
|
1657
1702
|
const coerced = coerceNumericColumns(data, [valueKey]);
|
|
1658
|
-
|
|
1659
|
-
const namedColors = [];
|
|
1660
|
-
const othersRows = [];
|
|
1661
|
-
const othersColors = [];
|
|
1662
|
-
for (const row of coerced) {
|
|
1663
|
-
if (isOthersCategory(row[categoryKey], othersCategoryLabels)) {
|
|
1664
|
-
othersRows.push(row);
|
|
1665
|
-
othersColors.push(OTHERS_SLICE_COLOR);
|
|
1666
|
-
} else {
|
|
1667
|
-
namedRows.push(row);
|
|
1668
|
-
namedColors.push(colorForSeriesIndex(namedRows.length - 1, palette));
|
|
1669
|
-
}
|
|
1670
|
-
}
|
|
1671
|
-
return {
|
|
1672
|
-
orderedData: [...namedRows, ...othersRows],
|
|
1673
|
-
sliceColors: [...namedColors, ...othersColors]
|
|
1674
|
-
};
|
|
1703
|
+
return buildPieSlices(coerced, categoryKey, valueKey, othersCategoryLabels, palette);
|
|
1675
1704
|
}, [data, valueKey, categoryKey, othersCategoryLabels, palette]);
|
|
1676
1705
|
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: [
|
|
1677
1706
|
showTooltip ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_recharts4.Tooltip, { content: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ChartTooltipContent, {}) }) : null,
|