From 46d2ae0c4fe5af3bf642fbd3e0d0f3534ab6e563 Mon Sep 17 00:00:00 2001 From: Neil Kistner Date: Thu, 29 Apr 2021 19:27:34 -0500 Subject: [PATCH] feat(generators): migrate package to typescript (#1492) Close #1220 --- packages/generators/package.json | 13 +++-- .../generators/src/{bullet.js => bullet.ts} | 32 ++++++----- .../generators/src/{chord.js => chord.ts} | 8 --- packages/generators/src/color.js | 9 ---- packages/generators/src/color.ts | 1 + .../generators/src/{index.js => index.ts} | 53 ++++++++++--------- .../generators/src/{network.js => network.ts} | 31 ++++++----- ...lCoordinates.js => parallelCoordinates.ts} | 19 +++---- .../generators/src/{sankey.js => sankey.ts} | 32 ++++++----- .../sets/{countryCodes.js => countryCodes.ts} | 2 +- packages/generators/src/sets/index.js | 3 -- packages/generators/src/sets/index.ts | 3 ++ .../src/sets/{names.js => names.ts} | 2 +- ...ngLanguages.js => programmingLanguages.ts} | 2 +- .../src/{swarmplot.js => swarmplot.ts} | 27 +++++----- packages/generators/tsconfig.json | 8 +++ tsconfig.monorepo.json | 4 +- yarn.lock | 15 ++++++ 18 files changed, 150 insertions(+), 114 deletions(-) rename packages/generators/src/{bullet.js => bullet.ts} (59%) rename packages/generators/src/{chord.js => chord.ts} (71%) delete mode 100644 packages/generators/src/color.js create mode 100644 packages/generators/src/color.ts rename packages/generators/src/{index.js => index.ts} (84%) rename packages/generators/src/{network.js => network.ts} (79%) rename packages/generators/src/{parallelCoordinates.js => parallelCoordinates.ts} (78%) rename packages/generators/src/{sankey.js => sankey.ts} (79%) rename packages/generators/src/sets/{countryCodes.js => countryCodes.ts} (98%) delete mode 100644 packages/generators/src/sets/index.js create mode 100644 packages/generators/src/sets/index.ts rename packages/generators/src/sets/{names.js => names.ts} (95%) rename packages/generators/src/sets/{programmingLanguages.js => programmingLanguages.ts} (85%) rename packages/generators/src/{swarmplot.js => swarmplot.ts} (73%) create mode 100644 packages/generators/tsconfig.json diff --git a/packages/generators/package.json b/packages/generators/package.json index 12c53df67..50dd10303 100644 --- a/packages/generators/package.json +++ b/packages/generators/package.json @@ -19,21 +19,24 @@ }, "main": "./dist/nivo-generators.cjs.js", "module": "./dist/nivo-generators.es.js", + "typings": "./dist/types/index.d.ts", "files": [ "README.md", "LICENSE.md", - "dist/" + "dist/", + "!dist/tsconfig.tsbuildinfo" ], - "engines": { - "node": ">=6.0.0", - "npm": ">=3.0.0" - }, "dependencies": { "d3-random": "^1.1.2", "d3-time": "^1.0.10", "d3-time-format": "^2.1.3", "lodash": "^4.17.11" }, + "devDependencies": { + "@types/d3-random": "^1.1.3", + "@types/d3-time": "^1.0.10", + "@types/d3-time-format": "^2.3.1" + }, "publishConfig": { "access": "public" } diff --git a/packages/generators/src/bullet.js b/packages/generators/src/bullet.ts similarity index 59% rename from packages/generators/src/bullet.js rename to packages/generators/src/bullet.ts index 663204cd9..8de8961d4 100644 --- a/packages/generators/src/bullet.js +++ b/packages/generators/src/bullet.ts @@ -1,18 +1,26 @@ -/* - * This file is part of the nivo project. - * - * Copyright 2016-present, Raphaël Benitte. - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ import range from 'lodash/range' import random from 'lodash/random' +type Options = Partial<{ + float: boolean + markerCount: number + measureCount: number + rangeCount: number + subtitle: string + title: string +}> + export const generateBulletData = ( - id, - max, - { title, subtitle, rangeCount = 5, measureCount = 1, markerCount = 1, float = false } = {} + id: string, + max: number, + { + title, + subtitle, + rangeCount = 5, + measureCount = 1, + markerCount = 1, + float = false, + }: Options = {} ) => { const ranges = range(rangeCount - 1).reduce( acc => { @@ -22,7 +30,7 @@ export const generateBulletData = ( [max] ) - const measures = range(measureCount).reduce(acc => { + const measures = range(measureCount).reduce(acc => { if (acc.length === 0) return [random(max, float)] return [random(acc[0], float), ...acc] }, []) diff --git a/packages/generators/src/chord.js b/packages/generators/src/chord.ts similarity index 71% rename from packages/generators/src/chord.js rename to packages/generators/src/chord.ts index a544382d9..f8e0adcc9 100644 --- a/packages/generators/src/chord.js +++ b/packages/generators/src/chord.ts @@ -1,11 +1,3 @@ -/* - * This file is part of the nivo project. - * - * Copyright 2016-present, Raphaël Benitte. - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ import range from 'lodash/range' import random from 'lodash/random' import { names } from './sets' diff --git a/packages/generators/src/color.js b/packages/generators/src/color.js deleted file mode 100644 index 1843ce2cf..000000000 --- a/packages/generators/src/color.js +++ /dev/null @@ -1,9 +0,0 @@ -/* - * This file is part of the nivo project. - * - * Copyright 2016-present, Raphaël Benitte. - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -export const randColor = () => `hsl(${Math.round(Math.random() * 360)}, 70%, 50%)` diff --git a/packages/generators/src/color.ts b/packages/generators/src/color.ts new file mode 100644 index 000000000..b2966d1cd --- /dev/null +++ b/packages/generators/src/color.ts @@ -0,0 +1 @@ +export const randColor = () => `hsl(${Math.round(Math.random() * 360)}, 70%, 50%)` diff --git a/packages/generators/src/index.js b/packages/generators/src/index.ts similarity index 84% rename from packages/generators/src/index.js rename to packages/generators/src/index.ts index 2a402aed9..ab7be1ba6 100644 --- a/packages/generators/src/index.js +++ b/packages/generators/src/index.ts @@ -1,11 +1,3 @@ -/* - * This file is part of the nivo project. - * - * Copyright 2016-present, Raphaël Benitte. - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ import range from 'lodash/range' import random from 'lodash/random' import shuffle from 'lodash/shuffle' @@ -33,10 +25,10 @@ export const generateProgrammingLanguageStats = (shouldShuffle = true, limit = - })) } -export const uniqRand = generator => { - const used = [] +export const uniqRand = (generator: (...args: unknown[]) => T) => { + const used: T[] = [] - return (...args) => { + return (...args: unknown[]) => { let value do { value = generator(...args) @@ -50,12 +42,22 @@ export const uniqRand = generator => { export const randCountryCode = () => shuffle(sets.countryCodes)[0] +type DrinkDatum = { + id: string + color: string + data: Array<{ + color: string + x: string + y: number + }> +} + export const generateDrinkStats = (xSize = 16) => { const rand = () => random(0, 60) const types = ['whisky', 'rhum', 'gin', 'vodka', 'cognac'] const country = uniqRand(randCountryCode) - const data = types.map(id => ({ + const data: DrinkDatum[] = types.map(id => ({ id, color: randColor(), data: [], @@ -64,7 +66,7 @@ export const generateDrinkStats = (xSize = 16) => { range(xSize).forEach(() => { const x = country() types.forEach(id => { - data.find(d => d.id === id).data.push({ + data.find(d => d.id === id)?.data.push({ color: randColor(), x, y: rand(), @@ -81,7 +83,7 @@ export const generateSerie = (xSize = 20) => { return range(xSize).map(() => Math.round(Math.random() * max)) } -export const generateSeries = (ids, xKeys) => +export const generateSeries = (ids: string[], xKeys: string[]) => ids.map(id => ({ id, color: randColor(), @@ -93,8 +95,8 @@ export const generateStackData = (size = 3) => { return range(size).map(() => generateSerie(length).map((v, i) => ({ x: i, y: v }))) } -export const generateCountriesPopulation = size => { - const countryCode = uniqRand(randCountryCode()) +export const generateCountriesPopulation = (size: number) => { + const countryCode = uniqRand(randCountryCode) return range(size).map(() => ({ country: countryCode(), @@ -102,7 +104,7 @@ export const generateCountriesPopulation = size => { })) } -export const generateDayCounts = (from, to, maxSize = 0.9) => { +export const generateDayCounts = (from: Date, to: Date, maxSize = 0.9) => { const days = timeDays(from, to) const size = @@ -122,11 +124,11 @@ export const generateDayCounts = (from, to, maxSize = 0.9) => { } export const generateCountriesData = ( - keys, + keys: string[], { size = 12, min = 0, max = 200, withColors = true } = {} ) => sets.countryCodes.slice(0, size).map(country => { - const d = { + const d: Record = { country, } keys.forEach(key => { @@ -221,22 +223,22 @@ const libTreeItems = [ ], ] -export const generateLibTree = (name = 'nivo', limit, children = libTreeItems) => { +export const generateLibTree = (name = 'nivo', limit?: number | null, children = libTreeItems) => { limit = limit || children.length if (limit > children.length) { limit = children.length } - const tree = { + const tree: Record = { name, color: randColor(), } - if (children && children.length > 0) { - tree.children = range(limit).map((o, i) => { + if (children?.length > 0) { + tree.children = range(limit).map((_, i) => { const leaf = children[i] // full path `${name}.${leaf[0]}` - return generateLibTree(leaf[0], null, leaf[1] || []) + return generateLibTree(leaf[0] as string, null, (leaf[1] ?? []) as any) }) } else { tree.loc = Math.round(Math.random() * 200000) @@ -247,9 +249,10 @@ export const generateLibTree = (name = 'nivo', limit, children = libTreeItems) = const wines = ['chardonay', 'carmenere', 'syrah'] const wineTastes = ['fruity', 'bitter', 'heavy', 'strong', 'sunny'] + export const generateWinesTastes = ({ randMin = 20, randMax = 120 } = {}) => { const data = wineTastes.map(taste => { - const d = { taste } + const d: Record = { taste } wines.forEach(wine => { d[wine] = random(randMin, randMax) }) diff --git a/packages/generators/src/network.js b/packages/generators/src/network.ts similarity index 79% rename from packages/generators/src/network.js rename to packages/generators/src/network.ts index aa128c7fb..6e433d201 100644 --- a/packages/generators/src/network.js +++ b/packages/generators/src/network.ts @@ -1,13 +1,18 @@ -/* - * This file is part of the nivo project. - * - * Copyright 2016-present, Raphaël Benitte. - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ import random from 'lodash/random' +type Link = { + distance: number + source: string + target: string +} + +type ExtraNode = { + color: string + depth: number + id: string + radius: number +} + export const generateNetworkData = ({ rootNodeRadius = 12, minMidNodes = 6, @@ -23,15 +28,15 @@ export const generateNetworkData = ({ depth: 0, color: 'rgb(244, 117, 96)', } - let nodes = Array.from({ length: random(minMidNodes, maxMidNodes) }, (v, k) => ({ + let nodes = Array.from({ length: random(minMidNodes, maxMidNodes) }, (_, k) => ({ id: `${k + 1}`, radius: midNodeRadius, depth: 1, color: 'rgb(97, 205, 187)', })) - const links = [] - const extraNodes = [] + const links: Link[] = [] + const extraNodes: ExtraNode[] = [] nodes.forEach(source => { links.push({ source: '0', @@ -47,7 +52,7 @@ export const generateNetworkData = ({ }) } }) - Array.from({ length: random(minLeaves, maxLeaves) }, (v, k) => { + Array.from({ length: random(minLeaves, maxLeaves) }, (_, k) => { extraNodes.push({ id: `${source.id}.${k}`, radius: leafRadius, @@ -59,6 +64,8 @@ export const generateNetworkData = ({ target: `${source.id}.${k}`, distance: 30, }) + + return null }) }) diff --git a/packages/generators/src/parallelCoordinates.js b/packages/generators/src/parallelCoordinates.ts similarity index 78% rename from packages/generators/src/parallelCoordinates.js rename to packages/generators/src/parallelCoordinates.ts index 055918554..adc43e487 100644 --- a/packages/generators/src/parallelCoordinates.js +++ b/packages/generators/src/parallelCoordinates.ts @@ -1,15 +1,16 @@ -/* - * This file is part of the nivo project. - * - * Copyright 2016-present, Raphaël Benitte. - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ import random from 'lodash/random' import range from 'lodash/range' import shuffle from 'lodash/shuffle' +type Options = Partial<{ + size: number + keys: Array<{ + key: string + random?: [number, number] + shuffle?: string[] + }> +}> + export const generateParallelCoordinatesData = ({ size = 26, keys = [ @@ -19,7 +20,7 @@ export const generateParallelCoordinatesData = ({ { key: 'target', shuffle: ['A', 'B', 'C', 'D', 'E'] }, { key: 'volume', random: [0.2, 7.6] }, ], -} = {}) => { +}: Options = {}) => { const datumGenerator = () => keys.reduce((acc, key) => { let value diff --git a/packages/generators/src/sankey.js b/packages/generators/src/sankey.ts similarity index 79% rename from packages/generators/src/sankey.js rename to packages/generators/src/sankey.ts index 77e46fd3e..5f6faf0bd 100644 --- a/packages/generators/src/sankey.js +++ b/packages/generators/src/sankey.ts @@ -1,20 +1,18 @@ -/* - * This file is part of the nivo project. - * - * Copyright 2016-present, Raphaël Benitte. - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ import range from 'lodash/range' import random from 'lodash/random' import shuffle from 'lodash/shuffle' import { randColor } from './color' import { names } from './sets' +type Link = { + source: string + target: string + value: number +} + const availableNodes = names.map(name => ({ id: name })) -const getNodeTargets = (id, links, currentPath) => { +const getNodeTargets = (id: string, links: Link[], currentPath?: string[]): string[] => { const targets = links .filter(({ source }) => source === id) .map(({ target }) => { @@ -23,7 +21,7 @@ const getNodeTargets = (id, links, currentPath) => { `[sankey] a node cannot be linked on itself:\n link: ${id} —> ${id}` ) } - if (currentPath && currentPath.includes(target)) { + if (currentPath?.includes(target)) { throw new Error( `[sankey] found cyclic dependency:\n link: ${currentPath.join( ' —> ' @@ -46,8 +44,8 @@ const getNodeTargets = (id, links, currentPath) => { ) } -const getNodesTargets = links => - links.reduce((targetsById, link) => { +const getNodesTargets = (links: Link[]) => + links.reduce>((targetsById, link) => { if (!targetsById[link.source]) { targetsById[link.source] = getNodeTargets(link.source, links) } @@ -55,14 +53,20 @@ const getNodesTargets = links => return targetsById }, {}) -export const generateSankeyData = ({ nodeCount, maxIterations = 3 } = {}) => { +export const generateSankeyData = ({ + nodeCount, + maxIterations = 3, +}: { + nodeCount?: number + maxIterations?: number +} = {}) => { const nodes = availableNodes.slice(0, nodeCount).map(node => Object.assign({}, node, { color: randColor(), }) ) - const links = [] + const links: Link[] = [] shuffle(nodes).forEach(({ id }) => { range(random(1, maxIterations)).forEach(() => { const targetsById = getNodesTargets(links) diff --git a/packages/generators/src/sets/countryCodes.js b/packages/generators/src/sets/countryCodes.ts similarity index 98% rename from packages/generators/src/sets/countryCodes.js rename to packages/generators/src/sets/countryCodes.ts index de77bdb98..225a0dbf9 100644 --- a/packages/generators/src/sets/countryCodes.js +++ b/packages/generators/src/sets/countryCodes.ts @@ -1,4 +1,4 @@ -export default [ +export const countryCodes = [ 'AD', 'AE', 'AF', diff --git a/packages/generators/src/sets/index.js b/packages/generators/src/sets/index.js deleted file mode 100644 index 16c24abe9..000000000 --- a/packages/generators/src/sets/index.js +++ /dev/null @@ -1,3 +0,0 @@ -export { default as countryCodes } from './countryCodes' -export { default as names } from './names' -export { default as programmingLanguages } from './programmingLanguages' diff --git a/packages/generators/src/sets/index.ts b/packages/generators/src/sets/index.ts new file mode 100644 index 000000000..1935ce495 --- /dev/null +++ b/packages/generators/src/sets/index.ts @@ -0,0 +1,3 @@ +export * from './countryCodes' +export * from './names' +export * from './programmingLanguages' diff --git a/packages/generators/src/sets/names.js b/packages/generators/src/sets/names.ts similarity index 95% rename from packages/generators/src/sets/names.js rename to packages/generators/src/sets/names.ts index 879c1c803..71c10be25 100644 --- a/packages/generators/src/sets/names.js +++ b/packages/generators/src/sets/names.ts @@ -1,4 +1,4 @@ -export default [ +export const names = [ 'John', 'Raoul', 'Jane', diff --git a/packages/generators/src/sets/programmingLanguages.js b/packages/generators/src/sets/programmingLanguages.ts similarity index 85% rename from packages/generators/src/sets/programmingLanguages.js rename to packages/generators/src/sets/programmingLanguages.ts index bfeecac9e..1327b75a7 100644 --- a/packages/generators/src/sets/programmingLanguages.js +++ b/packages/generators/src/sets/programmingLanguages.ts @@ -1,4 +1,4 @@ -export default [ +export const programmingLanguages = [ 'php', 'make', 'javascript', diff --git a/packages/generators/src/swarmplot.js b/packages/generators/src/swarmplot.ts similarity index 73% rename from packages/generators/src/swarmplot.js rename to packages/generators/src/swarmplot.ts index 2119c7afb..ef8e4b0b7 100644 --- a/packages/generators/src/swarmplot.js +++ b/packages/generators/src/swarmplot.ts @@ -1,28 +1,31 @@ -/* - * This file is part of the nivo project. - * - * Copyright 2016-present, Raphaël Benitte. - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ import range from 'lodash/range' import random from 'lodash/random' import shuffle from 'lodash/shuffle' +type SwarmPlotDatum = { + id: string + categories?: number[] + group: string + price: number + volume: number +} + const randomPrice = () => random(0, 500) const randomVolume = () => random(4, 20) const randomCategory = () => random(3, 17) -export const generateSwarmPlotData = (groups, { min = 60, max = 100, categoryCount = 0 }) => ({ +export const generateSwarmPlotData = ( + groups: string[], + { min = 60, max = 100, categoryCount = 0 } +) => ({ groups, - data: groups.reduce( + data: groups.reduce( (acc, group, groupIndex) => [ ...acc, ...range(random(min, max)) .map(() => randomPrice()) .map((price, index) => { - const datum = { + const datum: SwarmPlotDatum = { id: `${groupIndex}.${index}`, group, price, @@ -40,7 +43,7 @@ export const generateSwarmPlotData = (groups, { min = 60, max = 100, categoryCou ), }) -export const randomizeSwarmPlotData = previousData => ({ +export const randomizeSwarmPlotData = (previousData: ReturnType) => ({ groups: previousData.groups, data: previousData.data.map(d => { const datum = { diff --git a/packages/generators/tsconfig.json b/packages/generators/tsconfig.json new file mode 100644 index 000000000..855b4b2b7 --- /dev/null +++ b/packages/generators/tsconfig.json @@ -0,0 +1,8 @@ +{ + "extends": "../../tsconfig.types.json", + "compilerOptions": { + "outDir": "./dist/types", + "rootDir": "./src" + }, + "include": ["src/**/*"] +} diff --git a/tsconfig.monorepo.json b/tsconfig.monorepo.json index 218f7eca3..2aa82bee1 100644 --- a/tsconfig.monorepo.json +++ b/tsconfig.monorepo.json @@ -13,8 +13,8 @@ { "path": "./packages/arcs" }, // Utility package - // { "path": "./packages/generators" }, - { "path": "./packages/recompose" }, + { "path": "./packages/generators" }, + { "path": "./packages/recompose" }, // Charts now { "path": "./packages/voronoi" }, diff --git a/yarn.lock b/yarn.lock index 1394bb915..eeba9f2b4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6032,6 +6032,11 @@ resolved "https://registry.yarnpkg.com/@types/d3-path/-/d3-path-1.0.9.tgz#73526b150d14cd96e701597cbf346cfd1fd4a58c" integrity sha512-NaIeSIBiFgSC6IGUBjZWcscUJEq7vpVu7KthHN8eieTV9d9MqkSOZLH4chq1PmcKy06PNe3axLeKmRIyxJ+PZQ== +"@types/d3-random@^1.1.3": + version "1.1.3" + resolved "https://registry.yarnpkg.com/@types/d3-random/-/d3-random-1.1.3.tgz#8f7fdc23f92d1561e0694eb49567e8ab50537a19" + integrity sha512-XXR+ZbFCoOd4peXSMYJzwk0/elP37WWAzS/DG+90eilzVbUSsgKhBcWqylGWe+lA2ubgr7afWAOBaBxRgMUrBQ== + "@types/d3-scale-chromatic@^2.0.0": version "2.0.0" resolved "https://registry.yarnpkg.com/@types/d3-scale-chromatic/-/d3-scale-chromatic-2.0.0.tgz#8d4a6f07cbbf2a9f2a4bec9c9476c27ed76a96ea" @@ -6051,11 +6056,21 @@ dependencies: "@types/d3-path" "^1" +"@types/d3-time-format@^2.3.1": + version "2.3.1" + resolved "https://registry.yarnpkg.com/@types/d3-time-format/-/d3-time-format-2.3.1.tgz#87a30e4513b9d1d53b920327a361f87255bf3372" + integrity sha512-fck0Z9RGfIQn3GJIEKVrp15h9m6Vlg0d5XXeiE/6+CQiBmMDZxfR21XtjEPuDeg7gC3bBM0SdieA5XF3GW1wKA== + "@types/d3-time@*": version "2.0.0" resolved "https://registry.yarnpkg.com/@types/d3-time/-/d3-time-2.0.0.tgz#831dd093db91f16b83ba980e194bb8e4bcef44d6" integrity sha512-Abz8bTzy8UWDeYs9pCa3D37i29EWDjNTjemdk0ei1ApYVNqulYlGUKip/jLOpogkPSsPz/GvZCYiC7MFlEk0iQ== +"@types/d3-time@^1.0.10": + version "1.1.1" + resolved "https://registry.yarnpkg.com/@types/d3-time/-/d3-time-1.1.1.tgz#6cf3a4242c3bbac00440dfb8ba7884f16bedfcbf" + integrity sha512-ULX7LoqXTCYtM+tLYOaeAJK7IwCT+4Gxlm2MaH0ErKLi07R5lh8NHCAyWcDkCCmx1AfRcBEV6H9QE9R25uP7jw== + "@types/debug@^0.0.30": version "0.0.30" resolved "https://registry.yarnpkg.com/@types/debug/-/debug-0.0.30.tgz#dc1e40f7af3b9c815013a7860e6252f6352a84df"