@opendata-ai/openchart-core 6.23.1 → 6.24.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opendata-ai/openchart-core",
-  "version": "6.23.1",
+  "version": "6.24.0",
   "description": "Types, theme, colors, accessibility, and utilities for openchart",
   "license": "Apache-2.0",
   "author": "Riley Hilliard",

package/src/index.ts

@@ -56,6 +56,7 @@ export {
   BRAND_FONT_SIZE,
   BRAND_MIN_WIDTH,
   BRAND_RESERVE_WIDTH,
+  COMPACT_WIDTH,
   computeChrome,
   estimateTextWidth,
   wrapText,

package/src/layout/chrome.ts

@@ -26,6 +26,7 @@ import {
   BRAND_FONT_SIZE,
   BRAND_MIN_WIDTH,
   BRAND_RESERVE_WIDTH,
+  COMPACT_WIDTH,
   estimateCharWidth,
   estimateTextHeight,
 } from './text-measure';
@@ -236,9 +237,12 @@ export function computeChrome(
     topY += estimateTextHeight(style.fontSize, lineCount, style.lineHeight) + chromeGap;
   }
 
-  // Add chromeToChart gap if there are any top elements
+  // Add chromeToChart gap if there are any top elements. Tighten on narrow
+  // viewports so the subtitle doesn't float far above a legend or chart area.
   const hasTopChrome = titleNorm || subtitleNorm;
-  const topHeight = hasTopChrome ? topY - pad + theme.spacing.chromeToChart - chromeGap : 0;
+  const chromeToChart =
+    width < COMPACT_WIDTH ? Math.min(theme.spacing.chromeToChart, 2) : theme.spacing.chromeToChart;
+  const topHeight = hasTopChrome ? topY - pad + chromeToChart - chromeGap : 0;
 
   // Bottom chrome text hidden in compact mode, but brand watermark still
   // renders for wide-enough charts. Reserve space so it doesn't overflow.

package/src/layout/index.ts

@@ -7,6 +7,7 @@ export {
   BRAND_FONT_SIZE,
   BRAND_MIN_WIDTH,
   BRAND_RESERVE_WIDTH,
+  COMPACT_WIDTH,
   estimateCharWidth,
   estimateTextHeight,
   estimateTextWidth,

package/src/layout/text-measure.ts

@@ -73,6 +73,16 @@ export const BRAND_FONT_SIZE = 12;
 /** Minimum chart width to render the brand watermark (px). */
 export const BRAND_MIN_WIDTH = 120;
 
+// ---------------------------------------------------------------------------
+// Responsive breakpoints
+// ---------------------------------------------------------------------------
+
+/**
+ * Width threshold below which layout tightens spacing (legend gaps, chrome
+ * padding, label gaps) to maximize data area on small screens.
+ */
+export const COMPACT_WIDTH = 420;
+
 /**
  * Estimate the rendered height of a text block.
  *

package/src/layout/text-wrap.ts

@@ -6,8 +6,8 @@
  * accurate wrapping. Otherwise falls back to a character-width
  * heuristic driven by `estimateCharWidth` from text-measure.ts.
  *
- * Callers that want heuristic-only behavior (e.g. sankey) should omit
- * the measureText argument. Do not change the signature without
+ * Non-browser callers (SSR, tests) omit the measureText argument to
+ * use the heuristic fallback. Do not change the signature without
  * re-verifying visual baselines for every caller.
  */
 

package/src/types/layout.ts

@@ -1030,6 +1030,8 @@ export interface SankeyLayout {
   animation?: ResolvedAnimation;
   /** Whether the tryOpenData.ai watermark is enabled. */
   watermark: boolean;
+  /** Real text measurement function from the adapter (for accurate SVG text wrapping). */
+  measureText?: MeasureTextFn;
 }
 
 // ---------------------------------------------------------------------------