chore: merge alpha into master

.eslintrc.js

@@ -67,7 +67,7 @@ module.exports = {
     '@typescript-eslint/no-unsafe-return': 0,
     '@typescript-eslint/explicit-module-boundary-types': 0,
     '@typescript-eslint/restrict-plus-operands': 0, // rule is broken
-    '@typescript-eslint/no-unsafe-call': 1,
+    '@typescript-eslint/no-unsafe-call': 0, // seems to have issues with default import types
     '@typescript-eslint/unbound-method': 1,
     '@typescript-eslint/no-redeclare': 'off', // we use to declare enum type and object with the same name
     '@typescript-eslint/no-shadow': 'off', // we use shadow mostly within the canvas renderer function when we need a new context

integration/tests/heatmap_stories.test.ts

@@ -6,6 +6,7 @@
  * Side Public License, v 1.
  */
 
+import { eachTheme } from '../helpers';
 import { common } from '../page_objects';
 
 describe('Heatmap stories', () => {
@@ -16,10 +17,28 @@ describe('Heatmap stories', () => {
       { left: 300, top: 300 },
     );
   });
+
+  eachTheme.describe((_, themeParams) => {
+    it('should render basic heatmap', async () => {
+      await common.expectChartAtUrlToMatchScreenshot(
+        `http://localhost:9001/?path=/story/heatmap-alpha--basic${themeParams}`,
+      );
+    });
+
+    it('should render correct brush area', async () => {
+      await common.expectChartWithDragAtUrlToMatchScreenshot(
+        `http://localhost:9001/?path=/story/heatmap-alpha--basic${themeParams}`,
+        { left: 200, top: 100 },
+        { left: 400, top: 250 },
+      );
+    });
+  });
+
   it('should maximize the label with an unique fontSize', async () => {
     await page.setViewport({ width: 450, height: 600 });
     await common.expectChartAtUrlToMatchScreenshot('http://localhost:9001/?path=/story/heatmap-alpha--categorical');
   });
+
   it('should maximize the label fontSize', async () => {
     await page.setViewport({ width: 420, height: 600 });
     await common.expectChartAtUrlToMatchScreenshot(

integration/tests/wordcloud_stories.test.ts

@@ -0,0 +1,18 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { TEMPLATES } from '../../storybook/stories/wordcloud/1_wordcloud.story';
+import { common } from '../page_objects';
+
+describe('Scales stories', () => {
+  it.each(TEMPLATES.filter((t) => t !== 'edit'))('should render %s wordcloud template', async (template) => {
+    await common.expectChartAtUrlToMatchScreenshot(
+      `http://localhost:9001/?path=/story/wordcloud-alpha--simple-wordcloud&knob-template=${template}`,
+    );
+  });
+});

package.json

@@ -82,6 +82,7 @@
     "@types/color": "^3.0.1",
     "@types/core-js": "^2.5.2",
     "@types/d3-array": "^1.2.6",
+    "@types/d3-cloud": "^1.2.5",
     "@types/d3-collection": "^1.0.8",
     "@types/d3-interpolate": "^1.3.1",
     "@types/d3-scale": "^2.1.1",

packages/charts/src/chart_types/heatmap/layout/types/viewmodel_types.ts

@@ -13,10 +13,10 @@ import { Box } from '../../../../common/text_utils';
 import { Fill, Line, Rect, Stroke } from '../../../../geoms/types';
 import { HeatmapBrushEvent } from '../../../../specs/settings';
 import { Point } from '../../../../utils/point';
+import { LIGHT_THEME } from '../../../../utils/themes/light_theme';
+import { HeatmapStyle } from '../../../../utils/themes/theme';
 import { PrimitiveValue } from '../../../partition_chart/layout/utils/group_by_rollup';
-import { config } from '../config/config';
 import { HeatmapCellDatum } from '../viewmodel/viewmodel';
-import { Config } from './config_types';
 
 /** @internal */
 export interface Value {
@@ -98,7 +98,7 @@ export type DragShape = ReturnType<PickDragShapeFunction>;
 
 /** @internal */
 export type ShapeViewModel = {
-  config: Config;
+  theme: HeatmapStyle;
   heatmapViewModel: HeatmapViewModel;
   pickQuads: PickFunction;
   pickDragArea: PickDragFunction;
@@ -125,8 +125,8 @@ export const nullHeatmapViewModel: HeatmapViewModel = {
 };
 
 /** @internal */
-export const nullShapeViewModel = (specifiedConfig?: Config): ShapeViewModel => ({
-  config: specifiedConfig || config,
+export const nullShapeViewModel = (): ShapeViewModel => ({
+  theme: LIGHT_THEME.heatmap,
   heatmapViewModel: nullHeatmapViewModel,
   pickQuads: () => [],
   pickDragArea: () => ({ cells: [], x: [], y: [], chartType: ChartType.Heatmap }),