typescript(vx-mock-data): re-write packge in TypeScript

packages/vx-heatmap/test/HeatmapCircle.test.tsx

@@ -2,13 +2,11 @@ import React from 'react';
 import { shallow } from 'enzyme';
 
 import { HeatmapCircle } from '../src';
-// @ts-ignore
-import { genBins } from '../../vx-mock-data/src';
 
 const data: {
   bin: number;
   bins: { bin: number; count: number }[];
-}[] = genBins(1, 1);
+}[] = [{ bin: 0, bins: [{ bin: 0, count: 1 }] }];
 
 const xScale = () => 50;
 const yScale = () => 50;

packages/vx-heatmap/test/HeatmapRect.test.tsx

@@ -2,15 +2,15 @@ import React from 'react';
 import { shallow } from 'enzyme';
 
 import { HeatmapRect } from '../src';
-// @ts-ignore
-import { genBins } from '../../vx-mock-data/src';
 
 const data: {
   bin: number;
   bins: { bin: number; count: number }[];
-}[] = genBins(1, 1);
+}[] = [{ bin: 0, bins: [{ bin: 0, count: 1 }] }];
+
 const xScale = () => 50;
 const yScale = () => 50;
+
 const HeatmapWrapper = (props = {}) =>
   shallow(<HeatmapRect data={data} xScale={xScale} yScale={yScale} {...props} />);
 

packages/vx-mock-data/package.json

@@ -5,6 +5,7 @@
   "sideEffects": false,
   "main": "lib/index.js",
   "module": "esm/index.js",
+  "types": "lib/index.d.ts",
   "files": [
     "lib",
     "esm"
@@ -30,6 +31,7 @@
     "access": "public"
   },
   "dependencies": {
+    "@types/d3-random": "^1.1.2",
     "d3-random": "^1.0.3"
   }
 }

packages/vx-mock-data/src/generators/genBin.ts

@@ -0,0 +1,30 @@
+export type CountFunction = (idx: number, number: number) => number;
+export type BinFunction = (idx: number, number?: number) => number;
+
+export interface Bin {
+  bin: number;
+  count: number;
+}
+
+const defaultCount: CountFunction = (idx, number) => {
+  return Math.random() * (25 * (number - idx));
+};
+
+const defaultBin: BinFunction = (idx, length) => {
+  return idx * 150;
+};
+
+export default function genBin(
+  length: number,
+  bin: BinFunction = defaultBin,
+  count: CountFunction = defaultCount,
+): Bin[] {
+  return new Array(length).fill(1).reduce((data, d, i) => {
+    return data.concat([
+      {
+        bin: bin(i, length),
+        count: count(i, length),
+      },
+    ]);
+  }, []);
+}

packages/vx-mock-data/src/generators/genBins.ts

@@ -0,0 +1,22 @@
+import genBin, { Bin, BinFunction, CountFunction } from './genBin';
+
+export type Bins = {
+  bin: number;
+  bins: Bin[];
+};
+
+export default function genBins(
+  length: number,
+  height: number,
+  bin?: BinFunction,
+  count?: CountFunction,
+): Bins[] {
+  return new Array(length).fill(1).reduce((arr, _, i) => {
+    return arr.concat([
+      {
+        bin: i,
+        bins: genBin(height, bin, count),
+      },
+    ]);
+  }, []);
+}

packages/vx-mock-data/src/generators/genDateValue.ts

@@ -0,0 +1,14 @@
+export type DateValue = {
+  date: Date;
+  value: number;
+};
+
+export default function genDateValue(length: number): DateValue[] {
+  return new Array(length).fill(1).map((_, idx: number) => {
+    return {
+      date: new Date(Date.now() - idx * 3600000),
+      // eslint-disable-next-line no-bitwise
+      value: Math.max(250, (Math.random() * 3000) | 0),
+    };
+  });
+}

packages/vx-mock-data/src/generators/genPhyllotaxis.ts

@@ -0,0 +1,27 @@
+export interface GenPhyllotaxis {
+  radius: number;
+  width: number;
+  height: number;
+}
+export interface PhyllotaxisPoint {
+  x: number;
+  y: number;
+}
+
+export type GenPhyllotaxisFunction = (idx: number) => PhyllotaxisPoint;
+
+export default function genPhyllotaxis({
+  radius,
+  width,
+  height,
+}: GenPhyllotaxis): GenPhyllotaxisFunction {
+  const theta = Math.PI * (3 - Math.sqrt(5));
+  return idx => {
+    const r = radius * Math.sqrt(idx);
+    const a = theta * idx;
+    return {
+      x: width / 2 + r * Math.cos(a),
+      y: height / 2 + r * Math.sin(a),
+    };
+  };
+}

packages/vx-mock-data/src/generators/genRandomNormalPoints.ts

@@ -0,0 +1,28 @@
+import { randomNormal } from 'd3-random';
+
+export type PointConfig = [number, number, number];
+export type PointsRange = [number, number, number];
+
+const random = randomNormal(0, 0.2);
+const sqrt3: number = Math.sqrt(3);
+
+function range(length: number): number[] {
+  return new Array(length).fill(1);
+}
+
+export function genPointsRange(
+  length: number,
+  [offsetX, offsetY, index]: PointConfig,
+): PointsRange[] {
+  return range(length).map(() => {
+    return [random() + offsetX, random() + offsetY, index];
+  });
+}
+
+export default function genPoints(count: number = 300): PointsRange[] {
+  return [
+    ...genPointsRange(count, [sqrt3, 1, 0]),
+    ...genPointsRange(count, [-sqrt3, 1, 1]),
+    ...genPointsRange(count, [0, -1, 2]),
+  ];
+}

packages/vx-mock-data/src/generators/genStats.js → packages/vx-mock-data/src/generators/genStats.ts

@@ -1,17 +1,37 @@
 import { randomNormal } from 'd3-random';
 
+export interface BoxPlot {
+  x: string;
+  min: number;
+  firstQuartile: number;
+  median: number;
+  thirdQuartile: number;
+  max: number;
+  outliers: number[];
+}
+
+export interface BinData {
+  value: number;
+  count: number;
+}
+
+export interface Stats {
+  boxPlot: BoxPlot;
+  binData: BinData[];
+}
+
 const random = randomNormal(4, 3);
 const randomOffset = () => Math.random() * 10;
 const sampleSize = 1000;
 
-export default function genStats(number) {
+export default function genStats(number: number): Stats[] {
   const data = [];
-  let i;
-  for (i = 0; i < number; i += 1) {
+
+  for (let i = 0; i < number; i += 1) {
     const points = [];
-    let j;
     const offset = randomOffset();
-    for (j = 0; j < sampleSize; j += 1) {
+
+    for (let j = 0; j < sampleSize; j += 1) {
       points.push(offset + random());
     }
 
@@ -29,8 +49,8 @@ export default function genStats(number) {
     const binNum = Math.round((max - min) / binWidth);
     const actualBinWidth = (max - min) / binNum;
 
-    const bins = new Array(binNum + 2).fill(0);
-    const values = new Array(binNum + 2).fill(min);
+    const bins: number[] = new Array(binNum + 2).fill(0);
+    const values: number[] = new Array(binNum + 2).fill(min);
 
     for (let ii = 1; ii <= binNum; ii += 1) {
       values[ii] += actualBinWidth * (ii - 0.5);
@@ -44,12 +64,12 @@ export default function genStats(number) {
         bins[Math.floor((p - min) / actualBinWidth) + 1] += 1;
       });
 
-    const binData = values.map((v, index) => ({
+    const binData: BinData[] = values.map((v: number, index) => ({
       value: v,
       count: bins[index],
     }));
 
-    const boxPlot = {
+    const boxPlot: BoxPlot = {
       x: `Statistics ${i}`,
       min,
       firstQuartile,
@@ -64,5 +84,6 @@ export default function genStats(number) {
       binData,
     });
   }
+
   return data;
 }

packages/vx-mock-data/src/mocks/appleStock.js → packages/vx-mock-data/src/mocks/appleStock.ts

@@ -1,4 +1,9 @@
-export default [
+export type AppleStock = {
+  date: string;
+  close: number;
+};
+
+const appleStock: AppleStock[] = [
   { date: '2007-04-24T07:00:00.000Z', close: 93.24 },
   { date: '2007-04-25T07:00:00.000Z', close: 95.35 },
   { date: '2007-04-26T07:00:00.000Z', close: 98.84 },
@@ -1280,3 +1285,5 @@ export default [
   { date: '2012-04-30T07:00:00.000Z', close: 583.98 },
   { date: '2012-05-01T07:00:00.000Z', close: 582.13 },
 ];
+
+export default appleStock;

packages/vx-mock-data/src/mocks/bitcoinPrice.js → packages/vx-mock-data/src/mocks/bitcoinPrice.ts

@@ -1,4 +1,12 @@
-export default {
+export type BitcoinPrice = {
+  price: string;
+  time: string;
+};
+export type BitcoinPrices = {
+  currency: string;
+  prices: BitcoinPrice[];
+};
+const bitcoinPrice: BitcoinPrices = {
   currency: 'USD',
   prices: [
     { price: '2486.69', time: '2017-07-03T00:00:00Z' },
@@ -368,3 +376,5 @@ export default {
     { price: '676.18', time: '2016-07-04T00:00:00Z' },
   ],
 };
+
+export default bitcoinPrice;

packages/vx-mock-data/src/mocks/browserUsage.js → packages/vx-mock-data/src/mocks/browserUsage.ts

@@ -1,4 +1,16 @@
-export default [
+export type BrowserUsage = {
+  date: string;
+  'Google Chrome': string;
+  'Internet Explorer': string;
+  Firefox: string;
+  Safari: string;
+  'Microsoft Edge': string;
+  Opera: string;
+  Mozilla: string;
+  'Other/Unknown': string;
+};
+
+const browserUsage: BrowserUsage[] = [
   {
     date: '2015 Jun 15',
     'Google Chrome': '48.09',
@@ -4037,3 +4049,5 @@ export default [
     'Other/Unknown': '0',
   },
 ];
+
+export default browserUsage;