From d53681b439d3bac08e978491a56518b3fe9c98b5 Mon Sep 17 00:00:00 2001 From: plouc Date: Wed, 15 Dec 2021 19:02:11 +0900 Subject: [PATCH] feat(api): migrate API to TypeScript and fix stale mappings and examples --- api/misc/readmeData.js | 8 - api/nodemon.json | 12 + api/package.json | 23 +- api/src/{app.js => app.ts} | 68 +- .../lib/middlewares/validationMiddleware.js | 36 - api/src/lib/render/index.js | 34 - api/src/lib/renderer.ts | 36 + api/src/lib/storage.ts | 19 + api/src/lib/storage/index.js | 21 - api/src/lib/types.ts | 1 + api/src/lib/validation.ts | 33 + api/src/mapping/bar.js | 56 - api/src/mapping/bar.ts | 89 + api/src/mapping/bubble.js | 41 - api/src/mapping/calendar.js | 39 - api/src/mapping/calendar.ts | 61 + api/src/mapping/chord.js | 58 - api/src/mapping/chord.ts | 79 + api/src/mapping/circle_packing.ts | 52 + api/src/mapping/common.js | 51 - api/src/mapping/common.ts | 72 + .../mapping/commons/{colors.js => colors.ts} | 18 +- api/src/mapping/commons/curves.ts | 8 + .../commons/{dimensions.js => dimensions.ts} | 14 +- api/src/mapping/commons/scales.js | 30 - api/src/mapping/commons/scales.ts | 20 + api/src/mapping/heatmap.js | 50 - api/src/mapping/heatmap.ts | 58 + api/src/mapping/index.js | 23 - api/src/mapping/index.ts | 32 + api/src/mapping/line.js | 89 - api/src/mapping/line.ts | 113 ++ api/src/mapping/pie.js | 53 - api/src/mapping/pie.ts | 72 + api/src/mapping/radar.js | 56 - api/src/mapping/radar.ts | 54 + api/src/mapping/sankey.js | 77 - api/src/mapping/sankey.ts | 93 + api/src/mapping/sunburst.js | 37 - api/src/mapping/sunburst.ts | 51 + api/src/mapping/treemap.js | 64 - api/src/mapping/treemap.ts | 71 + api/src/samples/heatmap.js | 8 - api/src/samples/{index.js => index.ts} | 68 +- api/tsconfig.json | 8 + packages/annotations/src/types.ts | 8 +- packages/arcs/src/ArcShape.tsx | 16 +- .../arc_link_labels/ArcLinkLabelsLayer.tsx | 26 +- packages/arcs/src/centers.ts | 34 +- packages/axes/src/compute.ts | 2 +- packages/bar/src/BarItem.tsx | 9 +- packages/bar/src/compute/common.ts | 14 +- packages/bar/src/compute/stacked.ts | 4 +- packages/bar/stories/bar.stories.tsx | 3 +- packages/bar/tests/Bar.test.tsx | 6 +- packages/bump/index.d.ts | 2 +- packages/bump/src/area-bump/AreaBump.js | 9 +- packages/bump/src/area-bump/hooks.js | 18 +- packages/bump/src/bump/hooks.js | 6 +- packages/chord/src/ChordCanvas.js | 33 +- packages/chord/src/ChordRibbons.js | 12 +- packages/circle-packing/src/CirclePacking.tsx | 11 +- packages/circle-packing/src/Circles.tsx | 7 +- packages/circle-packing/src/types.ts | 1 + packages/geo/src/Choropleth.js | 8 +- packages/geo/src/ChoroplethCanvas.js | 8 +- packages/geo/src/GeoMap.js | 8 +- packages/geo/src/GeoMapCanvas.js | 8 +- packages/geo/src/hooks.js | 22 +- packages/line/src/hooks.js | 6 +- packages/line/stories/line.stories.js | 54 +- packages/marimekko/src/Marimekko.tsx | 35 +- packages/network/src/AnimatedNodes.js | 14 +- .../src/ParallelCoordinates.js | 25 +- .../src/ParallelCoordinatesCanvas.js | 25 +- packages/pie/src/PieCanvas.tsx | 37 +- packages/pie/src/props.ts | 2 +- packages/recompose/src/compose.ts | 4 +- packages/recompose/src/defaultProps.ts | 20 +- packages/recompose/src/mapProps.ts | 20 +- packages/recompose/src/setStatic.ts | 19 +- packages/recompose/src/shouldUpdate.ts | 38 +- packages/recompose/src/types.ts | 5 +- packages/recompose/src/withPropsOnChange.ts | 79 +- packages/recompose/src/withState.ts | 80 +- packages/sankey/src/hooks.ts | 2 +- packages/scales/src/compute.ts | 4 +- packages/scales/src/linearScale.ts | 2 +- packages/scales/src/timeScale.ts | 2 +- packages/scales/tests/ticks.test.ts | 12 +- packages/scatterplot/src/props.tsx | 5 +- packages/stream/src/hooks.ts | 7 +- packages/stream/src/props.ts | 7 +- packages/stream/src/types.ts | 4 +- packages/sunburst/src/Sunburst.tsx | 3 +- packages/sunburst/src/props.ts | 2 +- packages/sunburst/src/types.ts | 1 + packages/swarmplot/src/Circles.tsx | 7 +- packages/swarmplot/src/hooks.ts | 11 +- packages/voronoi/src/hooks.ts | 23 +- packages/waffle/src/WaffleCanvas.js | 12 +- website/src/components/icons/BulletIcon.js | 6 +- .../src/components/icons/RadialBarIcon.tsx | 4 +- website/src/components/icons/SwarmPlotIcon.js | 30 +- website/src/data/components/bar/props.ts | 3 +- website/src/data/components/chord/props.ts | 3 +- .../data/components/circle-packing/meta.yml | 5 +- .../data/components/circle-packing/props.ts | 3 +- website/src/data/components/line/props.ts | 6 +- website/src/data/components/pie/props.ts | 3 +- website/src/data/components/radar/props.ts | 3 +- .../src/data/components/radial-bar/props.ts | 3 +- website/src/data/components/sankey/props.ts | 3 +- website/src/data/components/sunburst/props.ts | 3 +- .../src/data/components/swarmplot/props.ts | 6 +- website/src/data/components/treemap/props.ts | 5 +- website/src/data/nav.js | 13 +- website/src/lib/settings.ts | 27 +- website/src/pages/circle-packing/api.js | 7 +- website/src/pages/sankey/api.js | 4 - website/src/pages/sunburst/api.js | 2 +- website/src/pages/treemap/api.js | 17 +- website/src/styles/icons.css | 1553 +++++++++-------- yarn.lock | 544 +++--- 124 files changed, 2667 insertions(+), 2484 deletions(-) create mode 100644 api/nodemon.json rename api/src/{app.js => app.ts} (58%) delete mode 100644 api/src/lib/middlewares/validationMiddleware.js delete mode 100644 api/src/lib/render/index.js create mode 100644 api/src/lib/renderer.ts create mode 100644 api/src/lib/storage.ts delete mode 100644 api/src/lib/storage/index.js create mode 100644 api/src/lib/types.ts create mode 100644 api/src/lib/validation.ts delete mode 100644 api/src/mapping/bar.js create mode 100644 api/src/mapping/bar.ts delete mode 100644 api/src/mapping/bubble.js delete mode 100644 api/src/mapping/calendar.js create mode 100644 api/src/mapping/calendar.ts delete mode 100644 api/src/mapping/chord.js create mode 100644 api/src/mapping/chord.ts create mode 100644 api/src/mapping/circle_packing.ts delete mode 100644 api/src/mapping/common.js create mode 100644 api/src/mapping/common.ts rename api/src/mapping/commons/{colors.js => colors.ts} (51%) create mode 100644 api/src/mapping/commons/curves.ts rename api/src/mapping/commons/{dimensions.js => dimensions.ts} (50%) delete mode 100644 api/src/mapping/commons/scales.js create mode 100644 api/src/mapping/commons/scales.ts delete mode 100644 api/src/mapping/heatmap.js create mode 100644 api/src/mapping/heatmap.ts delete mode 100644 api/src/mapping/index.js create mode 100644 api/src/mapping/index.ts delete mode 100644 api/src/mapping/line.js create mode 100644 api/src/mapping/line.ts delete mode 100644 api/src/mapping/pie.js create mode 100644 api/src/mapping/pie.ts delete mode 100644 api/src/mapping/radar.js create mode 100644 api/src/mapping/radar.ts delete mode 100644 api/src/mapping/sankey.js create mode 100644 api/src/mapping/sankey.ts delete mode 100644 api/src/mapping/sunburst.js create mode 100644 api/src/mapping/sunburst.ts delete mode 100644 api/src/mapping/treemap.js create mode 100644 api/src/mapping/treemap.ts rename api/src/samples/{index.js => index.ts} (71%) create mode 100644 api/tsconfig.json diff --git a/api/misc/readmeData.js b/api/misc/readmeData.js index 945d79ec38..803dd4a0d0 100644 --- a/api/misc/readmeData.js +++ b/api/misc/readmeData.js @@ -1,11 +1,3 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016 Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ 'use strict' const _ = require('lodash') diff --git a/api/nodemon.json b/api/nodemon.json new file mode 100644 index 0000000000..d014886e8d --- /dev/null +++ b/api/nodemon.json @@ -0,0 +1,12 @@ +{ + "restartable": "rs", + "ignore": ["node_modules/", "dist/", "coverage/"], + "watch": ["src/"], + "execMap": { + "ts": "node -r ts-node/register" + }, + "env": { + "NODE_ENV": "development" + }, + "ext": "js,json,ts" +} \ No newline at end of file diff --git a/api/package.json b/api/package.json index 7ca2d44adf..3bf02a5c70 100644 --- a/api/package.json +++ b/api/package.json @@ -42,22 +42,31 @@ "@nivo/treemap": "0.74.1", "@nivo/voronoi": "0.74.1", "@nivo/waffle": "0.74.1", + "@types/body-parser": "^1.19.2", + "@types/cors": "^2.8.12", + "@types/express": "^4.17.13", + "@types/node": "^16.11.12", + "@types/react": "17.0.11", + "@types/react-dom": "17.0.8", + "@types/uuid": "^8.3.3", "body-parser": "^1.17.2", "compression": "^1.7.0", - "cors": "^2.8.4", - "express": "^4.15.4", - "express-winston": "^2.4.0", - "joi": "^14.3.0", + "cors": "2.8.5", + "express": "4.17.1", + "express-winston": "4.2.0", + "joi": "17.5.0", "lodash": "^4.17.21", "react": "^17.0.2", "react-dom": "^17.0.2", + "ts-node": "^10.4.0", + "typescript": "^4.3.4", "uuid": "^3.1.0", - "winston": "^2.3.1" + "winston": "3.3.3" }, "scripts": { "readme": "node misc/readmeData.js | mustache - misc/README.mustache > README.md", - "start": "node src/app.js", - "dev": "nodemon src/app.js" + "start": "node src/app.ts", + "dev": "nodemon src/app.ts" }, "publishConfig": { "access": "public" diff --git a/api/src/app.js b/api/src/app.ts similarity index 58% rename from api/src/app.js rename to api/src/app.ts index 4f2e0da7b6..b11a1f62e0 100644 --- a/api/src/app.js +++ b/api/src/app.ts @@ -1,28 +1,19 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016 Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const express = require('express') -const cors = require('cors') -const bodyParser = require('body-parser') -const compression = require('compression') -const path = require('path') -const uuid = require('uuid') -const _ = require('lodash') -const winston = require('winston') -const expressWinston = require('express-winston') +import path from 'path' +import express from 'express' +import { forOwn } from 'lodash' +import * as uuid from 'uuid' +import cors from 'cors' +import bodyParser from 'body-parser' +import compression from 'compression' +import winston from 'winston' +import expressWinston from 'express-winston' +import { renderChart } from './lib/renderer' +import * as storage from './lib/storage' +import { validate } from './lib/validation' +import samples from './samples' +import { chartsMapping, ChartType } from './mapping' + const app = express() -const validate = require('./lib/middlewares/validationMiddleware') -const storage = require('./lib/storage') -const mapping = require('./mapping') -const samples = require('./samples') -const render = require('./lib/render') app.enable('trust proxy') app.set('json spaces', 4) @@ -30,12 +21,8 @@ app.use(cors()) app.use(bodyParser.json()) app.use( expressWinston.logger({ - transports: [ - new winston.transports.Console({ - json: false, - colorize: true, - }), - ], + transports: [new winston.transports.Console()], + format: winston.format.combine(winston.format.colorize(), winston.format.simple()), meta: false, expressFormat: true, colorize: true, @@ -44,7 +31,6 @@ app.use( app.use(compression()) app.get('/', (req, res) => { - console.log('sending') res.sendFile(path.resolve(__dirname, 'api.yml')) }) @@ -55,13 +41,15 @@ app.get('/status', (req, res) => { protocol: req.protocol, host: req.get('host'), env: { + // @ts-ignore NODE_ENV: process.NODE_ENV, }, }) }) -_.forOwn(mapping, ({ schema }, type) => { +forOwn(chartsMapping, ({ schema }, type: ChartType) => { app.post(`/charts/${type}`, validate(schema), (req, res) => { + // @ts-ignore const props = req.payload const id = uuid.v4() const url = `${req.protocol}://${req.get('host')}/r/${id}` @@ -82,20 +70,28 @@ app.get('/r', (req, res) => { app.get('/r/:id', (req, res) => { const { id } = req.params - const config = storage.get(req.params.id) + const config = storage.get(req.params.id) if (!config) { return res.status(404).send(`no chart found for id "${id}"`) } - const rendered = render.chart(config, req.query) + const rendered = renderChart(config, req.query) res.set('Content-Type', 'image/svg+xml').status(200).send(rendered) }) -_.forOwn(samples, (config, id) => { +app.get('/samples', (req, res) => { + res.status(200).json({ + samples: Object.keys(samples).map(sample => { + return `${req.protocol}://${req.get('host')}/samples/${sample}.svg` + }), + }) +}) + +forOwn(samples, (config, id) => { app.get(`/samples/${id}.svg`, (req, res) => { - const rendered = render.chart(config, req.query) + const rendered = renderChart(config, req.query) res.set('Content-Type', 'image/svg+xml').status(200).send(rendered) }) diff --git a/api/src/lib/middlewares/validationMiddleware.js b/api/src/lib/middlewares/validationMiddleware.js deleted file mode 100644 index 26f9a71a52..0000000000 --- a/api/src/lib/middlewares/validationMiddleware.js +++ /dev/null @@ -1,36 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016 Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const _ = require('lodash') -const Joi = require('joi') - -module.exports = (schema, options = {}) => { - const { omit } = options - - return (req, res, next) => { - let data = req.body - if (omit) { - data = _.omit(data, omit) - } - - Joi.validate(data, schema, { abortEarly: false }, (err, value) => { - if (err) { - return res.status(400).json({ - errors: err.details.map(({ message, path }) => { - return `${message}${path ? ` (${path})` : ''}` - }), - }) - } - - req.payload = value - next() - }) - } -} diff --git a/api/src/lib/render/index.js b/api/src/lib/render/index.js deleted file mode 100644 index 4ef2fdcf62..0000000000 --- a/api/src/lib/render/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016 Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const _ = require('lodash') -const React = require('react') -const { renderToStaticMarkup } = require('react-dom/server') -const mapping = require('../../mapping') - -const theme = {} - -exports.chart = ({ type, props }, override) => { - const chart = mapping[type] - const overridable = chart.runtimeProps || [] - const rendered = renderToStaticMarkup( - React.createElement(chart.component, { - animate: false, - isInteractive: false, - renderWrapper: false, - theme, - ...chart.defaults, - ...props, - ..._.pick(override, overridable), - }) - ) - - return `${rendered}` -} diff --git a/api/src/lib/renderer.ts b/api/src/lib/renderer.ts new file mode 100644 index 0000000000..9b5c77f520 --- /dev/null +++ b/api/src/lib/renderer.ts @@ -0,0 +1,36 @@ +import { pick } from 'lodash' +import React, { FunctionComponent } from 'react' +import { renderToStaticMarkup } from 'react-dom/server' +import { ChartProps, chartsMapping, ChartType } from '../mapping' + +const staticProps = { + animate: false, + isInteractive: false, + renderWrapper: false, + theme: {}, +} + +export const renderChart = ( + { + type, + props, + }: { + type: T + props: ChartProps + }, + override +) => { + const chart = chartsMapping[type] + const component = chart.component as FunctionComponent> + const mergedProps = { + ...staticProps, + ...chart.defaults, + ...props, + ...pick(override, chart.runtimeProps || []), + } + const rendered = renderToStaticMarkup( + React.createElement>(component, mergedProps) + ) + + return `${rendered}` +} diff --git a/api/src/lib/storage.ts b/api/src/lib/storage.ts new file mode 100644 index 0000000000..2400e2b8ea --- /dev/null +++ b/api/src/lib/storage.ts @@ -0,0 +1,19 @@ +import { ChartProps, ChartType } from '../mapping' + +export interface StorageEntry { + type: T + props: ChartProps + url: string +} + +const store: Record> = {} + +export const set = (key: string, value: StorageEntry) => { + store[key] = value +} + +export const get = (key: string): StorageEntry | undefined => { + return store[key] +} + +export const dump = () => store diff --git a/api/src/lib/storage/index.js b/api/src/lib/storage/index.js deleted file mode 100644 index dfeada252a..0000000000 --- a/api/src/lib/storage/index.js +++ /dev/null @@ -1,21 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016 Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const store = {} - -exports.set = (key, value) => { - store[key] = value -} - -exports.get = key => { - return store[key] -} - -exports.dump = () => store diff --git a/api/src/lib/types.ts b/api/src/lib/types.ts new file mode 100644 index 0000000000..112530944d --- /dev/null +++ b/api/src/lib/types.ts @@ -0,0 +1 @@ +export type OmitStrict = T extends any ? Pick> : never diff --git a/api/src/lib/validation.ts b/api/src/lib/validation.ts new file mode 100644 index 0000000000..ff5ff92f54 --- /dev/null +++ b/api/src/lib/validation.ts @@ -0,0 +1,33 @@ +import { omit } from 'lodash' +import joi from 'joi' + +export const validate = ( + schema: joi.Schema, + options: { + omit?: string[] + } = {} +) => { + const { omit: omitProps } = options + + return (req, res, next) => { + let data = req.body + if (omit) { + data = omit(data, omitProps) + } + + try { + req.payload = joi.attempt(data, schema, null, { + abortEarly: true, + convert: true, + }) + next() + } catch (err) { + console.log('ERROR', err) + return res.status(400).json({ + errors: err.details.map(({ message, path }) => { + return `${message}${path ? ` (${path})` : ''}` + }), + }) + } + } +} diff --git a/api/src/mapping/bar.js b/api/src/mapping/bar.js deleted file mode 100644 index 536cf3de89..0000000000 --- a/api/src/mapping/bar.js +++ /dev/null @@ -1,56 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016-today Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const Joi = require('joi') -const { Bar } = require('@nivo/bar') -const common = require('./common') -const { dimensions } = require('./commons/dimensions') -const { inheritedColor, ordinalColors } = require('./commons/colors') - -module.exports = { - component: Bar, - schema: Joi.object().keys( - Object.assign({}, dimensions, common.axes, { - data: Joi.array().min(1).required(), - indexBy: Joi.string().required(), - keys: Joi.array().sparse(false).min(1).unique().required(), - - groupMode: Joi.any().valid(['grouped', 'stacked']), - layout: Joi.any().valid(['horizontal', 'vertical']), - reverse: Joi.boolean(), - - minValue: Joi.alternatives().try(Joi.any().valid('auto'), Joi.number()).required(), - maxValue: Joi.alternatives().try(Joi.any().valid('auto'), Joi.number()).required(), - padding: Joi.number(), - innerPadding: Joi.number(), - - borderRadius: Joi.number().min(0), - borderWidth: Joi.number().min(0), - borderColor: inheritedColor, - - enableGridX: Joi.boolean(), - enableGridY: Joi.boolean(), - - enableLabel: Joi.boolean(), - label: Joi.string(), - labelSkipWidth: Joi.number(), - labelSkipHeight: Joi.number(), - labelLinkColor: Joi.string(), - labelTextColor: inheritedColor, - - colors: ordinalColors, - colorBy: Joi.string(), - }) - ), - runtimeProps: ['width', 'height', 'colors', 'groupMode'], - defaults: { - margin: { top: 40, right: 50, bottom: 40, left: 50 }, - }, -} diff --git a/api/src/mapping/bar.ts b/api/src/mapping/bar.ts new file mode 100644 index 0000000000..1ebae4ec21 --- /dev/null +++ b/api/src/mapping/bar.ts @@ -0,0 +1,89 @@ +import { FunctionComponent } from 'react' +import Joi from 'joi' +import { Bar, BarSvgProps } from '@nivo/bar' +import { OmitStrict } from '../lib/types' +import { custom, axes } from './common' +import { dimensions } from './commons/dimensions' +import { inheritedColor, ordinalColors } from './commons/colors' + +// filter out all dynamic properties +export type BarApiProps = OmitStrict< + BarSvgProps, + | 'isInteractive' + | 'animate' + | 'motionConfig' + | 'onClick' + | 'onMouseEnter' + | 'onMouseLeave' + | 'tooltip' + | 'tooltipLabel' + | 'layers' + | 'role' + | 'ariaLabel' + | 'ariaLabelledBy' + | 'ariaDescribedBy' + | 'isFocusable' + | 'barAriaLabel' + | 'barAriaLabelledBy' + | 'barAriaDescribedBy' + | 'renderWrapper' + | 'initialHiddenIds' +> + +const barMapping = { + component: Bar as FunctionComponent, + schema: Joi.object().keys({ + width: dimensions.width, + height: dimensions.height, + margin: dimensions.margin, + data: custom.array().min(1).required(), + indexBy: Joi.string().required(), + keys: Joi.array().sparse(false).min(1).unique().required(), + indexScale: Joi.object() + .keys({ + type: Joi.any().valid('band'), + round: Joi.boolean(), + }) + .allow(null), + valueScale: Joi.object() + .keys({ + type: Joi.any().valid('linear'), + }) + .allow(null), + + groupMode: Joi.any().valid('grouped', 'stacked'), + layout: Joi.any().valid('horizontal', 'vertical'), + reverse: Joi.boolean(), + + minValue: Joi.alternatives().try(Joi.any().valid('auto'), Joi.number()).required(), + maxValue: Joi.alternatives().try(Joi.any().valid('auto'), Joi.number()).required(), + padding: Joi.number(), + innerPadding: Joi.number(), + + borderRadius: Joi.number().min(0), + borderWidth: Joi.number().min(0), + borderColor: inheritedColor, + + enableGridX: Joi.boolean(), + enableGridY: Joi.boolean(), + axisTop: axes.axisTop, + axisRight: axes.axisRight, + axisBottom: axes.axisBottom, + axisLeft: axes.axisLeft, + + enableLabel: Joi.boolean(), + label: Joi.string(), + labelSkipWidth: Joi.number(), + labelSkipHeight: Joi.number(), + labelTextColor: inheritedColor, + + colors: ordinalColors, + colorBy: Joi.string(), + }), + runtimeProps: ['width', 'height', 'colors', 'groupMode'], + defaults: { + margin: { top: 40, right: 50, bottom: 40, left: 50 }, + }, +} + +export default barMapping diff --git a/api/src/mapping/bubble.js b/api/src/mapping/bubble.js deleted file mode 100644 index da473ad3e5..0000000000 --- a/api/src/mapping/bubble.js +++ /dev/null @@ -1,41 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016 Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const Joi = require('joi') -const { Bubble } = require('@nivo/circle-packing') -const { dimensions } = require('./commons/dimensions') -const { inheritedColor, ordinalColors } = require('./commons/colors') - -module.exports = { - component: Bubble, - schema: Joi.object().keys( - Object.assign({}, dimensions, { - root: Joi.object().required(), - identity: Joi.string().required(), - value: Joi.string().required(), - padding: Joi.number(), - leavesOnly: Joi.boolean(), - borderWidth: Joi.number(), - borderColor: inheritedColor, - enableLabel: Joi.boolean(), - label: Joi.string(), - labelFormat: Joi.string(), - labelTextColor: inheritedColor, - labelTextDY: Joi.number(), - labelSkipRadius: Joi.number(), - - colors: ordinalColors, - colorBy: Joi.string(), - }) - ), - defaults: { - margin: { top: 0, right: 0, bottom: 0, left: 0 }, - }, -} diff --git a/api/src/mapping/calendar.js b/api/src/mapping/calendar.js deleted file mode 100644 index 61d41cdcd0..0000000000 --- a/api/src/mapping/calendar.js +++ /dev/null @@ -1,39 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016 Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const Joi = require('joi') -const { Calendar } = require('@nivo/calendar') -const { dimensions } = require('./commons/dimensions') - -module.exports = { - component: Calendar, - schema: Joi.object().keys( - Object.assign({}, dimensions, { - from: Joi.string().required(), - to: Joi.string().required(), - data: Joi.array().min(1).required(), - colors: Joi.string(), - direction: Joi.any().valid(['horizontal', 'vertical']), - yearSpacing: Joi.number(), - yearLegendOffset: Joi.number(), - daySpacing: Joi.number(), - dayBorderWidth: Joi.number(), - dayBorderColor: Joi.string(), - monthBorderWidth: Joi.number(), - monthBorderColor: Joi.string(), - monthLegendOffset: Joi.number(), - }) - ), - runtimeProps: ['width', 'height', 'colors', 'direction'], - defaults: { - animate: false, - margin: { top: 40, right: 50, bottom: 40, left: 50 }, - }, -} diff --git a/api/src/mapping/calendar.ts b/api/src/mapping/calendar.ts new file mode 100644 index 0000000000..08b143961d --- /dev/null +++ b/api/src/mapping/calendar.ts @@ -0,0 +1,61 @@ +import { FunctionComponent } from 'react' +import Joi from 'joi' +import { Calendar, CalendarSvgProps } from '@nivo/calendar' +import { custom } from './common' +import { dimensions } from './commons/dimensions' +import { OmitStrict } from '../lib/types' + +export type CalendarApiProps = OmitStrict< + CalendarSvgProps, + 'isInteractive' | 'onClick' | 'tooltip' | 'renderWrapper' | 'role' +> + +const calendarMapping = { + component: Calendar as FunctionComponent, + schema: Joi.object().keys({ + data: custom.array().min(1).required(), + from: Joi.string().required(), + to: Joi.string().required(), + width: dimensions.width, + height: dimensions.height, + direction: Joi.any().valid('horizontal', 'vertical'), + margin: dimensions.margin, + align: Joi.any().valid( + 'center', + 'top', + 'top-right', + 'right', + 'bottom-right', + 'bottom', + 'bottom-left', + 'left', + 'top-left' + ), + minValue: Joi.alternatives().try(Joi.valid('auto'), Joi.number()), + maxValue: Joi.alternatives().try(Joi.valid('auto'), Joi.number()), + + colors: Joi.array().items(Joi.string()), + emptyColor: Joi.string(), + + yearSpacing: Joi.number().min(0), + yearLegendPosition: Joi.any().valid('before', 'after'), + yearLegendOffset: Joi.number(), + + monthSpacing: Joi.number().min(0), + monthBorderWidth: Joi.number().min(0), + monthBorderColor: Joi.string(), + monthLegendPosition: Joi.any().valid('before', 'after'), + monthLegendOffset: Joi.number(), + + daySpacing: Joi.number(), + dayBorderWidth: Joi.number(), + dayBorderColor: Joi.string(), + }), + runtimeProps: ['width', 'height', 'colors', 'direction'], + defaults: { + animate: false, + margin: { top: 40, right: 50, bottom: 40, left: 50 }, + }, +} + +export default calendarMapping diff --git a/api/src/mapping/chord.js b/api/src/mapping/chord.js deleted file mode 100644 index d1f567b0bb..0000000000 --- a/api/src/mapping/chord.js +++ /dev/null @@ -1,58 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016 Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const Joi = require('joi') -const { Chord } = require('@nivo/chord') -const { ordinalColors, inheritedColor } = require('./commons/colors') -const { dimensions } = require('./commons/dimensions') - -module.exports = { - component: Chord, - schema: Joi.object().keys( - Object.assign({}, dimensions, { - matrix: Joi.array().required(), - keys: Joi.array().required(), - - padAngle: Joi.number(), - innerRadiusRatio: Joi.number().min(0).max(1), - innerRadiusOffset: Joi.number().min(0).max(1), - - ribbonOpacity: Joi.number().min(0).max(1), - ribbonBorderWidth: Joi.number().min(0), - ribbonBorderColor: inheritedColor, - - arcOpacity: Joi.number().min(0).max(1), - arcBorderWidth: Joi.number().min(0), - arcBorderColor: inheritedColor, - - enableLabel: Joi.boolean(), - label: Joi.string(), - labelOffset: Joi.number(), - labelRotation: Joi.number(), - labelTextColor: inheritedColor, - - colors: ordinalColors, - colorBy: Joi.string(), - }) - ), - runtimeProps: [ - 'width', - 'height', - 'padAngle', - 'innerRadiusRatio', - 'innerRadiusOffset', - 'ribbonOpacity', - 'arcOpacity', - 'colors', - ], - defaults: { - margin: { top: 0, right: 0, bottom: 0, left: 0 }, - }, -} diff --git a/api/src/mapping/chord.ts b/api/src/mapping/chord.ts new file mode 100644 index 0000000000..a05d185eae --- /dev/null +++ b/api/src/mapping/chord.ts @@ -0,0 +1,79 @@ +import { FunctionComponent } from 'react' +import Joi from 'joi' +import { Dimensions } from '@nivo/core' +import { Chord, ChordProps } from '@nivo/chord' +import { custom, blendMode } from './common' +import { ordinalColors, inheritedColor } from './commons/colors' +import { dimensions } from './commons/dimensions' +import { OmitStrict } from '../lib/types' + +// filter out all dynamic properties +export type ChordApiProps = OmitStrict< + ChordProps & Dimensions, + | 'isInteractive' + | 'animate' + | 'motionStiffness' + | 'motionDamping' + | 'onRibbonMouseEnter' + | 'onRibbonMouseMove' + | 'onRibbonMouseLeave' + | 'onRibbonClick' + | 'ribbonTooltip' + | 'ribbonHoverOpacity' + | 'ribbonHoverOthersOpacity' + | 'onArcMouseEnter' + | 'onArcMouseMove' + | 'onArcMouseLeave' + | 'arcTooltip' + | 'arcHoverOpacity' + | 'arcHoverOthersOpacity' + | 'onArcClick' + | 'layers' +> + +const chordMapping = { + component: Chord as unknown as FunctionComponent, + schema: Joi.object().keys({ + width: dimensions.width, + height: dimensions.height, + margin: dimensions.margin, + + matrix: custom.array().required(), + keys: Joi.array().required(), + + padAngle: Joi.number(), + innerRadiusRatio: Joi.number().min(0).max(1), + innerRadiusOffset: Joi.number().min(0).max(1), + + ribbonOpacity: Joi.number().min(0).max(1), + ribbonBorderWidth: Joi.number().min(0), + ribbonBorderColor: inheritedColor, + + arcOpacity: Joi.number().min(0).max(1), + arcBorderWidth: Joi.number().min(0), + arcBorderColor: inheritedColor, + + enableLabel: Joi.boolean(), + label: Joi.string(), + labelOffset: Joi.number(), + labelRotation: Joi.number(), + labelTextColor: inheritedColor, + + colors: ordinalColors, + }), + runtimeProps: [ + 'width', + 'height', + 'padAngle', + 'innerRadiusRatio', + 'innerRadiusOffset', + 'ribbonOpacity', + 'arcOpacity', + 'colors', + ], + defaults: { + margin: { top: 0, right: 0, bottom: 0, left: 0 }, + }, +} + +export default chordMapping diff --git a/api/src/mapping/circle_packing.ts b/api/src/mapping/circle_packing.ts new file mode 100644 index 0000000000..6d87b5682a --- /dev/null +++ b/api/src/mapping/circle_packing.ts @@ -0,0 +1,52 @@ +import { FunctionComponent } from 'react' +import Joi from 'joi' +import { CirclePacking, CirclePackingSvgProps } from '@nivo/circle-packing' +import { custom } from './common' +import { dimensions } from './commons/dimensions' +import { inheritedColor, ordinalColors } from './commons/colors' +import { OmitStrict } from '../lib/types' + +export type CirclePackingApiProps = OmitStrict< + CirclePackingSvgProps, + | 'isInteractive' + | 'onMouseEnter' + | 'onMouseMove' + | 'onMouseLeave' + | 'onClick' + | 'zoomedId' + | 'animate' + | 'motionConfig' +> + +const circlePackingMapping = { + component: CirclePacking as FunctionComponent, + schema: Joi.object().keys({ + data: custom.object().required(), + id: Joi.string(), + value: Joi.string(), + valueFormat: Joi.string(), + padding: Joi.number(), + leavesOnly: Joi.boolean(), + width: dimensions.width, + height: dimensions.height, + margin: dimensions.margin, + + colors: ordinalColors, + colorBy: Joi.any().valid('id', 'depth'), + inheritColorFromParent: Joi.boolean(), + childColor: inheritedColor, + borderWidth: Joi.number(), + borderColor: inheritedColor, + + enableLabels: Joi.boolean(), + label: Joi.string(), + labelsSkipRadius: Joi.number(), + labelTextColor: inheritedColor, + }), + runtimeProps: ['width', 'height', 'colors'], + defaults: { + margin: { top: 0, right: 0, bottom: 0, left: 0 }, + }, +} + +export default circlePackingMapping diff --git a/api/src/mapping/common.js b/api/src/mapping/common.js deleted file mode 100644 index 81437551f6..0000000000 --- a/api/src/mapping/common.js +++ /dev/null @@ -1,51 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016-today Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const Joi = require('joi') - -exports.axis = Joi.object() - .keys({ - orient: Joi.any().valid('top', 'right', 'bottom', 'left'), - - tickSize: Joi.number().min(0), - tickPadding: Joi.number(), - tickRotation: Joi.number(), - - legend: Joi.string().empty(''), - legendPosition: Joi.any().valid('start', 'middle', 'end'), - legendOffset: Joi.number(), - }) - .allow(null) - -exports.axes = { - axisTop: exports.axis, - axisRight: exports.axis, - axisBottom: exports.axis, - axisLeft: exports.axis, -} - -exports.blendMode = Joi.valid([ - 'normal', - 'multiply', - 'screen', - 'overlay', - 'darken', - 'lighten', - 'color-dodge', - 'color-burn', - 'hard-light', - 'soft-light', - 'difference', - 'exclusion', - 'hue', - 'saturation', - 'color', - 'luminosity', -]) diff --git a/api/src/mapping/common.ts b/api/src/mapping/common.ts new file mode 100644 index 0000000000..5d20f6caee --- /dev/null +++ b/api/src/mapping/common.ts @@ -0,0 +1,72 @@ +import Joi from 'joi' + +export const custom = Joi.extend( + { + type: 'array', + base: Joi.array(), + coerce: { + from: 'string', + method: (value, helpers) => { + if (typeof value !== 'string') return + + try { + return { value: JSON.parse(value) } + } catch (ignoreErr) {} + }, + }, + }, + { + type: 'object', + base: Joi.object(), + coerce: { + from: 'string', + method: (value, helpers) => { + if (typeof value !== 'string') return + + try { + return { value: JSON.parse(value) } + } catch (ignoreErr) {} + }, + }, + } +) + +export const axis = Joi.object() + .keys({ + orient: Joi.any().valid('top', 'right', 'bottom', 'left'), + + tickSize: Joi.number().min(0), + tickPadding: Joi.number(), + tickRotation: Joi.number(), + + legend: Joi.string().empty(''), + legendPosition: Joi.any().valid('start', 'middle', 'end'), + legendOffset: Joi.number(), + }) + .allow(null) + +export const axes = { + axisTop: exports.axis, + axisRight: exports.axis, + axisBottom: exports.axis, + axisLeft: exports.axis, +} + +export const blendMode = Joi.valid( + 'normal', + 'multiply', + 'screen', + 'overlay', + 'darken', + 'lighten', + 'color-dodge', + 'color-burn', + 'hard-light', + 'soft-light', + 'difference', + 'exclusion', + 'hue', + 'saturation', + 'color', + 'luminosity' +) diff --git a/api/src/mapping/commons/colors.js b/api/src/mapping/commons/colors.ts similarity index 51% rename from api/src/mapping/commons/colors.js rename to api/src/mapping/commons/colors.ts index d8e4b80ef3..1216c38870 100644 --- a/api/src/mapping/commons/colors.js +++ b/api/src/mapping/commons/colors.ts @@ -1,17 +1,7 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016-today Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' +import Joi from 'joi' +import { colorSchemeIds } from '@nivo/colors' -const Joi = require('joi') -const { colorSchemeIds } = require('@nivo/colors') - -exports.ordinalColors = Joi.alternatives().try( +export const ordinalColors = Joi.alternatives().try( Joi.array().items(Joi.string()), Joi.object().keys({ scheme: Joi.valid(...colorSchemeIds).required(), @@ -22,7 +12,7 @@ exports.ordinalColors = Joi.alternatives().try( }) ) -exports.inheritedColor = Joi.alternatives().try( +export const inheritedColor = Joi.alternatives().try( Joi.string(), Joi.object().keys({ theme: Joi.string().required(), diff --git a/api/src/mapping/commons/curves.ts b/api/src/mapping/commons/curves.ts new file mode 100644 index 0000000000..0b525d9636 --- /dev/null +++ b/api/src/mapping/commons/curves.ts @@ -0,0 +1,8 @@ +import Joi from 'joi' + +export const closedCurve = Joi.valid( + 'basisClosed', + 'cardinalClosed', + 'catmullRomClosed', + 'linearClosed' +) diff --git a/api/src/mapping/commons/dimensions.js b/api/src/mapping/commons/dimensions.ts similarity index 50% rename from api/src/mapping/commons/dimensions.js rename to api/src/mapping/commons/dimensions.ts index adebbb1ebc..344455b21c 100644 --- a/api/src/mapping/commons/dimensions.js +++ b/api/src/mapping/commons/dimensions.ts @@ -1,16 +1,6 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016-today Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' +import Joi from 'joi' -const Joi = require('joi') - -exports.dimensions = { +export const dimensions = { width: Joi.number().integer().required(), height: Joi.number().integer().required(), margin: Joi.object().keys({ diff --git a/api/src/mapping/commons/scales.js b/api/src/mapping/commons/scales.js deleted file mode 100644 index 994ddc4617..0000000000 --- a/api/src/mapping/commons/scales.js +++ /dev/null @@ -1,30 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016-today Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const Joi = require('joi') - -exports.linearScale = Joi.object().keys({ - type: Joi.valid('linear').required(), - min: Joi.alternatives().try(Joi.valid('auto'), Joi.number()), - max: Joi.alternatives().try(Joi.valid('auto'), Joi.number()), - stacked: Joi.boolean(), -}) - -exports.pointScale = Joi.object().keys({ - type: Joi.valid('point').required(), -}) - -exports.timeScale = Joi.object().keys({ - type: Joi.valid('time').required(), - format: Joi.string().required(), - precision: Joi.string().required(), -}) - -exports.scale = Joi.alternatives().try(exports.linearScale, exports.pointScale, exports.timeScale) diff --git a/api/src/mapping/commons/scales.ts b/api/src/mapping/commons/scales.ts new file mode 100644 index 0000000000..c0a3e1c2b3 --- /dev/null +++ b/api/src/mapping/commons/scales.ts @@ -0,0 +1,20 @@ +import Joi from 'joi' + +export const linearScale = Joi.object().keys({ + type: Joi.valid('linear').required(), + min: Joi.alternatives().try(Joi.valid('auto'), Joi.number()), + max: Joi.alternatives().try(Joi.valid('auto'), Joi.number()), + stacked: Joi.boolean(), +}) + +export const pointScale = Joi.object().keys({ + type: Joi.valid('point').required(), +}) + +export const timeScale = Joi.object().keys({ + type: Joi.valid('time').required(), + format: Joi.string().required(), + precision: Joi.string().required(), +}) + +export const scale = Joi.alternatives().try(linearScale, pointScale, timeScale) diff --git a/api/src/mapping/heatmap.js b/api/src/mapping/heatmap.js deleted file mode 100644 index 05c7e55b4a..0000000000 --- a/api/src/mapping/heatmap.js +++ /dev/null @@ -1,50 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016-today Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const Joi = require('joi') -const { HeatMap } = require('@nivo/heatmap') -const { dimensions } = require('./commons/dimensions') -const { inheritedColor } = require('./commons/colors') -const common = require('./common') - -module.exports = { - component: HeatMap, - schema: Joi.object().keys( - Object.assign({}, dimensions, common.axes, { - data: Joi.array().min(1).required(), - indexBy: Joi.string().required(), - keys: Joi.array().sparse(false).min(1).unique().required(), - - minValue: Joi.alternatives().try(Joi.any().valid('auto'), Joi.number()).required(), - maxValue: Joi.alternatives().try(Joi.any().valid('auto'), Joi.number()).required(), - - forceSquare: Joi.boolean(), - sizeVariation: Joi.number().min(0).max(1), - padding: Joi.number(), - - cellShape: Joi.any().valid(['rect', 'circle']), - cellOpacity: Joi.number().min(0).max(1), - cellBorderWidth: Joi.number().min(0), - cellBorderColor: inheritedColor, - - enableGridX: Joi.boolean(), - enableGridY: Joi.boolean(), - - enableLabels: Joi.boolean(), - labelTextColor: inheritedColor, - - colors: Joi.string(), - }) - ), - runtimeProps: ['width', 'height', 'colors'], - defaults: { - margin: { top: 60, right: 0, bottom: 0, left: 60 }, - }, -} diff --git a/api/src/mapping/heatmap.ts b/api/src/mapping/heatmap.ts new file mode 100644 index 0000000000..7f19ac2ac3 --- /dev/null +++ b/api/src/mapping/heatmap.ts @@ -0,0 +1,58 @@ +import { FunctionComponent } from 'react' +import Joi from 'joi' +import { Dimensions } from '@nivo/core' +import { HeatMap, HeatMapSvgProps } from '@nivo/heatmap' +import { custom } from './common' +import { dimensions } from './commons/dimensions' +import { inheritedColor } from './commons/colors' +import { axes } from './common' +import { OmitStrict } from '../lib/types' + +export type HeatMapApiProps = OmitStrict< + HeatMapSvgProps & Dimensions, + | 'isInteractive' + | 'onClick' + | 'hoverTarget' + | 'cellHoverOpacity' + | 'cellHoverOthersOpacity' + | 'animate' +> + +const heatMapMapping = { + component: HeatMap as unknown as FunctionComponent, + schema: Joi.object().keys({ + data: custom.array().min(1).required(), + indexBy: Joi.string(), + keys: Joi.array().sparse(false).min(1).unique(), + minValue: Joi.alternatives().try(Joi.any().valid('auto'), Joi.number()).required(), + maxValue: Joi.alternatives().try(Joi.any().valid('auto'), Joi.number()).required(), + forceSquare: Joi.boolean(), + sizeVariation: Joi.number().min(0).max(1), + padding: Joi.number().min(0), + width: dimensions.width, + height: dimensions.height, + margin: dimensions.margin, + + cellShape: Joi.any().valid('rect', 'circle'), + colors: Joi.string(), + cellOpacity: Joi.number().min(0).max(1), + cellBorderWidth: Joi.number().min(0), + cellBorderColor: inheritedColor, + + enableLabels: Joi.boolean(), + labelTextColor: inheritedColor, + + enableGridX: Joi.boolean(), + enableGridY: Joi.boolean(), + axisTop: axes.axisTop, + axisRight: axes.axisRight, + axisBottom: axes.axisBottom, + axisLeft: axes.axisLeft, + }), + runtimeProps: ['width', 'height', 'colors'], + defaults: { + margin: { top: 60, right: 0, bottom: 0, left: 60 }, + }, +} + +export default heatMapMapping diff --git a/api/src/mapping/index.js b/api/src/mapping/index.js deleted file mode 100644 index ad99b0ce6d..0000000000 --- a/api/src/mapping/index.js +++ /dev/null @@ -1,23 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016 Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -module.exports = { - bar: require('./bar'), - bubble: require('./bubble'), - calendar: require('./calendar'), - chord: require('./chord'), - heatmap: require('./heatmap'), - line: require('./line'), - pie: require('./pie'), - radar: require('./radar'), - sankey: require('./sankey'), - sunburst: require('./sunburst'), - treemap: require('./treemap'), -} diff --git a/api/src/mapping/index.ts b/api/src/mapping/index.ts new file mode 100644 index 0000000000..0c50a44aa7 --- /dev/null +++ b/api/src/mapping/index.ts @@ -0,0 +1,32 @@ +import bar from './bar' +import calendar from './calendar' +import chord from './chord' +import circle_packing from './circle_packing' +import heatmap from './heatmap' +import line from './line' +import pie from './pie' +import radar from './radar' +import sankey from './sankey' +import sunburst from './sunburst' +import treemap from './treemap' +import { FunctionComponent } from 'react' + +export const chartsMapping = { + bar, + circle_packing, + calendar, + chord, + heatmap, + line, + pie, + radar, + sankey, + sunburst, + treemap, +} as const + +type ExtractProps = T extends FunctionComponent ? P : never + +export type ChartType = keyof typeof chartsMapping +export type ChartComponent = typeof chartsMapping[T]['component'] +export type ChartProps = ExtractProps> diff --git a/api/src/mapping/line.js b/api/src/mapping/line.js deleted file mode 100644 index 3569eee971..0000000000 --- a/api/src/mapping/line.js +++ /dev/null @@ -1,89 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016 Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const Joi = require('joi') -const { Line } = require('@nivo/line') -const { curvePropKeys } = require('@nivo/core') -const { scale } = require('./commons/scales') -const { ordinalColors, inheritedColor } = require('./commons/colors') -const { dimensions } = require('./commons/dimensions') -const common = require('./common') - -module.exports = { - component: Line, - schema: Joi.object().keys( - Object.assign({}, dimensions, common.axes, { - data: Joi.array() - .items( - Joi.object() - .keys({ - id: Joi.string().required(), - data: Joi.array() - .items( - Joi.object() - .keys({ - x: Joi.alternatives() - .try(Joi.string(), Joi.number()) - .required(), - y: Joi.alternatives() - .try(Joi.string(), Joi.number()) - .required(), - }) - .unknown() - ) - .min(2) - .required(), - }) - .unknown() - ) - .min(1) - .required(), - - xScale: scale, - yScale: scale, - - curve: Joi.any().valid(curvePropKeys), - - enableGridX: Joi.boolean(), - enableGridY: Joi.boolean(), - - lineWidth: Joi.number().min(0), - - enablePoints: Joi.boolean(), - pointSize: Joi.number().min(0), - pointColor: inheritedColor, - pointBorderWidth: Joi.number().min(0), - pointBorderColor: inheritedColor, - enablePointLabel: Joi.boolean(), - pointLabel: Joi.string(), - pointLabelYOffset: Joi.number(), - - enableArea: Joi.boolean(), - areaBlendMode: common.blendMode, - areaBaselineValue: Joi.alternatives().try(Joi.string(), Joi.number()), - areaOpacity: Joi.number(), - - markers: Joi.array().items( - Joi.object().keys({ - axis: Joi.any().valid(['x', 'y']).required(), - value: Joi.alternatives().try(Joi.string(), Joi.number()).required(), - style: Joi.object(), - }) - ), - - colors: ordinalColors, - colorBy: Joi.string(), - }) - ), - runtimeProps: ['width', 'height', 'colors'], - defaults: { - margin: { top: 40, right: 50, bottom: 40, left: 50 }, - }, -} diff --git a/api/src/mapping/line.ts b/api/src/mapping/line.ts new file mode 100644 index 0000000000..04131ee348 --- /dev/null +++ b/api/src/mapping/line.ts @@ -0,0 +1,113 @@ +import Joi from 'joi' +import { Dimensions } from '@nivo/core' +import { Line, LineSvgProps } from '@nivo/line' +// @ts-ignore +import { curvePropKeys } from '@nivo/core' +import { custom, axes, blendMode } from './common' +import { scale } from './commons/scales' +import { ordinalColors, inheritedColor } from './commons/colors' +import { dimensions } from './commons/dimensions' +import { OmitStrict } from '../lib/types' +import { FunctionComponent } from 'react' + +export type LineApiProps = OmitStrict< + LineSvgProps & Dimensions, + | 'layers' + | 'pointSymbol' + | 'isInteractive' + | 'useMesh' + | 'debugMesh' + | 'onMouseEnter' + | 'onMouseMove' + | 'onMouseLeave' + | 'onClick' + | 'tooltip' + | 'enableSlices' + | 'debugSlices' + | 'sliceTooltip' + | 'crosshairType' + | 'animate' + | 'motionConfig' +> + +const lineMapping = { + component: Line as unknown as FunctionComponent, + schema: Joi.object().keys({ + data: custom + .array() + .items( + Joi.object() + .keys({ + id: Joi.string().required(), + data: Joi.array() + .items( + Joi.object() + .keys({ + x: Joi.alternatives() + .try(Joi.string(), Joi.number()) + .required(), + y: Joi.alternatives() + .try(Joi.string(), Joi.number()) + .required(), + }) + .unknown() + ) + .min(2) + .required(), + }) + .unknown() + ) + .min(1) + .required(), + + // xScale: scale, + xScale: Joi.object(), + xFormat: Joi.string(), + // yScale: scale, + yScale: Joi.object(), + yFormat: Joi.string(), + width: dimensions.width, + height: dimensions.height, + margin: dimensions.margin, + + curve: Joi.any().valid(...curvePropKeys), + colors: ordinalColors, + lineWidth: Joi.number().min(0), + enableArea: Joi.boolean(), + areaBaselineValue: Joi.alternatives().try(Joi.string(), Joi.number()), + areaOpacity: Joi.number(), + areaBlendMode: blendMode, + + enablePoints: Joi.boolean(), + pointSize: Joi.number().min(0), + pointColor: inheritedColor, + pointBorderWidth: Joi.number().min(0), + pointBorderColor: inheritedColor, + enablePointLabel: Joi.boolean(), + pointLabel: Joi.string(), + pointLabelYOffset: Joi.number(), + + enableGridX: Joi.boolean(), + gridXValues: Joi.array(), + enableGridY: Joi.boolean(), + gridYValues: Joi.array(), + axisTop: axes.axisTop, + axisRight: axes.axisRight, + axisBottom: axes.axisBottom, + axisLeft: axes.axisLeft, + + markers: Joi.array().items( + Joi.object().keys({ + axis: Joi.any().valid('x', 'y').required(), + value: Joi.alternatives().try(Joi.string(), Joi.number()).required(), + style: Joi.object(), + }) + ), + }), + runtimeProps: ['width', 'height', 'colors'], + defaults: { + margin: { top: 40, right: 50, bottom: 40, left: 50 }, + }, +} + +export default lineMapping diff --git a/api/src/mapping/pie.js b/api/src/mapping/pie.js deleted file mode 100644 index 5820817f35..0000000000 --- a/api/src/mapping/pie.js +++ /dev/null @@ -1,53 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016-today Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const Joi = require('joi') -const { Pie } = require('@nivo/pie') -const { ordinalColors, inheritedColor } = require('./commons/colors') -const { dimensions } = require('./commons/dimensions') - -module.exports = { - component: Pie, - schema: Joi.object().keys( - Object.assign({}, dimensions, { - data: Joi.array().min(1).required(), - - innerRadius: Joi.number().min(0), - padAngle: Joi.number().min(0), - cornerRadius: Joi.number().min(0), - - borderWidth: Joi.number().min(0), - borderColor: inheritedColor, - - enableRadialLabels: Joi.boolean(), - radialLabel: Joi.string(), - radialLabelsSkipAngle: Joi.number().min(0), - radialLabelsTextXOffset: Joi.number(), - radialLabelsTextColor: inheritedColor, - radialLabelsLinkOffset: Joi.number(), - radialLabelsLinkDiagonalLength: Joi.number(), - radialLabelsLinkHorizontalLength: Joi.number(), - radialLabelsLinkStrokeWidth: Joi.number().min(0), - radialLabelsLinkColor: inheritedColor, - - enableSlicesLabels: Joi.boolean(), - sliceLabel: Joi.string(), - slicesLabelsSkipAngle: Joi.number().min(0), - slicesLabelsTextColor: inheritedColor, - - colors: ordinalColors, - colorBy: Joi.string(), - }) - ), - runtimeProps: ['width', 'height', 'colors', 'groupMode'], - defaults: { - margin: { top: 40, right: 50, bottom: 40, left: 50 }, - }, -} diff --git a/api/src/mapping/pie.ts b/api/src/mapping/pie.ts new file mode 100644 index 0000000000..9ab040b781 --- /dev/null +++ b/api/src/mapping/pie.ts @@ -0,0 +1,72 @@ +import { FunctionComponent } from 'react' +import Joi from 'joi' +import { Pie, PieSvgProps } from '@nivo/pie' +import { ordinalColors, inheritedColor } from './commons/colors' +import { dimensions } from './commons/dimensions' +import { OmitStrict } from '../lib/types' +import { custom } from './common' + +export type PieApiProps = OmitStrict< + PieSvgProps, + | 'layers' + | 'isInteractive' + | 'activeInnerRadiusOffset' + | 'activeOuterRadiusOffset' + | 'onMouseEnter' + | 'onMouseMove' + | 'onMouseLeave' + | 'onClick' + | 'tooltip' + | 'animate' + | 'motionConfig' + | 'transitionMode' + | 'renderWrapper' +> + +const pieMapping = { + component: Pie as FunctionComponent, + schema: Joi.object().keys({ + data: custom.array().min(1).required(), + id: Joi.string(), + value: Joi.string(), + valueFormat: Joi.string(), + width: dimensions.width, + height: dimensions.height, + startAngle: Joi.number(), + endAngle: Joi.number(), + fit: Joi.boolean(), + innerRadius: Joi.number().min(0), + padAngle: Joi.number().min(0), + cornerRadius: Joi.number().min(0), + sortByValue: Joi.boolean(), + margin: dimensions.margin, + + theme: Joi.object(), + colors: ordinalColors, + borderWidth: Joi.number().min(0), + borderColor: inheritedColor, + + enableArcLabels: Joi.boolean(), + arcLabel: Joi.string(), + arcLabelsRadiusOffset: Joi.number(), + arcLabelsSkipAngle: Joi.number().min(0), + arcLabelsTextColor: inheritedColor, + + enableArcLinkLabels: Joi.boolean(), + arcLinkLabel: Joi.string(), + arcLinkLabelsSkipAngle: Joi.number().min(0), + arcLinkLabelsOffset: Joi.number(), + arcLinkLabelsDiagonalLength: Joi.number().min(0), + arcLinkLabelsStraightLength: Joi.number().min(0), + arcLinkLabelsTextOffset: Joi.number(), + arcLinkLabelsThickness: Joi.number().min(0), + arcLinkLabelsTextColor: inheritedColor, + arcLinkLabelsColor: inheritedColor, + }), + runtimeProps: ['width', 'height', 'colors', 'groupMode'], + defaults: { + margin: { top: 40, right: 50, bottom: 40, left: 50 }, + }, +} + +export default pieMapping diff --git a/api/src/mapping/radar.js b/api/src/mapping/radar.js deleted file mode 100644 index afc3e9b6fd..0000000000 --- a/api/src/mapping/radar.js +++ /dev/null @@ -1,56 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016-today Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const Joi = require('joi') -const { Radar } = require('@nivo/radar') -const { ordinalColors, inheritedColor } = require('./commons/colors') -const { dimensions } = require('./commons/dimensions') - -module.exports = { - component: Radar, - schema: Joi.object().keys( - Object.assign({}, dimensions, { - data: Joi.array().min(1).required(), - keys: Joi.array().sparse(false).min(1).unique().required(), - indexBy: Joi.string().required(), - maxValue: Joi.alternatives().try(Joi.valid('auto'), Joi.number()), - - curve: Joi.string(), - - borderWidth: Joi.number().min(0), - borderColor: inheritedColor, - - gridLevels: Joi.number().integer().positive(), - gridShape: Joi.any().valid(['linear', 'circular']), - gridLabelOffset: Joi.number(), - - enableLabels: Joi.boolean(), - labelsTextColor: inheritedColor, - labelsLinkColor: Joi.string(), - - enableDots: Joi.boolean(), - dotSize: Joi.number().min(0), - dotColor: inheritedColor, - dotBorderWidth: Joi.number().min(0), - dotBorderColor: inheritedColor, - enableDotLabel: Joi.boolean(), - dotLabel: Joi.string(), - dotLabelYOffset: Joi.number(), - - colors: ordinalColors, - colorBy: Joi.string(), - fillOpacity: Joi.number().min(0).max(1), - }) - ), - runtimeProps: ['width', 'height', 'colors'], - defaults: { - margin: { top: 40, right: 40, bottom: 40, left: 40 }, - }, -} diff --git a/api/src/mapping/radar.ts b/api/src/mapping/radar.ts new file mode 100644 index 0000000000..253ddcccf6 --- /dev/null +++ b/api/src/mapping/radar.ts @@ -0,0 +1,54 @@ +import { FunctionComponent } from 'react' +import Joi from 'joi' +import { Radar, RadarSvgProps } from '@nivo/radar' +import { blendMode, custom } from './common' +import { ordinalColors, inheritedColor } from './commons/colors' +import { dimensions } from './commons/dimensions' +import { closedCurve } from './commons/curves' +import { OmitStrict } from '../lib/types' + +type RadarApiProps = OmitStrict< + RadarSvgProps, + 'renderWrapper' | 'layers' | 'isInteractive' | 'sliceTooltip' | 'animate' | 'motionConfig' +> + +const radarMapping = { + component: Radar as FunctionComponent, + schema: Joi.object().keys({ + data: custom.array().min(1).required(), + indexBy: Joi.string().required(), + keys: Joi.array().sparse(false).min(1).unique().required(), + maxValue: Joi.alternatives().try(Joi.valid('auto'), Joi.number()), + valueFormat: Joi.string(), + curve: closedCurve, + width: dimensions.width, + height: dimensions.height, + margin: dimensions.margin, + + theme: Joi.object(), + colors: ordinalColors, + fillOpacity: Joi.number().min(0).max(1), + blendMode: blendMode, + borderWidth: Joi.number().min(0), + borderColor: inheritedColor, + + gridLevels: Joi.number().integer().positive(), + gridShape: Joi.any().valid('linear', 'circular'), + gridLabelOffset: Joi.number(), + + enableDots: Joi.boolean(), + dotSize: Joi.number().min(0), + dotColor: inheritedColor, + dotBorderWidth: Joi.number().min(0), + dotBorderColor: inheritedColor, + enableDotLabel: Joi.boolean(), + dotLabel: Joi.string(), + dotLabelYOffset: Joi.number(), + }), + runtimeProps: ['width', 'height', 'colors'], + defaults: { + margin: { top: 40, right: 40, bottom: 40, left: 40 }, + }, +} + +export default radarMapping diff --git a/api/src/mapping/sankey.js b/api/src/mapping/sankey.js deleted file mode 100644 index 71de242b2a..0000000000 --- a/api/src/mapping/sankey.js +++ /dev/null @@ -1,77 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016-today Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const Joi = require('joi') -const { Sankey, sankeyAlignmentPropKeys } = require('@nivo/sankey') -const { ordinalColors, inheritedColor } = require('./commons/colors') -const { dimensions } = require('./commons/dimensions') -const common = require('./common') - -module.exports = { - component: Sankey, - schema: Joi.object().keys( - Object.assign({}, dimensions, { - data: Joi.object() - .keys({ - nodes: Joi.array() - .items( - Joi.object() - .keys({ - id: Joi.alternatives().try(Joi.string(), Joi.number()), - }) - .unknown() - ) - .required(), - links: Joi.array() - .items( - Joi.object() - .keys({ - source: Joi.alternatives().try(Joi.string(), Joi.number()), - target: Joi.alternatives().try(Joi.string(), Joi.number()), - value: Joi.number().min(0).required(), - }) - .unknown() - ) - .required(), - }) - .required(), - - layout: Joi.valid('horizontal', 'vertical'), - align: Joi.any().valid(sankeyAlignmentPropKeys), - sort: Joi.valid('auto', 'input', 'ascending', 'descending'), - - nodeOpacity: Joi.number().min(0).max(1), - nodeWidth: Joi.number().min(1), - nodePaddingX: Joi.number().positive(), - nodePaddingY: Joi.number().positive(), - nodeBorderWidth: Joi.number().min(0), - nodeBorderColor: inheritedColor, - - linkOpacity: Joi.number().min(0).max(1), - linkContract: Joi.number(), - linkBlendMode: common.blendMode, - enableLinkGradient: Joi.boolean(), - - enableLabels: Joi.boolean(), - labelPosition: Joi.any().valid(['inside', 'outside']), - labelPadding: Joi.number(), - labelOrientation: Joi.any().valid(['horizontal', 'vertical']), - labelTextColor: inheritedColor, - - colors: ordinalColors, - colorBy: Joi.string(), - }) - ), - runtimeProps: ['width', 'height', 'colors'], - defaults: { - margin: { top: 0, right: 0, bottom: 0, left: 0 }, - linkBlendMode: 'normal', - }, -} diff --git a/api/src/mapping/sankey.ts b/api/src/mapping/sankey.ts new file mode 100644 index 0000000000..52df3e6306 --- /dev/null +++ b/api/src/mapping/sankey.ts @@ -0,0 +1,93 @@ +import { FunctionComponent } from 'react' +import Joi from 'joi' +import { Sankey, SankeySvgProps, sankeyAlignmentPropKeys } from '@nivo/sankey' +import { OmitStrict } from '../lib/types' +import { ordinalColors, inheritedColor } from './commons/colors' +import { dimensions } from './commons/dimensions' +import { blendMode, custom } from './common' + +// filter out all dynamic properties +export type SankeyApiProps = OmitStrict< + SankeySvgProps, + | 'layers' + | 'nodeHoverOpacity' + | 'nodeHoverOthersOpacity' + | 'linkHoverOpacity' + | 'linkHoverOthersOpacity' + | 'isInteractive' + | 'onClick' + | 'nodeTooltip' + | 'linkTooltip' + | 'renderWrapper' + | 'role' + | 'ariaLabel' + | 'ariaLabelledBy' + | 'ariaDescribedBy' +> + +const sankeyMapping = { + component: Sankey as FunctionComponent, + schema: Joi.object().keys({ + width: dimensions.width, + height: dimensions.height, + margin: dimensions.margin, + + data: custom + .object() + .keys({ + nodes: Joi.array() + .items( + Joi.object() + .keys({ + id: Joi.alternatives().try(Joi.string(), Joi.number()), + }) + .unknown() + ) + .required(), + links: Joi.array() + .items( + Joi.object() + .keys({ + source: Joi.alternatives().try(Joi.string(), Joi.number()), + target: Joi.alternatives().try(Joi.string(), Joi.number()), + value: Joi.number().min(0).required(), + }) + .unknown() + ) + .required(), + }) + .required(), + + layout: Joi.valid('horizontal', 'vertical'), + align: Joi.any().valid(...sankeyAlignmentPropKeys), + sort: Joi.valid('auto', 'input', 'ascending', 'descending'), + + nodeOpacity: Joi.number().min(0).max(1), + nodeThickness: Joi.number().min(1), + nodeSpacing: Joi.number().min(0), + nodeInnerPadding: Joi.number().min(0), + nodeBorderRadius: Joi.number().min(0), + nodeBorderWidth: Joi.number().min(0), + nodeBorderColor: inheritedColor, + + linkOpacity: Joi.number().min(0).max(1), + linkContract: Joi.number(), + linkBlendMode: blendMode, + enableLinkGradient: Joi.boolean(), + + enableLabels: Joi.boolean(), + labelPosition: Joi.any().valid('inside', 'outside'), + labelPadding: Joi.number(), + labelOrientation: Joi.any().valid('horizontal', 'vertical'), + labelTextColor: inheritedColor, + + colors: ordinalColors, + }), + runtimeProps: ['width', 'height', 'colors'], + defaults: { + margin: { top: 0, right: 0, bottom: 0, left: 0 }, + linkBlendMode: 'normal', + }, +} + +export default sankeyMapping diff --git a/api/src/mapping/sunburst.js b/api/src/mapping/sunburst.js deleted file mode 100644 index 63a96dbf98..0000000000 --- a/api/src/mapping/sunburst.js +++ /dev/null @@ -1,37 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016-today Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const Joi = require('joi') -const { Sunburst } = require('@nivo/sunburst') -const { ordinalColors, inheritedColor } = require('./commons/colors') -const { dimensions } = require('./commons/dimensions') - -module.exports = { - component: Sunburst, - schema: Joi.object().keys( - Object.assign({}, dimensions, { - data: Joi.object().required(), - identity: Joi.string().required(), - value: Joi.string().required(), - - cornerRadius: Joi.number().min(0), - borderWidth: Joi.number().min(0), - borderColor: inheritedColor, - childColor: inheritedColor, - - colors: ordinalColors, - colorBy: Joi.string(), - }) - ), - runtimeProps: ['width', 'height', 'colors'], - defaults: { - margin: { top: 0, right: 0, bottom: 0, left: 0 }, - }, -} diff --git a/api/src/mapping/sunburst.ts b/api/src/mapping/sunburst.ts new file mode 100644 index 0000000000..34f3a2ba15 --- /dev/null +++ b/api/src/mapping/sunburst.ts @@ -0,0 +1,51 @@ +import { FunctionComponent } from 'react' +import Joi from 'joi' +import { Sunburst, SunburstSvgProps } from '@nivo/sunburst' +import { custom } from './common' +import { ordinalColors, inheritedColor } from './commons/colors' +import { dimensions } from './commons/dimensions' +import { OmitStrict } from '../lib/types' + +export type SunburstApiProps = OmitStrict< + SunburstSvgProps, + | 'isInteractive' + | 'tooltip' + | 'onClick' + | 'animate' + | 'motionConfig' + | 'transitionMode' + | 'renderWrapper' +> + +const sunburstMapping = { + component: Sunburst as FunctionComponent, + schema: Joi.object().keys({ + data: custom.object().required(), + id: Joi.string(), + value: Joi.string(), + valueFormat: Joi.string(), + cornerRadius: Joi.number().min(0), + width: dimensions.width, + height: dimensions.height, + margin: dimensions.margin, + + colors: ordinalColors, + colorBy: Joi.any().valid('id', 'depth'), + inheritColorFromParent: Joi.boolean(), + childColor: inheritedColor, + borderWidth: Joi.number().min(0), + borderColor: inheritedColor, + + enableArcLabels: Joi.boolean(), + arcLabel: Joi.string(), + arcLabelsRadiusOffset: Joi.number(), + arcLabelsSkipAngle: Joi.number().min(0), + arcLabelsTextColor: inheritedColor, + }), + runtimeProps: ['width', 'height', 'colors'], + defaults: { + margin: { top: 0, right: 0, bottom: 0, left: 0 }, + }, +} + +export default sunburstMapping diff --git a/api/src/mapping/treemap.js b/api/src/mapping/treemap.js deleted file mode 100644 index 96a66dfbe1..0000000000 --- a/api/src/mapping/treemap.js +++ /dev/null @@ -1,64 +0,0 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016 Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const Joi = require('joi') -const { TreeMap } = require('@nivo/treemap') -const { ordinalColors, inheritedColor } = require('./commons/colors') -const { dimensions } = require('./commons/dimensions') - -module.exports = { - component: TreeMap, - schema: Joi.object().keys( - Object.assign({}, dimensions, { - root: Joi.object().required(), - value: Joi.string().required(), - identity: Joi.string().required(), - leavesOnly: Joi.boolean(), - tile: Joi.string(), - - enableLabels: Joi.boolean(), - orientLabels: Joi.boolean(), - label: Joi.string(), - labelFormat: Joi.string(), - labelSkipSize: Joi.number(), - labelTextColor: inheritedColor, - - innerPadding: Joi.number(), - outerPadding: Joi.number(), - - colors: ordinalColors, - colorBy: Joi.string(), - - borderWidth: Joi.number(), - borderColor: inheritedColor, - }) - ), - runtimeProps: [ - 'width', - 'height', - 'colors', - 'leavesOnly', - 'tile', - 'enableLabels', - 'orientLabels', - 'label', - 'labelFormat', - 'labelSkipSize', - 'labelTextColor', - 'innerPadding', - 'outerPadding', - 'colors', - 'borderWidth', - 'borderColor', - ], - defaults: { - margin: { top: 0, right: 0, bottom: 0, left: 0 }, - }, -} diff --git a/api/src/mapping/treemap.ts b/api/src/mapping/treemap.ts new file mode 100644 index 0000000000..45db5a1514 --- /dev/null +++ b/api/src/mapping/treemap.ts @@ -0,0 +1,71 @@ +import { FunctionComponent } from 'react' +import Joi from 'joi' +import { Dimensions } from '@nivo/core' +import { TreeMap, TreeMapSvgProps } from '@nivo/treemap' +import { custom } from './common' +import { ordinalColors, inheritedColor } from './commons/colors' +import { dimensions } from './commons/dimensions' +import { OmitStrict } from '../lib/types' + +export type TreeMapApiProps = OmitStrict< + TreeMapSvgProps & Dimensions, + 'isInteractive' | 'onMouseEnter' | 'onMouseMove' | 'onMouseLeave' | 'onClick' | 'animate' +> + +const treeMapMapping = { + component: TreeMap as unknown as FunctionComponent, + schema: Joi.object().keys({ + data: custom.object().required(), + identity: Joi.string(), + value: Joi.string(), + valueFormat: Joi.string(), + tile: Joi.any().valid('binary', 'squarify', 'slice', 'dice', 'sliceDice', 'resquarify'), + leavesOnly: Joi.boolean(), + innerPadding: Joi.number().min(0), + outerPadding: Joi.number().min(0), + width: dimensions.width, + height: dimensions.height, + margin: dimensions.margin, + + colors: ordinalColors, + colorBy: Joi.string(), + nodeOpacity: Joi.number().min(0).max(1), + borderWidth: Joi.number().min(0), + borderColor: inheritedColor, + + enableLabel: Joi.boolean(), + label: Joi.string(), + labelSkipSize: Joi.number(), + orientLabel: Joi.boolean(), + labelTextColor: inheritedColor, + enableParentLabel: Joi.boolean(), + parentLabel: Joi.string(), + parentLabelSize: Joi.number().min(0), + parentLabelPosition: Joi.any().valid('top', 'right', 'bottom', 'left'), + parentLabelPadding: Joi.number().min(0), + parentLabelTextColor: inheritedColor, + }), + runtimeProps: [ + 'width', + 'height', + 'colors', + 'leavesOnly', + 'tile', + 'enableLabels', + 'orientLabels', + 'label', + 'labelFormat', + 'labelSkipSize', + 'labelTextColor', + 'innerPadding', + 'outerPadding', + 'colors', + 'borderWidth', + 'borderColor', + ], + defaults: { + margin: { top: 0, right: 0, bottom: 0, left: 0 }, + }, +} + +export default treeMapMapping diff --git a/api/src/samples/heatmap.js b/api/src/samples/heatmap.js index 00c39cddc4..08a6d4d14a 100644 --- a/api/src/samples/heatmap.js +++ b/api/src/samples/heatmap.js @@ -1,11 +1,3 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016 Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ 'use strict' const { generateCountriesData } = require('@nivo/generators') diff --git a/api/src/samples/index.js b/api/src/samples/index.ts similarity index 71% rename from api/src/samples/index.js rename to api/src/samples/index.ts index d897ed13cb..8254e92c6b 100644 --- a/api/src/samples/index.js +++ b/api/src/samples/index.ts @@ -1,25 +1,17 @@ -/* - * This file is part of the nivo project. - * - * (c) 2016 Raphaël Benitte - * - * For the full copyright and license information, please view the LICENSE - * file that was distributed with this source code. - */ -'use strict' - -const { +import { generateLibTree, generateDrinkStats, generateCountriesData, generateProgrammingLanguageStats, generateWinesTastes, generateSankeyData, -} = require('@nivo/generators') +} from '@nivo/generators' +import { StorageEntry } from '../lib/storage' const keys = ['hot dogs', 'burgers', 'sandwich', 'kebab', 'fries', 'donut'] +const moreKeys = [...keys, 'junk', 'sushi', 'ramen', 'curry', 'udon', 'bagel'] -module.exports = { +const samples: Record, 'url'>> = { bar: { type: 'bar', props: { @@ -31,17 +23,16 @@ module.exports = { colors: 'nivo', }, }, - bubble: { - type: 'bubble', + circle_packing: { + type: 'circle_packing', props: { width: 600, height: 600, - root: generateLibTree(), - identity: 'name', + data: generateLibTree(), + id: 'name', value: 'loc', label: 'name', margin: { top: 0, right: 0, bottom: 0, left: 0 }, - colors: 'nivo', }, }, chord: { @@ -49,7 +40,7 @@ module.exports = { props: { width: 800, height: 800, - data: [ + matrix: [ [11975, 5871, 8916, 2868, 1967, 2987, 4300], [1951, 10048, 2060, 6171, 1967, 2987, 4300], [8010, 16145, 8090, 8045, 1967, 2987, 4300], @@ -58,13 +49,32 @@ module.exports = { [1013, 990, 940, 6907, 1967, 2987, 4300], [1013, 990, 940, 6907, 3000, 3456, 876], ], - colors: 'd320c', + keys: moreKeys.slice(0, 7), + colors: { scheme: 'paired' }, padAngle: 0.01, innerRadiusRatio: 0.98, innerRadiusOffset: 0.01, }, }, - heatmap: require('./heatmap'), + heatmap: { + type: 'heatmap', + props: { + width: 900, + height: 600, + data: generateCountriesData(moreKeys, { size: 9, min: 0, max: 100 }), + keys: moreKeys, + indexBy: 'country', + forceSquare: true, + cellShape: 'circle', + cellBorderWidth: 2, + cellBorderColor: 'inherit:darker(0.4)', + padding: 4, + sizeVariation: 0.5, + enableGridY: true, + labelTextColor: 'inherit:darker(2.4)', + colors: 'PuOr', + }, + }, line: { type: 'line', props: { @@ -75,7 +85,6 @@ module.exports = { identity: 'country', cumulative: false, curve: 'monotoneX', - colors: 'nivo', }, }, pie: { @@ -120,7 +129,7 @@ module.exports = { width: 1400, height: 800, data: generateSankeyData({ nodeCount: 13, maxIterations: 2 }), - colors: 'd320b', + colors: { scheme: 'paired' }, nodePaddingX: 3, nodeOpacity: 1, nodeWidth: 14, @@ -135,8 +144,13 @@ module.exports = { width: 800, height: 800, data: generateLibTree(), - identity: 'name', + id: 'name', value: 'loc', + childColor: { from: 'color', modifiers: [['brighter', 0.1]] }, + cornerRadius: 2, + enableArcLabels: true, + arcLabelsSkipAngle: 10, + arcLabelsTextColor: { from: 'color', modifiers: [['darker', 1.4]] }, }, }, treemap: { @@ -145,15 +159,15 @@ module.exports = { type: 'treemap', width: 800, height: 500, - root: generateLibTree(), + data: generateLibTree(), identity: 'name', value: 'loc', - label: 'loc', labelFormat: '.0s', leavesOnly: false, innerPadding: 3, outerPadding: 3, - colors: 'nivo', }, }, } + +export default samples diff --git a/api/tsconfig.json b/api/tsconfig.json new file mode 100644 index 0000000000..86a6d37fef --- /dev/null +++ b/api/tsconfig.json @@ -0,0 +1,8 @@ +{ + "compilerOptions": { + "module": "commonjs", + "target": "es6", + "rootDir": "./", + "esModuleInterop": true + } +} \ No newline at end of file diff --git a/packages/annotations/src/types.ts b/packages/annotations/src/types.ts index 3794348243..d7b2f77582 100644 --- a/packages/annotations/src/types.ts +++ b/packages/annotations/src/types.ts @@ -17,16 +17,12 @@ type ListIterateeCustom = ListIterator | IterateeShortha // then it's absolute. export type RelativeOrAbsolutePosition = number | { abs: number } -export type AnnotationPositionGetter = ( - datum: Datum -) => { +export type AnnotationPositionGetter = (datum: Datum) => { x: number y: number } -export type AnnotationDimensionsGetter = ( - datum: Datum -) => { +export type AnnotationDimensionsGetter = (datum: Datum) => { size: number width: number height: number diff --git a/packages/arcs/src/ArcShape.tsx b/packages/arcs/src/ArcShape.tsx index 8f26623c79..5fca21ebdb 100644 --- a/packages/arcs/src/ArcShape.tsx +++ b/packages/arcs/src/ArcShape.tsx @@ -39,17 +39,17 @@ export const ArcShape = ({ }: ArcShapeProps) => { const handleClick = useCallback(event => onClick?.(datum, event), [onClick, datum]) - const handleMouseEnter = useCallback(event => onMouseEnter?.(datum, event), [ - onMouseEnter, - datum, - ]) + const handleMouseEnter = useCallback( + event => onMouseEnter?.(datum, event), + [onMouseEnter, datum] + ) const handleMouseMove = useCallback(event => onMouseMove?.(datum, event), [onMouseMove, datum]) - const handleMouseLeave = useCallback(event => onMouseLeave?.(datum, event), [ - onMouseLeave, - datum, - ]) + const handleMouseLeave = useCallback( + event => onMouseLeave?.(datum, event), + [onMouseLeave, datum] + ) return ( ({ }: ArcLinkLabelsLayerProps) => { const getLabel = usePropertyAccessor(labelAccessor) - const { - transition, - interpolateLink, - interpolateTextAnchor, - interpolateTextPosition, - } = useArcLinkLabelsTransition({ - data, - skipAngle, - offset, - diagonalLength, - straightLength, - textOffset, - linkColor, - textColor, - }) + const { transition, interpolateLink, interpolateTextAnchor, interpolateTextPosition } = + useArcLinkLabelsTransition({ + data, + skipAngle, + offset, + diagonalLength, + straightLength, + textOffset, + linkColor, + textColor, + }) const Label: ArcLinkLabelComponent = component diff --git a/packages/arcs/src/centers.ts b/packages/arcs/src/centers.ts index 8432cbfd26..03d170f0bd 100644 --- a/packages/arcs/src/centers.ts +++ b/packages/arcs/src/centers.ts @@ -17,23 +17,25 @@ export const computeArcCenter = (arc: Arc, offset: number): Point => { return positionFromAngle(angle, radius) } -export const interpolateArcCenter = (offset: number) => ( - startAngleValue: SpringValue, - endAngleValue: SpringValue, - innerRadiusValue: SpringValue, - outerRadiusValue: SpringValue -) => - to( - [startAngleValue, endAngleValue, innerRadiusValue, outerRadiusValue], - (startAngle, endAngle, innerRadius, outerRadius) => { - const centroid = computeArcCenter( - { startAngle, endAngle, innerRadius, outerRadius }, - offset - ) +export const interpolateArcCenter = + (offset: number) => + ( + startAngleValue: SpringValue, + endAngleValue: SpringValue, + innerRadiusValue: SpringValue, + outerRadiusValue: SpringValue + ) => + to( + [startAngleValue, endAngleValue, innerRadiusValue, outerRadiusValue], + (startAngle, endAngle, innerRadius, outerRadius) => { + const centroid = computeArcCenter( + { startAngle, endAngle, innerRadius, outerRadius }, + offset + ) - return `translate(${centroid.x},${centroid.y})` - } - ) + return `translate(${centroid.x},${centroid.y})` + } + ) export const useArcCentersTransition = ( data: Datum[], diff --git a/packages/axes/src/compute.ts b/packages/axes/src/compute.ts index 8fa7aab474..a60d317728 100644 --- a/packages/axes/src/compute.ts +++ b/packages/axes/src/compute.ts @@ -106,7 +106,7 @@ export const getFormatter = ( return ((d: any) => formatter(d instanceof Date ? d : new Date(d))) as ValueFormatter } - return (d3Format(format) as unknown) as ValueFormatter + return d3Format(format) as unknown as ValueFormatter } export const computeGridLines = ({ diff --git a/packages/bar/src/BarItem.tsx b/packages/bar/src/BarItem.tsx index a84fec3930..7ac2cf789f 100644 --- a/packages/bar/src/BarItem.tsx +++ b/packages/bar/src/BarItem.tsx @@ -40,11 +40,10 @@ export const BarItem = ({ const theme = useTheme() const { showTooltipFromEvent, showTooltipAt, hideTooltip } = useTooltip() - const renderTooltip = useMemo(() => () => createElement(tooltip, { ...bar, ...data }), [ - tooltip, - bar, - data, - ]) + const renderTooltip = useMemo( + () => () => createElement(tooltip, { ...bar, ...data }), + [tooltip, bar, data] + ) const handleClick = useCallback( (event: MouseEvent) => { diff --git a/packages/bar/src/compute/common.ts b/packages/bar/src/compute/common.ts index a56acb8d7b..406ee57ccb 100644 --- a/packages/bar/src/compute/common.ts +++ b/packages/bar/src/compute/common.ts @@ -11,12 +11,14 @@ export const getIndexScale = ( size: number, axis: 'x' | 'y' ) => { - return (computeScale( - indexScale, - { all: data.map(getIndex), min: 0, max: 0 }, - size, - axis - ) as ScaleBand).padding(padding) + return ( + computeScale( + indexScale, + { all: data.map(getIndex), min: 0, max: 0 }, + size, + axis + ) as ScaleBand + ).padding(padding) } /** diff --git a/packages/bar/src/compute/stacked.ts b/packages/bar/src/compute/stacked.ts index cbf14f1469..cf9889b223 100644 --- a/packages/bar/src/compute/stacked.ts +++ b/packages/bar/src/compute/stacked.ts @@ -20,7 +20,7 @@ type Params = { } const flattenDeep = (arr: T[]): T => - arr.some(Array.isArray) ? flattenDeep(([] as T[]).concat(...arr)) : ((arr as unknown) as T) + arr.some(Array.isArray) ? flattenDeep(([] as T[]).concat(...arr)) : (arr as unknown as T) const filterZerosIfLog = (array: number[], type: string) => type === 'log' ? array.filter(num => num !== 0) : array @@ -205,7 +205,7 @@ export const generateStackedBars = ({ } const values = filterZerosIfLog( - flattenDeep((stackedData as unknown) as number[][]), + flattenDeep(stackedData as unknown as number[][]), valueScale.type ) const min = Math.min(...values) diff --git a/packages/bar/stories/bar.stories.tsx b/packages/bar/stories/bar.stories.tsx index 36c616c30d..9ea6433acf 100644 --- a/packages/bar/stories/bar.stories.tsx +++ b/packages/bar/stories/bar.stories.tsx @@ -241,8 +241,7 @@ stories.add( ), { info: { - text: - 'You can customize rendering of axis ticks using the corresponding axis `renderTick` property.', + text: 'You can customize rendering of axis ticks using the corresponding axis `renderTick` property.', }, } ) diff --git a/packages/bar/tests/Bar.test.tsx b/packages/bar/tests/Bar.test.tsx index 5e69fd5f9b..047fa3b282 100644 --- a/packages/bar/tests/Bar.test.tsx +++ b/packages/bar/tests/Bar.test.tsx @@ -69,7 +69,7 @@ it('should allow grouped mode', () => { const props = wrapper.find('BarItem').map(bar => { const { bar: { height, width, x, y }, - } = (bar.props() as unknown) as BarItemProps + } = bar.props() as unknown as BarItemProps return { height, width, x, y } }) @@ -135,7 +135,7 @@ it('should allow horizontal layout', () => { const props = wrapper.find('BarItem').map(bar => { const { bar: { height, width, x, y }, - } = (bar.props() as unknown) as BarItemProps + } = bar.props() as unknown as BarItemProps return { height, width, x, y } }) @@ -185,7 +185,7 @@ it('should allow grouped horizontal layout', () => { const props = wrapper.find('BarItem').map(bar => { const { bar: { height, width, x, y }, - } = (bar.props() as unknown) as BarItemProps + } = bar.props() as unknown as BarItemProps return { height, width, x, y } }) diff --git a/packages/bump/index.d.ts b/packages/bump/index.d.ts index 7f63928342..f078ceeb8f 100644 --- a/packages/bump/index.d.ts +++ b/packages/bump/index.d.ts @@ -83,7 +83,7 @@ declare module '@nivo/bump' { activePointBorderWidth?: number inactivePointBorderWidth?: number pointBorderColor?: InheritedColorConfig - + lineWidth?: number activeLineWidth?: number inactiveLineWidth?: number diff --git a/packages/bump/src/area-bump/AreaBump.js b/packages/bump/src/area-bump/AreaBump.js index 50e80bb482..88ea1da25c 100644 --- a/packages/bump/src/area-bump/AreaBump.js +++ b/packages/bump/src/area-bump/AreaBump.js @@ -95,11 +95,10 @@ const AreaBump = props => { current: currentSerie, }) - const boundDefs = useMemo(() => bindDefs(defs, series, fill, { targetKey: 'fill' }), [ - defs, - series, - fill, - ]) + const boundDefs = useMemo( + () => bindDefs(defs, series, fill, { targetKey: 'fill' }), + [defs, series, fill] + ) const layerById = { grid: enableGridX && ( diff --git a/packages/bump/src/area-bump/hooks.js b/packages/bump/src/area-bump/hooks.js index 4948196ddf..68ca5839aa 100644 --- a/packages/bump/src/area-bump/hooks.js +++ b/packages/bump/src/area-bump/hooks.js @@ -14,14 +14,10 @@ import { useTooltip } from '@nivo/tooltip' import { computeSeries } from './compute' export const useAreaBumpSeries = ({ data, width, height, align, spacing, xPadding }) => - useMemo(() => computeSeries({ data, width, height, align, spacing, xPadding }), [ - data, - width, - height, - align, - spacing, - xPadding, - ]) + useMemo( + () => computeSeries({ data, width, height, align, spacing, xPadding }), + [data, width, height, align, spacing, xPadding] + ) export const useAreaGenerator = interpolation => useMemo( @@ -130,7 +126,11 @@ export const useAreaBump = ({ isInteractive, current, }) => { - const { series: rawSeries, xScale, heightScale } = useAreaBumpSeries({ + const { + series: rawSeries, + xScale, + heightScale, + } = useAreaBumpSeries({ data, width, height, diff --git a/packages/bump/src/bump/hooks.js b/packages/bump/src/bump/hooks.js index dee80fe473..674f03eac3 100644 --- a/packages/bump/src/bump/hooks.js +++ b/packages/bump/src/bump/hooks.js @@ -157,7 +157,11 @@ export const useBump = ({ isInteractive, currentSerie, }) => { - const { series: rawSeries, xScale, yScale } = useMemo( + const { + series: rawSeries, + xScale, + yScale, + } = useMemo( () => computeSeries({ width, diff --git a/packages/chord/src/ChordCanvas.js b/packages/chord/src/ChordCanvas.js index 5043e156a2..7390a6b839 100644 --- a/packages/chord/src/ChordCanvas.js +++ b/packages/chord/src/ChordCanvas.js @@ -67,26 +67,19 @@ const ChordCanvas = memo( partialMargin ) - const { - center, - radius, - innerRadius, - arcGenerator, - ribbonGenerator, - arcs, - ribbons, - } = useChord({ - keys, - matrix, - label, - valueFormat, - width: innerWidth, - height: innerHeight, - innerRadiusRatio, - innerRadiusOffset, - padAngle, - colors, - }) + const { center, radius, innerRadius, arcGenerator, ribbonGenerator, arcs, ribbons } = + useChord({ + keys, + matrix, + label, + valueFormat, + width: innerWidth, + height: innerHeight, + innerRadiusRatio, + innerRadiusOffset, + padAngle, + colors, + }) const { currentArc, setCurrentArc, getArcOpacity, getRibbonOpacity } = useChordSelection({ arcs, diff --git a/packages/chord/src/ChordRibbons.js b/packages/chord/src/ChordRibbons.js index d6d749e729..1345fa45db 100644 --- a/packages/chord/src/ChordRibbons.js +++ b/packages/chord/src/ChordRibbons.js @@ -60,11 +60,13 @@ const ribbonWillEnter = ({ data: ribbon }) => ({ ...interpolateColor(ribbon.source.color), }) -const ribbonWillLeave = springConfig => ({ data: ribbon }) => ({ - ...getRibbonAngles(ribbon, true, springConfig), - opacity: 0, - ...interpolateColor(ribbon.source.color, springConfig), -}) +const ribbonWillLeave = + springConfig => + ({ data: ribbon }) => ({ + ...getRibbonAngles(ribbon, true, springConfig), + opacity: 0, + ...interpolateColor(ribbon.source.color, springConfig), + }) const ChordRibbons = memo( ({ diff --git a/packages/circle-packing/src/CirclePacking.tsx b/packages/circle-packing/src/CirclePacking.tsx index dd7133d973..49a9e6c02d 100644 --- a/packages/circle-packing/src/CirclePacking.tsx +++ b/packages/circle-packing/src/CirclePacking.tsx @@ -83,11 +83,10 @@ const InnerCirclePacking = ({ const zoomedNodes = useCirclePackingZoom(nodes, zoomedId, innerWidth, innerHeight) - const boundDefs = useMemo(() => bindDefs(defs, zoomedNodes, fill, { targetKey: 'fill' }), [ - defs, - zoomedNodes, - fill, - ]) + const boundDefs = useMemo( + () => bindDefs(defs, zoomedNodes, fill, { targetKey: 'fill' }), + [defs, zoomedNodes, fill] + ) const layerById: Record = { circles: null, @@ -158,6 +157,7 @@ export const CirclePacking = ({ isInteractive = defaultProps.isInteractive, animate = defaultProps.animate, motionConfig = defaultProps.motionConfig, + renderWrapper, ...otherProps }: Partial, 'data' | 'width' | 'height'>> & Pick, 'data' | 'width' | 'height'>) => ( @@ -165,6 +165,7 @@ export const CirclePacking = ({ isInteractive={isInteractive} animate={animate} motionConfig={motionConfig} + renderWrapper={renderWrapper} theme={theme} > isInteractive={isInteractive} {...otherProps} /> diff --git a/packages/circle-packing/src/Circles.tsx b/packages/circle-packing/src/Circles.tsx index c3cd5ae38b..3e56273828 100644 --- a/packages/circle-packing/src/Circles.tsx +++ b/packages/circle-packing/src/Circles.tsx @@ -106,9 +106,10 @@ export const Circles = ({ const theme = useTheme() const getBorderColor = useInheritedColor>(borderColor, theme) - const transitionPhases = useMemo(() => getTransitionPhases(getBorderColor), [ - getBorderColor, - ]) + const transitionPhases = useMemo( + () => getTransitionPhases(getBorderColor), + [getBorderColor] + ) const transition = useTransition< ComputedDatum, diff --git a/packages/circle-packing/src/types.ts b/packages/circle-packing/src/types.ts index e6892cd8f0..6f5449d87e 100644 --- a/packages/circle-packing/src/types.ts +++ b/packages/circle-packing/src/types.ts @@ -84,6 +84,7 @@ export interface CirclePackingCommonProps { animate: boolean motionConfig: ModernMotionProps['motionConfig'] role: string + renderWrapper?: boolean } export type CirclePackingSvgProps = CirclePackingCommonProps & diff --git a/packages/geo/src/Choropleth.js b/packages/geo/src/Choropleth.js index 01e67e5161..d46a0f7a7a 100644 --- a/packages/geo/src/Choropleth.js +++ b/packages/geo/src/Choropleth.js @@ -90,10 +90,10 @@ const Choropleth = memo( showTooltipFromEvent(, event), [isInteractive, showTooltipFromEvent, Tooltip] ) - const handleMouseLeave = useCallback(() => isInteractive && hideTooltip(), [ - isInteractive, - hideTooltip, - ]) + const handleMouseLeave = useCallback( + () => isInteractive && hideTooltip(), + [isInteractive, hideTooltip] + ) return ( isInteractive && hideTooltip(), [ - isInteractive, - hideTooltip, - ]) + const handleMouseLeave = useCallback( + () => isInteractive && hideTooltip(), + [isInteractive, hideTooltip] + ) const handleClick = useCallback( event => { if (!isInteractive || !onClick) return diff --git a/packages/geo/src/GeoMap.js b/packages/geo/src/GeoMap.js index 3c9bece5ce..fb4394906a 100644 --- a/packages/geo/src/GeoMap.js +++ b/packages/geo/src/GeoMap.js @@ -66,10 +66,10 @@ const GeoMap = memo(props => { isInteractive && Tooltip && showTooltipFromEvent(, event), [isInteractive, showTooltipFromEvent, Tooltip] ) - const handleMouseLeave = useCallback(() => isInteractive && hideTooltip(), [ - isInteractive, - hideTooltip, - ]) + const handleMouseLeave = useCallback( + () => isInteractive && hideTooltip(), + [isInteractive, hideTooltip] + ) return ( { }, [showTooltipFromEvent, hideTooltip, isInteractive, Tooltip, canvasEl, features, projection] ) - const handleMouseLeave = useCallback(() => isInteractive && hideTooltip(), [ - isInteractive, - hideTooltip, - ]) + const handleMouseLeave = useCallback( + () => isInteractive && hideTooltip(), + [isInteractive, hideTooltip] + ) const handleClick = useCallback( event => { if (!isInteractive || !onClick) return diff --git a/packages/geo/src/hooks.js b/packages/geo/src/hooks.js index 07eb3ed4d1..afc18d610b 100644 --- a/packages/geo/src/hooks.js +++ b/packages/geo/src/hooks.js @@ -111,22 +111,24 @@ export const useChoropleth = ({ return featureKey && featureKey === datumKey } }, [match]) - const getLabel = useMemo(() => (isFunction(label) ? label : datum => get(datum, label)), [ - label, - ]) - const getValue = useMemo(() => (isFunction(value) ? value : datum => get(datum, value)), [ - value, - ]) + const getLabel = useMemo( + () => (isFunction(label) ? label : datum => get(datum, label)), + [label] + ) + const getValue = useMemo( + () => (isFunction(value) ? value : datum => get(datum, value)), + [value] + ) const valueFormatter = useMemo(() => { if (valueFormat === undefined) return d => d if (isFunction(valueFormat)) return valueFormat return format(valueFormat) }, [valueFormat]) - const colorScale = useMemo(() => guessQuantizeColorScale(colors).domain(domain), [ - colors, - domain, - ]) + const colorScale = useMemo( + () => guessQuantizeColorScale(colors).domain(domain), + [colors, domain] + ) const getFillColor = useMemo(() => { return feature => { if (feature.value === undefined) return unknownColor diff --git a/packages/line/src/hooks.js b/packages/line/src/hooks.js index 664ecb8f23..93e6d0fa3e 100644 --- a/packages/line/src/hooks.js +++ b/packages/line/src/hooks.js @@ -162,7 +162,11 @@ export const useLine = ({ const getPointBorderColor = useInheritedColor(pointBorderColor, theme) const [hiddenIds, setHiddenIds] = useState([]) - const { xScale, yScale, series: rawSeries } = useMemo( + const { + xScale, + yScale, + series: rawSeries, + } = useMemo( () => computeXYScalesForSeries( data.filter(item => hiddenIds.indexOf(item.id) === -1), diff --git a/packages/line/stories/line.stories.js b/packages/line/stories/line.stories.js index 138dbd4b5d..9368c0f0e1 100644 --- a/packages/line/stories/line.stories.js +++ b/packages/line/stories/line.stories.js @@ -584,61 +584,15 @@ stories.add('custom min/max y', () => ( { id: 'fake corp. A', data: [ - 0.5, - 0.6, - 0.8, - 0.7, - 0.8, - 0.5, - 0.2, - 0.3, - 0.4, - 0.5, - 0.5, - 0.1, - -0.2, - -0.6, - -0.1, - 0, - 0.1, - -0.1, - -0.4, - -0.6, - -0.5, - 0.2, - 0.5, - 0.6, - 0.6, + 0.5, 0.6, 0.8, 0.7, 0.8, 0.5, 0.2, 0.3, 0.4, 0.5, 0.5, 0.1, -0.2, -0.6, -0.1, 0, + 0.1, -0.1, -0.4, -0.6, -0.5, 0.2, 0.5, 0.6, 0.6, ].map((y, i) => ({ x: `#${i}`, y })), }, { id: 'fake corp. B', data: [ - 0.9, - 0.5, - 0.6, - 0.5, - 0.4, - 0.3, - -0.1, - -0.5, - -0.4, - -0.4, - -0.1, - -0.3, - -0.2, - 0.1, - 0.1, - 0.3, - 0.4, - 0.5, - 0.4, - 0.6, - 0.5, - 0.7, - 0.8, - 0.4, - 0.3, + 0.9, 0.5, 0.6, 0.5, 0.4, 0.3, -0.1, -0.5, -0.4, -0.4, -0.1, -0.3, -0.2, 0.1, + 0.1, 0.3, 0.4, 0.5, 0.4, 0.6, 0.5, 0.7, 0.8, 0.4, 0.3, ].map((y, i) => ({ x: `#${i}`, y })), }, ]} diff --git a/packages/marimekko/src/Marimekko.tsx b/packages/marimekko/src/Marimekko.tsx index 033533f6c5..1c1dd85e48 100644 --- a/packages/marimekko/src/Marimekko.tsx +++ b/packages/marimekko/src/Marimekko.tsx @@ -59,24 +59,23 @@ const InnerMarimekko = ({ partialMargin ) - const { computedData, bars, thicknessScale, dimensionsScale, dimensionIds } = useMarimekko< - RawDatum - >({ - data, - id, - value, - dimensions, - valueFormat, - layout, - offset, - outerPadding, - innerPadding, - colors, - borderColor, - borderWidth, - width: innerWidth, - height: innerHeight, - }) + const { computedData, bars, thicknessScale, dimensionsScale, dimensionIds } = + useMarimekko({ + data, + id, + value, + dimensions, + valueFormat, + layout, + offset, + outerPadding, + innerPadding, + colors, + borderColor, + borderWidth, + width: innerWidth, + height: innerHeight, + }) const layerById: Record = { grid: null, diff --git a/packages/network/src/AnimatedNodes.js b/packages/network/src/AnimatedNodes.js index 75c4119e5f..4d12b9eee6 100644 --- a/packages/network/src/AnimatedNodes.js +++ b/packages/network/src/AnimatedNodes.js @@ -19,12 +19,14 @@ const willEnter = ({ style }) => ({ scale: 0, }) -const willLeave = springConfig => ({ style }) => ({ - x: style.x, - y: style.y, - radius: style.radius, - scale: spring(0, springConfig), -}) +const willLeave = + springConfig => + ({ style }) => ({ + x: style.x, + y: style.y, + radius: style.radius, + scale: spring(0, springConfig), + }) const AnimatedNodes = ({ nodes, color, borderColor, ...props }) => { const { springConfig } = useMotionConfig() diff --git a/packages/parallel-coordinates/src/ParallelCoordinates.js b/packages/parallel-coordinates/src/ParallelCoordinates.js index 0e6f959477..e556240f5c 100644 --- a/packages/parallel-coordinates/src/ParallelCoordinates.js +++ b/packages/parallel-coordinates/src/ParallelCoordinates.js @@ -33,21 +33,16 @@ const ParallelCoordinates = ({ partialMargin ) - const { - variablesScale, - variablesWithScale, - dataWithPoints, - lineGenerator, - getLineColor, - } = useParallelCoordinates({ - width: innerWidth, - height: innerHeight, - data, - variables, - layout, - colors, - curve, - }) + const { variablesScale, variablesWithScale, dataWithPoints, lineGenerator, getLineColor } = + useParallelCoordinates({ + width: innerWidth, + height: innerHeight, + data, + variables, + layout, + colors, + curve, + }) const axes = variablesWithScale.map(variable => ( ({ colors, }) - const { - dataWithArc, - arcGenerator, - centerX, - centerY, - radius, - innerRadius, - setActiveId, - } = usePieFromBox({ - data: normalizedData, - width: innerWidth, - height: innerHeight, - fit, - innerRadius: innerRadiusRatio, - startAngle, - endAngle, - padAngle, - sortByValue, - cornerRadius, - activeInnerRadiusOffset, - activeOuterRadiusOffset, - }) + const { dataWithArc, arcGenerator, centerX, centerY, radius, innerRadius, setActiveId } = + usePieFromBox({ + data: normalizedData, + width: innerWidth, + height: innerHeight, + fit, + innerRadius: innerRadiusRatio, + startAngle, + endAngle, + padAngle, + sortByValue, + cornerRadius, + activeInnerRadiusOffset, + activeOuterRadiusOffset, + }) const getBorderColor = useInheritedColor>(borderColor, theme) diff --git a/packages/pie/src/props.ts b/packages/pie/src/props.ts index 6f0728dd04..b0e6edd95a 100644 --- a/packages/pie/src/props.ts +++ b/packages/pie/src/props.ts @@ -45,7 +45,7 @@ export const defaultProps = { arcLinkLabelsTextColor: { theme: 'labels.text.fill' }, arcLinkLabelsColor: { theme: 'axis.ticks.line.stroke' }, - colors: ({ scheme: 'nivo' } as unknown) as OrdinalColorScaleConfig, + colors: { scheme: 'nivo' } as unknown as OrdinalColorScaleConfig, defs: [], fill: [], diff --git a/packages/recompose/src/compose.ts b/packages/recompose/src/compose.ts index 5e37eeed7a..8e48cb7387 100644 --- a/packages/recompose/src/compose.ts +++ b/packages/recompose/src/compose.ts @@ -7,6 +7,8 @@ interface ComponentEnhancer { // eslint-disable-next-line @typescript-eslint/ban-types export const compose = (...funcs: Function[]): ComponentEnhancer => funcs.reduce>( - (a, b) => (...args) => a(b(...args)), + (a, b) => + (...args) => + a(b(...args)), arg => arg as any ) as ComponentEnhancer diff --git a/packages/recompose/src/defaultProps.ts b/packages/recompose/src/defaultProps.ts index 5739fe2f7b..d1a66f6b35 100644 --- a/packages/recompose/src/defaultProps.ts +++ b/packages/recompose/src/defaultProps.ts @@ -4,14 +4,14 @@ import { DefaultingInferableComponentEnhancer } from './types' import { wrapDisplayName } from './wrapDisplayName' // eslint-disable-next-line @typescript-eslint/ban-types -export const defaultProps = (props: T): DefaultingInferableComponentEnhancer => ( - BaseComponent: any -): any => { - const factory = createFactory(BaseComponent) - const DefaultProps = (ownerProps: any) => factory(ownerProps) - DefaultProps.defaultProps = props - if (process.env.NODE_ENV !== 'production') { - return setDisplayName(wrapDisplayName(BaseComponent, 'defaultProps'))(DefaultProps) +export const defaultProps = + (props: T): DefaultingInferableComponentEnhancer => + (BaseComponent: any): any => { + const factory = createFactory(BaseComponent) + const DefaultProps = (ownerProps: any) => factory(ownerProps) + DefaultProps.defaultProps = props + if (process.env.NODE_ENV !== 'production') { + return setDisplayName(wrapDisplayName(BaseComponent, 'defaultProps'))(DefaultProps) + } + return DefaultProps } - return DefaultProps -} diff --git a/packages/recompose/src/mapProps.ts b/packages/recompose/src/mapProps.ts index e2a45b9c8e..a88d943c60 100644 --- a/packages/recompose/src/mapProps.ts +++ b/packages/recompose/src/mapProps.ts @@ -3,13 +3,15 @@ import { setDisplayName } from './setDisplayName' import { InferableComponentEnhancerWithProps, Mapper } from './types' import { wrapDisplayName } from './wrapDisplayName' -export const mapProps = ( - propsMapper: Mapper -): InferableComponentEnhancerWithProps => (BaseComponent: any): any => { - const factory = createFactory(BaseComponent) - const MapProps = (props: any) => factory(propsMapper(props)) - if (process.env.NODE_ENV !== 'production') { - return setDisplayName(wrapDisplayName(BaseComponent, 'mapProps'))(MapProps) +export const mapProps = + ( + propsMapper: Mapper + ): InferableComponentEnhancerWithProps => + (BaseComponent: any): any => { + const factory = createFactory(BaseComponent) + const MapProps = (props: any) => factory(propsMapper(props)) + if (process.env.NODE_ENV !== 'production') { + return setDisplayName(wrapDisplayName(BaseComponent, 'mapProps'))(MapProps) + } + return MapProps } - return MapProps -} diff --git a/packages/recompose/src/setStatic.ts b/packages/recompose/src/setStatic.ts index a6a685faac..3a204ae80d 100644 --- a/packages/recompose/src/setStatic.ts +++ b/packages/recompose/src/setStatic.ts @@ -1,12 +1,11 @@ import { ComponentType } from 'react' -export const setStatic = ( - key: string, - value: any -): (>(component: T) => T) => BaseComponent => { - /* eslint-disable no-param-reassign */ - // @ts-expect-error there's no way to type this - BaseComponent[key] = value - /* eslint-enable no-param-reassign */ - return BaseComponent -} +export const setStatic = + (key: string, value: any): (>(component: T) => T) => + BaseComponent => { + /* eslint-disable no-param-reassign */ + // @ts-expect-error there's no way to type this + BaseComponent[key] = value + /* eslint-enable no-param-reassign */ + return BaseComponent + } diff --git a/packages/recompose/src/shouldUpdate.ts b/packages/recompose/src/shouldUpdate.ts index d4d39d71e9..09755ff5f4 100644 --- a/packages/recompose/src/shouldUpdate.ts +++ b/packages/recompose/src/shouldUpdate.ts @@ -3,25 +3,27 @@ import { setDisplayName } from './setDisplayName' import { InferableComponentEnhancer, PredicateDiff } from './types' import { wrapDisplayName } from './wrapDisplayName' -export const shouldUpdate = >( - test: PredicateDiff - // eslint-disable-next-line @typescript-eslint/ban-types -): InferableComponentEnhancer<{}> => (BaseComponent: any): any => { - const factory = createFactory(BaseComponent) - class ShouldUpdate extends Component { - shouldComponentUpdate(nextProps: any) { - // @ts-expect-error not type-able - return test(this.props, nextProps) - } +export const shouldUpdate = + >( + test: PredicateDiff + // eslint-disable-next-line @typescript-eslint/ban-types + ): InferableComponentEnhancer<{}> => + (BaseComponent: any): any => { + const factory = createFactory(BaseComponent) + class ShouldUpdate extends Component { + shouldComponentUpdate(nextProps: any) { + // @ts-expect-error not type-able + return test(this.props, nextProps) + } - render() { - // @ts-expect-error not type-able - return factory(this.props) + render() { + // @ts-expect-error not type-able + return factory(this.props) + } } - } - if (process.env.NODE_ENV !== 'production') { - return setDisplayName(wrapDisplayName(BaseComponent, 'shouldUpdate'))(ShouldUpdate) + if (process.env.NODE_ENV !== 'production') { + return setDisplayName(wrapDisplayName(BaseComponent, 'shouldUpdate'))(ShouldUpdate) + } + return ShouldUpdate } - return ShouldUpdate -} diff --git a/packages/recompose/src/types.ts b/packages/recompose/src/types.ts index daa37720e8..f52892ab9e 100644 --- a/packages/recompose/src/types.ts +++ b/packages/recompose/src/types.ts @@ -22,6 +22,5 @@ export type InferableComponentEnhancer = InferableComponentEnhan {} > -export type DefaultingInferableComponentEnhancer< - TInjectedProps -> = InferableComponentEnhancerWithProps> +export type DefaultingInferableComponentEnhancer = + InferableComponentEnhancerWithProps> diff --git a/packages/recompose/src/withPropsOnChange.ts b/packages/recompose/src/withPropsOnChange.ts index 28cc79ff06..18436d0592 100644 --- a/packages/recompose/src/withPropsOnChange.ts +++ b/packages/recompose/src/withPropsOnChange.ts @@ -6,52 +6,57 @@ import { InferableComponentEnhancerWithProps, Mapper, PredicateDiff } from './ty import { pick } from './utils' import { wrapDisplayName } from './wrapDisplayName' -export const withPropsOnChange = >( - shouldMapOrKeys: string[] | PredicateDiff, - propsMapper: Mapper -): InferableComponentEnhancerWithProps => (BaseComponent: any): any => { - const factory = createFactory(BaseComponent) - const shouldMap = - typeof shouldMapOrKeys === 'function' - ? shouldMapOrKeys - : (props: TOuter, nextProps: TOuter) => - !shallowEqual(pick(props, shouldMapOrKeys), pick(nextProps, shouldMapOrKeys)) - - class WithPropsOnChange extends Component { - state = { - computedProps: propsMapper(this.props), - prevProps: this.props, - } +export const withPropsOnChange = + >( + shouldMapOrKeys: string[] | PredicateDiff, + propsMapper: Mapper + ): InferableComponentEnhancerWithProps => + (BaseComponent: any): any => { + const factory = createFactory(BaseComponent) + const shouldMap = + typeof shouldMapOrKeys === 'function' + ? shouldMapOrKeys + : (props: TOuter, nextProps: TOuter) => + !shallowEqual(pick(props, shouldMapOrKeys), pick(nextProps, shouldMapOrKeys)) + + class WithPropsOnChange extends Component { + state = { + computedProps: propsMapper(this.props), + prevProps: this.props, + } + + static getDerivedStateFromProps( + nextProps: TOuter, + prevState: WithPropsOnChange['state'] + ) { + if (shouldMap(prevState.prevProps, nextProps)) { + return { + computedProps: propsMapper(nextProps), + prevProps: nextProps, + } + } - static getDerivedStateFromProps(nextProps: TOuter, prevState: WithPropsOnChange['state']) { - if (shouldMap(prevState.prevProps, nextProps)) { return { - computedProps: propsMapper(nextProps), prevProps: nextProps, } } - return { - prevProps: nextProps, + render() { + // @ts-expect-error due to how factory is typed + return factory({ + ...this.props, + ...this.state.computedProps, + }) } } - render() { - // @ts-expect-error due to how factory is typed - return factory({ - ...this.props, - ...this.state.computedProps, - }) - } - } + polyfill(WithPropsOnChange) - polyfill(WithPropsOnChange) + if (process.env.NODE_ENV !== 'production') { + return setDisplayName(wrapDisplayName(BaseComponent, 'withPropsOnChange'))( + WithPropsOnChange + ) + } - if (process.env.NODE_ENV !== 'production') { - return setDisplayName(wrapDisplayName(BaseComponent, 'withPropsOnChange'))( - WithPropsOnChange - ) + return WithPropsOnChange } - - return WithPropsOnChange -} diff --git a/packages/recompose/src/withState.ts b/packages/recompose/src/withState.ts index 36e33b51a9..c2223f54a3 100644 --- a/packages/recompose/src/withState.ts +++ b/packages/recompose/src/withState.ts @@ -8,49 +8,47 @@ type StateProps TState } -export const withState = < - TOuter, - TState, - TStateName extends string, - TStateUpdaterName extends string ->( - stateName: TStateName, - stateUpdaterName: TStateUpdaterName, - initialState: TState | Mapper -): InferableComponentEnhancerWithProps< - StateProps, - TOuter -> => (BaseComponent: any): any => { - const factory = createFactory(BaseComponent) - class WithState extends Component { - state = { - stateValue: - typeof initialState === 'function' - ? // eslint-disable-next-line @typescript-eslint/ban-types - (initialState as Function)(this.props) - : initialState, - } +export const withState = + ( + stateName: TStateName, + stateUpdaterName: TStateUpdaterName, + initialState: TState | Mapper + ): InferableComponentEnhancerWithProps< + StateProps, + TOuter + > => + (BaseComponent: any): any => { + const factory = createFactory(BaseComponent) + class WithState extends Component { + state = { + stateValue: + typeof initialState === 'function' + ? // eslint-disable-next-line @typescript-eslint/ban-types + (initialState as Function)(this.props) + : initialState, + } - updateStateValue = (updateFn: any, callback: any) => - this.setState( - ({ stateValue }: any) => ({ - stateValue: typeof updateFn === 'function' ? updateFn(stateValue) : updateFn, - }), - callback - ) + updateStateValue = (updateFn: any, callback: any) => + this.setState( + ({ stateValue }: any) => ({ + stateValue: + typeof updateFn === 'function' ? updateFn(stateValue) : updateFn, + }), + callback + ) - render() { - // @ts-expect-error due to how factory is typed - return factory({ - ...this.props, - [stateName]: this.state.stateValue, - [stateUpdaterName]: this.updateStateValue, - }) + render() { + // @ts-expect-error due to how factory is typed + return factory({ + ...this.props, + [stateName]: this.state.stateValue, + [stateUpdaterName]: this.updateStateValue, + }) + } } - } - if (process.env.NODE_ENV !== 'production') { - return setDisplayName(wrapDisplayName(BaseComponent, 'withState'))(WithState) + if (process.env.NODE_ENV !== 'production') { + return setDisplayName(wrapDisplayName(BaseComponent, 'withState'))(WithState) + } + return WithState } - return WithState -} diff --git a/packages/sankey/src/hooks.ts b/packages/sankey/src/hooks.ts index 77993ea270..c01ed6dd49 100644 --- a/packages/sankey/src/hooks.ts +++ b/packages/sankey/src/hooks.ts @@ -59,7 +59,7 @@ export const computeNodeAndLinks = [] links: SankeyLinkDatum[] } diff --git a/packages/scales/src/compute.ts b/packages/scales/src/compute.ts index 1840ee4e55..2559dfa2cc 100644 --- a/packages/scales/src/compute.ts +++ b/packages/scales/src/compute.ts @@ -199,7 +199,7 @@ export const generateSeriesAxis = ( scale: D3ScaleLinear, stacked = false ) => { - const typedScale = (scale as unknown) as ScaleLinear + const typedScale = scale as unknown as ScaleLinear typedScale.type = 'linear' typedScale.stacked = stacked diff --git a/packages/scales/src/timeScale.ts b/packages/scales/src/timeScale.ts index 682d4b812f..a04fc3084f 100644 --- a/packages/scales/src/timeScale.ts +++ b/packages/scales/src/timeScale.ts @@ -43,7 +43,7 @@ export const createTimeScale = ( if (nice === true) scale.nice() else if (typeof nice === 'object' || typeof nice === 'number') scale.nice(nice) - const typedScale = (scale as unknown) as ScaleTime + const typedScale = scale as unknown as ScaleTime typedScale.type = 'time' typedScale.useUTC = useUTC diff --git a/packages/scales/tests/ticks.test.ts b/packages/scales/tests/ticks.test.ts index d5c5f19b14..97c7113237 100644 --- a/packages/scales/tests/ticks.test.ts +++ b/packages/scales/tests/ticks.test.ts @@ -7,17 +7,7 @@ describe('linear scale', () => { it('should return default ticks', () => { expect(getScaleTicks(linearScale)).toEqual([ - 0, - 50, - 100, - 150, - 200, - 250, - 300, - 350, - 400, - 450, - 500, + 0, 50, 100, 150, 200, 250, 300, 350, 400, 450, 500, ]) }) diff --git a/packages/scatterplot/src/props.tsx b/packages/scatterplot/src/props.tsx index 1af749c93f..a5ae552ae8 100644 --- a/packages/scatterplot/src/props.tsx +++ b/packages/scatterplot/src/props.tsx @@ -25,9 +25,8 @@ export const commonDefaultProps = { axisBottom: {}, axisLeft: {}, - nodeId: (({ serieId, index }) => `${serieId}.${index}`) as ScatterPlotCommonProps< - ScatterPlotDatum - >['nodeId'], + nodeId: (({ serieId, index }) => + `${serieId}.${index}`) as ScatterPlotCommonProps['nodeId'], nodeSize: 9, nodeComponent: Node, diff --git a/packages/stream/src/hooks.ts b/packages/stream/src/hooks.ts index dd19042c4a..01dbaf59bd 100644 --- a/packages/stream/src/hooks.ts +++ b/packages/stream/src/hooks.ts @@ -111,9 +111,10 @@ export const useStream = ({ ) const getBorderColor = useInheritedColor(borderColor, theme) - const getDotSize = useMemo(() => (typeof dotSize === 'function' ? dotSize : () => dotSize), [ - dotSize, - ]) + const getDotSize = useMemo( + () => (typeof dotSize === 'function' ? dotSize : () => dotSize), + [dotSize] + ) const getDotColor = useInheritedColor(dotColor, theme) const getDotBorderWidth = useMemo( () => (typeof dotBorderWidth === 'function' ? dotBorderWidth : () => dotBorderWidth), diff --git a/packages/stream/src/props.ts b/packages/stream/src/props.ts index 0855208797..a6cc5bbb2f 100644 --- a/packages/stream/src/props.ts +++ b/packages/stream/src/props.ts @@ -19,9 +19,10 @@ export const defaultProps = { colors: { scheme: 'nivo' } as StreamCommonProps['colors'], fillOpacity: 1, borderWidth: 0, - borderColor: { from: 'color', modifiers: [['darker', 1]] } as StreamCommonProps< - any - >['borderColor'], + borderColor: { + from: 'color', + modifiers: [['darker', 1]], + } as StreamCommonProps['borderColor'], enableDots: false, dotPosition: 'center' as StreamCommonProps['dotPosition'], diff --git a/packages/stream/src/types.ts b/packages/stream/src/types.ts index 4f973dec01..0c8733e824 100644 --- a/packages/stream/src/types.ts +++ b/packages/stream/src/types.ts @@ -30,9 +30,7 @@ export interface StreamDatum { [key: string]: string | number } -export type StackFunc = ( - data: RawDatum[] -) => { +export type StackFunc = (data: RawDatum[]) => { 0: number 1: number data: RawDatum diff --git a/packages/sunburst/src/Sunburst.tsx b/packages/sunburst/src/Sunburst.tsx index e3540ea3a4..c7f4a9e717 100644 --- a/packages/sunburst/src/Sunburst.tsx +++ b/packages/sunburst/src/Sunburst.tsx @@ -162,10 +162,11 @@ export const Sunburst = ({ animate = defaultProps.animate, motionConfig = defaultProps.motionConfig, theme, + renderWrapper, ...otherProps }: Partial, 'data' | 'width' | 'height'>> & Pick, 'data' | 'width' | 'height'>) => ( - + isInteractive={isInteractive} {...otherProps} /> ) diff --git a/packages/sunburst/src/props.ts b/packages/sunburst/src/props.ts index 9b6a7f11f3..aa59533eba 100644 --- a/packages/sunburst/src/props.ts +++ b/packages/sunburst/src/props.ts @@ -8,7 +8,7 @@ export const defaultProps = { value: 'value', cornerRadius: 0, layers: ['arcs', 'arcLabels'] as SunburstLayerId[], - colors: ({ scheme: 'nivo' } as unknown) as OrdinalColorScaleConfig, + colors: { scheme: 'nivo' } as unknown as OrdinalColorScaleConfig, colorBy: 'id' as const, inheritColorFromParent: true, childColor: { from: 'color' }, diff --git a/packages/sunburst/src/types.ts b/packages/sunburst/src/types.ts index de42cad5c5..159b251861 100644 --- a/packages/sunburst/src/types.ts +++ b/packages/sunburst/src/types.ts @@ -74,6 +74,7 @@ export type SunburstCommonProps = { enableArcLabels: boolean layers: SunburstLayer[] role: string + renderWrapper: boolean transitionMode: ArcTransitionMode isInteractive: boolean tooltip: (props: ComputedDatum) => JSX.Element diff --git a/packages/swarmplot/src/Circles.tsx b/packages/swarmplot/src/Circles.tsx index 1b12b0f07b..e318e140d5 100644 --- a/packages/swarmplot/src/Circles.tsx +++ b/packages/swarmplot/src/Circles.tsx @@ -108,9 +108,10 @@ export const Circles = ({ const getBorderWidth = useBorderWidth(borderWidth) const getBorderColor = useInheritedColor>(borderColor, theme) - const transitionPhases = useMemo(() => getTransitionPhases(getBorderColor), [ - getBorderColor, - ]) + const transitionPhases = useMemo( + () => getTransitionPhases(getBorderColor), + [getBorderColor] + ) const transition = useTransition< ComputedDatum, diff --git a/packages/swarmplot/src/hooks.ts b/packages/swarmplot/src/hooks.ts index 19cb6d7db2..4d33692d38 100644 --- a/packages/swarmplot/src/hooks.ts +++ b/packages/swarmplot/src/hooks.ts @@ -61,13 +61,10 @@ export const useOrdinalScale = ({ groups: string[] gap: number }) => - useMemo(() => computeOrdinalScale({ width, height, axis, groups, gap }), [ - width, - height, - axis, - groups, - gap, - ]) + useMemo( + () => computeOrdinalScale({ width, height, axis, groups, gap }), + [width, height, axis, groups, gap] + ) const useSize = (size: SizeSpec) => useMemo(() => getSizeGenerator(size), [size]) diff --git a/packages/voronoi/src/hooks.ts b/packages/voronoi/src/hooks.ts index 59aa663868..a13c92aa77 100644 --- a/packages/voronoi/src/hooks.ts +++ b/packages/voronoi/src/hooks.ts @@ -19,17 +19,12 @@ export const useVoronoiMesh = ({ height: number debug?: boolean }) => { - const points2d = useMemo( - () => computeMeshPoints({ points, x, y }), - [points, x, y] - ) + const points2d = useMemo(() => computeMeshPoints({ points, x, y }), [points, x, y]) - return useMemo(() => computeMesh({ points: points2d, width, height, debug }), [ - points2d, - width, - height, - debug, - ]) + return useMemo( + () => computeMesh({ points: points2d, width, height, debug }), + [points2d, width, height, debug] + ) } export const useVoronoi = ({ @@ -46,10 +41,10 @@ export const useVoronoi = ({ yDomain: VoronoiCommonProps['yDomain'] }) => { const xScale = useMemo(() => scaleLinear().domain(xDomain).range([0, width]), [xDomain, width]) - const yScale = useMemo(() => scaleLinear().domain(yDomain).range([0, height]), [ - yDomain, - height, - ]) + const yScale = useMemo( + () => scaleLinear().domain(yDomain).range([0, height]), + [yDomain, height] + ) const points = useMemo( () => diff --git a/packages/waffle/src/WaffleCanvas.js b/packages/waffle/src/WaffleCanvas.js index 021612e3ba..55764918c7 100644 --- a/packages/waffle/src/WaffleCanvas.js +++ b/packages/waffle/src/WaffleCanvas.js @@ -118,16 +118,8 @@ class WaffleCanvas extends Component { } handleMouseHover = (showTooltip, hideTooltip) => event => { - const { - isInteractive, - margin, - theme, - cells, - cellSize, - origin, - tooltipFormat, - tooltip, - } = this.props + const { isInteractive, margin, theme, cells, cellSize, origin, tooltipFormat, tooltip } = + this.props if (!isInteractive || !cells) return diff --git a/website/src/components/icons/BulletIcon.js b/website/src/components/icons/BulletIcon.js index 0f69442e32..c5716901ec 100644 --- a/website/src/components/icons/BulletIcon.js +++ b/website/src/components/icons/BulletIcon.js @@ -57,13 +57,11 @@ const Range = colors => d => { return } -const Measure = color => d => ( +const Measure = color => d => -) -const Marker = color => d => ( +const Marker = color => d => -) const BulletIconItem = ({ type }) => ( diff --git a/website/src/components/icons/RadialBarIcon.tsx b/website/src/components/icons/RadialBarIcon.tsx index b4a6ac10fe..46c1904b92 100644 --- a/website/src/components/icons/RadialBarIcon.tsx +++ b/website/src/components/icons/RadialBarIcon.tsx @@ -28,8 +28,8 @@ const RadialBarIconItem = ({ type }: { type: IconType }) => ( data={data} height={ICON_SIZE} width={ICON_SIZE} - innerRadius={.25} - padding={.3} + innerRadius={0.25} + padding={0.3} colors={colors[type].colors[3]} tracksColor={colors[type].colors[0]} enableRadialGrid={false} diff --git a/website/src/components/icons/SwarmPlotIcon.js b/website/src/components/icons/SwarmPlotIcon.js index 40fe4f892a..fa72e2ecca 100644 --- a/website/src/components/icons/SwarmPlotIcon.js +++ b/website/src/components/icons/SwarmPlotIcon.js @@ -7,35 +7,7 @@ import swarmplotDarkColoredImg from '../../assets/icons/swarmplot-dark-colored.p import { ICON_SIZE, Icon, colors, IconImg } from './styled' const values = [ - 1, - 1, - 2, - 2, - 2, - 2, - 2, - 3, - 3, - 3, - 3, - 3, - 3, - 3, - 3, - 4, - 4, - 4, - 5, - 5, - 6, - 6, - 6, - 6, - 6, - 7, - 7, - 8, - 9, + 1, 1, 2, 2, 2, 2, 2, 3, 3, 3, 3, 3, 3, 3, 3, 4, 4, 4, 5, 5, 6, 6, 6, 6, 6, 7, 7, 8, 9, ] const chartProps = { diff --git a/website/src/data/components/bar/props.ts b/website/src/data/components/bar/props.ts index 9d387f2c83..433cb2dade 100644 --- a/website/src/data/components/bar/props.ts +++ b/website/src/data/components/bar/props.ts @@ -128,8 +128,7 @@ const props: ChartProperty[] = [ }, { key: 'reverse', - help: - 'Reverse bars, starts on top instead of bottom for vertical layout and right instead of left for horizontal one.', + help: 'Reverse bars, starts on top instead of bottom for vertical layout and right instead of left for horizontal one.', type: 'boolean', required: false, defaultValue: svgDefaultProps.reverse, diff --git a/website/src/data/components/chord/props.ts b/website/src/data/components/chord/props.ts index 859cdd46aa..f5a6285943 100644 --- a/website/src/data/components/chord/props.ts +++ b/website/src/data/components/chord/props.ts @@ -236,8 +236,7 @@ const props: ChartProperty[] = [ }, { key: 'label', - help: - 'Defines how to get label text, can be a string (used to access current arc data property) or a function which will receive the actual arc data.', + help: 'Defines how to get label text, can be a string (used to access current arc data property) or a function which will receive the actual arc data.', type: 'string | Function', required: false, defaultValue: defaults.label, diff --git a/website/src/data/components/circle-packing/meta.yml b/website/src/data/components/circle-packing/meta.yml index 467efe8398..f70689d5c1 100644 --- a/website/src/data/components/circle-packing/meta.yml +++ b/website/src/data/components/circle-packing/meta.yml @@ -5,9 +5,8 @@ flavors: path: /circle-packing/html/ - flavor: canvas path: /circle-packing/canvas/ - # Disabled until the API is fixed - # - flavor: api - # path: /circle-packing/api/ + - flavor: api + path: /circle-packing/api/ CirclePacking: package: '@nivo/circle-packing' diff --git a/website/src/data/components/circle-packing/props.ts b/website/src/data/components/circle-packing/props.ts index b628023fff..8973ce145d 100644 --- a/website/src/data/components/circle-packing/props.ts +++ b/website/src/data/components/circle-packing/props.ts @@ -220,8 +220,7 @@ const props: ChartProperty[] = [ }, { key: 'childColor', - help: - 'Defines how to compute child nodes color, only used when inheritColorFromParent is enabled.', + help: 'Defines how to compute child nodes color, only used when inheritColorFromParent is enabled.', type: 'string | object | Function', required: false, defaultValue: defaultProps.childColor, diff --git a/website/src/data/components/line/props.ts b/website/src/data/components/line/props.ts index b753f11308..e349f33642 100644 --- a/website/src/data/components/line/props.ts +++ b/website/src/data/components/line/props.ts @@ -301,8 +301,7 @@ const props: ChartProperty[] = [ { key: 'pointSymbol', flavors: ['svg'], - help: - 'Overrides default point circle. The function will receive `size`, `color`, `borderWidth` and `borderColor` props and must return a valid SVG element.', + help: 'Overrides default point circle. The function will receive `size`, `color`, `borderWidth` and `borderColor` props and must return a valid SVG element.', type: 'Function', required: false, group: 'Points', @@ -362,8 +361,7 @@ const props: ChartProperty[] = [ key: 'pointLabel', flavors: ['svg', 'api'], group: 'Points', - help: - 'Property to use to determine point label. If a function is provided, it will receive current point data and should return the desired label.', + help: 'Property to use to determine point label. If a function is provided, it will receive current point data and should return the desired label.', type: 'string', required: false, controlType: 'choices', diff --git a/website/src/data/components/pie/props.ts b/website/src/data/components/pie/props.ts index bc0cd14603..84fe9e7126 100644 --- a/website/src/data/components/pie/props.ts +++ b/website/src/data/components/pie/props.ts @@ -282,8 +282,7 @@ const props: ChartProperty[] = [ }, { key: 'arcLabel', - help: - 'Defines how to get label text, can be a string (used to access current node data property) or a function which will receive the actual node data.', + help: 'Defines how to get label text, can be a string (used to access current node data property) or a function which will receive the actual node data.', type: 'string | Function', required: false, defaultValue: defaultProps.arcLabel, diff --git a/website/src/data/components/radar/props.ts b/website/src/data/components/radar/props.ts index 30f43fa3a9..c4782d539a 100644 --- a/website/src/data/components/radar/props.ts +++ b/website/src/data/components/radar/props.ts @@ -189,8 +189,7 @@ const props: ChartProperty[] = [ group: 'Style', type: 'string', required: false, - help: - 'Defines CSS [mix-blend-mode](https://developer.mozilla.org/fr/docs/Web/CSS/mix-blend-mode) for shapes.', + help: 'Defines CSS [mix-blend-mode](https://developer.mozilla.org/fr/docs/Web/CSS/mix-blend-mode) for shapes.', flavors: ['svg'], defaultValue: svgDefaultProps.blendMode, controlType: 'blendMode', diff --git a/website/src/data/components/radial-bar/props.ts b/website/src/data/components/radial-bar/props.ts index 69b26d67f9..f924b2b99c 100644 --- a/website/src/data/components/radial-bar/props.ts +++ b/website/src/data/components/radial-bar/props.ts @@ -347,8 +347,7 @@ const props: ChartProperty[] = [ group: 'Labels', type: 'string | (bar: ComputedBar) => string', required: false, - help: - 'Defines how to get label text, can be a string (used to access current bar property) or a function which will receive the actual bar data.', + help: 'Defines how to get label text, can be a string (used to access current bar property) or a function which will receive the actual bar data.', flavors: ['svg'], defaultValue: svgDefaultProps.label, controlType: 'choices', diff --git a/website/src/data/components/sankey/props.ts b/website/src/data/components/sankey/props.ts index 13c792ac30..0c0f74e474 100644 --- a/website/src/data/components/sankey/props.ts +++ b/website/src/data/components/sankey/props.ts @@ -333,8 +333,7 @@ const props: ChartProperty[] = [ { key: 'linkBlendMode', flavors: ['svg'], - help: - 'Defines CSS [mix-blend-mode](https://developer.mozilla.org/fr/docs/Web/CSS/mix-blend-mode) property for links.', + help: 'Defines CSS [mix-blend-mode](https://developer.mozilla.org/fr/docs/Web/CSS/mix-blend-mode) property for links.', type: 'string', required: false, defaultValue: svgDefaultProps.linkBlendMode, diff --git a/website/src/data/components/sunburst/props.ts b/website/src/data/components/sunburst/props.ts index a3edcbb835..7fec74eca2 100644 --- a/website/src/data/components/sunburst/props.ts +++ b/website/src/data/components/sunburst/props.ts @@ -240,8 +240,7 @@ const props: ChartProperty[] = [ }, { key: 'arcLabel', - help: - 'Defines how to get label text, can be a string (used to access current node data property) or a function which will receive the actual node data.', + help: 'Defines how to get label text, can be a string (used to access current node data property) or a function which will receive the actual node data.', type: 'string | Function', required: false, defaultValue: defaultProps.arcLabel, diff --git a/website/src/data/components/swarmplot/props.ts b/website/src/data/components/swarmplot/props.ts index 5756ee81b0..f07586c47a 100644 --- a/website/src/data/components/swarmplot/props.ts +++ b/website/src/data/components/swarmplot/props.ts @@ -73,8 +73,7 @@ const props: ChartProperty[] = [ group: 'Base', type: 'string | Function', required: false, - help: - 'Propety used to group nodes, must return a group which is available in the groups property.', + help: 'Propety used to group nodes, must return a group which is available in the groups property.', defaultValue: defaultProps.groupBy, }, { @@ -446,8 +445,7 @@ const props: ChartProperty[] = [ }, { key: 'debugMesh', - help: - 'Display the mesh used to detect mouse interactions (voronoi cells), depends on useMesh.', + help: 'Display the mesh used to detect mouse interactions (voronoi cells), depends on useMesh.', type: 'boolean', required: false, defaultValue: defaultProps.debugMesh, diff --git a/website/src/data/components/treemap/props.ts b/website/src/data/components/treemap/props.ts index 70be125004..244cda858e 100644 --- a/website/src/data/components/treemap/props.ts +++ b/website/src/data/components/treemap/props.ts @@ -105,6 +105,7 @@ const props: ChartProperty[] = [ { key: 'width', group: 'Base', + flavors: ['svg', 'canvas', 'html', 'api'], enableControlForFlavors: ['api'], help: 'Chart width.', description: ` @@ -117,6 +118,7 @@ const props: ChartProperty[] = [ { key: 'height', group: 'Base', + flavors: ['svg', 'canvas', 'html', 'api'], enableControlForFlavors: ['api'], help: 'Chart height.', description: ` @@ -216,8 +218,7 @@ const props: ChartProperty[] = [ }, { key: 'labelSkipSize', - help: - 'Skip label rendering if node minimal side length is lower than given value, 0 to disable.', + help: 'Skip label rendering if node minimal side length is lower than given value, 0 to disable.', type: 'number', required: false, controlType: 'range', diff --git a/website/src/data/nav.js b/website/src/data/nav.js index c6b1afdbe2..afdeb2b5c7 100644 --- a/website/src/data/nav.js +++ b/website/src/data/nav.js @@ -217,13 +217,12 @@ const all = components.concat([ icon: 'circle-packing', tags: circlePacking.CirclePackingCanvas.tags, }, - // Disabled until the API is fixed - // { - // label: 'CirclePacking HTTP API', - // path: '/circle-packing/api/', - // icon: 'circle-packing', - // tags: [...circlePacking.CirclePacking.tags, 'HTTP API'], - // }, + { + label: 'CirclePacking HTTP API', + path: '/circle-packing/api/', + icon: 'circle-packing', + tags: [...circlePacking.CirclePacking.tags, 'HTTP API'], + }, { label: 'CalendarCanvas', path: '/calendar/canvas/', diff --git a/website/src/lib/settings.ts b/website/src/lib/settings.ts index fa1b0f2b37..a9a8a8b1e0 100644 --- a/website/src/lib/settings.ts +++ b/website/src/lib/settings.ts @@ -1,23 +1,22 @@ import omit from 'lodash/omit' import upperFirst from 'lodash/upperFirst' -export const settingsMapper = (mapping: any, { exclude = [] } = {}) => ( - settings: any, - options: any = {} -) => { - const overrides: any = {} +export const settingsMapper = + (mapping: any, { exclude = [] } = {}) => + (settings: any, options: any = {}) => { + const overrides: any = {} - Object.keys(settings).forEach(key => { - if (mapping[key]) { - overrides[key] = mapping[key](settings[key], settings, options) - } - }) + Object.keys(settings).forEach(key => { + if (mapping[key]) { + overrides[key] = mapping[key](settings[key], settings, options) + } + }) - return { - ...omit(settings, exclude), - ...overrides, + return { + ...omit(settings, exclude), + ...overrides, + } } -} export const mapAxis = (type: string) => (value: any, settings: any) => settings[`axis${upperFirst(type)}`].enable ? omit(value, ['enable']) : null diff --git a/website/src/pages/circle-packing/api.js b/website/src/pages/circle-packing/api.js index 909a543f22..44d6e0bd4f 100644 --- a/website/src/pages/circle-packing/api.js +++ b/website/src/pages/circle-packing/api.js @@ -18,7 +18,7 @@ const CirclePackingApi = () => { { bottom: 20, left: 20, }, - root: JSON.stringify(root, null, ' '), - identity: 'name', + data: JSON.stringify(root, null, ' '), + id: 'name', value: 'loc', valueFormat: { format: '', enabled: false }, colors: { scheme: 'nivo' }, @@ -52,7 +52,6 @@ const CirclePackingApi = () => { from: 'color', modifiers: [['darker', 0.8]], }, - labelTextDY: 4, borderWidth: 0, borderColor: { from: 'color', diff --git a/website/src/pages/sankey/api.js b/website/src/pages/sankey/api.js index 6ac737c79c..d02d56b2d8 100644 --- a/website/src/pages/sankey/api.js +++ b/website/src/pages/sankey/api.js @@ -38,8 +38,6 @@ const SankeyApi = () => { colors: { scheme: 'category10' }, nodeOpacity: 1, - nodeHoverOpacity: 1, - nodeHoverOthersOpacity: 0.35, nodeThickness: 18, nodeInnerPadding: 3, nodeSpacing: 24, @@ -51,8 +49,6 @@ const SankeyApi = () => { nodeBorderRadius: 0, linkOpacity: 0.5, - linkHoverOpacity: 0.6, - linkHoverOthersOpacity: 0.1, linkContract: 0, linkBlendMode: 'multiply', enableLinkGradient: true, diff --git a/website/src/pages/sunburst/api.js b/website/src/pages/sunburst/api.js index e4b78cf80c..212d102030 100644 --- a/website/src/pages/sunburst/api.js +++ b/website/src/pages/sunburst/api.js @@ -38,7 +38,7 @@ const SunburstApi = () => { borderColor: 'white', colors: { scheme: 'nivo' }, colorBy: 'id', - inheritColorFromParent: false, + inheritColorFromParent: true, childColor: { from: 'color', }, diff --git a/website/src/pages/treemap/api.js b/website/src/pages/treemap/api.js index 6d13ce2ae2..d6781e8a63 100644 --- a/website/src/pages/treemap/api.js +++ b/website/src/pages/treemap/api.js @@ -7,7 +7,7 @@ import mapper from '../../data/components/treemap/mapper' import { generateLightDataSet } from '../../data/components/treemap/generator' import meta from '../../data/components/treemap/meta.yml' -const data = generateLightDataSet() +const data = generateLightDataSet().root const TreeMapApi = () => { return ( @@ -18,10 +18,11 @@ const TreeMapApi = () => { chartClass="treemap" apiPath="/charts/treemap" flavors={meta.flavors} + dataProperty="data" controlGroups={groups} propsMapper={mapper} defaultProps={{ - root: JSON.stringify(data.root, null, ' '), + data: JSON.stringify(data, null, ' '), identity: 'name', value: 'loc', valueFormat: { format: '.02s', enabled: true }, @@ -30,6 +31,8 @@ const TreeMapApi = () => { innerPadding: TreeMapDefaultProps.innerPadding, outerPadding: TreeMapDefaultProps.outerPadding, + width: 800, + height: 560, margin: { top: 10, right: 10, @@ -55,13 +58,13 @@ const TreeMapApi = () => { modifiers: [['darker', 2]], }, - colors: { scheme: 'nivo' }, - colorBy: 'path.1', - nodeOpacity: 0.5, - borderWidth: 0, + colors: TreeMapDefaultProps.colors, + colorBy: TreeMapDefaultProps.colorBy, + nodeOpacity: TreeMapDefaultProps.nodeOpacity, + borderWidth: TreeMapDefaultProps.borderWidth, borderColor: { from: 'color', - modifiers: [['darker', 0.3]], + modifiers: [['darker', 0.1]], }, }} /> diff --git a/website/src/styles/icons.css b/website/src/styles/icons.css index 373a8729b5..883d738586 100644 --- a/website/src/styles/icons.css +++ b/website/src/styles/icons.css @@ -1,5 +1,5 @@ /* glue: 0.13 hash: cc3bb7ef36 */ - .sprite-icons-waffle-light-neutral, +.sprite-icons-waffle-light-neutral, .sprite-icons-waffle-light-colored, .sprite-icons-waffle-dark-neutral, .sprite-icons-waffle-dark-colored, @@ -124,762 +124,766 @@ .sprite-icons-area-bump-light-colored, .sprite-icons-area-bump-dark-neutral, .sprite-icons-area-bump-dark-colored { - background-image: url('../assets/icons.png'); - background-repeat: no-repeat; - } - - .sprite-icons-waffle-light-neutral { - background-position: -4px -4px; - width: 52px; - height: 52px; - } - - .sprite-icons-waffle-light-colored { - background-position: -64px -4px; - width: 52px; - height: 52px; - } - - .sprite-icons-waffle-dark-neutral { - background-position: -4px -64px; - width: 52px; - height: 52px; - } - - .sprite-icons-waffle-dark-colored { - background-position: -64px -64px; - width: 52px; - height: 52px; - } - - .sprite-icons-voronoi-red { - background-position: -124px -4px; - width: 52px; - height: 52px; - } - - .sprite-icons-voronoi-light-neutral { - background-position: -124px -64px; - width: 52px; - height: 52px; - } - - .sprite-icons-voronoi-light-colored { - background-position: -4px -124px; - width: 52px; - height: 52px; - } - - .sprite-icons-voronoi-grey { - background-position: -64px -124px; - width: 52px; - height: 52px; - } - - .sprite-icons-voronoi-dark-neutral { - background-position: -124px -124px; - width: 52px; - height: 52px; - } - - .sprite-icons-voronoi-dark-colored { - background-position: -184px -4px; - width: 52px; - height: 52px; - } - - .sprite-icons-treemap-red { - background-position: -184px -64px; - width: 52px; - height: 52px; - } - - .sprite-icons-treemap-light-neutral { - background-position: -184px -124px; - width: 52px; - height: 52px; - } - - .sprite-icons-treemap-light-colored { - background-position: -4px -184px; - width: 52px; - height: 52px; - } - - .sprite-icons-treemap-grey { - background-position: -64px -184px; - width: 52px; - height: 52px; - } - - .sprite-icons-treemap-dark-neutral { - background-position: -124px -184px; - width: 52px; - height: 52px; - } - - .sprite-icons-treemap-dark-colored { - background-position: -184px -184px; - width: 52px; - height: 52px; - } - - .sprite-icons-time-range-light-neutral { - background-position: -244px -4px; - width: 52px; - height: 52px; - } - - .sprite-icons-time-range-light-colored { - background-position: -244px -64px; - width: 52px; - height: 52px; - } - - .sprite-icons-time-range-dark-neutral { - background-position: -244px -124px; - width: 52px; - height: 52px; - } - - .sprite-icons-time-range-dark-colored { - background-position: -244px -184px; - width: 52px; - height: 52px; - } - - .sprite-icons-swarmplot-light-neutral { - background-position: -4px -244px; - width: 52px; - height: 52px; - } - - .sprite-icons-swarmplot-light-colored { - background-position: -64px -244px; - width: 52px; - height: 52px; - } - - .sprite-icons-swarmplot-dark-neutral { - background-position: -124px -244px; - width: 52px; - height: 52px; - } - - .sprite-icons-swarmplot-dark-colored { - background-position: -184px -244px; - width: 52px; - height: 52px; - } - - .sprite-icons-sunburst-red { - background-position: -244px -244px; - width: 52px; - height: 52px; - } - - .sprite-icons-sunburst-light-neutral { - background-position: -304px -4px; - width: 52px; - height: 52px; - } - - .sprite-icons-sunburst-light-colored { - background-position: -304px -64px; - width: 52px; - height: 52px; - } - - .sprite-icons-sunburst-grey { - background-position: -304px -124px; - width: 52px; - height: 52px; - } - - .sprite-icons-sunburst-dark-neutral { - background-position: -304px -184px; - width: 52px; - height: 52px; - } - - .sprite-icons-sunburst-dark-colored { - background-position: -304px -244px; - width: 52px; - height: 52px; - } - - .sprite-icons-stream-light-neutral { - background-position: -4px -304px; - width: 52px; - height: 52px; - } - - .sprite-icons-stream-light-colored { - background-position: -64px -304px; - width: 52px; - height: 52px; - } - - .sprite-icons-stream-dark-neutral { - background-position: -124px -304px; - width: 52px; - height: 52px; - } - - .sprite-icons-stream-dark-colored { - background-position: -184px -304px; - width: 52px; - height: 52px; - } - - .sprite-icons-scatterplot-light-neutral { - background-position: -244px -304px; - width: 52px; - height: 52px; - } - - .sprite-icons-scatterplot-light-colored { - background-position: -304px -304px; - width: 52px; - height: 52px; - } - - .sprite-icons-scatterplot-dark-neutral { - background-position: -364px -4px; - width: 52px; - height: 52px; - } - - .sprite-icons-scatterplot-dark-colored { - background-position: -364px -64px; - width: 52px; - height: 52px; - } - - .sprite-icons-sankey-red { - background-position: -364px -124px; - width: 52px; - height: 52px; - } - - .sprite-icons-sankey-light-neutral { - background-position: -364px -184px; - width: 52px; - height: 52px; - } - - .sprite-icons-sankey-light-colored { - background-position: -364px -244px; - width: 52px; - height: 52px; - } - - .sprite-icons-sankey-grey { - background-position: -364px -304px; - width: 52px; - height: 52px; - } - - .sprite-icons-sankey-dark-neutral { - background-position: -4px -364px; - width: 52px; - height: 52px; - } - - .sprite-icons-sankey-dark-colored { - background-position: -64px -364px; - width: 52px; - height: 52px; - } - - .sprite-icons-radial-bar-light-neutral { - background-position: -124px -364px; - width: 52px; - height: 52px; - } - - .sprite-icons-radial-bar-light-colored { - background-position: -184px -364px; - width: 52px; - height: 52px; - } - - .sprite-icons-radial-bar-dark-neutral { - background-position: -244px -364px; - width: 52px; - height: 52px; - } - - .sprite-icons-radial-bar-dark-colored { - background-position: -304px -364px; - width: 52px; - height: 52px; - } - - .sprite-icons-radar-light-neutral { - background-position: -364px -364px; - width: 52px; - height: 52px; - } - - .sprite-icons-radar-light-colored { - background-position: -424px -4px; - width: 52px; - height: 52px; - } - - .sprite-icons-radar-dark-neutral { - background-position: -424px -64px; - width: 52px; - height: 52px; - } - - .sprite-icons-radar-dark-colored { - background-position: -424px -124px; - width: 52px; - height: 52px; - } - - .sprite-icons-pie-light-neutral { - background-position: -424px -184px; - width: 52px; - height: 52px; - } - - .sprite-icons-pie-light-colored { - background-position: -424px -244px; - width: 52px; - height: 52px; - } - - .sprite-icons-pie-dark-neutral { - background-position: -424px -304px; - width: 52px; - height: 52px; - } - - .sprite-icons-pie-dark-colored { - background-position: -424px -364px; - width: 52px; - height: 52px; - } - - .sprite-icons-parallel-coordinates-light-neutral { - background-position: -4px -424px; - width: 52px; - height: 52px; - } - - .sprite-icons-parallel-coordinates-light-colored { - background-position: -64px -424px; - width: 52px; - height: 52px; - } - - .sprite-icons-parallel-coordinates-dark-neutral { - background-position: -124px -424px; - width: 52px; - height: 52px; - } - - .sprite-icons-parallel-coordinates-dark-colored { - background-position: -184px -424px; - width: 52px; - height: 52px; - } - - .sprite-icons-nivo-icon { - background-position: -244px -424px; - width: 52px; - height: 52px; - } - - .sprite-icons-network-light-neutral { - background-position: -304px -424px; - width: 52px; - height: 52px; - } - - .sprite-icons-network-light-colored { - background-position: -364px -424px; - width: 52px; - height: 52px; - } - - .sprite-icons-network-dark-neutral { - background-position: -424px -424px; - width: 52px; - height: 52px; - } - - .sprite-icons-network-dark-colored { - background-position: -484px -4px; - width: 52px; - height: 52px; - } - - .sprite-icons-marimekko-light-neutral { - background-position: -484px -64px; - width: 52px; - height: 52px; - } - - .sprite-icons-marimekko-light-colored { - background-position: -484px -124px; - width: 52px; - height: 52px; - } - - .sprite-icons-marimekko-dark-neutral { - background-position: -484px -184px; - width: 52px; - height: 52px; - } - - .sprite-icons-marimekko-dark-colored { - background-position: -484px -244px; - width: 52px; - height: 52px; - } - - .sprite-icons-line-light-neutral { - background-position: -484px -304px; - width: 52px; - height: 52px; - } - - .sprite-icons-line-light-colored { - background-position: -484px -364px; - width: 52px; - height: 52px; - } - - .sprite-icons-line-dark-neutral { - background-position: -484px -424px; - width: 52px; - height: 52px; - } - - .sprite-icons-line-dark-colored { - background-position: -4px -484px; - width: 52px; - height: 52px; - } - - .sprite-icons-heatmap-light-neutral { - background-position: -64px -484px; - width: 52px; - height: 52px; - } - - .sprite-icons-heatmap-light-colored { - background-position: -124px -484px; - width: 52px; - height: 52px; - } - - .sprite-icons-heatmap-dark-neutral { - background-position: -184px -484px; - width: 52px; - height: 52px; - } - - .sprite-icons-heatmap-dark-colored { - background-position: -244px -484px; - width: 52px; - height: 52px; - } - - .sprite-icons-geomap-light-neutral { - background-position: -304px -484px; - width: 52px; - height: 52px; - } - - .sprite-icons-geomap-light-colored { - background-position: -364px -484px; - width: 52px; - height: 52px; - } - - .sprite-icons-geomap-dark-neutral { - background-position: -424px -484px; - width: 52px; - height: 52px; - } - - .sprite-icons-geomap-dark-colored { - background-position: -484px -484px; - width: 52px; - height: 52px; - } - - .sprite-icons-funnel-light-neutral { - background-position: -544px -4px; - width: 52px; - height: 52px; - } - - .sprite-icons-funnel-light-colored { - background-position: -544px -64px; - width: 52px; - height: 52px; - } - - .sprite-icons-funnel-dark-neutral { - background-position: -544px -124px; - width: 52px; - height: 52px; - } - - .sprite-icons-funnel-dark-colored { - background-position: -544px -184px; - width: 52px; - height: 52px; - } - - .sprite-icons-data-light-neutral { - background-position: -544px -244px; - width: 52px; - height: 52px; - } - - .sprite-icons-data-light-colored { - background-position: -544px -304px; - width: 52px; - height: 52px; - } - - .sprite-icons-data-dark-neutral { - background-position: -544px -364px; - width: 52px; - height: 52px; - } - - .sprite-icons-data-dark-colored { - background-position: -544px -424px; - width: 52px; - height: 52px; - } - - .sprite-icons-code-light-neutral { - background-position: -544px -484px; - width: 52px; - height: 52px; - } - - .sprite-icons-code-light-colored { - background-position: -4px -544px; - width: 52px; - height: 52px; - } - - .sprite-icons-code-dark-neutral { - background-position: -64px -544px; - width: 52px; - height: 52px; - } - - .sprite-icons-code-dark-colored { - background-position: -124px -544px; - width: 52px; - height: 52px; - } - - .sprite-icons-circle-packing-light-neutral { - background-position: -184px -544px; - width: 52px; - height: 52px; - } - - .sprite-icons-circle-packing-light-colored { - background-position: -244px -544px; - width: 52px; - height: 52px; - } - - .sprite-icons-circle-packing-dark-neutral { - background-position: -304px -544px; - width: 52px; - height: 52px; - } - - .sprite-icons-circle-packing-dark-colored { - background-position: -364px -544px; - width: 52px; - height: 52px; - } - - .sprite-icons-choropleth-light-neutral { - background-position: -424px -544px; - width: 52px; - height: 52px; - } - - .sprite-icons-choropleth-light-colored { - background-position: -484px -544px; - width: 52px; - height: 52px; - } - - .sprite-icons-choropleth-dark-neutral { - background-position: -544px -544px; - width: 52px; - height: 52px; - } - - .sprite-icons-choropleth-dark-colored { - background-position: -604px -4px; - width: 52px; - height: 52px; - } - - .sprite-icons-chord-light-neutral { - background-position: -604px -64px; - width: 52px; - height: 52px; - } - - .sprite-icons-chord-light-colored { - background-position: -604px -124px; - width: 52px; - height: 52px; - } - - .sprite-icons-chord-dark-neutral { - background-position: -604px -184px; - width: 52px; - height: 52px; - } - - .sprite-icons-chord-dark-colored { - background-position: -604px -244px; - width: 52px; - height: 52px; - } - - .sprite-icons-calendar-light-neutral { - background-position: -604px -304px; - width: 52px; - height: 52px; - } - - .sprite-icons-calendar-light-colored { - background-position: -604px -364px; - width: 52px; - height: 52px; - } - - .sprite-icons-calendar-dark-neutral { - background-position: -604px -424px; - width: 52px; - height: 52px; - } - - .sprite-icons-calendar-dark-colored { - background-position: -604px -484px; - width: 52px; - height: 52px; - } - - .sprite-icons-bump-light-neutral { - background-position: -604px -544px; - width: 52px; - height: 52px; - } - - .sprite-icons-bump-light-colored { - background-position: -4px -604px; - width: 52px; - height: 52px; - } - - .sprite-icons-bump-dark-neutral { - background-position: -64px -604px; - width: 52px; - height: 52px; - } - - .sprite-icons-bump-dark-colored { - background-position: -124px -604px; - width: 52px; - height: 52px; - } - - .sprite-icons-bullet-light-neutral { - background-position: -184px -604px; - width: 52px; - height: 52px; - } - - .sprite-icons-bullet-light-colored { - background-position: -244px -604px; - width: 52px; - height: 52px; - } - - .sprite-icons-bullet-dark-neutral { - background-position: -304px -604px; - width: 52px; - height: 52px; - } - - .sprite-icons-bullet-dark-colored { - background-position: -364px -604px; - width: 52px; - height: 52px; - } - - .sprite-icons-bar-light-neutral { - background-position: -424px -604px; - width: 52px; - height: 52px; - } - - .sprite-icons-bar-light-colored { - background-position: -484px -604px; - width: 52px; - height: 52px; - } - - .sprite-icons-bar-dark-neutral { - background-position: -544px -604px; - width: 52px; - height: 52px; - } - - .sprite-icons-bar-dark-colored { - background-position: -604px -604px; - width: 52px; - height: 52px; - } - - .sprite-icons-area-bump-light-neutral { - background-position: -664px -4px; - width: 52px; - height: 52px; - } - - .sprite-icons-area-bump-light-colored { - background-position: -664px -64px; - width: 52px; - height: 52px; - } - - .sprite-icons-area-bump-dark-neutral { - background-position: -664px -124px; - width: 52px; - height: 52px; - } - - .sprite-icons-area-bump-dark-colored { - background-position: -664px -184px; - width: 52px; - height: 52px; - } - - @media screen and (-webkit-min-device-pixel-ratio: 1.0), screen and (min--moz-device-pixel-ratio: 1.0), screen and (-o-min-device-pixel-ratio: 100/100), screen and (min-device-pixel-ratio: 1.0), screen and (min-resolution: 1.0dppx) { - .sprite-icons-waffle-light-neutral, + background-image: url('../assets/icons.png'); + background-repeat: no-repeat; +} + +.sprite-icons-waffle-light-neutral { + background-position: -4px -4px; + width: 52px; + height: 52px; +} + +.sprite-icons-waffle-light-colored { + background-position: -64px -4px; + width: 52px; + height: 52px; +} + +.sprite-icons-waffle-dark-neutral { + background-position: -4px -64px; + width: 52px; + height: 52px; +} + +.sprite-icons-waffle-dark-colored { + background-position: -64px -64px; + width: 52px; + height: 52px; +} + +.sprite-icons-voronoi-red { + background-position: -124px -4px; + width: 52px; + height: 52px; +} + +.sprite-icons-voronoi-light-neutral { + background-position: -124px -64px; + width: 52px; + height: 52px; +} + +.sprite-icons-voronoi-light-colored { + background-position: -4px -124px; + width: 52px; + height: 52px; +} + +.sprite-icons-voronoi-grey { + background-position: -64px -124px; + width: 52px; + height: 52px; +} + +.sprite-icons-voronoi-dark-neutral { + background-position: -124px -124px; + width: 52px; + height: 52px; +} + +.sprite-icons-voronoi-dark-colored { + background-position: -184px -4px; + width: 52px; + height: 52px; +} + +.sprite-icons-treemap-red { + background-position: -184px -64px; + width: 52px; + height: 52px; +} + +.sprite-icons-treemap-light-neutral { + background-position: -184px -124px; + width: 52px; + height: 52px; +} + +.sprite-icons-treemap-light-colored { + background-position: -4px -184px; + width: 52px; + height: 52px; +} + +.sprite-icons-treemap-grey { + background-position: -64px -184px; + width: 52px; + height: 52px; +} + +.sprite-icons-treemap-dark-neutral { + background-position: -124px -184px; + width: 52px; + height: 52px; +} + +.sprite-icons-treemap-dark-colored { + background-position: -184px -184px; + width: 52px; + height: 52px; +} + +.sprite-icons-time-range-light-neutral { + background-position: -244px -4px; + width: 52px; + height: 52px; +} + +.sprite-icons-time-range-light-colored { + background-position: -244px -64px; + width: 52px; + height: 52px; +} + +.sprite-icons-time-range-dark-neutral { + background-position: -244px -124px; + width: 52px; + height: 52px; +} + +.sprite-icons-time-range-dark-colored { + background-position: -244px -184px; + width: 52px; + height: 52px; +} + +.sprite-icons-swarmplot-light-neutral { + background-position: -4px -244px; + width: 52px; + height: 52px; +} + +.sprite-icons-swarmplot-light-colored { + background-position: -64px -244px; + width: 52px; + height: 52px; +} + +.sprite-icons-swarmplot-dark-neutral { + background-position: -124px -244px; + width: 52px; + height: 52px; +} + +.sprite-icons-swarmplot-dark-colored { + background-position: -184px -244px; + width: 52px; + height: 52px; +} + +.sprite-icons-sunburst-red { + background-position: -244px -244px; + width: 52px; + height: 52px; +} + +.sprite-icons-sunburst-light-neutral { + background-position: -304px -4px; + width: 52px; + height: 52px; +} + +.sprite-icons-sunburst-light-colored { + background-position: -304px -64px; + width: 52px; + height: 52px; +} + +.sprite-icons-sunburst-grey { + background-position: -304px -124px; + width: 52px; + height: 52px; +} + +.sprite-icons-sunburst-dark-neutral { + background-position: -304px -184px; + width: 52px; + height: 52px; +} + +.sprite-icons-sunburst-dark-colored { + background-position: -304px -244px; + width: 52px; + height: 52px; +} + +.sprite-icons-stream-light-neutral { + background-position: -4px -304px; + width: 52px; + height: 52px; +} + +.sprite-icons-stream-light-colored { + background-position: -64px -304px; + width: 52px; + height: 52px; +} + +.sprite-icons-stream-dark-neutral { + background-position: -124px -304px; + width: 52px; + height: 52px; +} + +.sprite-icons-stream-dark-colored { + background-position: -184px -304px; + width: 52px; + height: 52px; +} + +.sprite-icons-scatterplot-light-neutral { + background-position: -244px -304px; + width: 52px; + height: 52px; +} + +.sprite-icons-scatterplot-light-colored { + background-position: -304px -304px; + width: 52px; + height: 52px; +} + +.sprite-icons-scatterplot-dark-neutral { + background-position: -364px -4px; + width: 52px; + height: 52px; +} + +.sprite-icons-scatterplot-dark-colored { + background-position: -364px -64px; + width: 52px; + height: 52px; +} + +.sprite-icons-sankey-red { + background-position: -364px -124px; + width: 52px; + height: 52px; +} + +.sprite-icons-sankey-light-neutral { + background-position: -364px -184px; + width: 52px; + height: 52px; +} + +.sprite-icons-sankey-light-colored { + background-position: -364px -244px; + width: 52px; + height: 52px; +} + +.sprite-icons-sankey-grey { + background-position: -364px -304px; + width: 52px; + height: 52px; +} + +.sprite-icons-sankey-dark-neutral { + background-position: -4px -364px; + width: 52px; + height: 52px; +} + +.sprite-icons-sankey-dark-colored { + background-position: -64px -364px; + width: 52px; + height: 52px; +} + +.sprite-icons-radial-bar-light-neutral { + background-position: -124px -364px; + width: 52px; + height: 52px; +} + +.sprite-icons-radial-bar-light-colored { + background-position: -184px -364px; + width: 52px; + height: 52px; +} + +.sprite-icons-radial-bar-dark-neutral { + background-position: -244px -364px; + width: 52px; + height: 52px; +} + +.sprite-icons-radial-bar-dark-colored { + background-position: -304px -364px; + width: 52px; + height: 52px; +} + +.sprite-icons-radar-light-neutral { + background-position: -364px -364px; + width: 52px; + height: 52px; +} + +.sprite-icons-radar-light-colored { + background-position: -424px -4px; + width: 52px; + height: 52px; +} + +.sprite-icons-radar-dark-neutral { + background-position: -424px -64px; + width: 52px; + height: 52px; +} + +.sprite-icons-radar-dark-colored { + background-position: -424px -124px; + width: 52px; + height: 52px; +} + +.sprite-icons-pie-light-neutral { + background-position: -424px -184px; + width: 52px; + height: 52px; +} + +.sprite-icons-pie-light-colored { + background-position: -424px -244px; + width: 52px; + height: 52px; +} + +.sprite-icons-pie-dark-neutral { + background-position: -424px -304px; + width: 52px; + height: 52px; +} + +.sprite-icons-pie-dark-colored { + background-position: -424px -364px; + width: 52px; + height: 52px; +} + +.sprite-icons-parallel-coordinates-light-neutral { + background-position: -4px -424px; + width: 52px; + height: 52px; +} + +.sprite-icons-parallel-coordinates-light-colored { + background-position: -64px -424px; + width: 52px; + height: 52px; +} + +.sprite-icons-parallel-coordinates-dark-neutral { + background-position: -124px -424px; + width: 52px; + height: 52px; +} + +.sprite-icons-parallel-coordinates-dark-colored { + background-position: -184px -424px; + width: 52px; + height: 52px; +} + +.sprite-icons-nivo-icon { + background-position: -244px -424px; + width: 52px; + height: 52px; +} + +.sprite-icons-network-light-neutral { + background-position: -304px -424px; + width: 52px; + height: 52px; +} + +.sprite-icons-network-light-colored { + background-position: -364px -424px; + width: 52px; + height: 52px; +} + +.sprite-icons-network-dark-neutral { + background-position: -424px -424px; + width: 52px; + height: 52px; +} + +.sprite-icons-network-dark-colored { + background-position: -484px -4px; + width: 52px; + height: 52px; +} + +.sprite-icons-marimekko-light-neutral { + background-position: -484px -64px; + width: 52px; + height: 52px; +} + +.sprite-icons-marimekko-light-colored { + background-position: -484px -124px; + width: 52px; + height: 52px; +} + +.sprite-icons-marimekko-dark-neutral { + background-position: -484px -184px; + width: 52px; + height: 52px; +} + +.sprite-icons-marimekko-dark-colored { + background-position: -484px -244px; + width: 52px; + height: 52px; +} + +.sprite-icons-line-light-neutral { + background-position: -484px -304px; + width: 52px; + height: 52px; +} + +.sprite-icons-line-light-colored { + background-position: -484px -364px; + width: 52px; + height: 52px; +} + +.sprite-icons-line-dark-neutral { + background-position: -484px -424px; + width: 52px; + height: 52px; +} + +.sprite-icons-line-dark-colored { + background-position: -4px -484px; + width: 52px; + height: 52px; +} + +.sprite-icons-heatmap-light-neutral { + background-position: -64px -484px; + width: 52px; + height: 52px; +} + +.sprite-icons-heatmap-light-colored { + background-position: -124px -484px; + width: 52px; + height: 52px; +} + +.sprite-icons-heatmap-dark-neutral { + background-position: -184px -484px; + width: 52px; + height: 52px; +} + +.sprite-icons-heatmap-dark-colored { + background-position: -244px -484px; + width: 52px; + height: 52px; +} + +.sprite-icons-geomap-light-neutral { + background-position: -304px -484px; + width: 52px; + height: 52px; +} + +.sprite-icons-geomap-light-colored { + background-position: -364px -484px; + width: 52px; + height: 52px; +} + +.sprite-icons-geomap-dark-neutral { + background-position: -424px -484px; + width: 52px; + height: 52px; +} + +.sprite-icons-geomap-dark-colored { + background-position: -484px -484px; + width: 52px; + height: 52px; +} + +.sprite-icons-funnel-light-neutral { + background-position: -544px -4px; + width: 52px; + height: 52px; +} + +.sprite-icons-funnel-light-colored { + background-position: -544px -64px; + width: 52px; + height: 52px; +} + +.sprite-icons-funnel-dark-neutral { + background-position: -544px -124px; + width: 52px; + height: 52px; +} + +.sprite-icons-funnel-dark-colored { + background-position: -544px -184px; + width: 52px; + height: 52px; +} + +.sprite-icons-data-light-neutral { + background-position: -544px -244px; + width: 52px; + height: 52px; +} + +.sprite-icons-data-light-colored { + background-position: -544px -304px; + width: 52px; + height: 52px; +} + +.sprite-icons-data-dark-neutral { + background-position: -544px -364px; + width: 52px; + height: 52px; +} + +.sprite-icons-data-dark-colored { + background-position: -544px -424px; + width: 52px; + height: 52px; +} + +.sprite-icons-code-light-neutral { + background-position: -544px -484px; + width: 52px; + height: 52px; +} + +.sprite-icons-code-light-colored { + background-position: -4px -544px; + width: 52px; + height: 52px; +} + +.sprite-icons-code-dark-neutral { + background-position: -64px -544px; + width: 52px; + height: 52px; +} + +.sprite-icons-code-dark-colored { + background-position: -124px -544px; + width: 52px; + height: 52px; +} + +.sprite-icons-circle-packing-light-neutral { + background-position: -184px -544px; + width: 52px; + height: 52px; +} + +.sprite-icons-circle-packing-light-colored { + background-position: -244px -544px; + width: 52px; + height: 52px; +} + +.sprite-icons-circle-packing-dark-neutral { + background-position: -304px -544px; + width: 52px; + height: 52px; +} + +.sprite-icons-circle-packing-dark-colored { + background-position: -364px -544px; + width: 52px; + height: 52px; +} + +.sprite-icons-choropleth-light-neutral { + background-position: -424px -544px; + width: 52px; + height: 52px; +} + +.sprite-icons-choropleth-light-colored { + background-position: -484px -544px; + width: 52px; + height: 52px; +} + +.sprite-icons-choropleth-dark-neutral { + background-position: -544px -544px; + width: 52px; + height: 52px; +} + +.sprite-icons-choropleth-dark-colored { + background-position: -604px -4px; + width: 52px; + height: 52px; +} + +.sprite-icons-chord-light-neutral { + background-position: -604px -64px; + width: 52px; + height: 52px; +} + +.sprite-icons-chord-light-colored { + background-position: -604px -124px; + width: 52px; + height: 52px; +} + +.sprite-icons-chord-dark-neutral { + background-position: -604px -184px; + width: 52px; + height: 52px; +} + +.sprite-icons-chord-dark-colored { + background-position: -604px -244px; + width: 52px; + height: 52px; +} + +.sprite-icons-calendar-light-neutral { + background-position: -604px -304px; + width: 52px; + height: 52px; +} + +.sprite-icons-calendar-light-colored { + background-position: -604px -364px; + width: 52px; + height: 52px; +} + +.sprite-icons-calendar-dark-neutral { + background-position: -604px -424px; + width: 52px; + height: 52px; +} + +.sprite-icons-calendar-dark-colored { + background-position: -604px -484px; + width: 52px; + height: 52px; +} + +.sprite-icons-bump-light-neutral { + background-position: -604px -544px; + width: 52px; + height: 52px; +} + +.sprite-icons-bump-light-colored { + background-position: -4px -604px; + width: 52px; + height: 52px; +} + +.sprite-icons-bump-dark-neutral { + background-position: -64px -604px; + width: 52px; + height: 52px; +} + +.sprite-icons-bump-dark-colored { + background-position: -124px -604px; + width: 52px; + height: 52px; +} + +.sprite-icons-bullet-light-neutral { + background-position: -184px -604px; + width: 52px; + height: 52px; +} + +.sprite-icons-bullet-light-colored { + background-position: -244px -604px; + width: 52px; + height: 52px; +} + +.sprite-icons-bullet-dark-neutral { + background-position: -304px -604px; + width: 52px; + height: 52px; +} + +.sprite-icons-bullet-dark-colored { + background-position: -364px -604px; + width: 52px; + height: 52px; +} + +.sprite-icons-bar-light-neutral { + background-position: -424px -604px; + width: 52px; + height: 52px; +} + +.sprite-icons-bar-light-colored { + background-position: -484px -604px; + width: 52px; + height: 52px; +} + +.sprite-icons-bar-dark-neutral { + background-position: -544px -604px; + width: 52px; + height: 52px; +} + +.sprite-icons-bar-dark-colored { + background-position: -604px -604px; + width: 52px; + height: 52px; +} + +.sprite-icons-area-bump-light-neutral { + background-position: -664px -4px; + width: 52px; + height: 52px; +} + +.sprite-icons-area-bump-light-colored { + background-position: -664px -64px; + width: 52px; + height: 52px; +} + +.sprite-icons-area-bump-dark-neutral { + background-position: -664px -124px; + width: 52px; + height: 52px; +} + +.sprite-icons-area-bump-dark-colored { + background-position: -664px -184px; + width: 52px; + height: 52px; +} + +@media screen and (-webkit-min-device-pixel-ratio: 1), + screen and (min--moz-device-pixel-ratio: 1), + screen and (-o-min-device-pixel-ratio: 100/100), + screen and (min-device-pixel-ratio: 1), + screen and (min-resolution: 1dppx) { + .sprite-icons-waffle-light-neutral, .sprite-icons-waffle-light-colored, .sprite-icons-waffle-dark-neutral, .sprite-icons-waffle-dark-colored, @@ -1004,15 +1008,19 @@ .sprite-icons-area-bump-light-colored, .sprite-icons-area-bump-dark-neutral, .sprite-icons-area-bump-dark-colored { - background-image: url('../assets/icons.png'); - -webkit-background-size: 720px 660px; - -moz-background-size: 720px 660px; - background-size: 720px 660px; - } - } - - @media screen and (-webkit-min-device-pixel-ratio: 2.0), screen and (min--moz-device-pixel-ratio: 2.0), screen and (-o-min-device-pixel-ratio: 200/100), screen and (min-device-pixel-ratio: 2.0), screen and (min-resolution: 2.0dppx) { - .sprite-icons-waffle-light-neutral, + background-image: url('../assets/icons.png'); + -webkit-background-size: 720px 660px; + -moz-background-size: 720px 660px; + background-size: 720px 660px; + } +} + +@media screen and (-webkit-min-device-pixel-ratio: 2), + screen and (min--moz-device-pixel-ratio: 2), + screen and (-o-min-device-pixel-ratio: 200/100), + screen and (min-device-pixel-ratio: 2), + screen and (min-resolution: 2dppx) { + .sprite-icons-waffle-light-neutral, .sprite-icons-waffle-light-colored, .sprite-icons-waffle-dark-neutral, .sprite-icons-waffle-dark-colored, @@ -1137,10 +1145,9 @@ .sprite-icons-area-bump-light-colored, .sprite-icons-area-bump-dark-neutral, .sprite-icons-area-bump-dark-colored { - background-image: url('../assets/icons@2x.png'); - -webkit-background-size: 720px 660px; - -moz-background-size: 720px 660px; - background-size: 720px 660px; - } - } - \ No newline at end of file + background-image: url('../assets/icons@2x.png'); + -webkit-background-size: 720px 660px; + -moz-background-size: 720px 660px; + background-size: 720px 660px; + } +} diff --git a/yarn.lock b/yarn.lock index 0fc4bc03ec..d1b6b7b7ae 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3392,6 +3392,27 @@ exec-sh "^0.3.2" minimist "^1.2.0" +"@cspotcode/source-map-consumer@0.8.0": + version "0.8.0" + resolved "https://registry.yarnpkg.com/@cspotcode/source-map-consumer/-/source-map-consumer-0.8.0.tgz#33bf4b7b39c178821606f669bbc447a6a629786b" + integrity sha512-41qniHzTU8yAGbCp04ohlmSrZf8bkf/iJsl3V0dRGsQN/5GFfx+LbCSsCpp2gqrqjTVg/K6O8ycoV35JIwAzAg== + +"@cspotcode/source-map-support@0.7.0": + version "0.7.0" + resolved "https://registry.yarnpkg.com/@cspotcode/source-map-support/-/source-map-support-0.7.0.tgz#4789840aa859e46d2f3173727ab707c66bf344f5" + integrity sha512-X4xqRHqN8ACt2aHVe51OxeA2HjbcL4MqFqXkrmQszJ1NOUuUu5u6Vqx/0lZSVNku7velL5FC/s5uEAj1lsBMhA== + dependencies: + "@cspotcode/source-map-consumer" "0.8.0" + +"@dabh/diagnostics@^2.0.2": + version "2.0.2" + resolved "https://registry.yarnpkg.com/@dabh/diagnostics/-/diagnostics-2.0.2.tgz#290d08f7b381b8f94607dc8f471a12c675f9db31" + integrity sha512-+A1YivoVDNNVCdfozHSR8v/jyuuLTMXwjWuxPFlFlUapXoGc+Gj9mDlTDDfrwl7rXCl2tNZ0kE8sIBO6YOn96Q== + dependencies: + colorspace "1.1.x" + enabled "2.0.x" + kuler "^2.0.0" + "@ekino/config@^0.3.0": version "0.3.0" resolved "https://registry.yarnpkg.com/@ekino/config/-/config-0.3.0.tgz#808b86345e5631bc1fdc2d339a291d2a4e7500ee" @@ -5512,6 +5533,13 @@ dependencies: "@hapi/hoek" "^9.0.0" +"@sideway/address@^4.1.3": + version "4.1.3" + resolved "https://registry.yarnpkg.com/@sideway/address/-/address-4.1.3.tgz#d93cce5d45c5daec92ad76db492cc2ee3c64ab27" + integrity sha512-8ncEUtmnTsMmL7z1YPB47kPUq7LpKWJNFPsRzHiIajGC5uXlWGn+AmkYPcHNl8S4tcEGx+cnORnNYaw2wvL+LQ== + dependencies: + "@hapi/hoek" "^9.0.0" + "@sideway/formula@^3.0.0": version "3.0.0" resolved "https://registry.yarnpkg.com/@sideway/formula/-/formula-3.0.0.tgz#fe158aee32e6bd5de85044be615bc08478a0a13c" @@ -6290,6 +6318,26 @@ resolved "https://registry.yarnpkg.com/@trysound/sax/-/sax-0.1.1.tgz#3348564048e7a2d7398c935d466c0414ebb6a669" integrity sha512-Z6DoceYb/1xSg5+e+ZlPZ9v0N16ZvZ+wYMraFue4HYrE4ttONKtsvruIRf6t9TBR0YvSOfi1hUU0fJfBLCDYow== +"@tsconfig/node10@^1.0.7": + version "1.0.8" + resolved "https://registry.yarnpkg.com/@tsconfig/node10/-/node10-1.0.8.tgz#c1e4e80d6f964fbecb3359c43bd48b40f7cadad9" + integrity sha512-6XFfSQmMgq0CFLY1MslA/CPUfhIL919M1rMsa5lP2P097N2Wd1sSX0tx1u4olM16fLNhtHZpRhedZJphNJqmZg== + +"@tsconfig/node12@^1.0.7": + version "1.0.9" + resolved "https://registry.yarnpkg.com/@tsconfig/node12/-/node12-1.0.9.tgz#62c1f6dee2ebd9aead80dc3afa56810e58e1a04c" + integrity sha512-/yBMcem+fbvhSREH+s14YJi18sp7J9jpuhYByADT2rypfajMZZN4WQ6zBGgBKp53NKmqI36wFYDb3yaMPurITw== + +"@tsconfig/node14@^1.0.0": + version "1.0.1" + resolved "https://registry.yarnpkg.com/@tsconfig/node14/-/node14-1.0.1.tgz#95f2d167ffb9b8d2068b0b235302fafd4df711f2" + integrity sha512-509r2+yARFfHHE7T6Puu2jjkoycftovhXRqW328PDXTVGKihlb1P8Z9mMZH04ebyajfRY7dedfGynlrFHJUQCg== + +"@tsconfig/node16@^1.0.2": + version "1.0.2" + resolved "https://registry.yarnpkg.com/@tsconfig/node16/-/node16-1.0.2.tgz#423c77877d0569db20e1fc80885ac4118314010e" + integrity sha512-eZxlbI8GZscaGS7kkc/trHTT5xgrjH3/1n2JDwusC9iahPKWMRvRjJSAN5mCXviuTGQ/lHnhvv8Q1YTpnfz9gA== + "@turist/fetch@^7.1.7": version "7.1.7" resolved "https://registry.yarnpkg.com/@turist/fetch/-/fetch-7.1.7.tgz#a2b1f7ec0265e6fe0946c51eef34bad9b9efc865" @@ -6351,6 +6399,14 @@ dependencies: "@babel/types" "^7.3.0" +"@types/body-parser@*", "@types/body-parser@^1.19.2": + version "1.19.2" + resolved "https://registry.yarnpkg.com/@types/body-parser/-/body-parser-1.19.2.tgz#aea2059e28b7658639081347ac4fab3de166e6f0" + integrity sha512-ALYone6pm6QmwZoAgeyNksccT9Q4AWZQ6PvfwR37GT6r6FWUPguq6sUmNGSMV2Wr761oQoBxwGGa6DR5o1DC9g== + dependencies: + "@types/connect" "*" + "@types/node" "*" + "@types/braces@*": version "3.0.0" resolved "https://registry.yarnpkg.com/@types/braces/-/braces-3.0.0.tgz#7da1c0d44ff1c7eb660a36ec078ea61ba7eb42cb" @@ -6393,12 +6449,19 @@ resolved "https://registry.yarnpkg.com/@types/configstore/-/configstore-2.1.1.tgz#cd1e8553633ad3185c3f2f239ecff5d2643e92b6" integrity sha1-zR6FU2M60xhcPy8jns/10mQ+krY= +"@types/connect@*": + version "3.4.35" + resolved "https://registry.yarnpkg.com/@types/connect/-/connect-3.4.35.tgz#5fcf6ae445e4021d1fc2219a4873cc73a3bb2ad1" + integrity sha512-cdeYyv4KWoEgpBISTxWvqYsVy444DOqehiF3fM3ne10AmJ62RSyNkUnxMJXHQWRQQX2eR94m5y1IZyDwBjV9FQ== + dependencies: + "@types/node" "*" + "@types/cookie@^0.4.0": version "0.4.1" resolved "https://registry.yarnpkg.com/@types/cookie/-/cookie-0.4.1.tgz#bfd02c1f2224567676c1545199f87c3a861d878d" integrity sha512-XW/Aa8APYr6jSVVA1y/DEIZX0/GMKLEVekNG727R8cs56ahETkRAy/3DR7+fJyh7oUgGwNQaRfXCun0+KbWY7Q== -"@types/cors@^2.8.8": +"@types/cors@^2.8.12", "@types/cors@^2.8.8": version "2.8.12" resolved "https://registry.yarnpkg.com/@types/cors/-/cors-2.8.12.tgz#6b2c510a7ad7039e98e7b8d3d6598f4359e5c080" integrity sha512-vt+kDhq/M2ayberEtJcIN/hxXy1Pk+59g2FV/ZQceeaTyCtCucjL2Q7FXlFjtWn4n15KCr1NE2lNNFhp0lEThw== @@ -6542,6 +6605,25 @@ resolved "https://registry.yarnpkg.com/@types/events/-/events-3.0.0.tgz#2862f3f58a9a7f7c3e78d79f130dd4d71c25c2a7" integrity sha512-EaObqwIvayI5a8dCzhFrjKzVwKLxjoG9T6Ppd5CEo07LRKfQ8Yokw54r5+Wq7FaBQ+yXRvQAYPrHwya1/UFt9g== +"@types/express-serve-static-core@^4.17.18": + version "4.17.26" + resolved "https://registry.yarnpkg.com/@types/express-serve-static-core/-/express-serve-static-core-4.17.26.tgz#5d9a8eeecb9d5f9d7fc1d85f541512a84638ae88" + integrity sha512-zeu3tpouA043RHxW0gzRxwCHchMgftE8GArRsvYT0ByDMbn19olQHx5jLue0LxWY6iYtXb7rXmuVtSkhy9YZvQ== + dependencies: + "@types/node" "*" + "@types/qs" "*" + "@types/range-parser" "*" + +"@types/express@^4.17.13": + version "4.17.13" + resolved "https://registry.yarnpkg.com/@types/express/-/express-4.17.13.tgz#a76e2995728999bab51a33fabce1d705a3709034" + integrity sha512-6bSZTPaTIACxn48l50SR+axgrqm6qXFIxrdAKaG6PaJk3+zuUr35hBlgT7vOmJcum+OEaIBLtHV/qloEAFITeA== + dependencies: + "@types/body-parser" "*" + "@types/express-serve-static-core" "^4.17.18" + "@types/qs" "*" + "@types/serve-static" "*" + "@types/get-port@^3.2.0": version "3.2.0" resolved "https://registry.yarnpkg.com/@types/get-port/-/get-port-3.2.0.tgz#f9e0a11443cc21336470185eae3dfba4495d29bc" @@ -6740,6 +6822,11 @@ dependencies: "@types/braces" "*" +"@types/mime@^1": + version "1.3.2" + resolved "https://registry.yarnpkg.com/@types/mime/-/mime-1.3.2.tgz#93e25bf9ee75fe0fd80b594bc4feb0e862111b5a" + integrity sha512-YATxVxgRqNH6nHEIsvg6k2Boc1JHI9ZbH5iWFFv/MTkchz3b1ieGDa5T0a9RznNdI0KhVbdbWSN+KWWrQZRxTw== + "@types/minimatch@*": version "3.0.3" resolved "https://registry.yarnpkg.com/@types/minimatch/-/minimatch-3.0.3.tgz#3dca0e3f33b200fc7d1139c0cd96c1268cadfd9d" @@ -6780,6 +6867,11 @@ resolved "https://registry.yarnpkg.com/@types/node/-/node-14.17.12.tgz#7a31f720b85a617e54e42d24c4ace136601656c7" integrity sha512-vhUqgjJR1qxwTWV5Ps5txuy2XMdf7Fw+OrdChRboy8BmWUPkckOhphaohzFG6b8DW7CrxaBMdrdJ47SYFq1okw== +"@types/node@^16.11.12": + version "16.11.12" + resolved "https://registry.yarnpkg.com/@types/node/-/node-16.11.12.tgz#ac7fb693ac587ee182c3780c26eb65546a1a3c10" + integrity sha512-+2Iggwg7PxoO5Kyhvsq9VarmPbIelXP070HMImEpbtGCoyWNINQj4wzjbQCXzdHTRXnqufutJb5KAURZANNBAw== + "@types/node@^8.5.7": version "8.10.66" resolved "https://registry.yarnpkg.com/@types/node/-/node-8.10.66.tgz#dd035d409df322acc83dff62a602f12a5783bbb3" @@ -6820,11 +6912,21 @@ resolved "https://registry.yarnpkg.com/@types/q/-/q-1.5.2.tgz#690a1475b84f2a884fd07cd797c00f5f31356ea8" integrity sha512-ce5d3q03Ex0sy4R14722Rmt6MT07Ua+k4FwDfdcToYJcMKNtRVQvJ6JCAPdAmAnbRb6CsX6aYb9m96NGod9uTw== +"@types/qs@*": + version "6.9.7" + resolved "https://registry.yarnpkg.com/@types/qs/-/qs-6.9.7.tgz#63bb7d067db107cc1e457c303bc25d511febf6cb" + integrity sha512-FGa1F62FT09qcrueBA6qYTrJPVDzah9a+493+o2PCXsesWHIn27G98TsSMs3WPNbZIEj4+VJf6saSFpvD+3Zsw== + "@types/qs@^6.9.0": version "6.9.5" resolved "https://registry.yarnpkg.com/@types/qs/-/qs-6.9.5.tgz#434711bdd49eb5ee69d90c1d67c354a9a8ecb18b" integrity sha512-/JHkVHtx/REVG0VVToGRGH2+23hsYLHdyG+GrvoUGlGAd0ErauXDyvHtRI/7H7mzLm+tBCKA7pfcpkQ1lf58iQ== +"@types/range-parser@*": + version "1.2.4" + resolved "https://registry.yarnpkg.com/@types/range-parser/-/range-parser-1.2.4.tgz#cd667bcfdd025213aafb7ca5915a932590acdcdc" + integrity sha512-EEhsLsD6UsDM1yFhAvy0Cjr6VwmpMWqFBCb9w07wVugF7w9nfajxLuVmngTIpgS6svCnm6Vaw+MZhoDCKnOfsw== + "@types/reach__router@^1.2.3": version "1.2.6" resolved "https://registry.yarnpkg.com/@types/reach__router/-/reach__router-1.2.6.tgz#b14cf1adbd1a365d204bbf6605cd9dd7b8816c87" @@ -6855,7 +6957,7 @@ dependencies: "@types/react" "*" -"@types/react-dom@^17.0.8": +"@types/react-dom@17.0.8", "@types/react-dom@^17.0.8": version "17.0.8" resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-17.0.8.tgz#3180de6d79bf53762001ad854e3ce49f36dd71fc" integrity sha512-0ohAiJAx1DAUEcY9UopnfwCE9sSMDGnY/oXjWMax6g3RpzmTt2GMyMVAXcbn0mo8XAff0SbQJl2/SBU+hjSZ1A== @@ -6897,7 +6999,7 @@ dependencies: "@types/react" "*" -"@types/react@*", "@types/react@^17.0.11": +"@types/react@*", "@types/react@17.0.11", "@types/react@^17.0.11": version "17.0.11" resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.11.tgz#67fcd0ddbf5a0b083a0f94e926c7d63f3b836451" integrity sha512-yFRQbD+whVonItSk7ZzP/L+gPTJVBkL/7shLEF+i9GC/1cV3JmUxEQz6+9ylhUpWSDuqo1N9qEvqS6vTj4USUA== @@ -6933,6 +7035,14 @@ resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.1.tgz#18845205e86ff0038517aab7a18a62a6b9f71275" integrity sha512-EaCxbanVeyxDRTQBkdLb3Bvl/HK7PBK6UJjsSixB0iHKoWxE5uu2Q/DgtpOhPIojN0Zl1whvOd7PoHs2P0s5eA== +"@types/serve-static@*": + version "1.13.10" + resolved "https://registry.yarnpkg.com/@types/serve-static/-/serve-static-1.13.10.tgz#f5e0ce8797d2d7cc5ebeda48a52c96c4fa47a8d9" + integrity sha512-nCkHGI4w7ZgAdNkrEu0bv+4xNV/XDqW+DydknebMOQwkpDGx8G+HTlj7R7ABI8i8nKxVw0wtKPi1D+lPOkh4YQ== + dependencies: + "@types/mime" "^1" + "@types/node" "*" + "@types/source-list-map@*": version "0.1.2" resolved "https://registry.yarnpkg.com/@types/source-list-map/-/source-list-map-0.1.2.tgz#0078836063ffaf17412349bba364087e0ac02ec9" @@ -6979,6 +7089,11 @@ resolved "https://registry.yarnpkg.com/@types/unist/-/unist-2.0.3.tgz#9c088679876f374eb5983f150d4787aa6fb32d7e" integrity sha512-FvUupuM3rlRsRtCN+fDudtmytGO6iHJuuRKS1Ss0pG5z8oX0diNEw94UEL7hgDbpN94rgaK5R7sWm6RrSkZuAQ== +"@types/uuid@^8.3.3": + version "8.3.3" + resolved "https://registry.yarnpkg.com/@types/uuid/-/uuid-8.3.3.tgz#c6a60686d953dbd1b1d45e66f4ecdbd5d471b4d0" + integrity sha512-0LbEEx1zxrYB3pgpd1M5lEhLcXjKJnYghvhTRgaBeUivLHMDM1TzF3IJ6hXU2+8uA4Xz+5BA63mtZo5DjVT8iA== + "@types/webpack-env@^1.15.2": version "1.15.3" resolved "https://registry.yarnpkg.com/@types/webpack-env/-/webpack-env-1.15.3.tgz#fb602cd4c2f0b7c0fb857e922075fdf677d25d84" @@ -7569,6 +7684,11 @@ acorn-walk@^7.1.1: resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-7.2.0.tgz#0de889a601203909b0fbe07b8938dc21d2e967bc" integrity sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA== +acorn-walk@^8.1.1: + version "8.2.0" + resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-8.2.0.tgz#741210f2e2426454508853a2f44d0ab83b7f69c1" + integrity sha512-k+iyHEuPgSw6SbuDpGQM+06HQUa04DZ3o+F6CSzXMvvI5KMvnaEqXe+YVe555R9nn6GPt404fos4wcgpw12SDA== + acorn@^6.4.1: version "6.4.2" resolved "https://registry.yarnpkg.com/acorn/-/acorn-6.4.2.tgz#35866fd710528e92de10cf06016498e47e39e1e6" @@ -7817,11 +7937,6 @@ ansi-styles@^4.0.0, ansi-styles@^4.1.0: "@types/color-name" "^1.1.1" color-convert "^2.0.1" -ansi-styles@~1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-1.0.0.tgz#cb102df1c56f5123eab8b67cd7b98027a0279178" - integrity sha1-yxAt8cVvUSPquLZ817mAJ6AnkXg= - ansi-to-html@^0.6.11: version "0.6.13" resolved "https://registry.yarnpkg.com/ansi-to-html/-/ansi-to-html-0.6.13.tgz#c72eae8b63e5ca0643aab11bfc6e6f2217425833" @@ -8223,16 +8338,16 @@ async@^2.6.2: dependencies: lodash "^4.17.14" +async@^3.1.0: + version "3.2.2" + resolved "https://registry.yarnpkg.com/async/-/async-3.2.2.tgz#2eb7671034bb2194d45d30e31e24ec7e7f9670cd" + integrity sha512-H0E+qZaDEfx/FY4t7iLRv1W2fFI6+pyCeTw1uN20AQPiwqwM6ojPxHxdLv4z8hi2DtnW9BOckSspLucW7pIE5g== + async@^3.2.0: version "3.2.1" resolved "https://registry.yarnpkg.com/async/-/async-3.2.1.tgz#d3274ec66d107a47476a4c49136aacdb00665fc8" integrity sha512-XdD5lRO/87udXCMC9meWdYiR+Nq6ZjUfXidViUZGu2F1MO4T3XwZ1et0hb2++BgLfhyJwy44BGB/yx80ABx8hg== -async@~1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/async/-/async-1.0.0.tgz#f8fc04ca3a13784ade9e1641af98578cfbd647a9" - integrity sha1-+PwEyjoTeErenhZBr5hXjPvWR6k= - asynckit@^0.4.0: version "0.4.0" resolved "https://registry.yarnpkg.com/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79" @@ -9108,22 +9223,6 @@ bn.js@^4.0.0, bn.js@^4.1.0, bn.js@^4.1.1, bn.js@^4.4.0: resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-4.11.8.tgz#2cde09eb5ee341f484746bb0309b3253b1b1442f" integrity sha512-ItfYfPLkWHUjckQCk8xC+LwxgK8NYcXywGigJgSwOP8Y2iyWT4f2vsZnoOXTTbo+o5yXmIUJ4gn5538SO5S3gA== -body-parser@1.18.3, body-parser@^1.17.2: - version "1.18.3" - resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.18.3.tgz#5b292198ffdd553b3a0f20ded0592b956955c8b4" - integrity sha1-WykhmP/dVTs6DyDe0FkrlWlVyLQ= - dependencies: - bytes "3.0.0" - content-type "~1.0.4" - debug "2.6.9" - depd "~1.1.2" - http-errors "~1.6.3" - iconv-lite "0.4.23" - on-finished "~2.3.0" - qs "6.5.2" - raw-body "2.3.3" - type-is "~1.6.16" - body-parser@1.19.0, body-parser@^1.19.0: version "1.19.0" resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.19.0.tgz#96b2709e57c9c4e09a6fd66a8fd979844f69f08a" @@ -9140,6 +9239,22 @@ body-parser@1.19.0, body-parser@^1.19.0: raw-body "2.4.0" type-is "~1.6.17" +body-parser@^1.17.2: + version "1.18.3" + resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.18.3.tgz#5b292198ffdd553b3a0f20ded0592b956955c8b4" + integrity sha1-WykhmP/dVTs6DyDe0FkrlWlVyLQ= + dependencies: + bytes "3.0.0" + content-type "~1.0.4" + debug "2.6.9" + depd "~1.1.2" + http-errors "~1.6.3" + iconv-lite "0.4.23" + on-finished "~2.3.0" + qs "6.5.2" + raw-body "2.3.3" + type-is "~1.6.16" + bonjour@^3.5.0: version "3.5.0" resolved "https://registry.yarnpkg.com/bonjour/-/bonjour-3.5.0.tgz#8e890a183d8ee9a2393b3844c691a42bcf7bc9f5" @@ -9829,15 +9944,6 @@ chalk@^4.1.2: ansi-styles "^4.1.0" supports-color "^7.1.0" -chalk@~0.4.0: - version "0.4.0" - resolved "https://registry.yarnpkg.com/chalk/-/chalk-0.4.0.tgz#5199a3ddcd0c1efe23bc08c1b027b06176e0c64f" - integrity sha1-UZmj3c0MHv4jvAjBsCewYXbgxk8= - dependencies: - ansi-styles "~1.0.0" - has-color "~0.1.0" - strip-ansi "~0.1.0" - char-regex@^1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/char-regex/-/char-regex-1.0.2.tgz#d744358226217f981ed58f479b1d6bcc29545dcf" @@ -10275,16 +10381,24 @@ colorette@^1.2.2, colorette@^1.3.0: resolved "https://registry.yarnpkg.com/colorette/-/colorette-1.3.0.tgz#ff45d2f0edb244069d3b772adeb04fed38d0a0af" integrity sha512-ecORCqbSFP7Wm8Y6lyqMJjexBQqXSF7SSeaTyGGphogUjBlFP9m9o08wy86HL2uB7fMTxtOUzLMk7ogKcxMg1w== -colors@1.0.x: - version "1.0.3" - resolved "https://registry.yarnpkg.com/colors/-/colors-1.0.3.tgz#0433f44d809680fdeb60ed260f1b0c262e82a40b" - integrity sha1-BDP0TYCWgP3rYO0mDxsMJi6CpAs= - colors@^1.1.2: version "1.3.3" resolved "https://registry.yarnpkg.com/colors/-/colors-1.3.3.tgz#39e005d546afe01e01f9c4ca8fa50f686a01205d" integrity sha512-mmGt/1pZqYRjMxB1axhTo16/snVZ5krrKkcmMeVKxzECMMXoCgnvTPp10QgHfcbQZw8Dq2jMNG6je4JlWU0gWg== +colors@^1.2.1: + version "1.4.0" + resolved "https://registry.yarnpkg.com/colors/-/colors-1.4.0.tgz#c50491479d4c1bdaed2c9ced32cf7c7dc2360f78" + integrity sha512-a+UqTh4kgZg/SlGvfbzDHpgRu7AAQOmmqRHJnxhRZICKFUT91brVhNNt58CMWU9PsBbv3PDCZUHbVxuDiH2mtA== + +colorspace@1.1.x: + version "1.1.4" + resolved "https://registry.yarnpkg.com/colorspace/-/colorspace-1.1.4.tgz#8d442d1186152f60453bf8070cd66eb364e59243" + integrity sha512-BgvKJiuVu1igBUF2kEjRCZXol6wiiGbY5ipL/oVPwm0BL9sIpMIzM8IK7vwuxIIzOXMV3Ey5w+vxhm0rR/TN8w== + dependencies: + color "^3.1.3" + text-hex "1.0.x" + columnify@^1.5.4: version "1.5.4" resolved "https://registry.yarnpkg.com/columnify/-/columnify-1.5.4.tgz#4737ddf1c7b69a8a7c340570782e947eec8e78bb" @@ -10681,11 +10795,6 @@ cookie-signature@1.0.6: resolved "https://registry.yarnpkg.com/cookie-signature/-/cookie-signature-1.0.6.tgz#e303a882b342cc3ee8ca513a79999734dab3ae2c" integrity sha1-4wOogrNCzD7oylE6eZmXNNqzriw= -cookie@0.3.1: - version "0.3.1" - resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.3.1.tgz#e7e0a1f9ef43b4c8ba925c5c5a96e806d16873bb" - integrity sha1-5+Ch+e9DtMi6klxcWpboBtFoc7s= - cookie@0.4.0: version "0.4.0" resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.4.0.tgz#beb437e7022b3b6d49019d088665303ebe9c14ba" @@ -10797,7 +10906,7 @@ core-util-is@1.0.2, core-util-is@~1.0.0: resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7" integrity sha1-tf1UIgqivFq1eqtxQMlAdUUDwac= -cors@^2.8.4, cors@^2.8.5, cors@~2.8.5: +cors@2.8.5, cors@^2.8.5, cors@~2.8.5: version "2.8.5" resolved "https://registry.yarnpkg.com/cors/-/cors-2.8.5.tgz#eac11da51592dd86b9f06f6e7ac293b3df875d29" integrity sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g== @@ -10913,6 +11022,11 @@ create-react-context@^0.2.1: fbjs "^0.8.0" gud "^1.0.0" +create-require@^1.1.0: + version "1.1.1" + resolved "https://registry.yarnpkg.com/create-require/-/create-require-1.1.1.tgz#c1d7e8f1e5f6cfc9ff65f9cd352d37348756c333" + integrity sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ== + cross-fetch@3.0.6: version "3.0.6" resolved "https://registry.yarnpkg.com/cross-fetch/-/cross-fetch-3.0.6.tgz#3a4040bc8941e653e0e9cf17f29ebcd177d3365c" @@ -11239,11 +11353,6 @@ currently-unhandled@^0.4.1: dependencies: array-find-index "^1.0.1" -cycle@1.0.x: - version "1.0.3" - resolved "https://registry.yarnpkg.com/cycle/-/cycle-1.0.3.tgz#21e80b2be8580f98b468f379430662b046c34ad2" - integrity sha1-IegLK+hYD5i0aPN5QwZisEbDStI= - cyclist@~0.2.2: version "0.2.2" resolved "https://registry.yarnpkg.com/cyclist/-/cyclist-0.2.2.tgz#1b33792e11e914a2fd6d6ed6447464444e5fa640" @@ -12262,6 +12371,11 @@ emotion-theming@^10.0.19: "@emotion/weak-memoize" "0.2.5" hoist-non-react-statics "^3.3.0" +enabled@2.0.x: + version "2.0.0" + resolved "https://registry.yarnpkg.com/enabled/-/enabled-2.0.0.tgz#f9dd92ec2d6f4bbc0d5d1e64e21d61cd4665e7c2" + integrity sha512-AKrN98kuwOzMIdAizXGI86UFBoo26CL21UM763y1h/GMSJ4/OHU9k2YlsmBpyScFo/wbLzWQJBMCW4+IO3/+OQ== + encodeurl@~1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59" @@ -13338,51 +13452,15 @@ express-graphql@^0.12.0: http-errors "1.8.0" raw-body "^2.4.1" -express-winston@^2.4.0: - version "2.6.0" - resolved "https://registry.yarnpkg.com/express-winston/-/express-winston-2.6.0.tgz#3e94a8b5934e8971119653ad18f031274e3a2cb7" - integrity sha512-m4qvQrrIErAZFMQman8CKnQB8sgVG0dSp/wRFv1ZyoWPpP/6waDZywteAdjMF57uJ5+9O7tkwZb5k9w80ZyvAA== - dependencies: - chalk "~0.4.0" - lodash "~4.17.5" - -express@^4.15.4: - version "4.16.4" - resolved "https://registry.yarnpkg.com/express/-/express-4.16.4.tgz#fddef61926109e24c515ea97fd2f1bdbf62df12e" - integrity sha512-j12Uuyb4FMrd/qQAm6uCHAkPtO8FDTRJZBDd5D2KOL2eLaz1yUNdUB/NOIyq0iU4q4cFarsUCrnFDPBcnksuOg== +express-winston@4.2.0: + version "4.2.0" + resolved "https://registry.yarnpkg.com/express-winston/-/express-winston-4.2.0.tgz#e9d535d52aa4c125a54a29cce132ae2e3633f4fa" + integrity sha512-EMD74g63nVHi7pFleQw7KHCxiA1pjF5uCwbCfzGqmFxs9KvlDPIVS3cMGpULm6MshExMT9TjC3SqmRGB9kb7yw== dependencies: - accepts "~1.3.5" - array-flatten "1.1.1" - body-parser "1.18.3" - content-disposition "0.5.2" - content-type "~1.0.4" - cookie "0.3.1" - cookie-signature "1.0.6" - debug "2.6.9" - depd "~1.1.2" - encodeurl "~1.0.2" - escape-html "~1.0.3" - etag "~1.8.1" - finalhandler "1.1.1" - fresh "0.5.2" - merge-descriptors "1.0.1" - methods "~1.1.2" - on-finished "~2.3.0" - parseurl "~1.3.2" - path-to-regexp "0.1.7" - proxy-addr "~2.0.4" - qs "6.5.2" - range-parser "~1.2.0" - safe-buffer "5.1.2" - send "0.16.2" - serve-static "1.13.2" - setprototypeof "1.1.0" - statuses "~1.4.0" - type-is "~1.6.16" - utils-merge "1.0.1" - vary "~1.1.2" + chalk "^2.4.2" + lodash "^4.17.21" -express@^4.17.0, express@^4.17.1: +express@4.17.1, express@^4.17.0, express@^4.17.1: version "4.17.1" resolved "https://registry.yarnpkg.com/express/-/express-4.17.1.tgz#4491fc38605cf51f8629d39c2b5d026f98a4c134" integrity sha512-mHJ9O79RqluphRrcw2X/GTh3k9tVv8YcoyY4Kkh4WDMUYKRZUq0h1o0w2rrrxBqM7VoeUVqgb27xlEMXTnYt4g== @@ -13511,11 +13589,6 @@ extsprintf@^1.2.0: resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.4.0.tgz#e2689f8f356fad62cca65a3a91c5df5f9551692f" integrity sha1-4mifjzVvrWLMplo6kcXfX5VRaS8= -eyes@0.1.x: - version "0.1.8" - resolved "https://registry.yarnpkg.com/eyes/-/eyes-0.1.8.tgz#62cf120234c683785d902348a800ef3e0cc20bc0" - integrity sha1-Ys8SAjTGg3hdkCNIqADvPgzCC8A= - fast-copy@^2.1.0: version "2.1.1" resolved "https://registry.yarnpkg.com/fast-copy/-/fast-copy-2.1.1.tgz#f5cbcf2df64215e59b8e43f0b2caabc19848083a" @@ -13666,6 +13739,11 @@ fd@~0.0.2: resolved "https://registry.yarnpkg.com/fd/-/fd-0.0.3.tgz#b3240de86dbf5a345baae7382a07d4713566ff0c" integrity sha512-iAHrIslQb3U68OcMSP0kkNWabp7sSN6d2TBSb2JO3gcLJVDd4owr/hKM4SFJovFOUeeXeItjYgouEDTMWiVAnA== +fecha@^4.2.0: + version "4.2.1" + resolved "https://registry.yarnpkg.com/fecha/-/fecha-4.2.1.tgz#0a83ad8f86ef62a091e22bb5a039cd03d23eecce" + integrity sha512-MMMQ0ludy/nBs1/o0zVOiKTpG7qMbonKUzjJgQFEuvq6INZ1OraKPRAWkBq5vlKLOUMpmNYG1JoN3oDPUQ9m3Q== + figgy-pudding@^3.4.1, figgy-pudding@^3.5.1: version "3.5.1" resolved "https://registry.yarnpkg.com/figgy-pudding/-/figgy-pudding-3.5.1.tgz#862470112901c727a0e495a80744bd5baa1d6790" @@ -13860,19 +13938,6 @@ fill-range@^7.0.1: dependencies: to-regex-range "^5.0.1" -finalhandler@1.1.1: - version "1.1.1" - resolved "https://registry.yarnpkg.com/finalhandler/-/finalhandler-1.1.1.tgz#eebf4ed840079c83f4249038c9d703008301b105" - integrity sha512-Y1GUDo39ez4aHAw7MysnUD5JzYX+WaIj8I57kO3aEPT1fFRL4sr7mjei97FgnwhAyyzRYmQZaTHb2+9uZ1dPtg== - dependencies: - debug "2.6.9" - encodeurl "~1.0.2" - escape-html "~1.0.3" - on-finished "~2.3.0" - parseurl "~1.3.2" - statuses "~1.4.0" - unpipe "~1.0.0" - finalhandler@~1.1.2: version "1.1.2" resolved "https://registry.yarnpkg.com/finalhandler/-/finalhandler-1.1.2.tgz#b7e7d000ffd11938d0fdb053506f6ebabe9f587d" @@ -13982,6 +14047,11 @@ flush-write-stream@^1.0.0: inherits "^2.0.3" readable-stream "^2.3.6" +fn.name@1.x.x: + version "1.1.0" + resolved "https://registry.yarnpkg.com/fn.name/-/fn.name-1.1.0.tgz#26cad8017967aea8731bc42961d04a3d5988accc" + integrity sha512-GRnmB5gPyJpAhTQdSZTSp9uaPSvl09KoYcMQtsB9rQoOmzs9dH6ffeccH+Z+cv6P68Hu5bC6JjRh4Ah/mHSNRw== + focus-lock@^0.7.0: version "0.7.0" resolved "https://registry.yarnpkg.com/focus-lock/-/focus-lock-0.7.0.tgz#b2bfb0ca7beacc8710a1ff74275fe0dc60a1d88a" @@ -15491,11 +15561,6 @@ has-bigints@^1.0.1: resolved "https://registry.yarnpkg.com/has-bigints/-/has-bigints-1.0.1.tgz#64fe6acb020673e3b78db035a5af69aa9d07b113" integrity sha512-LSBS2LjbNBTf6287JEbEzvJgftkF5qFkmCo9hDRpAzKhUOlJ+hx8dd4USs00SgsUNwc4617J9ki5YtEClM2ffA== -has-color@~0.1.0: - version "0.1.7" - resolved "https://registry.yarnpkg.com/has-color/-/has-color-0.1.7.tgz#67144a5260c34fc3cca677d041daf52fe7b78b2f" - integrity sha1-ZxRKUmDDT8PMpnfQQdr1L+e3iy8= - has-cors@1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/has-cors/-/has-cors-1.1.0.tgz#5e474793f7ea9843d1bb99c23eef49ff126fff39" @@ -15657,11 +15722,6 @@ hmac-drbg@^1.0.0: minimalistic-assert "^1.0.0" minimalistic-crypto-utils "^1.0.1" -hoek@6.x.x: - version "6.1.2" - resolved "https://registry.yarnpkg.com/hoek/-/hoek-6.1.2.tgz#99e6d070561839de74ee427b61aa476bd6bddfd6" - integrity sha512-6qhh/wahGYZHFSFw12tBbJw5fsAhhwrrG/y3Cs0YMTv2WzMnL0oLPnQJjv1QJvEfylRSOFuP+xCu+tdx0tD16Q== - hoist-non-react-statics@^3.0.0, hoist-non-react-statics@^3.3.1: version "3.3.2" resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45" @@ -16334,11 +16394,6 @@ ip@^1.1.0, ip@^1.1.5: resolved "https://registry.yarnpkg.com/ip/-/ip-1.1.5.tgz#bdded70114290828c0a039e72ef25f5aaec4354a" integrity sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo= -ipaddr.js@1.8.0: - version "1.8.0" - resolved "https://registry.yarnpkg.com/ipaddr.js/-/ipaddr.js-1.8.0.tgz#eaa33d6ddd7ace8f7f6fe0c9ca0440e706738b1e" - integrity sha1-6qM9bd16zo9/b+DJygRA5wZzix4= - ipaddr.js@1.9.0: version "1.9.0" resolved "https://registry.yarnpkg.com/ipaddr.js/-/ipaddr.js-1.9.0.tgz#37df74e430a0e47550fe54a2defe30d8acd95f65" @@ -17062,13 +17117,6 @@ isarray@^2.0.5: resolved "https://registry.yarnpkg.com/isarray/-/isarray-2.0.5.tgz#8af1e4c1221244cc62459faf38940d4e644a5723" integrity sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw== -isemail@3.x.x: - version "3.2.0" - resolved "https://registry.yarnpkg.com/isemail/-/isemail-3.2.0.tgz#59310a021931a9fb06bbb51e155ce0b3f236832c" - integrity sha512-zKqkK+O+dGqevc93KNsbZ/TqTUFd46MwWjYOoMrjIMZ51eU7DtQG3Wmd9SQQT7i7RVnuTPEiYEWHU3MSbxC1Tg== - dependencies: - punycode "2.x.x" - isexe@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/isexe/-/isexe-2.0.0.tgz#e8fbf374dc556ff8947a10dcb0572d633f2cfa10" @@ -17099,7 +17147,7 @@ isomorphic-fetch@^2.1.1: node-fetch "^1.0.1" whatwg-fetch ">=0.10.0" -isstream@0.1.x, isstream@~0.1.2: +isstream@~0.1.2: version "0.1.2" resolved "https://registry.yarnpkg.com/isstream/-/isstream-0.1.2.tgz#47e63f7af55afa6f92e1500e690eb8b8529c099a" integrity sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo= @@ -17703,14 +17751,16 @@ jimp@^0.14.0: "@jimp/types" "^0.14.0" regenerator-runtime "^0.13.3" -joi@^14.3.0: - version "14.3.1" - resolved "https://registry.yarnpkg.com/joi/-/joi-14.3.1.tgz#164a262ec0b855466e0c35eea2a885ae8b6c703c" - integrity sha512-LQDdM+pkOrpAn4Lp+neNIFV3axv1Vna3j38bisbQhETPMANYRbFJFUyOZcOClYvM/hppMhGWuKSFEK9vjrB+bQ== +joi@17.5.0: + version "17.5.0" + resolved "https://registry.yarnpkg.com/joi/-/joi-17.5.0.tgz#7e66d0004b5045d971cf416a55fb61d33ac6e011" + integrity sha512-R7hR50COp7StzLnDi4ywOXHrBrgNXuUUfJWIR5lPY5Bm/pOD3jZaTwpluUXVLRWcoWZxkrHBBJ5hLxgnlehbdw== dependencies: - hoek "6.x.x" - isemail "3.x.x" - topo "3.x.x" + "@hapi/hoek" "^9.0.0" + "@hapi/topo" "^5.0.0" + "@sideway/address" "^4.1.3" + "@sideway/formula" "^3.0.0" + "@sideway/pinpoint" "^2.0.0" joi@^17.2.1: version "17.3.0" @@ -18027,6 +18077,11 @@ klona@^2.0.4: resolved "https://registry.yarnpkg.com/klona/-/klona-2.0.4.tgz#7bb1e3affb0cb8624547ef7e8f6708ea2e39dfc0" integrity sha512-ZRbnvdg/NxqzC7L9Uyqzf4psi1OM4Cuc+sJAkQPjO6XkQIJTNbfK2Rsmbw8fx1p2mkZdp2FZYo2+LwXYY/uwIA== +kuler@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/kuler/-/kuler-2.0.0.tgz#e2c570a3800388fb44407e851531c1d670b061b3" + integrity sha512-Xq9nH7KlWZmXAtodXDDRE7vs6DU1gTU8zYDHDiWLSip45Egwq3plLHzPn27NgvzL2r1LMPC1vdqh98sQxtqj4A== + language-subtag-registry@~0.3.2: version "0.3.21" resolved "https://registry.yarnpkg.com/language-subtag-registry/-/language-subtag-registry-0.3.21.tgz#04ac218bea46f04cb039084602c6da9e788dd45a" @@ -18405,7 +18460,7 @@ lodash.without@^4.4.0: resolved "https://registry.yarnpkg.com/lodash.without/-/lodash.without-4.4.0.tgz#3cd4574a00b67bae373a94b748772640507b7aac" integrity sha1-PNRXSgC2e643OpS3SHcmQFB7eqw= -lodash@4.x.x, lodash@>4.17.4, lodash@^4.0.1, lodash@^4.15.0, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.13, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.19, lodash@^4.17.21, lodash@^4.17.4, lodash@^4.2.1, lodash@~4.17.5: +lodash@4.x.x, lodash@>4.17.4, lodash@^4.0.1, lodash@^4.15.0, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.13, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.19, lodash@^4.17.21, lodash@^4.17.4, lodash@^4.2.1: version "4.17.21" resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c" integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg== @@ -18425,6 +18480,17 @@ logalot@^2.0.0, logalot@^2.1.0: figures "^1.3.5" squeak "^1.0.0" +logform@^2.2.0: + version "2.3.0" + resolved "https://registry.yarnpkg.com/logform/-/logform-2.3.0.tgz#a3997a05985de2ebd325ae0d166dffc9c6fe6b57" + integrity sha512-graeoWUH2knKbGthMtuG1EfaSPMZFZBIrhuJHhkS5ZseFBrc7DupCzihOQAzsK/qIKPQaPJ/lFQFctILUY5ARQ== + dependencies: + colors "^1.2.1" + fecha "^4.2.0" + ms "^2.1.1" + safe-stable-stringify "^1.1.0" + triple-beam "^1.3.0" + loglevel@^1.6.8: version "1.7.0" resolved "https://registry.yarnpkg.com/loglevel/-/loglevel-1.7.0.tgz#728166855a740d59d38db01cf46f042caa041bb0" @@ -19214,11 +19280,6 @@ mime-types@~2.1.24: dependencies: mime-db "1.40.0" -mime@1.4.1: - version "1.4.1" - resolved "https://registry.yarnpkg.com/mime/-/mime-1.4.1.tgz#121f9ebc49e3766f311a76e1fa1c8003c4b03aa6" - integrity sha512-KI1+qOZu5DcW6wayYHSzR/tXKCDC5Om4s1z2QJjDULzLcmf3DvzS7oluY4HCTrc+9FiKmWUgeNLg7W3uIQvxtQ== - mime@1.6.0, mime@^1.3.4: version "1.6.0" resolved "https://registry.yarnpkg.com/mime/-/mime-1.6.0.tgz#32cd9e5c64553bd58d19a568af452acff04981b1" @@ -20338,6 +20399,13 @@ once@^1.3.0, once@^1.3.1, once@^1.4.0: dependencies: wrappy "1" +one-time@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/one-time/-/one-time-1.0.0.tgz#e06bc174aed214ed58edede573b433bbf827cb45" + integrity sha512-5DXOiRKwuSEcQ/l0kGCF6Q3jcADFv5tSmRaJck/OqkVFcOzutB134KRSfF0xDrL39MNnqxbHBbUUcjZIhTgb2g== + dependencies: + fn.name "1.x.x" + onetime@^2.0.0: version "2.0.1" resolved "https://registry.yarnpkg.com/onetime/-/onetime-2.0.1.tgz#067428230fd67443b2794b22bba528b6867962d4" @@ -21857,14 +21925,6 @@ protoduck@^5.0.1: dependencies: genfun "^5.0.0" -proxy-addr@~2.0.4: - version "2.0.4" - resolved "https://registry.yarnpkg.com/proxy-addr/-/proxy-addr-2.0.4.tgz#ecfc733bf22ff8c6f407fa275327b9ab67e48b93" - integrity sha512-5erio2h9jp5CHGwcybmxmVqHmnCBZeewlfJ0pex+UW7Qny7OOZXTtH56TGNyBizkgiOwhJtMKrVzDTeKcySZwA== - dependencies: - forwarded "~0.1.2" - ipaddr.js "1.8.0" - proxy-addr@~2.0.5: version "2.0.5" resolved "https://registry.yarnpkg.com/proxy-addr/-/proxy-addr-2.0.5.tgz#34cbd64a2d81f4b1fd21e76f9f06c8a45299ee34" @@ -21940,16 +22000,16 @@ punycode@1.3.2: resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.3.2.tgz#9653a036fb7c1ee42342f2325cceefea3926c48d" integrity sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0= -punycode@2.x.x, punycode@^2.1.0, punycode@^2.1.1: - version "2.1.1" - resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec" - integrity sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A== - punycode@^1.2.4, punycode@^1.3.2, punycode@^1.4.1: version "1.4.1" resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.4.1.tgz#c0d5a63b2718800ad8e1eb0fa5269c84dd41845e" integrity sha1-wNWmOycYgArY4esPpSachN1BhF4= +punycode@^2.1.0, punycode@^2.1.1: + version "2.1.1" + resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec" + integrity sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A== + pupa@^2.1.1: version "2.1.1" resolved "https://registry.yarnpkg.com/pupa/-/pupa-2.1.1.tgz#f5e8fd4afc2c5d97828faa523549ed8744a20d62" @@ -22084,7 +22144,7 @@ randomfill@^1.0.3: randombytes "^2.0.5" safe-buffer "^5.1.0" -range-parser@1.2.0, range-parser@~1.2.0: +range-parser@1.2.0: version "1.2.0" resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.2.0.tgz#f49be6b487894ddc40dcc94a322f611092e00d5e" integrity sha1-9JvmtIeJTdxA3MlKMi9hEJLgDV4= @@ -22270,7 +22330,7 @@ react-docgen@^5.0.0: node-dir "^0.1.10" strip-indent "^3.0.0" -react-dom@17.0.2, react-dom@^16.8.3, react-dom@^17.0.2: +react-dom@17.0.2, react-dom@^17.0.2: version "17.0.2" resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-17.0.2.tgz#ecffb6845e3ad8dbfcdc498f0d0a939736502c23" integrity sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA== @@ -22279,6 +22339,16 @@ react-dom@17.0.2, react-dom@^16.8.3, react-dom@^17.0.2: object-assign "^4.1.1" scheduler "^0.20.2" +react-dom@^16.8.3: + version "16.14.0" + resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.14.0.tgz#7ad838ec29a777fb3c75c3a190f661cf92ab8b89" + integrity sha512-1gCeQXDLoIqMgqD3IO2Ah9bnf0w9kzhwN5q4FGnHZ67hBm9yePzB5JJAIQCc8x3pFnNlwFq4RidZggNAAkzWWw== + dependencies: + loose-envify "^1.1.0" + object-assign "^4.1.1" + prop-types "^15.6.2" + scheduler "^0.19.1" + react-draggable@^4.0.3: version "4.2.0" resolved "https://registry.yarnpkg.com/react-draggable/-/react-draggable-4.2.0.tgz#40cc5209082ca7d613104bf6daf31372cc0e1114" @@ -22584,7 +22654,7 @@ react-transition-group@^4.3.0: loose-envify "^1.4.0" prop-types "^15.6.2" -react@17.0.2, react@^16.8.3, react@^16.9.17, react@^17.0.2: +react@17.0.2, react@^17.0.2: version "17.0.2" resolved "https://registry.yarnpkg.com/react/-/react-17.0.2.tgz#d0b5cc516d29eb3eee383f75b62864cfb6800037" integrity sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA== @@ -22592,6 +22662,15 @@ react@17.0.2, react@^16.8.3, react@^16.9.17, react@^17.0.2: loose-envify "^1.1.0" object-assign "^4.1.1" +react@^16.8.3, react@^16.9.17: + version "16.14.0" + resolved "https://registry.yarnpkg.com/react/-/react-16.14.0.tgz#94d776ddd0aaa37da3eda8fc5b6b18a4c9a3114d" + integrity sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g== + dependencies: + loose-envify "^1.1.0" + object-assign "^4.1.1" + prop-types "^15.6.2" + reactcss@^1.2.0: version "1.2.3" resolved "https://registry.yarnpkg.com/reactcss/-/reactcss-1.2.3.tgz#c00013875e557b1cf0dfd9a368a1c3dab3b548dd" @@ -22746,6 +22825,19 @@ readable-stream@1.1.x: string_decoder "^1.1.1" util-deprecate "^1.0.1" +readable-stream@^2.3.7: + version "2.3.7" + resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.7.tgz#1eca1cf711aef814c04f62252a36a62f6cb23b57" + integrity sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw== + dependencies: + core-util-is "~1.0.0" + inherits "~2.0.3" + isarray "~1.0.0" + process-nextick-args "~2.0.0" + safe-buffer "~5.1.1" + string_decoder "~1.1.1" + util-deprecate "~1.0.1" + readable-stream@^3.0.6, readable-stream@^3.4.0, readable-stream@^3.6.0: version "3.6.0" resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-3.6.0.tgz#337bbda3adc0706bd3e024426a286d4b4b2c9198" @@ -23561,6 +23653,11 @@ safe-regex@^1.1.0: dependencies: ret "~0.1.10" +safe-stable-stringify@^1.1.0: + version "1.1.1" + resolved "https://registry.yarnpkg.com/safe-stable-stringify/-/safe-stable-stringify-1.1.1.tgz#c8a220ab525cd94e60ebf47ddc404d610dc5d84a" + integrity sha512-ERq4hUjKDbJfE4+XtZLFPCDi8Vb1JqaxAPTxWFLBx8XcAlf9Bda/ZJdVezs/NAfsMQScyIlUMx+Yeu7P7rx5jw== + "safer-buffer@>= 2.1.2 < 3", safer-buffer@^2.0.2, safer-buffer@^2.1.0, safer-buffer@~2.1.0: version "2.1.2" resolved "https://registry.yarnpkg.com/safer-buffer/-/safer-buffer-2.1.2.tgz#44fa161b0187b9549dd84bb91802f9bd8385cd6a" @@ -23593,6 +23690,14 @@ saxes@^5.0.0: dependencies: xmlchars "^2.2.0" +scheduler@^0.19.1: + version "0.19.1" + resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.19.1.tgz#4f3e2ed2c1a7d65681f4c854fa8c5a1ccb40f196" + integrity sha512-n/zwRWRYSUj0/3g/otKDRPMh6qv2SYMWNq85IEa8iZyAv8od9zDYpGSnpBEjNgcMNq6Scbu5KfIPxNF72R/2EA== + dependencies: + loose-envify "^1.1.0" + object-assign "^4.1.1" + scheduler@^0.20.2: version "0.20.2" resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.20.2.tgz#4baee39436e34aa93b4874bddcbf0fe8b8b50e91" @@ -23738,25 +23843,6 @@ semver@~5.3.0: resolved "https://registry.yarnpkg.com/semver/-/semver-5.3.0.tgz#9b2ce5d3de02d17c6012ad326aa6b4d0cf54f94f" integrity sha1-myzl094C0XxgEq0yaqa00M9U+U8= -send@0.16.2: - version "0.16.2" - resolved "https://registry.yarnpkg.com/send/-/send-0.16.2.tgz#6ecca1e0f8c156d141597559848df64730a6bbc1" - integrity sha512-E64YFPUssFHEFBvpbbjr44NCLtI1AohxQ8ZSiJjQLskAdKuriYEP6VyGEsRDH8ScozGpkaX1BGvhanqCwkcEZw== - dependencies: - debug "2.6.9" - depd "~1.1.2" - destroy "~1.0.4" - encodeurl "~1.0.2" - escape-html "~1.0.3" - etag "~1.8.1" - fresh "0.5.2" - http-errors "~1.6.2" - mime "1.4.1" - ms "2.0.0" - on-finished "~2.3.0" - range-parser "~1.2.0" - statuses "~1.4.0" - send@0.17.1: version "0.17.1" resolved "https://registry.yarnpkg.com/send/-/send-0.17.1.tgz#c1d8b059f7900f7466dd4938bdc44e11ddb376c8" @@ -23835,16 +23921,6 @@ serve-index@^1.9.1: mime-types "~2.1.17" parseurl "~1.3.2" -serve-static@1.13.2: - version "1.13.2" - resolved "https://registry.yarnpkg.com/serve-static/-/serve-static-1.13.2.tgz#095e8472fd5b46237db50ce486a43f4b86c6cec1" - integrity sha512-p/tdJrO4U387R9oMjb1oj7qSMaMfmOyd4j9hOFoxZe2baQszgHcSWjuya/CiT5kgZZKRudHNOA0pYXOl8rQ5nw== - dependencies: - encodeurl "~1.0.2" - escape-html "~1.0.3" - parseurl "~1.3.2" - send "0.16.2" - serve-static@1.14.1: version "1.14.1" resolved "https://registry.yarnpkg.com/serve-static/-/serve-static-1.14.1.tgz#666e636dc4f010f7ef29970a88a674320898b2f9" @@ -24570,11 +24646,6 @@ static-extend@^0.1.1: resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.5.0.tgz#161c7dac177659fd9811f43771fa99381478628c" integrity sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow= -statuses@~1.4.0: - version "1.4.0" - resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.4.0.tgz#bb73d446da2796106efcc1b601a253d6c46bd087" - integrity sha512-zhSCtt8v2NDrRlPQpCNtw/heZLtfUDqxBM1udqikb/Hbk52LK4nQSwr10u77iopCW5LsyHpuXS0GnEc48mLeew== - stealthy-require@^1.1.1: version "1.1.1" resolved "https://registry.yarnpkg.com/stealthy-require/-/stealthy-require-1.1.1.tgz#35b09875b4ff49f26a777e509b3090a3226bf24b" @@ -24887,11 +24958,6 @@ strip-ansi@^5.0.0, strip-ansi@^5.1.0, strip-ansi@^5.2.0: dependencies: ansi-regex "^4.1.0" -strip-ansi@~0.1.0: - version "0.1.1" - resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-0.1.1.tgz#39e8a98d044d150660abe4a6808acf70bb7bc991" - integrity sha1-OeipjQRNFQZgq+SmgIrPcLt7yZE= - strip-bom-string@^0.1.2: version "0.1.2" resolved "https://registry.yarnpkg.com/strip-bom-string/-/strip-bom-string-0.1.2.tgz#9c6e720a313ba9836589518405ccfb88a5f41b9c" @@ -25474,6 +25540,11 @@ text-extensions@^1.0.0: resolved "https://registry.yarnpkg.com/text-extensions/-/text-extensions-1.9.0.tgz#1853e45fee39c945ce6f6c36b2d659b5aabc2a26" integrity sha512-wiBrwC1EhBelW12Zy26JeOUkQ5mRu+5o8rpsJk5+2t+Y5vE7e842qtZDQ2g1NpX/29HdyFeJ4nSIhI47ENSxlQ== +text-hex@1.0.x: + version "1.0.0" + resolved "https://registry.yarnpkg.com/text-hex/-/text-hex-1.0.0.tgz#69dc9c1b17446ee79a92bf5b884bb4b9127506f5" + integrity sha512-uuVGNWzgJ4yhRaNSiubPY7OjISw4sw4E5Uv0wbjp+OzcbmVU/rsT8ujgcXJhn9ypzsgr5vlzpPqP+MBBKcGvbg== + text-table@0.2.0, text-table@^0.2.0: version "0.2.0" resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4" @@ -25662,13 +25733,6 @@ token-types@^4.1.1: "@tokenizer/token" "^0.3.0" ieee754 "^1.2.1" -topo@3.x.x: - version "3.0.3" - resolved "https://registry.yarnpkg.com/topo/-/topo-3.0.3.tgz#d5a67fb2e69307ebeeb08402ec2a2a6f5f7ad95c" - integrity sha512-IgpPtvD4kjrJ7CRA3ov2FhWQADwv+Tdqbsf1ZnPUSAtCJ9e1Z44MmoSGDXGk4IppoZA7jd/QRkNddlLJWlUZsQ== - dependencies: - hoek "6.x.x" - touch@^3.1.0: version "3.1.0" resolved "https://registry.yarnpkg.com/touch/-/touch-3.1.0.tgz#fe365f5f75ec9ed4e56825e0bb76d24ab74af83b" @@ -25752,6 +25816,11 @@ trim@0.0.1: resolved "https://registry.yarnpkg.com/trim/-/trim-0.0.1.tgz#5858547f6b290757ee95cccc666fb50084c460dd" integrity sha1-WFhUf2spB1fulczMZm+1AITEYN0= +triple-beam@^1.2.0, triple-beam@^1.3.0: + version "1.3.0" + resolved "https://registry.yarnpkg.com/triple-beam/-/triple-beam-1.3.0.tgz#a595214c7298db8339eeeee083e4d10bd8cb8dd9" + integrity sha512-XrHUvV5HpdLmIj4uVMxHggLbFSZYIn7HEWsqePZcI50pco+MPqJ50wMGY794X7AOOhxOBAjbkqfAbEe/QMp2Lw== + trough@^1.0.0: version "1.0.3" resolved "https://registry.yarnpkg.com/trough/-/trough-1.0.3.tgz#e29bd1614c6458d44869fc28b255ab7857ef7c24" @@ -25782,6 +25851,24 @@ ts-essentials@^2.0.3: resolved "https://registry.yarnpkg.com/ts-essentials/-/ts-essentials-2.0.12.tgz#c9303f3d74f75fa7528c3d49b80e089ab09d8745" integrity sha512-3IVX4nI6B5cc31/GFFE+i8ey/N2eA0CZDbo6n0yrz0zDX8ZJ8djmU1p+XRz7G3is0F3bB3pu2pAroFdAWQKU3w== +ts-node@^10.4.0: + version "10.4.0" + resolved "https://registry.yarnpkg.com/ts-node/-/ts-node-10.4.0.tgz#680f88945885f4e6cf450e7f0d6223dd404895f7" + integrity sha512-g0FlPvvCXSIO1JDF6S232P5jPYqBkRL9qly81ZgAOSU7rwI0stphCgd2kLiCrU9DjQCrJMWEqcNSjQL02s6d8A== + dependencies: + "@cspotcode/source-map-support" "0.7.0" + "@tsconfig/node10" "^1.0.7" + "@tsconfig/node12" "^1.0.7" + "@tsconfig/node14" "^1.0.0" + "@tsconfig/node16" "^1.0.2" + acorn "^8.4.1" + acorn-walk "^8.1.1" + arg "^4.1.0" + create-require "^1.1.0" + diff "^4.0.1" + make-error "^1.1.1" + yn "3.1.1" + ts-node@^9: version "9.0.0" resolved "https://registry.yarnpkg.com/ts-node/-/ts-node-9.0.0.tgz#e7699d2a110cc8c0d3b831715e417688683460b3" @@ -27063,17 +27150,28 @@ windows-release@^3.1.0: dependencies: execa "^0.10.0" -winston@^2.3.1: - version "2.4.4" - resolved "https://registry.yarnpkg.com/winston/-/winston-2.4.4.tgz#a01e4d1d0a103cf4eada6fc1f886b3110d71c34b" - integrity sha512-NBo2Pepn4hK4V01UfcWcDlmiVTs7VTB1h7bgnB0rgP146bYhMxX0ypCz3lBOfNxCO4Zuek7yeT+y/zM1OfMw4Q== - dependencies: - async "~1.0.0" - colors "1.0.x" - cycle "1.0.x" - eyes "0.1.x" - isstream "0.1.x" +winston-transport@^4.4.0: + version "4.4.0" + resolved "https://registry.yarnpkg.com/winston-transport/-/winston-transport-4.4.0.tgz#17af518daa690d5b2ecccaa7acf7b20ca7925e59" + integrity sha512-Lc7/p3GtqtqPBYYtS6KCN3c77/2QCev51DvcJKbkFPQNoj1sinkGwLGFDxkXY9J6p9+EPnYs+D90uwbnaiURTw== + dependencies: + readable-stream "^2.3.7" + triple-beam "^1.2.0" + +winston@3.3.3: + version "3.3.3" + resolved "https://registry.yarnpkg.com/winston/-/winston-3.3.3.tgz#ae6172042cafb29786afa3d09c8ff833ab7c9170" + integrity sha512-oEXTISQnC8VlSAKf1KYSSd7J6IWuRPQqDdo8eoRNaYKLvwSb5+79Z3Yi1lrl6KDpU6/VWaxpakDAtb1oQ4n9aw== + dependencies: + "@dabh/diagnostics" "^2.0.2" + async "^3.1.0" + is-stream "^2.0.0" + logform "^2.2.0" + one-time "^1.0.0" + readable-stream "^3.4.0" stack-trace "0.0.x" + triple-beam "^1.3.0" + winston-transport "^4.4.0" word-wrap@^1.2.3: version "1.2.3"