@cdx-ui/components 0.3.13 → 0.3.14

package/lib/typescript/components/BarChart/index.d.ts

@@ -57,14 +57,16 @@ export interface BarChartProps<TRow extends object = object> extends ViewProps,
     /**
      * Horizontal axis. In `vertical` layout it is the category (band) axis: `dataKey` names the
      * category column, `position` (`'bottom'`, `'top'`, `'none'`) places its labels, and
-     * `tickLabelInterval` picks which labels draw. In `horizontal` layout it is the value axis.
+     * `tickLabelInterval` picks which labels draw, and `tickLabelMaxLines` caps how far a long
+     * name wraps before it ends in `…`. In `horizontal` layout it is the value axis.
      * Only the first axis is used.
      */
     xAxis?: readonly ChartAxis<TRow>[];
     /**
      * Vertical axis. In `vertical` layout it is the value axis (`min`, `max`, `tickNumber`,
      * `valueFormatter`; `position: 'none'` hides its ticks). In `horizontal` layout it is the
-     * category axis (`position` `'left'`, `'right'`, or `'none'`). Only the first axis is used.
+     * category axis (`position` `'left'`, `'right'`, or `'none'`; `tickLabelMaxLines` as on
+     * `xAxis`). Only the first axis is used.
      */
     yAxis?: readonly ChartAxis<TRow>[];
     /**

package/lib/typescript/components/BarChart/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/BarChart/index.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/BarChart/index.tsx"],"names":[],"mappings":"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"}

package/lib/typescript/components/chart/types.d.ts

@@ -69,6 +69,13 @@ export interface ChartAxis<TRow> {
      * @default 'auto'
      */
     tickLabelInterval?: 'auto' | ((value: unknown, index: number) => boolean);
+    /**
+     * Most lines a category name may wrap onto before it ends in `…`. `1` truncates without
+     * wrapping. Read by `BarChart` on its category axis; a horizontal chart also stops at the
+     * lines its rows are tall enough to hold. Forge only; MUI X has no equivalent.
+     * @default 2
+     */
+    tickLabelMaxLines?: number;
 }
 export type ChartAxisPosition = 'top' | 'bottom' | 'left' | 'right' | 'none';
 /** Grid lines across the plot. A chart draws the lines that run along its value axis. */

package/lib/typescript/components/chart/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/chart/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/chart/types.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cdx-ui/components",
-  "version": "0.3.13",
+  "version": "0.3.14",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -106,10 +106,10 @@
     "@marceloterreiro/flash-calendar": "2.0.0",
     "react-native-reanimated-carousel": "5.0.0-beta.5",
     "uniwind": "1.12.2",
-    "@cdx-ui/formatters": "0.3.13",
-    "@cdx-ui/icons": "0.3.13",
-    "@cdx-ui/primitives": "0.3.13",
-    "@cdx-ui/utils": "0.3.13"
+    "@cdx-ui/primitives": "0.3.14",
+    "@cdx-ui/formatters": "0.3.14",
+    "@cdx-ui/icons": "0.3.14",
+    "@cdx-ui/utils": "0.3.14"
   },
   "devDependencies": {
     "@dnd-kit/core": "6.3.1",

package/src/components/BarChart/geometry.ts

@@ -74,6 +74,12 @@ export interface BarLabelAnchor {
   readonly textAnchor: 'start' | 'middle' | 'end';
 }
 
+/** A category name fitted to its slot. `y` is the first line; each next line sits one line lower. */
+export interface BarCategoryLabel extends BarLabelAnchor {
+  /** Up to two lines. The last line ends in `…` when the name did not fit. */
+  readonly lines: readonly string[];
+}
+
 export interface BarValueTick {
   readonly value: number;
   readonly x: number;
@@ -94,7 +100,7 @@ export interface BarReferenceLineLayout extends BarGridLine {
 
 export interface BarChartLayout {
   readonly bars: BarRect[];
-  readonly categoryLabels: BarLabelAnchor[];
+  readonly categoryLabels: BarCategoryLabel[];
   readonly valueTicks: BarValueTick[];
   readonly gridLines: BarGridLine[];
   readonly referenceLines: readonly BarReferenceLineLayout[];
@@ -373,6 +379,12 @@ function categoryLabelPadding(
 const CATEGORY_EDGE_GUTTER = 28;
 /** Average `text-xs` glyph width; SVG text cannot be measured before layout. */
 const CATEGORY_LABEL_CHAR_WIDTH = 6.5;
+/** Line pitch for a wrapped category name at `text-xs`. */
+export const CATEGORY_LABEL_LINE_HEIGHT = 14;
+/** Default for `ChartAxis.tickLabelMaxLines`. */
+export const CATEGORY_LABEL_MAX_LINES = 2;
+/** Space kept clear between neighboring category names. */
+const CATEGORY_LABEL_GAP = 4;
 const VALUE_TICK_LEFT = 40;
 const VALUE_TICK_END = 28;
 const TIGHT_GUTTER = 8;
@@ -383,6 +395,30 @@ const VALUES_TOP_GUTTER = 36;
 const PLOT_END_GUTTER = 20;
 const NEGATIVE_VALUES_GUTTER = 16;
 
+/**
+ * Breaks a category name into lines no wider than `maxWidth`, at word boundaries. Text that
+ * still does not fit in `maxLines` ends in `…`; the full name stays on the bar's accessibility
+ * label and tooltip.
+ */
+export function fitCategoryLabel(label: string, maxWidth: number, maxLines: number): string[] {
+  const perLine = Math.max(Math.floor(maxWidth / CATEGORY_LABEL_CHAR_WIDTH), 1);
+  if (label.length <= perLine) {
+    return [label];
+  }
+  const lines: string[] = [];
+  let rest = label.trim();
+  while (lines.length < maxLines - 1 && rest.length > perLine) {
+    const cut = rest.lastIndexOf(' ', perLine);
+    if (cut <= 0) {
+      break;
+    }
+    lines.push(rest.slice(0, cut).trimEnd());
+    rest = rest.slice(cut + 1).trimStart();
+  }
+  lines.push(rest.length <= perLine ? rest : `${rest.slice(0, perLine - 1).trimEnd()}…`);
+  return lines;
+}
+
 export function resolveCategoryLabelPosition(
   orientation: BarChartOrientation,
   position: BarChartCategoryLabelPosition | undefined,
@@ -919,6 +955,50 @@ export function barPath(bar: BarShape, orientation: BarChartOrientation, radius:
   return `M ${String(x2)} ${String(y)} L ${String(x2)} ${String(y2)} L ${String(x + r)} ${String(y2)} Q ${String(x)} ${String(y2)} ${String(x)} ${String(y2 - r)} L ${String(x)} ${String(y + r)} Q ${String(x)} ${String(y)} ${String(x + r)} ${String(y)} Z`;
 }
 
+/**
+ * Fits each shown category name to the room it has. Vertical names get their slot plus any
+ * empty slots up to the nearest shown neighbor, so thinned labels may spread wider. Horizontal
+ * names get the side gutter, and wrap only onto as many lines as the row is tall enough for.
+ */
+function fitCategoryLabels({
+  labels,
+  orientation,
+  position,
+  band,
+  sideGutter,
+  maxLines,
+}: {
+  readonly labels: readonly string[];
+  readonly orientation: BarChartOrientation;
+  readonly position: BarChartCategoryLabelPosition;
+  readonly band: number;
+  readonly sideGutter: number;
+  readonly maxLines: number;
+}): string[][] {
+  if (position === 'none') {
+    return labels.map((label) => [label]);
+  }
+  if (orientation === 'horizontal') {
+    const rowLines = clamp(Math.floor(band / CATEGORY_LABEL_LINE_HEIGHT), 1, maxLines);
+    // Labels sit 8px off the plot; keep 8px clear of the chart edge.
+    return labels.map((label) => fitCategoryLabel(label, sideGutter - 16, rowLines));
+  }
+  const shown = labels.flatMap((label, index) => (label.length > 0 ? [index] : []));
+  return labels.map((label, index) => {
+    if (label.length === 0) {
+      return [label];
+    }
+    const at = shown.indexOf(index);
+    const prev = at > 0 ? shown.at(at - 1) : undefined;
+    const next = shown.at(at + 1);
+    const slots = Math.min(
+      prev === undefined ? labels.length : index - prev,
+      next === undefined ? labels.length : next - index,
+    );
+    return fitCategoryLabel(label, band * slots - CATEGORY_LABEL_GAP, maxLines);
+  });
+}
+
 const EMPTY_LAYOUT: BarChartLayout = {
   bars: [],
   categoryLabels: [],
@@ -954,6 +1034,7 @@ export function layoutBarChart({
   categoryGapRatio = CATEGORY_GAP_RATIO,
   barGapRatio = BAR_GAP_RATIO,
   showCategoryLabel,
+  categoryLabelMaxLines,
 }: {
   readonly dataset: readonly object[];
   /** One name per row, from the category axis. Defaults to the row index. */
@@ -977,6 +1058,8 @@ export function layoutBarChart({
   readonly barGapRatio?: number;
   /** Keeps the category name at `index` when it returns `true`. Others draw no text. */
   readonly showCategoryLabel?: (index: number) => boolean;
+  /** Most lines per category name before `…`. Values below 1 or not whole read as the default. */
+  readonly categoryLabelMaxLines?: number;
 }): BarChartLayout {
   if (width <= 0 || height <= 0 || dataset.length === 0 || series.length === 0) {
     return EMPTY_LAYOUT;
@@ -1000,11 +1083,39 @@ export function layoutBarChart({
     showTicks,
     overlay,
   });
+  const categoryCount = dataset.length;
+  const plotWidth = Math.max(width - paddingLeft - paddingRight, 0);
+  const shownCategories = resolvedCategories.map((label, index) =>
+    showCategoryLabel === undefined || showCategoryLabel(index) ? label : '',
+  );
+  const labelLines = fitCategoryLabels({
+    labels: shownCategories,
+    orientation,
+    position: labels,
+    band:
+      orientation === 'vertical'
+        ? plotWidth / categoryCount
+        : Math.max(height - paddingTop - paddingBottom, 0) / categoryCount,
+    sideGutter: labels === 'right' ? paddingRight : paddingLeft,
+    maxLines:
+      categoryLabelMaxLines !== undefined &&
+      Number.isInteger(categoryLabelMaxLines) &&
+      categoryLabelMaxLines >= 1
+        ? categoryLabelMaxLines
+        : CATEGORY_LABEL_MAX_LINES,
+  });
+  // Vertical names that wrap get one more line of gutter on their side of the plot.
+  const wrapGutter =
+    orientation === 'vertical'
+      ? CATEGORY_LABEL_LINE_HEIGHT *
+        (labelLines.reduce((max, lines) => Math.max(max, lines.length), 1) - 1)
+      : 0;
+  const plotTop = paddingTop + (labels === 'top' ? wrapGutter : 0);
   const plot = {
     x: paddingLeft,
-    y: paddingTop,
-    width: Math.max(width - paddingLeft - paddingRight, 0),
-    height: Math.max(height - paddingTop - paddingBottom, 0),
+    y: plotTop,
+    width: plotWidth,
+    height: Math.max(height - plotTop - paddingBottom - (labels === 'bottom' ? wrapGutter : 0), 0),
   };
 
   const waterfallSeries = series.at(0);
@@ -1025,7 +1136,6 @@ export function layoutBarChart({
   const domainMin = scale.min;
   const domainMax = scale.max;
   const span = domainMax - domainMin || 1;
-  const categoryCount = dataset.length;
   const slotCount = overlay || waterfall ? 1 : groups.length;
   const band =
     orientation === 'vertical' ? plot.width / categoryCount : plot.height / categoryCount;
@@ -1046,18 +1156,20 @@ export function layoutBarChart({
   const valueToX = (value: number) => plot.x + plot.width * toPlot(value);
 
   const bars: BarRect[] = [];
-  const categoryLabels: BarLabelAnchor[] = [];
+  const categoryLabels: BarCategoryLabel[] = [];
   const connectors: BarGridLine[] = [];
   let waterfallCursor = 0;
   let waterfallPrev: { readonly bar: BarRect; readonly total: number } | null = null;
 
   dataset.forEach((row, index) => {
     const label = categoryOf(index);
-    const shownLabel = showCategoryLabel === undefined || showCategoryLabel(index) ? label : '';
+    const shownLabel = shownCategories[index] ?? '';
+    const lines = labelLines[index] ?? [shownLabel];
     // With `none`, category names still reach the tooltip and screen readers through the bars.
     if (labels !== 'none' && orientation === 'vertical') {
       const center = plot.x + index * band + band / 2;
-      const halfWidth = (shownLabel.length * CATEGORY_LABEL_CHAR_WIDTH) / 2;
+      const widest = lines.reduce((max, line) => Math.max(max, line.length), 0);
+      const halfWidth = (widest * CATEGORY_LABEL_CHAR_WIDTH) / 2;
       const anchor =
         center - halfWidth < plot.x
           ? { x: plot.x, textAnchor: 'start' as const }
@@ -1066,15 +1178,19 @@ export function layoutBarChart({
             : { x: center, textAnchor: 'middle' as const };
       categoryLabels.push({
         label: shownLabel,
+        lines,
         x: round2(anchor.x),
-        y: round2(labels === 'top' ? paddingTop / 2 : height - 8),
+        y: round2(labels === 'top' ? paddingTop / 2 : height - 8 - wrapGutter),
         textAnchor: anchor.textAnchor,
       });
     } else if (labels !== 'none') {
       categoryLabels.push({
         label: shownLabel,
+        lines,
         x: round2(labels === 'right' ? plot.x + plot.width + 8 : plot.x - 8),
-        y: round2(plot.y + index * band + band / 2),
+        y: round2(
+          plot.y + index * band + band / 2 - ((lines.length - 1) * CATEGORY_LABEL_LINE_HEIGHT) / 2,
+        ),
         textAnchor: labels === 'right' ? 'start' : 'end',
       });
     }

package/src/components/BarChart/index.tsx

@@ -73,6 +73,7 @@ import {
 import {
   BAR_GAP_RATIO,
   CATEGORY_GAP_RATIO,
+  CATEGORY_LABEL_LINE_HEIGHT,
   barKeyboardNeighbor,
   barPath,
   barValueAnchor,
@@ -169,14 +170,16 @@ export interface BarChartProps<TRow extends object = object> extends ViewProps,
   /**
    * Horizontal axis. In `vertical` layout it is the category (band) axis: `dataKey` names the
    * category column, `position` (`'bottom'`, `'top'`, `'none'`) places its labels, and
-   * `tickLabelInterval` picks which labels draw. In `horizontal` layout it is the value axis.
+   * `tickLabelInterval` picks which labels draw, and `tickLabelMaxLines` caps how far a long
+   * name wraps before it ends in `…`. In `horizontal` layout it is the value axis.
    * Only the first axis is used.
    */
   xAxis?: readonly ChartAxis<TRow>[];
   /**
    * Vertical axis. In `vertical` layout it is the value axis (`min`, `max`, `tickNumber`,
    * `valueFormatter`; `position: 'none'` hides its ticks). In `horizontal` layout it is the
-   * category axis (`position` `'left'`, `'right'`, or `'none'`). Only the first axis is used.
+   * category axis (`position` `'left'`, `'right'`, or `'none'`; `tickLabelMaxLines` as on
+   * `xAxis`). Only the first axis is used.
    */
   yAxis?: readonly ChartAxis<TRow>[];
   /**
@@ -426,6 +429,7 @@ function BarChartInner<TRow extends object>(
       ? true
       : (orientation === 'vertical' ? grid.horizontal : grid.vertical) === true;
   const tickLabelInterval = categoryAxis?.tickLabelInterval;
+  const tickLabelMaxLines = categoryAxis?.tickLabelMaxLines;
   const categories = useMemo(
     () =>
       dataset.map((row, index) => {
@@ -555,6 +559,7 @@ function BarChartInner<TRow extends object>(
         categoryGapRatio,
         barGapRatio,
         showCategoryLabel,
+        categoryLabelMaxLines: tickLabelMaxLines,
       }),
     [
       dataset,
@@ -575,6 +580,7 @@ function BarChartInner<TRow extends object>(
       categoryGapRatio,
       barGapRatio,
       showCategoryLabel,
+      tickLabelMaxLines,
     ],
   );
   const overflowsX = content.width > viewportWidth + 0.5;
@@ -1050,20 +1056,22 @@ function BarPlot({
           />
         );
       })}
-      {layout.categoryLabels.map((item, index) => (
-        <SvgText
-          key={`cat-${String(index)}-${item.label}`}
-          x={item.x}
-          y={item.y}
-          fill={chrome.label}
-          fontFamily={chrome.fontFamily}
-          fontSize={chrome.labelSize}
-          textAnchor={item.textAnchor}
-          alignmentBaseline="middle"
-        >
-          {item.label}
-        </SvgText>
-      ))}
+      {layout.categoryLabels.flatMap((item, index) =>
+        item.lines.map((line, lineIndex) => (
+          <SvgText
+            key={`cat-${String(index)}-${String(lineIndex)}-${item.label}`}
+            x={item.x}
+            y={item.y + lineIndex * CATEGORY_LABEL_LINE_HEIGHT}
+            fill={chrome.label}
+            fontFamily={chrome.fontFamily}
+            fontSize={chrome.labelSize}
+            textAnchor={item.textAnchor}
+            alignmentBaseline="middle"
+          >
+            {line}
+          </SvgText>
+        )),
+      )}
       {barLabel ? (
         <ValueLabels
           animated={animated}

package/src/components/chart/types.ts

@@ -79,6 +79,13 @@ export interface ChartAxis<TRow> {
    * @default 'auto'
    */
   tickLabelInterval?: 'auto' | ((value: unknown, index: number) => boolean);
+  /**
+   * Most lines a category name may wrap onto before it ends in `…`. `1` truncates without
+   * wrapping. Read by `BarChart` on its category axis; a horizontal chart also stops at the
+   * lines its rows are tall enough to hold. Forge only; MUI X has no equivalent.
+   * @default 2
+   */
+  tickLabelMaxLines?: number;
 }
 
 export type ChartAxisPosition = 'top' | 'bottom' | 'left' | 'right' | 'none';