feat(api): cleanup exposed types

This commit removes all the exposed type definition of the library to cleanup the public API

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@elastic/charts",
   "description": "Elastic-Charts data visualization library",
-  "version": "17.1.1",
+  "version": "18.0.6663",
   "author": "Marco Vettorello <marco.vettorello@elastic.co>",
   "license": "Apache-2.0",
   "main": "dist/index.js",
@@ -13,13 +13,14 @@
   },
   "scripts": {
     "cz": "git-cz",
-    "build:clean": "rm -rf ./dist",
-    "build:ts": "tsc -p ./tsconfig.lib.json",
-    "build:sass": "node-sass src/theme_light.scss dist/theme_light.css --output-style compressed && node-sass src/theme_dark.scss dist/theme_dark.css --output-style compressed && node-sass src/theme_only_light.scss dist/theme_only_light.css --output-style compressed && node-sass src/theme_only_dark.scss dist/theme_only_dark.css --output-style compressed",
-    "concat:sass": "node scripts/concat_sass.js",
-    "autoprefix:css": "yarn postcss dist/*.css --no-map --use autoprefixer -d dist",
-    "build": "yarn build:clean && yarn build:ts && yarn build:sass && yarn autoprefix:css && yarn concat:sass",
-    "build:watch": "yarn build:clean && yarn build:sass && yarn autoprefix:css && yarn concat:sass && yarn build:ts -w ",
+    "build": "yarn build:clean && yarn build:ts && yarn build:check && yarn build:sass && yarn autoprefix:css && yarn concat:sass",
+    "build:clean": "echo 'Cleaning dist...' && rm -rf ./dist",
+    "build:ts": "echo 'Compiling...' && tsc -p ./tsconfig.lib.json",
+    "build:sass": "echo 'Building sass...' && node-sass src/theme_light.scss dist/theme_light.css --output-style compressed && node-sass src/theme_dark.scss dist/theme_dark.css --output-style compressed && node-sass src/theme_only_light.scss dist/theme_only_light.css --output-style compressed && node-sass src/theme_only_dark.scss dist/theme_only_dark.css --output-style compressed",
+    "build:check": "echo 'Type checking dist...' && tsc -p ./tsconfig.lib-check.json",
+    "build:watch": "echo 'Watching build...' && yarn build:clean && yarn build:sass && yarn autoprefix:css && yarn concat:sass && yarn build:ts -w ",
+    "concat:sass": "echo 'Concat SASS...' && node scripts/concat_sass.js",
+    "autoprefix:css": "echo 'Autoprefixing...' && yarn postcss dist/*.css --no-map --use autoprefixer -d dist",
     "start": "yarn storybook",
     "storybook": "start-storybook -p 9001 -c .storybook --ci",
     "start-docs": "start-storybook -p 8001 -c .storybook-docs --ci",
@@ -82,8 +83,8 @@
     "@types/d3-array": "^1.2.6",
     "@types/d3-collection": "^1.0.8",
     "@types/d3-color": "^1.2.2",
-    "@types/d3-random": "^1.1.2",
     "@types/d3-scale": "^2.1.1",
+    "@types/d3-shape": "^1.3.1",
     "@types/enzyme": "^3.9.0",
     "@types/enzyme-adapter-react-16": "^1.0.5",
     "@types/expect-puppeteer": "^3.3.1",
@@ -113,7 +114,6 @@
     "core-js": "^3.6.4",
     "css-loader": "^2.1.0",
     "cz-conventional-changelog": "^3.0.2",
-    "d3-random": "^1.1.2",
     "enzyme": "^3.9.0",
     "enzyme-adapter-react-16": "^1.10.0",
     "eslint": "^6.7.1",
@@ -163,7 +163,6 @@
     "webpack-dev-server": "^3.3.1"
   },
   "dependencies": {
-    "@types/d3-shape": "^1.3.1",
     "classnames": "^2.2.6",
     "d3-array": "^1.2.4",
     "d3-collection": "^1.0.7",

src/chart_types/partition_chart/layout/circline_geometry.ts

@@ -112,6 +112,7 @@ function circlineValidSectors(refC: CirclinePredicate, c: CirclineArc): Circline
   return result;
 }
 
+/** @internal */
 export function conjunctiveConstraint(constraints: RingSector, c: CirclineArc): CirclineArc[] {
   // imperative, slightly optimized buildup of `valids` as it's in the hot loop:
   let valids = [c];

src/chart_types/partition_chart/layout/config/config.ts

@@ -84,6 +84,7 @@ const valueFont = {
   },
 };
 
+/** @internal */
 export const configMetadata = {
   // shape geometry
   width: { dflt: 300, min: 0, max: 1024, type: 'number', reconfigurable: false },

src/chart_types/partition_chart/layout/geometry.ts

@@ -19,16 +19,19 @@
 import { Radian } from './types/geometry_types';
 import { TAU } from './utils/math';
 
+/** @internal */
 export function wrapToTau(a: Radian) {
   if (0 <= a && a <= TAU) return a; // efficient shortcut
   if (a < 0) a -= TAU * Math.floor(a / TAU);
   return a > TAU ? a % TAU : a;
 }
 
+/** @internal */
 export function diffAngle(a: Radian, b: Radian) {
   return ((a - b + Math.PI + TAU) % TAU) - Math.PI;
 }
 
+/** @internal */
 export function meanAngle(a: Radian, b: Radian) {
   return (TAU + b + diffAngle(a, b) / 2) % TAU;
 }

src/chart_types/partition_chart/layout/utils/calcs.ts

@@ -20,6 +20,7 @@ import { Ratio } from '../types/geometry_types';
 import { RgbTuple, stringToRGB } from './d3_utils';
 import { Color } from '../../../../utils/commons';
 
+/** @internal */
 export function hueInterpolator(colors: RgbTuple[]) {
   return (d: number) => {
     const index = Math.round(d * 255);
@@ -28,6 +29,7 @@ export function hueInterpolator(colors: RgbTuple[]) {
   };
 }
 
+/** @internal */
 export function addOpacity(hexColorString: string, opacity: Ratio) {
   // this is a super imperfect multiplicative alpha blender that assumes a "#rrggbb" or "#rrggbbaa" hexColorString
   // todo roll some proper utility that can handle "rgb(...)", "rgba(...)", "red", {r, g, b} etc.
@@ -41,10 +43,12 @@ export function addOpacity(hexColorString: string, opacity: Ratio) {
             ));
 }
 
+/** @internal */
 export function arrayToLookup(keyFun: Function, array: Array<any>) {
   return Object.assign({}, ...array.map((d) => ({ [keyFun(d)]: d })));
 }
 
+/** @internal */
 export function colorIsDark(color: Color) {
   // fixme this assumes a white or very light background
   const rgba = stringToRGB(color);

src/chart_types/partition_chart/layout/utils/d3_utils.ts

@@ -26,6 +26,7 @@ export type RgbObject = { r: RGB; g: RGB; b: RGB; opacity: A };
 const defaultColor: RgbObject = { r: 255, g: 0, b: 0, opacity: 1 };
 const defaultD3Color: D3RGBColor = d3Rgb(defaultColor.r, defaultColor.g, defaultColor.b, defaultColor.opacity);
 
+/** @internal */
 export function stringToRGB(cssColorSpecifier: string): RgbObject {
   return d3Rgb(cssColorSpecifier) || defaultColor;
 }
@@ -34,11 +35,13 @@ function argsToRGB(r: number, g: number, b: number, opacity: number): D3RGBColor
   return d3Rgb(r, g, b, opacity) || defaultD3Color;
 }
 
+/** @internal */
 export function argsToRGBString(r: number, g: number, b: number, opacity: number): string {
   // d3.rgb returns an Rgb instance, which has a specialized `toString` method
   return argsToRGB(r, g, b, opacity).toString();
 }
 
+/** @internal */
 export function RGBtoString(rgb: RgbObject): string {
   const { r, g, b, opacity } = rgb;
   return argsToRGBString(r, g, b, opacity);

src/chart_types/partition_chart/layout/utils/group_by_rollup.ts

@@ -77,6 +77,7 @@ export function sortIndexAccessor(n: ArrayEntry) {
 const ascending: Sorter = (a, b) => a - b;
 const descending: Sorter = (a, b) => b - a;
 
+/** @internal */
 export function groupByRollup(
   keyAccessors: Array<((a: Datum) => Key) | ((a: Datum, i: number) => Key)>,
   valueAccessor: Function,
@@ -132,6 +133,7 @@ function getRootArrayNode(): ArrayNode {
   return result;
 }
 
+/** @internal */
 export function mapsToArrays(root: HierarchyOfMaps, sorter: NodeSorter): HierarchyOfArrays {
   const groupByMap = (node: HierarchyOfMaps, parent: ArrayNode) =>
     Array.from(
@@ -163,14 +165,17 @@ export function mapsToArrays(root: HierarchyOfMaps, sorter: NodeSorter): Hierarc
   return groupByMap(root, getRootArrayNode());
 }
 
+/** @internal */
 export function mapEntryValue(entry: ArrayEntry) {
   return entryValue(entry)[AGGREGATE_KEY];
 }
 
+/** @internal */
 export function aggregateComparator(accessor: Function, sorter: Sorter): NodeSorter {
   return (a, b) => sorter(accessor(a), accessor(b));
 }
 
+/** @internal */
 export const childOrders = {
   ascending,
   descending,
@@ -181,6 +186,7 @@ type MeanReduction = { sum: number; count: number };
 type MedianReduction = Array<number>;
 */
 
+/** @internal */
 export const aggregators = {
   one: {
     identity: () => 0,

src/chart_types/partition_chart/layout/utils/math.ts

@@ -22,10 +22,12 @@ export const TAU = 2 * Math.PI;
 export const RIGHT_ANGLE = TAU / 4;
 export const GOLDEN_RATIO = 1.618;
 
+/** @internal */
 export function trueBearingToStandardPositionAngle(alphaIn: number) {
   return wrapToTau(RIGHT_ANGLE - alphaIn);
 }
 
+/** @internal */
 export function logarithm(base: number, y: number) {
   return Math.log(y) / Math.log(base);
 }

src/chart_types/partition_chart/layout/utils/measure.ts

@@ -19,10 +19,12 @@
 import { Box, Font, TextMeasure } from '../types/types';
 import { Pixels } from '../types/geometry_types';
 
+/** @internal */
 export function cssFontShorthand({ fontStyle, fontVariant, fontWeight, fontFamily }: Font, fontSize: Pixels) {
   return `${fontStyle} ${fontVariant} ${fontWeight} ${fontSize}px ${fontFamily}`;
 }
 
+/** @internal */
 export function measureText(ctx: CanvasRenderingContext2D): TextMeasure {
   return (fontSize: number, boxes: Box[]): TextMetrics[] =>
     boxes.map((box: Box) => {

src/chart_types/partition_chart/layout/utils/sunburst.ts

@@ -19,6 +19,7 @@
 import { ArrayEntry, childrenAccessor, HierarchyOfArrays } from './group_by_rollup';
 import { Origin, Part } from '../types/types';
 
+/** @internal */
 export function sunburst(
   nodes: HierarchyOfArrays,
   areaAccessor: (e: ArrayEntry) => number,

src/chart_types/partition_chart/layout/utils/treemap.ts

@@ -47,6 +47,7 @@ function layVector(
   return { nodes, dependentSize, sectionSizes, sectionOffsets }; // descriptor for a vector (column or row) of elements (nodes)
 }
 
+/** @internal */
 export function leastSquarishAspectRatio({ sectionSizes, dependentSize }: LayoutElement) {
   return sectionSizes.reduce((p, n) => Math.min(p, n / dependentSize, dependentSize / n), 1);
 }
@@ -87,6 +88,7 @@ function vectorNodeCoordinates(vectorLayout: LayoutElement, x0Base: number, y0Ba
   });
 }
 
+/** @internal */
 export function treemap(
   nodes: HierarchyOfArrays,
   areaAccessor: (e: ArrayEntry) => number,

src/chart_types/partition_chart/layout/viewmodel/fill_text_layout.ts

@@ -67,11 +67,13 @@ function angleToCircline(
   return sectorRadiusCircline;
 }
 
+/** @internal */
 // todo pick a better unique key for the slices (D3 doesn't keep track of an index)
 export function nodeId(node: ShapeTreeNode): string {
   return `${node.x0}|${node.y0}`;
 }
 
+/** @internal */
 export function rectangleConstruction(node: ShapeTreeNode) {
   return {
     x0: node.x0,
@@ -81,6 +83,7 @@ export function rectangleConstruction(node: ShapeTreeNode) {
   };
 }
 
+/** @internal */
 export function ringSectorConstruction(config: Config, innerRadius: Radius, ringThickness: Distance) {
   return (ringSector: ShapeTreeNode): RingSector => {
     const {
@@ -143,6 +146,7 @@ function makeRowCircline(
   return circline;
 }
 
+/** @internal */
 export function getSectorRowGeometry(
   ringSector: RingSector,
   cx: Coordinate,
@@ -177,6 +181,7 @@ export function getSectorRowGeometry(
   return { rowCentroidX, rowCentroidY, maximumRowLength };
 }
 
+/** @internal */
 export function getRectangleRowGeometry(
   container: any,
   cx: number,
@@ -401,6 +406,7 @@ function fill(
   };
 }
 
+/** @internal */
 export function inSectorRotation(horizontalTextEnforcer: number, horizontalTextAngleThreshold: number) {
   return (node: ShapeTreeNode) => {
     let rotation = trueBearingToStandardPositionAngle((node.x0 + node.x1) / 2);
@@ -411,6 +417,7 @@ export function inSectorRotation(horizontalTextEnforcer: number, horizontalTextA
   };
 }
 
+/** @internal */
 export function fillTextLayout(
   measure: TextMeasure,
   rawTextGetter: RawTextGetter,

src/chart_types/partition_chart/layout/viewmodel/link_text_layout.ts

@@ -24,6 +24,7 @@ import { meanAngle } from '../geometry';
 import { TextMeasure } from '../types/types';
 import { ValueFormatter } from '../../../../utils/commons';
 
+/** @internal */
 export function linkTextLayout(
   measure: TextMeasure,
   config: Config,

src/chart_types/partition_chart/layout/viewmodel/viewmodel.ts

@@ -113,6 +113,7 @@ export function makeQuadViewModel(
   });
 }
 
+/** @internal */
 export function makeOutsideLinksViewModel(
   outsideFillNodes: ShapeTreeNode[],
   rowSets: RowSet[],
@@ -140,6 +141,7 @@ export function makeOutsideLinksViewModel(
     .filter(({ points }: OutsideLinksViewModel) => points.length > 1);
 }
 
+/** @internal */
 export function shapeViewModel(
   textMeasure: TextMeasure,
   config: Config,

src/chart_types/partition_chart/renderer/canvas/canvas_renderers.ts

@@ -189,6 +189,7 @@ function renderLinkLabels(
   });
 }
 
+/** @internal */
 export function renderPartitionCanvas2d(
   ctx: CanvasRenderingContext2D,
   dpr: number,

src/chart_types/partition_chart/renderer/canvas/partition.tsx

@@ -175,4 +175,5 @@ const mapStateToProps = (state: GlobalChartState): ReactiveChartStateProps => {
   };
 };
 
+/** @internal */
 export const Partition = connect(mapStateToProps, mapDispatchToProps)(PartitionComponent);

src/chart_types/partition_chart/state/chart_state.tsx

@@ -28,6 +28,8 @@ import { createOnElementOverCaller } from './selectors/on_element_over_caller';
 import { createOnElementOutCaller } from './selectors/on_element_out_caller';
 
 const EMPTY_MAP = new Map();
+
+/** @internal */
 export class PartitionState implements InternalChartState {
   onElementClickCaller: (state: GlobalChartState) => void;
   onElementOverCaller: (state: GlobalChartState) => void;

src/chart_types/partition_chart/state/selectors/geometries.ts

@@ -29,6 +29,7 @@ const getSpecs = (state: GlobalChartState) => state.specs;
 
 const getParentDimensions = (state: GlobalChartState) => state.parentDimensions;
 
+/** @internal */
 export const partitionGeometries = createCachedSelector(
   [getSpecs, getParentDimensions],
   (specs, parentDimensions): ShapeViewModel => {

src/chart_types/partition_chart/state/selectors/is_tooltip_visible.ts

@@ -26,6 +26,7 @@ import { getTooltipInfoSelector } from './tooltip';
 /**
  * The brush is available only for Ordinal xScales charts and
  * if we have configured an onBrushEnd listener
+ * @internal
  */
 export const isTooltipVisibleSelector = createCachedSelector(
   [getSettingsSpecSelector, getTooltipInfoSelector],

src/chart_types/partition_chart/state/selectors/on_element_click_caller.ts

@@ -33,6 +33,7 @@ import { getLastClickSelector } from '../../../../state/selectors/get_last_click
  * - the onElementClick listener is available
  * - we have at least one highlighted geometry
  * - the pointer state goes from down state to up state
+ * @internal
  */
 export function createOnElementClickCaller(): (state: GlobalChartState) => void {
   let prevClick: PointerState | null = null;

src/chart_types/partition_chart/state/selectors/on_element_out_caller.ts

@@ -29,6 +29,7 @@ import { getChartIdSelector } from '../../../../state/selectors/get_chart_id';
  * Will call the onElementOut listener every time the following preconditions are met:
  * - the onElementOut listener is available
  * - the highlighted geometries list goes from a list of at least one object to an empty one
+ * @internal
  */
 export function createOnElementOutCaller(): (state: GlobalChartState) => void {
   let prevPickedShapes: number | null = null;

src/chart_types/partition_chart/state/selectors/on_element_over_caller.ts

@@ -56,6 +56,7 @@ function isOverElement(prevPickedShapes: Array<Array<LayerValue>> = [], nextPick
  * Will call the onElementOver listener every time the following preconditions are met:
  * - the onElementOver listener is available
  * - we have a new set of highlighted geometries on our state
+ * @internal
  */
 export function createOnElementOverCaller(): (state: GlobalChartState) => void {
   let prevPickedShapes: Array<Array<LayerValue>> = [];

src/chart_types/partition_chart/state/selectors/picked_shapes.ts

@@ -27,6 +27,7 @@ function getCurrentPointerPosition(state: GlobalChartState) {
   return state.interactions.pointer.current.position;
 }
 
+/** @internal */
 export const getPickedShapes = createCachedSelector(
   [partitionGeometries, getCurrentPointerPosition],
   (geoms, pointerPosition): QuadViewModel[] => {
@@ -38,6 +39,7 @@ export const getPickedShapes = createCachedSelector(
   },
 )((state) => state.chartId);
 
+/** @internal */
 export const getPickedShapesLayerValues = createCachedSelector(
   [getPickedShapes],
   (pickedShapes): Array<Array<LayerValue>> => {