refactor: decouple tooltip from XY chart

src/chart_types/xy_chart/state/chart_state.tsx

@@ -1,7 +1,7 @@
 import React, { RefObject } from 'react';
 import { InternalChartState, GlobalChartState, BackwardRef } from '../../../state/chart_state';
 import { ChartTypes } from '../..';
-import { Tooltips } from '../renderer/dom/tooltips';
+import { Tooltip } from '../../../components/tooltip';
 import { htmlIdGenerator } from '../../../utils/commons';
 import { Highlighter } from '../renderer/dom/highlighter';
 import { Crosshair } from '../renderer/dom/crosshair';
@@ -39,7 +39,7 @@ export class XYAxisChartState implements InternalChartState {
       <React.Fragment>
         <Crosshair />
         <XYChart forwardStageRef={forwardStageRef} />
-        <Tooltips getChartContainerRef={containerRef} />
+        <Tooltip getChartContainerRef={containerRef} />
         <AnnotationTooltip getChartContainerRef={containerRef} />
         <Highlighter />
         <BrushTool />

src/chart_types/xy_chart/utils/interactions.ts

@@ -37,16 +37,6 @@ export interface TooltipProps {
 
 export type TooltipValueFormatter = (data: TooltipValue) => JSX.Element | string;
 
-export interface HighlightedElement {
-  position: {
-    x: number;
-    y: number;
-    width: number;
-    height: number;
-    type: 'rect' | 'circle';
-  };
-  value: Datum;
-}
 /**
  * Get the cursor position depending on the chart rotation
  * @param xPos x position relative to chart

src/components/_index.scss

@@ -1,7 +1,7 @@
 @import 'global';
 @import 'container';
 @import 'annotation';
-@import 'tooltip';
+@import 'tooltip/index';
 @import 'icons/index';
 @import 'legend/index';
 @import 'unavailable_chart';

src/components/tooltip/_index.scss

@@ -0,0 +1 @@
+@import 'tooltip';

src/chart_types/xy_chart/renderer/dom/tooltips.tsx → src/components/tooltip/index.tsx

@@ -1,16 +1,19 @@
 import classNames from 'classnames';
 import React from 'react';
 import { connect } from 'react-redux';
-import { TooltipValue, TooltipValueFormatter } from '../../utils/interactions';
-import { GlobalChartState, BackwardRef } from '../../../../state/chart_state';
-import { isTooltipVisibleSelector } from '../../state/selectors/is_tooltip_visible';
-import { getTooltipHeaderFormatterSelector } from '../../state/selectors/get_tooltip_header_formatter';
-import { getTooltipPositionSelector } from '../../state/selectors/get_tooltip_position';
-import { getTooltipValuesSelector, TooltipData } from '../../state/selectors/get_tooltip_values_highlighted_geoms';
-import { isInitialized } from '../../../../state/selectors/is_initialized';
+import { TooltipValue, TooltipValueFormatter } from '../../chart_types/xy_chart/utils/interactions';
+import { GlobalChartState, BackwardRef } from '../../state/chart_state';
+import { isTooltipVisibleSelector } from '../../chart_types/xy_chart/state/selectors/is_tooltip_visible';
+import { getTooltipHeaderFormatterSelector } from '../../chart_types/xy_chart/state/selectors/get_tooltip_header_formatter';
+import { getTooltipPositionSelector } from '../../chart_types/xy_chart/state/selectors/get_tooltip_position';
+import {
+  getTooltipValuesSelector,
+  TooltipData,
+} from '../../chart_types/xy_chart/state/selectors/get_tooltip_values_highlighted_geoms';
+import { isInitialized } from '../../state/selectors/is_initialized';
 import { createPortal } from 'react-dom';
-import { getFinalTooltipPosition, TooltipPosition } from '../../crosshair/crosshair_utils';
-import { isAnnotationTooltipVisibleSelector } from '../../state/selectors/is_annotation_tooltip_visible';
+import { getFinalTooltipPosition, TooltipPosition } from '../../chart_types/xy_chart/crosshair/crosshair_utils';
+import { isAnnotationTooltipVisibleSelector } from '../../chart_types/xy_chart/state/selectors/is_annotation_tooltip_visible';
 
 interface TooltipStateProps {
   isTooltipVisible: boolean;
@@ -24,7 +27,7 @@ interface TooltipOwnProps {
 }
 type TooltipProps = TooltipStateProps & TooltipOwnProps;
 
-class TooltipsComponent extends React.Component<TooltipProps> {
+class TooltipComponent extends React.Component<TooltipProps> {
   static displayName = 'Tooltips';
   portalNode: HTMLDivElement | null = null;
   tooltipRef: React.RefObject<HTMLDivElement>;
@@ -148,4 +151,4 @@ const mapStateToProps = (state: GlobalChartState): TooltipStateProps => {
   };
 };
 
-export const Tooltips = connect(mapStateToProps)(TooltipsComponent);
+export const Tooltip = connect(mapStateToProps)(TooltipComponent);

src/utils/domain.ts

@@ -1,35 +1,9 @@
 import { extent, sum } from 'd3-array';
 import { nest } from 'd3-collection';
-import { Accessor, AccessorFn } from './accessor';
-import { ScaleType } from '../scales';
+import { AccessorFn } from './accessor';
 
 export type Domain = any[];
 
-export interface SpecDomain {
-  accessor: Accessor;
-  level: number;
-  domain: Domain;
-  scaleType: ScaleType;
-  isStacked?: boolean;
-}
-
-export interface ColorDomain {
-  accessors: Accessor[];
-  yAccessors?: Accessor[];
-  domain: string[];
-  scaleType: ScaleType;
-}
-
-export interface SeriesScales {
-  groupLevel: number;
-  xDomain: Domain;
-  yDomain?: Domain;
-  xScaleType: ScaleType;
-  yScaleType?: ScaleType;
-  xAccessor: Accessor;
-  yAccessor?: Accessor;
-}
-
 export function computeOrdinalDataDomain(
   data: any[],
   accessor: AccessorFn,