@opendata-ai/openchart-engine 6.28.2 → 6.28.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opendata-ai/openchart-engine",
-  "version": "6.28.2",
+  "version": "6.28.5",
   "description": "Headless compiler for openchart: spec validation, data compilation, scales, and layout",
   "license": "Apache-2.0",
   "author": "Riley Hilliard",
@@ -48,7 +48,7 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@opendata-ai/openchart-core": "6.28.2",
+    "@opendata-ai/openchart-core": "6.28.5",
     "d3-array": "^3.2.0",
     "d3-format": "^3.1.2",
     "d3-interpolate": "^3.0.0",

package/src/tables/__tests__/heatmap.test.ts

@@ -112,6 +112,49 @@ describe('computeHeatmapColors', () => {
     }
   });
 
+  it('high values are more visually prominent than low values in both modes', () => {
+    const col: ColumnConfig = {
+      key: 'value',
+      heatmap: { palette: ['#fca5a5', '#c44e52'], domain: [0, 100] },
+    };
+    const lightTheme = getTheme(false);
+    const darkTheme = getTheme(true);
+    const lightColors = computeHeatmapColors(data, col, lightTheme, false);
+    const darkColors = computeHeatmapColors(data, col, darkTheme, true);
+
+    const lightLowBg = lightColors.get(0)!.backgroundColor!;
+    const lightHighBg = lightColors.get(4)!.backgroundColor!;
+    const darkLowBg = darkColors.get(0)!.backgroundColor!;
+    const darkHighBg = darkColors.get(4)!.backgroundColor!;
+
+    expect(lightLowBg).not.toBe(lightHighBg);
+    expect(darkLowBg).not.toBe(darkHighBg);
+
+    function parseLum(color: string): number {
+      const rgbMatch = /rgb\(\s*(\d+),\s*(\d+),\s*(\d+)\s*\)/.exec(color);
+      if (rgbMatch) {
+        const [r, g, b] = [rgbMatch[1], rgbMatch[2], rgbMatch[3]].map((c) => {
+          const v = Number(c) / 255;
+          return v <= 0.03928 ? v / 12.92 : ((v + 0.055) / 1.055) ** 2.4;
+        });
+        return 0.2126 * r + 0.7152 * g + 0.0722 * b;
+      }
+      const hexMatch = /^#?([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})$/i.exec(color);
+      if (!hexMatch) return 0;
+      const [r, g, b] = [hexMatch[1], hexMatch[2], hexMatch[3]].map((c) => {
+        const v = Number.parseInt(c, 16) / 255;
+        return v <= 0.03928 ? v / 12.92 : ((v + 0.055) / 1.055) ** 2.4;
+      });
+      return 0.2126 * r + 0.7152 * g + 0.0722 * b;
+    }
+
+    // Light mode: high values get darker/more saturated bg (lower luminance = more prominent)
+    expect(parseLum(lightLowBg)).toBeGreaterThan(parseLum(lightHighBg));
+
+    // Dark mode: high values get brighter bg (higher luminance = more prominent on dark bg)
+    expect(parseLum(darkHighBg)).toBeGreaterThan(parseLum(darkLowBg));
+  });
+
   it('supports array of color stops as palette', () => {
     const col: ColumnConfig = {
       key: 'value',

package/src/tilemap/__tests__/compile-tilemap.test.ts

@@ -297,18 +297,20 @@ describe('compileTileMap', () => {
   });
 
   describe('dimensions', () => {
-    it('reflects the compile options', () => {
+    it('width matches compile options, height fits content', () => {
       const result = compileTileMap(basicSpec, defaultOptions);
 
       expect(result.width).toBe(600);
-      expect(result.height).toBe(400);
+      expect(result.height).toBeGreaterThan(0);
+      expect(result.height).toBeLessThanOrEqual(400);
     });
 
     it('works with different container sizes', () => {
       const result = compileTileMap(basicSpec, { width: 800, height: 600 });
 
       expect(result.width).toBe(800);
-      expect(result.height).toBe(600);
+      expect(result.height).toBeGreaterThan(0);
+      expect(result.height).toBeLessThanOrEqual(600);
     });
   });
 

package/src/tilemap/compile-tilemap.ts

@@ -329,6 +329,15 @@ export function compileTileMap(spec: unknown, options: CompileOptions): TileMapL
   // 15. Resolve animation
   const resolvedAnimation: ResolvedAnimation | undefined = resolveAnimation(tilemapSpec.animation);
 
+  // Tight content height: tiles + legend + chrome + padding
+  const contentHeight =
+    tileGridOffsetY +
+    tilePositions.gridHeight +
+    legendGap +
+    legendTotalHeight +
+    chrome.bottomHeight +
+    padding;
+
   return {
     area: fullArea,
     chrome,
@@ -338,7 +347,7 @@ export function compileTileMap(spec: unknown, options: CompileOptions): TileMapL
     a11y,
     theme,
     width: options.width,
-    height: options.height,
+    height: contentHeight,
     animation: resolvedAnimation,
     watermark,
     measureText: