diff --git a/.eslintignore b/.eslintignore index 7af6a60ba6..98f4449052 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,15 +1,20 @@ # Force include -!/.storybook -!/.storybook-docs -!/.playground +!.storybook +!.storybook-docs +!.playground +!.*.js # Ignore -/wiki -/node_modules -/coverage +wiki +node_modules +coverage +license_header.js # Editor configs -/.vscode +.vscode + +# Hidden directories +.git # Compiled source src/utils/d3-delaunay/* diff --git a/.eslintrc.js b/.eslintrc.js index 8060e27e39..882b13ac2c 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -1,39 +1,122 @@ module.exports = { parser: '@typescript-eslint/parser', extends: [ + 'airbnb-typescript', + 'plugin:@typescript-eslint/eslint-recommended', 'plugin:@typescript-eslint/recommended', - 'prettier/@typescript-eslint', - 'plugin:prettier/recommended', + 'plugin:@typescript-eslint/recommended-requiring-type-checking', + 'airbnb/hooks', + 'plugin:eslint-comments/recommended', + 'plugin:jest/recommended', + 'plugin:promise/recommended', + 'plugin:unicorn/recommended', 'plugin:react/recommended', + 'plugin:jsx-a11y/recommended', + 'plugin:import/errors', + 'plugin:import/warnings', + 'plugin:import/typescript', ], - plugins: ['@typescript-eslint', 'import', 'jest', 'unicorn', 'file-header', 'react-hooks'], + plugins: ['@typescript-eslint', 'eslint-comments', 'jest', 'import', 'promise', 'unicorn', 'header', 'react-hooks', 'jsx-a11y'], + rules: { + /** + * depricated to be deleted + */ + // https://github.com/typescript-eslint/typescript-eslint/issues/2077 + '@typescript-eslint/camelcase': 0, - env: { - es6: true, - node: true, - mocha: true, - browser: true, - }, + /** + ***************************************** + * Rules to consider adding/fixing later + ***************************************** + */ + 'import/no-cycle': 0, + '@typescript-eslint/no-unsafe-assignment': 0, + '@typescript-eslint/no-unsafe-member-access': 0, + '@typescript-eslint/no-unsafe-return': 0, + '@typescript-eslint/explicit-module-boundary-types': 0, + '@typescript-eslint/restrict-template-expressions': 1, + '@typescript-eslint/restrict-plus-operands': 1, + '@typescript-eslint/no-unsafe-call': 1, + '@typescript-eslint/unbound-method': 1, + 'unicorn/consistent-function-scoping': 1, + 'unicorn/explicit-length-check': 1, + 'no-use-before-define': 0, + 'no-restricted-properties': 0, // need to find and filter desired options + 'class-methods-use-this': 1, + 'unicorn/prefer-number-properties': 0, + 'global-require': 1, + 'import/no-dynamic-require': 1, + 'no-shadow': 1, + 'no-param-reassign': 1, + 'react/no-array-index-key': 1, + 'react/prefer-stateless-function': 1, + 'jsx-a11y/no-static-element-interactions': 1, + 'jsx-a11y/mouse-events-have-key-events': 1, + 'jsx-a11y/click-events-have-key-events': 1, + '@typescript-eslint/member-ordering': 1, + eqeqeq: 1, - parserOptions: { - sourceType: 'module', - ecmaVersion: 6, - ecmaFeatures: { - experimentalObjectRestSpread: true, - jsx: true, - }, - // NOTE: That is to avoid a known performance issue related with the `ts.Program` used by - // typescript eslint. As we are not using rules that need types information, we can safely - // disabling that feature setting the project to undefined. That issue is being addressed - // by the typescript eslint team. More info could be found here: - // https://github.com/typescript-eslint/typescript-eslint/issues/389 - // https://github.com/typescript-eslint/typescript-eslint/issues/243 - // https://github.com/typescript-eslint/typescript-eslint/pull/361 - project: undefined, - }, - rules: { + /** + * Standard rules + */ 'no-console': process.env.NODE_ENV === 'production' ? 2 : 1, 'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 1, + 'prefer-template': 'error', + 'comma-dangle': ['error', 'always-multiline'], + 'consistent-return': 0, + 'no-plusplus': 0, + 'no-bitwise': 0, + 'no-void': 0, + yoda: 0, + 'lines-between-class-members': ['error', 'always', { exceptAfterSingleLine: true }], + 'no-restricted-globals': 0, + 'no-case-declarations': 0, + 'no-return-await': 0, + 'max-classes-per-file': 0, + 'no-continue': 0, + 'no-lonely-if': 0, + 'no-return-assign': 0, + 'no-underscore-dangle': 0, + 'no-confusing-arrow': 0, + 'prefer-destructuring': 0, + 'function-paren-newline': 0, + 'implicit-arrow-linebreak': 0, + 'function-call-argument-newline': ['error', 'consistent'], + 'array-bracket-newline': ['error', 'consistent'], + 'array-element-newline': [ + 'error', + { + ArrayExpression: 'consistent', + ArrayPattern: 'consistent', + }, + ], + 'object-curly-newline': [ + 'error', + { + ObjectExpression: { multiline: true, minProperties: 10, consistent: true }, + ObjectPattern: { multiline: true, minProperties: 10, consistent: true }, + ImportDeclaration: { consistent: true }, + ExportDeclaration: { consistent: true }, + }, + ], + quotes: ['error', 'single'], + semi: ['error', 'always'], + // https://github.com/typescript-eslint/typescript-eslint/issues/1824 + indent: ['error', 2, { + SwitchCase: 1, + MemberExpression: 1, + offsetTernaryExpressions: true, + }], + 'max-len': [ + 'warn', + { + code: 120, + ignoreUrls: true, + ignoreStrings: true, + ignoreComments: true, + ignoreRegExpLiterals: true, + }, + ], 'no-unused-vars': [ 'error', { @@ -42,6 +125,26 @@ module.exports = { ignoreRestSiblings: true, }, ], + 'sort-keys': 0, + 'no-irregular-whitespace': 'error', + 'no-unused-expressions': 'error', + // Too restrictive, writing ugly code to defend against a very unlikely scenario: https://eslint.org/docs/rules/no-prototype-builtins + 'no-prototype-builtins': 0, + + /* + * @typescript-eslint plugin + */ + '@typescript-eslint/interface-name-prefix': 0, + '@typescript-eslint/return-await': ['error', 'always'], // https://v8.dev/blog/fast-async + '@typescript-eslint/explicit-member-accessibility': ['error', { accessibility: 'no-public' }], + '@typescript-eslint/no-explicit-any': 0, + '@typescript-eslint/explicit-function-return-type': 0, + '@typescript-eslint/no-non-null-assertion': 0, + '@typescript-eslint/ban-ts-ignore': 0, + '@typescript-eslint/indent': 0, + '@typescript-eslint/no-inferrable-types': 0, + '@typescript-eslint/ban-ts-comment': 1, + '@typescript-eslint/space-before-function-paren': [2, 'never'], '@typescript-eslint/no-unused-vars': [ 'error', { @@ -50,62 +153,123 @@ module.exports = { ignoreRestSiblings: true, }, ], - 'unicorn/filename-case': [ - 'error', + '@typescript-eslint/no-use-before-define': [ + 'warn', { - case: 'snakeCase', + functions: false, + classes: true, + variables: true, + typedefs: false, }, ], - 'sort-keys': 'off', - 'import/no-unresolved': 'error', + + /* + * import plugin + */ + 'import/order': ['error', { + 'newlines-between': 'always', + groups: [ + 'builtin', + 'external', + ['parent', 'sibling', 'index', 'internal'], + ], + alphabetize: { order: 'asc', caseInsensitive: true }, // todo replace with directory gradient ordering + }], + 'import/no-unresolved': ['error', { ignore: ['theme_dark.scss', 'theme_light.scss'] }], 'import/no-restricted-paths': [ 'error', { - zones: [ - { target: './src', from: './src/index.ts' }, - { target: './src', from: './', except: ['./src', './node_modules/'] }, - ], + zones: [{ target: './src', from: './src/index.ts' }, { target: './src', from: './', except: ['./src', './node_modules/'] }], }, ], - 'no-irregular-whitespace': 'error', - 'no-unused-expressions': 'error', - '@typescript-eslint/interface-name-prefix': 'off', - '@typescript-eslint/explicit-member-accessibility': ['error', { accessibility: 'no-public' }], - '@typescript-eslint/no-explicit-any': 'off', - '@typescript-eslint/explicit-function-return-type': 'off', - '@typescript-eslint/no-non-null-assertion': 'off', - '@typescript-eslint/no-use-before-define': 'off', - '@typescript-eslint/ban-ts-ignore': 'off', - '@typescript-eslint/no-inferrable-types': 'off', + // https://basarat.gitbooks.io/typescript/docs/tips/defaultIsBad.html + 'import/prefer-default-export': 0, + // Limit usage in development directories + 'import/no-extraneous-dependencies': 0, + + /* + * react plugin + */ 'react/jsx-curly-brace-presence': ['error', { props: 'never', children: 'never' }], 'react/prop-types': 0, - 'prefer-template': 'error', - 'file-header/file-header': [ + // Too restrictive: https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/destructuring-assignment.md + 'react/destructuring-assignment': 0, + // No jsx extension: https://github.com/facebook/create-react-app/issues/87#issuecomment-234627904 + 'react/jsx-filename-extension': 0, + 'react/jsx-props-no-spreading': 0, + 'react/static-property-placement': 0, + 'react/state-in-constructor': 0, + + /* + * jest plugin + */ + 'jest/no-standalone-expect': 0, // using custom expect functions + 'jest/no-disabled-tests': 0, + + /* + * unicorn plugin + */ + 'unicorn/prevent-abbreviations': 0, // Common abbreviations are known and readable + 'unicorn/no-null': 0, + 'unicorn/no-fn-reference-in-iterator': 0, + 'unicorn/prefer-query-selector': 0, + 'unicorn/no-for-loop': 0, + 'unicorn/no-nested-ternary': 1, + 'unicorn/no-reduce': 0, + 'unicorn/no-useless-undefined': 0, + 'unicorn/prefer-spread': 0, + 'unicorn/prefer-node-append': 0, + 'unicorn/no-zero-fractions': 0, + 'unicorn/prefer-node-remove': 0, // not IE11 compatible + 'unicorn/filename-case': [ 'error', + { + case: 'snakeCase', + }, + ], + + /* + * file-header plugin + */ + 'header/header': [ + 'error', + 'block', [ '', - 'Licensed to Elasticsearch B.V. under one or more contributor', - 'license agreements. See the NOTICE file distributed with', - 'this work for additional information regarding copyright', - 'ownership. Elasticsearch B.V. licenses this file to you under', - 'the Apache License, Version 2.0 (the "License"); you may', - 'not use this file except in compliance with the License.', - 'You may obtain a copy of the License at', - '', - 'http://www.apache.org/licenses/LICENSE-2.0', - '', - 'Unless required by applicable law or agreed to in writing,', - 'software distributed under the License is distributed on an', - '"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY', - 'KIND, either express or implied. See the License for the', - 'specific language governing permissions and limitations', - 'under the License.', + ' * Licensed to Elasticsearch B.V. under one or more contributor', + ' * license agreements. See the NOTICE file distributed with', + ' * this work for additional information regarding copyright', + ' * ownership. Elasticsearch B.V. licenses this file to you under', + ' * the Apache License, Version 2.0 (the "License"); you may', + ' * not use this file except in compliance with the License.', + ' * You may obtain a copy of the License at', + ' *', + ' * http://www.apache.org/licenses/LICENSE-2.0', + ' *', + ' * Unless required by applicable law or agreed to in writing,', + ' * software distributed under the License is distributed on an', + ' * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY', + ' * KIND, either express or implied. See the License for the', + ' * specific language governing permissions and limitations', + ' * under the License.', + ' ', ], - 'block', - ['-\\*-(.*)-\\*-', 'eslint(.*)', '@jest-environment'], ], - 'react-hooks/rules-of-hooks': 'error', - 'react-hooks/exhaustive-deps': 'warn', + }, + env: { + es6: true, + node: true, + browser: true, + }, + parserOptions: { + sourceType: 'module', + ecmaVersion: 6, + ecmaFeatures: { + experimentalObjectRestSpread: true, + jsx: true, + }, + project: './tsconfig.lint.json', + tsconfigRootDir: __dirname, }, settings: { 'import/resolver': { @@ -120,13 +284,77 @@ module.exports = { }, overrides: [ { - files: ['*.js', '*test.ts'], + files: ['src/**/*.{ts?(x),js}'], + rules: { + 'no-underscore-dangle': 2, + 'import/no-unresolved': 'error', + 'import/no-extraneous-dependencies': [ + 'error', + { + devDependencies: ['**/*.test.ts?(x)', 'src/mocks/**/*.ts?(x)'], + }, + ], + 'prefer-destructuring': [ + 'warn', + { + array: true, + object: true, + }, + { + enforceForRenamedProperties: false, + }, + ], + }, + }, + { + files: ['*.js', 'integration/**/*.ts?(x)'], rules: { '@typescript-eslint/no-var-requires': 0, + '@typescript-eslint/no-unsafe-call': 0, + 'import/no-dynamic-require': 0, + 'global-require': 0, + 'no-param-reassign': 0, + }, + }, + { + files: ['.*.js', './*.config.js'], // dot(.) and root config files + rules: { + 'header/header': 0, + 'unicorn/filename-case': 0, + }, + }, + { + files: ['stories/**/*.ts?(x)', 'docs/**/*.ts?(x)'], + rules: { + '@typescript-eslint/no-unsafe-call': 0, + }, + }, + { + files: ['integration/**/*.ts?(x)'], + rules: { + 'jest/expect-expect': [ + 'error', + { + assertFunctionNames: [ + 'expect', + 'common.expectChartAtUrlToMatchScreenshot', + 'common.expectElementAtUrlToMatchScreenshot', + 'common.expectChartAtUrlToMatchScreenshot', + 'common.expectChartWithMouseAtUrlToMatchScreenshot', + 'common.expectChartWithDragAtUrlToMatchScreenshot', + ], + }, + ], + }, + }, + { + files: ['*.test.ts?(x)'], + rules: { + 'unicorn/error-message': 0, }, }, { - files: ['stories/**/*.tsx', 'stories/**/*.ts', '*.test.ts', '*.test.tsx'], + files: ['stories/**/*.ts?(x)', '*.test.ts?(x)'], rules: { 'no-restricted-properties': [ process.env.NODE_ENV === 'production' ? 2 : 1, diff --git a/.huskyrc.js b/.huskyrc.js index 01d722106f..0a83f71706 100644 --- a/.huskyrc.js +++ b/.huskyrc.js @@ -1,7 +1,5 @@ -const tasks = (arr) => arr.join(' && '); - module.exports = { hooks: { - 'commit-msg': 'commitlint -E HUSKY_GIT_PARAMS && yarn typecheck:all && yarn pq && yarn lint --cache', + 'commit-msg': 'commitlint -E HUSKY_GIT_PARAMS && yarn typecheck:all && yarn pq && lint-staged', }, }; diff --git a/.playground/index.tsx b/.playground/index.tsx index 33f8aab12b..84e78a0349 100644 --- a/.playground/index.tsx +++ b/.playground/index.tsx @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import 'core-js'; import React from 'react'; import ReactDOM from 'react-dom'; + import '../src/theme_light.scss'; import { Playground } from './playground'; diff --git a/.playground/playground.tsx b/.playground/playground.tsx index dec952bc0b..d123c98912 100644 --- a/.playground/playground.tsx +++ b/.playground/playground.tsx @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { Example } from '../stories/stylings/20_partition_background'; + +import { Example } from '../stories/treemap/6_custom_style'; export class Playground extends React.Component { render() { diff --git a/.playground/webpack.config.js b/.playground/webpack.config.js index 7662e03fa2..f5e3a05bb9 100644 --- a/.playground/webpack.config.js +++ b/.playground/webpack.config.js @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ module.exports = { entry: './index.tsx', diff --git a/.prettierignore b/.prettierignore index f268eb868f..681cfc802b 100644 --- a/.prettierignore +++ b/.prettierignore @@ -1,9 +1,13 @@ *.md *.mdx +*.ts +*.tsx +*.js +*.jsx .out/ .idea/ .vscode/ .temp/ dist/ coverage/ -tmp/ \ No newline at end of file +tmp/ diff --git a/.storybook-docs/addons.ts b/.storybook-docs/addons.ts index a9fbfc1a24..6dc3b7ea8e 100644 --- a/.storybook-docs/addons.ts +++ b/.storybook-docs/addons.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import '@storybook/addon-actions/register'; import '@storybook/addon-knobs/register'; diff --git a/.storybook-docs/config.ts b/.storybook-docs/config.ts index 5d1c4cc3a7..1b2f5cdcca 100644 --- a/.storybook-docs/config.ts +++ b/.storybook-docs/config.ts @@ -14,21 +14,20 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ - + * under the License. + */ +// @ts-ignore +import { DocsPage, DocsContainer } from '@storybook/addon-docs/blocks'; import { withInfo } from '@storybook/addon-info'; import { withKnobs } from '@storybook/addon-knobs'; import { addDecorator, configure, addParameters } from '@storybook/react'; -// @ts-ignore -import { DocsPage, DocsContainer } from '@storybook/addon-docs/blocks'; - -import { switchTheme } from '../.storybook-docs/theme_service'; +import { create } from '@storybook/theming'; -switchTheme('light'); +import { switchTheme } from './theme_service'; import './style.scss'; -import { create } from '@storybook/theming'; +switchTheme('light'); addParameters({ options: { diff --git a/.storybook-docs/theme_service.ts b/.storybook-docs/theme_service.ts index db12ac302e..d37119c584 100644 --- a/.storybook-docs/theme_service.ts +++ b/.storybook-docs/theme_service.ts @@ -14,8 +14,9 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ -/* eslint-disable import/no-unresolved */ + * under the License. + */ + // @ts-ignore import themeDark from '../src/theme_dark.scss?lazy'; // @ts-ignore @@ -28,8 +29,8 @@ export function switchTheme(theme: string) { themeLight.use(); return; case 'dark': + default: themeLight.unuse(); themeDark.use(); - return; } } diff --git a/.storybook-docs/webpack.config.js b/.storybook-docs/webpack.config.js index 774664fd65..3f4735625f 100644 --- a/.storybook-docs/webpack.config.js +++ b/.storybook-docs/webpack.config.js @@ -14,11 +14,10 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ const path = require('path'); -// const webpack = require('webpack'); -// eslint-disable-next-line const createCompiler = require('@storybook/addon-docs/mdx-compiler-plugin'); @@ -37,8 +36,8 @@ const scssLoaders = [ 'sass-loader', ]; -module.exports = async ({ config }) => { - //config.plugins.push(new webpack.EnvironmentPlugin({ RNG_SEED: null })); +module.exports = async({ config }) => { + // config.plugins.push(new webpack.EnvironmentPlugin({ RNG_SEED: null })); // Replace default css rules with nonce config.module.rules = config.module.rules.filter(({ test }) => !test.test('.css')); @@ -134,5 +133,5 @@ module.exports = async ({ config }) => { config.resolve.extensions.push('.ts', '.tsx', '.mdx'); - return config; + return await config; }; diff --git a/.storybook/addons.ts b/.storybook/addons.ts index b0eedf0571..cc804e53b3 100644 --- a/.storybook/addons.ts +++ b/.storybook/addons.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import '@storybook/addon-actions/register'; import '@storybook/addon-knobs/register'; diff --git a/.storybook/config.ts b/.storybook/config.ts index 3aee9f77e4..7c3391082f 100644 --- a/.storybook/config.ts +++ b/.storybook/config.ts @@ -14,19 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { withInfo } from '@storybook/addon-info'; import { withKnobs } from '@storybook/addon-knobs'; import { addDecorator, configure, addParameters } from '@storybook/react'; +import { create } from '@storybook/theming'; import { switchTheme } from './theme_service'; - -switchTheme('light'); - import './style.scss'; -import { create } from '@storybook/theming'; +switchTheme('light'); addParameters({ options: { diff --git a/.storybook/theme_service.ts b/.storybook/theme_service.ts index 2365835975..0bf7016f95 100644 --- a/.storybook/theme_service.ts +++ b/.storybook/theme_service.ts @@ -1,4 +1,3 @@ -/* eslint-disable import/no-unresolved */ /* * Licensed to Elasticsearch B.V. under one or more contributor * license agreements. See the NOTICE file distributed with @@ -15,12 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +/* eslint-disable import/no-unresolved */ // @ts-ignore import themeDark from '../src/theme_dark.scss?lazy'; // @ts-ignore import themeLight from '../src/theme_light.scss?lazy'; +/* eslint-enable */ export function switchTheme(theme: string) { switch (theme) { @@ -29,8 +31,8 @@ export function switchTheme(theme: string) { themeLight.use(); return; case 'dark': + default: themeLight.unuse(); themeDark.use(); - return; } } diff --git a/.storybook/webpack.config.js b/.storybook/webpack.config.js index d0f877e325..90499ead23 100644 --- a/.storybook/webpack.config.js +++ b/.storybook/webpack.config.js @@ -14,10 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -// eslint-disable-next-line const path = require('path'); + const webpack = require('webpack'); const nonce = 'Pk1rZ1XDlMuYe8ubWV3Lh0BzwrTigJQ='; @@ -35,7 +36,7 @@ const scssLoaders = [ 'sass-loader', ]; -module.exports = async ({ config }) => { +module.exports = async({ config }) => { config.plugins.push(new webpack.EnvironmentPlugin({ RNG_SEED: null })); config.module.rules.push({ @@ -122,5 +123,5 @@ module.exports = async ({ config }) => { config.resolve.extensions.push('.ts', '.tsx'); - return config; + return await config; }; diff --git a/api/charts.api.md b/api/charts.api.md index 6e66ef5c72..31e3e09cd8 100644 --- a/api/charts.api.md +++ b/api/charts.api.md @@ -1540,10 +1540,10 @@ export interface XYChartSeriesIdentifier extends SeriesIdentifier { // Warnings were encountered during analysis: // -// src/chart_types/partition_chart/layout/types/config_types.ts:120:5 - (ae-forgotten-export) The symbol "TimeMs" needs to be exported by the entry point index.d.ts -// src/chart_types/partition_chart/layout/types/config_types.ts:121:5 - (ae-forgotten-export) The symbol "AnimKeyframe" needs to be exported by the entry point index.d.ts +// src/chart_types/partition_chart/layout/types/config_types.ts:124:5 - (ae-forgotten-export) The symbol "TimeMs" needs to be exported by the entry point index.d.ts +// src/chart_types/partition_chart/layout/types/config_types.ts:125:5 - (ae-forgotten-export) The symbol "AnimKeyframe" needs to be exported by the entry point index.d.ts // src/chart_types/partition_chart/specs/index.ts:47:13 - (ae-forgotten-export) The symbol "NodeColorAccessor" needs to be exported by the entry point index.d.ts -// src/commons/series_id.ts:37:3 - (ae-forgotten-export) The symbol "SeriesKey" needs to be exported by the entry point index.d.ts +// src/commons/series_id.ts:38:3 - (ae-forgotten-export) The symbol "SeriesKey" needs to be exported by the entry point index.d.ts // (No @packageDocumentation comment for this package) diff --git a/browsers/browsers.test.ts b/browsers/browsers.test.ts index 8010fac2c7..8369b2491d 100644 --- a/browsers/browsers.test.ts +++ b/browsers/browsers.test.ts @@ -14,18 +14,23 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import webdriver, { By } from 'selenium-webdriver'; import path from 'path'; + +import webdriver, { By } from 'selenium-webdriver'; + jest.setTimeout(30000); +/* eslint-disable global-require */ + let driver: webdriver.WebDriver; describe('smoke tests', () => { - beforeAll(async () => { + beforeAll(async() => { let capabilities: webdriver.Capabilities | null = null; switch (process.env.BROWSER || 'chrome') { - case 'ie': { + case 'ie': // HACK: include IEDriver path by nuget const driverPath = path.join(__dirname, '../Selenium.WebDriver.IEDriver.3.150.0/driver/'); process.env.PATH = `${process.env.PATH};${driverPath};`; @@ -33,35 +38,32 @@ describe('smoke tests', () => { capabilities.set('ignoreProtectedModeSettings', true); capabilities.set('ignoreZoomSetting', true); break; - } - case 'safari': { + case 'safari': capabilities = webdriver.Capabilities.safari(); break; - } - case 'firefox': { + case 'firefox': require('geckodriver'); capabilities = webdriver.Capabilities.firefox(); break; - } - case 'chrome': { + case 'chrome': + default: require('chromedriver'); capabilities = webdriver.Capabilities.chrome(); capabilities.set('chromeOptions', { args: ['--headless', '--no-sandbox', '--disable-gpu', '--window-size=1980,1200'], }); break; - } } if (capabilities) { driver = await new webdriver.Builder().withCapabilities(capabilities).build(); } }); - afterAll(async () => { + afterAll(async() => { await driver.quit(); }); - test('elastic-chart element smoke test', async () => { + test('elastic-chart element smoke test', async() => { await driver.get('http://localhost:8080'); await driver.sleep(5000); @@ -70,3 +72,5 @@ describe('smoke tests', () => { expect(elements.length).toBeGreaterThan(0); }); }); + +/* eslint-enable */ diff --git a/browsers/jest.config.js b/browsers/jest.config.js index d98399b121..816ee7746e 100644 --- a/browsers/jest.config.js +++ b/browsers/jest.config.js @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ module.exports = { roots: [''], diff --git a/browsers/setup.js b/browsers/setup.js index 98ae0ab3f6..15b6e6174f 100644 --- a/browsers/setup.js +++ b/browsers/setup.js @@ -14,26 +14,27 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +const path = require('path'); const webpack = require('webpack'); const WebpackDevServer = require('webpack-dev-server'); -const path = require('path'); + const config = require(path.join(__dirname, '..', '.playground', 'webpack.config.js')); -module.exports = async () => { - return new Promise((resolve, reject) => { - const compiler = webpack(config); - const server = new WebpackDevServer(compiler); - compiler.hooks.done.tap('done', () => { - resolve(); - global.__WP_SERVER__ = server; - }); +module.exports = async() => await new Promise((resolve, reject) => { + const compiler = webpack(config); + const server = new WebpackDevServer(compiler); + compiler.hooks.done.tap('done', () => { + resolve(); + global.__WP_SERVER__ = server; + }); - server.listen(8080, 'localhost', function(err) { - if (err) { - reject(err); - } - }); + server.listen(8080, 'localhost', (err) => { + if (err) { + reject(err); + } }); -}; +}); diff --git a/browsers/teardown.js b/browsers/teardown.js index 1cb2f72373..a776142d35 100644 --- a/browsers/teardown.js +++ b/browsers/teardown.js @@ -14,8 +14,9 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -module.exports = async () => { - global.__WP_SERVER__.close(); +module.exports = async() => { + await global.__WP_SERVER__.close(); }; diff --git a/docs/charts.tsx b/docs/charts.tsx index 57fce93266..58153b9fa8 100644 --- a/docs/charts.tsx +++ b/docs/charts.tsx @@ -14,9 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean } from '@storybook/addon-knobs'; +import React from 'react'; + import { Chart, BarSeries, @@ -29,10 +32,9 @@ import { Axis, LineAnnotationDatum, } from '../src'; -import React from 'react'; +import { Icon } from '../src/components/icons/icon'; import { KIBANA_METRICS } from '../src/utils/data_samples/test_dataset_kibana'; import { arrayKnobs, getChartRotationKnob } from '../stories/utils/knobs'; -import { Icon } from '../src/components/icons/icon'; export default { title: 'Introduction', diff --git a/global.d.ts b/global.d.ts index 73b483bf7b..d41127d0e7 100644 --- a/global.d.ts +++ b/global.d.ts @@ -14,7 +14,7 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -// https://github.com/jest-community/jest-extended -import 'jest-extended'; +import 'jest-extended'; // https://github.com/jest-community/jest-extended diff --git a/integration/defaults.js b/integration/defaults.js index 79ac208d19..2af3c92bec 100644 --- a/integration/defaults.js +++ b/integration/defaults.js @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ module.exports = { PORT: '9009', diff --git a/integration/helpers.ts b/integration/helpers.ts index 3eb5abbdcc..655724c4d0 100644 --- a/integration/helpers.ts +++ b/integration/helpers.ts @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { join, resolve } from 'path'; import { lstatSync, readdirSync } from 'fs'; +import { join, resolve } from 'path'; + import { getStorybook, configure } from '@storybook/react'; export type StoryInfo = [string, string]; @@ -27,7 +29,7 @@ export type StoryGroupInfo = [string, string, StoryInfo[]]; function requireAllStories(basedir: string, directory: string) { function enumerateFiles(basedir: string, dir: string) { let result: string[] = []; - readdirSync(join(basedir, dir)).forEach(function(file) { + readdirSync(join(basedir, dir)).forEach((file) => { const relativePath = join(dir, file); const stats = lstatSync(join(basedir, relativePath)); if (stats.isDirectory()) { @@ -59,7 +61,7 @@ function encodeString(string: string) { .replace(/\w-\w/g, ' ') .replace(/\//gi, ' ') .replace(/-/g, ' ') - .replace(/[^a-z|A-Z|0-9|\s|\/]+/gi, '') + .replace(/[^\d\s/a-z|]+/gi, '') .trim() .replace(/\s+/g, '-') .toLowerCase(); diff --git a/integration/jest.config.js b/integration/jest.config.js index ef6671925c..366bda3432 100644 --- a/integration/jest.config.js +++ b/integration/jest.config.js @@ -14,30 +14,29 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -const tsPreset = require('ts-jest/jest-preset'); -const jestPuppeteer = require('jest-puppeteer/jest-preset'); const jestPuppeteerDocker = require('jest-puppeteer-docker/jest-preset'); +const jestPuppeteer = require('jest-puppeteer/jest-preset'); +const tsPreset = require('ts-jest/jest-preset'); -module.exports = Object.assign( - { - setupFilesAfterEnv: ['/jest_env_setup.ts'], - globals: { - 'ts-jest': { - tsConfig: '/tsconfig.json', - }, - /* - * The window and HTMLElement globals are required to use @elastic/eui with VRT - * - * The jest-puppeteer-docker env extends a node test environment and not jsdom test environment. - * Some EUI components that are included in the bundle, but not used, require the jsdom setup. - * To bypass these errors we are just mocking both as empty objects. - */ - window: {}, - HTMLElement: {}, +module.exports = { + setupFilesAfterEnv: ['/jest_env_setup.ts'], + globals: { + 'ts-jest': { + tsConfig: '/tsconfig.json', }, + /* + * The window and HTMLElement globals are required to use @elastic/eui with VRT + * + * The jest-puppeteer-docker env extends a node test environment and not jsdom test environment. + * Some EUI components that are included in the bundle, but not used, require the jsdom setup. + * To bypass these errors we are just mocking both as empty objects. + */ + window: {}, + HTMLElement: {}, }, - process.env.DEBUG === 'true' ? jestPuppeteer : jestPuppeteerDocker, - tsPreset, -); + ...(process.env.DEBUG === 'true' ? jestPuppeteer : jestPuppeteerDocker), + ...tsPreset, +}; diff --git a/integration/jest_env_setup.ts b/integration/jest_env_setup.ts index 35cbdcdc2f..bd2d4b36c2 100644 --- a/integration/jest_env_setup.ts +++ b/integration/jest_env_setup.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { configureToMatchImageSnapshot } from 'jest-image-snapshot'; diff --git a/integration/jest_puppeteer.config.js b/integration/jest_puppeteer.config.js index 7ea5a1de49..fdb35f5111 100644 --- a/integration/jest_puppeteer.config.js +++ b/integration/jest_puppeteer.config.js @@ -14,9 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ const getConfig = require('jest-puppeteer-docker/lib/config'); + const isDebug = process.env.DEBUG === 'true'; const baseConfig = isDebug ? {} : getConfig(); const defaults = require('./defaults'); @@ -38,36 +40,34 @@ const sharedConfig = { * * https://github.com/smooth-code/jest-puppeteer/tree/master/packages/jest-environment-puppeteer#jest-puppeteerconfigjs */ -const customConfig = Object.assign( - { - ...(isDebug - ? { - launch: { - dumpio: false, - headless: false, - slowMo: 500, - devtools: true, - ...sharedConfig, - }, - } - : { - // https://github.com/gidztech/jest-puppeteer-docker/issues/24 - chromiumFlags: [], // for docker chromium options - connect: { - ...sharedConfig, - }, - }), - server: useLocalStorybook - ? null - : { - command: `yarn start --port=${port} --quiet`, - port, - usedPortAction: 'error', - launchTimeout: 120000, - debug: true, +const customConfig = { + ...(isDebug + ? { + launch: { + dumpio: false, + headless: false, + slowMo: 500, + devtools: true, + ...sharedConfig, }, - }, - baseConfig, -); + } + : { + // https://github.com/gidztech/jest-puppeteer-docker/issues/24 + chromiumFlags: [], // for docker chromium options + connect: { + ...sharedConfig, + }, + }), + server: useLocalStorybook + ? null + : { + command: `yarn start --port=${port} --quiet`, + port, + usedPortAction: 'error', + launchTimeout: 120000, + debug: true, + }, + ...baseConfig, +}; module.exports = customConfig; diff --git a/integration/page_objects/common.ts b/integration/page_objects/common.ts index c1efb83218..6d07757902 100644 --- a/integration/page_objects/common.ts +++ b/integration/page_objects/common.ts @@ -14,13 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import Url from 'url'; -import { toMatchImageSnapshot } from '../jest_env_setup'; // @ts-ignore import defaults from '../defaults'; +import { toMatchImageSnapshot } from '../jest_env_setup'; const port = process.env.PORT || defaults.PORT; const host = process.env.HOST || defaults.HOST; @@ -167,7 +168,7 @@ class CommonPage { * @param selector */ async getBoundingClientRect(selector: string) { - return page.$eval(selector, (element) => { + return await page.$eval(selector, (element) => { const { x, y, width, height } = element.getBoundingClientRect(); return { left: x, top: y, width, height, id: element.id }; }); @@ -331,7 +332,7 @@ class CommonPage { mousePosition: MousePosition, options?: Omit, ) { - const action = async () => await this.moveMouseRelativeToDOMElement(mousePosition, this.chartSelector); + const action = async() => await this.moveMouseRelativeToDOMElement(mousePosition, this.chartSelector); await this.expectChartAtUrlToMatchScreenshot(url, { ...options, action, @@ -352,7 +353,7 @@ class CommonPage { end: MousePosition, options?: Omit, ) { - const action = async () => await this.dragMouseRelativeToDOMElement(start, end, this.chartSelector); + const action = async() => await this.dragMouseRelativeToDOMElement(start, end, this.chartSelector); await this.expectChartAtUrlToMatchScreenshot(url, { ...options, action, @@ -375,7 +376,7 @@ class CommonPage { } // activate peripheral visibility - page.evaluate(() => { + await page.evaluate(() => { document.querySelector('html')!.classList.add('echVisualTesting'); }); } diff --git a/integration/page_objects/index.ts b/integration/page_objects/index.ts index 916310c455..d1b4053717 100644 --- a/integration/page_objects/index.ts +++ b/integration/page_objects/index.ts @@ -14,6 +14,7 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export * from './common'; diff --git a/integration/tests/all.test.ts b/integration/tests/all.test.ts index 3d91bf8926..134bea533b 100644 --- a/integration/tests/all.test.ts +++ b/integration/tests/all.test.ts @@ -14,10 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { common } from '../page_objects'; import { getStorybookInfo } from '../helpers'; +import { common } from '../page_objects'; // mock required for importing trick, otherwise .scss files will throw an error jest.mock('../../.storybook/theme_service.ts', () => ({ @@ -29,7 +30,7 @@ const storyGroups = getStorybookInfo(); describe('Baseline Visual tests for all stories', () => { describe.each(storyGroups)('%s', (_group, encodedGroup, stories) => { describe.each(stories)('%s', (_title, encodedTitle) => { - it('visually looks correct', async () => { + it('visually looks correct', async() => { const url = `http://localhost:9001?id=${encodedGroup}--${encodedTitle}`; await common.expectChartAtUrlToMatchScreenshot(url); }); diff --git a/integration/tests/annotations_stories.test.ts b/integration/tests/annotations_stories.test.ts index 07878d710f..6b8f62b649 100644 --- a/integration/tests/annotations_stories.test.ts +++ b/integration/tests/annotations_stories.test.ts @@ -14,28 +14,29 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { common } from '../page_objects'; describe('Annotations stories', () => { describe('rotation', () => { - it('rotation - 0', async () => { + it('rotation - 0', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/annotations-lines--single-bar-histogram&knob-debug=&knob-chartRotation=0', ); }); - it('rotation - 90', async () => { + it('rotation - 90', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/annotations-lines--single-bar-histogram&knob-debug=&knob-chartRotation=90', ); }); - it('rotation - negative 90', async () => { + it('rotation - negative 90', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/annotations-lines--single-bar-histogram&knob-debug=&knob-chartRotation=-90', ); }); - it('rotation - 180', async () => { + it('rotation - 180', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/annotations-lines--single-bar-histogram&knob-debug=&knob-chartRotation=180', ); diff --git a/integration/tests/area_stories.test.ts b/integration/tests/area_stories.test.ts index 606d470d82..d5a2e8f014 100644 --- a/integration/tests/area_stories.test.ts +++ b/integration/tests/area_stories.test.ts @@ -14,18 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { common } from '../page_objects'; describe('Area series stories', () => { - it('stacked as NOT percentage', async () => { + it('stacked as NOT percentage', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/area-chart--stacked-percentage&knob-stacked as percentage=', ); }); describe('accessorFormats', () => { - it('should show custom format', async () => { + it('should show custom format', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/area-chart--band-area&knob-scale to extent=&knob-y0AccessorFormat= [min]&knob-y1AccessorFormat= [max]', ); @@ -33,24 +34,24 @@ describe('Area series stories', () => { }); describe('scale to extents', () => { describe('scaleyScaleToDataExtent is true', () => { - it('should show correct extents - Banded', async () => { + it('should show correct extents - Banded', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/area-chart--stacked-band&knob-scale to extent=true', ); }); - it('should show correct extents - stacked', async () => { + it('should show correct extents - stacked', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/area-chart--stacked-band&knob-scale to extent=true', ); }); }); describe('scaleyScaleToDataExtent is false', () => { - it('should show correct extents - Banded', async () => { + it('should show correct extents - Banded', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/area-chart--stacked-band&knob-scale to extent=false', ); }); - it('should show correct extents - stacked', async () => { + it('should show correct extents - stacked', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/area-chart--stacked-band&knob-scale to extent=false', ); diff --git a/integration/tests/axis_stories.test.ts b/integration/tests/axis_stories.test.ts index 198277abbc..23ebce1a85 100644 --- a/integration/tests/axis_stories.test.ts +++ b/integration/tests/axis_stories.test.ts @@ -14,52 +14,53 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { common } from '../page_objects'; describe('Axis stories', () => { - it('should render proper tick count', async () => { + it('should render proper tick count', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/axes--basic&knob-Tick Label Padding=0&knob-debug=&knob-Bottom overlap labels=&knob-Bottom overlap ticks=true&knob-Number of ticks on bottom=20&knob-Left overlap labels=&knob-Left overlap ticks=true&knob-Number of ticks on left=10', ); }); - it('should render proper tick count with showOverlappingLabels', async () => { + it('should render proper tick count with showOverlappingLabels', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/axes--basic&knob-Tick Label Padding=0&knob-debug=&knob-Bottom overlap labels_Bottom Axis=true&knob-Bottom overlap ticks_Bottom Axis=true&knob-Number of ticks on bottom_Bottom Axis=20&knob-Left overlap labels_Left Axis=&knob-Left overlap ticks_Left Axis=true&knob-Number of ticks on left_Left Axis=10', ); }); - it('should render ticks with varied rotations', async () => { + it('should render ticks with varied rotations', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/axes--tick-label-rotation&knob-Tick Label Padding=0&knob-bottom axis tick label rotation=47&knob-hide bottom axis=&knob-left axis tick label rotation=-56&knob-hide left axis=&knob-top axis tick label rotation=-59&knob-hide top axis=&knob-right axis tick label rotation=30&knob-hide right axis=&knob-debug=', ); }); - it('should hide bottom axis', async () => { + it('should hide bottom axis', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/axes--tick-label-rotation&knob-Tick Label Padding=0&knob-bottom axis tick label rotation=47&knob-hide bottom axis=true&knob-left axis tick label rotation=-56&knob-hide left axis=&knob-top axis tick label rotation=-59&knob-hide top axis=&knob-right axis tick label rotation=30&knob-hide right axis=&knob-debug=', ); }); - it('should hide top axis', async () => { + it('should hide top axis', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/axes--tick-label-rotation&knob-Tick Label Padding=0&knob-bottom axis tick label rotation=47&knob-hide bottom axis=&knob-left axis tick label rotation=-56&knob-hide left axis=&knob-top axis tick label rotation=-59&knob-hide top axis=true&knob-right axis tick label rotation=30&knob-hide right axis=&knob-debug=', ); }); - it('should hide left axis', async () => { + it('should hide left axis', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/axes--tick-label-rotation&knob-Tick Label Padding=0&knob-bottom axis tick label rotation=47&knob-hide bottom axis=&knob-left axis tick label rotation=-56&knob-hide left axis=true&knob-top axis tick label rotation=-59&knob-hide top axis=&knob-right axis tick label rotation=30&knob-hide right axis=&knob-debug=', ); }); - it('should hide right axis', async () => { + it('should hide right axis', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/axes--tick-label-rotation&knob-Tick Label Padding=0&knob-bottom axis tick label rotation=47&knob-hide bottom axis=&knob-left axis tick label rotation=-56&knob-hide left axis=&knob-top axis tick label rotation=-59&knob-hide top axis=&knob-right axis tick label rotation=30&knob-hide right axis=true&knob-debug=', ); }); - it('should render tick padding', async () => { + it('should render tick padding', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/axes--many-tick-labels&knob-Tick Label Padding=60', ); }); - it('should render with domain constraints', async () => { + it('should render with domain constraints', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/axes--custom-mixed&knob-left min=2&knob-xDomain max=2', ); diff --git a/integration/tests/bar_stories.test.ts b/integration/tests/bar_stories.test.ts index ae660a293b..e780de553a 100644 --- a/integration/tests/bar_stories.test.ts +++ b/integration/tests/bar_stories.test.ts @@ -14,13 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { common } from '../page_objects'; describe('Bar series stories', () => { describe('[test] switch ordinal/linear x axis', () => { - it('using ordinal x axis', async () => { + it('using ordinal x axis', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-switch-ordinal-linear-axis&knob-scaleType=ordinal', ); @@ -28,7 +29,7 @@ describe('Bar series stories', () => { }); describe('[test] discover', () => { - it('using no custom minInterval', async () => { + it('using no custom minInterval', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-discover&knob-use custom minInterval of 30s=', ); @@ -37,22 +38,22 @@ describe('Bar series stories', () => { describe('[test] histogram mode (linear)', () => { describe('enableHistogramMode is true', () => { - it('rotation - 0', async () => { + it('rotation - 0', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-linear&knob-chartRotation=0&knob-bars padding=0.25&knob-histogram padding=0.05&knob-other series=line&knob-point series alignment=center&knob-hasHistogramBarSeries=&knob-debug=true&knob-bars-1 enableHistogramMode=true&knob-bars-2 enableHistogramMode=', ); }); - it('rotation - 90', async () => { + it('rotation - 90', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-linear&knob-chartRotation=90&knob-bars padding=0.25&knob-histogram padding=0.05&knob-other series=line&knob-point series alignment=center&knob-hasHistogramBarSeries=&knob-debug=true&knob-bars-1 enableHistogramMode=true&knob-bars-2 enableHistogramMode=', ); }); - it('rotation - negative 90', async () => { + it('rotation - negative 90', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-linear&knob-chartRotation=-90&knob-bars padding=0.25&knob-histogram padding=0.05&knob-other series=line&knob-point series alignment=center&knob-hasHistogramBarSeries=&knob-debug=true&knob-bars-1 enableHistogramMode=true&knob-bars-2 enableHistogramMode=', ); }); - it('rotation - 180', async () => { + it('rotation - 180', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-linear&knob-chartRotation=180&knob-bars padding=0.25&knob-histogram padding=0.05&knob-other series=line&knob-point series alignment=center&knob-hasHistogramBarSeries=&knob-debug=true&knob-bars-1 enableHistogramMode=true&knob-bars-2 enableHistogramMode=', ); @@ -60,22 +61,22 @@ describe('Bar series stories', () => { }); describe('enableHistogramMode is false', () => { - it('rotation - 0', async () => { + it('rotation - 0', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-linear&knob-chartRotation=0&knob-bars padding=0.25&knob-histogram padding=0.05&knob-other series=line&knob-point series alignment=center&knob-hasHistogramBarSeries=&knob-debug=true&knob-bars-1 enableHistogramMode=&knob-bars-2 enableHistogramMode=', ); }); - it('rotation - 90', async () => { + it('rotation - 90', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-linear&knob-chartRotation=90&knob-bars padding=0.25&knob-histogram padding=0.05&knob-other series=line&knob-point series alignment=center&knob-hasHistogramBarSeries=&knob-debug=true&knob-bars-1 enableHistogramMode=&knob-bars-2 enableHistogramMode=', ); }); - it('rotation - negative 90', async () => { + it('rotation - negative 90', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-linear&knob-chartRotation=-90&knob-bars padding=0.25&knob-histogram padding=0.05&knob-other series=line&knob-point series alignment=center&knob-hasHistogramBarSeries=&knob-debug=true&knob-bars-1 enableHistogramMode=&knob-bars-2 enableHistogramMode=', ); }); - it('rotation - 180', async () => { + it('rotation - 180', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-linear&knob-chartRotation=180&knob-bars padding=0.25&knob-histogram padding=0.05&knob-other series=line&knob-point series alignment=center&knob-hasHistogramBarSeries=&knob-debug=true&knob-bars-1 enableHistogramMode=&knob-bars-2 enableHistogramMode=', ); @@ -83,17 +84,17 @@ describe('Bar series stories', () => { }); describe('point alignment', () => { - it('start', async () => { + it('start', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-linear&knob-chartRotation=-90&knob-bars padding=0.25&knob-histogram padding=0.05&knob-other series=area&knob-point series alignment=start&knob-hasHistogramBarSeries=true&knob-debug=true&knob-bars-1 enableHistogramMode=&knob-bars-2 enableHistogramMode=', ); }); - it('center', async () => { + it('center', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-linear&knob-chartRotation=-90&knob-bars padding=0.25&knob-histogram padding=0.05&knob-other series=area&knob-point series alignment=center&knob-hasHistogramBarSeries=true&knob-debug=true&knob-bars-1 enableHistogramMode=&knob-bars-2 enableHistogramMode=', ); }); - it('end', async () => { + it('end', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-linear&knob-chartRotation=-90&knob-bars padding=0.25&knob-histogram padding=0.05&knob-other series=area&knob-point series alignment=end&knob-hasHistogramBarSeries=true&knob-debug=true&knob-bars-1 enableHistogramMode=&knob-bars-2 enableHistogramMode=', ); @@ -103,22 +104,22 @@ describe('Bar series stories', () => { describe('[test] histogram mode (ordinal)', () => { describe('enableHistogramMode is false, hasHistogramBarSeries is false', () => { - it('rotation - 0', async () => { + it('rotation - 0', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-ordinal&knob-chartRotation=0&knob-bars padding=0.25&knob-hasHistogramBarSeries=&knob-debug=true&knob-bars-1 enableHistogramMode=true&knob-bars-2 enableHistogramMode=', ); }); - it('rotation - 90', async () => { + it('rotation - 90', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-ordinal&knob-chartRotation=90&knob-bars padding=0.25&knob-hasHistogramBarSeries=&knob-debug=true&knob-bars-1 enableHistogramMode=true&knob-bars-2 enableHistogramMode=', ); }); - it('rotation - negative 90', async () => { + it('rotation - negative 90', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-ordinal&knob-chartRotation=-90&knob-bars padding=0.25&knob-hasHistogramBarSeries=&knob-debug=true&knob-bars-1 enableHistogramMode=true&knob-bars-2 enableHistogramMode=', ); }); - it('rotation - 180', async () => { + it('rotation - 180', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-ordinal&knob-chartRotation=180&knob-bars padding=0.25&knob-hasHistogramBarSeries=&knob-debug=true&knob-bars-1 enableHistogramMode=true&knob-bars-2 enableHistogramMode=', ); @@ -126,22 +127,22 @@ describe('Bar series stories', () => { }); describe('enableHistogramMode is true, hasHistogramBarSeries is true', () => { - it('rotation - 0', async () => { + it('rotation - 0', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-ordinal&knob-chartRotation=0&knob-bars padding=0.25&knob-hasHistogramBarSeries=true&knob-debug=true&knob-bars-1 enableHistogramMode=true&knob-bars-2 enableHistogramMode=', ); }); - it('rotation - 90', async () => { + it('rotation - 90', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-ordinal&knob-chartRotation=90&knob-bars padding=0.25&knob-hasHistogramBarSeries=true&knob-debug=true&knob-bars-1 enableHistogramMode=true&knob-bars-2 enableHistogramMode=', ); }); - it('rotation - negative 90', async () => { + it('rotation - negative 90', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-ordinal&knob-chartRotation=-90&knob-bars padding=0.25&knob-hasHistogramBarSeries=true&knob-debug=true&knob-bars-1 enableHistogramMode=true&knob-bars-2 enableHistogramMode=', ); }); - it('rotation - 180', async () => { + it('rotation - 180', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-histogram-mode-ordinal&knob-chartRotation=180&knob-bars padding=0.25&knob-hasHistogramBarSeries=true&knob-debug=true&knob-bars-1 enableHistogramMode=true&knob-bars-2 enableHistogramMode=', ); diff --git a/integration/tests/interactions.test.ts b/integration/tests/interactions.test.ts index 0d2828d344..adc2fe9151 100644 --- a/integration/tests/interactions.test.ts +++ b/integration/tests/interactions.test.ts @@ -14,10 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { common } from '../page_objects'; import { Rotation, Placement } from '../../src'; +import { common } from '../page_objects'; describe('Interactions', () => { describe('Tooltips', () => { @@ -39,7 +40,7 @@ describe('Interactions', () => { (placement) => { const boundaryStr = boundary === 'default' ? '' : boundary; const url = `http://localhost:9001/?path=/story/bar-chart--test-tooltip-and-rotation&knob-Boundary Element=${boundaryStr}&knob-chartRotation=${rotation}&knob-Tooltip placement=${placement}`; - it('shows tooltip in top-left corner', async () => { + it('shows tooltip in top-left corner', async() => { await common.expectChartWithMouseAtUrlToMatchScreenshot( url, { left, top }, @@ -47,7 +48,7 @@ describe('Interactions', () => { ); }); - it('shows tooltip in top-right corner', async () => { + it('shows tooltip in top-right corner', async() => { await common.expectChartWithMouseAtUrlToMatchScreenshot( url, { right, top }, @@ -55,7 +56,7 @@ describe('Interactions', () => { ); }); - it('shows tooltip in bottom-left corner', async () => { + it('shows tooltip in bottom-left corner', async() => { await common.expectChartWithMouseAtUrlToMatchScreenshot( url, { left, bottom }, @@ -63,7 +64,7 @@ describe('Interactions', () => { ); }); - it('shows tooltip in bottom-right corner', async () => { + it('shows tooltip in bottom-right corner', async() => { await common.expectChartWithMouseAtUrlToMatchScreenshot( url, { right, bottom }, @@ -78,28 +79,28 @@ describe('Interactions', () => { describe('Hover over specific bars', () => { describe('rotation 0', () => { - it('shows tooltip on first bar group - top', async () => { + it('shows tooltip on first bar group - top', async() => { await common.expectChartWithMouseAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-tooltip-and-rotation', { left: 50, top: 50 }, { screenshotSelector: 'body' }, ); }); - it('shows tooltip on last bar group - top', async () => { + it('shows tooltip on last bar group - top', async() => { await common.expectChartWithMouseAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-tooltip-and-rotation', { right: 50, top: 50 }, { screenshotSelector: 'body' }, ); }); - it('shows tooltip on first bar group - bottom', async () => { + it('shows tooltip on first bar group - bottom', async() => { await common.expectChartWithMouseAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-tooltip-and-rotation', { left: 50, bottom: 50 }, { screenshotSelector: 'body' }, ); }); - it('shows tooltip on last bar group - bottom', async () => { + it('shows tooltip on last bar group - bottom', async() => { await common.expectChartWithMouseAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-tooltip-and-rotation', { left: 50, bottom: 50 }, @@ -109,28 +110,28 @@ describe('Interactions', () => { }); describe('rotation 90', () => { - it('shows tooltip on first bar group - top', async () => { + it('shows tooltip on first bar group - top', async() => { await common.expectChartWithMouseAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-tooltip-and-rotation&knob-chartRotation=90', { left: 50, top: 50 }, { screenshotSelector: 'body' }, ); }); - it('shows tooltip on last bar group - top', async () => { + it('shows tooltip on last bar group - top', async() => { await common.expectChartWithMouseAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-tooltip-and-rotation&knob-chartRotation=90', { left: 50, top: 50 }, { screenshotSelector: 'body' }, ); }); - it('shows tooltip on first bar group - bottom', async () => { + it('shows tooltip on first bar group - bottom', async() => { await common.expectChartWithMouseAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-tooltip-and-rotation&knob-chartRotation=90', { left: 50, bottom: 50 }, { screenshotSelector: 'body' }, ); }); - it('shows tooltip on last bar group - bottom', async () => { + it('shows tooltip on last bar group - bottom', async() => { await common.expectChartWithMouseAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-tooltip-and-rotation&knob-chartRotation=90', { right: 50, bottom: 50 }, @@ -140,14 +141,14 @@ describe('Interactions', () => { }); }); - it('should show tooltip on sunburst', async () => { + it('should show tooltip on sunburst', async() => { await common.expectChartWithMouseAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/interactions--sunburst-slice-clicks', { left: 350, top: 100 }, ); }); - it('should render custom tooltip', async () => { + it('should render custom tooltip', async() => { await common.expectChartWithMouseAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/bar-chart--test-tooltip-and-rotation&knob-Custom Tooltip=true&knob-Show Legend=true', { left: 330, top: 40 }, @@ -155,7 +156,7 @@ describe('Interactions', () => { ); }); - it('should render corrent tooltip for split and y accessors', async () => { + it('should render corrent tooltip for split and y accessors', async() => { await common.expectChartWithMouseAtUrlToMatchScreenshot( 'http://localhost:9001/iframe.html?id=bar-chart--bar-chart-2-y-2-g', { left: 330, top: 40 }, @@ -164,21 +165,21 @@ describe('Interactions', () => { }); describe('brushing', () => { - it('show rectangular brush selection', async () => { + it('show rectangular brush selection', async() => { await common.expectChartWithDragAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/interactions--brush-tool', { left: 100, top: 100 }, { left: 250, top: 250 }, ); }); - it('show y brush selection', async () => { + it('show y brush selection', async() => { await common.expectChartWithDragAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/interactions--brush-tool&knob-brush axis=y&knob-chartRotation=0', { left: 100, top: 100 }, { left: 250, top: 250 }, ); }); - it('show x brush selection', async () => { + it('show x brush selection', async() => { await common.expectChartWithDragAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/interactions--brush-tool&knob-brush axis=x&knob-chartRotation=0', { left: 100, top: 100 }, @@ -186,21 +187,21 @@ describe('Interactions', () => { ); }); - it('show rectangular brush selection -90 degree', async () => { + it('show rectangular brush selection -90 degree', async() => { await common.expectChartWithDragAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/interactions--brush-tool&knob-brush axis=both&knob-chartRotation=-90', { left: 100, top: 100 }, { left: 250, top: 250 }, ); }); - it('show y brush selection -90 degree', async () => { + it('show y brush selection -90 degree', async() => { await common.expectChartWithDragAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/interactions--brush-tool&knob-brush axis=y&knob-chartRotation=-90', { left: 100, top: 100 }, { left: 250, top: 250 }, ); }); - it('show x brush selection -90 degree', async () => { + it('show x brush selection -90 degree', async() => { await common.expectChartWithDragAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/interactions--brush-tool&knob-brush axis=x&knob-chartRotation=-90', { left: 100, top: 100 }, diff --git a/integration/tests/legend_stories.test.ts b/integration/tests/legend_stories.test.ts index e81c3b07c2..bd5c3d962f 100644 --- a/integration/tests/legend_stories.test.ts +++ b/integration/tests/legend_stories.test.ts @@ -14,34 +14,35 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { common } from '../page_objects'; describe('Legend stories', () => { - it('should render non-split series', async () => { + it('should render non-split series', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/legend--changing-specs&knob-split series=', ); }); - it('should hide line series legend item', async () => { + it('should hide line series legend item', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/legend--hide-legend-items-by-series&knob-hide bar series in legend=&knob-hide line series in legend=true', ); }); - it('should hide bar series legend item', async () => { + it('should hide bar series legend item', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/legend--hide-legend-items-by-series&knob-hide bar series in legend=true&knob-hide line series in legend=', ); }); - it('should 0 legend buffer', async () => { + it('should 0 legend buffer', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/legend--legend-spacing-buffer&knob-legend buffer value=0', ); }); - it('should render color picker on mouse click', async () => { - const action = async () => + it('should render color picker on mouse click', async() => { + const action = async() => await common.clickMouseRelativeToDOMElement({ left: 0, top: 0 }, '.echLegendItem__color'); await common.expectElementAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/legend--color-picker', diff --git a/integration/tests/line_stories.test.ts b/integration/tests/line_stories.test.ts index b8400e6332..ca6c37ef89 100644 --- a/integration/tests/line_stories.test.ts +++ b/integration/tests/line_stories.test.ts @@ -14,28 +14,29 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { common } from '../page_objects'; describe('Line series stories', () => { describe('rotation', () => { - it('rotation - 0', async () => { + it('rotation - 0', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/line-chart--ordinal-with-axis&knob-chartRotation=0', ); }); - it('rotation - 90', async () => { + it('rotation - 90', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/line-chart--ordinal-with-axis&knob-chartRotation=90', ); }); - it('rotation - negative 90', async () => { + it('rotation - negative 90', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/line-chart--ordinal-with-axis&knob-chartRotation=-90', ); }); - it('rotation - 180', async () => { + it('rotation - 180', async() => { await common.expectChartAtUrlToMatchScreenshot( 'http://localhost:9001/?path=/story/line-chart--ordinal-with-axis&knob-chartRotation=180', ); diff --git a/integration/tests/mixed_stories.test.ts b/integration/tests/mixed_stories.test.ts index 66a5f105ff..7468bef816 100644 --- a/integration/tests/mixed_stories.test.ts +++ b/integration/tests/mixed_stories.test.ts @@ -14,16 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { common } from '../page_objects'; import { Fit } from '../../src'; +import { common } from '../page_objects'; describe('Mixed series stories', () => { describe('Fitting functions', () => { describe('Area charts - no endValue', () => { Object.values(Fit).forEach((fitType) => { - it(`should display correct fit for type - ${fitType}`, async () => { + it(`should display correct fit for type - ${fitType}`, async() => { await common.expectChartAtUrlToMatchScreenshot( `http://localhost:9001/?path=/story/mixed-charts--fitting-functions-non-stacked-series&knob-seriesType=area&knob-dataset=all&knob-fitting function=${fitType}&knob-Curve=0&knob-End value=none&knob-Explicit valuve (using Fit.Explicit)=8`, ); @@ -33,7 +34,7 @@ describe('Mixed series stories', () => { describe('Area charts - endValue set to 2', () => { Object.values(Fit).forEach((fitType) => { - it(`should display correct fit for type - ${fitType}`, async () => { + it(`should display correct fit for type - ${fitType}`, async() => { await common.expectChartAtUrlToMatchScreenshot( `http://localhost:9001/?path=/story/mixed-charts--fitting-functions-non-stacked-series&knob-seriesType=area&knob-dataset=all&knob-fitting function=${fitType}&knob-Curve=0&knob-End value=2&knob-Explicit valuve (using Fit.Explicit)=8`, ); @@ -43,7 +44,7 @@ describe('Mixed series stories', () => { describe('Area charts - endValue set to "nearest"', () => { Object.values(Fit).forEach((fitType) => { - it(`should display correct fit for type - ${fitType}`, async () => { + it(`should display correct fit for type - ${fitType}`, async() => { await common.expectChartAtUrlToMatchScreenshot( `http://localhost:9001/?path=/story/mixed-charts--fitting-functions-non-stacked-series&knob-seriesType=area&knob-dataset=all&knob-fitting function=${fitType}&knob-Curve=0&knob-End value=nearest&knob-Explicit valuve (using Fit.Explicit)=8`, ); @@ -53,7 +54,7 @@ describe('Mixed series stories', () => { describe('Area charts - with curved - endValue set to 2', () => { Object.values(Fit).forEach((fitType) => { - it(`should display correct fit for type - ${fitType}`, async () => { + it(`should display correct fit for type - ${fitType}`, async() => { await common.expectChartAtUrlToMatchScreenshot( `http://localhost:9001/?path=/story/mixed-charts--fitting-functions-non-stacked-series&knob-seriesType=area&knob-dataset=all&knob-fitting function=${fitType}&knob-Curve=1&knob-End value=2&knob-Explicit valuve (using Fit.Explicit)=8`, ); @@ -63,7 +64,7 @@ describe('Mixed series stories', () => { describe('Area charts - Ordinal dataset - no endValue', () => { Object.values(Fit).forEach((fitType) => { - it(`should display correct fit for type - ${fitType}`, async () => { + it(`should display correct fit for type - ${fitType}`, async() => { await common.expectChartAtUrlToMatchScreenshot( `http://localhost:9001/?path=/story/mixed-charts--fitting-functions-non-stacked-series&knob-seriesType=area&knob-dataset=ordinal&knob-fitting function=${fitType}&knob-Curve=0&knob-End value=none&knob-Explicit valuve (using Fit.Explicit)=8`, ); @@ -73,7 +74,7 @@ describe('Mixed series stories', () => { describe('Line charts - no endValue', () => { Object.values(Fit).forEach((fitType) => { - it(`should display correct fit for type - ${fitType}`, async () => { + it(`should display correct fit for type - ${fitType}`, async() => { await common.expectChartAtUrlToMatchScreenshot( `http://localhost:9001/?path=/story/mixed-charts--fitting-functions-non-stacked-series&knob-seriesType=line&knob-dataset=all&knob-fitting function=${fitType}&knob-Curve=0&knob-End value=none&knob-Explicit valuve (using Fit.Explicit)=8`, ); @@ -83,7 +84,7 @@ describe('Mixed series stories', () => { describe('Line charts - endValue set to 2', () => { Object.values(Fit).forEach((fitType) => { - it(`should display correct fit for type - ${fitType}`, async () => { + it(`should display correct fit for type - ${fitType}`, async() => { await common.expectChartAtUrlToMatchScreenshot( `http://localhost:9001/?path=/story/mixed-charts--fitting-functions-non-stacked-series&knob-seriesType=line&knob-dataset=all&knob-fitting function=${fitType}&knob-Curve=0&knob-End value=2&knob-Explicit valuve (using Fit.Explicit)=8`, ); @@ -93,7 +94,7 @@ describe('Mixed series stories', () => { describe('Line charts - with curve - endValue set to 2', () => { Object.values(Fit).forEach((fitType) => { - it(`should display correct fit for type - ${fitType}`, async () => { + it(`should display correct fit for type - ${fitType}`, async() => { await common.expectChartAtUrlToMatchScreenshot( `http://localhost:9001/?path=/story/mixed-charts--fitting-functions-non-stacked-series&knob-seriesType=line&knob-dataset=all&knob-fitting function=${fitType}&knob-Curve=1&knob-End value=2&knob-Explicit valuve (using Fit.Explicit)=8`, ); diff --git a/jest.config.js b/jest.config.js index edddf4ce01..efd28adef5 100644 --- a/jest.config.js +++ b/jest.config.js @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ module.exports = { roots: ['/src'], diff --git a/jest.tz.config.js b/jest.tz.config.js index 520d56ca37..ab085dcf92 100644 --- a/jest.tz.config.js +++ b/jest.tz.config.js @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ const baseConfig = require('./jest.config'); diff --git a/lint-staged.config.js b/lint-staged.config.js new file mode 100644 index 0000000000..3f937a0b7d --- /dev/null +++ b/lint-staged.config.js @@ -0,0 +1,3 @@ +module.exports = { + '*.{js,ts,tsx}': ['yarn lint:fix'], +}; diff --git a/package.json b/package.json index 375e21ce07..32ff10f206 100644 --- a/package.json +++ b/package.json @@ -11,6 +11,9 @@ "publishConfig": { "access": "public" }, + "files": [ + "dist/**/*" + ], "scripts": { "autoprefix:css": "echo 'Autoprefixing...' && yarn postcss dist/*.css --no-map --use autoprefixer -d dist", "api:check": "yarn build:ts && yarn api:extract", @@ -26,9 +29,9 @@ "build:watch": "echo 'Watching build...' && yarn build:clean && yarn build:css && yarn build:compile -w ", "concat:sass": "echo 'Concat SASS...' && node scripts/concat_sass.js", "cz": "git-cz", - "lint": "NODE_ENV=production eslint --ext .tsx,.ts,.js .", + "lint": "NODE_ENV=production eslint --quiet --ext .tsx,.ts,.js .", "lint:fix": "yarn lint --fix", - "prettier:check": "prettier --check \"**/*.{js,jsx,ts,tsx,json,html,css,scss}\"", + "prettier:check": "prettier --check \"**/*.{json,html,css,scss}\"", "playground": "cd .playground && webpack-dev-server", "playground:ie": "cd .playground && webpack-dev-server --host=0.0.0.0 --disable-host-check --useLocalIp", "pq": "pretty-quick", @@ -51,9 +54,27 @@ "ts:prune": "ts-prune", "watch": "yarn test --watch" }, - "files": [ - "dist/**/*" - ], + "dependencies": { + "@popperjs/core": "^2.4.0", + "chroma-js": "^2.1.0", + "classnames": "^2.2.6", + "d3-array": "^1.2.4", + "d3-collection": "^1.0.7", + "d3-color": "^1.4.0", + "d3-scale": "^1.0.7", + "d3-shape": "^1.3.4", + "newtype-ts": "^0.2.4", + "path2d-polyfill": "^0.4.2", + "prop-types": "^15.7.2", + "re-reselect": "^3.4.0", + "react-redux": "^7.1.0", + "redux": "^4.0.4", + "reselect": "^4.0.0", + "resize-observer-polyfill": "^1.5.1", + "ts-debounce": "^1.0.0", + "utility-types": "^3.10.0", + "uuid": "^3.3.2" + }, "devDependencies": { "@babel/core": "^7.8.3", "@babel/plugin-transform-modules-commonjs": "^7.8.3", @@ -110,8 +131,8 @@ "@types/storybook__addon-info": "^5.2.1", "@types/url-parse": "^1.4.3", "@types/uuid": "^3.4.4", - "@typescript-eslint/eslint-plugin": "^2.10.0", - "@typescript-eslint/parser": "^2.10.0", + "@typescript-eslint/eslint-plugin": "^3.0.2", + "@typescript-eslint/parser": "^3.0.2", "autoprefixer": "^9.6.1", "babel-loader": "^8.0.6", "backport": "^4.8.0", @@ -123,15 +144,20 @@ "cz-conventional-changelog": "^3.0.2", "enzyme": "^3.9.0", "enzyme-adapter-react-16": "^1.10.0", - "eslint": "^6.8.0", + "eslint": "^7.1.0", + "eslint-config-airbnb-typescript": "^7.2.1", "eslint-config-prettier": "^6.9.0", + "eslint-plugin-eslint-comments": "^3.2.0", "eslint-plugin-file-header": "^0.0.1", + "eslint-plugin-header": "^3.0.0", "eslint-plugin-import": "^2.20.2", "eslint-plugin-jest": "^23.0.4", + "eslint-plugin-jsx-a11y": "^6.2.3", "eslint-plugin-prettier": "^3.1.2", + "eslint-plugin-promise": "^4.2.1", "eslint-plugin-react": "^7.19.0", "eslint-plugin-react-hooks": "^4.0.3", - "eslint-plugin-unicorn": "^17.2.0", + "eslint-plugin-unicorn": "^20.1.0", "geckodriver": "^1.19.1", "husky": "^3.1.0", "jest": "^25.4.0", @@ -141,6 +167,7 @@ "jest-matcher-utils": "^25.4.0", "jest-puppeteer": "^4.4.0", "jest-puppeteer-docker": "^1.3.2", + "lint-staged": "^10.2.7", "lodash": "^4.17.15", "lorem-ipsum": "^2.0.3", "luxon": "^1.11.3", @@ -171,27 +198,6 @@ "webpack-cli": "^3.3.1", "webpack-dev-server": "^3.3.1" }, - "dependencies": { - "chroma-js": "^2.1.0", - "@popperjs/core": "^2.4.0", - "classnames": "^2.2.6", - "d3-array": "^1.2.4", - "d3-collection": "^1.0.7", - "d3-color": "^1.4.0", - "d3-scale": "^1.0.7", - "d3-shape": "^1.3.4", - "newtype-ts": "^0.2.4", - "path2d-polyfill": "^0.4.2", - "prop-types": "^15.7.2", - "re-reselect": "^3.4.0", - "react-redux": "^7.1.0", - "redux": "^4.0.4", - "reselect": "^4.0.0", - "resize-observer-polyfill": "^1.5.1", - "ts-debounce": "^1.0.0", - "utility-types": "^3.10.0", - "uuid": "^3.3.2" - }, "peerDependencies": { "moment-timezone": "^0.5.27", "react": "^16.12.0", diff --git a/scripts/concat_sass.js b/scripts/concat_sass.js index 9398341454..0b34edb95b 100644 --- a/scripts/concat_sass.js +++ b/scripts/concat_sass.js @@ -14,10 +14,10 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ - -/* eslint-disable @typescript-eslint/no-var-requires */ + * under the License. + */ const fs = require('fs'); + const sassGraph = require('sass-graph'); const graph = sassGraph.parseFile('./src/components/_index.scss'); @@ -48,8 +48,6 @@ function removeImportsFromFile(fileContent) { const lines = fileContent.split(/\r\n|\r|\n/g); return lines - .filter((line) => { - return !line.match(/@import\s/i); - }) + .filter((line) => !line.match(/@import\s/i)) .join('\n'); } diff --git a/scripts/custom_matchers.ts b/scripts/custom_matchers.ts index 92b148e4ae..2cee32ac70 100644 --- a/scripts/custom_matchers.ts +++ b/scripts/custom_matchers.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { matcherErrorMessage } from 'jest-matcher-utils'; import 'jest-extended'; // require to load jest-extended matchers @@ -34,7 +35,7 @@ type MatcherParameters a : never; declare global { - // eslint-disable-next-line + // eslint-disable-next-line @typescript-eslint/no-namespace namespace jest { interface Matchers { /** @@ -52,7 +53,7 @@ function toEqualArrayOf(this: jest.MatcherUtils, received: any[], value: any, le const matcherName = 'toEqualArrayOf'; if (!Array.isArray(received)) { - throw new Error( + throw new TypeError( matcherErrorMessage( this.utils.matcherHint(matcherName), `${this.utils.RECEIVED_COLOR('received')} value must be an array.`, diff --git a/scripts/setup_enzyme.ts b/scripts/setup_enzyme.ts index 530a1d323e..2d7f0276b1 100644 --- a/scripts/setup_enzyme.ts +++ b/scripts/setup_enzyme.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { configure } from 'enzyme'; import Adapter from 'enzyme-adapter-react-16'; diff --git a/src/chart_types/goal_chart/layout/config/config.ts b/src/chart_types/goal_chart/layout/config/config.ts index d2c77fdf0d..17d3def59d 100644 --- a/src/chart_types/goal_chart/layout/config/config.ts +++ b/src/chart_types/goal_chart/layout/config/config.ts @@ -14,11 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { Config } from '../types/config_types'; -import { TAU } from '../../../partition_chart/layout/utils/math'; import { configMap } from '../../../partition_chart/layout/config/config'; +import { TAU } from '../../../partition_chart/layout/utils/math'; +import { Config } from '../types/config_types'; export const configMetadata = { angleStart: { dflt: Math.PI + Math.PI / 4, min: -TAU, max: TAU, type: 'number' }, diff --git a/src/chart_types/goal_chart/layout/types/config_types.ts b/src/chart_types/goal_chart/layout/types/config_types.ts index e7016b0a37..5de186a19f 100644 --- a/src/chart_types/goal_chart/layout/types/config_types.ts +++ b/src/chart_types/goal_chart/layout/types/config_types.ts @@ -14,11 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { Color } from '../../../../utils/commons'; import { Pixels, SizeRatio } from '../../../partition_chart/layout/types/geometry_types'; import { FontFamily } from '../../../partition_chart/layout/types/types'; -import { Color } from '../../../../utils/commons'; // todo switch to `io-ts` style, generic way of combining static and runtime type info export interface Config { diff --git a/src/chart_types/goal_chart/layout/types/viewmodel_types.ts b/src/chart_types/goal_chart/layout/types/viewmodel_types.ts index fec21c9269..a731a55265 100644 --- a/src/chart_types/goal_chart/layout/types/viewmodel_types.ts +++ b/src/chart_types/goal_chart/layout/types/viewmodel_types.ts @@ -14,14 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ - -import { Config } from './config_types'; + * under the License. + */ +import { SpecTypes } from '../../../../specs/settings'; import { Pixels, PointObject } from '../../../partition_chart/layout/types/geometry_types'; +import { BandFillColorAccessorInput, GOAL_SUBTYPES } from '../../specs'; import { config } from '../config/config'; -import { SpecTypes } from '../../../../specs/settings'; -import { BandFillColorAccessorInput, GOAL_SUBTYPES } from '../../specs/index'; +import { Config } from './config_types'; interface BandViewModel { value: number; @@ -85,6 +85,7 @@ export const defaultGoalSpec = { }, tickValueFormatter: ({ value }: BandFillColorAccessorInput) => String(value), labelMajor: ({ base }: BandFillColorAccessorInput) => String(base), + // eslint-disable-next-line no-empty-pattern labelMinor: ({}: BandFillColorAccessorInput) => 'unit', centralMajor: ({ base }: BandFillColorAccessorInput) => String(base), centralMinor: ({ target }: BandFillColorAccessorInput) => String(target), diff --git a/src/chart_types/goal_chart/layout/viewmodel/viewmodel.ts b/src/chart_types/goal_chart/layout/viewmodel/viewmodel.ts index e1a40ebd82..29b4b707d0 100644 --- a/src/chart_types/goal_chart/layout/viewmodel/viewmodel.ts +++ b/src/chart_types/goal_chart/layout/viewmodel/viewmodel.ts @@ -14,12 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { TextMeasure } from '../../../partition_chart/layout/types/types'; +import { GoalSpec } from '../../specs'; import { Config } from '../types/config_types'; import { BulletViewModel, PickFunction, ShapeViewModel } from '../types/viewmodel_types'; -import { GoalSpec } from '../../specs/index'; /** @internal */ export function shapeViewModel(textMeasure: TextMeasure, spec: GoalSpec, config: Config): ShapeViewModel { @@ -33,11 +34,10 @@ export function shapeViewModel(textMeasure: TextMeasure, spec: GoalSpec, config: y: height * margin.top + innerHeight / 2, }; - const pickQuads: PickFunction = (x, y) => { - return -innerWidth / 2 <= x && x <= innerWidth / 2 && -innerHeight / 2 <= y && y <= innerHeight / 2 + const pickQuads: PickFunction = (x, y) => + -innerWidth / 2 <= x && x <= innerWidth / 2 && -innerHeight / 2 <= y && y <= innerHeight / 2 ? [bulletViewModel] : []; - }; const { subtype, diff --git a/src/chart_types/goal_chart/renderer/canvas/canvas_renderers.ts b/src/chart_types/goal_chart/renderer/canvas/canvas_renderers.ts index f50d16d114..d554eb90a1 100644 --- a/src/chart_types/goal_chart/renderer/canvas/canvas_renderers.ts +++ b/src/chart_types/goal_chart/renderer/canvas/canvas_renderers.ts @@ -14,13 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { ShapeViewModel } from '../../layout/types/viewmodel_types'; -import { cssFontShorthand } from '../../../partition_chart/layout/utils/measure'; import { clearCanvas, renderLayers, withContext } from '../../../../renderers/canvas'; import { GOLDEN_RATIO } from '../../../partition_chart/layout/utils/math'; -import { GOAL_SUBTYPES } from '../../specs/index'; +import { cssFontShorthand } from '../../../partition_chart/layout/utils/measure'; +import { ShapeViewModel } from '../../layout/types/viewmodel_types'; +import { GOAL_SUBTYPES } from '../../specs'; // fixme turn these into config, or capitalize as constants const referenceCircularSizeCap = 360; // goal/gauge won't be bigger even if there's ample room: it'd be a waste of space @@ -43,6 +44,7 @@ export function renderCanvas2d( dpr: number, { config, bulletViewModel, chartCenter }: ShapeViewModel, ) { + // eslint-disable-next-line no-empty-pattern const {} = config; withContext(ctx, (ctx) => { @@ -102,12 +104,11 @@ export function renderCanvas2d( const minSize = Math.min(config.width, config.height); - const referenceSize = - Math.min( - circular ? referenceCircularSizeCap : referenceBulletSizeCap, - circular ? minSize : vertical ? config.height : config.width, - ) * - (1 - 2 * marginRatio); + const referenceSize = Math.min( + circular ? referenceCircularSizeCap : referenceBulletSizeCap, + circular ? minSize : (vertical ? config.height : config.width), + ) + * (1 - 2 * marginRatio); const barThickness = Math.min( circular ? baselineArcThickness : baselineBarThickness, @@ -226,120 +227,117 @@ export function renderCanvas2d( // clear the canvas (ctx: CanvasRenderingContext2D) => clearCanvas(ctx, 200000, 200000), - (ctx: CanvasRenderingContext2D) => - withContext(ctx, (ctx) => { - const fullSize = referenceSize; - const labelSize = fullSize / 2; - const pxRangeFrom = -fullSize / 2 + (circular || vertical ? 0 : labelSize); - const pxRangeTo = fullSize / 2 + (!circular && vertical ? -2 * labelFontSize : 0); - const pxRangeMid = (pxRangeFrom + pxRangeTo) / 2; - const pxRange = pxRangeTo - pxRangeFrom; + (ctx: CanvasRenderingContext2D) => withContext(ctx, (ctx) => { + const fullSize = referenceSize; + const labelSize = fullSize / 2; + const pxRangeFrom = -fullSize / 2 + (circular || vertical ? 0 : labelSize); + const pxRangeTo = fullSize / 2 + (!circular && vertical ? -2 * labelFontSize : 0); + const pxRangeMid = (pxRangeFrom + pxRangeTo) / 2; + const pxRange = pxRangeTo - pxRangeFrom; - const domainExtent = domain[1] - domain[0]; + const domainExtent = domain[1] - domain[0]; - const linearScale = (x: number) => pxRangeFrom + (pxRange * (x - domain[0])) / domainExtent; + const linearScale = (x: number) => pxRangeFrom + (pxRange * (x - domain[0])) / domainExtent; - const angleStart = config.angleStart; - const angleEnd = config.angleEnd; - const angleRange = angleEnd - angleStart; - const angleScale = (x: number) => angleStart + (angleRange * (x - domain[0])) / domainExtent; - const clockwise = angleStart > angleEnd; // todo refine this crude approach + const { angleStart, angleEnd } = config; + const angleRange = angleEnd - angleStart; + const angleScale = (x: number) => angleStart + (angleRange * (x - domain[0])) / domainExtent; + const clockwise = angleStart > angleEnd; // todo refine this crude approach - geoms - .slice() - .sort((a, b) => a.order - b.order) - .forEach((g) => { - const landmarks = g.landmarks; - const at = get(landmarks, 'at', ''); - const from = get(landmarks, 'from', ''); - const to = get(landmarks, 'to', ''); - const textAlign = get(g.aes, 'textAlign', ''); - const textBaseline = get(g.aes, 'textBaseline', ''); - const fontShape = get(g.aes, 'fontShape', ''); - const axisNormalOffset = get(g.aes, 'axisNormalOffset', 0); - const axisTangentOffset = get(g.aes, 'axisTangentOffset', 0); - const lineWidth = get(g.aes, 'lineWidth', 0); - const strokeStyle = get(g.aes, 'fillColor', ''); - withContext(ctx, (ctx) => { - ctx.beginPath(); - if (circular) { - if (g.aes.shape === 'line') { - ctx.lineWidth = lineWidth; - ctx.strokeStyle = strokeStyle; - if (at) { - ctx.arc( - pxRangeMid, - 0, - r + axisNormalOffset, - angleScale(data[at].value) + Math.PI / 360, - angleScale(data[at].value) - Math.PI / 360, - true, - ); - } else { - const dataClockwise = data[from].value < data[to].value; - ctx.arc( - pxRangeMid, - 0, - r, - angleScale(data[from].value), - angleScale(data[to].value), - clockwise === dataClockwise, - ); - } - } else if (g.aes.shape === 'text') { - const label = at.slice(0, 5) === 'label'; - const central = at.slice(0, 7) === 'central'; - ctx.textAlign = 'center'; - ctx.textBaseline = label || central ? textBaseline : 'middle'; - ctx.font = cssFontShorthand( - fontShape, - label ? labelFontSize : central ? centralFontSize : tickFontSize, + geoms + .slice() + .sort((a, b) => a.order - b.order) + .forEach(({ landmarks, aes }) => { + const at = get(landmarks, 'at', ''); + const from = get(landmarks, 'from', ''); + const to = get(landmarks, 'to', ''); + const textAlign = get(aes, 'textAlign', ''); + const textBaseline = get(aes, 'textBaseline', ''); + const fontShape = get(aes, 'fontShape', ''); + const axisNormalOffset = get(aes, 'axisNormalOffset', 0); + const axisTangentOffset = get(aes, 'axisTangentOffset', 0); + const lineWidth = get(aes, 'lineWidth', 0); + const strokeStyle = get(aes, 'fillColor', ''); + withContext(ctx, (ctx) => { + ctx.beginPath(); + if (circular) { + if (aes.shape === 'line') { + ctx.lineWidth = lineWidth; + ctx.strokeStyle = strokeStyle; + if (at) { + ctx.arc( + pxRangeMid, + 0, + r + axisNormalOffset, + angleScale(data[at].value) + Math.PI / 360, + angleScale(data[at].value) - Math.PI / 360, + true, + ); + } else { + const dataClockwise = data[from].value < data[to].value; + ctx.arc( + pxRangeMid, + 0, + r, + angleScale(data[from].value), + angleScale(data[to].value), + clockwise === dataClockwise, ); - ctx.scale(1, -1); - const angle = angleScale(data[at].value); - if (label) { - ctx.translate(0, r); - } else if (!central) { - ctx.translate( - (r - GOLDEN_RATIO * barThickness) * Math.cos(angle), - -(r - GOLDEN_RATIO * barThickness) * Math.sin(angle), - ); - } - ctx.fillText(data[at].text, 0, 0); } - } else { - ctx.translate( - vertical ? axisNormalOffset : axisTangentOffset, - vertical ? axisTangentOffset : axisNormalOffset, + } else if (aes.shape === 'text') { + const label = at.slice(0, 5) === 'label'; + const central = at.slice(0, 7) === 'central'; + ctx.textAlign = 'center'; + ctx.textBaseline = label || central ? textBaseline : 'middle'; + ctx.font = cssFontShorthand( + fontShape, + label ? labelFontSize : (central ? centralFontSize : tickFontSize), ); - const atPx = data[at] && linearScale(data[at].value); - if (g.aes.shape === 'line') { - ctx.lineWidth = lineWidth; - ctx.strokeStyle = g.aes.fillColor; - if (at) { - const atFromPx = atPx - 1; - const atToPx = atPx + 1; - ctx.moveTo(vertical ? 0 : atFromPx, vertical ? atFromPx : 0); - ctx.lineTo(vertical ? 0 : atToPx, vertical ? atToPx : 0); - } else { - const fromPx = linearScale(data[from].value); - const toPx = linearScale(data[to].value); - ctx.moveTo(vertical ? 0 : fromPx, vertical ? fromPx : 0); - ctx.lineTo(vertical ? 0 : toPx, vertical ? toPx : 0); - } - } else if (g.aes.shape === 'text') { - ctx.textAlign = textAlign; - ctx.textBaseline = textBaseline; - ctx.font = cssFontShorthand(fontShape, tickFontSize); - ctx.scale(1, -1); - ctx.translate(vertical ? 0 : atPx, vertical ? -atPx : 0); - ctx.fillText(data[at].text, 0, 0); + ctx.scale(1, -1); + const angle = angleScale(data[at].value); + if (label) { + ctx.translate(0, r); + } else if (!central) { + ctx.translate( + (r - GOLDEN_RATIO * barThickness) * Math.cos(angle), + -(r - GOLDEN_RATIO * barThickness) * Math.sin(angle), + ); + } + ctx.fillText(data[at].text, 0, 0); + } + } else { + ctx.translate( + vertical ? axisNormalOffset : axisTangentOffset, + vertical ? axisTangentOffset : axisNormalOffset, + ); + const atPx = data[at] && linearScale(data[at].value); + if (aes.shape === 'line') { + ctx.lineWidth = lineWidth; + ctx.strokeStyle = aes.fillColor; + if (at) { + const atFromPx = atPx - 1; + const atToPx = atPx + 1; + ctx.moveTo(vertical ? 0 : atFromPx, vertical ? atFromPx : 0); + ctx.lineTo(vertical ? 0 : atToPx, vertical ? atToPx : 0); + } else { + const fromPx = linearScale(data[from].value); + const toPx = linearScale(data[to].value); + ctx.moveTo(vertical ? 0 : fromPx, vertical ? fromPx : 0); + ctx.lineTo(vertical ? 0 : toPx, vertical ? toPx : 0); } + } else if (aes.shape === 'text') { + ctx.textAlign = textAlign; + ctx.textBaseline = textBaseline; + ctx.font = cssFontShorthand(fontShape, tickFontSize); + ctx.scale(1, -1); + ctx.translate(vertical ? 0 : atPx, vertical ? -atPx : 0); + ctx.fillText(data[at].text, 0, 0); } - ctx.stroke(); - }); + } + ctx.stroke(); }); - }), + }); + }), ]); }); } diff --git a/src/chart_types/goal_chart/renderer/canvas/connected_component.tsx b/src/chart_types/goal_chart/renderer/canvas/connected_component.tsx index 4dde24c4ad..88849ea4c7 100644 --- a/src/chart_types/goal_chart/renderer/canvas/connected_component.tsx +++ b/src/chart_types/goal_chart/renderer/canvas/connected_component.tsx @@ -14,18 +14,20 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React, { MouseEvent } from 'react'; -import { bindActionCreators, Dispatch } from 'redux'; import { connect } from 'react-redux'; +import { bindActionCreators, Dispatch } from 'redux'; + import { onChartRendered } from '../../../../state/actions/chart'; import { GlobalChartState } from '../../../../state/chart_state'; +import { getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized'; import { Dimensions } from '../../../../utils/dimensions'; -import { geometries } from '../../state/selectors/geometries'; import { BulletViewModel, nullShapeViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types'; +import { geometries } from '../../state/selectors/geometries'; import { renderCanvas2d } from './canvas_renderers'; -import { getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized'; interface ReactiveChartStateProps { initialized: boolean; @@ -45,6 +47,7 @@ class Component extends React.Component { private ctx: CanvasRenderingContext2D | null; // see example https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio#Example private readonly devicePixelRatio: number; // fixme this be no constant: multi-monitor window drag may necessitate modifying the `` dimensions + constructor(props: Readonly) { super(props); this.canvasRef = React.createRef(); @@ -52,21 +55,18 @@ class Component extends React.Component { this.devicePixelRatio = window.devicePixelRatio; } - private drawCanvas() { - if (this.ctx) { - const { width, height }: Dimensions = this.props.chartContainerDimensions; - renderCanvas2d(this.ctx, this.devicePixelRatio, { - ...this.props.geometries, - config: { ...this.props.geometries.config, width, height }, - }); + componentDidMount() { + /* + * the DOM element has just been appended, and getContext('2d') is always non-null, + * so we could use a couple of ! non-null assertions but no big plus + */ + this.tryCanvasContext(); + if (this.props.initialized) { + this.drawCanvas(); + this.props.onChartRendered(); } } - private tryCanvasContext() { - const canvas = this.canvasRef.current; - this.ctx = canvas && canvas.getContext('2d'); - } - componentDidUpdate() { if (!this.ctx) { this.tryCanvasContext(); @@ -77,13 +77,18 @@ class Component extends React.Component { } } - componentDidMount() { - // the DOM element has just been appended, and getContext('2d') is always non-null, - // so we could use a couple of ! non-null assertions but no big plus - this.tryCanvasContext(); - if (this.props.initialized) { - this.drawCanvas(); - this.props.onChartRendered(); + private tryCanvasContext() { + const canvas = this.canvasRef.current; + this.ctx = canvas && canvas.getContext('2d'); + } + + private drawCanvas() { + if (this.ctx) { + const { width, height }: Dimensions = this.props.chartContainerDimensions; + renderCanvas2d(this.ctx, this.devicePixelRatio, { + ...this.props.geometries, + config: { ...this.props.geometries.config, width, height }, + }); } } @@ -97,7 +102,7 @@ class Component extends React.Component { } const picker = this.props.geometries.pickQuads; const box = this.canvasRef.current.getBoundingClientRect(); - const chartCenter = this.props.geometries.chartCenter; + const { chartCenter } = this.props.geometries; const x = e.clientX - box.left - chartCenter.x; const y = e.clientY - box.top - chartCenter.y; const pickedShapes: Array = picker(x, y); diff --git a/src/chart_types/goal_chart/specs/index.ts b/src/chart_types/goal_chart/specs/index.ts index 0471e76a35..07156f5a6f 100644 --- a/src/chart_types/goal_chart/specs/index.ts +++ b/src/chart_types/goal_chart/specs/index.ts @@ -14,16 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { ChartTypes } from '../../index'; -import { config } from '../layout/config/config'; import React from 'react'; + +import { ChartTypes } from '../..'; +import { Spec, SpecTypes } from '../../../specs'; import { getConnect, specComponentFactory } from '../../../state/spec_factory'; -import { Spec, SpecTypes } from '../../../specs/index'; +import { Color, RecursivePartial } from '../../../utils/commons'; +import { config } from '../layout/config/config'; import { Config } from '../layout/types/config_types'; import { defaultGoalSpec } from '../layout/types/viewmodel_types'; -import { Color, RecursivePartial } from '../../../utils/commons'; export const GOAL_SUBTYPES = Object.freeze(['goal', 'horizontalBullet', 'verticalBullet'] as const); export type GoalSubtype = typeof GOAL_SUBTYPES[number]; diff --git a/src/chart_types/goal_chart/state/chart_state.tsx b/src/chart_types/goal_chart/state/chart_state.tsx index ca0329286d..eb974a9881 100644 --- a/src/chart_types/goal_chart/state/chart_state.tsx +++ b/src/chart_types/goal_chart/state/chart_state.tsx @@ -14,21 +14,23 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { InternalChartState, GlobalChartState, BackwardRef } from '../../../state/chart_state'; + import { ChartTypes } from '../..'; -import { Goal } from '../renderer/canvas/connected_component'; -import { isTooltipVisibleSelector } from '../state/selectors/is_tooltip_visible'; -import { getTooltipInfoSelector } from '../state/selectors/tooltip'; -import { Tooltip } from '../../../components/tooltip'; -import { createOnElementClickCaller } from './selectors/on_element_click_caller'; -import { createOnElementOverCaller } from './selectors/on_element_over_caller'; -import { createOnElementOutCaller } from './selectors/on_element_out_caller'; import { LegendItem } from '../../../commons/legend'; +import { Tooltip } from '../../../components/tooltip'; +import { InternalChartState, GlobalChartState, BackwardRef } from '../../../state/chart_state'; import { LegendItemLabel } from '../../../state/selectors/get_legend_items_labels'; +import { Goal } from '../renderer/canvas/connected_component'; import { getSpecOrNull } from './selectors/goal_spec'; +import { isTooltipVisibleSelector } from './selectors/is_tooltip_visible'; +import { createOnElementClickCaller } from './selectors/on_element_click_caller'; +import { createOnElementOutCaller } from './selectors/on_element_out_caller'; +import { createOnElementOverCaller } from './selectors/on_element_over_caller'; +import { getTooltipInfoSelector } from './selectors/tooltip'; const EMPTY_MAP = new Map(); const EMPTY_LEGEND_LIST: LegendItem[] = []; @@ -36,6 +38,8 @@ const EMPTY_LEGEND_ITEM_LIST: LegendItemLabel[] = []; /** @internal */ export class GoalState implements InternalChartState { + chartType = ChartTypes.Goal; + onElementClickCaller: (state: GlobalChartState) => void; onElementOverCaller: (state: GlobalChartState) => void; onElementOutCaller: (state: GlobalChartState) => void; @@ -45,28 +49,35 @@ export class GoalState implements InternalChartState { this.onElementOverCaller = createOnElementOverCaller(); this.onElementOutCaller = createOnElementOutCaller(); } - chartType = ChartTypes.Goal; + isInitialized(globalState: GlobalChartState) { return globalState.specsInitialized && getSpecOrNull(globalState) !== null; } + isBrushAvailable() { return false; } + isBrushing() { return false; } + isChartEmpty() { return false; } + getLegendItems() { return EMPTY_LEGEND_LIST; } + getLegendItemsLabels() { return EMPTY_LEGEND_ITEM_LIST; } + getLegendExtraValues() { return EMPTY_MAP; } + chartRenderer(containerRef: BackwardRef) { return ( <> @@ -75,23 +86,28 @@ export class GoalState implements InternalChartState { ); } + getPointerCursor() { return 'default'; } + isTooltipVisible(globalState: GlobalChartState) { return isTooltipVisibleSelector(globalState); } + getTooltipInfo(globalState: GlobalChartState) { return getTooltipInfoSelector(globalState); } + getTooltipAnchor(state: GlobalChartState) { - const position = state.interactions.pointer.current.position; + const { position } = state.interactions.pointer.current; return { isRotated: false, x1: position.x, y1: position.y, }; } + eventCallbacks(globalState: GlobalChartState) { this.onElementOverCaller(globalState); this.onElementOutCaller(globalState); diff --git a/src/chart_types/goal_chart/state/selectors/geometries.ts b/src/chart_types/goal_chart/state/selectors/geometries.ts index aed3e84276..e7a80ba329 100644 --- a/src/chart_types/goal_chart/state/selectors/geometries.ts +++ b/src/chart_types/goal_chart/state/selectors/geometries.ts @@ -14,16 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + +import { ChartTypes } from '../../..'; +import { SpecTypes } from '../../../../specs/settings'; import { GlobalChartState } from '../../../../state/chart_state'; import { getSpecsFromStore } from '../../../../state/utils'; -import { ChartTypes } from '../../..'; -import { render } from './scenegraph'; import { nullShapeViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types'; -import { GoalSpec } from '../../specs/index'; -import { SpecTypes } from '../../../../specs/settings'; +import { GoalSpec } from '../../specs'; +import { render } from './scenegraph'; const getSpecs = (state: GlobalChartState) => state.specs; diff --git a/src/chart_types/goal_chart/state/selectors/goal_spec.ts b/src/chart_types/goal_chart/state/selectors/goal_spec.ts index 793476cc65..c947226c89 100644 --- a/src/chart_types/goal_chart/state/selectors/goal_spec.ts +++ b/src/chart_types/goal_chart/state/selectors/goal_spec.ts @@ -14,13 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { ChartTypes } from '../../..'; +import { SpecTypes } from '../../../../specs'; import { GlobalChartState } from '../../../../state/chart_state'; import { getSpecsFromStore } from '../../../../state/utils'; import { GoalSpec } from '../../specs'; -import { ChartTypes } from '../../..'; -import { SpecTypes } from '../../../../specs'; /** @internal */ export function getSpecOrNull(state: GlobalChartState): GoalSpec | null { diff --git a/src/chart_types/goal_chart/state/selectors/is_tooltip_visible.ts b/src/chart_types/goal_chart/state/selectors/is_tooltip_visible.ts index ee7cfe3874..d7d67c44ba 100644 --- a/src/chart_types/goal_chart/state/selectors/is_tooltip_visible.ts +++ b/src/chart_types/goal_chart/state/selectors/is_tooltip_visible.ts @@ -14,13 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { TooltipType, getTooltipType } from '../../../../specs'; +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import { getTooltipInfoSelector } from './tooltip'; /** @internal */ diff --git a/src/chart_types/goal_chart/state/selectors/on_element_click_caller.ts b/src/chart_types/goal_chart/state/selectors/on_element_click_caller.ts index 70080c0cd5..31b5b04e83 100644 --- a/src/chart_types/goal_chart/state/selectors/on_element_click_caller.ts +++ b/src/chart_types/goal_chart/state/selectors/on_element_click_caller.ts @@ -14,19 +14,21 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; import { Selector } from 'reselect'; + +import { ChartTypes } from '../../..'; +import { SeriesIdentifier } from '../../../../commons/series_id'; +import { SettingsSpec, LayerValue } from '../../../../specs'; import { GlobalChartState, PointerState } from '../../../../state/chart_state'; +import { getLastClickSelector } from '../../../../state/selectors/get_last_click'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; -import { SettingsSpec, LayerValue } from '../../../../specs'; -import { getPickedShapesLayerValues } from './picked_shapes'; -import { getSpecOrNull } from './goal_spec'; -import { ChartTypes } from '../../..'; import { isClicking } from '../../../../state/utils'; -import { getLastClickSelector } from '../../../../state/selectors/get_last_click'; -import { SeriesIdentifier } from '../../../../commons/series_id'; +import { getSpecOrNull } from './goal_spec'; +import { getPickedShapesLayerValues } from './picked_shapes'; /** * Will call the onElementClick listener every time the following preconditions are met: @@ -52,15 +54,13 @@ export function createOnElementClickCaller(): (state: GlobalChartState) => void const nextPickedShapesLength = pickedShapes.length; if (nextPickedShapesLength > 0 && isClicking(prevClick, lastClick)) { if (settings && settings.onElementClick) { - const elements = pickedShapes.map<[Array, SeriesIdentifier]>((values) => { - return [ - values, - { - specId: spec.id, - key: `spec{${spec.id}}`, - }, - ]; - }); + const elements = pickedShapes.map<[Array, SeriesIdentifier]>((values) => [ + values, + { + specId: spec.id, + key: `spec{${spec.id}}`, + }, + ]); settings.onElementClick(elements); } } diff --git a/src/chart_types/goal_chart/state/selectors/on_element_out_caller.ts b/src/chart_types/goal_chart/state/selectors/on_element_out_caller.ts index c2d4da608f..c86d89fcdc 100644 --- a/src/chart_types/goal_chart/state/selectors/on_element_out_caller.ts +++ b/src/chart_types/goal_chart/state/selectors/on_element_out_caller.ts @@ -14,16 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import createCachedSelector from 're-reselect'; -import { getPickedShapesLayerValues } from './picked_shapes'; -import { getSpecOrNull } from './goal_spec'; -import { GlobalChartState } from '../../../../state/chart_state'; import { Selector } from 'react-redux'; -import { ChartTypes } from '../../../index'; + +import { ChartTypes } from '../../..'; +import { GlobalChartState } from '../../../../state/chart_state'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; +import { getSpecOrNull } from './goal_spec'; +import { getPickedShapesLayerValues } from './picked_shapes'; /** * Will call the onElementOut listener every time the following preconditions are met: diff --git a/src/chart_types/goal_chart/state/selectors/on_element_over_caller.ts b/src/chart_types/goal_chart/state/selectors/on_element_over_caller.ts index 488da5b7af..51bcf7ce50 100644 --- a/src/chart_types/goal_chart/state/selectors/on_element_over_caller.ts +++ b/src/chart_types/goal_chart/state/selectors/on_element_over_caller.ts @@ -14,18 +14,20 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import createCachedSelector from 're-reselect'; +import { Selector } from 'react-redux'; + +import { ChartTypes } from '../../..'; +import { SeriesIdentifier } from '../../../../commons/series_id'; import { LayerValue } from '../../../../specs'; import { GlobalChartState } from '../../../../state/chart_state'; -import { Selector } from 'react-redux'; -import { ChartTypes } from '../../../index'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import { getSpecOrNull } from './goal_spec'; import { getPickedShapesLayerValues } from './picked_shapes'; -import { SeriesIdentifier } from '../../../../commons/series_id'; function isOverElement(prevPickedShapes: Array> = [], nextPickedShapes: Array>) { if (nextPickedShapes.length === 0) { diff --git a/src/chart_types/goal_chart/state/selectors/picked_shapes.ts b/src/chart_types/goal_chart/state/selectors/picked_shapes.ts index 863c4e15ef..5c78e0cabb 100644 --- a/src/chart_types/goal_chart/state/selectors/picked_shapes.ts +++ b/src/chart_types/goal_chart/state/selectors/picked_shapes.ts @@ -14,13 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { geometries } from './geometries'; -import { GlobalChartState } from '../../../../state/chart_state'; + import { LayerValue } from '../../../../specs'; +import { GlobalChartState } from '../../../../state/chart_state'; import { BulletViewModel } from '../../layout/types/viewmodel_types'; +import { geometries } from './geometries'; function getCurrentPointerPosition(state: GlobalChartState) { return state.interactions.pointer.current.position; @@ -31,7 +33,7 @@ export const getPickedShapes = createCachedSelector( [geometries, getCurrentPointerPosition], (geoms, pointerPosition): BulletViewModel[] => { const picker = geoms.pickQuads; - const chartCenter = geoms.chartCenter; + const { chartCenter } = geoms; const x = pointerPosition.x - chartCenter.x; const y = pointerPosition.y - chartCenter.y; return picker(x, y); diff --git a/src/chart_types/goal_chart/state/selectors/scenegraph.ts b/src/chart_types/goal_chart/state/selectors/scenegraph.ts index 869fa96fc4..adc410c3b1 100644 --- a/src/chart_types/goal_chart/state/selectors/scenegraph.ts +++ b/src/chart_types/goal_chart/state/selectors/scenegraph.ts @@ -14,16 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { mergePartial, RecursivePartial } from '../../../../utils/commons'; import { Dimensions } from '../../../../utils/dimensions'; -import { shapeViewModel } from '../../layout/viewmodel/viewmodel'; import { measureText } from '../../../partition_chart/layout/utils/measure'; -import { ShapeViewModel, nullShapeViewModel } from '../../layout/types/viewmodel_types'; -import { GoalSpec } from '../../specs/index'; -import { mergePartial, RecursivePartial } from '../../../../utils/commons'; import { config as defaultConfig } from '../../layout/config/config'; import { Config } from '../../layout/types/config_types'; +import { ShapeViewModel, nullShapeViewModel } from '../../layout/types/viewmodel_types'; +import { shapeViewModel } from '../../layout/viewmodel/viewmodel'; +import { GoalSpec } from '../../specs'; /** @internal */ export function render(spec: GoalSpec, parentDimensions: Dimensions): ShapeViewModel { diff --git a/src/chart_types/goal_chart/state/selectors/tooltip.ts b/src/chart_types/goal_chart/state/selectors/tooltip.ts index e156de7d2c..4a3eab00d2 100644 --- a/src/chart_types/goal_chart/state/selectors/tooltip.ts +++ b/src/chart_types/goal_chart/state/selectors/tooltip.ts @@ -14,9 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + import { TooltipInfo } from '../../../../components/tooltip/types'; import { getSpecOrNull } from './goal_spec'; import { getPickedShapes } from './picked_shapes'; diff --git a/src/chart_types/index.ts b/src/chart_types/index.ts index 8f8cbd0c6e..2727387630 100644 --- a/src/chart_types/index.ts +++ b/src/chart_types/index.ts @@ -14,15 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { $Values } from 'utility-types'; export const ChartTypes = Object.freeze({ - Global: 'global' as 'global', - Goal: 'goal' as 'goal', - Partition: 'partition' as 'partition', - XYAxis: 'xy_axis' as 'xy_axis', + Global: 'global' as const, + Goal: 'goal' as const, + Partition: 'partition' as const, + XYAxis: 'xy_axis' as const, }); export type ChartTypes = $Values; diff --git a/src/chart_types/partition_chart/layout/circline_geometry.ts b/src/chart_types/partition_chart/layout/circline_geometry.ts index 40ec703691..e0d50806a1 100644 --- a/src/chart_types/partition_chart/layout/circline_geometry.ts +++ b/src/chart_types/partition_chart/layout/circline_geometry.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { CirclineArc, @@ -61,9 +62,8 @@ function circlineIntersect(c1: Circline, c2: Circline): PointObject[] { { x: x1, y: y1 }, { x: x2, y: y2 }, ]; - } else { - return []; } + return []; } function circlineValidSectors(refC: CirclinePredicate, c: CirclineArc): CirclineArc[] { diff --git a/src/chart_types/partition_chart/layout/config/config.ts b/src/chart_types/partition_chart/layout/config/config.ts index 5077b99ec6..6c9cdb63bb 100644 --- a/src/chart_types/partition_chart/layout/config/config.ts +++ b/src/chart_types/partition_chart/layout/config/config.ts @@ -14,17 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { Config, PartitionLayout, Numeric } from '../types/config_types'; -import { GOLDEN_RATIO, TAU } from '../utils/math'; import { FONT_STYLES, FONT_VARIANTS } from '../types/types'; import { ShapeTreeNode } from '../types/viewmodel_types'; import { AGGREGATE_KEY, STATISTICS_KEY } from '../utils/group_by_rollup'; +import { GOLDEN_RATIO, TAU } from '../utils/math'; const log10 = Math.log(10); function significantDigitCount(d: number): number { - let n = Math.abs(parseFloat(String(d).replace('.', ''))); //remove decimal and make positive + let n = Math.abs(parseFloat(String(d).replace('.', ''))); // remove decimal and make positive if (n == 0) return 0; while (n != 0 && n % 10 == 0) n /= 10; return Math.floor(Math.log(n) / log10) + 1; @@ -49,10 +50,10 @@ function defaultFormatter(d: number): string { return Math.abs(d) >= 10000000 || Math.abs(d) < 0.001 ? d.toExponential(Math.min(2, Math.max(0, significantDigitCount(d) - 1))) : d.toLocaleString(void 0, { - maximumSignificantDigits: 4, - maximumFractionDigits: 3, - useGrouping: true, - }); + maximumSignificantDigits: 4, + maximumFractionDigits: 3, + useGrouping: true, + }); } export function percentFormatter(d: number): string { @@ -82,12 +83,12 @@ const valueFont = { type: 'group', values: { /* - // Object.assign interprets the extant `undefined` as legit, so commenting it out till moving away from Object.assign in `const valueFont = ...` - fontFamily: { - dflt: undefined, - type: 'string', - }, - */ + * Object.assign interprets the extant `undefined` as legit, so commenting it out till moving away from Object.assign in `const valueFont = ...` + * fontFamily: { + * dflt: undefined, + * type: 'string', + * }, + */ fontWeight: fontSettings.fontWeight, fontStyle: fontSettings.fontStyle, fontVariant: fontSettings.fontVariant, @@ -161,8 +162,8 @@ export const configMetadata = { }, // fill text layout config - circlePadding: { dflt: 2, min: 0, max: 8, type: 'number' }, - radialPadding: { dflt: TAU / 360, min: 0.0, max: 0.035, type: 'number' }, + circlePadding: { dflt: 2, min: 0.0, max: 8, type: 'number' }, + radialPadding: { dflt: TAU / 360, min: 0, max: 0.035, type: 'number' }, horizontalTextAngleThreshold: { dflt: TAU / 12, min: 0, max: TAU, type: 'number' }, horizontalTextEnforcer: { dflt: 1, min: 0, max: 1, type: 'number' }, maxRowCount: { dflt: 12, min: 1, max: 16, type: 'number' }, @@ -249,15 +250,14 @@ export const configMetadata = { }; // todo switch to `io-ts` style, generic way of combining static and runtime type info -export function configMap(mapper: Function, configMetadata: any): Conf { +export function configMap(mapper: (v: any) => any, configMetadata: any): Conf { const result: Conf = Object.assign( {}, ...Object.entries(configMetadata).map(([k, v]: [string, any]) => { if (v.type === 'group') { return { [k]: configMap(mapper, v.values) }; - } else { - return { [k]: mapper(v) }; } + return { [k]: mapper(v) }; }), ) as Conf; return result; diff --git a/src/chart_types/partition_chart/layout/geometry.ts b/src/chart_types/partition_chart/layout/geometry.ts index 9a632899de..dd383093c9 100644 --- a/src/chart_types/partition_chart/layout/geometry.ts +++ b/src/chart_types/partition_chart/layout/geometry.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { Radian } from './types/geometry_types'; import { TAU } from './utils/math'; diff --git a/src/chart_types/partition_chart/layout/types/config_types.ts b/src/chart_types/partition_chart/layout/types/config_types.ts index f917061542..efdd2fbabe 100644 --- a/src/chart_types/partition_chart/layout/types/config_types.ts +++ b/src/chart_types/partition_chart/layout/types/config_types.ts @@ -14,17 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { Distance, Pixels, Radian, Radius, Ratio, SizeRatio, TimeMs } from './geometry_types'; -import { Font, FontFamily, PartialFont } from './types'; import { $Values as Values } from 'utility-types'; + import { Color, StrokeStyle, ValueFormatter } from '../../../../utils/commons'; import { PerSideDistance } from '../../../../utils/dimensions'; +import { Distance, Pixels, Radian, Radius, Ratio, SizeRatio, TimeMs } from './geometry_types'; +import { Font, FontFamily, PartialFont } from './types'; export const PartitionLayout = Object.freeze({ - sunburst: 'sunburst' as 'sunburst', - treemap: 'treemap' as 'treemap', + sunburst: 'sunburst' as const, + treemap: 'treemap' as const, }); export type PartitionLayout = Values; // could use ValuesType @@ -65,9 +67,11 @@ export interface FillFontSizeRange { minFontSize: Pixels; maxFontSize: Pixels; idealFontSizeJump: Ratio; - /** When `maximizeFontSize` is false (the default), text font will not be larger than font sizes in larger sectors/rectangles in the same pie chart, + /** + * When `maximizeFontSize` is false (the default), text font will not be larger than font sizes in larger sectors/rectangles in the same pie chart, * sunburst ring or treemap layer. When it is set to true, the largest font, not exceeding `maxFontSize`, that fits in the slice/sector/rectangle - * will be chosen for easier text readability, irrespective of the value. **/ + * will be chosen for easier text readability, irrespective of the value. + */ maximizeFontSize: boolean; } diff --git a/src/chart_types/partition_chart/layout/types/geometry_types.ts b/src/chart_types/partition_chart/layout/types/geometry_types.ts index 724a8db269..6f4e79c0ea 100644 --- a/src/chart_types/partition_chart/layout/types/geometry_types.ts +++ b/src/chart_types/partition_chart/layout/types/geometry_types.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ // In preparation of nominal types in future TS versions // https://github.com/microsoft/TypeScript/pull/33038 diff --git a/src/chart_types/partition_chart/layout/types/types.ts b/src/chart_types/partition_chart/layout/types/types.ts index 23077836ae..31cbb7582d 100644 --- a/src/chart_types/partition_chart/layout/types/types.ts +++ b/src/chart_types/partition_chart/layout/types/types.ts @@ -14,26 +14,24 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { ArrayEntry } from '../utils/group_by_rollup'; import { Datum } from '../../../../utils/commons'; +import { ArrayEntry } from '../utils/group_by_rollup'; export const FONT_VARIANTS = Object.freeze(['normal', 'small-caps'] as const); export type FontVariant = typeof FONT_VARIANTS[number]; -// prettier-ignore -export const FONT_WEIGHTS = Object.freeze([ - 100, 200, 300, 400, 500, 600, 700, 800, 900, - 'normal', 'bold', 'lighter', 'bolder', 'inherit', 'initial', 'unset', -] as const); +export const FONT_WEIGHTS = Object.freeze([100, 200, 300, 400, 500, 600, 700, 800, 900, 'normal', 'bold', 'lighter', 'bolder', 'inherit', 'initial', 'unset'] as const); export type FontWeight = typeof FONT_WEIGHTS[number]; export type NumericFontWeight = number & typeof FONT_WEIGHTS[number]; export const FONT_STYLES = Object.freeze(['normal', 'italic', 'oblique', 'inherit', 'initial', 'unset'] as const); export type FontStyle = typeof FONT_STYLES[number]; -/** todo consider doing tighter control for permissible font families, eg. as in Kibana Canvas - expression language +/** + * todo consider doing tighter control for permissible font families, eg. as in Kibana Canvas - expression language * - though the same applies for permissible (eg. known available or loaded) font weights, styles, variants... */ export type FontFamily = string; diff --git a/src/chart_types/partition_chart/layout/types/viewmodel_types.ts b/src/chart_types/partition_chart/layout/types/viewmodel_types.ts index df11d5e8b7..6329bf1c23 100644 --- a/src/chart_types/partition_chart/layout/types/viewmodel_types.ts +++ b/src/chart_types/partition_chart/layout/types/viewmodel_types.ts @@ -14,16 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { Config } from './config_types'; -import { Coordinate, Distance, Pixels, PointObject, PointTuple, PointTuples, Radian } from './geometry_types'; -import { Font } from './types'; +import { Color } from '../../../../utils/commons'; import { config, ValueGetterName } from '../config/config'; import { ArrayNode, HierarchyOfArrays } from '../utils/group_by_rollup'; -import { Color } from '../../../../utils/commons'; import { LinkLabelsViewModelSpec } from '../viewmodel/link_text_layout'; import { VerticalAlignments } from '../viewmodel/viewmodel'; +import { Config } from './config_types'; +import { Coordinate, Distance, Pixels, PointObject, PointTuple, PointTuples, Radian } from './geometry_types'; +import { Font } from './types'; /** @internal */ export type LinkLabelVM = { diff --git a/src/chart_types/partition_chart/layout/utils/__mocks__/calcs.ts b/src/chart_types/partition_chart/layout/utils/__mocks__/calcs.ts index 1c63308a69..da6ef5586b 100644 --- a/src/chart_types/partition_chart/layout/utils/__mocks__/calcs.ts +++ b/src/chart_types/partition_chart/layout/utils/__mocks__/calcs.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ const module = jest.requireActual('../calcs.ts'); export const getBackgroundWithContainerColorFromUser = jest.fn(module.getBackgroundWithContainerColorFromUser); diff --git a/src/chart_types/partition_chart/layout/utils/__mocks__/color_library_wrappers.ts b/src/chart_types/partition_chart/layout/utils/__mocks__/color_library_wrappers.ts index f2377d65fd..b176160140 100644 --- a/src/chart_types/partition_chart/layout/utils/__mocks__/color_library_wrappers.ts +++ b/src/chart_types/partition_chart/layout/utils/__mocks__/color_library_wrappers.ts @@ -14,13 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ const module = jest.requireActual('../color_library_wrappers.ts'); -export const defaultColor = module.defaultColor; -export const transparentColor = module.transparentColor; -export const defaultD3Color = module.defaultD3Color; +export const { defaultColor, transparentColor, defaultD3Color } = module; export const stringToRGB = jest.fn(module.stringToRGB); export const validateColor = jest.fn(module.validateColor); diff --git a/src/chart_types/partition_chart/layout/utils/__mocks__/fill_text_layout.ts b/src/chart_types/partition_chart/layout/utils/__mocks__/fill_text_layout.ts index b9c06ef048..45c664fcde 100644 --- a/src/chart_types/partition_chart/layout/utils/__mocks__/fill_text_layout.ts +++ b/src/chart_types/partition_chart/layout/utils/__mocks__/fill_text_layout.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ const module = jest.requireActual('../../viewmodel/fill_text_layout.ts'); export const getTextColorIfTextInvertible = jest.fn(module.getTextColorIfTextInvertible); diff --git a/src/chart_types/partition_chart/layout/utils/__mocks__/link_text_layout.ts b/src/chart_types/partition_chart/layout/utils/__mocks__/link_text_layout.ts index 7daab9b69c..60abd7fc3c 100644 --- a/src/chart_types/partition_chart/layout/utils/__mocks__/link_text_layout.ts +++ b/src/chart_types/partition_chart/layout/utils/__mocks__/link_text_layout.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ const module = jest.requireActual('../../link_text_layout.ts'); export const linkTextLayout = jest.fn(module.linkTextLayout); diff --git a/src/chart_types/partition_chart/layout/utils/calcs.test.ts b/src/chart_types/partition_chart/layout/utils/calcs.test.ts index 7a8efef983..8e96931c3b 100644 --- a/src/chart_types/partition_chart/layout/utils/calcs.test.ts +++ b/src/chart_types/partition_chart/layout/utils/calcs.test.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { makeHighContrastColor, combineColors, integerSnap, monotonicHillClimb } from './calcs'; @@ -59,7 +60,7 @@ describe('calcs', () => { const resultForCombined = 'rgba(161, 158, 201, 1)'; // 0.3 'rgba(215, 213, 232, 1)'; // 0.5 - 'rgba(188, 186, 217, 1)'; //0.7 - ; expect(combineColors(background, containerBackground)).toBe(resultForCombined); const foreground = 'white'; - const resultForContrastedText = '#000'; //switches to black text + const resultForContrastedText = '#000'; // switches to black text expect(makeHighContrastColor(foreground, resultForCombined)).toBe(resultForContrastedText); }); }); diff --git a/src/chart_types/partition_chart/layout/utils/calcs.ts b/src/chart_types/partition_chart/layout/utils/calcs.ts index f686112a14..e0739b7687 100644 --- a/src/chart_types/partition_chart/layout/utils/calcs.ts +++ b/src/chart_types/partition_chart/layout/utils/calcs.ts @@ -14,13 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { Ratio } from '../types/geometry_types'; -import { RgbTuple, RGBATupleToString, stringToRGB } from './color_library_wrappers'; -import { Color } from '../../../../utils/commons'; import chroma from 'chroma-js'; + +import { Color } from '../../../../utils/commons'; import { TextContrast } from '../types/config_types'; +import { Ratio } from '../types/geometry_types'; +import { RgbTuple, RGBATupleToString, stringToRGB } from './color_library_wrappers'; /** @internal */ export function hueInterpolator(colors: RgbTuple[]) { @@ -37,16 +39,14 @@ export function addOpacity(hexColorString: string, opacity: Ratio) { // todo roll some proper utility that can handle "rgb(...)", "rgba(...)", "red", {r, g, b} etc. return opacity === 1 ? hexColorString - : hexColorString.slice(0, 7) + - (hexColorString.slice(7).length === 0 || parseInt(hexColorString.slice(7, 2), 16) === 255 - ? `00${Math.round(opacity * 255).toString(16)}`.substr(-2) // color was of full opacity - : `00${Math.round((parseInt(hexColorString.slice(7, 2), 16) / 255) * opacity * 255).toString(16)}`.substr( - -2, - )); + : hexColorString.slice(0, 7) + + (hexColorString.slice(7).length === 0 || parseInt(hexColorString.slice(7, 2), 16) === 255 + ? `00${Math.round(opacity * 255).toString(16)}`.slice(-2) // color was of full opacity + : `00${Math.round((parseInt(hexColorString.slice(7, 2), 16) / 255) * opacity * 255).toString(16)}`.slice(-2)); } /** @internal */ -export function arrayToLookup(keyFun: Function, array: Array) { +export function arrayToLookup(keyFun: (v: any) => any, array: Array) { return Object.assign({}, ...array.map((d) => ({ [keyFun(d)]: d }))); } @@ -161,21 +161,21 @@ export function getTextColorIfTextInvertible( const { r: tr, g: tg, b: tb, opacity: to } = stringToRGB(textColor); if (!textContrast) { return inverseForContrast - ? to === undefined - ? `rgb(${255 - tr}, ${255 - tg}, ${255 - tb})` - : `rgba(${255 - tr}, ${255 - tg}, ${255 - tb}, ${to})` + ? (to === undefined + ? `rgb(${255 - tr}, ${255 - tg}, ${255 - tb})` + : `rgba(${255 - tr}, ${255 - tg}, ${255 - tb}, ${to})`) : textColor; - } else if (textContrast === true && typeof textContrast !== 'number') { + } if (textContrast === true && typeof textContrast !== 'number') { return inverseForContrast - ? to === undefined - ? makeHighContrastColor(`rgb(${255 - tr}, ${255 - tg}, ${255 - tb})`, backgroundColor) - : makeHighContrastColor(`rgba(${255 - tr}, ${255 - tg}, ${255 - tb}, ${to})`, backgroundColor) + ? (to === undefined + ? makeHighContrastColor(`rgb(${255 - tr}, ${255 - tg}, ${255 - tb})`, backgroundColor) + : makeHighContrastColor(`rgba(${255 - tr}, ${255 - tg}, ${255 - tb}, ${to})`, backgroundColor)) : makeHighContrastColor(textColor, backgroundColor); - } else if (typeof textContrast === 'number') { + } if (typeof textContrast === 'number') { return inverseForContrast - ? to === undefined - ? makeHighContrastColor(`rgb(${255 - tr}, ${255 - tg}, ${255 - tb})`, backgroundColor, textContrast) - : makeHighContrastColor(`rgba(${255 - tr}, ${255 - tg}, ${255 - tb}, ${to})`, backgroundColor, textContrast) + ? (to === undefined + ? makeHighContrastColor(`rgb(${255 - tr}, ${255 - tg}, ${255 - tb})`, backgroundColor, textContrast) + : makeHighContrastColor(`rgba(${255 - tr}, ${255 - tg}, ${255 - tb}, ${to})`, backgroundColor, textContrast)) : makeHighContrastColor(textColor, backgroundColor, textContrast); } } diff --git a/src/chart_types/partition_chart/layout/utils/color_library_wrappers.test.ts b/src/chart_types/partition_chart/layout/utils/color_library_wrappers.test.ts index 88093c95f0..bccfbf46a9 100644 --- a/src/chart_types/partition_chart/layout/utils/color_library_wrappers.test.ts +++ b/src/chart_types/partition_chart/layout/utils/color_library_wrappers.test.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { stringToRGB, diff --git a/src/chart_types/partition_chart/layout/utils/color_library_wrappers.ts b/src/chart_types/partition_chart/layout/utils/color_library_wrappers.ts index b2cb0c0762..5c677eb15a 100644 --- a/src/chart_types/partition_chart/layout/utils/color_library_wrappers.ts +++ b/src/chart_types/partition_chart/layout/utils/color_library_wrappers.ts @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import chroma from 'chroma-js'; import { rgb as d3Rgb, RGBColor as D3RGBColor } from 'd3-color'; + import { Color } from '../../../../utils/commons'; -import chroma from 'chroma-js'; type RGB = number; type A = number; diff --git a/src/chart_types/partition_chart/layout/utils/group_by_rollup.ts b/src/chart_types/partition_chart/layout/utils/group_by_rollup.ts index 37f78e7816..388349cbd7 100644 --- a/src/chart_types/partition_chart/layout/utils/group_by_rollup.ts +++ b/src/chart_types/partition_chart/layout/utils/group_by_rollup.ts @@ -14,10 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { Relation } from '../types/types'; import { Datum } from '../../../../utils/commons'; +import { Relation } from '../types/types'; export const AGGREGATE_KEY = 'value'; export const STATISTICS_KEY = 'statistics'; @@ -80,13 +81,13 @@ const descending: Sorter = (a, b) => b - a; /** @internal */ export function groupByRollup( keyAccessors: Array<((a: Datum) => Key) | ((a: Datum, i: number) => Key)>, - valueAccessor: Function, + valueAccessor: (v: any) => any, { reducer, identity, }: { reducer: (prev: number, next: number) => number; - identity: Function; + identity: () => any; }, factTable: Relation, ): HierarchyOfMaps { @@ -171,7 +172,7 @@ export function mapEntryValue(entry: ArrayEntry) { } /** @internal */ -export function aggregateComparator(accessor: Function, sorter: Sorter): NodeSorter { +export function aggregateComparator(accessor: (v: any) => any, sorter: Sorter): NodeSorter { return (a, b) => sorter(accessor(a), accessor(b)); } @@ -181,10 +182,8 @@ export const childOrders = { descending, }; -/* -type MeanReduction = { sum: number; count: number }; -type MedianReduction = Array; -*/ +// type MeanReduction = { sum: number; count: number }; +// type MedianReduction = Array; /** @internal */ export const aggregators = { @@ -216,29 +215,28 @@ export const aggregators = { identity: () => 0, reducer: (r: number, n: number) => Math.max(r, n), }, - /* // todo more TS typing is needed to use these - mean: { - identity: (): MeanReduction => ({ sum: 0, count: 0 }), - reducer: (r: MeanReduction, n: number) => { - r.sum += n; - r.count++; - return r; - }, - finalizer: (r: MeanReduction): number => r.sum / r.count, - }, - median: { - identity: (): MedianReduction => [], - reducer: (r: MedianReduction, n: number) => { - r.push(n); - return r; - }, - finalizer: (r: MedianReduction): number => { - const sorted = r.sort(ascending); - const len = r.length; - const even = len === len % 2; - const half = len / 2; - return even ? (sorted[half - 1] + sorted[half]) / 2 : sorted[half - 0.5]; - }, - }, -*/ + // todo more TS typing is needed to use these + // mean: { + // identity: (): MeanReduction => ({ sum: 0, count: 0 }), + // reducer: (r: MeanReduction, n: number) => { + // r.sum += n; + // r.count++; + // return r; + // }, + // finalizer: (r: MeanReduction): number => r.sum / r.count, + // }, + // median: { + // identity: (): MedianReduction => [], + // reducer: (r: MedianReduction, n: number) => { + // r.push(n); + // return r; + // }, + // finalizer: (r: MedianReduction): number => { + // const sorted = r.sort(ascending); + // const len = r.length; + // const even = len === len % 2; + // const half = len / 2; + // return even ? (sorted[half - 1] + sorted[half]) / 2 : sorted[half - 0.5]; + // }, + // }, }; diff --git a/src/chart_types/partition_chart/layout/utils/math.ts b/src/chart_types/partition_chart/layout/utils/math.ts index 5b1627e078..f1145a466c 100644 --- a/src/chart_types/partition_chart/layout/utils/math.ts +++ b/src/chart_types/partition_chart/layout/utils/math.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { wrapToTau } from '../geometry'; diff --git a/src/chart_types/partition_chart/layout/utils/measure.ts b/src/chart_types/partition_chart/layout/utils/measure.ts index f12e2363f7..43815b37d6 100644 --- a/src/chart_types/partition_chart/layout/utils/measure.ts +++ b/src/chart_types/partition_chart/layout/utils/measure.ts @@ -14,10 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { Box, Font, TextMeasure } from '../types/types'; import { Pixels } from '../types/geometry_types'; +import { Box, Font, TextMeasure } from '../types/types'; /** @internal */ export function cssFontShorthand({ fontStyle, fontVariant, fontWeight, fontFamily }: Font, fontSize: Pixels) { diff --git a/src/chart_types/partition_chart/layout/utils/sunburst.ts b/src/chart_types/partition_chart/layout/utils/sunburst.ts index 728ca0d036..fc4415410c 100644 --- a/src/chart_types/partition_chart/layout/utils/sunburst.ts +++ b/src/chart_types/partition_chart/layout/utils/sunburst.ts @@ -14,10 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { ArrayEntry, childrenAccessor, HierarchyOfArrays } from './group_by_rollup'; import { Origin, Part } from '../types/types'; +import { ArrayEntry, childrenAccessor, HierarchyOfArrays } from './group_by_rollup'; /** @internal */ export function sunburst( diff --git a/src/chart_types/partition_chart/layout/utils/treemap.ts b/src/chart_types/partition_chart/layout/utils/treemap.ts index b3ea543ab8..38c8734b2d 100644 --- a/src/chart_types/partition_chart/layout/utils/treemap.ts +++ b/src/chart_types/partition_chart/layout/utils/treemap.ts @@ -14,12 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { ArrayEntry, CHILDREN_KEY, entryValue, HierarchyOfArrays } from './group_by_rollup'; +import { Pixels } from '../types/geometry_types'; import { Part } from '../types/types'; +import { ArrayEntry, CHILDREN_KEY, entryValue, HierarchyOfArrays } from './group_by_rollup'; import { GOLDEN_RATIO } from './math'; -import { Pixels } from '../types/geometry_types'; const MAX_U_PADDING_RATIO = 0.0256197; // this limits area distortion to <10% (which occurs due to pixel padding) with very small rectangles const MAX_TOP_PADDING_RATIO = 0.33; // this limits further area distortion to ~33% @@ -108,7 +109,7 @@ export function treemap( const independentSize = vertical ? width : height; const vectorElements = bestVector(nodes, independentSize, areaAccessor); const vector = vectorNodeCoordinates(vectorElements, x0, y0, vertical); - const dependentSize = vectorElements.dependentSize; + const { dependentSize } = vectorElements; return vector .concat( ...vector.map(({ node, x0, y0, x1, y1 }) => { diff --git a/src/chart_types/partition_chart/layout/viewmodel/fill_text_layout.test.ts b/src/chart_types/partition_chart/layout/viewmodel/fill_text_layout.test.ts index 85f35f9d4a..dfcb853ad2 100644 --- a/src/chart_types/partition_chart/layout/viewmodel/fill_text_layout.test.ts +++ b/src/chart_types/partition_chart/layout/viewmodel/fill_text_layout.test.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { getRectangleRowGeometry, getFillTextColor } from './fill_text_layout'; @@ -26,7 +27,7 @@ describe('Test that getRectangleRowGeometry works with:', () => { const linePitch = 50; const rowIndex = 0; const fontSize = 50; - const _rotation = 0; + const rotation = 0; const verticalAlignment = 'top'; const defaultPadding = 2; @@ -42,7 +43,7 @@ describe('Test that getRectangleRowGeometry works with:', () => { linePitch, rowIndex, fontSize, - _rotation, + rotation, verticalAlignment, padding, ); @@ -64,7 +65,7 @@ describe('Test that getRectangleRowGeometry works with:', () => { linePitch, rowIndex, fontSize, - _rotation, + rotation, verticalAlignment, padding, ); @@ -86,7 +87,7 @@ describe('Test that getRectangleRowGeometry works with:', () => { linePitch, rowIndex, fontSize, - _rotation, + rotation, verticalAlignment, padding, ); @@ -108,7 +109,7 @@ describe('Test that getRectangleRowGeometry works with:', () => { linePitch, rowIndex, fontSize, - _rotation, + rotation, verticalAlignment, padding, ); @@ -130,7 +131,7 @@ describe('Test that getRectangleRowGeometry works with:', () => { linePitch, rowIndex, fontSize, - _rotation, + rotation, verticalAlignment, padding, ); @@ -152,7 +153,7 @@ describe('Test that getRectangleRowGeometry works with:', () => { linePitch, rowIndex, fontSize, - _rotation, + rotation, verticalAlignment, padding, ); @@ -174,7 +175,7 @@ describe('Test that getRectangleRowGeometry works with:', () => { linePitch, rowIndex, fontSize, - _rotation, + rotation, verticalAlignment, padding, ); @@ -201,7 +202,7 @@ describe('Test that getRectangleRowGeometry works with:', () => { smallLinePitch, rowIndex, smallFontSize, - _rotation, + rotation, verticalAlignment, padding, ); @@ -227,7 +228,7 @@ describe('Test that getRectangleRowGeometry works with:', () => { smallLinePitch, rowIndex, smallFontSize, - _rotation, + rotation, verticalAlignment, padding, ); @@ -253,7 +254,7 @@ describe('Test that getRectangleRowGeometry works with:', () => { smallLinePitch, rowIndex, smallFontSize, - _rotation, + rotation, 'bottom', padding, ); @@ -263,10 +264,10 @@ describe('Test that getRectangleRowGeometry works with:', () => { rowAnchorX: 0, rowAnchorY: -( ( - 100 /*y1*/ - - smallLinePitch * (totalRowCount2 - 1 - rowIndex) - - padding.bottom - - smallFontSize * 0.05 + 100 + - smallLinePitch * (totalRowCount2 - 1 - rowIndex) + - padding.bottom + - smallFontSize * 0.05 ) /* 0.05 = 5%: default overhang multiplier */ ), }); diff --git a/src/chart_types/partition_chart/layout/viewmodel/fill_text_layout.ts b/src/chart_types/partition_chart/layout/viewmodel/fill_text_layout.ts index 5da3d83be6..5d5ccad5e3 100644 --- a/src/chart_types/partition_chart/layout/viewmodel/fill_text_layout.ts +++ b/src/chart_types/partition_chart/layout/viewmodel/fill_text_layout.ts @@ -14,9 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { ValueFormatter, Color } from '../../../../utils/commons'; +import { Layer } from '../../specs'; +import { conjunctiveConstraint } from '../circline_geometry'; import { wrapToTau } from '../geometry'; +import { Config, Padding, TextContrast } from '../types/config_types'; import { Coordinate, Distance, @@ -27,8 +32,7 @@ import { RingSectorConstruction, PointTuple, } from '../types/geometry_types'; -import { Config, Padding, TextContrast } from '../types/config_types'; -import { logarithm, TAU, trueBearingToStandardPositionAngle } from '../utils/math'; +import { Box, Font, PartialFont, TextMeasure } from '../types/types'; import { QuadViewModel, RawTextGetter, @@ -38,9 +42,6 @@ import { ShapeTreeNode, ValueGetterFunction, } from '../types/viewmodel_types'; -import { Box, Font, PartialFont, TextMeasure } from '../types/types'; -import { conjunctiveConstraint } from '../circline_geometry'; -import { Layer } from '../../specs/index'; import { combineColors, makeHighContrastColor, @@ -49,8 +50,8 @@ import { integerSnap, monotonicHillClimb, } from '../utils/calcs'; -import { ValueFormatter, Color } from '../../../../utils/commons'; import { RGBATupleToString } from '../utils/color_library_wrappers'; +import { logarithm, TAU, trueBearingToStandardPositionAngle } from '../utils/math'; import { RectangleConstruction, VerticalAlignments } from './viewmodel'; const INFINITY_RADIUS = 1e4; // far enough for a sub-2px precision on a 4k screen, good enough for text bounds; 64 bit floats still work well with it @@ -64,10 +65,10 @@ function ringSectorEndAngle(d: ShapeTreeNode): Radian { } function ringSectorInnerRadius(innerRadius: Radian, ringThickness: Distance) { - return (d: ShapeTreeNode): Radius => innerRadius + (d.y0 as number) * ringThickness; + return (d: ShapeTreeNode): Radius => innerRadius + d.y0 * ringThickness; } function ringSectorOuterRadius(innerRadius: Radian, ringThickness: Distance) { - return (d: ShapeTreeNode): Radius => innerRadius + ((d.y0 as number) + 1) * ringThickness; + return (d: ShapeTreeNode): Radius => innerRadius + (d.y0 + 1) * ringThickness; } function angleToCircline( @@ -123,15 +124,14 @@ export function ringSectorConstruction(config: Config, innerRadius: Radius, ring outerCircline, ...(fullCircle ? [] : [sectorStartCircle, sectorEndCircle]), ]; - const rectangleCirclines = - outerRadiusFromRectangleWidth === Infinity && outerRadiusFromRectanglHeight === Infinity - ? [] - : [ - { x: INFINITY_RADIUS - outerRadiusFromRectangleWidth, y: 0, r: INFINITY_RADIUS, inside: true }, - { x: -INFINITY_RADIUS + outerRadiusFromRectangleWidth, y: 0, r: INFINITY_RADIUS, inside: true }, - { x: 0, y: INFINITY_RADIUS - outerRadiusFromRectanglHeight, r: INFINITY_RADIUS, inside: true }, - { x: 0, y: -INFINITY_RADIUS + outerRadiusFromRectanglHeight, r: INFINITY_RADIUS, inside: true }, - ]; + const rectangleCirclines = outerRadiusFromRectangleWidth === Infinity && outerRadiusFromRectanglHeight === Infinity + ? [] + : [ + { x: INFINITY_RADIUS - outerRadiusFromRectangleWidth, y: 0, r: INFINITY_RADIUS, inside: true }, + { x: -INFINITY_RADIUS + outerRadiusFromRectangleWidth, y: 0, r: INFINITY_RADIUS, inside: true }, + { x: 0, y: INFINITY_RADIUS - outerRadiusFromRectanglHeight, r: INFINITY_RADIUS, inside: true }, + { x: 0, y: -INFINITY_RADIUS + outerRadiusFromRectanglHeight, r: INFINITY_RADIUS, inside: true }, + ]; return [...sectorCirclines, ...rectangleCirclines]; }; } @@ -164,19 +164,17 @@ export const getSectorRowGeometry: GetShapeRowGeometry = fontSize, rotation, ) => { - // prettier-ignore - const offset = - (totalRowCount / 2) * fontSize + const offset = (totalRowCount / 2) * fontSize + fontSize / 2 - - linePitch * rowIndex + - linePitch * rowIndex; const topCircline = makeRowCircline(cx, cy, offset, rotation, fontSize, 1); const bottomCircline = makeRowCircline(cx, cy, offset, rotation, fontSize, -1); const midCircline = makeRowCircline(cx, cy, offset, rotation, 0, 0); - const valid1 = conjunctiveConstraint(ringSector, Object.assign({}, topCircline, { from: 0, to: TAU }))[0]; + const valid1 = conjunctiveConstraint(ringSector, { ...topCircline, from: 0, to: TAU })[0]; if (!valid1) return { rowAnchorX: cx, rowAnchorY: cy, maximumRowLength: 0 }; - const valid2 = conjunctiveConstraint(ringSector, Object.assign({}, bottomCircline, { from: 0, to: TAU }))[0]; + const valid2 = conjunctiveConstraint(ringSector, { ...bottomCircline, from: 0, to: TAU })[0]; if (!valid2) return { rowAnchorX: cx, rowAnchorY: cy, maximumRowLength: 0 }; const from = Math.max(valid1.from, valid2.from); const to = Math.min(valid1.to, valid2.to); @@ -223,13 +221,12 @@ export const getRectangleRowGeometry: GetShapeRowGeometry padding, ) => { const defaultPad: Pixels = 2; - const { top, right, bottom, left } = - typeof padding === 'number' - ? { top: padding, right: padding, bottom: padding, left: padding } - : { - ...{ top: defaultPad, right: defaultPad, bottom: defaultPad, left: defaultPad }, - ...padding, - }; + const { top, right, bottom, left } = typeof padding === 'number' + ? { top: padding, right: padding, bottom: padding, left: padding } + : { + ...{ top: defaultPad, right: defaultPad, bottom: defaultPad, left: defaultPad }, + ...padding, + }; const overhang = 0.05; const topPaddingAdjustment = fontSize < 6 ? 0 : Math.max(1, Math.min(2, fontSize / 16)); @@ -261,8 +258,8 @@ export const getRectangleRowGeometry: GetShapeRowGeometry function rowSetComplete(rowSet: RowSet, measuredBoxes: RowBox[]) { return ( - !measuredBoxes.length && - !rowSet.rows.some( + !measuredBoxes.length + && !rowSet.rows.some( (r) => isNaN(r.length) || r.rowWords.length === 0 || r.rowWords.every((rw) => rw.text.length === 0), ) ); @@ -314,14 +311,12 @@ export function getFillTextColor( containerBackgroundColor?: Color, ) { let adjustedTextColor = textColor; - const containerBackgroundColorFromUser = - containerBackgroundColor === undefined || containerBackgroundColor === 'transparent' - ? 'rgba(255, 255, 255, 0)' - : containerBackgroundColor; + const containerBackgroundColorFromUser = containerBackgroundColor === undefined || containerBackgroundColor === 'transparent' + ? 'rgba(255, 255, 255, 0)' + : containerBackgroundColor; const containerBackground = combineColors(sliceFillColor, containerBackgroundColorFromUser); - const formattedContainerBackground = - typeof containerBackground !== 'string' ? RGBATupleToString(containerBackground) : containerBackground; + const formattedContainerBackground = typeof containerBackground !== 'string' ? RGBATupleToString(containerBackground) : containerBackground; const textShouldBeInvertedAndTextContrastIsFalse = textInvertible && !textContrast; const textShouldBeInvertedAndTextContrastIsSetToTrue = textInvertible && typeof textContrast !== 'number'; @@ -387,9 +382,9 @@ function fill( const layer = layers[node.depth - 1] || {}; const verticalAlignment = middleAlign ? VerticalAlignments.middle - : node.depth < layers.length - ? VerticalAlignments.bottom - : VerticalAlignments.top; + : (node.depth < layers.length + ? VerticalAlignments.bottom + : VerticalAlignments.top); const fontSizes = allFontSizes[Math.min(node.depth, allFontSizes.length) - 1]; const { textColor, @@ -402,13 +397,15 @@ function fill( padding, textContrast, textOpacity, - } = Object.assign( - { fontFamily: configFontFamily, fontWeight: 'normal', padding: 2 }, - fillLabel, - { valueFormatter: formatter }, - layer.fillLabel, - layer.shape, - ); + } = { + fontFamily: configFontFamily, + fontWeight: 'normal', + padding: 2, + ...fillLabel, + valueFormatter: formatter, + ...layer.fillLabel, + ...layer.shape, + }; const fillTextColor = getFillTextColor( textColor, textInvertible, @@ -417,13 +414,14 @@ function fill( containerBackgroundColor, ); - const valueFont = Object.assign( - { fontFamily: configFontFamily, fontWeight: 'normal' }, - fillLabel, - fillLabel.valueFont, - layer.fillLabel, - layer.fillLabel?.valueFont, - ); + const valueFont = { + fontFamily: configFontFamily, + fontWeight: 'normal', + ...fillLabel, + ...fillLabel.valueFont, + ...layer.fillLabel, + ...layer.fillLabel?.valueFont, + }; const sizeInvariantFont: Font = { fontStyle, @@ -467,7 +465,7 @@ function tryFontSize( getShapeRowGeometry: GetShapeRowGeometry, cx: Coordinate, cy: Coordinate, - padding: number, + padding: Padding, node: ShapeTreeNode, boxes: Box[], maxRowCount: number, @@ -505,7 +503,7 @@ function tryFontSize( rotation, verticalAlignment, leftAlign, - rows: [...Array(targetRowCount)].map(() => ({ + rows: [...new Array(targetRowCount)].map(() => ({ rowWords: [], rowAnchorX: NaN, rowAnchorY: NaN, @@ -553,7 +551,7 @@ function tryFontSize( currentRowLength += currentBox.width + wordSpacing; if (currentRowLength <= currentRow.maximumLength) { - currentRowWords.push(Object.assign({}, currentBox, { wordBeginning })); + currentRowWords.push({ ...currentBox, wordBeginning }); currentRow.length = currentRowLength; measuredBoxes.shift(); } else { @@ -583,7 +581,7 @@ function getRowSet( getShapeRowGeometry: GetShapeRowGeometry, cx: Coordinate, cy: Coordinate, - padding: number, + padding: Padding, node: ShapeTreeNode, ) { const tryFunction = tryFontSize( @@ -618,8 +616,7 @@ function getRowSet( export function inSectorRotation(horizontalTextEnforcer: number, horizontalTextAngleThreshold: number) { return (node: ShapeTreeNode): Radian => { let rotation = trueBearingToStandardPositionAngle((node.x0 + node.x1) / 2); - if (Math.abs(node.x1 - node.x0) > horizontalTextAngleThreshold && horizontalTextEnforcer > 0) - rotation = rotation * (1 - horizontalTextEnforcer); + if (Math.abs(node.x1 - node.x0) > horizontalTextAngleThreshold && horizontalTextEnforcer > 0) rotation *= 1 - horizontalTextEnforcer; if (TAU / 4 < rotation && rotation < (3 * TAU) / 4) rotation = wrapToTau(rotation - TAU / 2); return rotation; }; @@ -660,7 +657,7 @@ export function fillTextLayout( const fontSizes: Pixels[] = []; for (let i = 0; i <= fontSizeJumpCount; i++) { const fontSize = Math.round(minFontSize * Math.pow(realFontSizeJump, i)); - if (fontSizes.indexOf(fontSize) === -1) { + if (!fontSizes.includes(fontSize)) { fontSizes.push(fontSize); } } diff --git a/src/chart_types/partition_chart/layout/viewmodel/hierarchy_of_arrays.test.ts b/src/chart_types/partition_chart/layout/viewmodel/hierarchy_of_arrays.test.ts index 7975deac89..9af02cb739 100644 --- a/src/chart_types/partition_chart/layout/viewmodel/hierarchy_of_arrays.test.ts +++ b/src/chart_types/partition_chart/layout/viewmodel/hierarchy_of_arrays.test.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { getHierarchyOfArrays } from './hierarchy_of_arrays'; diff --git a/src/chart_types/partition_chart/layout/viewmodel/hierarchy_of_arrays.ts b/src/chart_types/partition_chart/layout/viewmodel/hierarchy_of_arrays.ts index ebc1097709..919dbaa61b 100644 --- a/src/chart_types/partition_chart/layout/viewmodel/hierarchy_of_arrays.ts +++ b/src/chart_types/partition_chart/layout/viewmodel/hierarchy_of_arrays.ts @@ -14,13 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { HierarchyOfArrays } from '../utils/group_by_rollup'; -import { Relation } from '../types/types'; -import { ValueAccessor } from '../../../../utils/commons'; import { IndexedAccessorFn } from '../../../../utils/accessor'; +import { ValueAccessor } from '../../../../utils/commons'; +import { Relation } from '../types/types'; import { + HierarchyOfArrays, aggregateComparator, aggregators, childOrders, @@ -49,7 +50,6 @@ export function getHierarchyOfArrays( // We can precompute things invariant of how the rectangle is divvied up. // By introducing `scale`, we no longer need to deal with the dichotomy of // size as data value vs size as number of pixels in the rectangle - return mapsToArrays( groupByRollup(groupByRollupAccessors, valueAccessor, aggregator, facts), aggregateComparator(mapEntryValue, childOrders.descending), diff --git a/src/chart_types/partition_chart/layout/viewmodel/link_text_layout.ts b/src/chart_types/partition_chart/layout/viewmodel/link_text_layout.ts index d4ddb96727..38978366c5 100644 --- a/src/chart_types/partition_chart/layout/viewmodel/link_text_layout.ts +++ b/src/chart_types/partition_chart/layout/viewmodel/link_text_layout.ts @@ -14,24 +14,24 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { Distance, PointTuple, PointTuples } from '../types/geometry_types'; -import { Config } from '../types/config_types'; -import { TAU, trueBearingToStandardPositionAngle } from '../utils/math'; -import { LinkLabelVM, RawTextGetter, ShapeTreeNode, ValueGetterFunction } from '../types/viewmodel_types'; -import { meanAngle } from '../geometry'; import { ValueFormatter, Color } from '../../../../utils/commons'; -import { makeHighContrastColor, validateColor } from '../utils/calcs'; import { Point } from '../../../../utils/point'; +import { meanAngle } from '../geometry'; +import { Config } from '../types/config_types'; +import { Distance, PointTuple, PointTuples } from '../types/geometry_types'; import { Box, Font, TextAlign, TextMeasure } from '../types/types'; -import { integerSnap, monotonicHillClimb } from '../utils/calcs'; +import { LinkLabelVM, RawTextGetter, ShapeTreeNode, ValueGetterFunction } from '../types/viewmodel_types'; +import { makeHighContrastColor, validateColor, integerSnap, monotonicHillClimb } from '../utils/calcs'; +import { TAU, trueBearingToStandardPositionAngle } from '../utils/math'; function cutToLength(s: string, maxLength: number) { - return s.length <= maxLength ? s : `${s.substr(0, maxLength - 1)}…`; // ellipsis is one char + return s.length <= maxLength ? s : `${s.slice(0, Math.max(0, maxLength - 1))}…`; // ellipsis is one char } -/**@internal */ +/** @internal */ export interface LinkLabelsViewModelSpec { linkLabels: LinkLabelVM[]; labelFontSpec: Font; @@ -143,13 +143,12 @@ export function linkTextLayout( ? rectWidth - diskCenter.x - translateX - widthAdjustment : diskCenter.x + translateX - widthAdjustment, ); - const { text, width, verticalOffset } = - linkLabel.fontSize / 2 <= cy + diskCenter.y && cy + diskCenter.y <= rectHeight - linkLabel.fontSize / 2 - ? fitText(measure, labelText, allottedLabelWidth, linkLabel.fontSize, { - ...labelFontSpec, - text: labelText, - }) - : { text: '', width: 0, verticalOffset: 0 }; + const { text, width, verticalOffset } = linkLabel.fontSize / 2 <= cy + diskCenter.y && cy + diskCenter.y <= rectHeight - linkLabel.fontSize / 2 + ? fitText(measure, labelText, allottedLabelWidth, linkLabel.fontSize, { + ...labelFontSpec, + text: labelText, + }) + : { text: '', width: 0, verticalOffset: 0 }; const linkLabels: PointTuples = [ [x0, y0], [stemFromX, stemFromY], @@ -176,7 +175,7 @@ export function linkTextLayout( function fitText(measure: TextMeasure, desiredText: string, allottedWidth: number, fontSize: number, box: Box) { const desiredLength = desiredText.length; - const response = (v: number) => measure(fontSize, [{ ...box, text: box.text.substr(0, v) }])[0].width; + const response = (v: number) => measure(fontSize, [{ ...box, text: box.text.slice(0, Math.max(0, v)) }])[0].width; const visibleLength = monotonicHillClimb(response, desiredLength, allottedWidth, integerSnap); const text = visibleLength < 2 && desiredLength >= 2 ? '' : cutToLength(box.text, visibleLength); const { width, emHeightAscent, emHeightDescent } = measure(fontSize, [{ ...box, text }])[0]; diff --git a/src/chart_types/partition_chart/layout/viewmodel/viewmodel.ts b/src/chart_types/partition_chart/layout/viewmodel/viewmodel.ts index c869f544c8..06fbe358b1 100644 --- a/src/chart_types/partition_chart/layout/viewmodel/viewmodel.ts +++ b/src/chart_types/partition_chart/layout/viewmodel/viewmodel.ts @@ -14,17 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { Part, TextMeasure } from '../types/types'; -import { linkTextLayout } from './link_text_layout'; +import { $Values } from 'utility-types'; + +import { StrokeStyle, ValueFormatter, Color } from '../../../../utils/commons'; +import { Layer } from '../../specs'; +import { percentValueGetter } from '../config/config'; +import { meanAngle } from '../geometry'; import { Config, PartitionLayout } from '../types/config_types'; -import { TAU, trueBearingToStandardPositionAngle } from '../utils/math'; import { Distance, Pixels, PointTuple, Radius } from '../types/geometry_types'; -import { meanAngle } from '../geometry'; -import { getTopPadding, treemap } from '../utils/treemap'; -import { sunburst } from '../utils/sunburst'; -import { argsToRGBString, stringToRGB } from '../utils/color_library_wrappers'; +import { TextMeasure, Part } from '../types/types'; import { nullShapeViewModel, OutsideLinksViewModel, @@ -36,15 +37,7 @@ import { ShapeViewModel, ValueGetterFunction, } from '../types/viewmodel_types'; -import { Layer } from '../../specs/index'; -import { - fillTextLayout, - getRectangleRowGeometry, - getSectorRowGeometry, - inSectorRotation, - nodeId, - ringSectorConstruction, -} from './fill_text_layout'; +import { argsToRGBString, stringToRGB } from '../utils/color_library_wrappers'; import { aggregateAccessor, ArrayEntry, @@ -56,9 +49,12 @@ import { sortIndexAccessor, HierarchyOfArrays, } from '../utils/group_by_rollup'; -import { StrokeStyle, ValueFormatter, Color } from '../../../../utils/commons'; -import { percentValueGetter } from '../config/config'; -import { $Values } from 'utility-types'; +import { trueBearingToStandardPositionAngle, TAU } from '../utils/math'; +import { sunburst } from '../utils/sunburst'; +import { getTopPadding, treemap } from '../utils/treemap'; +import { fillTextLayout, getRectangleRowGeometry, ringSectorConstruction, getSectorRowGeometry, inSectorRotation, nodeId } from './fill_text_layout'; +import { linkTextLayout } from './link_text_layout'; + function grooveAccessor(n: ArrayEntry) { return entryValue(n).depth > 1 ? 1 : [0, 2][entryValue(n).depth]; @@ -69,9 +65,9 @@ function topGrooveAccessor(topGroovePx: Pixels) { } export const VerticalAlignments = Object.freeze({ - top: 'top' as 'top', - middle: 'middle' as 'middle', - bottom: 'bottom' as 'bottom', + top: 'top' as const, + middle: 'middle' as const, + bottom: 'bottom' as const, }); // we might add more in the future; also, the intent is to still be of CanvasTextBaseline @@ -94,9 +90,7 @@ function sectorFillOrigins(fillOutside: boolean) { const divider = 10; const innerBias = fillOutside ? 9 : 1; const outerBias = divider - innerBias; - // prettier-ignore - const radius = - ( innerBias * ringSectorInnerRadius(node) + const radius = (innerBias * ringSectorInnerRadius(node) + outerBias * ringSectorOuterRadius(node) ) / divider; @@ -283,11 +277,11 @@ export function shapeViewModel( containerBackgroundColor, ) : fillTextLayout( - ringSectorConstruction(config, innerRadius, ringThickness), - getSectorRowGeometry, - inSectorRotation(config.horizontalTextEnforcer, config.horizontalTextAngleThreshold), - containerBackgroundColor, - ); + ringSectorConstruction(config, innerRadius, ringThickness), + getSectorRowGeometry, + inSectorRotation(config.horizontalTextEnforcer, config.horizontalTextAngleThreshold), + containerBackgroundColor, + ); const rowSets: RowSet[] = getRowSets( textMeasure, @@ -308,15 +302,14 @@ export function shapeViewModel( // linked text const currentY = [-height, -height, -height, -height]; - const nodesWithoutRoom = - fillOutside || treemapLayout - ? [] // outsideFillNodes and linkLabels are in inherent conflict due to very likely overlaps - : quadViewModel.filter((n: ShapeTreeNode) => { - const id = nodeId(n); - const foundInFillText = rowSets.find((r: RowSet) => r.id === id); - // successful text render if found, and has some row(s) - return !(foundInFillText && foundInFillText.rows.length !== 0); - }); + const nodesWithoutRoom = fillOutside || treemapLayout + ? [] // outsideFillNodes and linkLabels are in inherent conflict due to very likely overlaps + : quadViewModel.filter((n: ShapeTreeNode) => { + const id = nodeId(n); + const foundInFillText = rowSets.find((r: RowSet) => r.id === id); + // successful text render if found, and has some row(s) + return !(foundInFillText && foundInFillText.rows.length !== 0); + }); const maxLinkedLabelTextLength = config.linkLabel.maxTextLength; const linkLabelViewModels = linkTextLayout( width, @@ -334,17 +327,15 @@ export function shapeViewModel( containerBackgroundColor, ); - const pickQuads: PickFunction = (x, y) => { - return quadViewModel.filter( - treemapLayout - ? ({ x0, y0, x1, y1 }) => x0 <= x && x <= x1 && y0 <= y && y <= y1 - : ({ x0, y0px, x1, y1px }) => { - const angleX = (Math.atan2(y, x) + TAU / 4 + TAU) % TAU; - const yPx = Math.sqrt(x * x + y * y); - return x0 <= angleX && angleX <= x1 && y0px <= yPx && yPx <= y1px; - }, - ); - }; + const pickQuads: PickFunction = (x, y) => quadViewModel.filter( + treemapLayout + ? ({ x0, y0, x1, y1 }) => x0 <= x && x <= x1 && y0 <= y && y <= y1 + : ({ x0, y0px, x1, y1px }) => { + const angleX = (Math.atan2(y, x) + TAU / 4 + TAU) % TAU; + const yPx = Math.sqrt(x * x + y * y); + return x0 <= angleX && angleX <= x1 && y0px <= yPx && yPx <= y1px; + }, + ); // combined viewModel return { @@ -360,21 +351,18 @@ export function shapeViewModel( } function partToShapeTreeNode(treemapLayout: boolean, innerRadius: Radius, ringThickness: number) { - return (n: Part): ShapeTreeNode => { - const node: ArrayEntry = n.node; - return { - dataName: entryKey(node), - depth: depthAccessor(node), - value: aggregateAccessor(node), - parent: parentAccessor(node), - sortIndex: sortIndexAccessor(node), - x0: n.x0, - x1: n.x1, - y0: n.y0, - y1: n.y1, - y0px: treemapLayout ? n.y0 : innerRadius + n.y0 * ringThickness, - y1px: treemapLayout ? n.y1 : innerRadius + n.y1 * ringThickness, - yMidPx: treemapLayout ? (n.y0 + n.y1) / 2 : innerRadius + ((n.y0 + n.y1) / 2) * ringThickness, - }; - }; + return ({ node, x0, x1, y0, y1 }: Part): ShapeTreeNode => ({ + dataName: entryKey(node), + depth: depthAccessor(node), + value: aggregateAccessor(node), + parent: parentAccessor(node), + sortIndex: sortIndexAccessor(node), + x0, + x1, + y0, + y1, + y0px: treemapLayout ? y0 : innerRadius + y0 * ringThickness, + y1px: treemapLayout ? y1 : innerRadius + y1 * ringThickness, + yMidPx: treemapLayout ? (y0 + y1) / 2 : innerRadius + ((y0 + y1) / 2) * ringThickness, + }); } diff --git a/src/chart_types/partition_chart/renderer/canvas/canvas_renderers.ts b/src/chart_types/partition_chart/renderer/canvas/canvas_renderers.ts index c1556a9d5e..960c377de0 100644 --- a/src/chart_types/partition_chart/renderer/canvas/canvas_renderers.ts +++ b/src/chart_types/partition_chart/renderer/canvas/canvas_renderers.ts @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { clearCanvas, renderLayers, withContext } from '../../../../renderers/canvas'; +import { PartitionLayout } from '../../layout/types/config_types'; import { Pixels } from '../../layout/types/geometry_types'; -import { addOpacity } from '../../layout/utils/calcs'; import { LinkLabelVM, OutsideLinksViewModel, @@ -26,10 +28,9 @@ import { ShapeViewModel, TextRow, } from '../../layout/types/viewmodel_types'; +import { addOpacity } from '../../layout/utils/calcs'; import { TAU } from '../../layout/utils/math'; -import { PartitionLayout } from '../../layout/types/config_types'; import { cssFontShorthand } from '../../layout/utils/measure'; -import { clearCanvas, renderLayers, withContext } from '../../../../renderers/canvas'; import { LinkLabelsViewModelSpec } from '../../layout/viewmodel/link_text_layout'; // the burnout avoidance in the center of the pie @@ -38,7 +39,7 @@ const TAPER_OFF_LIMIT = 50; // taper off within a radius of TAPER_OFF_LIMIT to a function renderTextRow( ctx: CanvasRenderingContext2D, - { fontSize, fillTextColor, rotation, verticalAlignment, leftAlign /*, container*/ }: RowSet, + { fontSize, fillTextColor, rotation, verticalAlignment, leftAlign /* , container */ }: RowSet, ) { return (currentRow: TextRow) => { const crx = leftAlign @@ -57,19 +58,19 @@ function renderTextRow( }); }); /* - // for debug use: this draws magenta boxes for where the text needs to fit - // note: `container` is a property of the RowSet, needs to be added - withContext(ctx, (ctx) => { - ctx.scale(1, -1); - ctx.rotate(-rotation); - ctx.beginPath(); - ctx.strokeStyle = 'magenta'; - ctx.fillStyle = 'magenta'; - ctx.lineWidth = 1; - ctx.rect(container.x0 + 1, container.y0 + 1, container.x1 - container.x0 - 2, container.y1 - container.y0 - 2); - ctx.stroke(); - }); - */ + * // for debug use: this draws magenta boxes for where the text needs to fit + * // note: `container` is a property of the RowSet, needs to be added + *withContext(ctx, (ctx) => { + * ctx.scale(1, -1); + * ctx.rotate(-rotation); + * ctx.beginPath(); + * ctx.strokeStyle = 'magenta'; + * ctx.fillStyle = 'magenta'; + * ctx.lineWidth = 1; + * ctx.rect(container.x0 + 1, container.y0 + 1, container.x1 - container.x0 - 2, container.y1 - container.y0 - 2); + * ctx.stroke(); + *}); + */ }; } diff --git a/src/chart_types/partition_chart/renderer/canvas/partition.tsx b/src/chart_types/partition_chart/renderer/canvas/partition.tsx index 174f03d450..8283695e2c 100644 --- a/src/chart_types/partition_chart/renderer/canvas/partition.tsx +++ b/src/chart_types/partition_chart/renderer/canvas/partition.tsx @@ -14,20 +14,22 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React, { MouseEvent } from 'react'; -import { bindActionCreators, Dispatch } from 'redux'; import { connect } from 'react-redux'; +import { bindActionCreators, Dispatch } from 'redux'; + import { onChartRendered } from '../../../../state/actions/chart'; import { GlobalChartState } from '../../../../state/chart_state'; +import { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions'; +import { getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized'; import { Dimensions } from '../../../../utils/dimensions'; -import { partitionGeometries } from '../../state/selectors/geometries'; import { nullShapeViewModel, QuadViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types'; -import { renderPartitionCanvas2d } from './canvas_renderers'; import { INPUT_KEY } from '../../layout/utils/group_by_rollup'; -import { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions'; -import { getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized'; +import { partitionGeometries } from '../../state/selectors/geometries'; +import { renderPartitionCanvas2d } from './canvas_renderers'; interface ReactiveChartStateProps { initialized: boolean; @@ -42,11 +44,13 @@ interface ReactiveChartDispatchProps { type PartitionProps = ReactiveChartStateProps & ReactiveChartDispatchProps; class PartitionComponent extends React.Component { static displayName = 'Partition'; + // firstRender = true; // this'll be useful for stable resizing of treemaps private readonly canvasRef: React.RefObject; private ctx: CanvasRenderingContext2D | null; // see example https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio#Example private readonly devicePixelRatio: number; // fixme this be no constant: multi-monitor window drag may necessitate modifying the `` dimensions + constructor(props: Readonly) { super(props); this.canvasRef = React.createRef(); @@ -54,21 +58,18 @@ class PartitionComponent extends React.Component { this.devicePixelRatio = window.devicePixelRatio; } - private drawCanvas() { - if (this.ctx) { - const { width, height }: Dimensions = this.props.chartContainerDimensions; - renderPartitionCanvas2d(this.ctx, this.devicePixelRatio, { - ...this.props.geometries, - config: { ...this.props.geometries.config, width, height }, - }); + componentDidMount() { + /* + * the DOM element has just been appended, and getContext('2d') is always non-null, + * so we could use a couple of ! non-null assertions but no big plus + */ + this.tryCanvasContext(); + if (this.props.initialized) { + this.drawCanvas(); + this.props.onChartRendered(); } } - private tryCanvasContext() { - const canvas = this.canvasRef.current; - this.ctx = canvas && canvas.getContext('2d'); - } - componentDidUpdate() { if (!this.ctx) { this.tryCanvasContext(); @@ -79,16 +80,21 @@ class PartitionComponent extends React.Component { } } - componentDidMount() { - // the DOM element has just been appended, and getContext('2d') is always non-null, - // so we could use a couple of ! non-null assertions but no big plus - this.tryCanvasContext(); - if (this.props.initialized) { - this.drawCanvas(); - this.props.onChartRendered(); + private drawCanvas() { + if (this.ctx) { + const { width, height }: Dimensions = this.props.chartContainerDimensions; + renderPartitionCanvas2d(this.ctx, this.devicePixelRatio, { + ...this.props.geometries, + config: { ...this.props.geometries.config, width, height }, + }); } } + private tryCanvasContext() { + const canvas = this.canvasRef.current; + this.ctx = canvas && canvas.getContext('2d'); + } + handleMouseMove(e: MouseEvent) { const { initialized, @@ -99,7 +105,7 @@ class PartitionComponent extends React.Component { } const picker = this.props.geometries.pickQuads; const box = this.canvasRef.current.getBoundingClientRect(); - const diskCenter = this.props.geometries.diskCenter; + const { diskCenter } = this.props.geometries; const x = e.clientX - box.left - diskCenter.x; const y = e.clientY - box.top - diskCenter.y; const pickedShapes: Array = picker(x, y); @@ -113,11 +119,11 @@ class PartitionComponent extends React.Component { } }); /* - console.log( - pickedShapes.map((s) => s.value), - [...datumIndices.values()], - ); - */ + *console.log( + * pickedShapes.map((s) => s.value), + * [...datumIndices.values()], + *); + */ return pickedShapes; // placeholder } diff --git a/src/chart_types/partition_chart/renderer/dom/highlighter.tsx b/src/chart_types/partition_chart/renderer/dom/highlighter.tsx index 701ed8494c..f288df8585 100644 --- a/src/chart_types/partition_chart/renderer/dom/highlighter.tsx +++ b/src/chart_types/partition_chart/renderer/dom/highlighter.tsx @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + +import { Dimensions } from '../../../../utils/dimensions'; +import { PartitionLayout } from '../../layout/types/config_types'; +import { PointObject } from '../../layout/types/geometry_types'; import { QuadViewModel } from '../../layout/types/viewmodel_types'; import { TAU } from '../../layout/utils/math'; -import { PointObject } from '../../layout/types/geometry_types'; -import { PartitionLayout } from '../../layout/types/config_types'; -import { Dimensions } from '../../../../utils/dimensions'; /** @internal */ export interface HighlighterProps { @@ -99,9 +101,7 @@ function renderGeometries(geometries: QuadViewModel[], partitionLayout: Partitio let maxDepth = -1; // we should render only the deepest geometries of the tree to avoid overlaying highlighted geometries if (partitionLayout === PartitionLayout.treemap) { - maxDepth = geometries.reduce((acc, geom) => { - return Math.max(acc, geom.depth); - }, 0); + maxDepth = geometries.reduce((acc, geom) => Math.max(acc, geom.depth), 0); } return geometries .filter((geometry) => { diff --git a/src/chart_types/partition_chart/renderer/dom/highlighter_hover.tsx b/src/chart_types/partition_chart/renderer/dom/highlighter_hover.tsx index 07a7438d64..c446c9c957 100644 --- a/src/chart_types/partition_chart/renderer/dom/highlighter_hover.tsx +++ b/src/chart_types/partition_chart/renderer/dom/highlighter_hover.tsx @@ -14,15 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { connect } from 'react-redux'; + import { GlobalChartState } from '../../../../state/chart_state'; +import { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions'; +import { getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized'; import { partitionGeometries } from '../../state/selectors/geometries'; import { getPickedShapes } from '../../state/selectors/picked_shapes'; -import { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions'; import { HighlighterComponent, HighlighterProps, DEFAULT_PROPS } from './highlighter'; -import { getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized'; const hoverMapStateToProps = (state: GlobalChartState): HighlighterProps => { if (!getInternalIsInitializedSelector(state)) { diff --git a/src/chart_types/partition_chart/renderer/dom/highlighter_legend.tsx b/src/chart_types/partition_chart/renderer/dom/highlighter_legend.tsx index 6e9965442e..19bed6569c 100644 --- a/src/chart_types/partition_chart/renderer/dom/highlighter_legend.tsx +++ b/src/chart_types/partition_chart/renderer/dom/highlighter_legend.tsx @@ -14,15 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { connect } from 'react-redux'; + import { GlobalChartState } from '../../../../state/chart_state'; +import { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions'; +import { getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized'; import { partitionGeometries } from '../../state/selectors/geometries'; import { getHighlightedSectorsSelector } from '../../state/selectors/get_highlighted_shapes'; -import { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions'; import { HighlighterComponent, HighlighterProps, DEFAULT_PROPS } from './highlighter'; -import { getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized'; const legendMapStateToProps = (state: GlobalChartState): HighlighterProps => { if (!getInternalIsInitializedSelector(state)) { diff --git a/src/chart_types/partition_chart/specs/index.ts b/src/chart_types/partition_chart/specs/index.ts index cb470ab52b..03fd7cb89d 100644 --- a/src/chart_types/partition_chart/specs/index.ts +++ b/src/chart_types/partition_chart/specs/index.ts @@ -14,17 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { ChartTypes } from '../../index'; -import { config, percentFormatter } from '../layout/config/config'; + +import { ChartTypes } from '../..'; +import { Spec, SpecTypes } from '../../../specs'; import { getConnect, specComponentFactory } from '../../../state/spec_factory'; import { IndexedAccessorFn } from '../../../utils/accessor'; -import { Spec, SpecTypes } from '../../../specs/index'; -import { Config, FillFontSizeRange, FillLabelConfig } from '../layout/types/config_types'; -import { ShapeTreeNode, ValueGetter } from '../layout/types/viewmodel_types'; -import { AGGREGATE_KEY } from '../layout/utils/group_by_rollup'; import { Datum, LabelAccessor, @@ -33,9 +31,11 @@ import { ValueAccessor, ValueFormatter, } from '../../../utils/commons'; -import { NodeColorAccessor } from '../layout/types/viewmodel_types'; -import { PrimitiveValue } from '../layout/utils/group_by_rollup'; +import { config, percentFormatter } from '../layout/config/config'; +import { Config, FillFontSizeRange, FillLabelConfig } from '../layout/types/config_types'; import { Pixels } from '../layout/types/geometry_types'; +import { ShapeTreeNode, ValueGetter, NodeColorAccessor } from '../layout/types/viewmodel_types'; +import { AGGREGATE_KEY, PrimitiveValue } from '../layout/utils/group_by_rollup'; interface ExtendedFillLabelConfig extends FillLabelConfig, FillFontSizeRange {} diff --git a/src/chart_types/partition_chart/state/chart_state.tsx b/src/chart_types/partition_chart/state/chart_state.tsx index 372cc92cf7..47b64df0f7 100644 --- a/src/chart_types/partition_chart/state/chart_state.tsx +++ b/src/chart_types/partition_chart/state/chart_state.tsx @@ -14,28 +14,32 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { InternalChartState, GlobalChartState, BackwardRef } from '../../../state/chart_state'; + import { ChartTypes } from '../..'; -import { Partition } from '../renderer/canvas/partition'; -import { isTooltipVisibleSelector } from '../state/selectors/is_tooltip_visible'; -import { getTooltipInfoSelector } from '../state/selectors/tooltip'; import { Tooltip } from '../../../components/tooltip'; -import { createOnElementClickCaller } from './selectors/on_element_click_caller'; -import { createOnElementOverCaller } from './selectors/on_element_over_caller'; -import { createOnElementOutCaller } from './selectors/on_element_out_caller'; -import { computeLegendSelector } from './selectors/compute_legend'; -import { getLegendItemsLabels } from './selectors/get_legend_items_labels'; +import { InternalChartState, GlobalChartState, BackwardRef } from '../../../state/chart_state'; +import { Partition } from '../renderer/canvas/partition'; import { HighlighterFromHover } from '../renderer/dom/highlighter_hover'; import { HighlighterFromLegend } from '../renderer/dom/highlighter_legend'; +import { computeLegendSelector } from './selectors/compute_legend'; +import { getLegendItemsLabels } from './selectors/get_legend_items_labels'; +import { isTooltipVisibleSelector } from './selectors/is_tooltip_visible'; +import { createOnElementClickCaller } from './selectors/on_element_click_caller'; +import { createOnElementOutCaller } from './selectors/on_element_out_caller'; +import { createOnElementOverCaller } from './selectors/on_element_over_caller'; import { getPieSpec } from './selectors/pie_spec'; +import { getTooltipInfoSelector } from './selectors/tooltip'; const EMPTY_MAP = new Map(); /** @internal */ export class PartitionState implements InternalChartState { + chartType = ChartTypes.Partition; + onElementClickCaller: (state: GlobalChartState) => void; onElementOverCaller: (state: GlobalChartState) => void; onElementOutCaller: (state: GlobalChartState) => void; @@ -45,28 +49,35 @@ export class PartitionState implements InternalChartState { this.onElementOverCaller = createOnElementOverCaller(); this.onElementOutCaller = createOnElementOutCaller(); } - chartType = ChartTypes.Partition; + isInitialized(globalState: GlobalChartState) { return globalState.specsInitialized && getPieSpec(globalState) !== null; } + isBrushAvailable() { return false; } + isBrushing() { return false; } + isChartEmpty() { return false; } + getLegendItemsLabels(globalState: GlobalChartState) { return getLegendItemsLabels(globalState); } + getLegendItems(globalState: GlobalChartState) { return computeLegendSelector(globalState); } + getLegendExtraValues() { return EMPTY_MAP; } + chartRenderer(containerRef: BackwardRef) { return ( <> @@ -77,23 +88,28 @@ export class PartitionState implements InternalChartState { ); } + getPointerCursor() { return 'default'; } + isTooltipVisible(globalState: GlobalChartState) { return isTooltipVisibleSelector(globalState); } + getTooltipInfo(globalState: GlobalChartState) { return getTooltipInfoSelector(globalState); } + getTooltipAnchor(state: GlobalChartState) { - const position = state.interactions.pointer.current.position; + const { position } = state.interactions.pointer.current; return { isRotated: false, x1: position.x, y1: position.y, }; } + eventCallbacks(globalState: GlobalChartState) { this.onElementOverCaller(globalState); this.onElementOutCaller(globalState); diff --git a/src/chart_types/partition_chart/state/selectors/compute_legend.ts b/src/chart_types/partition_chart/state/selectors/compute_legend.ts index bf08184c7c..f49c0d9e62 100644 --- a/src/chart_types/partition_chart/state/selectors/compute_legend.ts +++ b/src/chart_types/partition_chart/state/selectors/compute_legend.ts @@ -14,18 +14,20 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + import { LegendItem } from '../../../../commons/legend'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; -import { getPieSpec } from './pie_spec'; -import { partitionGeometries } from './geometries'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; -import { PrimitiveValue } from '../../layout/utils/group_by_rollup'; +import { Position } from '../../../../utils/commons'; import { QuadViewModel } from '../../layout/types/viewmodel_types'; +import { PrimitiveValue } from '../../layout/utils/group_by_rollup'; +import { partitionGeometries } from './geometries'; import { getFlatHierarchy } from './get_flat_hierarchy'; -import { Position } from '../../../../utils/commons'; +import { getPieSpec } from './pie_spec'; /** @internal */ export const computeLegendSelector = createCachedSelector( @@ -93,7 +95,5 @@ export const computeLegendSelector = createCachedSelector( )(getChartIdSelector); function findIndex(items: Array<[PrimitiveValue, number, PrimitiveValue]>, child: QuadViewModel) { - return items.findIndex(([dataName, depth, value]) => { - return dataName === child.dataName && depth === child.depth && value === child.value; - }); + return items.findIndex(([dataName, depth, value]) => dataName === child.dataName && depth === child.depth && value === child.value); } diff --git a/src/chart_types/partition_chart/state/selectors/geometries.ts b/src/chart_types/partition_chart/state/selectors/geometries.ts index b443137d9f..e043106903 100644 --- a/src/chart_types/partition_chart/state/selectors/geometries.ts +++ b/src/chart_types/partition_chart/state/selectors/geometries.ts @@ -14,20 +14,22 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { GlobalChartState } from '../../../../state/chart_state'; -import { getSpecsFromStore } from '../../../../state/utils'; + import { ChartTypes } from '../../..'; -import { render } from './scenegraph'; -import { nullShapeViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types'; -import { PartitionSpec } from '../../specs/index'; import { SpecTypes } from '../../../../specs/settings'; -import { getTree } from './tree'; +import { GlobalChartState } from '../../../../state/chart_state'; import { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions'; import { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme'; +import { getSpecsFromStore } from '../../../../state/utils'; +import { nullShapeViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types'; import { isColorValid } from '../../layout/utils/calcs'; +import { PartitionSpec } from '../../specs'; +import { render } from './scenegraph'; +import { getTree } from './tree'; const getSpecs = (state: GlobalChartState) => state.specs; diff --git a/src/chart_types/partition_chart/state/selectors/get_flat_hierarchy.ts b/src/chart_types/partition_chart/state/selectors/get_flat_hierarchy.ts index 1c556ee0dd..fad11b30f5 100644 --- a/src/chart_types/partition_chart/state/selectors/get_flat_hierarchy.ts +++ b/src/chart_types/partition_chart/state/selectors/get_flat_hierarchy.ts @@ -14,19 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { getTree } from './tree'; + import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { HierarchyOfArrays, PrimitiveValue } from '../../layout/utils/group_by_rollup'; +import { getTree } from './tree'; /** @internal */ export const getFlatHierarchy = createCachedSelector( [getTree], - (tree): Array<[PrimitiveValue, number, PrimitiveValue]> => { - return flatHierarchy(tree); - }, + (tree): Array<[PrimitiveValue, number, PrimitiveValue]> => flatHierarchy(tree), )(getChartIdSelector); function flatHierarchy(tree: HierarchyOfArrays, orderedList: Array<[PrimitiveValue, number, PrimitiveValue]> = []) { diff --git a/src/chart_types/partition_chart/state/selectors/get_highlighted_shapes.ts b/src/chart_types/partition_chart/state/selectors/get_highlighted_shapes.ts index b67a8ad869..380c33c745 100644 --- a/src/chart_types/partition_chart/state/selectors/get_highlighted_shapes.ts +++ b/src/chart_types/partition_chart/state/selectors/get_highlighted_shapes.ts @@ -14,13 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + import { GlobalChartState } from '../../../../state/chart_state'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; -import { partitionGeometries } from './geometries'; import { QuadViewModel } from '../../layout/types/viewmodel_types'; +import { partitionGeometries } from './geometries'; const getHighlightedLegendItemKey = (state: GlobalChartState) => state.interactions.highlightedLegendItemKey; @@ -31,8 +33,6 @@ export const getHighlightedSectorsSelector = createCachedSelector( if (!highlightedLegendItemKey) { return []; } - return geoms.quadViewModel.filter((geom) => { - return geom.dataName === highlightedLegendItemKey; - }); + return geoms.quadViewModel.filter(({ dataName }) => dataName === highlightedLegendItemKey); }, )(getChartIdSelector); diff --git a/src/chart_types/partition_chart/state/selectors/get_legend_items_labels.test.ts b/src/chart_types/partition_chart/state/selectors/get_legend_items_labels.test.ts index 86336e7712..24127b5721 100644 --- a/src/chart_types/partition_chart/state/selectors/get_legend_items_labels.test.ts +++ b/src/chart_types/partition_chart/state/selectors/get_legend_items_labels.test.ts @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { MockStore } from '../../../../mocks/store'; -import { MockSeriesSpec, MockGlobalSpec } from '../../../../mocks/specs'; -import { getLegendItemsLabels } from './get_legend_items_labels'; -import { PrimitiveValue } from '../../layout/utils/group_by_rollup'; import { Store } from 'redux'; + +import { MockSeriesSpec, MockGlobalSpec } from '../../../../mocks/specs'; +import { MockStore } from '../../../../mocks/store'; import { GlobalChartState } from '../../../../state/chart_state'; +import { PrimitiveValue } from '../../layout/utils/group_by_rollup'; +import { getLegendItemsLabels } from './get_legend_items_labels'; describe('Partition - Legend items labels', () => { type TestDatum = [string, string, string, number]; diff --git a/src/chart_types/partition_chart/state/selectors/get_legend_items_labels.ts b/src/chart_types/partition_chart/state/selectors/get_legend_items_labels.ts index a0ea45d639..7cb025a59b 100644 --- a/src/chart_types/partition_chart/state/selectors/get_legend_items_labels.ts +++ b/src/chart_types/partition_chart/state/selectors/get_legend_items_labels.ts @@ -14,17 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { getTree } from './tree'; + +import { SettingsSpec } from '../../../../specs'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; -import { getPieSpec } from './pie_spec'; -import { HierarchyOfArrays, CHILDREN_KEY } from '../../layout/utils/group_by_rollup'; -import { Layer } from '../../specs'; import { LegendItemLabel } from '../../../../state/selectors/get_legend_items_labels'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; -import { SettingsSpec } from '../../../../specs'; +import { HierarchyOfArrays, CHILDREN_KEY } from '../../layout/utils/group_by_rollup'; +import { Layer } from '../../specs'; +import { getPieSpec } from './pie_spec'; +import { getTree } from './tree'; /** @internal */ export const getLegendItemsLabels = createCachedSelector( @@ -86,10 +88,8 @@ function flatSlicesNames( const children = arrayNode[CHILDREN_KEY]; flatSlicesNames(layers, depth + 1, children, keys); } - return [...keys.keys()].map((k) => { - return { - label: k, - depth: keys.get(k) ?? 0, - }; - }); + return [...keys.keys()].map((k) => ({ + label: k, + depth: keys.get(k) ?? 0, + })); } diff --git a/src/chart_types/partition_chart/state/selectors/is_tooltip_visible.ts b/src/chart_types/partition_chart/state/selectors/is_tooltip_visible.ts index d6bc0f40e6..783faf5905 100644 --- a/src/chart_types/partition_chart/state/selectors/is_tooltip_visible.ts +++ b/src/chart_types/partition_chart/state/selectors/is_tooltip_visible.ts @@ -14,13 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { TooltipType, getTooltipType } from '../../../../specs'; +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import { getTooltipInfoSelector } from './tooltip'; /** diff --git a/src/chart_types/partition_chart/state/selectors/on_element_click_caller.ts b/src/chart_types/partition_chart/state/selectors/on_element_click_caller.ts index d62e4c9aee..c17a364d66 100644 --- a/src/chart_types/partition_chart/state/selectors/on_element_click_caller.ts +++ b/src/chart_types/partition_chart/state/selectors/on_element_click_caller.ts @@ -14,19 +14,21 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; import { Selector } from 'reselect'; + +import { ChartTypes } from '../../..'; +import { SeriesIdentifier } from '../../../../commons/series_id'; +import { SettingsSpec, LayerValue } from '../../../../specs'; import { GlobalChartState, PointerState } from '../../../../state/chart_state'; +import { getLastClickSelector } from '../../../../state/selectors/get_last_click'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; -import { SettingsSpec, LayerValue } from '../../../../specs'; +import { isClicking } from '../../../../state/utils'; import { getPickedShapesLayerValues } from './picked_shapes'; import { getPieSpec } from './pie_spec'; -import { ChartTypes } from '../../..'; -import { SeriesIdentifier } from '../../../../commons/series_id'; -import { isClicking } from '../../../../state/utils'; -import { getLastClickSelector } from '../../../../state/selectors/get_last_click'; /** * Will call the onElementClick listener every time the following preconditions are met: @@ -52,15 +54,13 @@ export function createOnElementClickCaller(): (state: GlobalChartState) => void const nextPickedShapesLength = pickedShapes.length; if (nextPickedShapesLength > 0 && isClicking(prevClick, lastClick)) { if (settings && settings.onElementClick) { - const elements = pickedShapes.map<[Array, SeriesIdentifier]>((values) => { - return [ - values, - { - specId: pieSpec.id, - key: `spec{${pieSpec.id}}`, - }, - ]; - }); + const elements = pickedShapes.map<[Array, SeriesIdentifier]>((values) => [ + values, + { + specId: pieSpec.id, + key: `spec{${pieSpec.id}}`, + }, + ]); settings.onElementClick(elements); } } diff --git a/src/chart_types/partition_chart/state/selectors/on_element_out_caller.ts b/src/chart_types/partition_chart/state/selectors/on_element_out_caller.ts index 718b921f48..f6a3a2a58b 100644 --- a/src/chart_types/partition_chart/state/selectors/on_element_out_caller.ts +++ b/src/chart_types/partition_chart/state/selectors/on_element_out_caller.ts @@ -14,16 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import createCachedSelector from 're-reselect'; -import { getPickedShapesLayerValues } from './picked_shapes'; -import { getPieSpec } from './pie_spec'; -import { GlobalChartState } from '../../../../state/chart_state'; import { Selector } from 'react-redux'; -import { ChartTypes } from '../../../index'; + +import { ChartTypes } from '../../..'; +import { GlobalChartState } from '../../../../state/chart_state'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; +import { getPickedShapesLayerValues } from './picked_shapes'; +import { getPieSpec } from './pie_spec'; /** * Will call the onElementOut listener every time the following preconditions are met: diff --git a/src/chart_types/partition_chart/state/selectors/on_element_over_caller.ts b/src/chart_types/partition_chart/state/selectors/on_element_over_caller.ts index 8cbeced829..1454c47e8f 100644 --- a/src/chart_types/partition_chart/state/selectors/on_element_over_caller.ts +++ b/src/chart_types/partition_chart/state/selectors/on_element_over_caller.ts @@ -14,18 +14,20 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import createCachedSelector from 're-reselect'; +import { Selector } from 'react-redux'; + +import { ChartTypes } from '../../..'; +import { SeriesIdentifier } from '../../../../commons/series_id'; import { LayerValue } from '../../../../specs'; import { GlobalChartState } from '../../../../state/chart_state'; -import { Selector } from 'react-redux'; -import { ChartTypes } from '../../../index'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; -import { getPieSpec } from './pie_spec'; +import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import { getPickedShapesLayerValues } from './picked_shapes'; -import { SeriesIdentifier } from '../../../../commons/series_id'; +import { getPieSpec } from './pie_spec'; function isOverElement(prevPickedShapes: Array> = [], nextPickedShapes: Array>) { if (nextPickedShapes.length === 0) { diff --git a/src/chart_types/partition_chart/state/selectors/picked_shapes.test.ts b/src/chart_types/partition_chart/state/selectors/picked_shapes.test.ts index 25bb500631..31c1b93c2e 100644 --- a/src/chart_types/partition_chart/state/selectors/picked_shapes.test.ts +++ b/src/chart_types/partition_chart/state/selectors/picked_shapes.test.ts @@ -14,18 +14,20 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { chartStoreReducer, GlobalChartState } from '../../../../state/chart_state'; import { createStore, Store } from 'redux'; -import { PartitionSpec } from '../../specs'; -import { upsertSpec, specParsed, specParsing } from '../../../../state/actions/specs'; + import { MockGlobalSpec, MockSeriesSpec } from '../../../../mocks/specs'; +import { SettingsSpec, XYChartElementEvent, PartitionElementEvent } from '../../../../specs'; import { updateParentDimensions } from '../../../../state/actions/chart_settings'; -import { partitionGeometries } from './geometries'; import { onMouseDown, onMouseUp, onPointerMove } from '../../../../state/actions/mouse'; +import { upsertSpec, specParsed, specParsing } from '../../../../state/actions/specs'; +import { chartStoreReducer, GlobalChartState } from '../../../../state/chart_state'; +import { PartitionSpec } from '../../specs'; +import { partitionGeometries } from './geometries'; import { createOnElementClickCaller } from './on_element_click_caller'; -import { SettingsSpec, XYChartElementEvent, PartitionElementEvent } from '../../../../specs'; describe('Picked shapes selector', () => { function initStore() { @@ -45,9 +47,7 @@ describe('Picked shapes selector', () => { beforeEach(() => { store = initStore(); const common = { - valueAccessor: (d: { v: number }) => { - return d.v; - }, + valueAccessor: (d: { v: number }) => d.v, data: [ { g1: 'a', g2: 'a', v: 1 }, { g1: 'a', g2: 'b', v: 1 }, diff --git a/src/chart_types/partition_chart/state/selectors/picked_shapes.ts b/src/chart_types/partition_chart/state/selectors/picked_shapes.ts index 97667f9f07..f12b886eb5 100644 --- a/src/chart_types/partition_chart/state/selectors/picked_shapes.ts +++ b/src/chart_types/partition_chart/state/selectors/picked_shapes.ts @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { partitionGeometries } from './geometries'; -import { GlobalChartState } from '../../../../state/chart_state'; + import { LayerValue } from '../../../../specs'; -import { PARENT_KEY, DEPTH_KEY, AGGREGATE_KEY, CHILDREN_KEY, SORT_INDEX_KEY } from '../../layout/utils/group_by_rollup'; +import { GlobalChartState } from '../../../../state/chart_state'; import { QuadViewModel } from '../../layout/types/viewmodel_types'; +import { PARENT_KEY, DEPTH_KEY, AGGREGATE_KEY, CHILDREN_KEY, SORT_INDEX_KEY } from '../../layout/utils/group_by_rollup'; +import { partitionGeometries } from './geometries'; function getCurrentPointerPosition(state: GlobalChartState) { return state.interactions.pointer.current.position; @@ -32,7 +34,7 @@ export const getPickedShapes = createCachedSelector( [partitionGeometries, getCurrentPointerPosition], (geoms, pointerPosition): QuadViewModel[] => { const picker = geoms.pickQuads; - const diskCenter = geoms.diskCenter; + const { diskCenter } = geoms; const x = pointerPosition.x - diskCenter.x; const y = pointerPosition.y - diskCenter.y; return picker(x, y); @@ -47,9 +49,7 @@ export const getPickedShapesLayerValues = createCachedSelector( /** @internal */ export function pickShapesLayerValues(pickedShapes: QuadViewModel[]): Array> { - const maxDepth = pickedShapes.reduce((acc, curr) => { - return Math.max(acc, curr.depth); - }, 0); + const maxDepth = pickedShapes.reduce((acc, curr) => Math.max(acc, curr.depth), 0); const elements = pickedShapes .filter(({ depth }) => depth === maxDepth) .map>((model) => { diff --git a/src/chart_types/partition_chart/state/selectors/pie_spec.ts b/src/chart_types/partition_chart/state/selectors/pie_spec.ts index 850fcff9b4..b0a91ebdc0 100644 --- a/src/chart_types/partition_chart/state/selectors/pie_spec.ts +++ b/src/chart_types/partition_chart/state/selectors/pie_spec.ts @@ -14,13 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { ChartTypes } from '../../..'; +import { SpecTypes } from '../../../../specs'; import { GlobalChartState } from '../../../../state/chart_state'; import { getSpecsFromStore } from '../../../../state/utils'; import { PartitionSpec } from '../../specs'; -import { ChartTypes } from '../../..'; -import { SpecTypes } from '../../../../specs'; /** @internal */ export function getPieSpec(state: GlobalChartState): PartitionSpec | null { diff --git a/src/chart_types/partition_chart/state/selectors/scenegraph.ts b/src/chart_types/partition_chart/state/selectors/scenegraph.ts index 0567d98f5f..55f8660a7d 100644 --- a/src/chart_types/partition_chart/state/selectors/scenegraph.ts +++ b/src/chart_types/partition_chart/state/selectors/scenegraph.ts @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { identity, mergePartial, RecursivePartial, Color } from '../../../../utils/commons'; import { Dimensions } from '../../../../utils/dimensions'; -import { shapeViewModel } from '../../layout/viewmodel/viewmodel'; -import { measureText } from '../../layout/utils/measure'; +import { config as defaultConfig, VALUE_GETTERS } from '../../layout/config/config'; +import { Config } from '../../layout/types/config_types'; import { ShapeTreeNode, ShapeViewModel, @@ -27,10 +29,10 @@ import { ValueGetter, } from '../../layout/types/viewmodel_types'; import { DEPTH_KEY, HierarchyOfArrays } from '../../layout/utils/group_by_rollup'; -import { PartitionSpec, Layer } from '../../specs/index'; -import { identity, mergePartial, RecursivePartial, Color } from '../../../../utils/commons'; -import { config as defaultConfig, VALUE_GETTERS } from '../../layout/config/config'; -import { Config } from '../../layout/types/config_types'; +import { measureText } from '../../layout/utils/measure'; +import { shapeViewModel } from '../../layout/viewmodel/viewmodel'; +import { PartitionSpec, Layer } from '../../specs'; + function rawTextGetter(layers: Layer[]): RawTextGetter { return (node: ShapeTreeNode) => { diff --git a/src/chart_types/partition_chart/state/selectors/tooltip.ts b/src/chart_types/partition_chart/state/selectors/tooltip.ts index f3581a4cac..934f591310 100644 --- a/src/chart_types/partition_chart/state/selectors/tooltip.ts +++ b/src/chart_types/partition_chart/state/selectors/tooltip.ts @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + import { TooltipInfo } from '../../../../components/tooltip/types'; -import { valueGetterFunction } from './scenegraph'; import { percentValueGetter, sumValueGetter } from '../../layout/config/config'; -import { getPieSpec } from './pie_spec'; import { getPickedShapes } from './picked_shapes'; +import { getPieSpec } from './pie_spec'; +import { valueGetterFunction } from './scenegraph'; const EMPTY_TOOLTIP = Object.freeze({ header: null, diff --git a/src/chart_types/partition_chart/state/selectors/tree.ts b/src/chart_types/partition_chart/state/selectors/tree.ts index 037ce69de0..2e6970e3b6 100644 --- a/src/chart_types/partition_chart/state/selectors/tree.ts +++ b/src/chart_types/partition_chart/state/selectors/tree.ts @@ -14,16 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { GlobalChartState } from '../../../../state/chart_state'; -import { getSpecsFromStore } from '../../../../state/utils'; + import { ChartTypes } from '../../..'; -import { PartitionSpec } from '../../specs/index'; import { SpecTypes } from '../../../../specs/settings'; -import { getHierarchyOfArrays } from '../../layout/viewmodel/hierarchy_of_arrays'; +import { GlobalChartState } from '../../../../state/chart_state'; +import { getSpecsFromStore } from '../../../../state/utils'; import { HierarchyOfArrays } from '../../layout/utils/group_by_rollup'; +import { getHierarchyOfArrays } from '../../layout/viewmodel/hierarchy_of_arrays'; +import { PartitionSpec } from '../../specs'; const getSpecs = (state: GlobalChartState) => state.specs; diff --git a/src/chart_types/specs.ts b/src/chart_types/specs.ts index d411a892a0..19c73f31e4 100644 --- a/src/chart_types/specs.ts +++ b/src/chart_types/specs.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export { AreaSeries, diff --git a/src/chart_types/xy_chart/annotations/annotation_marker.test.tsx b/src/chart_types/xy_chart/annotations/annotation_marker.test.tsx index 1a468a794f..17499feb4f 100644 --- a/src/chart_types/xy_chart/annotations/annotation_marker.test.tsx +++ b/src/chart_types/xy_chart/annotations/annotation_marker.test.tsx @@ -14,19 +14,21 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { AnnotationDomainTypes, AnnotationSpec, AnnotationTypes } from '../utils/specs'; + +import { ChartTypes } from '../..'; +import { Scale, ScaleType, ScaleContinuous } from '../../../scales'; +import { SpecTypes } from '../../../specs/settings'; import { Position, Rotation } from '../../../utils/commons'; -import { DEFAULT_ANNOTATION_LINE_STYLE } from '../../../utils/themes/theme'; import { Dimensions } from '../../../utils/dimensions'; import { GroupId } from '../../../utils/ids'; -import { Scale, ScaleType, ScaleContinuous } from '../../../scales'; -import { SpecTypes } from '../../../specs/settings'; +import { DEFAULT_ANNOTATION_LINE_STYLE } from '../../../utils/themes/theme'; +import { AnnotationDomainTypes, AnnotationSpec, AnnotationTypes } from '../utils/specs'; import { computeLineAnnotationDimensions } from './line/dimensions'; import { AnnotationLineProps } from './line/types'; -import { ChartTypes } from '../..'; describe('annotation marker', () => { const groupId = 'foo-group'; diff --git a/src/chart_types/xy_chart/annotations/line/dimensions.integration.test.ts b/src/chart_types/xy_chart/annotations/line/dimensions.integration.test.ts index fbe6622adc..828b6f20c3 100644 --- a/src/chart_types/xy_chart/annotations/line/dimensions.integration.test.ts +++ b/src/chart_types/xy_chart/annotations/line/dimensions.integration.test.ts @@ -14,14 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { MockStore } from '../../../../mocks/store'; import { MockSeriesSpec, MockAnnotationSpec, MockGlobalSpec } from '../../../../mocks/specs'; -import { computeAnnotationDimensionsSelector } from '../../state/selectors/compute_annotations'; +import { MockStore } from '../../../../mocks/store'; import { ScaleType } from '../../../../scales'; -import { AnnotationDomainTypes } from '../../utils/specs'; import { Position } from '../../../../utils/commons'; +import { computeAnnotationDimensionsSelector } from '../../state/selectors/compute_annotations'; +import { AnnotationDomainTypes } from '../../utils/specs'; function expectAnnotationAtPosition( data: Array<{ x: number; y: number }>, @@ -33,13 +34,11 @@ function expectAnnotationAtPosition( ) { const store = MockStore.default(); const settings = MockGlobalSpec.settingsNoMargins(); - const specs = new Array(numOfSpecs).fill(0).map((d, i) => { - return MockSeriesSpec.byTypePartial(type)({ - id: `spec_${i}`, - xScaleType, - data, - }); - }); + const specs = new Array(numOfSpecs).fill(0).map((d, i) => MockSeriesSpec.byTypePartial(type)({ + id: `spec_${i}`, + xScaleType, + data, + })); const annotation = MockAnnotationSpec.line({ dataValues: [ { diff --git a/src/chart_types/xy_chart/annotations/line/dimensions.ts b/src/chart_types/xy_chart/annotations/line/dimensions.ts index 28f56de25a..51959b781c 100644 --- a/src/chart_types/xy_chart/annotations/line/dimensions.ts +++ b/src/chart_types/xy_chart/annotations/line/dimensions.ts @@ -14,18 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { AnnotationDomainTypes, LineAnnotationSpec, LineAnnotationDatum } from '../../utils/specs'; +import { Scale } from '../../../../scales'; +import { isContinuousScale, isBandScale } from '../../../../scales/types'; import { Position, Rotation } from '../../../../utils/commons'; -import { AnnotationMarker } from '../types'; -import { isHorizontalRotation } from '../../state/utils'; import { Dimensions } from '../../../../utils/dimensions'; -import { Scale } from '../../../../scales'; import { GroupId } from '../../../../utils/ids'; +import { isHorizontalRotation, computeXScaleOffset } from '../../state/utils'; +import { AnnotationDomainTypes, LineAnnotationSpec, LineAnnotationDatum } from '../../utils/specs'; +import { AnnotationMarker } from '../types'; import { AnnotationLineProps, AnnotationLinePathPoints } from './types'; -import { isContinuousScale, isBandScale } from '../../../../scales/types'; -import { computeXScaleOffset } from '../../state/utils'; /** @internal */ export const DEFAULT_LINE_OVERFLOW = 0; @@ -45,8 +45,7 @@ function computeYDomainLineAnnotationDimensions( const isHorizontalChartRotation = isHorizontalRotation(chartRotation); // let's use a default Bottom-X/Left-Y axis orientation if we are not showing an axis // but we are displaying a line annotation - const anchorPosition = - axisPosition === null ? (isHorizontalChartRotation ? Position.Left : Position.Bottom) : axisPosition; + const anchorPosition = axisPosition === null ? (isHorizontalChartRotation ? Position.Left : Position.Bottom) : axisPosition; const lineProps: AnnotationLineProps[] = []; dataValues.forEach((datum: LineAnnotationDatum) => { @@ -174,8 +173,7 @@ function computeXDomainLineAnnotationDimensions( const isHorizontalChartRotation = isHorizontalRotation(chartRotation); // let's use a default Bottom-X/Left-Y axis orientation if we are not showing an axis // but we are displaying a line annotation - const anchorPosition = - axisPosition === null ? (isHorizontalChartRotation ? Position.Bottom : Position.Left) : axisPosition; + const anchorPosition = axisPosition === null ? (isHorizontalChartRotation ? Position.Bottom : Position.Left) : axisPosition; dataValues.forEach((datum: LineAnnotationDatum) => { const { dataValue } = datum; @@ -197,14 +195,14 @@ function computeXDomainLineAnnotationDimensions( } annotationValueXposition = pureScaledValue - offset; } else { - annotationValueXposition = annotationValueXposition + (xScale.bandwidth * xScale.totalBarsInCluster) / 2; + annotationValueXposition += (xScale.bandwidth * xScale.totalBarsInCluster) / 2; } } else if (isBandScale(xScale)) { if (isHistogramMode) { const padding = (xScale.step - xScale.originalBandwidth) / 2; - annotationValueXposition = annotationValueXposition - padding; + annotationValueXposition -= padding; } else { - annotationValueXposition = annotationValueXposition + xScale.originalBandwidth / 2; + annotationValueXposition += xScale.originalBandwidth / 2; } } else { return; @@ -336,7 +334,7 @@ export function computeLineAnnotationDimensions( ); } - const groupId = annotationSpec.groupId; + const { groupId } = annotationSpec; const yScale = yScales.get(groupId); if (!yScale) { return null; diff --git a/src/chart_types/xy_chart/annotations/line/marker.test.tsx b/src/chart_types/xy_chart/annotations/line/marker.test.tsx index 5ba827f24a..0ba9cb85eb 100644 --- a/src/chart_types/xy_chart/annotations/line/marker.test.tsx +++ b/src/chart_types/xy_chart/annotations/line/marker.test.tsx @@ -14,19 +14,21 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { AnnotationDomainTypes, AnnotationSpec, AnnotationTypes } from '../../utils/specs'; + +import { ChartTypes } from '../../..'; +import { Scale, ScaleType, ScaleContinuous } from '../../../../scales'; +import { SpecTypes } from '../../../../specs/settings'; import { Position, Rotation } from '../../../../utils/commons'; -import { DEFAULT_ANNOTATION_LINE_STYLE } from '../../../../utils/themes/theme'; import { Dimensions } from '../../../../utils/dimensions'; import { GroupId } from '../../../../utils/ids'; -import { Scale, ScaleType, ScaleContinuous } from '../../../../scales'; +import { DEFAULT_ANNOTATION_LINE_STYLE } from '../../../../utils/themes/theme'; +import { AnnotationDomainTypes, AnnotationSpec, AnnotationTypes } from '../../utils/specs'; import { computeLineAnnotationDimensions } from './dimensions'; import { AnnotationLineProps } from './types'; -import { ChartTypes } from '../../..'; -import { SpecTypes } from '../../../../specs/settings'; describe('annotation marker', () => { const groupId = 'foo-group'; diff --git a/src/chart_types/xy_chart/annotations/line/tooltip.ts b/src/chart_types/xy_chart/annotations/line/tooltip.ts index 0899940534..f81fb6dfc5 100644 --- a/src/chart_types/xy_chart/annotations/line/tooltip.ts +++ b/src/chart_types/xy_chart/annotations/line/tooltip.ts @@ -14,17 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { AnnotationLineProps } from './types'; -import { isWithinRectBounds } from '../rect/dimensions'; -import { isXDomain, getTranformedCursor, invertTranformedCursor } from '../utils'; -import { AnnotationTooltipState, AnnotationMarker, Bounds } from '../types'; -import { getAxesSpecForSpecId } from '../../state/utils'; -import { AnnotationDomainType, AnnotationTypes, AxisSpec } from '../../utils/specs'; +import { Dimensions } from '../../../../utils/dimensions'; import { GroupId } from '../../../../utils/ids'; import { Point } from '../../../../utils/point'; -import { Dimensions } from '../../../../utils/dimensions'; +import { getAxesSpecForSpecId } from '../../state/utils'; +import { AnnotationDomainType, AnnotationTypes, AxisSpec } from '../../utils/specs'; +import { isWithinRectBounds } from '../rect/dimensions'; +import { AnnotationTooltipState, AnnotationMarker, Bounds } from '../types'; +import { isXDomain, getTranformedCursor, invertTranformedCursor } from '../utils'; +import { AnnotationLineProps } from './types'; /** @internal */ export function computeLineAnnotationTooltipState( diff --git a/src/chart_types/xy_chart/annotations/line/types.ts b/src/chart_types/xy_chart/annotations/line/types.ts index 1955d57aad..57dabc5792 100644 --- a/src/chart_types/xy_chart/annotations/line/types.ts +++ b/src/chart_types/xy_chart/annotations/line/types.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { Position } from '../../../../utils/commons'; import { AnnotationDetails, AnnotationMarker } from '../types'; diff --git a/src/chart_types/xy_chart/annotations/rect/dimensions.integration.test.ts b/src/chart_types/xy_chart/annotations/rect/dimensions.integration.test.ts index 7a2d9dd9c4..f0e82cc7c0 100644 --- a/src/chart_types/xy_chart/annotations/rect/dimensions.integration.test.ts +++ b/src/chart_types/xy_chart/annotations/rect/dimensions.integration.test.ts @@ -14,12 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { MockStore } from '../../../../mocks/store'; import { MockSeriesSpec, MockAnnotationSpec, MockGlobalSpec } from '../../../../mocks/specs'; -import { computeAnnotationDimensionsSelector } from '../../state/selectors/compute_annotations'; +import { MockStore } from '../../../../mocks/store'; import { ScaleType } from '../../../../scales'; +import { computeAnnotationDimensionsSelector } from '../../state/selectors/compute_annotations'; import { RectAnnotationDatum } from '../../utils/specs'; import { AnnotationRectProps } from './types'; @@ -38,13 +39,11 @@ function expectAnnotationAtPosition( ) { const store = MockStore.default(); const settings = MockGlobalSpec.settingsNoMargins(); - const specs = new Array(numOfSpecs).fill(0).map((d, i) => { - return MockSeriesSpec.byTypePartial(type)({ - id: `spec_${i}`, - xScaleType, - data, - }); - }); + const specs = new Array(numOfSpecs).fill(0).map((d, i) => MockSeriesSpec.byTypePartial(type)({ + id: `spec_${i}`, + xScaleType, + data, + })); const annotation = MockAnnotationSpec.rect({ dataValues, }); diff --git a/src/chart_types/xy_chart/annotations/rect/dimensions.ts b/src/chart_types/xy_chart/annotations/rect/dimensions.ts index 2af690dd9c..bea4321e9e 100644 --- a/src/chart_types/xy_chart/annotations/rect/dimensions.ts +++ b/src/chart_types/xy_chart/annotations/rect/dimensions.ts @@ -14,16 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { RectAnnotationDatum, RectAnnotationSpec } from '../../utils/specs'; -import { GroupId } from '../../../../utils/ids'; import { Scale, ScaleBand, ScaleContinuous } from '../../../../scales'; +import { isBandScale, isContinuousScale } from '../../../../scales/types'; +import { GroupId } from '../../../../utils/ids'; import { Point } from '../../../../utils/point'; +import { PrimitiveValue } from '../../../partition_chart/layout/utils/group_by_rollup'; +import { RectAnnotationDatum, RectAnnotationSpec } from '../../utils/specs'; import { Bounds } from '../types'; import { AnnotationRectProps } from './types'; -import { isBandScale, isContinuousScale } from '../../../../scales/types'; -import { PrimitiveValue } from '../../../partition_chart/layout/utils/group_by_rollup'; /** @internal */ export function isWithinRectBounds({ x, y }: Point, { startX, endX, startY, endY }: Bounds): boolean { @@ -41,7 +42,7 @@ export function computeRectAnnotationDimensions( isHistogram: boolean = false, ): AnnotationRectProps[] | null { const { dataValues } = annotationSpec; - const groupId = annotationSpec.groupId; + const { groupId } = annotationSpec; const yScale = yScales.get(groupId); if (!yScale) { return null; diff --git a/src/chart_types/xy_chart/annotations/rect/tooltip.ts b/src/chart_types/xy_chart/annotations/rect/tooltip.ts index 389bc8d9d2..ab8aac1921 100644 --- a/src/chart_types/xy_chart/annotations/rect/tooltip.ts +++ b/src/chart_types/xy_chart/annotations/rect/tooltip.ts @@ -14,16 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { AnnotationTypes } from '../../utils/specs'; import { Rotation } from '../../../../utils/commons'; import { Dimensions } from '../../../../utils/dimensions'; import { Point } from '../../../../utils/point'; -import { getTranformedCursor } from '../utils'; +import { AnnotationTypes } from '../../utils/specs'; import { AnnotationTooltipFormatter, AnnotationTooltipState, Bounds } from '../types'; -import { AnnotationRectProps } from './types'; +import { getTranformedCursor } from '../utils'; import { isWithinRectBounds } from './dimensions'; +import { AnnotationRectProps } from './types'; /** @internal */ export function computeRectAnnotationTooltipState( diff --git a/src/chart_types/xy_chart/annotations/rect/types.ts b/src/chart_types/xy_chart/annotations/rect/types.ts index 24e4d7c263..de9638df57 100644 --- a/src/chart_types/xy_chart/annotations/rect/types.ts +++ b/src/chart_types/xy_chart/annotations/rect/types.ts @@ -14,9 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ - -/** @internal */ + * under the License. + */ export interface AnnotationRectProps { rect: { x: number; diff --git a/src/chart_types/xy_chart/annotations/tooltip.ts b/src/chart_types/xy_chart/annotations/tooltip.ts index ff0adaab15..92f03a8fb9 100644 --- a/src/chart_types/xy_chart/annotations/tooltip.ts +++ b/src/chart_types/xy_chart/annotations/tooltip.ts @@ -14,18 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { AnnotationId } from '../../../utils/ids'; -import { AnnotationSpec, AxisSpec, isLineAnnotation, isRectAnnotation } from '../utils/specs'; import { Rotation } from '../../../utils/commons'; -import { AnnotationDimensions, AnnotationTooltipState } from './types'; import { Dimensions } from '../../../utils/dimensions'; +import { AnnotationId } from '../../../utils/ids'; +import { Point } from '../../../utils/point'; +import { AnnotationSpec, AxisSpec, isLineAnnotation, isRectAnnotation } from '../utils/specs'; import { computeLineAnnotationTooltipState } from './line/tooltip'; +import { AnnotationLineProps } from './line/types'; import { computeRectAnnotationTooltipState } from './rect/tooltip'; import { AnnotationRectProps } from './rect/types'; -import { Point } from '../../../utils/point'; -import { AnnotationLineProps } from './line/types'; +import { AnnotationDimensions, AnnotationTooltipState } from './types'; /** @internal */ export function computeAnnotationTooltipState( @@ -41,12 +42,13 @@ export function computeAnnotationTooltipState( .slice() .reverse() .sort(({ zIndex: a = Number.MIN_SAFE_INTEGER }, { zIndex: b = Number.MIN_SAFE_INTEGER }) => b - a); + // eslint-disable-next-line no-restricted-syntax for (const spec of sortedSpecs) { const annotationDimension = annotationDimensions.get(spec.id); if (spec.hideTooltips || !annotationDimension) { continue; } - const groupId = spec.groupId; + const { groupId } = spec; if (isLineAnnotation(spec)) { if (spec.hideLines) { diff --git a/src/chart_types/xy_chart/annotations/types.ts b/src/chart_types/xy_chart/annotations/types.ts index 8b7388202f..3541da443c 100644 --- a/src/chart_types/xy_chart/annotations/types.ts +++ b/src/chart_types/xy_chart/annotations/types.ts @@ -14,12 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { Position, Color } from '../../../utils/commons'; import { AnnotationType } from '../utils/specs'; import { AnnotationLineProps } from './line/types'; import { AnnotationRectProps } from './rect/types'; -import { Position, Color } from '../../../utils/commons'; export type AnnotationTooltipFormatter = (details?: string) => JSX.Element | null; diff --git a/src/chart_types/xy_chart/annotations/utils.test.ts b/src/chart_types/xy_chart/annotations/utils.test.ts index f4472f4264..0bd46c522b 100644 --- a/src/chart_types/xy_chart/annotations/utils.test.ts +++ b/src/chart_types/xy_chart/annotations/utils.test.ts @@ -14,9 +14,22 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + +import { ChartTypes } from '../..'; +import { MockGlobalSpec, MockSeriesSpec, MockAnnotationSpec } from '../../../mocks/specs'; +import { MockStore } from '../../../mocks/store'; +import { Scale, ScaleType, ScaleBand, ScaleContinuous } from '../../../scales'; +import { SpecTypes } from '../../../specs/settings'; +import { Position, Rotation } from '../../../utils/commons'; +import { Dimensions } from '../../../utils/dimensions'; +import { GroupId, AnnotationId } from '../../../utils/ids'; +import { Point } from '../../../utils/point'; +import { DEFAULT_ANNOTATION_LINE_STYLE } from '../../../utils/themes/theme'; +import { computeAnnotationDimensionsSelector } from '../state/selectors/compute_annotations'; import { AnnotationDomainTypes, AnnotationSpec, @@ -25,25 +38,14 @@ import { RectAnnotationSpec, AnnotationTypes, } from '../utils/specs'; -import { Position, Rotation } from '../../../utils/commons'; -import { DEFAULT_ANNOTATION_LINE_STYLE } from '../../../utils/themes/theme'; -import { Dimensions } from '../../../utils/dimensions'; -import { GroupId, AnnotationId } from '../../../utils/ids'; -import { Scale, ScaleType, ScaleBand, ScaleContinuous } from '../../../scales'; -import { computeAnnotationDimensions, getAnnotationAxis, getTranformedCursor, invertTranformedCursor } from './utils'; -import { AnnotationDimensions, AnnotationTooltipState, Bounds } from './types'; import { computeLineAnnotationDimensions } from './line/dimensions'; +import { computeLineAnnotationTooltipState } from './line/tooltip'; import { AnnotationLineProps } from './line/types'; import { computeRectAnnotationDimensions, isWithinRectBounds } from './rect/dimensions'; import { computeRectAnnotationTooltipState } from './rect/tooltip'; -import { Point } from '../../../utils/point'; -import { ChartTypes } from '../..'; -import { SpecTypes } from '../../../specs/settings'; -import { computeLineAnnotationTooltipState } from './line/tooltip'; import { computeAnnotationTooltipState } from './tooltip'; -import { MockStore } from '../../../mocks/store'; -import { MockGlobalSpec, MockSeriesSpec, MockAnnotationSpec } from '../../../mocks/specs'; -import { computeAnnotationDimensionsSelector } from '../state/selectors/compute_annotations'; +import { AnnotationDimensions, AnnotationTooltipState, Bounds } from './types'; +import { computeAnnotationDimensions, getAnnotationAxis, getTranformedCursor, invertTranformedCursor } from './utils'; describe('annotation utils', () => { const minRange = 0; diff --git a/src/chart_types/xy_chart/annotations/utils.ts b/src/chart_types/xy_chart/annotations/utils.ts index 24064c51c3..ae4a17928d 100644 --- a/src/chart_types/xy_chart/annotations/utils.ts +++ b/src/chart_types/xy_chart/annotations/utils.ts @@ -14,8 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { Scale } from '../../../scales'; +import { Rotation, Position } from '../../../utils/commons'; +import { Dimensions } from '../../../utils/dimensions'; +import { AnnotationId, GroupId } from '../../../utils/ids'; +import { Point } from '../../../utils/point'; +import { getAxesSpecForSpecId, isHorizontalRotation } from '../state/utils'; import { AnnotationDomainType, AnnotationDomainTypes, @@ -24,14 +31,8 @@ import { isLineAnnotation, isRectAnnotation, } from '../utils/specs'; -import { Dimensions } from '../../../utils/dimensions'; -import { AnnotationId, GroupId } from '../../../utils/ids'; -import { Scale } from '../../../scales'; -import { getAxesSpecForSpecId, isHorizontalRotation } from '../state/utils'; -import { Point } from '../../../utils/point'; import { computeLineAnnotationDimensions } from './line/dimensions'; import { computeRectAnnotationDimensions } from './rect/dimensions'; -import { Rotation, Position } from '../../../utils/commons'; import { AnnotationDimensions } from './types'; /** @internal */ @@ -77,14 +78,15 @@ export function getTranformedCursor( } switch (chartRotation) { - case 0: - return { x, y }; case 90: return { x: y, y: width - x }; case -90: return { x: height - y, y: x }; case 180: return { x: width - x, y: height - y }; + case 0: + default: + return { x, y }; } } @@ -114,13 +116,14 @@ export function invertTranformedCursor( x = cursorPosition.y; break; case 180: + default: y = height - cursorPosition.y; x = width - cursorPosition.x; } if (projectArea) { - x = x + left; - y = y + top; + x += left; + y += top; } return { x, y }; diff --git a/src/chart_types/xy_chart/crosshair/crosshair_line.test.ts b/src/chart_types/xy_chart/crosshair/crosshair_line.test.ts index f777379f3b..06f618da21 100644 --- a/src/chart_types/xy_chart/crosshair/crosshair_line.test.ts +++ b/src/chart_types/xy_chart/crosshair/crosshair_line.test.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { getCursorLinePosition } from './crosshair_utils'; diff --git a/src/chart_types/xy_chart/crosshair/crosshair_utils.linear_snap.test.ts b/src/chart_types/xy_chart/crosshair/crosshair_utils.linear_snap.test.ts index b3f8604ec2..8f6e837944 100644 --- a/src/chart_types/xy_chart/crosshair/crosshair_utils.linear_snap.test.ts +++ b/src/chart_types/xy_chart/crosshair/crosshair_utils.linear_snap.test.ts @@ -14,16 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { ChartTypes } from '../..'; +import { ScaleType } from '../../../scales'; +import { SpecTypes } from '../../../specs/settings'; +import { Dimensions } from '../../../utils/dimensions'; +import { computeSeriesDomains } from '../state/utils'; import { computeXScale } from '../utils/scales'; import { BasicSeriesSpec, SeriesTypes } from '../utils/specs'; -import { Dimensions } from '../../../utils/dimensions'; -import { ScaleType } from '../../../scales'; import { getCursorBandPosition, getSnapPosition } from './crosshair_utils'; -import { computeSeriesDomains } from '../state/utils'; -import { ChartTypes } from '../..'; -import { SpecTypes } from '../../../specs/settings'; describe('Crosshair utils linear scale', () => { const barSeries1SpecId = 'barSeries1'; @@ -305,7 +306,7 @@ describe('Crosshair utils linear scale', () => { }); }); - test("changes on y mouse position doesn't change the band position", () => { + test('changes on y mouse position doesn\'t change the band position', () => { const bandPosition = getCursorBandPosition( chartRotation, chartDimensions, @@ -398,7 +399,7 @@ describe('Crosshair utils linear scale', () => { }); }); - test("changes on y mouse position doesn't change the band position", () => { + test('changes on y mouse position doesn\'t change the band position', () => { const bandPosition = getCursorBandPosition( chartRotation, chartDimensions, @@ -512,7 +513,7 @@ describe('Crosshair utils linear scale', () => { }); }); - test("changes on y mouse position doesn't change the band position", () => { + test('changes on y mouse position doesn\'t change the band position', () => { const bandPosition = getCursorBandPosition( chartRotation, chartDimensions, @@ -606,7 +607,7 @@ describe('Crosshair utils linear scale', () => { }); }); - test("changes on y mouse position doesn't change the band position", () => { + test('changes on y mouse position doesn\'t change the band position', () => { const bandPosition = getCursorBandPosition( chartRotation, chartDimensions, @@ -719,7 +720,7 @@ describe('Crosshair utils linear scale', () => { }); }); - test("changes on x mouse position doesn't change the band position", () => { + test('changes on x mouse position doesn\'t change the band position', () => { const bandPosition = getCursorBandPosition( chartRotation, chartDimensions, @@ -813,7 +814,7 @@ describe('Crosshair utils linear scale', () => { }); }); - test("changes on x mouse position doesn't change the band position", () => { + test('changes on x mouse position doesn\'t change the band position', () => { const bandPosition = getCursorBandPosition( chartRotation, chartDimensions, @@ -926,7 +927,7 @@ describe('Crosshair utils linear scale', () => { }); }); - test("changes on x mouse position doesn't change the band position", () => { + test('changes on x mouse position doesn\'t change the band position', () => { const bandPosition = getCursorBandPosition( chartRotation, chartDimensions, @@ -1020,7 +1021,7 @@ describe('Crosshair utils linear scale', () => { }); }); - test("changes on x mouse position doesn't change the band position", () => { + test('changes on x mouse position doesn\'t change the band position', () => { const bandPosition = getCursorBandPosition( chartRotation, chartDimensions, @@ -1136,7 +1137,7 @@ describe('Crosshair utils linear scale', () => { }); }); - test("changes on y mouse position doesn't change the band position", () => { + test('changes on y mouse position doesn\'t change the band position', () => { const bandPosition = getCursorBandPosition( chartRotation, chartDimensions, @@ -1246,7 +1247,7 @@ describe('Crosshair utils linear scale', () => { }); }); - test("changes on y mouse position doesn't change the band position", () => { + test('changes on y mouse position doesn\'t change the band position', () => { const bandPosition = getCursorBandPosition( chartRotation, chartDimensions, @@ -1340,7 +1341,7 @@ describe('Crosshair utils linear scale', () => { }); }); - test("changes on x mouse position doesn't change the band position", () => { + test('changes on x mouse position doesn\'t change the band position', () => { const bandPosition = getCursorBandPosition( chartRotation, chartDimensions, @@ -1434,7 +1435,7 @@ describe('Crosshair utils linear scale', () => { }); }); - test("changes on x mouse position doesn't change the band position", () => { + test('changes on x mouse position doesn\'t change the band position', () => { const bandPosition = getCursorBandPosition( chartRotation, chartDimensions, diff --git a/src/chart_types/xy_chart/crosshair/crosshair_utils.ordinal_snap.test.ts b/src/chart_types/xy_chart/crosshair/crosshair_utils.ordinal_snap.test.ts index 1c3c631c74..5d14b34a4d 100644 --- a/src/chart_types/xy_chart/crosshair/crosshair_utils.ordinal_snap.test.ts +++ b/src/chart_types/xy_chart/crosshair/crosshair_utils.ordinal_snap.test.ts @@ -14,15 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { ChartTypes } from '../..'; +import { ScaleType } from '../../../scales'; +import { SpecTypes } from '../../../specs/settings'; +import { computeSeriesDomains } from '../state/utils'; import { computeXScale } from '../utils/scales'; import { BasicSeriesSpec, SeriesTypes } from '../utils/specs'; -import { ScaleType } from '../../../scales'; import { getSnapPosition } from './crosshair_utils'; -import { computeSeriesDomains } from '../state/utils'; -import { ChartTypes } from '../..'; -import { SpecTypes } from '../../../specs/settings'; describe('Crosshair utils ordinal scales', () => { const barSeries1SpecId = 'barSeries1'; diff --git a/src/chart_types/xy_chart/crosshair/crosshair_utils.ts b/src/chart_types/xy_chart/crosshair/crosshair_utils.ts index 5b4a4dd7f6..571761aae5 100644 --- a/src/chart_types/xy_chart/crosshair/crosshair_utils.ts +++ b/src/chart_types/xy_chart/crosshair/crosshair_utils.ts @@ -14,14 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { TooltipAnchorPosition } from '../../../components/tooltip/types'; +import { Scale } from '../../../scales'; import { Rotation } from '../../../utils/commons'; import { Dimensions } from '../../../utils/dimensions'; -import { Scale } from '../../../scales'; -import { isHorizontalRotation, isVerticalRotation } from '../state/utils'; import { Point } from '../../../utils/point'; -import { TooltipAnchorPosition } from '../../../components/tooltip/types'; +import { isHorizontalRotation, isVerticalRotation } from '../state/utils'; export interface SnappedPosition { position: number; @@ -49,12 +50,11 @@ export function getSnapPosition( position: position - halfPadding * totalBarsInCluster, band: band * totalBarsInCluster, }; - } else { - return { - position, - band: DEFAULT_SNAP_POSITION_BAND, - }; } + return { + position, + band: DEFAULT_SNAP_POSITION_BAND, + }; } /** @internal */ @@ -77,16 +77,15 @@ export function getCursorLinePosition( top: crosshairTop, height: 0, }; - } else { - const crosshairLeft = projectedPointerPosition.x + left; - - return { - top, - left: crosshairLeft, - width: 0, - height, - }; } + const crosshairLeft = projectedPointerPosition.x + left; + + return { + top, + left: crosshairLeft, + width: 0, + height, + }; } /** @internal */ @@ -148,24 +147,23 @@ export function getCursorBandPosition( height, visible: true, }; - } else { - const adjustedTop = snapEnabled ? position : cursorPosition.x; - let topPosition = chartRotation === 90 ? top + adjustedTop : height + top - adjustedTop - bandOffset; - let adjustedHeight = band; - if (band > 1 && topPosition + band > top + height) { - adjustedHeight = band - (topPosition + band - (top + height)); - } else if (band > 1 && topPosition < top) { - adjustedHeight = band - (top - topPosition); - topPosition = top; - } - return { - top: topPosition, - left, - width, - height: adjustedHeight, - visible: true, - }; } + const adjustedTop = snapEnabled ? position : cursorPosition.x; + let topPosition = chartRotation === 90 ? top + adjustedTop : height + top - adjustedTop - bandOffset; + let adjustedHeight = band; + if (band > 1 && topPosition + band > top + height) { + adjustedHeight = band - (topPosition + band - (top + height)); + } else if (band > 1 && topPosition < top) { + adjustedHeight = band - (top - topPosition); + topPosition = top; + } + return { + top: topPosition, + left, + width, + height: adjustedHeight, + visible: true, + }; } /** @internal */ diff --git a/src/chart_types/xy_chart/domains/domain.ts b/src/chart_types/xy_chart/domains/domain.ts index 1fe4d9b42c..c899a35105 100644 --- a/src/chart_types/xy_chart/domains/domain.ts +++ b/src/chart_types/xy_chart/domains/domain.ts @@ -14,10 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { Domain } from '../../../utils/domain'; import { ScaleType } from '../../../scales'; +import { Domain } from '../../../utils/domain'; export interface BaseDomain { scaleType: ScaleType; diff --git a/src/chart_types/xy_chart/domains/x_domain.test.ts b/src/chart_types/xy_chart/domains/x_domain.test.ts index 0dae6c31af..418fd0a6fc 100644 --- a/src/chart_types/xy_chart/domains/x_domain.test.ts +++ b/src/chart_types/xy_chart/domains/x_domain.test.ts @@ -14,14 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { ChartTypes } from '../..'; import { ScaleType } from '../../../scales'; +import { SpecTypes } from '../../../specs/settings'; import { getSplittedSeries } from '../utils/series'; import { BasicSeriesSpec, SeriesTypes } from '../utils/specs'; import { convertXScaleTypes, findMinInterval, mergeXDomain } from './x_domain'; -import { ChartTypes } from '../..'; -import { SpecTypes } from '../../../specs/settings'; describe('X Domain', () => { test('Should return null when missing specs or specs types', () => { @@ -336,7 +337,7 @@ describe('X Domain', () => { ); expect(mergedDomain.domain).toEqual([0, 7]); }); - test('Should merge multi bar series correctly', () => { + test('Should merge multi bar series correctly - 2', () => { const ds1: BasicSeriesSpec = { chartType: ChartTypes.XYAxis, specType: SpecTypes.Series, diff --git a/src/chart_types/xy_chart/domains/x_domain.ts b/src/chart_types/xy_chart/domains/x_domain.ts index 603121d0ef..667a847b44 100644 --- a/src/chart_types/xy_chart/domains/x_domain.ts +++ b/src/chart_types/xy_chart/domains/x_domain.ts @@ -14,18 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { isCompleteBound, isLowerBound, isUpperBound } from '../utils/axis_utils'; +import { ScaleType } from '../../../scales'; import { compareByValueAsc, identity, isNumberArray } from '../../../utils/commons'; import { computeContinuousDataDomain, computeOrdinalDataDomain, Domain } from '../../../utils/domain'; -import { ScaleType } from '../../../scales'; +import { isCompleteBound, isLowerBound, isUpperBound } from '../utils/axis_utils'; import { BasicSeriesSpec, DomainRange, SeriesTypes } from '../utils/specs'; import { BaseDomain } from './domain'; export type XDomain = BaseDomain & { type: 'xDomain'; - /* the minimum interval of the scale if not-ordinal band-scale*/ + /* the minimum interval of the scale if not-ordinal band-scale */ minInterval: number; /** if x domain is time, we should also specify the timezone */ timeZone?: string; @@ -59,7 +60,7 @@ export function mergeXDomain( if (Array.isArray(customXDomain)) { seriesXComputedDomains = customXDomain; } else { - throw new Error('xDomain for ordinal scale should be an array of values, not a DomainRange object'); + throw new TypeError('xDomain for ordinal scale should be an array of values, not a DomainRange object'); } } } else { @@ -72,7 +73,7 @@ export function mergeXDomain( } if (customXDomain) { if (Array.isArray(customXDomain)) { - throw new Error('xDomain for continuous scale should be a DomainRange object, not an array'); + throw new TypeError('xDomain for continuous scale should be a DomainRange object, not an array'); } customMinInterval = customXDomain.minInterval; diff --git a/src/chart_types/xy_chart/domains/y_domain.test.ts b/src/chart_types/xy_chart/domains/y_domain.test.ts index eb689c739f..74f4fc98f7 100644 --- a/src/chart_types/xy_chart/domains/y_domain.test.ts +++ b/src/chart_types/xy_chart/domains/y_domain.test.ts @@ -14,12 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { ChartTypes } from '../..'; +import { MockRawDataSeries, MockRawDataSeriesDatum } from '../../../mocks'; import { ScaleType } from '../../../scales'; +import { SpecTypes } from '../../../specs/settings'; +import { BARCHART_1Y0G } from '../../../utils/data_samples/test_dataset'; +import { GroupId } from '../../../utils/ids'; import { RawDataSeries } from '../utils/series'; import { BasicSeriesSpec, DomainRange, SeriesTypes } from '../utils/specs'; -import { BARCHART_1Y0G } from '../../../utils/data_samples/test_dataset'; import { coerceYScaleTypes, getDataSeriesOnGroup, @@ -27,10 +32,6 @@ import { splitSpecsByGroupId, YBasicSeriesSpec, } from './y_domain'; -import { GroupId } from '../../../utils/ids'; -import { ChartTypes } from '../..'; -import { SpecTypes } from '../../../specs/settings'; -import { MockRawDataSeries, MockRawDataSeriesDatum } from '../../../mocks'; describe('Y Domain', () => { test('Should merge Y domain', () => { diff --git a/src/chart_types/xy_chart/domains/y_domain.ts b/src/chart_types/xy_chart/domains/y_domain.ts index e42a5fbfd2..4189b808b6 100644 --- a/src/chart_types/xy_chart/domains/y_domain.ts +++ b/src/chart_types/xy_chart/domains/y_domain.ts @@ -14,17 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import { sum } from 'd3-array'; -import { BasicSeriesSpec, DomainRange, DEFAULT_GLOBAL_ID, SeriesTypes } from '../utils/specs'; -import { GroupId, SpecId } from '../../../utils/ids'; import { ScaleContinuousType, ScaleType } from '../../../scales'; +import { identity } from '../../../utils/commons'; +import { computeContinuousDataDomain } from '../../../utils/domain'; +import { GroupId, SpecId } from '../../../utils/ids'; import { isCompleteBound, isLowerBound, isUpperBound } from '../utils/axis_utils'; -import { BaseDomain } from './domain'; import { RawDataSeries } from '../utils/series'; -import { computeContinuousDataDomain } from '../../../utils/domain'; -import { identity } from '../../../utils/commons'; -import { sum } from 'd3-array'; +import { BasicSeriesSpec, DomainRange, DEFAULT_GLOBAL_ID, SeriesTypes } from '../utils/specs'; +import { BaseDomain } from './domain'; export type YDomain = BaseDomain & { type: 'yDomain'; @@ -98,16 +100,12 @@ function mergeYDomainForGroup( domain = computeContinuousDataDomain([0, 1], identity, customDomain?.fit); } else { // compute stacked domain - const isStackedScaleToExtent = groupSpecs.stacked.some((spec) => { - return spec.yScaleToDataExtent; - }); + const isStackedScaleToExtent = groupSpecs.stacked.some(({ yScaleToDataExtent }) => yScaleToDataExtent); const stackedDataSeries = getDataSeriesOnGroup(dataSeries, groupSpecs.stacked); const stackedDomain = computeYStackedDomain(stackedDataSeries, isStackedScaleToExtent, customDomain?.fit); // compute non stacked domain - const isNonStackedScaleToExtent = groupSpecs.nonStacked.some((spec) => { - return spec.yScaleToDataExtent; - }); + const isNonStackedScaleToExtent = groupSpecs.nonStacked.some(({ yScaleToDataExtent }) => yScaleToDataExtent); const nonStackedDataSeries = getDataSeriesOnGroup(dataSeries, groupSpecs.nonStacked); const nonStackedDomain = computeYNonStackedDomain( nonStackedDataSeries, @@ -146,7 +144,7 @@ function mergeYDomainForGroup( type: 'yDomain', isBandScale: false, scaleType: groupYScaleType, - groupId: groupId, + groupId, domain, }; } @@ -176,6 +174,7 @@ function computeYStackedDomain( }); }); const dataValues = []; + // eslint-disable-next-line no-restricted-syntax for (const stackValues of stackMap) { dataValues.push(...stackValues[1]); if (stackValues[1].length > 1) { @@ -213,9 +212,7 @@ export function splitSpecsByGroupId(specs: YBasicSeriesSpec[]) { // After mobx->redux https://github.com/elastic/elastic-charts/pull/281 we keep the specs untouched on mount // in MobX version, the stackAccessors was programmatically added to every histogram specs // in ReduX version, we left untouched the specs, so we have to manually check that - const isHistogramEnabled = specs.some(({ seriesType, enableHistogramMode }) => { - return seriesType === SeriesTypes.Bar && enableHistogramMode; - }); + const isHistogramEnabled = specs.some(({ seriesType, enableHistogramMode }) => seriesType === SeriesTypes.Bar && enableHistogramMode); // split each specs by groupId and by stacked or not specs.forEach((spec) => { const group = specsByGroupIds.get(spec.groupId) || { @@ -226,8 +223,8 @@ export function splitSpecsByGroupId(specs: YBasicSeriesSpec[]) { // stack every bars if using histogram mode // independenyly from lines and areas if ( - (spec.seriesType === SeriesTypes.Bar && isHistogramEnabled) || - (spec.stackAccessors && spec.stackAccessors.length > 0) + (spec.seriesType === SeriesTypes.Bar && isHistogramEnabled) + || (spec.stackAccessors && spec.stackAccessors.length > 0) ) { group.stacked.push(spec); } else { @@ -263,7 +260,7 @@ export function coerceYScaleTypes(specs: Pick[]): function coerceYScale(scaleTypes: Set): ScaleContinuousType { if (scaleTypes.size === 1) { const scales = scaleTypes.values(); - const value = scales.next().value; + const { value } = scales.next(); return value; } return ScaleType.Linear; diff --git a/src/chart_types/xy_chart/legend/legend.test.ts b/src/chart_types/xy_chart/legend/legend.test.ts index 5dda11072d..e9174b913d 100644 --- a/src/chart_types/xy_chart/legend/legend.test.ts +++ b/src/chart_types/xy_chart/legend/legend.test.ts @@ -14,16 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { ChartTypes } from '../..'; +import { LegendItem } from '../../../commons/legend'; import { ScaleType } from '../../../scales'; -import { computeLegend } from './legend'; +import { SpecTypes } from '../../../specs/settings'; +import { Position } from '../../../utils/commons'; import { SeriesCollectionValue, getSeriesName } from '../utils/series'; import { AxisSpec, BasicSeriesSpec, SeriesTypes } from '../utils/specs'; -import { Position } from '../../../utils/commons'; -import { ChartTypes } from '../..'; -import { SpecTypes } from '../../../specs/settings'; -import { LegendItem } from '../../../commons/legend'; +import { computeLegend } from './legend'; const nullDisplayValue = { formatted: null, @@ -107,9 +108,7 @@ const axisSpec: AxisSpec = { position: Position.Left, tickSize: 10, tickPadding: 10, - tickFormat: (value: any) => { - return `${value}`; - }, + tickFormat: (value: any) => `${value}`, }; axesSpecs.push(axisSpec); @@ -139,7 +138,7 @@ describe('Legends', () => { defaultExtra: nullDisplayValue, }, ]; - expect(Array.from(legend.values())).toEqual(expected); + expect([...legend.values()]).toEqual(expected); }); it('compute legend for a single spec but with multiple series', () => { seriesCollection.set('seriesCollectionValue1a', seriesCollectionValue1a); @@ -167,7 +166,7 @@ describe('Legends', () => { defaultExtra: nullDisplayValue, }, ]; - expect(Array.from(legend.values())).toEqual(expected); + expect([...legend.values()]).toEqual(expected); }); it('compute legend for multiple specs', () => { seriesCollection.set('seriesCollectionValue1a', seriesCollectionValue1a); @@ -195,7 +194,7 @@ describe('Legends', () => { defaultExtra: nullDisplayValue, }, ]; - expect(Array.from(legend.values())).toEqual(expected); + expect([...legend.values()]).toEqual(expected); }); it('empty legend for missing spec', () => { seriesCollection.set('seriesCollectionValue2b', seriesCollectionValue2b); @@ -218,7 +217,7 @@ describe('Legends', () => { defaultExtra: nullDisplayValue, }, ]; - expect(Array.from(legend.values())).toEqual(expected); + expect([...legend.values()]).toEqual(expected); }); it('default all series legend items to visible when deselectedDataSeries is null', () => { seriesCollection.set('seriesCollectionValue1a', seriesCollectionValue1a); diff --git a/src/chart_types/xy_chart/legend/legend.ts b/src/chart_types/xy_chart/legend/legend.ts index 0da1997809..2cd36e6974 100644 --- a/src/chart_types/xy_chart/legend/legend.ts +++ b/src/chart_types/xy_chart/legend/legend.ts @@ -14,21 +14,22 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { getAxesSpecForSpecId, getSpecsById } from '../state/utils'; +import { LegendItem } from '../../../commons/legend'; +import { SeriesKey, SeriesIdentifier } from '../../../commons/series_id'; import { identity, Color } from '../../../utils/commons'; +import { BandedAccessorType } from '../../../utils/geometry'; +import { getAxesSpecForSpecId, getSpecsById } from '../state/utils'; +import { Y0_ACCESSOR_POSTFIX, Y1_ACCESSOR_POSTFIX } from '../tooltip/tooltip'; import { SeriesCollectionValue, getSeriesIndex, getSortedDataSeriesColorsValuesMap, getSeriesName, } from '../utils/series'; -import { SeriesKey, SeriesIdentifier } from '../../../commons/series_id'; import { AxisSpec, BasicSeriesSpec, Postfixes, isAreaSeriesSpec, isBarSeriesSpec } from '../utils/specs'; -import { Y0_ACCESSOR_POSTFIX, Y1_ACCESSOR_POSTFIX } from '../tooltip/tooltip'; -import { BandedAccessorType } from '../../../utils/geometry'; -import { LegendItem } from '../../../commons/legend'; /** @internal */ export interface FormattedLastValues { diff --git a/src/chart_types/xy_chart/renderer/canvas/annotations/index.ts b/src/chart_types/xy_chart/renderer/canvas/annotations/index.ts index a3c0c6bc68..659606b4a9 100644 --- a/src/chart_types/xy_chart/renderer/canvas/annotations/index.ts +++ b/src/chart_types/xy_chart/renderer/canvas/annotations/index.ts @@ -14,17 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { AnnotationDimensions } from '../../../annotations/types'; -import { AnnotationSpec, isLineAnnotation, isRectAnnotation } from '../../../utils/specs'; -import { getSpecsById } from '../../../state/utils'; import { AnnotationId } from '../../../../../utils/ids'; import { mergeWithDefaultAnnotationLine, mergeWithDefaultAnnotationRect } from '../../../../../utils/themes/theme'; -import { renderLineAnnotations } from './lines'; import { AnnotationLineProps } from '../../../annotations/line/types'; -import { renderRectAnnotations } from './rect'; import { AnnotationRectProps } from '../../../annotations/rect/types'; +import { AnnotationDimensions } from '../../../annotations/types'; +import { getSpecsById } from '../../../state/utils'; +import { AnnotationSpec, isLineAnnotation, isRectAnnotation } from '../../../utils/specs'; +import { renderLineAnnotations } from './lines'; +import { renderRectAnnotations } from './rect'; interface AnnotationProps { annotationDimensions: Map; diff --git a/src/chart_types/xy_chart/renderer/canvas/annotations/lines.ts b/src/chart_types/xy_chart/renderer/canvas/annotations/lines.ts index fc0af7b44c..e9bbab59c0 100644 --- a/src/chart_types/xy_chart/renderer/canvas/annotations/lines.ts +++ b/src/chart_types/xy_chart/renderer/canvas/annotations/lines.ts @@ -14,12 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { Stroke, Line } from '../../../../../geoms/types'; +import { LineAnnotationStyle } from '../../../../../utils/themes/theme'; import { stringToRGB } from '../../../../partition_chart/layout/utils/color_library_wrappers'; import { AnnotationLineProps } from '../../../annotations/line/types'; -import { LineAnnotationStyle } from '../../../../../utils/themes/theme'; import { renderMultiLine } from '../primitives/line'; /** @internal */ @@ -41,7 +42,7 @@ export function renderLineAnnotations( }; }); const strokeColor = stringToRGB(lineStyle.line.stroke); - strokeColor.opacity = strokeColor.opacity * lineStyle.line.opacity; + strokeColor.opacity *= lineStyle.line.opacity; const stroke: Stroke = { color: strokeColor, width: lineStyle.line.strokeWidth, diff --git a/src/chart_types/xy_chart/renderer/canvas/annotations/rect.ts b/src/chart_types/xy_chart/renderer/canvas/annotations/rect.ts index c16310fba1..bb5c7e22a6 100644 --- a/src/chart_types/xy_chart/renderer/canvas/annotations/rect.ts +++ b/src/chart_types/xy_chart/renderer/canvas/annotations/rect.ts @@ -14,14 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { renderRect } from '../primitives/rect'; import { Rect, Fill, Stroke } from '../../../../../geoms/types'; -import { AnnotationRectProps } from '../../../annotations/rect/types'; +import { withContext } from '../../../../../renderers/canvas'; import { RectAnnotationStyle } from '../../../../../utils/themes/theme'; import { stringToRGB } from '../../../../partition_chart/layout/utils/color_library_wrappers'; -import { withContext } from '../../../../../renderers/canvas'; +import { AnnotationRectProps } from '../../../annotations/rect/types'; +import { renderRect } from '../primitives/rect'; /** @internal */ export function renderRectAnnotations( @@ -29,16 +30,14 @@ export function renderRectAnnotations( annotations: AnnotationRectProps[], rectStyle: RectAnnotationStyle, ) { - const rects = annotations.map((annotation) => { - return annotation.rect; - }); + const rects = annotations.map(({ rect }) => rect); const fillColor = stringToRGB(rectStyle.fill); - fillColor.opacity = fillColor.opacity * rectStyle.opacity; + fillColor.opacity *= rectStyle.opacity; const fill: Fill = { color: fillColor, }; const strokeColor = stringToRGB(rectStyle.stroke); - strokeColor.opacity = strokeColor.opacity * rectStyle.opacity; + strokeColor.opacity *= rectStyle.opacity; const stroke: Stroke = { color: strokeColor, width: rectStyle.strokeWidth, diff --git a/src/chart_types/xy_chart/renderer/canvas/areas.ts b/src/chart_types/xy_chart/renderer/canvas/areas.ts index 48d3517331..be2efa875b 100644 --- a/src/chart_types/xy_chart/renderer/canvas/areas.ts +++ b/src/chart_types/xy_chart/renderer/canvas/areas.ts @@ -14,16 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { getGeometryStateStyle } from '../../rendering/rendering'; -import { AreaGeometry } from '../../../../utils/geometry'; -import { SharedGeometryStateStyle } from '../../../../utils/themes/theme'; import { LegendItem } from '../../../../commons/legend'; +import { Rect } from '../../../../geoms/types'; import { withClip, withContext } from '../../../../renderers/canvas'; +import { AreaGeometry } from '../../../../utils/geometry'; +import { SharedGeometryStateStyle } from '../../../../utils/themes/theme'; +import { getGeometryStateStyle } from '../../rendering/rendering'; import { renderPoints } from './points'; import { renderLinePaths, renderAreaPath } from './primitives/path'; -import { Rect } from '../../../../geoms/types'; import { buildAreaStyles } from './styles/area'; import { buildLineStyles } from './styles/line'; @@ -42,8 +43,8 @@ export function renderAreas(ctx: CanvasRenderingContext2D, props: AreaGeometries withClip(ctx, clippings, (ctx: CanvasRenderingContext2D) => { ctx.save(); - for (let i = 0; i < areas.length; i++) { - const glyph = areas[i]; + // eslint-disable-next-line no-restricted-syntax + for (const glyph of areas) { const { seriesAreaLineStyle, seriesAreaStyle } = glyph; if (seriesAreaStyle.visible) { withContext(ctx, () => { diff --git a/src/chart_types/xy_chart/renderer/canvas/axes/index.ts b/src/chart_types/xy_chart/renderer/canvas/axes/index.ts index 948394e1cf..2ddfff4135 100644 --- a/src/chart_types/xy_chart/renderer/canvas/axes/index.ts +++ b/src/chart_types/xy_chart/renderer/canvas/axes/index.ts @@ -14,20 +14,21 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { AxisTick, AxisTicksDimensions } from '../../../utils/axis_utils'; -import { AxisSpec } from '../../../utils/specs'; -import { AxisConfig } from '../../../../../utils/themes/theme'; +import { withContext } from '../../../../../renderers/canvas'; import { Dimensions } from '../../../../../utils/dimensions'; import { AxisId } from '../../../../../utils/ids'; +import { AxisConfig } from '../../../../../utils/themes/theme'; import { getSpecsById } from '../../../state/utils'; -import { withContext } from '../../../../../renderers/canvas'; +import { AxisTick, AxisTicksDimensions } from '../../../utils/axis_utils'; +import { AxisSpec } from '../../../utils/specs'; import { renderDebugRect } from '../utils/debug'; -import { renderTitle } from './title'; import { renderLine } from './line'; -import { renderTickLabel } from './tick_label'; import { renderTick } from './tick'; +import { renderTickLabel } from './tick_label'; +import { renderTitle } from './title'; /** @internal */ export interface AxisProps { @@ -90,14 +91,14 @@ function renderAxis(ctx: CanvasRenderingContext2D, props: AxisProps) { renderLine(ctx, props); }); withContext(ctx, (ctx) => { - ticks.map((tick) => { + ticks.forEach((tick) => { renderTick(ctx, tick, props); }); }); withContext(ctx, (ctx) => { ticks .filter((tick) => tick.label !== null) - .map((tick) => { + .forEach((tick) => { renderTickLabel(ctx, tick, props); }); }); diff --git a/src/chart_types/xy_chart/renderer/canvas/axes/line.ts b/src/chart_types/xy_chart/renderer/canvas/axes/line.ts index 6a243b3c44..d1c12f863e 100644 --- a/src/chart_types/xy_chart/renderer/canvas/axes/line.ts +++ b/src/chart_types/xy_chart/renderer/canvas/axes/line.ts @@ -14,11 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { isVerticalAxis } from '../../../utils/axis_utils'; import { AxisProps } from '.'; import { Position } from '../../../../../utils/commons'; +import { isVerticalAxis } from '../../../utils/axis_utils'; /** @internal */ export function renderLine(ctx: CanvasRenderingContext2D, props: AxisProps) { diff --git a/src/chart_types/xy_chart/renderer/canvas/axes/tick.ts b/src/chart_types/xy_chart/renderer/canvas/axes/tick.ts index 246bd475a8..210fadbf06 100644 --- a/src/chart_types/xy_chart/renderer/canvas/axes/tick.ts +++ b/src/chart_types/xy_chart/renderer/canvas/axes/tick.ts @@ -14,14 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { AxisTick, isVerticalAxis } from '../../../utils/axis_utils'; import { AxisProps } from '.'; import { Position } from '../../../../../utils/commons'; import { TickStyle } from '../../../../../utils/themes/theme'; -import { renderLine, MIN_STROKE_WIDTH } from '../primitives/line'; import { stringToRGB } from '../../../../partition_chart/layout/utils/color_library_wrappers'; +import { AxisTick, isVerticalAxis } from '../../../utils/axis_utils'; +import { renderLine, MIN_STROKE_WIDTH } from '../primitives/line'; /** @internal */ export function renderTick(ctx: CanvasRenderingContext2D, tick: AxisTick, props: AxisProps) { diff --git a/src/chart_types/xy_chart/renderer/canvas/axes/tick_label.ts b/src/chart_types/xy_chart/renderer/canvas/axes/tick_label.ts index 2cd16b5aea..fc2c81f972 100644 --- a/src/chart_types/xy_chart/renderer/canvas/axes/tick_label.ts +++ b/src/chart_types/xy_chart/renderer/canvas/axes/tick_label.ts @@ -14,14 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { AxisTick, getTickLabelProps } from '../../../utils/axis_utils'; import { AxisProps } from '.'; +import { withContext } from '../../../../../renderers/canvas'; +import { Font, FontStyle } from '../../../../partition_chart/layout/types/types'; +import { AxisTick, getTickLabelProps } from '../../../utils/axis_utils'; import { renderText } from '../primitives/text'; import { renderDebugRectCenterRotated } from '../utils/debug'; -import { Font, FontStyle } from '../../../../partition_chart/layout/types/types'; -import { withContext } from '../../../../../renderers/canvas'; /** @internal */ export function renderTickLabel(ctx: CanvasRenderingContext2D, tick: AxisTick, props: AxisProps) { diff --git a/src/chart_types/xy_chart/renderer/canvas/axes/title.ts b/src/chart_types/xy_chart/renderer/canvas/axes/title.ts index 1c6d1dd305..36f0ff2331 100644 --- a/src/chart_types/xy_chart/renderer/canvas/axes/title.ts +++ b/src/chart_types/xy_chart/renderer/canvas/axes/title.ts @@ -14,14 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { AxisProps } from '.'; -import { isHorizontalAxis } from '../../../utils/axis_utils'; -import { renderDebugRect } from '../utils/debug'; -import { renderText } from '../primitives/text'; import { Position } from '../../../../../utils/commons'; import { Font, FontStyle } from '../../../../partition_chart/layout/types/types'; +import { isHorizontalAxis } from '../../../utils/axis_utils'; +import { renderText } from '../primitives/text'; +import { renderDebugRect } from '../utils/debug'; /** @internal */ export function renderTitle(ctx: CanvasRenderingContext2D, props: AxisProps) { diff --git a/src/chart_types/xy_chart/renderer/canvas/bars.ts b/src/chart_types/xy_chart/renderer/canvas/bars.ts index ba0f473ca3..8cc18dbb3c 100644 --- a/src/chart_types/xy_chart/renderer/canvas/bars.ts +++ b/src/chart_types/xy_chart/renderer/canvas/bars.ts @@ -14,16 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { LegendItem } from '../../../../commons/legend'; +import { Rect } from '../../../../geoms/types'; import { withContext, withClip } from '../../../../renderers/canvas'; import { BarGeometry } from '../../../../utils/geometry'; -import { buildBarStyles } from './styles/bar'; import { SharedGeometryStateStyle } from '../../../../utils/themes/theme'; import { getGeometryStateStyle } from '../../rendering/rendering'; -import { LegendItem } from '../../../../commons/legend'; import { renderRect } from './primitives/rect'; -import { Rect } from '../../../../geoms/types'; +import { buildBarStyles } from './styles/bar'; /** @internal */ export function renderBars( diff --git a/src/chart_types/xy_chart/renderer/canvas/bubbles.ts b/src/chart_types/xy_chart/renderer/canvas/bubbles.ts index b118f853fb..ae8b6de34f 100644 --- a/src/chart_types/xy_chart/renderer/canvas/bubbles.ts +++ b/src/chart_types/xy_chart/renderer/canvas/bubbles.ts @@ -14,16 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { getGeometryStateStyle } from '../../rendering/rendering'; +import { LegendItem } from '../../../../commons/legend'; +import { SeriesKey } from '../../../../commons/series_id'; +import { Rect } from '../../../../geoms/types'; +import { withContext, withClip } from '../../../../renderers/canvas'; import { BubbleGeometry, PointGeometry } from '../../../../utils/geometry'; import { SharedGeometryStateStyle, GeometryStateStyle, PointStyle } from '../../../../utils/themes/theme'; -import { withContext, withClip } from '../../../../renderers/canvas'; +import { getGeometryStateStyle } from '../../rendering/rendering'; import { renderPointGroup } from './points'; -import { Rect } from '../../../../geoms/types'; -import { LegendItem } from '../../../../commons/legend'; -import { SeriesKey } from '../../../../commons/series_id'; interface BubbleGeometriesDataProps { animated?: boolean; diff --git a/src/chart_types/xy_chart/renderer/canvas/grids.ts b/src/chart_types/xy_chart/renderer/canvas/grids.ts index 7a54956ac1..a72df02e23 100644 --- a/src/chart_types/xy_chart/renderer/canvas/grids.ts +++ b/src/chart_types/xy_chart/renderer/canvas/grids.ts @@ -14,18 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { AxisLinePosition, isVerticalGrid } from '../../utils/axis_utils'; -import { mergeGridLineConfigs, Theme } from '../../../../utils/themes/theme'; +import { Line, Stroke } from '../../../../geoms/types'; +import { withContext } from '../../../../renderers/canvas'; import { Dimensions } from '../../../../utils/dimensions'; import { AxisId } from '../../../../utils/ids'; -import { AxisSpec } from '../../../../chart_types/xy_chart/utils/specs'; +import { mergeGridLineConfigs, Theme } from '../../../../utils/themes/theme'; +import { stringToRGB } from '../../../partition_chart/layout/utils/color_library_wrappers'; import { getSpecsById } from '../../state/utils'; +import { AxisLinePosition, isVerticalGrid } from '../../utils/axis_utils'; +import { AxisSpec } from '../../utils/specs'; import { renderMultiLine, MIN_STROKE_WIDTH } from './primitives/line'; -import { Line, Stroke } from '../../../../geoms/types'; -import { stringToRGB } from '../../../partition_chart/layout/utils/color_library_wrappers'; -import { withContext } from '../../../../renderers/canvas'; interface GridProps { chartTheme: Theme; @@ -52,21 +53,13 @@ export function renderGrids(ctx: CanvasRenderingContext2D, props: GridProps) { return; } const strokeColor = stringToRGB(gridLineStyle.stroke); - strokeColor.opacity = - gridLineStyle.opacity !== undefined ? strokeColor.opacity * gridLineStyle.opacity : strokeColor.opacity; + strokeColor.opacity = gridLineStyle.opacity !== undefined ? strokeColor.opacity * gridLineStyle.opacity : strokeColor.opacity; const stroke: Stroke = { color: strokeColor, width: gridLineStyle.strokeWidth, dash: gridLineStyle.dash, }; - const lines = axisGridLinesPositions.map((position) => { - return { - x1: position[0], - y1: position[1], - x2: position[2], - y2: position[3], - }; - }); + const lines = axisGridLinesPositions.map(([x1, y1, x2, y2]) => ({ x1, y1, x2, y2 })); renderMultiLine(ctx, lines, stroke); } }); diff --git a/src/chart_types/xy_chart/renderer/canvas/lines.ts b/src/chart_types/xy_chart/renderer/canvas/lines.ts index 3ef02c4e57..0e5d75f974 100644 --- a/src/chart_types/xy_chart/renderer/canvas/lines.ts +++ b/src/chart_types/xy_chart/renderer/canvas/lines.ts @@ -14,16 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { getGeometryStateStyle } from '../../rendering/rendering'; -import { LineGeometry } from '../../../../utils/geometry'; -import { SharedGeometryStateStyle } from '../../../../utils/themes/theme'; import { LegendItem } from '../../../../commons/legend'; +import { Rect } from '../../../../geoms/types'; import { withContext, withClip } from '../../../../renderers/canvas'; +import { LineGeometry } from '../../../../utils/geometry'; +import { SharedGeometryStateStyle } from '../../../../utils/themes/theme'; +import { getGeometryStateStyle } from '../../rendering/rendering'; import { renderPoints } from './points'; import { renderLinePaths } from './primitives/path'; -import { Rect } from '../../../../geoms/types'; import { buildLineStyles } from './styles/line'; interface LineGeometriesDataProps { diff --git a/src/chart_types/xy_chart/renderer/canvas/points.ts b/src/chart_types/xy_chart/renderer/canvas/points.ts index 9710422789..3db4866d2c 100644 --- a/src/chart_types/xy_chart/renderer/canvas/points.ts +++ b/src/chart_types/xy_chart/renderer/canvas/points.ts @@ -14,14 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { SeriesKey } from '../../../../commons/series_id'; +import { Circle, Stroke, Fill } from '../../../../geoms/types'; import { PointGeometry } from '../../../../utils/geometry'; import { PointStyle, GeometryStateStyle } from '../../../../utils/themes/theme'; import { renderCircle } from './primitives/arc'; -import { Circle, Stroke, Fill } from '../../../../geoms/types'; import { buildPointStyles } from './styles/point'; -import { SeriesKey } from '../../../../commons/series_id'; /** * Renders points from single series diff --git a/src/chart_types/xy_chart/renderer/canvas/primitives/arc.ts b/src/chart_types/xy_chart/renderer/canvas/primitives/arc.ts index de946ab61c..ae661f6e2b 100644 --- a/src/chart_types/xy_chart/renderer/canvas/primitives/arc.ts +++ b/src/chart_types/xy_chart/renderer/canvas/primitives/arc.ts @@ -14,10 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { withContext } from '../../../../../renderers/canvas'; import { Circle, Stroke, Fill, Arc } from '../../../../../geoms/types'; +import { withContext } from '../../../../../renderers/canvas'; import { RGBtoString } from '../../../../partition_chart/layout/utils/color_library_wrappers'; import { MIN_STROKE_WIDTH } from './line'; diff --git a/src/chart_types/xy_chart/renderer/canvas/primitives/line.ts b/src/chart_types/xy_chart/renderer/canvas/primitives/line.ts index 4be6c6442e..092d17211a 100644 --- a/src/chart_types/xy_chart/renderer/canvas/primitives/line.ts +++ b/src/chart_types/xy_chart/renderer/canvas/primitives/line.ts @@ -14,11 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { Stroke, Line } from '../../../../../geoms/types'; -import { RGBtoString } from '../../../../partition_chart/layout/utils/color_library_wrappers'; import { withContext } from '../../../../../renderers/canvas'; +import { RGBtoString } from '../../../../partition_chart/layout/utils/color_library_wrappers'; /** * Canvas2d stroke ignores an exact zero line width diff --git a/src/chart_types/xy_chart/renderer/canvas/primitives/path.ts b/src/chart_types/xy_chart/renderer/canvas/primitives/path.ts index 6c93b69327..f7c9790050 100644 --- a/src/chart_types/xy_chart/renderer/canvas/primitives/path.ts +++ b/src/chart_types/xy_chart/renderer/canvas/primitives/path.ts @@ -14,12 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { ClippedRanges } from '../../../../../utils/geometry'; +import { Rect, Stroke, Fill } from '../../../../../geoms/types'; import { withContext, withClipRanges } from '../../../../../renderers/canvas'; +import { ClippedRanges } from '../../../../../utils/geometry'; import { RGBtoString } from '../../../../partition_chart/layout/utils/color_library_wrappers'; -import { Rect, Stroke, Fill } from '../../../../../geoms/types'; import { MIN_STROKE_WIDTH } from './line'; /** @internal */ @@ -34,19 +35,19 @@ export function renderLinePaths( ctx.translate(transformX, 0); if (clippedRanges.length > 0) { withClipRanges(ctx, clippedRanges, clippings, false, (ctx) => { - linePaths.map((path) => { + linePaths.forEach((path) => { renderPathStroke(ctx, path, stroke); }); }); withClipRanges(ctx, clippedRanges, clippings, true, (ctx) => { - linePaths.map((path) => { + linePaths.forEach((path) => { renderPathStroke(ctx, path, { ...stroke, dash: [5, 5] }); }); }); return; } - linePaths.map((path) => { + linePaths.forEach((path) => { withContext(ctx, (ctx) => { renderPathStroke(ctx, path, stroke); }); diff --git a/src/chart_types/xy_chart/renderer/canvas/primitives/rect.ts b/src/chart_types/xy_chart/renderer/canvas/primitives/rect.ts index ac6e14e218..846a450bb2 100644 --- a/src/chart_types/xy_chart/renderer/canvas/primitives/rect.ts +++ b/src/chart_types/xy_chart/renderer/canvas/primitives/rect.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { Rect, Fill, Stroke } from '../../../../../geoms/types'; import { RGBtoString } from '../../../../partition_chart/layout/utils/color_library_wrappers'; @@ -86,7 +87,7 @@ export function renderMultiRect(ctx: CanvasRenderingContext2D, rects: Rect[], fi const { width, height, x, y } = rects[i]; ctx.moveTo(x, y); ctx.lineTo(x + width, y); - ctx.lineTo(x + width, y + height!); + ctx.lineTo(x + width, y + height); ctx.lineTo(x, y + height); ctx.lineTo(x, y); } diff --git a/src/chart_types/xy_chart/renderer/canvas/primitives/text.ts b/src/chart_types/xy_chart/renderer/canvas/primitives/text.ts index eabdea47de..5ab3ca8094 100644 --- a/src/chart_types/xy_chart/renderer/canvas/primitives/text.ts +++ b/src/chart_types/xy_chart/renderer/canvas/primitives/text.ts @@ -14,12 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { withContext, withRotatedOrigin } from '../../../../../renderers/canvas'; +import { Point } from '../../../../../utils/point'; import { Font, TextAlign, TextBaseline } from '../../../../partition_chart/layout/types/types'; import { cssFontShorthand, measureText } from '../../../../partition_chart/layout/utils/measure'; -import { Point } from '../../../../../utils/point'; /** @internal */ export function renderText( @@ -91,14 +92,14 @@ export function wrapLines( let lineWidth = getTextWidth(line); if (fixedWidth && lineWidth > maxWidth) { while (line.length > 0) { - let low = 0, - high = line.length, - match = '', - matchWidth = 0; + let low = 0; + let high = line.length; + let match = ''; + let matchWidth = 0; while (low < high) { - const mid = (low + high) >>> 1, - substr = line.slice(0, mid + 1), - substrWidth = getTextWidth(substr) + additionalWidth; + const mid = (low + high) >>> 1; + const substr = line.slice(0, mid + 1); + const substrWidth = getTextWidth(substr) + additionalWidth; if (substrWidth <= maxWidth) { low = mid + 1; match = substr + (shouldAddEllipsis ? ELLIPSIS : ''); @@ -123,7 +124,7 @@ export function wrapLines( matchWidth = getTextWidth(match); } } - match = match.trimRight(); + match = match.trimEnd(); textArr.push(match); textWidth = Math.max(textWidth, matchWidth); currentHeightPx += lineHeightPx; @@ -131,7 +132,7 @@ export function wrapLines( break; } line = line.slice(low); - line = line.trimLeft(); + line = line.trimStart(); if (line.length > 0) { lineWidth = getTextWidth(line); if (lineWidth <= maxWidth) { diff --git a/src/chart_types/xy_chart/renderer/canvas/renderers.ts b/src/chart_types/xy_chart/renderer/canvas/renderers.ts index c11becb0cb..cc0a8a7efb 100644 --- a/src/chart_types/xy_chart/renderer/canvas/renderers.ts +++ b/src/chart_types/xy_chart/renderer/canvas/renderers.ts @@ -14,21 +14,22 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { Rect } from '../../../../geoms/types'; import { withContext, renderLayers, clearCanvas } from '../../../../renderers/canvas'; -import { renderBars } from './bars'; +import { stringToRGB } from '../../../partition_chart/layout/utils/color_library_wrappers'; +import { renderAnnotations } from './annotations'; import { renderAreas } from './areas'; -import { renderLines } from './lines'; import { renderAxes } from './axes'; +import { renderBars } from './bars'; +import { renderBubbles } from './bubbles'; import { renderGrids } from './grids'; -import { ReactiveChartStateProps } from './xy_chart'; -import { renderAnnotations } from './annotations'; -import { renderBarValues } from './values/bar'; +import { renderLines } from './lines'; import { renderDebugRect } from './utils/debug'; -import { stringToRGB } from '../../../partition_chart/layout/utils/color_library_wrappers'; -import { Rect } from '../../../../geoms/types'; -import { renderBubbles } from './bubbles'; +import { renderBarValues } from './values/bar'; +import { ReactiveChartStateProps } from './xy_chart'; /** @internal */ export function renderXYChartCanvas2d( @@ -66,7 +67,7 @@ export function renderXYChartCanvas2d( // The layers are callbacks, because of the need to not bake in the `ctx`, it feels more composable and uncoupled this way. renderLayers(ctx, [ // clear the canvas - (ctx: CanvasRenderingContext2D) => clearCanvas(ctx, 200000, 200000 /*, backgroundColor*/), + (ctx: CanvasRenderingContext2D) => clearCanvas(ctx, 200000, 200000 /* , backgroundColor */), (ctx: CanvasRenderingContext2D) => { renderAxes(ctx, { diff --git a/src/chart_types/xy_chart/renderer/canvas/styles/area.test.ts b/src/chart_types/xy_chart/renderer/canvas/styles/area.test.ts index 66a7d0bb1e..e08bdcddc2 100644 --- a/src/chart_types/xy_chart/renderer/canvas/styles/area.test.ts +++ b/src/chart_types/xy_chart/renderer/canvas/styles/area.test.ts @@ -14,13 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { MockStyles } from '../../../../../mocks'; -import { buildAreaStyles } from './area'; import { Fill } from '../../../../../geoms/types'; +import { MockStyles } from '../../../../../mocks'; import { getColorFromVariant } from '../../../../../utils/commons'; import { stringToRGB } from '../../../../partition_chart/layout/utils/color_library_wrappers'; +import { buildAreaStyles } from './area'; jest.mock('../../../../partition_chart/layout/utils/color_library_wrappers'); jest.mock('../../../../../utils/commons'); diff --git a/src/chart_types/xy_chart/renderer/canvas/styles/area.ts b/src/chart_types/xy_chart/renderer/canvas/styles/area.ts index b1ed8afaec..efe4f802ce 100644 --- a/src/chart_types/xy_chart/renderer/canvas/styles/area.ts +++ b/src/chart_types/xy_chart/renderer/canvas/styles/area.ts @@ -14,12 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { GeometryStateStyle, AreaStyle } from '../../../../../utils/themes/theme'; -import { stringToRGB, OpacityFn } from '../../../../partition_chart/layout/utils/color_library_wrappers'; import { Fill } from '../../../../../geoms/types'; import { getColorFromVariant } from '../../../../../utils/commons'; +import { GeometryStateStyle, AreaStyle } from '../../../../../utils/themes/theme'; +import { OpacityFn, stringToRGB } from '../../../../partition_chart/layout/utils/color_library_wrappers'; /** * Return the rendering props for an area. The color of the area will be overwritten diff --git a/src/chart_types/xy_chart/renderer/canvas/styles/bar.test.ts b/src/chart_types/xy_chart/renderer/canvas/styles/bar.test.ts index 565bb75907..25f6ea07a8 100644 --- a/src/chart_types/xy_chart/renderer/canvas/styles/bar.test.ts +++ b/src/chart_types/xy_chart/renderer/canvas/styles/bar.test.ts @@ -14,13 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { MockStyles } from '../../../../../mocks'; -import { buildBarStyles } from './bar'; import { Fill, Stroke } from '../../../../../geoms/types'; +import { MockStyles } from '../../../../../mocks'; import { getColorFromVariant } from '../../../../../utils/commons'; import { stringToRGB } from '../../../../partition_chart/layout/utils/color_library_wrappers'; +import { buildBarStyles } from './bar'; jest.mock('../../../../partition_chart/layout/utils/color_library_wrappers'); jest.mock('../../../../../utils/commons'); diff --git a/src/chart_types/xy_chart/renderer/canvas/styles/bar.ts b/src/chart_types/xy_chart/renderer/canvas/styles/bar.ts index bb3e24efd9..b18ff02c30 100644 --- a/src/chart_types/xy_chart/renderer/canvas/styles/bar.ts +++ b/src/chart_types/xy_chart/renderer/canvas/styles/bar.ts @@ -14,12 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { GeometryStateStyle, RectStyle, RectBorderStyle } from '../../../../../utils/themes/theme'; -import { stringToRGB, OpacityFn } from '../../../../partition_chart/layout/utils/color_library_wrappers'; import { Stroke, Fill } from '../../../../../geoms/types'; import { getColorFromVariant } from '../../../../../utils/commons'; +import { GeometryStateStyle, RectStyle, RectBorderStyle } from '../../../../../utils/themes/theme'; +import { stringToRGB, OpacityFn } from '../../../../partition_chart/layout/utils/color_library_wrappers'; /** * Return the rendering styles (stroke and fill) for a bar. @@ -44,8 +45,9 @@ export function buildBarStyles( const fill: Fill = { color: fillColor, }; - const defaultStrokeOpacity = - themeRectBorderStyle.strokeOpacity === undefined ? themeRectStyle.opacity : themeRectBorderStyle.strokeOpacity; + const defaultStrokeOpacity = themeRectBorderStyle.strokeOpacity === undefined + ? themeRectStyle.opacity + : themeRectBorderStyle.strokeOpacity; const borderStrokeOpacity = defaultStrokeOpacity * geometryStateStyle.opacity; const strokeOpacity: OpacityFn = (opacity) => opacity * borderStrokeOpacity; const strokeColor = stringToRGB(getColorFromVariant(baseColor, themeRectBorderStyle.stroke), strokeOpacity); diff --git a/src/chart_types/xy_chart/renderer/canvas/styles/line.test.ts b/src/chart_types/xy_chart/renderer/canvas/styles/line.test.ts index a56a7edb34..b3f855122d 100644 --- a/src/chart_types/xy_chart/renderer/canvas/styles/line.test.ts +++ b/src/chart_types/xy_chart/renderer/canvas/styles/line.test.ts @@ -14,13 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { MockStyles } from '../../../../../mocks'; -import { buildLineStyles } from './line'; import { Stroke } from '../../../../../geoms/types'; +import { MockStyles } from '../../../../../mocks'; import { getColorFromVariant } from '../../../../../utils/commons'; import { stringToRGB } from '../../../../partition_chart/layout/utils/color_library_wrappers'; +import { buildLineStyles } from './line'; jest.mock('../../../../partition_chart/layout/utils/color_library_wrappers'); jest.mock('../../../../../utils/commons'); diff --git a/src/chart_types/xy_chart/renderer/canvas/styles/line.ts b/src/chart_types/xy_chart/renderer/canvas/styles/line.ts index b88d8637c0..a9893b8582 100644 --- a/src/chart_types/xy_chart/renderer/canvas/styles/line.ts +++ b/src/chart_types/xy_chart/renderer/canvas/styles/line.ts @@ -14,12 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { GeometryStateStyle, LineStyle } from '../../../../../utils/themes/theme'; -import { stringToRGB, OpacityFn } from '../../../../partition_chart/layout/utils/color_library_wrappers'; import { Stroke } from '../../../../../geoms/types'; import { getColorFromVariant } from '../../../../../utils/commons'; +import { GeometryStateStyle, LineStyle } from '../../../../../utils/themes/theme'; +import { stringToRGB, OpacityFn } from '../../../../partition_chart/layout/utils/color_library_wrappers'; /** * Return the rendering props for a line. The color of the line will be overwritten diff --git a/src/chart_types/xy_chart/renderer/canvas/styles/point.test.ts b/src/chart_types/xy_chart/renderer/canvas/styles/point.test.ts index f89b8424c0..45c66346d1 100644 --- a/src/chart_types/xy_chart/renderer/canvas/styles/point.test.ts +++ b/src/chart_types/xy_chart/renderer/canvas/styles/point.test.ts @@ -14,14 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { MockStyles } from '../../../../../mocks'; -import { buildPointStyles } from './point'; import { Fill, Stroke } from '../../../../../geoms/types'; +import { MockStyles } from '../../../../../mocks'; import { getColorFromVariant } from '../../../../../utils/commons'; -import { stringToRGB } from '../../../../partition_chart/layout/utils/color_library_wrappers'; import { PointStyle } from '../../../../../utils/themes/theme'; +import { stringToRGB } from '../../../../partition_chart/layout/utils/color_library_wrappers'; +import { buildPointStyles } from './point'; jest.mock('../../../../partition_chart/layout/utils/color_library_wrappers'); jest.mock('../../../../../utils/commons'); @@ -166,12 +167,12 @@ describe('Point styles', () => { }); it('should return fill with color', () => { - const { opacity, ...color } = stringToRGB(overrides.fill!); + const { opacity, ...color } = stringToRGB(overrides.fill); expect(result.fill.color).toMatchObject(color); }); it('should return stroke with color', () => { - const { opacity, ...color } = stringToRGB(overrides.stroke!); + const { opacity, ...color } = stringToRGB(overrides.stroke); expect(result.stroke.color).toMatchObject(color); }); diff --git a/src/chart_types/xy_chart/renderer/canvas/styles/point.ts b/src/chart_types/xy_chart/renderer/canvas/styles/point.ts index c900799cc5..aadb96b5ce 100644 --- a/src/chart_types/xy_chart/renderer/canvas/styles/point.ts +++ b/src/chart_types/xy_chart/renderer/canvas/styles/point.ts @@ -14,12 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { PointStyle, GeometryStateStyle } from '../../../../../utils/themes/theme'; -import { stringToRGB, OpacityFn } from '../../../../partition_chart/layout/utils/color_library_wrappers'; import { Fill, Stroke } from '../../../../../geoms/types'; import { mergePartial, getColorFromVariant } from '../../../../../utils/commons'; +import { PointStyle, GeometryStateStyle } from '../../../../../utils/themes/theme'; +import { stringToRGB, OpacityFn } from '../../../../partition_chart/layout/utils/color_library_wrappers'; /** * Return the fill, stroke and radius styles for a point geometry. diff --git a/src/chart_types/xy_chart/renderer/canvas/styles/points.test.ts b/src/chart_types/xy_chart/renderer/canvas/styles/points.test.ts index 65c7426fcc..3a3f5a0947 100644 --- a/src/chart_types/xy_chart/renderer/canvas/styles/points.test.ts +++ b/src/chart_types/xy_chart/renderer/canvas/styles/points.test.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { getRadius } from './point'; diff --git a/src/chart_types/xy_chart/renderer/canvas/utils/debug.ts b/src/chart_types/xy_chart/renderer/canvas/utils/debug.ts index 904dfeb554..d7706a0d08 100644 --- a/src/chart_types/xy_chart/renderer/canvas/utils/debug.ts +++ b/src/chart_types/xy_chart/renderer/canvas/utils/debug.ts @@ -14,12 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { withContext } from '../../../../../renderers/canvas'; import { Fill, Stroke, Rect } from '../../../../../geoms/types'; -import { renderRect } from '../primitives/rect'; +import { withContext } from '../../../../../renderers/canvas'; import { Point } from '../../../../../utils/point'; +import { renderRect } from '../primitives/rect'; const DEFAULT_DEBUG_FILL: Fill = { color: { diff --git a/src/chart_types/xy_chart/renderer/canvas/values/bar.ts b/src/chart_types/xy_chart/renderer/canvas/values/bar.ts index 7ac452b70a..2647f787ac 100644 --- a/src/chart_types/xy_chart/renderer/canvas/values/bar.ts +++ b/src/chart_types/xy_chart/renderer/canvas/values/bar.ts @@ -14,17 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { Rect } from '../../../../../geoms/types'; import { Rotation } from '../../../../../utils/commons'; import { Dimensions } from '../../../../../utils/dimensions'; -import { Theme } from '../../../../../utils/themes/theme'; import { BarGeometry } from '../../../../../utils/geometry'; +import { Point } from '../../../../../utils/point'; +import { Theme } from '../../../../../utils/themes/theme'; +import { Font, FontStyle, TextBaseline, TextAlign } from '../../../../partition_chart/layout/types/types'; import { renderText, wrapLines } from '../primitives/text'; import { renderDebugRect } from '../utils/debug'; -import { Font, FontStyle, TextBaseline, TextAlign } from '../../../../partition_chart/layout/types/types'; -import { Point } from '../../../../../utils/point'; -import { Rect } from '../../../../../geoms/types'; interface BarValuesProps { theme: Theme; @@ -51,7 +52,7 @@ export function renderBarValues(ctx: CanvasRenderingContext2D, props: BarValuesP height: displayValue.height, }; const font: Font = { - fontFamily: fontFamily, + fontFamily, fontStyle: fontStyle ? (fontStyle as FontStyle) : 'normal', fontVariant: 'normal', fontWeight: 'normal', @@ -107,8 +108,8 @@ function repositionTextLine( ) { const { x, y } = origin; const { width, height } = box; - let lineX = x; - let lineY = y + i * height; + let lineX: number; + let lineY: number; switch (chartRotation) { case 180: lineX = x; @@ -117,9 +118,15 @@ function repositionTextLine( case -90: lineX = x; lineY = y; + break; case 90: lineX = x; lineY = y - (i - max + 1) * width; + break; + case 0: + default: + lineX = x; + lineY = y + i * height; } return { x: lineX, y: lineY }; diff --git a/src/chart_types/xy_chart/renderer/canvas/xy_chart.tsx b/src/chart_types/xy_chart/renderer/canvas/xy_chart.tsx index 115716b3de..09e2d1f4b0 100644 --- a/src/chart_types/xy_chart/renderer/canvas/xy_chart.tsx +++ b/src/chart_types/xy_chart/renderer/canvas/xy_chart.tsx @@ -14,23 +14,28 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React, { RefObject } from 'react'; import { connect } from 'react-redux'; import { bindActionCreators, Dispatch } from 'redux'; + +import { LegendItem } from '../../../../commons/legend'; import { onChartRendered } from '../../../../state/actions/chart'; import { GlobalChartState } from '../../../../state/chart_state'; import { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions'; import { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation'; import { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme'; +import { getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; +import { Rotation } from '../../../../utils/commons'; import { Dimensions } from '../../../../utils/dimensions'; +import { deepEqual } from '../../../../utils/fast_deep_equal'; import { AnnotationId, AxisId } from '../../../../utils/ids'; import { LIGHT_THEME } from '../../../../utils/themes/light_theme'; import { Theme } from '../../../../utils/themes/theme'; import { AnnotationDimensions } from '../../annotations/types'; -import { LegendItem } from '../../../../commons/legend'; import { computeAnnotationDimensionsSelector } from '../../state/selectors/compute_annotations'; import { computeAxisTicksDimensionsSelector } from '../../state/selectors/compute_axis_ticks_dimensions'; import { AxisVisibleTicks, computeAxisVisibleTicksSelector } from '../../state/selectors/compute_axis_visible_ticks'; @@ -39,15 +44,12 @@ import { computeChartTransformSelector } from '../../state/selectors/compute_cha import { computeSeriesGeometriesSelector } from '../../state/selectors/compute_series_geometries'; import { getHighlightedSeriesSelector } from '../../state/selectors/get_highlighted_series'; import { getAnnotationSpecsSelector, getAxisSpecsSelector } from '../../state/selectors/get_specs'; +import { isChartEmptySelector } from '../../state/selectors/is_chart_empty'; import { Geometries, Transform } from '../../state/utils'; import { AxisLinePosition, AxisTicksDimensions } from '../../utils/axis_utils'; +import { IndexedGeometryMap } from '../../utils/indexed_geometry_map'; import { AxisSpec, AnnotationSpec } from '../../utils/specs'; import { renderXYChartCanvas2d } from './renderers'; -import { isChartEmptySelector } from '../../state/selectors/is_chart_empty'; -import { deepEqual } from '../../../../utils/fast_deep_equal'; -import { Rotation } from '../../../../utils/commons'; -import { IndexedGeometryMap } from '../../utils/indexed_geometry_map'; -import { getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized'; /** @internal */ export interface ReactiveChartStateProps { @@ -80,32 +82,29 @@ interface ReactiveChartOwnProps { type XYChartProps = ReactiveChartStateProps & ReactiveChartDispatchProps & ReactiveChartOwnProps; class XYChartComponent extends React.Component { static displayName = 'XYChart'; + private ctx: CanvasRenderingContext2D | null; // see example https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio#Example private readonly devicePixelRatio: number; // fixme this be no constant: multi-monitor window drag may necessitate modifying the `` dimensions + constructor(props: Readonly) { super(props); this.ctx = null; this.devicePixelRatio = window.devicePixelRatio; } - private drawCanvas() { - if (this.ctx) { - const { chartDimensions, chartRotation } = this.props; - const clippings = { - x: 0, - y: 0, - width: [90, -90].includes(chartRotation) ? chartDimensions.height : chartDimensions.width, - height: [90, -90].includes(chartRotation) ? chartDimensions.width : chartDimensions.height, - }; - renderXYChartCanvas2d(this.ctx, this.devicePixelRatio, clippings, this.props); + componentDidMount() { + /* + * the DOM element has just been appended, and getContext('2d') is always non-null, + * so we could use a couple of ! non-null assertions but no big plus + */ + this.tryCanvasContext(); + if (this.props.initialized) { + this.drawCanvas(); + this.props.onChartRendered(); } } - private tryCanvasContext() { - const canvas = this.props.forwardStageRef.current; - this.ctx = canvas && canvas.getContext('2d'); - } shouldComponentUpdate(nextProps: ReactiveChartStateProps) { return !deepEqual(this.props, nextProps); } @@ -120,16 +119,24 @@ class XYChartComponent extends React.Component { } } - componentDidMount() { - // the DOM element has just been appended, and getContext('2d') is always non-null, - // so we could use a couple of ! non-null assertions but no big plus - this.tryCanvasContext(); - if (this.props.initialized) { - this.drawCanvas(); - this.props.onChartRendered(); + private drawCanvas() { + if (this.ctx) { + const { chartDimensions, chartRotation } = this.props; + const clippings = { + x: 0, + y: 0, + width: [90, -90].includes(chartRotation) ? chartDimensions.height : chartDimensions.width, + height: [90, -90].includes(chartRotation) ? chartDimensions.width : chartDimensions.height, + }; + renderXYChartCanvas2d(this.ctx, this.devicePixelRatio, clippings, this.props); } } + private tryCanvasContext() { + const canvas = this.props.forwardStageRef.current; + this.ctx = canvas && canvas.getContext('2d'); + } + render() { const { forwardStageRef, @@ -192,7 +199,7 @@ const DEFAULT_PROPS: ReactiveChartStateProps = { left: 0, top: 0, }, - chartRotation: 0 as 0, + chartRotation: 0 as const, chartDimensions: { width: 0, height: 0, diff --git a/src/chart_types/xy_chart/renderer/dom/annotations/annotation_tooltip.tsx b/src/chart_types/xy_chart/renderer/dom/annotations/annotation_tooltip.tsx index 6307b51f54..0e7eb78d4b 100644 --- a/src/chart_types/xy_chart/renderer/dom/annotations/annotation_tooltip.tsx +++ b/src/chart_types/xy_chart/renderer/dom/annotations/annotation_tooltip.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React, { useCallback, useMemo, useEffect } from 'react'; diff --git a/src/chart_types/xy_chart/renderer/dom/annotations/annotations.tsx b/src/chart_types/xy_chart/renderer/dom/annotations/annotations.tsx index daa5732fc8..15f4cda3f5 100644 --- a/src/chart_types/xy_chart/renderer/dom/annotations/annotations.tsx +++ b/src/chart_types/xy_chart/renderer/dom/annotations/annotations.tsx @@ -14,30 +14,31 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React, { useCallback } from 'react'; import { connect } from 'react-redux'; import { bindActionCreators, Dispatch } from 'redux'; -import { isLineAnnotation, AnnotationSpec } from '../../../utils/specs'; -import { AnnotationId } from '../../../../../utils/ids'; -import { AnnotationDimensions, AnnotationTooltipState } from '../../../annotations/types'; -import { Dimensions } from '../../../../../utils/dimensions'; +import { onPointerMove as onPointerMoveAction } from '../../../../../state/actions/mouse'; import { GlobalChartState, BackwardRef } from '../../../../../state/chart_state'; import { getInternalIsInitializedSelector } from '../../../../../state/selectors/get_internal_is_intialized'; +import { Dimensions } from '../../../../../utils/dimensions'; +import { AnnotationId } from '../../../../../utils/ids'; +import { AnnotationLineProps } from '../../../annotations/line/types'; +import { AnnotationDimensions, AnnotationTooltipState } from '../../../annotations/types'; import { computeAnnotationDimensionsSelector } from '../../../state/selectors/compute_annotations'; -import { getAnnotationSpecsSelector } from '../../../state/selectors/get_specs'; +import { computeChartDimensionsSelector } from '../../../state/selectors/compute_chart_dimensions'; import { getAnnotationTooltipStateSelector } from '../../../state/selectors/get_annotation_tooltip_state'; +import { getAnnotationSpecsSelector } from '../../../state/selectors/get_specs'; import { isChartEmptySelector } from '../../../state/selectors/is_chart_empty'; -import { AnnotationLineProps } from '../../../annotations/line/types'; -import { computeChartDimensionsSelector } from '../../../state/selectors/compute_chart_dimensions'; import { getSpecsById } from '../../../state/utils'; +import { isLineAnnotation, AnnotationSpec } from '../../../utils/specs'; import { AnnotationTooltip } from './annotation_tooltip'; -import { onPointerMove } from '../../../../../state/actions/mouse'; interface AnnotationsDispatchProps { - onPointerMove: typeof onPointerMove; + onPointerMove: typeof onPointerMoveAction; } interface AnnotationsStateProps { @@ -80,6 +81,7 @@ const AnnotationsComponent = ({ }; markers.push( + // eslint-disable-next-line react/no-array-index-key
{icon}
, @@ -133,7 +135,7 @@ const AnnotationsComponent = ({ AnnotationsComponent.displayName = 'Annotations'; const mapDispatchToProps = (dispatch: Dispatch): AnnotationsDispatchProps => - bindActionCreators({ onPointerMove }, dispatch); + bindActionCreators({ onPointerMove: onPointerMoveAction }, dispatch); const mapStateToProps = (state: GlobalChartState): AnnotationsStateProps => { if (!getInternalIsInitializedSelector(state)) { diff --git a/src/chart_types/xy_chart/renderer/dom/annotations/index.ts b/src/chart_types/xy_chart/renderer/dom/annotations/index.ts index f983527241..b6b5e126cf 100644 --- a/src/chart_types/xy_chart/renderer/dom/annotations/index.ts +++ b/src/chart_types/xy_chart/renderer/dom/annotations/index.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ /** @internal */ export { Annotations } from './annotations'; diff --git a/src/chart_types/xy_chart/renderer/dom/annotations/tooltip_content.tsx b/src/chart_types/xy_chart/renderer/dom/annotations/tooltip_content.tsx index 92a24b0c14..34488b53d6 100644 --- a/src/chart_types/xy_chart/renderer/dom/annotations/tooltip_content.tsx +++ b/src/chart_types/xy_chart/renderer/dom/annotations/tooltip_content.tsx @@ -14,23 +14,22 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React, { useCallback } from 'react'; -import { AnnotationTooltipState } from '../../../annotations/types'; import { AnnotationTypes } from '../../../../specs'; +import { AnnotationTooltipState } from '../../../annotations/types'; /** @internal */ export const TooltipContent = ({ annotationType, header, details, renderTooltip }: AnnotationTooltipState) => { - const renderLine = useCallback(() => { - return ( -
-

{header}

-
{details}
-
- ); - }, [header, details]); + const renderLine = useCallback(() => ( +
+

{header}

+
{details}
+
+ ), [header, details]); const renderRect = useCallback(() => { const tooltipContent = renderTooltip ? renderTooltip(details) : details; diff --git a/src/chart_types/xy_chart/renderer/dom/brush.tsx b/src/chart_types/xy_chart/renderer/dom/brush.tsx index d19d7c7b20..129fa9a5a9 100644 --- a/src/chart_types/xy_chart/renderer/dom/brush.tsx +++ b/src/chart_types/xy_chart/renderer/dom/brush.tsx @@ -14,20 +14,22 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React, { RefObject } from 'react'; import { connect } from 'react-redux'; -import { Dimensions } from '../../../../utils/dimensions'; + +import { clearCanvas, withContext, withClip } from '../../../../renderers/canvas'; import { GlobalChartState } from '../../../../state/chart_state'; +import { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions'; +import { getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized'; +import { Dimensions } from '../../../../utils/dimensions'; +import { computeChartDimensionsSelector } from '../../state/selectors/compute_chart_dimensions'; import { getBrushAreaSelector } from '../../state/selectors/get_brush_area'; import { isBrushAvailableSelector } from '../../state/selectors/is_brush_available'; -import { computeChartDimensionsSelector } from '../../state/selectors/compute_chart_dimensions'; import { isBrushingSelector } from '../../state/selectors/is_brushing'; import { renderRect } from '../canvas/primitives/rect'; -import { clearCanvas, withContext, withClip } from '../../../../renderers/canvas'; -import { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions'; -import { getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized'; interface Props { initialized: boolean; @@ -40,6 +42,7 @@ interface Props { class BrushToolComponent extends React.Component { static displayName = 'BrushToolComponent'; + private readonly devicePixelRatio: number; private ctx: CanvasRenderingContext2D | null; private canvasRef: RefObject; @@ -50,10 +53,16 @@ class BrushToolComponent extends React.Component { this.devicePixelRatio = window.devicePixelRatio; this.canvasRef = React.createRef(); } - private tryCanvasContext() { - const canvas = this.canvasRef.current; - this.ctx = canvas && canvas.getContext('2d'); + + componentDidMount() { + /* + * the DOM element has just been appended, and getContext('2d') is always non-null, + * so we could use a couple of ! non-null assertions but no big plus + */ + this.tryCanvasContext(); + this.drawCanvas(); } + componentDidUpdate() { if (!this.ctx) { this.tryCanvasContext(); @@ -63,12 +72,6 @@ class BrushToolComponent extends React.Component { } } - componentDidMount() { - // the DOM element has just been appended, and getContext('2d') is always non-null, - // so we could use a couple of ! non-null assertions but no big plus - this.tryCanvasContext(); - this.drawCanvas(); - } private drawCanvas = () => { const { brushArea, chartDimensions } = this.props; if (!this.ctx || !brushArea) { @@ -110,6 +113,11 @@ class BrushToolComponent extends React.Component { }); }; + private tryCanvasContext() { + const canvas = this.canvasRef.current; + this.ctx = canvas && canvas.getContext('2d'); + } + render() { const { initialized, isBrushAvailable, isBrushing, chartContainerDimensions } = this.props; if (!initialized || !isBrushAvailable || !isBrushing) { diff --git a/src/chart_types/xy_chart/renderer/dom/crosshair.tsx b/src/chart_types/xy_chart/renderer/dom/crosshair.tsx index 96b989a53d..0db4204fc9 100644 --- a/src/chart_types/xy_chart/renderer/dom/crosshair.tsx +++ b/src/chart_types/xy_chart/renderer/dom/crosshair.tsx @@ -14,23 +14,25 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React, { CSSProperties } from 'react'; import { connect } from 'react-redux'; -import { isHorizontalRotation } from '../../state/utils'; -import { Dimensions } from '../../../../utils/dimensions'; -import { Theme } from '../../../../utils/themes/theme'; -import { Rotation } from '../../../../utils/commons'; + +import { TooltipType } from '../../../../specs'; import { GlobalChartState } from '../../../../state/chart_state'; import { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation'; +import { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme'; +import { getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized'; +import { Rotation } from '../../../../utils/commons'; +import { Dimensions } from '../../../../utils/dimensions'; +import { LIGHT_THEME } from '../../../../utils/themes/light_theme'; +import { Theme } from '../../../../utils/themes/theme'; import { getCursorBandPositionSelector } from '../../state/selectors/get_cursor_band'; import { getCursorLinePositionSelector } from '../../state/selectors/get_cursor_line'; import { getTooltipTypeSelector } from '../../state/selectors/get_tooltip_type'; -import { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme'; -import { LIGHT_THEME } from '../../../../utils/themes/light_theme'; -import { TooltipType } from '../../../../specs'; -import { getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized'; +import { isHorizontalRotation } from '../../state/utils'; interface CrosshairProps { theme: Theme; @@ -50,15 +52,6 @@ function canRenderHelpLine(type: TooltipType, visible: boolean) { class CrosshairComponent extends React.Component { static displayName = 'Crosshair'; - render() { - return ( -
- {this.renderBand()} - {this.renderLine()} -
- ); - } - renderBand() { const { theme: { @@ -111,6 +104,15 @@ class CrosshairComponent extends React.Component { } return
; } + + render() { + return ( +
+ {this.renderBand()} + {this.renderLine()} +
+ ); + } } const mapStateToProps = (state: GlobalChartState): CrosshairProps => { diff --git a/src/chart_types/xy_chart/renderer/dom/highlighter.tsx b/src/chart_types/xy_chart/renderer/dom/highlighter.tsx index 6d49ac0166..cc6fdb9ef4 100644 --- a/src/chart_types/xy_chart/renderer/dom/highlighter.tsx +++ b/src/chart_types/xy_chart/renderer/dom/highlighter.tsx @@ -14,21 +14,23 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; import { connect } from 'react-redux'; -import { isPointGeometry, IndexedGeometry } from '../../../../utils/geometry'; + import { GlobalChartState } from '../../../../state/chart_state'; +import { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation'; +import { getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized'; +import { Rotation } from '../../../../utils/commons'; +import { Dimensions } from '../../../../utils/dimensions'; +import { isPointGeometry, IndexedGeometry } from '../../../../utils/geometry'; +import { DEFAULT_HIGHLIGHT_PADDING } from '../../rendering/rendering'; +import { computeChartDimensionsSelector } from '../../state/selectors/compute_chart_dimensions'; import { computeChartTransformSelector } from '../../state/selectors/compute_chart_transform'; import { getHighlightedGeomsSelector } from '../../state/selectors/get_tooltip_values_highlighted_geoms'; -import { Dimensions } from '../../../../utils/dimensions'; -import { Rotation } from '../../../../utils/commons'; import { Transform } from '../../state/utils'; -import { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation'; -import { computeChartDimensionsSelector } from '../../state/selectors/compute_chart_dimensions'; -import { DEFAULT_HIGHLIGHT_PADDING } from '../../rendering/rendering'; -import { getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized'; interface HighlighterProps { initialized: boolean; diff --git a/src/chart_types/xy_chart/rendering/rendering.areas.test.ts b/src/chart_types/xy_chart/rendering/rendering.areas.test.ts index 9597b680c1..828dce7f1e 100644 --- a/src/chart_types/xy_chart/rendering/rendering.areas.test.ts +++ b/src/chart_types/xy_chart/rendering/rendering.areas.test.ts @@ -14,20 +14,21 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { ChartTypes } from '../..'; +import { MockSeriesSpec } from '../../../mocks/specs'; import { ScaleType } from '../../../scales'; +import { SpecTypes } from '../../../specs/settings'; import { CurveType } from '../../../utils/curves'; import { PointGeometry, AreaGeometry } from '../../../utils/geometry'; import { LIGHT_THEME } from '../../../utils/themes/light_theme'; +import { computeSeriesDomains } from '../state/utils'; +import { IndexedGeometryMap } from '../utils/indexed_geometry_map'; import { computeXScale, computeYScales } from '../utils/scales'; import { AreaSeriesSpec, SeriesTypes } from '../utils/specs'; -import { computeSeriesDomains } from '../state/utils'; import { renderArea } from './rendering'; -import { ChartTypes } from '../..'; -import { SpecTypes } from '../../../specs/settings'; -import { MockSeriesSpec } from '../../../mocks/specs'; -import { IndexedGeometryMap } from '../utils/indexed_geometry_map'; const SPEC_ID = 'spec_1'; const GROUP_ID = 'group_1'; diff --git a/src/chart_types/xy_chart/rendering/rendering.bands.test.ts b/src/chart_types/xy_chart/rendering/rendering.bands.test.ts index 2aaad72a22..5cce9b570a 100644 --- a/src/chart_types/xy_chart/rendering/rendering.bands.test.ts +++ b/src/chart_types/xy_chart/rendering/rendering.bands.test.ts @@ -14,20 +14,21 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { computeSeriesDomains } from '../state/utils'; +import { ChartTypes } from '../..'; +import { MockPointGeometry } from '../../../mocks'; import { ScaleType } from '../../../scales'; +import { SpecTypes } from '../../../specs/settings'; import { CurveType } from '../../../utils/curves'; -import { renderArea, renderBars } from './rendering'; -import { computeXScale, computeYScales } from '../utils/scales'; -import { AreaSeriesSpec, BarSeriesSpec, SeriesTypes } from '../utils/specs'; -import { LIGHT_THEME } from '../../../utils/themes/light_theme'; import { AreaGeometry, PointGeometry } from '../../../utils/geometry'; -import { ChartTypes } from '../..'; -import { SpecTypes } from '../../../specs/settings'; +import { LIGHT_THEME } from '../../../utils/themes/light_theme'; +import { computeSeriesDomains } from '../state/utils'; import { IndexedGeometryMap } from '../utils/indexed_geometry_map'; -import { MockPointGeometry } from '../../../mocks'; +import { computeXScale, computeYScales } from '../utils/scales'; +import { AreaSeriesSpec, BarSeriesSpec, SeriesTypes } from '../utils/specs'; +import { renderArea, renderBars } from './rendering'; const SPEC_ID = 'spec_1'; const GROUP_ID = 'group_1'; diff --git a/src/chart_types/xy_chart/rendering/rendering.bars.test.ts b/src/chart_types/xy_chart/rendering/rendering.bars.test.ts index d08b7597c2..3a300d6351 100644 --- a/src/chart_types/xy_chart/rendering/rendering.bars.test.ts +++ b/src/chart_types/xy_chart/rendering/rendering.bars.test.ts @@ -14,19 +14,20 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { computeSeriesDomains } from '../state/utils'; -import { identity } from '../../../utils/commons'; +import { ChartTypes } from '../..'; +import { MockBarGeometry } from '../../../mocks'; import { ScaleType } from '../../../scales'; -import { renderBars } from './rendering'; +import { SpecTypes } from '../../../specs/settings'; +import { identity } from '../../../utils/commons'; +import { GroupId } from '../../../utils/ids'; +import { LIGHT_THEME } from '../../../utils/themes/light_theme'; +import { computeSeriesDomains } from '../state/utils'; import { computeXScale, computeYScales } from '../utils/scales'; import { BarSeriesSpec, DomainRange, SeriesTypes } from '../utils/specs'; -import { LIGHT_THEME } from '../../../utils/themes/light_theme'; -import { GroupId } from '../../../utils/ids'; -import { ChartTypes } from '../..'; -import { SpecTypes } from '../../../specs/settings'; -import { MockBarGeometry } from '../../../mocks'; +import { renderBars } from './rendering'; const SPEC_ID = 'spec_1'; const GROUP_ID = 'group_1'; diff --git a/src/chart_types/xy_chart/rendering/rendering.bubble.test.ts b/src/chart_types/xy_chart/rendering/rendering.bubble.test.ts index 1e7c910c9f..ca946198b3 100644 --- a/src/chart_types/xy_chart/rendering/rendering.bubble.test.ts +++ b/src/chart_types/xy_chart/rendering/rendering.bubble.test.ts @@ -14,19 +14,20 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { computeSeriesDomains } from '../state/utils'; +import { ChartTypes } from '../..'; import { ScaleType } from '../../../scales'; -import { renderBubble } from './rendering'; -import { computeXScale, computeYScales } from '../utils/scales'; -import { BubbleSeriesSpec, DomainRange, SeriesTypes } from '../utils/specs'; -import { LIGHT_THEME } from '../../../utils/themes/light_theme'; +import { SpecTypes } from '../../../specs/settings'; import { BubbleGeometry, PointGeometry } from '../../../utils/geometry'; import { GroupId } from '../../../utils/ids'; -import { ChartTypes } from '../..'; -import { SpecTypes } from '../../../specs/settings'; +import { LIGHT_THEME } from '../../../utils/themes/light_theme'; +import { computeSeriesDomains } from '../state/utils'; import { IndexedGeometryMap } from '../utils/indexed_geometry_map'; +import { computeXScale, computeYScales } from '../utils/scales'; +import { BubbleSeriesSpec, DomainRange, SeriesTypes } from '../utils/specs'; +import { renderBubble } from './rendering'; const SPEC_ID = 'spec_1'; const GROUP_ID = 'group_1'; diff --git a/src/chart_types/xy_chart/rendering/rendering.lines.test.ts b/src/chart_types/xy_chart/rendering/rendering.lines.test.ts index 8b59bc89e6..b3db96d44a 100644 --- a/src/chart_types/xy_chart/rendering/rendering.lines.test.ts +++ b/src/chart_types/xy_chart/rendering/rendering.lines.test.ts @@ -14,20 +14,21 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { computeSeriesDomains } from '../state/utils'; +import { ChartTypes } from '../..'; import { ScaleType } from '../../../scales'; +import { SpecTypes } from '../../../specs/settings'; import { CurveType } from '../../../utils/curves'; -import { renderLine } from './rendering'; -import { computeXScale, computeYScales } from '../utils/scales'; -import { LineSeriesSpec, DomainRange, SeriesTypes } from '../utils/specs'; -import { LIGHT_THEME } from '../../../utils/themes/light_theme'; import { LineGeometry, PointGeometry } from '../../../utils/geometry'; import { GroupId } from '../../../utils/ids'; -import { ChartTypes } from '../..'; -import { SpecTypes } from '../../../specs/settings'; +import { LIGHT_THEME } from '../../../utils/themes/light_theme'; +import { computeSeriesDomains } from '../state/utils'; import { IndexedGeometryMap } from '../utils/indexed_geometry_map'; +import { computeXScale, computeYScales } from '../utils/scales'; +import { LineSeriesSpec, DomainRange, SeriesTypes } from '../utils/specs'; +import { renderLine } from './rendering'; const SPEC_ID = 'spec_1'; const GROUP_ID = 'group_1'; diff --git a/src/chart_types/xy_chart/rendering/rendering.test.ts b/src/chart_types/xy_chart/rendering/rendering.test.ts index c13f1a20aa..23df759dd7 100644 --- a/src/chart_types/xy_chart/rendering/rendering.test.ts +++ b/src/chart_types/xy_chart/rendering/rendering.test.ts @@ -14,8 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { LegendItem } from '../../../commons/legend'; +import { MockDataSeries } from '../../../mocks'; +import { MockScale } from '../../../mocks/scale'; +import { mergePartial, RecursivePartial } from '../../../utils/commons'; +import { BarGeometry, PointGeometry } from '../../../utils/geometry'; +import { BarSeriesStyle, SharedGeometryStateStyle, PointStyle } from '../../../utils/themes/theme'; +import { DataSeriesDatum, XYChartSeriesIdentifier } from '../utils/series'; import { getGeometryStateStyle, isPointOnGeometry, @@ -24,13 +32,6 @@ import { getClippedRanges, getRadiusFn, } from './rendering'; -import { BarSeriesStyle, SharedGeometryStateStyle, PointStyle } from '../../../utils/themes/theme'; -import { DataSeriesDatum, XYChartSeriesIdentifier } from '../utils/series'; -import { mergePartial, RecursivePartial } from '../../../utils/commons'; -import { BarGeometry, PointGeometry } from '../../../utils/geometry'; -import { MockDataSeries } from '../../../mocks'; -import { MockScale } from '../../../mocks/scale'; -import { LegendItem } from '../../../commons/legend'; describe('Rendering utils', () => { test('check if point is on geometry', () => { @@ -570,7 +571,7 @@ describe('Rendering utils', () => { describe('markSizeRatio - 100', () => { const getRadius = getRadiusFn(data, 1, 100); - const expectedRadii = [80.71, 75.37, 1, 101.0, 83.61]; + const expectedRadii = [80.71, 75.37, 1, 101, 83.61]; it.each<[number | null, number]>(data.map(({ mark }, i) => [mark, expectedRadii[i]]))( 'should return stepped value - data[%#]', (mark, expected) => { @@ -582,7 +583,7 @@ describe('Rendering utils', () => { describe('markSizeRatio - 1000', () => { // Should be treated as 100 const getRadius = getRadiusFn(data, 1, 1000); - const expectedRadii = [80.71, 75.37, 1, 101.0, 83.61]; + const expectedRadii = [80.71, 75.37, 1, 101, 83.61]; it.each<[number | null, number]>(data.map(({ mark }, i) => [mark, expectedRadii[i]]))( 'should return stepped value - data[%#]', (mark, expected) => { diff --git a/src/chart_types/xy_chart/rendering/rendering.ts b/src/chart_types/xy_chart/rendering/rendering.ts index bbd27f2f0d..c8aa8a245d 100644 --- a/src/chart_types/xy_chart/rendering/rendering.ts +++ b/src/chart_types/xy_chart/rendering/rendering.ts @@ -14,24 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { area, line } from 'd3-shape'; -import { CanvasTextBBoxCalculator } from '../../../utils/bbox/canvas_text_bbox_calculator'; -import { - AreaSeriesStyle, - LineSeriesStyle, - PointStyle, - SharedGeometryStateStyle, - BarSeriesStyle, - GeometryStateStyle, - LineStyle, - BubbleSeriesStyle, -} from '../../../utils/themes/theme'; + +import { LegendItem } from '../../../commons/legend'; import { Scale, ScaleType } from '../../../scales'; +import { isLogarithmicScale } from '../../../scales/types'; +import { MarkBuffer } from '../../../specs'; +import { CanvasTextBBoxCalculator } from '../../../utils/bbox/canvas_text_bbox_calculator'; +import { mergePartial, Color } from '../../../utils/commons'; import { CurveType, getCurveFactory } from '../../../utils/curves'; -import { DataSeriesDatum, DataSeries, XYChartSeriesIdentifier } from '../utils/series'; -import { DisplayValueSpec, PointStyleAccessor, BarStyleAccessor } from '../utils/specs'; import { PointGeometry, BarGeometry, @@ -42,12 +36,20 @@ import { BandedAccessorType, BubbleGeometry, } from '../../../utils/geometry'; -import { mergePartial, Color } from '../../../utils/commons'; -import { LegendItem } from '../../../commons/legend'; -import { IndexedGeometryMap, GeometryType } from '../utils/indexed_geometry_map'; +import { + AreaSeriesStyle, + LineSeriesStyle, + PointStyle, + SharedGeometryStateStyle, + BarSeriesStyle, + GeometryStateStyle, + LineStyle, + BubbleSeriesStyle, +} from '../../../utils/themes/theme'; import { getDistance } from '../state/utils'; -import { MarkBuffer } from '../../../specs'; -import { isLogarithmicScale } from '../../../scales/types'; +import { IndexedGeometryMap, GeometryType } from '../utils/indexed_geometry_map'; +import { DataSeriesDatum, DataSeries, XYChartSeriesIdentifier } from '../utils/series'; +import { DisplayValueSpec, PointStyleAccessor, BarStyleAccessor } from '../utils/specs'; export const DEFAULT_HIGHLIGHT_PADDING = 10; @@ -263,8 +265,7 @@ export function renderBars( // default padding to 1 for now const padding = 1; - const fontSize = sharedSeriesStyle.displayValue.fontSize; - const fontFamily = sharedSeriesStyle.displayValue.fontFamily; + const { fontSize, fontFamily } = sharedSeriesStyle.displayValue; const absMinHeight = minBarHeight && Math.abs(minBarHeight); dataSeries.data.forEach((datum) => { @@ -308,10 +309,10 @@ export function renderBars( const heightDelta = absMinHeight - Math.abs(height); if (height < 0) { height = -absMinHeight; - y = y + heightDelta; + y += heightDelta; } else { height = absMinHeight; - y = y - heightDelta; + y -= heightDelta; } } @@ -324,36 +325,32 @@ export function renderBars( const x = xScaled + xScale.bandwidth * orderIndex; const width = xScale.bandwidth; - const formattedDisplayValue = - displayValueSettings && displayValueSettings.valueFormatter - ? displayValueSettings.valueFormatter(initialY1) - : undefined; + const formattedDisplayValue = displayValueSettings && displayValueSettings.valueFormatter + ? displayValueSettings.valueFormatter(initialY1) + : undefined; // only show displayValue for even bars if showOverlappingValue - const displayValueText = - displayValueSettings && displayValueSettings.isAlternatingValueLabel - ? barGeometries.length % 2 === 0 + const displayValueText = displayValueSettings && displayValueSettings.isAlternatingValueLabel + ? barGeometries.length % 2 === 0 ? formattedDisplayValue : undefined - : formattedDisplayValue; + : formattedDisplayValue; const computedDisplayValueWidth = bboxCalculator.compute(displayValueText || '', padding, fontSize, fontFamily) .width; - const displayValueWidth = - displayValueSettings && displayValueSettings.isValueContainedInElement ? width : computedDisplayValueWidth; + const displayValueWidth = displayValueSettings && displayValueSettings.isValueContainedInElement ? width : computedDisplayValueWidth; const hideClippedValue = displayValueSettings ? displayValueSettings.hideClippedValue : undefined; - const displayValue = - displayValueSettings && displayValueSettings.showValueLabel - ? { - text: displayValueText, - width: displayValueWidth, - height: fontSize, - hideClippedValue, - isValueContainedInElement: displayValueSettings.isValueContainedInElement, - } - : undefined; + const displayValue = displayValueSettings && displayValueSettings.showValueLabel + ? { + text: displayValueText, + width: displayValueWidth, + height: fontSize, + hideClippedValue, + isValueContainedInElement: displayValueSettings.isValueContainedInElement, + } + : undefined; const seriesIdentifier: XYChartSeriesIdentifier = { key: dataSeries.key, @@ -450,7 +447,7 @@ export function renderLine( try { linePath = pathGenerator(dataSeries.data) || ''; - } catch (e) { + } catch { // When values are not scalable linePath = ''; } @@ -586,13 +583,12 @@ export function renderArea( }) .curve(getCurveFactory(curve)); - const clippedRanges = - hasFit && !hasY0Accessors && !isStacked ? getClippedRanges(dataSeries.data, xScale, xScaleOffset) : []; + const clippedRanges = hasFit && !hasY0Accessors && !isStacked ? getClippedRanges(dataSeries.data, xScale, xScaleOffset) : []; let y1Line: string | null; try { y1Line = pathGenerator.lineY1()(dataSeries.data); - } catch (e) { + } catch { // When values are not scalable y1Line = null; } @@ -606,7 +602,7 @@ export function renderArea( try { y0Line = pathGenerator.lineY0()(dataSeries.data); - } catch (e) { + } catch { // When values are not scalable y0Line = null; } @@ -631,7 +627,7 @@ export function renderArea( try { areaPath = pathGenerator(dataSeries.data) || ''; - } catch (e) { + } catch { // When values are not scalable areaPath = ''; } diff --git a/src/chart_types/xy_chart/specs/area_series.tsx b/src/chart_types/xy_chart/specs/area_series.tsx index 3c256e6938..4cf9cf7d82 100644 --- a/src/chart_types/xy_chart/specs/area_series.tsx +++ b/src/chart_types/xy_chart/specs/area_series.tsx @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { AreaSeriesSpec, HistogramModeAlignments, DEFAULT_GLOBAL_ID, SeriesTypes } from '../utils/specs'; + +import { ChartTypes } from '../..'; import { ScaleType } from '../../../scales'; -import { specComponentFactory, getConnect } from '../../../state/spec_factory'; -import { ChartTypes } from '../../../chart_types'; import { SpecTypes } from '../../../specs/settings'; +import { specComponentFactory, getConnect } from '../../../state/spec_factory'; +import { AreaSeriesSpec, HistogramModeAlignments, DEFAULT_GLOBAL_ID, SeriesTypes } from '../utils/specs'; const defaultProps = { chartType: ChartTypes.XYAxis, diff --git a/src/chart_types/xy_chart/specs/axis.tsx b/src/chart_types/xy_chart/specs/axis.tsx index 7b3816429f..553f274b51 100644 --- a/src/chart_types/xy_chart/specs/axis.tsx +++ b/src/chart_types/xy_chart/specs/axis.tsx @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { AxisSpec, DEFAULT_GLOBAL_ID } from '../utils/specs'; -import { Position } from '../../../utils/commons'; -import { ChartTypes } from '../../../chart_types'; -import { specComponentFactory, getConnect } from '../../../state/spec_factory'; + +import { ChartTypes } from '../..'; import { SpecTypes } from '../../../specs/settings'; +import { specComponentFactory, getConnect } from '../../../state/spec_factory'; +import { Position } from '../../../utils/commons'; +import { AxisSpec, DEFAULT_GLOBAL_ID } from '../utils/specs'; const defaultProps = { chartType: ChartTypes.XYAxis, diff --git a/src/chart_types/xy_chart/specs/bar_series.tsx b/src/chart_types/xy_chart/specs/bar_series.tsx index d1392f30e7..38ffb1ceee 100644 --- a/src/chart_types/xy_chart/specs/bar_series.tsx +++ b/src/chart_types/xy_chart/specs/bar_series.tsx @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { BarSeriesSpec, DEFAULT_GLOBAL_ID, SeriesTypes } from '../utils/specs'; + +import { ChartTypes } from '../..'; import { ScaleType } from '../../../scales'; -import { ChartTypes } from '../../../chart_types'; -import { specComponentFactory, getConnect } from '../../../state/spec_factory'; import { SpecTypes } from '../../../specs/settings'; +import { specComponentFactory, getConnect } from '../../../state/spec_factory'; +import { BarSeriesSpec, DEFAULT_GLOBAL_ID, SeriesTypes } from '../utils/specs'; const defaultProps = { chartType: ChartTypes.XYAxis, diff --git a/src/chart_types/xy_chart/specs/bubble_series.tsx b/src/chart_types/xy_chart/specs/bubble_series.tsx index 4059e25356..61705bab64 100644 --- a/src/chart_types/xy_chart/specs/bubble_series.tsx +++ b/src/chart_types/xy_chart/specs/bubble_series.tsx @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { BubbleSeriesSpec, DEFAULT_GLOBAL_ID, SeriesTypes } from '../utils/specs'; + +import { ChartTypes } from '../..'; import { ScaleType } from '../../../scales'; -import { ChartTypes } from '../../../chart_types'; -import { specComponentFactory, getConnect } from '../../../state/spec_factory'; import { SpecTypes } from '../../../specs/settings'; +import { specComponentFactory, getConnect } from '../../../state/spec_factory'; +import { BubbleSeriesSpec, DEFAULT_GLOBAL_ID, SeriesTypes } from '../utils/specs'; const defaultProps = { chartType: ChartTypes.XYAxis, diff --git a/src/chart_types/xy_chart/specs/histogram_bar_series.tsx b/src/chart_types/xy_chart/specs/histogram_bar_series.tsx index d1a999d553..8e1a683349 100644 --- a/src/chart_types/xy_chart/specs/histogram_bar_series.tsx +++ b/src/chart_types/xy_chart/specs/histogram_bar_series.tsx @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { HistogramBarSeriesSpec, DEFAULT_GLOBAL_ID, SeriesTypes } from '../utils/specs'; + +import { ChartTypes } from '../..'; import { ScaleType } from '../../../scales'; -import { specComponentFactory, getConnect } from '../../../state/spec_factory'; -import { ChartTypes } from '../../../chart_types'; import { SpecTypes } from '../../../specs/settings'; +import { specComponentFactory, getConnect } from '../../../state/spec_factory'; +import { HistogramBarSeriesSpec, DEFAULT_GLOBAL_ID, SeriesTypes } from '../utils/specs'; const defaultProps = { chartType: ChartTypes.XYAxis, @@ -34,7 +36,7 @@ const defaultProps = { yAccessors: ['y'], yScaleToDataExtent: false, hideInLegend: false, - enableHistogramMode: true as true, + enableHistogramMode: true as const, }; type SpecRequiredProps = Pick; diff --git a/src/chart_types/xy_chart/specs/index.ts b/src/chart_types/xy_chart/specs/index.ts index 331a83d8d9..c47871fcd5 100644 --- a/src/chart_types/xy_chart/specs/index.ts +++ b/src/chart_types/xy_chart/specs/index.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export { AreaSeries } from './area_series'; export { Axis } from './axis'; diff --git a/src/chart_types/xy_chart/specs/line_annotation.test.tsx b/src/chart_types/xy_chart/specs/line_annotation.test.tsx index 32db01e2f9..2ff0987114 100644 --- a/src/chart_types/xy_chart/specs/line_annotation.test.tsx +++ b/src/chart_types/xy_chart/specs/line_annotation.test.tsx @@ -14,17 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { mount } from 'enzyme'; import React from 'react'; -import { createStore, Store } from 'redux'; import { Provider } from 'react-redux'; -import { mount } from 'enzyme'; +import { createStore, Store } from 'redux'; -import { chartStoreReducer, GlobalChartState } from '../../../state/chart_state'; +import { LineAnnotation, AnnotationDomainTypes } from '../../../specs'; import { SpecsParser } from '../../../specs/specs_parser'; +import { chartStoreReducer, GlobalChartState } from '../../../state/chart_state'; import { LineSeries } from './line_series'; -import { LineAnnotation, AnnotationDomainTypes } from '../../../specs'; function LineAnnotationChart(props: { chartStore: Store }) { return ( @@ -57,8 +58,8 @@ describe('Line annotation', () => { const storeReducer = chartStoreReducer('chart_id'); const chartStore = createStore(storeReducer); const wrapper = mount(); - expect(chartStore.getState().specs['threshold']).toBeDefined(); + expect(chartStore.getState().specs.threshold).toBeDefined(); wrapper.setProps({}); - expect(chartStore.getState().specs['threshold']).toBeDefined(); + expect(chartStore.getState().specs.threshold).toBeDefined(); }); }); diff --git a/src/chart_types/xy_chart/specs/line_annotation.tsx b/src/chart_types/xy_chart/specs/line_annotation.tsx index ce954b7225..d9e7c86642 100644 --- a/src/chart_types/xy_chart/specs/line_annotation.tsx +++ b/src/chart_types/xy_chart/specs/line_annotation.tsx @@ -14,16 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React, { createRef, CSSProperties, Component } from 'react'; -import { LineAnnotationSpec, DEFAULT_GLOBAL_ID, AnnotationTypes } from '../utils/specs'; -import { DEFAULT_ANNOTATION_LINE_STYLE, mergeWithDefaultAnnotationLine } from '../../../utils/themes/theme'; -import { bindActionCreators, Dispatch } from 'redux'; import { connect } from 'react-redux'; -import { upsertSpec, removeSpec } from '../../../state/actions/specs'; -import { Spec, SpecTypes } from '../../../specs'; +import { bindActionCreators, Dispatch } from 'redux'; + import { ChartTypes } from '../..'; +import { Spec, SpecTypes } from '../../../specs'; +import { upsertSpec as upsertSpecAction, removeSpec as removeSpecAction } from '../../../state/actions/specs'; +import { DEFAULT_ANNOTATION_LINE_STYLE, mergeWithDefaultAnnotationLine } from '../../../utils/themes/theme'; +import { LineAnnotationSpec, DEFAULT_GLOBAL_ID, AnnotationTypes } from '../utils/specs'; type InjectedProps = LineAnnotationSpec & DispatchProps & @@ -74,18 +76,22 @@ export class LineAnnotationSpecComponent extends Component { const spec = { ...config, style }; upsertSpec(spec); } + componentWillUnmount() { const { removeSpec, id } = this.props as InjectedProps; removeSpec(id); } + render() { if (!this.props.marker) { return null; } - // We need to get the width & height of the marker passed into the spec - // so we render the marker offscreen if one has been defined & update the config - // with the width & height. + /* + * We need to get the width & height of the marker passed into the spec + * so we render the marker offscreen if one has been defined & update the config + * with the width & height. + */ const offscreenStyle: CSSProperties = { position: 'absolute', left: -9999, @@ -107,8 +113,8 @@ interface DispatchProps { const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => bindActionCreators( { - upsertSpec, - removeSpec, + upsertSpec: upsertSpecAction, + removeSpec: removeSpecAction, }, dispatch, ); @@ -122,7 +128,7 @@ type SpecOptionalProps = Partial< >; export const LineAnnotation: React.FunctionComponent = connect< - {}, + null, DispatchProps, LineAnnotationSpec >( diff --git a/src/chart_types/xy_chart/specs/line_series.tsx b/src/chart_types/xy_chart/specs/line_series.tsx index f1c40f7b12..e00db7c833 100644 --- a/src/chart_types/xy_chart/specs/line_series.tsx +++ b/src/chart_types/xy_chart/specs/line_series.tsx @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { LineSeriesSpec, DEFAULT_GLOBAL_ID, HistogramModeAlignments, SeriesTypes } from '../utils/specs'; + +import { ChartTypes } from '../..'; import { ScaleType } from '../../../scales'; -import { ChartTypes } from '../../../chart_types'; -import { specComponentFactory, getConnect } from '../../../state/spec_factory'; import { SpecTypes } from '../../../specs/settings'; +import { specComponentFactory, getConnect } from '../../../state/spec_factory'; +import { LineSeriesSpec, DEFAULT_GLOBAL_ID, HistogramModeAlignments, SeriesTypes } from '../utils/specs'; const defaultProps = { chartType: ChartTypes.XYAxis, diff --git a/src/chart_types/xy_chart/specs/rect_annotation.tsx b/src/chart_types/xy_chart/specs/rect_annotation.tsx index ad9b09fb32..0067135f85 100644 --- a/src/chart_types/xy_chart/specs/rect_annotation.tsx +++ b/src/chart_types/xy_chart/specs/rect_annotation.tsx @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { RectAnnotationSpec, DEFAULT_GLOBAL_ID, AnnotationTypes } from '../utils/specs'; + +import { ChartTypes } from '../..'; +import { SpecTypes } from '../../../specs/settings'; import { specComponentFactory, getConnect } from '../../../state/spec_factory'; import { DEFAULT_ANNOTATION_RECT_STYLE } from '../../../utils/themes/theme'; -import { ChartTypes } from '../../index'; -import { SpecTypes } from '../../../specs/settings'; +import { RectAnnotationSpec, DEFAULT_GLOBAL_ID, AnnotationTypes } from '../utils/specs'; const defaultProps = { chartType: ChartTypes.XYAxis, @@ -39,5 +41,5 @@ export const RectAnnotation: React.FunctionComponent >> = getConnect()( - specComponentFactory(defaultProps), -); + specComponentFactory(defaultProps), + ); diff --git a/src/chart_types/xy_chart/state/chart_state.interactions.test.ts b/src/chart_types/xy_chart/state/chart_state.interactions.test.ts index 2e1c76023d..8578ffa34e 100644 --- a/src/chart_types/xy_chart/state/chart_state.interactions.test.ts +++ b/src/chart_types/xy_chart/state/chart_state.interactions.test.ts @@ -14,15 +14,24 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { createStore, Store } from 'redux'; -import { BarSeriesSpec, BasicSeriesSpec, AxisSpec, SeriesTypes } from '../utils/specs'; -import { Position } from '../../../utils/commons'; + +import { ChartTypes } from '../..'; import { ScaleType } from '../../../scales'; -import { chartStoreReducer, GlobalChartState } from '../../../state/chart_state'; import { SettingsSpec, DEFAULT_SETTINGS_SPEC, SpecTypes, TooltipType, XYBrushArea, BrushAxis } from '../../../specs'; +import { updateParentDimensions } from '../../../state/actions/chart_settings'; +import { onExternalPointerEvent } from '../../../state/actions/events'; +import { onPointerMove, onMouseDown, onMouseUp } from '../../../state/actions/mouse'; +import { upsertSpec, specParsed } from '../../../state/actions/specs'; +import { chartStoreReducer, GlobalChartState } from '../../../state/chart_state'; +import { getSettingsSpecSelector } from '../../../state/selectors/get_settings_specs'; +import { Position } from '../../../utils/commons'; +import { BarSeriesSpec, BasicSeriesSpec, AxisSpec, SeriesTypes } from '../utils/specs'; import { computeSeriesGeometriesSelector } from './selectors/compute_series_geometries'; +import { getCursorBandPositionSelector } from './selectors/get_cursor_band'; import { getProjectedPointerPositionSelector } from './selectors/get_projected_pointer_position'; import { getHighlightedGeomsSelector, @@ -32,14 +41,7 @@ import { isTooltipVisibleSelector } from './selectors/is_tooltip_visible'; import { createOnBrushEndCaller } from './selectors/on_brush_end_caller'; import { createOnElementOutCaller } from './selectors/on_element_out_caller'; import { createOnElementOverCaller } from './selectors/on_element_over_caller'; -import { getCursorBandPositionSelector } from './selectors/get_cursor_band'; -import { getSettingsSpecSelector } from '../../../state/selectors/get_settings_specs'; -import { upsertSpec, specParsed } from '../../../state/actions/specs'; -import { updateParentDimensions } from '../../../state/actions/chart_settings'; -import { onPointerMove, onMouseDown, onMouseUp } from '../../../state/actions/mouse'; -import { ChartTypes } from '../..'; import { createOnPointerMoveCaller } from './selectors/on_pointer_move_caller'; -import { onExternalPointerEvent } from '../../../state/actions/events'; const SPEC_ID = 'spec_1'; const GROUP_ID = 'group_1'; @@ -268,9 +270,9 @@ describe('Chart state pointer interactions', () => { mouseOverTestSuite(ScaleType.Linear); }); - // TODO add test for point series - // TODO add test for mixed series - // TODO add test for clicks + it.todo('add test for point series'); + it.todo('add test for mixed series'); + it.todo('add test for clicks'); }); function mouseOverTestSuite(scaleType: ScaleType) { @@ -788,9 +790,7 @@ function mouseOverTestSuite(scaleType: ScaleType) { }); describe('brush', () => { test('can respond to a brush end event', () => { - const brushEndListener = jest.fn((): void => { - return; - }); + const brushEndListener = jest.fn((): void => undefined); const onBrushCaller = createOnBrushEndCaller(); store.subscribe(() => { onBrushCaller(store.getState()); @@ -873,9 +873,7 @@ function mouseOverTestSuite(scaleType: ScaleType) { } }); test('can respond to a brush end event on rotated chart', () => { - const brushEndListener = jest.fn((): void => { - return; - }); + const brushEndListener = jest.fn((): void => undefined); const onBrushCaller = createOnBrushEndCaller(); store.subscribe(() => { onBrushCaller(store.getState()); @@ -948,9 +946,7 @@ function mouseOverTestSuite(scaleType: ScaleType) { } }); test('can respond to a Y brush', () => { - const brushEndListener = jest.fn((): void => { - return; - }); + const brushEndListener = jest.fn((): void => undefined); const onBrushCaller = createOnBrushEndCaller(); store.subscribe(() => { onBrushCaller(store.getState()); @@ -1024,9 +1020,7 @@ function mouseOverTestSuite(scaleType: ScaleType) { } }); test('can respond to rectangular brush', () => { - const brushEndListener = jest.fn((): void => { - return; - }); + const brushEndListener = jest.fn((): void => undefined); const onBrushCaller = createOnBrushEndCaller(); store.subscribe(() => { onBrushCaller(store.getState()); diff --git a/src/chart_types/xy_chart/state/chart_state.specs.test.ts b/src/chart_types/xy_chart/state/chart_state.specs.test.ts index ddea1debb6..f84c479e8c 100644 --- a/src/chart_types/xy_chart/state/chart_state.specs.test.ts +++ b/src/chart_types/xy_chart/state/chart_state.specs.test.ts @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { GlobalChartState, chartStoreReducer } from '../../../state/chart_state'; import { createStore, Store } from 'redux'; -import { upsertSpec, specParsed, specParsing } from '../../../state/actions/specs'; + import { MockSeriesSpec } from '../../../mocks/specs'; +import { upsertSpec, specParsed, specParsing } from '../../../state/actions/specs'; +import { GlobalChartState, chartStoreReducer } from '../../../state/chart_state'; import { getLegendItemsSelector } from '../../../state/selectors/get_legend_items'; const data = [ diff --git a/src/chart_types/xy_chart/state/chart_state.test.ts b/src/chart_types/xy_chart/state/chart_state.test.ts index 4ffc50a70e..8239b8e9bb 100644 --- a/src/chart_types/xy_chart/state/chart_state.test.ts +++ b/src/chart_types/xy_chart/state/chart_state.test.ts @@ -14,8 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { ChartTypes } from '../..'; +import { LegendItem } from '../../../commons/legend'; +import { ScaleType, ScaleContinuous, ScaleBand } from '../../../scales'; +import { SpecTypes, TooltipValue, TooltipType } from '../../../specs/settings'; +import { Position } from '../../../utils/commons'; +import { IndexedGeometry, GeometryValue, BandedAccessorType } from '../../../utils/geometry'; +import { AxisId } from '../../../utils/ids'; +import { AxisTicksDimensions, isDuplicateAxis } from '../utils/axis_utils'; import { AnnotationDomainTypes, AnnotationSpec, @@ -25,14 +34,6 @@ import { RectAnnotationSpec, SeriesTypes, } from '../utils/specs'; -import { Position } from '../../../utils/commons'; -import { ScaleType, ScaleContinuous, ScaleBand } from '../../../scales'; -import { IndexedGeometry, GeometryValue, BandedAccessorType } from '../../../utils/geometry'; -import { AxisTicksDimensions, isDuplicateAxis } from '../utils/axis_utils'; -import { AxisId } from '../../../utils/ids'; -import { LegendItem } from '../../../commons/legend'; -import { ChartTypes } from '../..'; -import { SpecTypes, TooltipValue, TooltipType } from '../../../specs/settings'; describe.skip('Chart Store', () => { let store: any = null; // @@ -227,7 +228,7 @@ describe.skip('Chart Store', () => { expect(result).toBe(false); }); - it("should return false if can't find spec", () => { + it('should return false if can\'t find spec', () => { tickMap.set(AXIS_2_ID, axisTicksDimensions); const result = isDuplicateAxis(axis1, axisTicksDimensions, tickMap, specMap); @@ -295,9 +296,7 @@ describe.skip('Chart Store', () => { }); test.skip('can respond to legend item mouseover event', () => { - const legendListener = jest.fn((): void => { - return; - }); + const legendListener = jest.fn((): void => undefined); store.legendItems = new Map([ [firstLegendItem.seriesIdentifier.key, firstLegendItem], @@ -337,9 +336,7 @@ describe.skip('Chart Store', () => { }); test.skip('do nothing when mouseover an hidden series', () => { - const legendListener = jest.fn((): void => { - return; - }); + const legendListener = jest.fn((): void => undefined); store.setOnLegendItemOverListener(legendListener); store.legendItems = new Map([ @@ -366,9 +363,7 @@ describe.skip('Chart Store', () => { }); test.skip('can respond to legend item click event', () => { - const legendListener = jest.fn((): void => { - return; - }); + const legendListener = jest.fn((): void => undefined); store.legendItems = new Map([ [firstLegendItem.seriesIdentifier.key, firstLegendItem], @@ -378,26 +373,30 @@ describe.skip('Chart Store', () => { store.onLegendItemClickListener = undefined; store.onLegendItemClick(firstLegendItem.seriesIdentifier.key); - // TODO reenable this after re-configuring onLegendItemClick - // expect(store.selectedLegendItemKey.get()).toBe(firstLegendItem.seriesIdentifier.key); + /* + * TODO reenable this after re-configuring onLegendItemClick + * expect(store.selectedLegendItemKey.get()).toBe(firstLegendItem.seriesIdentifier.key); + */ expect(legendListener).not.toBeCalled(); store.setOnLegendItemClickListener(legendListener); store.onLegendItemClick(firstLegendItem.seriesIdentifier.key); - // TODO reenable this after re-configuring onLegendItemClick - // expect(store.selectedLegendItemKey.get()).toBe(null); - // expect(legendListener).toBeCalledWith(null); - - // store.setOnLegendItemClickListener(legendListener); - // store.onLegendItemClick(secondLegendItem.seriesIdentifier.key); - // expect(store.selectedLegendItemKey.get()).toBe(secondLegendItem.seriesIdentifier.key); + /* + * TODO reenable this after re-configuring onLegendItemClick + * expect(store.selectedLegendItemKey.get()).toBe(null); + * expect(legendListener).toBeCalledWith(null); + */ + + /* + * store.setOnLegendItemClickListener(legendListener); + * store.onLegendItemClick(secondLegendItem.seriesIdentifier.key); + * expect(store.selectedLegendItemKey.get()).toBe(secondLegendItem.seriesIdentifier.key); + */ expect(legendListener).toBeCalledWith(firstLegendItem.seriesIdentifier); }); test.skip('can respond to a legend item plus click event', () => { - const legendListener = jest.fn((): void => { - return; - }); + const legendListener = jest.fn((): void => undefined); store.legendItems = new Map([ [firstLegendItem.seriesIdentifier.key, firstLegendItem], @@ -419,9 +418,7 @@ describe.skip('Chart Store', () => { }); test.skip('can respond to a legend item minus click event', () => { - const legendListener = jest.fn((): void => { - return; - }); + const legendListener = jest.fn((): void => undefined); store.legendItems = new Map([ [firstLegendItem.seriesIdentifier.key, firstLegendItem], @@ -443,9 +440,7 @@ describe.skip('Chart Store', () => { }); test.skip('can toggle series visibility', () => { - const computeChart = jest.fn((): void => { - return; - }); + const computeChart = jest.fn((): void => undefined); store.legendItems = new Map([ [firstLegendItem.seriesIdentifier.key, firstLegendItem], @@ -469,9 +464,7 @@ describe.skip('Chart Store', () => { }); test.skip('can toggle single series visibility', () => { - const computeChart = jest.fn((): void => { - return; - }); + const computeChart = jest.fn((): void => undefined); store.legendItems = new Map([ [firstLegendItem.seriesIdentifier.key, firstLegendItem], @@ -492,36 +485,28 @@ describe.skip('Chart Store', () => { }); test.skip('can set an element click listener', () => { - const clickListener = (): void => { - return; - }; + const clickListener = (): void => undefined; store.setOnElementClickListener(clickListener); expect(store.onElementClickListener).toEqual(clickListener); }); test.skip('can set a brush end listener', () => { - const brushEndListener = (): void => { - return; - }; + const brushEndListener = (): void => undefined; store.setOnBrushEndListener(brushEndListener); expect(store.onBrushEndListener).toEqual(brushEndListener); }); test.skip('can set a cursor hover listener', () => { - const listener = (): void => { - return; - }; + const listener = (): void => undefined; store.setOnCursorUpdateListener(listener); expect(store.onCursorUpdateListener).toEqual(listener); }); test.skip('can set a render change listener', () => { - const listener = (): void => { - return; - }; + const listener = (): void => undefined; store.setOnRenderChangeListener(listener); expect(store.onRenderChangeListener).toEqual(listener); @@ -572,9 +557,7 @@ describe.skip('Chart Store', () => { }); test.skip('can update parent dimensions', () => { - const computeChart = jest.fn((): void => { - return; - }); + const computeChart = jest.fn((): void => undefined); store.computeChart = computeChart; store.parentDimensions = { @@ -606,7 +589,7 @@ describe.skip('Chart Store', () => { test.skip('can remove a series spec', () => { store.addSeriesSpec(spec); store.removeSeriesSpec(SPEC_ID); - expect(store.seriesSpecs.get(SPEC_ID)).toBe(undefined); + expect(store.seriesSpecs.get(SPEC_ID)).toBeUndefined(); }); test.skip('can remove an axis spec', () => { @@ -626,7 +609,7 @@ describe.skip('Chart Store', () => { store.addAxisSpec(axisSpec); store.removeAxisSpec(AXIS_ID); - expect(store.axesSpecs.get(AXIS_ID)).toBe(undefined); + expect(store.axesSpecs.get(AXIS_ID)).toBeUndefined(); }); test('can add and remove an annotation spec', () => { @@ -684,7 +667,7 @@ describe.skip('Chart Store', () => { }); test.skip('only computes chart if parent dimensions are computed', () => { - const localStore: any = null; //new ChartStore(); + const localStore: any = null; // new ChartStore(); localStore.parentDimensions = { width: 0, @@ -698,7 +681,7 @@ describe.skip('Chart Store', () => { }); test.skip('only computes chart if series specs exist', () => { - const localStore: any = null; //new ChartStore(); + const localStore: any = null; // new ChartStore(); localStore.parentDimensions = { width: 100, @@ -849,9 +832,7 @@ describe.skip('Chart Store', () => { }); test.skip('should update cursor postion with hover event', () => { - const legendListener = jest.fn((): void => { - return; - }); + const legendListener = jest.fn((): void => undefined); store.legendItems = new Map([ [firstLegendItem.seriesIdentifier.key, firstLegendItem], @@ -973,9 +954,7 @@ describe.skip('Chart Store', () => { height: 0, seriesStyle: barStyle, }; - const clickListener = jest.fn((): void => { - return; - }); + const clickListener = jest.fn((): void => undefined); store.setOnElementClickListener(clickListener); store.highlightedGeometries.replace([]); @@ -1115,9 +1094,7 @@ describe.skip('Chart Store', () => { expect(t).toEqual(expectedTooltipValues); }); describe('can determine if crosshair cursor is visible', () => { - const brushEndListener = (): void => { - return; - }; + const brushEndListener = (): void => undefined; beforeEach(() => { store.xScale = new ScaleContinuous({ type: ScaleType.Linear, domain: [0, 100], range: [0, 100] }); diff --git a/src/chart_types/xy_chart/state/chart_state.timescales.test.ts b/src/chart_types/xy_chart/state/chart_state.timescales.test.ts index 430b1a0b0c..b54c57260b 100644 --- a/src/chart_types/xy_chart/state/chart_state.timescales.test.ts +++ b/src/chart_types/xy_chart/state/chart_state.timescales.test.ts @@ -14,23 +14,25 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { LineSeriesSpec, SeriesTypes } from '../utils/specs'; -import { ScaleType } from '../../../scales'; +import { DateTime } from 'luxon'; import { createStore, Store } from 'redux'; -import { chartStoreReducer, GlobalChartState } from '../../../state/chart_state'; -import { upsertSpec, specParsed } from '../../../state/actions/specs'; + +import { ChartTypes } from '../..'; +import { ScaleType } from '../../../scales'; import { SettingsSpec, DEFAULT_SETTINGS_SPEC, SpecTypes } from '../../../specs'; -import { mergeWithDefaultTheme } from '../../../utils/themes/theme'; -import { LIGHT_THEME } from '../../../utils/themes/light_theme'; import { updateParentDimensions } from '../../../state/actions/chart_settings'; -import { computeSeriesGeometriesSelector } from './selectors/compute_series_geometries'; import { onPointerMove } from '../../../state/actions/mouse'; -import { getTooltipInfoSelector } from './selectors/get_tooltip_values_highlighted_geoms'; -import { DateTime } from 'luxon'; +import { upsertSpec, specParsed } from '../../../state/actions/specs'; +import { chartStoreReducer, GlobalChartState } from '../../../state/chart_state'; +import { LIGHT_THEME } from '../../../utils/themes/light_theme'; +import { mergeWithDefaultTheme } from '../../../utils/themes/theme'; +import { LineSeriesSpec, SeriesTypes } from '../utils/specs'; +import { computeSeriesGeometriesSelector } from './selectors/compute_series_geometries'; import { getComputedScalesSelector } from './selectors/get_computed_scales'; -import { ChartTypes } from '../..'; +import { getTooltipInfoSelector } from './selectors/get_tooltip_values_highlighted_geoms'; describe('Render chart', () => { describe('line, utc-time, day interval', () => { @@ -75,7 +77,7 @@ describe('Render chart', () => { store.dispatch(specParsed()); store.dispatch(updateParentDimensions({ width: 100, height: 100, top: 0, left: 0 })); const state = store.getState(); - expect(state.specs['lines']).toBeDefined(); + expect(state.specs.lines).toBeDefined(); expect(state.chartType).toBe(ChartTypes.XYAxis); }); test('check rendered geometries', () => { @@ -144,7 +146,7 @@ describe('Render chart', () => { store.dispatch(specParsed()); store.dispatch(updateParentDimensions({ width: 100, height: 100, top: 0, left: 0 })); const state = store.getState(); - expect(state.specs['lines']).toBeDefined(); + expect(state.specs.lines).toBeDefined(); expect(state.chartType).toBe(ChartTypes.XYAxis); }); test('check rendered geometries', () => { @@ -212,7 +214,7 @@ describe('Render chart', () => { store.dispatch(specParsed()); store.dispatch(updateParentDimensions({ width: 100, height: 100, top: 0, left: 0 })); const state = store.getState(); - expect(state.specs['lines']).toBeDefined(); + expect(state.specs.lines).toBeDefined(); expect(state.chartType).toBe(ChartTypes.XYAxis); }); test('check rendered geometries', () => { diff --git a/src/chart_types/xy_chart/state/chart_state.tooltip.test.ts b/src/chart_types/xy_chart/state/chart_state.tooltip.test.ts index 507c7f8d90..73cdcee17d 100644 --- a/src/chart_types/xy_chart/state/chart_state.tooltip.test.ts +++ b/src/chart_types/xy_chart/state/chart_state.tooltip.test.ts @@ -14,16 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { GlobalChartState, chartStoreReducer } from '../../../state/chart_state'; import { createStore, Store } from 'redux'; -import { upsertSpec, specParsed } from '../../../state/actions/specs'; + import { MockSeriesSpec, MockGlobalSpec } from '../../../mocks/specs'; +import { TooltipType } from '../../../specs'; import { updateParentDimensions } from '../../../state/actions/chart_settings'; -import { getTooltipInfoAndGeometriesSelector } from './selectors/get_tooltip_values_highlighted_geoms'; import { onPointerMove } from '../../../state/actions/mouse'; -import { TooltipType } from '../../../specs'; +import { upsertSpec, specParsed } from '../../../state/actions/specs'; +import { GlobalChartState, chartStoreReducer } from '../../../state/chart_state'; +import { getTooltipInfoAndGeometriesSelector } from './selectors/get_tooltip_values_highlighted_geoms'; describe('XYChart - State tooltips', () => { let store: Store; diff --git a/src/chart_types/xy_chart/state/chart_state.tsx b/src/chart_types/xy_chart/state/chart_state.tsx index 452ccd4da6..a7b5251a38 100644 --- a/src/chart_types/xy_chart/state/chart_state.tsx +++ b/src/chart_types/xy_chart/state/chart_state.tsx @@ -14,46 +14,49 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React, { RefObject } from 'react'; -import { XYChart } from '../renderer/canvas/xy_chart'; -import { Highlighter } from '../renderer/dom/highlighter'; -import { Crosshair } from '../renderer/dom/crosshair'; -import { BrushTool } from '../renderer/dom/brush'; -import { InternalChartState, GlobalChartState, BackwardRef } from '../../../state/chart_state'; + import { ChartTypes } from '../..'; +import { LegendItemExtraValues } from '../../../commons/legend'; +import { SeriesKey } from '../../../commons/series_id'; +import { Tooltip } from '../../../components/tooltip'; +import { InternalChartState, GlobalChartState, BackwardRef } from '../../../state/chart_state'; +import { htmlIdGenerator } from '../../../utils/commons'; +import { XYChart } from '../renderer/canvas/xy_chart'; import { Annotations } from '../renderer/dom/annotations'; -import { isBrushAvailableSelector } from './selectors/is_brush_available'; -import { isChartEmptySelector } from './selectors/is_chart_empty'; +import { BrushTool } from '../renderer/dom/brush'; +import { Crosshair } from '../renderer/dom/crosshair'; +import { Highlighter } from '../renderer/dom/highlighter'; import { computeLegendSelector } from './selectors/compute_legend'; -import { getHighlightedValuesSelector } from './selectors/get_highlighted_values'; import { getPointerCursorSelector } from './selectors/get_cursor_pointer'; +import { getHighlightedValuesSelector } from './selectors/get_highlighted_values'; +import { getLegendItemsLabelsSelector } from './selectors/get_legend_items_labels'; +import { getSeriesSpecsSelector } from './selectors/get_specs'; +import { getTooltipAnchorPositionSelector } from './selectors/get_tooltip_position'; +import { getTooltipInfoSelector } from './selectors/get_tooltip_values_highlighted_geoms'; +import { isBrushAvailableSelector } from './selectors/is_brush_available'; import { isBrushingSelector } from './selectors/is_brushing'; +import { isChartEmptySelector } from './selectors/is_chart_empty'; import { isTooltipVisibleSelector } from './selectors/is_tooltip_visible'; -import { getTooltipInfoSelector } from './selectors/get_tooltip_values_highlighted_geoms'; -import { htmlIdGenerator } from '../../../utils/commons'; -import { Tooltip } from '../../../components/tooltip'; -import { getTooltipAnchorPositionSelector } from './selectors/get_tooltip_position'; -import { SeriesKey } from '../../../commons/series_id'; +import { createOnBrushEndCaller } from './selectors/on_brush_end_caller'; import { createOnElementClickCaller } from './selectors/on_element_click_caller'; -import { createOnElementOverCaller } from './selectors/on_element_over_caller'; import { createOnElementOutCaller } from './selectors/on_element_out_caller'; -import { createOnBrushEndCaller } from './selectors/on_brush_end_caller'; +import { createOnElementOverCaller } from './selectors/on_element_over_caller'; import { createOnPointerMoveCaller } from './selectors/on_pointer_move_caller'; -import { getLegendItemsLabelsSelector } from './selectors/get_legend_items_labels'; -import { LegendItemExtraValues } from '../../../commons/legend'; -import { getSeriesSpecsSelector } from './selectors/get_specs'; /** @internal */ export class XYAxisChartState implements InternalChartState { + chartType: ChartTypes; + legendId: string; + onElementClickCaller: (state: GlobalChartState) => void; onElementOverCaller: (state: GlobalChartState) => void; onElementOutCaller: (state: GlobalChartState) => void; onBrushEndCaller: (state: GlobalChartState) => void; onPointerMoveCaller: (state: GlobalChartState) => void; - chartType: ChartTypes; - legendId: string; constructor() { this.onElementClickCaller = createOnElementClickCaller(); @@ -64,6 +67,7 @@ export class XYAxisChartState implements InternalChartState { this.chartType = ChartTypes.XYAxis; this.legendId = htmlIdGenerator()('legend'); } + isInitialized(globalState: GlobalChartState) { return globalState.specsInitialized && getSeriesSpecsSelector(globalState).length > 0; } @@ -71,21 +75,27 @@ export class XYAxisChartState implements InternalChartState { isBrushAvailable(globalState: GlobalChartState) { return isBrushAvailableSelector(globalState); } + isBrushing(globalState: GlobalChartState) { return isBrushingSelector(globalState); } + isChartEmpty(globalState: GlobalChartState) { return isChartEmptySelector(globalState); } + getLegendItemsLabels(globalState: GlobalChartState) { return getLegendItemsLabelsSelector(globalState); } + getLegendItems(globalState: GlobalChartState) { return computeLegendSelector(globalState); } + getLegendExtraValues(globalState: GlobalChartState): Map { return getHighlightedValuesSelector(globalState); } + chartRenderer(containerRef: BackwardRef, forwardStageRef: RefObject) { return ( <> @@ -98,18 +108,23 @@ export class XYAxisChartState implements InternalChartState { ); } + getPointerCursor(globalState: GlobalChartState) { return getPointerCursorSelector(globalState); } + isTooltipVisible(globalState: GlobalChartState) { return isTooltipVisibleSelector(globalState); } + getTooltipInfo(globalState: GlobalChartState) { return getTooltipInfoSelector(globalState); } + getTooltipAnchor(globalState: GlobalChartState) { return getTooltipAnchorPositionSelector(globalState); } + eventCallbacks(globalState: GlobalChartState) { this.onElementOverCaller(globalState); this.onElementOutCaller(globalState); diff --git a/src/chart_types/xy_chart/state/selectors/compute_annotations.ts b/src/chart_types/xy_chart/state/selectors/compute_annotations.ts index 3e9003a7b4..170321c232 100644 --- a/src/chart_types/xy_chart/state/selectors/compute_annotations.ts +++ b/src/chart_types/xy_chart/state/selectors/compute_annotations.ts @@ -14,18 +14,20 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; -import { getAxisSpecsSelector, getAnnotationSpecsSelector } from './get_specs'; -import { computeChartDimensionsSelector } from './compute_chart_dimensions'; -import { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled'; -import { computeAnnotationDimensions } from '../../annotations/utils'; +import { AnnotationId } from '../../../../utils/ids'; import { AnnotationDimensions } from '../../annotations/types'; +import { computeAnnotationDimensions } from '../../annotations/utils'; +import { computeChartDimensionsSelector } from './compute_chart_dimensions'; import { computeSeriesGeometriesSelector } from './compute_series_geometries'; -import { AnnotationId } from '../../../../utils/ids'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getAxisSpecsSelector, getAnnotationSpecsSelector } from './get_specs'; +import { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled'; /** @internal */ export const computeAnnotationDimensionsSelector = createCachedSelector( @@ -45,15 +47,13 @@ export const computeAnnotationDimensionsSelector = createCachedSelector( { scales: { yScales, xScale } }, axesSpecs, isHistogramMode, - ): Map => { - return computeAnnotationDimensions( - annotationSpecs, - chartDimensions.chartDimensions, - settingsSpec.rotation, - yScales, - xScale, - axesSpecs, - isHistogramMode, - ); - }, + ): Map => computeAnnotationDimensions( + annotationSpecs, + chartDimensions.chartDimensions, + settingsSpec.rotation, + yScales, + xScale, + axesSpecs, + isHistogramMode, + ), )(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/compute_axis_ticks_dimensions.ts b/src/chart_types/xy_chart/state/selectors/compute_axis_ticks_dimensions.ts index 3e986d660f..8eab26720f 100644 --- a/src/chart_types/xy_chart/state/selectors/compute_axis_ticks_dimensions.ts +++ b/src/chart_types/xy_chart/state/selectors/compute_axis_ticks_dimensions.ts @@ -14,20 +14,22 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled'; -import { computeSeriesDomainsSelector } from './compute_series_domains'; + +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme'; +import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import { CanvasTextBBoxCalculator } from '../../../../utils/bbox/canvas_text_bbox_calculator'; +import { AxisId } from '../../../../utils/ids'; import { computeAxisTicksDimensions, AxisTicksDimensions, isDuplicateAxis } from '../../utils/axis_utils'; +import { computeSeriesDomainsSelector } from './compute_series_domains'; import { countBarsInClusterSelector } from './count_bars_in_cluster'; -import { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme'; -import { AxisId } from '../../../../utils/ids'; -import { getAxisSpecsSelector } from './get_specs'; -import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import { getBarPaddingsSelector } from './get_bar_paddings'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getAxisSpecsSelector } from './get_specs'; +import { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled'; /** @internal */ export const computeAxisTicksDimensionsSelector = createCachedSelector( @@ -67,8 +69,8 @@ export const computeAxisTicksDimensionsSelector = createCachedSelector( isHistogramMode, ); if ( - dimensions && - (!settingsSpec.hideDuplicateAxes || !isDuplicateAxis(axisSpec, dimensions, axesTicksDimensions, axesSpecs)) + dimensions + && (!settingsSpec.hideDuplicateAxes || !isDuplicateAxis(axisSpec, dimensions, axesTicksDimensions, axesSpecs)) ) { axesTicksDimensions.set(id, dimensions); } diff --git a/src/chart_types/xy_chart/state/selectors/compute_axis_visible_ticks.ts b/src/chart_types/xy_chart/state/selectors/compute_axis_visible_ticks.ts index f4c6c71596..6d73763d72 100644 --- a/src/chart_types/xy_chart/state/selectors/compute_axis_visible_ticks.ts +++ b/src/chart_types/xy_chart/state/selectors/compute_axis_visible_ticks.ts @@ -14,22 +14,24 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; -import { getAxisSpecsSelector } from './get_specs'; +import { Dimensions } from '../../../../utils/dimensions'; +import { AxisId } from '../../../../utils/ids'; import { getAxisTicksPositions, AxisTick, AxisLinePosition } from '../../utils/axis_utils'; -import { computeChartDimensionsSelector } from './compute_chart_dimensions'; -import { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme'; import { computeAxisTicksDimensionsSelector } from './compute_axis_ticks_dimensions'; +import { computeChartDimensionsSelector } from './compute_chart_dimensions'; import { computeSeriesDomainsSelector } from './compute_series_domains'; import { countBarsInClusterSelector } from './count_bars_in_cluster'; -import { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled'; import { getBarPaddingsSelector } from './get_bar_paddings'; -import { AxisId } from '../../../../utils/ids'; -import { Dimensions } from '../../../../utils/dimensions'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getAxisSpecsSelector } from './get_specs'; +import { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled'; /** @internal */ export interface AxisVisibleTicks { diff --git a/src/chart_types/xy_chart/state/selectors/compute_chart_dimensions.ts b/src/chart_types/xy_chart/state/selectors/compute_chart_dimensions.ts index 69df837987..f890e66c6a 100644 --- a/src/chart_types/xy_chart/state/selectors/compute_chart_dimensions.ts +++ b/src/chart_types/xy_chart/state/selectors/compute_chart_dimensions.ts @@ -14,16 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + +import { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions'; +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme'; -import { getAxisSpecsSelector } from './get_specs'; +import { Dimensions } from '../../../../utils/dimensions'; import { computeChartDimensions } from '../../utils/dimensions'; import { computeAxisTicksDimensionsSelector } from './compute_axis_ticks_dimensions'; -import { Dimensions } from '../../../../utils/dimensions'; -import { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getAxisSpecsSelector } from './get_specs'; /** @internal */ export const computeChartDimensionsSelector = createCachedSelector( @@ -41,7 +43,5 @@ export const computeChartDimensionsSelector = createCachedSelector( ): { chartDimensions: Dimensions; leftMargin: number; - } => { - return computeChartDimensions(chartContainerDimensions, chartTheme, axesTicksDimensions, axesSpecs); - }, + } => computeChartDimensions(chartContainerDimensions, chartTheme, axesTicksDimensions, axesSpecs), )(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/compute_chart_transform.ts b/src/chart_types/xy_chart/state/selectors/compute_chart_transform.ts index e8a6a941b0..2bfe97f68a 100644 --- a/src/chart_types/xy_chart/state/selectors/compute_chart_transform.ts +++ b/src/chart_types/xy_chart/state/selectors/compute_chart_transform.ts @@ -14,18 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import { computeChartTransform, Transform } from '../utils'; import { computeChartDimensionsSelector } from './compute_chart_dimensions'; -import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; /** @internal */ export const computeChartTransformSelector = createCachedSelector( [computeChartDimensionsSelector, getSettingsSpecSelector], - (chartDimensions, settingsSpecs): Transform => { - return computeChartTransform(chartDimensions.chartDimensions, settingsSpecs.rotation); - }, + (chartDimensions, settingsSpecs): Transform => + computeChartTransform(chartDimensions.chartDimensions, settingsSpecs.rotation), )(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/compute_legend.ts b/src/chart_types/xy_chart/state/selectors/compute_legend.ts index 0d7e4939f9..ba130b3a30 100644 --- a/src/chart_types/xy_chart/state/selectors/compute_legend.ts +++ b/src/chart_types/xy_chart/state/selectors/compute_legend.ts @@ -14,17 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { computeSeriesDomainsSelector } from './compute_series_domains'; -import { getSeriesSpecsSelector, getAxisSpecsSelector } from './get_specs'; -import { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme'; -import { getSeriesColorsSelector } from './get_series_color_map'; -import { computeLegend } from '../../legend/legend'; + import { LegendItem } from '../../../../commons/legend'; import { GlobalChartState } from '../../../../state/chart_state'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme'; +import { computeLegend } from '../../legend/legend'; +import { computeSeriesDomainsSelector } from './compute_series_domains'; +import { getSeriesColorsSelector } from './get_series_color_map'; +import { getSeriesSpecsSelector, getAxisSpecsSelector } from './get_specs'; const getDeselectedSeriesSelector = (state: GlobalChartState) => state.interactions.deselectedDataSeries; @@ -38,14 +40,19 @@ export const computeLegendSelector = createCachedSelector( getAxisSpecsSelector, getDeselectedSeriesSelector, ], - (seriesSpecs, seriesDomainsAndData, chartTheme, seriesColors, axesSpecs, deselectedDataSeries): LegendItem[] => { - return computeLegend( - seriesDomainsAndData.seriesCollection, - seriesColors, - seriesSpecs, - chartTheme.colors.defaultVizColor, - axesSpecs, - deselectedDataSeries, - ); - }, + ( + seriesSpecs, + seriesDomainsAndData, + chartTheme, + seriesColors, + axesSpecs, + deselectedDataSeries, + ): LegendItem[] => computeLegend( + seriesDomainsAndData.seriesCollection, + seriesColors, + seriesSpecs, + chartTheme.colors.defaultVizColor, + axesSpecs, + deselectedDataSeries, + ), )(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/compute_series_domains.ts b/src/chart_types/xy_chart/state/selectors/compute_series_domains.ts index b7b72f6970..fc7ae44458 100644 --- a/src/chart_types/xy_chart/state/selectors/compute_series_domains.ts +++ b/src/chart_types/xy_chart/state/selectors/compute_series_domains.ts @@ -14,15 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + +import { GlobalChartState } from '../../../../state/chart_state'; +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; +import { computeSeriesDomains, SeriesDomainsAndData } from '../utils'; import { getSeriesSpecsSelector } from './get_specs'; import { mergeYCustomDomainsByGroupIdSelector } from './merge_y_custom_domains'; -import { computeSeriesDomains, SeriesDomainsAndData } from '../utils'; -import { GlobalChartState } from '../../../../state/chart_state'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; const getDeselectedSeriesSelector = (state: GlobalChartState) => state.interactions.deselectedDataSeries; diff --git a/src/chart_types/xy_chart/state/selectors/compute_series_geometries.ts b/src/chart_types/xy_chart/state/selectors/compute_series_geometries.ts index 33e589106f..127e570339 100644 --- a/src/chart_types/xy_chart/state/selectors/compute_series_geometries.ts +++ b/src/chart_types/xy_chart/state/selectors/compute_series_geometries.ts @@ -14,18 +14,20 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled'; -import { computeSeriesDomainsSelector } from './compute_series_domains'; + +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme'; -import { getSeriesSpecsSelector, getAxisSpecsSelector } from './get_specs'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import { computeSeriesGeometries, ComputedGeometries } from '../utils'; -import { getSeriesColorsSelector } from './get_series_color_map'; import { computeChartDimensionsSelector } from './compute_chart_dimensions'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { computeSeriesDomainsSelector } from './compute_series_domains'; +import { getSeriesColorsSelector } from './get_series_color_map'; +import { getSeriesSpecsSelector, getAxisSpecsSelector } from './get_specs'; +import { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled'; /** @internal */ export const computeSeriesGeometriesSelector = createCachedSelector( diff --git a/src/chart_types/xy_chart/state/selectors/count_bars_in_cluster.ts b/src/chart_types/xy_chart/state/selectors/count_bars_in_cluster.ts index 14a5ba6077..903eab8027 100644 --- a/src/chart_types/xy_chart/state/selectors/count_bars_in_cluster.ts +++ b/src/chart_types/xy_chart/state/selectors/count_bars_in_cluster.ts @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { computeSeriesDomainsSelector } from './compute_series_domains'; -import { countBarsInCluster } from '../../utils/scales'; + import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { countBarsInCluster } from '../../utils/scales'; +import { computeSeriesDomainsSelector } from './compute_series_domains'; /** @internal */ export const countBarsInClusterSelector = createCachedSelector( diff --git a/src/chart_types/xy_chart/state/selectors/get_annotation_tooltip_state.ts b/src/chart_types/xy_chart/state/selectors/get_annotation_tooltip_state.ts index d1efde2b0a..568f2c26b4 100644 --- a/src/chart_types/xy_chart/state/selectors/get_annotation_tooltip_state.ts +++ b/src/chart_types/xy_chart/state/selectors/get_annotation_tooltip_state.ts @@ -14,26 +14,28 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + +import { TooltipInfo } from '../../../../components/tooltip/types'; +import { GlobalChartState } from '../../../../state/chart_state'; +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation'; +import { Rotation } from '../../../../utils/commons'; import { Dimensions } from '../../../../utils/dimensions'; +import { AnnotationId } from '../../../../utils/ids'; import { Point } from '../../../../utils/point'; -import { computeChartDimensionsSelector } from './compute_chart_dimensions'; -import { getAxisSpecsSelector, getAnnotationSpecsSelector } from './get_specs'; -import { AxisSpec, AnnotationSpec, AnnotationTypes } from '../../utils/specs'; -import { Rotation } from '../../../../utils/commons'; import { computeAnnotationTooltipState } from '../../annotations/tooltip'; import { AnnotationTooltipState, AnnotationDimensions } from '../../annotations/types'; +import { AxisSpec, AnnotationSpec, AnnotationTypes } from '../../utils/specs'; +import { ComputedGeometries } from '../utils'; import { computeAnnotationDimensionsSelector } from './compute_annotations'; -import { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation'; -import { AnnotationId } from '../../../../utils/ids'; +import { computeChartDimensionsSelector } from './compute_chart_dimensions'; import { computeSeriesGeometriesSelector } from './compute_series_geometries'; -import { ComputedGeometries } from '../utils'; +import { getAxisSpecsSelector, getAnnotationSpecsSelector } from './get_specs'; import { getTooltipInfoSelector } from './get_tooltip_values_highlighted_geoms'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; -import { GlobalChartState } from '../../../../state/chart_state'; -import { TooltipInfo } from '../../../../components/tooltip/types'; const getCurrentPointerPosition = (state: GlobalChartState) => state.interactions.pointer.current.position; @@ -87,10 +89,10 @@ function getAnnotationTooltipState( // If there's a highlighted chart element tooltip value, don't show annotation tooltip const isChartTooltipDisplayed = tooltip.values.some(({ isHighlighted }) => isHighlighted); if ( - tooltipState && - tooltipState.isVisible && - tooltipState.annotationType === AnnotationTypes.Rectangle && - isChartTooltipDisplayed + tooltipState + && tooltipState.isVisible + && tooltipState.annotationType === AnnotationTypes.Rectangle + && isChartTooltipDisplayed ) { return null; } diff --git a/src/chart_types/xy_chart/state/selectors/get_bar_paddings.ts b/src/chart_types/xy_chart/state/selectors/get_bar_paddings.ts index 7b4750e4c1..cd96a5a8a8 100644 --- a/src/chart_types/xy_chart/state/selectors/get_bar_paddings.ts +++ b/src/chart_types/xy_chart/state/selectors/get_bar_paddings.ts @@ -14,17 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled'; -import { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme'; + import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme'; +import { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled'; /** @internal */ export const getBarPaddingsSelector = createCachedSelector( [isHistogramModeEnabledSelector, getChartThemeSelector], - (isHistogramMode, chartTheme): number => { - return isHistogramMode ? chartTheme.scales.histogramPadding : chartTheme.scales.barsPadding; - }, + (isHistogramMode, chartTheme): number => isHistogramMode + ? chartTheme.scales.histogramPadding + : chartTheme.scales.barsPadding, )(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/get_brush_area.test.ts b/src/chart_types/xy_chart/state/selectors/get_brush_area.test.ts index 9ab3b95916..ea177df54d 100644 --- a/src/chart_types/xy_chart/state/selectors/get_brush_area.test.ts +++ b/src/chart_types/xy_chart/state/selectors/get_brush_area.test.ts @@ -14,10 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { getBrushForXAxis, getBrushForYAxis, getBrushForBothAxis } from './get_brush_area'; import { Dimensions } from '../../../../utils/dimensions'; +import { getBrushForXAxis, getBrushForYAxis, getBrushForBothAxis } from './get_brush_area'; describe('getBrushArea Selector', () => { it('should return the brush area', () => { diff --git a/src/chart_types/xy_chart/state/selectors/get_brush_area.ts b/src/chart_types/xy_chart/state/selectors/get_brush_area.ts index 5847d2ff6b..8382886101 100644 --- a/src/chart_types/xy_chart/state/selectors/get_brush_area.ts +++ b/src/chart_types/xy_chart/state/selectors/get_brush_area.ts @@ -14,26 +14,26 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { isVerticalRotation } from '../utils'; + +import { BrushAxis } from '../../../../specs'; import { GlobalChartState } from '../../../../state/chart_state'; -import { Dimensions } from '../../../../utils/dimensions'; -import { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation'; -import { computeChartDimensionsSelector } from './compute_chart_dimensions'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; -import { BrushAxis } from '../../../../specs'; import { Rotation } from '../../../../utils/commons'; +import { Dimensions } from '../../../../utils/dimensions'; import { Point } from '../../../../utils/point'; +import { isVerticalRotation } from '../utils'; +import { computeChartDimensionsSelector } from './compute_chart_dimensions'; const MIN_AREA_SIZE = 1; const getMouseDownPosition = (state: GlobalChartState) => state.interactions.pointer.down; -const getCurrentPointerPosition = (state: GlobalChartState) => { - return state.interactions.pointer.current.position; -}; +const getCurrentPointerPosition = (state: GlobalChartState) => state.interactions.pointer.current.position; /** @internal */ export const getBrushAreaSelector = createCachedSelector( diff --git a/src/chart_types/xy_chart/state/selectors/get_computed_scales.ts b/src/chart_types/xy_chart/state/selectors/get_computed_scales.ts index 643745eb6c..2e0166cd17 100644 --- a/src/chart_types/xy_chart/state/selectors/get_computed_scales.ts +++ b/src/chart_types/xy_chart/state/selectors/get_computed_scales.ts @@ -14,17 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { ComputedScales } from '../utils'; import { computeSeriesGeometriesSelector } from './compute_series_geometries'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; /** @internal */ export const getComputedScalesSelector = createCachedSelector( [computeSeriesGeometriesSelector], - (geometries): ComputedScales => { - return geometries.scales; - }, + ({ scales }): ComputedScales => scales, )(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/get_cursor_band.ts b/src/chart_types/xy_chart/state/selectors/get_cursor_band.ts index 4e093d0f8f..f456717597 100644 --- a/src/chart_types/xy_chart/state/selectors/get_cursor_band.ts +++ b/src/chart_types/xy_chart/state/selectors/get_cursor_band.ts @@ -14,27 +14,29 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { Dimensions } from '../../../../utils/dimensions'; import createCachedSelector from 're-reselect'; -import { Point } from '../../../../utils/point'; + import { Scale } from '../../../../scales'; -import { isLineAreaOnlyChart } from '../utils'; -import { getCursorBandPosition } from '../../crosshair/crosshair_utils'; import { SettingsSpec, PointerEvent } from '../../../../specs/settings'; +import { GlobalChartState } from '../../../../state/chart_state'; +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; -import { computeChartDimensionsSelector } from './compute_chart_dimensions'; +import { Dimensions } from '../../../../utils/dimensions'; +import { isValidPointerOverEvent } from '../../../../utils/events'; +import { Point } from '../../../../utils/point'; +import { getCursorBandPosition } from '../../crosshair/crosshair_utils'; import { BasicSeriesSpec } from '../../utils/specs'; -import { countBarsInClusterSelector } from './count_bars_in_cluster'; -import { getSeriesSpecsSelector } from './get_specs'; +import { isLineAreaOnlyChart } from '../utils'; +import { computeChartDimensionsSelector } from './compute_chart_dimensions'; import { computeSeriesGeometriesSelector } from './compute_series_geometries'; +import { countBarsInClusterSelector } from './count_bars_in_cluster'; +import { getGeometriesIndexKeysSelector } from './get_geometries_index_keys'; import { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position'; +import { getSeriesSpecsSelector } from './get_specs'; import { isTooltipSnapEnableSelector } from './is_tooltip_snap_enabled'; -import { getGeometriesIndexKeysSelector } from './get_geometries_index_keys'; -import { GlobalChartState } from '../../../../state/chart_state'; -import { isValidPointerOverEvent } from '../../../../utils/events'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; const getExternalPointerEventStateSelector = (state: GlobalChartState) => state.externalEvents.pointer; @@ -61,19 +63,17 @@ export const getCursorBandPositionSelector = createCachedSelector( totalBarsInCluster, isTooltipSnapEnabled, geometriesIndexKeys, - ) => { - return getCursorBand( - orientedProjectedPointerPosition, - externalPointerEvent, - chartDimensions.chartDimensions, - settingsSpec, - seriesGeometries.scales.xScale, - seriesSpec, - totalBarsInCluster, - isTooltipSnapEnabled, - geometriesIndexKeys, - ); - }, + ) => getCursorBand( + orientedProjectedPointerPosition, + externalPointerEvent, + chartDimensions.chartDimensions, + settingsSpec, + seriesGeometries.scales.xScale, + seriesSpec, + totalBarsInCluster, + isTooltipSnapEnabled, + geometriesIndexKeys, + ), )(getChartIdSelector); function getCursorBand( diff --git a/src/chart_types/xy_chart/state/selectors/get_cursor_line.ts b/src/chart_types/xy_chart/state/selectors/get_cursor_line.ts index 628b38f425..b90b54de0f 100644 --- a/src/chart_types/xy_chart/state/selectors/get_cursor_line.ts +++ b/src/chart_types/xy_chart/state/selectors/get_cursor_line.ts @@ -14,20 +14,32 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { getCursorLinePosition } from '../../crosshair/crosshair_utils'; + +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; +import { Dimensions } from '../../../../utils/dimensions'; +import { getCursorLinePosition } from '../../crosshair/crosshair_utils'; import { computeChartDimensionsSelector } from './compute_chart_dimensions'; import { getProjectedPointerPositionSelector } from './get_projected_pointer_position'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; -import { Dimensions } from '../../../../utils/dimensions'; /** @internal */ export const getCursorLinePositionSelector = createCachedSelector( - [computeChartDimensionsSelector, getSettingsSpecSelector, getProjectedPointerPositionSelector], - (chartDimensions, settingsSpec, projectedPointerPosition): Dimensions | undefined => { - return getCursorLinePosition(settingsSpec.rotation, chartDimensions.chartDimensions, projectedPointerPosition); - }, + [ + computeChartDimensionsSelector, + getSettingsSpecSelector, + getProjectedPointerPositionSelector, + ], + ( + chartDimensions, + settingsSpec, + projectedPointerPosition, + ): Dimensions | undefined => getCursorLinePosition( + settingsSpec.rotation, + chartDimensions.chartDimensions, + projectedPointerPosition, + ), )(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/get_cursor_pointer.ts b/src/chart_types/xy_chart/state/selectors/get_cursor_pointer.ts index 3f5cad40ec..96ebd7acfa 100644 --- a/src/chart_types/xy_chart/state/selectors/get_cursor_pointer.ts +++ b/src/chart_types/xy_chart/state/selectors/get_cursor_pointer.ts @@ -14,15 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + +import { GlobalChartState } from '../../../../state/chart_state'; +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import { computeChartDimensionsSelector } from './compute_chart_dimensions'; import { getHighlightedGeomsSelector } from './get_tooltip_values_highlighted_geoms'; -import { GlobalChartState } from '../../../../state/chart_state'; import { isBrushAvailableSelector } from './is_brush_available'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; const getCurrentPointerPositionSelector = (state: GlobalChartState) => state.interactions.pointer.current.position; diff --git a/src/chart_types/xy_chart/state/selectors/get_elements_at_cursor_pos.ts b/src/chart_types/xy_chart/state/selectors/get_elements_at_cursor_pos.ts index 68fbb899c8..6f8c4ee45d 100644 --- a/src/chart_types/xy_chart/state/selectors/get_elements_at_cursor_pos.ts +++ b/src/chart_types/xy_chart/state/selectors/get_elements_at_cursor_pos.ts @@ -14,23 +14,25 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { Point } from '../../../../utils/point'; -import { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position'; -import { ComputedScales } from '../utils'; -import { getComputedScalesSelector } from './get_computed_scales'; -import { getGeometriesIndexKeysSelector } from './get_geometries_index_keys'; -import { getGeometriesIndexSelector } from './get_geometries_index'; -import { IndexedGeometry } from '../../../../utils/geometry'; + import { PointerEvent } from '../../../../specs'; -import { computeChartDimensionsSelector } from './compute_chart_dimensions'; -import { Dimensions } from '../../../../utils/dimensions'; import { GlobalChartState } from '../../../../state/chart_state'; -import { isValidPointerOverEvent } from '../../../../utils/events'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { Dimensions } from '../../../../utils/dimensions'; +import { isValidPointerOverEvent } from '../../../../utils/events'; +import { IndexedGeometry } from '../../../../utils/geometry'; +import { Point } from '../../../../utils/point'; import { IndexedGeometryMap } from '../../utils/indexed_geometry_map'; +import { ComputedScales } from '../utils'; +import { computeChartDimensionsSelector } from './compute_chart_dimensions'; +import { getComputedScalesSelector } from './get_computed_scales'; +import { getGeometriesIndexSelector } from './get_geometries_index'; +import { getGeometriesIndexKeysSelector } from './get_geometries_index_keys'; +import { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position'; const getExternalPointerEventStateSelector = (state: GlobalChartState) => state.externalEvents.pointer; diff --git a/src/chart_types/xy_chart/state/selectors/get_geometries_index.ts b/src/chart_types/xy_chart/state/selectors/get_geometries_index.ts index 2306a9c63a..321b13932e 100644 --- a/src/chart_types/xy_chart/state/selectors/get_geometries_index.ts +++ b/src/chart_types/xy_chart/state/selectors/get_geometries_index.ts @@ -14,17 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { computeSeriesGeometriesSelector } from './compute_series_geometries'; + import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { IndexedGeometryMap } from '../../utils/indexed_geometry_map'; +import { computeSeriesGeometriesSelector } from './compute_series_geometries'; /** @internal */ export const getGeometriesIndexSelector = createCachedSelector( [computeSeriesGeometriesSelector], - (geometries): IndexedGeometryMap => { - return geometries.geometriesIndex; - }, + ({ geometriesIndex }): IndexedGeometryMap => geometriesIndex, )(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/get_geometries_index_keys.ts b/src/chart_types/xy_chart/state/selectors/get_geometries_index_keys.ts index 6d225f5f69..d0f7196d7b 100644 --- a/src/chart_types/xy_chart/state/selectors/get_geometries_index_keys.ts +++ b/src/chart_types/xy_chart/state/selectors/get_geometries_index_keys.ts @@ -14,17 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { compareByValueAsc } from '../../../../utils/commons'; import { computeSeriesGeometriesSelector } from './compute_series_geometries'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; /** @internal */ export const getGeometriesIndexKeysSelector = createCachedSelector( [computeSeriesGeometriesSelector], - (seriesGeometries): (number | string)[] => { - return seriesGeometries.geometriesIndex.keys().sort(compareByValueAsc); - }, + (seriesGeometries): (number | string)[] => seriesGeometries.geometriesIndex.keys().sort(compareByValueAsc), )(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/get_highlighted_series.ts b/src/chart_types/xy_chart/state/selectors/get_highlighted_series.ts index 30c07e8b95..9e361baeb9 100644 --- a/src/chart_types/xy_chart/state/selectors/get_highlighted_series.ts +++ b/src/chart_types/xy_chart/state/selectors/get_highlighted_series.ts @@ -14,13 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { GlobalChartState } from '../../../../state/chart_state'; -import { computeLegendSelector } from './compute_legend'; + import { LegendItem } from '../../../../commons/legend'; +import { GlobalChartState } from '../../../../state/chart_state'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { computeLegendSelector } from './compute_legend'; const getHighlightedLegendItemKey = (state: GlobalChartState) => state.interactions.highlightedLegendItemKey; @@ -29,7 +31,7 @@ export const getHighlightedSeriesSelector = createCachedSelector( [getHighlightedLegendItemKey, computeLegendSelector], (highlightedLegendItemKey, legendItems): LegendItem | undefined => { if (!highlightedLegendItemKey) { - return undefined; + return; } return legendItems.find(({ seriesIdentifier: { key } }) => key === highlightedLegendItemKey); }, diff --git a/src/chart_types/xy_chart/state/selectors/get_highlighted_values.ts b/src/chart_types/xy_chart/state/selectors/get_highlighted_values.ts index 0227e28304..dad488be56 100644 --- a/src/chart_types/xy_chart/state/selectors/get_highlighted_values.ts +++ b/src/chart_types/xy_chart/state/selectors/get_highlighted_values.ts @@ -14,19 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + +import { LegendItemExtraValues } from '../../../../commons/legend'; +import { SeriesKey } from '../../../../commons/series_id'; +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { getHighligthedValues } from '../../tooltip/tooltip'; import { getTooltipInfoSelector } from './get_tooltip_values_highlighted_geoms'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; -import { SeriesKey } from '../../../../commons/series_id'; -import { LegendItemExtraValues } from '../../../../commons/legend'; /** @internal */ export const getHighlightedValuesSelector = createCachedSelector( [getTooltipInfoSelector], - ({ values }): Map => { - return getHighligthedValues(values); - }, + ({ values }): Map => getHighligthedValues(values), )(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/get_legend_items_labels.ts b/src/chart_types/xy_chart/state/selectors/get_legend_items_labels.ts index 3e9cdc2195..af4054eba5 100644 --- a/src/chart_types/xy_chart/state/selectors/get_legend_items_labels.ts +++ b/src/chart_types/xy_chart/state/selectors/get_legend_items_labels.ts @@ -14,24 +14,23 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { computeLegendSelector } from './compute_legend'; + import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; -import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import { LegendItemLabel } from '../../../../state/selectors/get_legend_items_labels'; +import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; +import { computeLegendSelector } from './compute_legend'; /** @internal */ export const getLegendItemsLabelsSelector = createCachedSelector( [computeLegendSelector, getSettingsSpecSelector], - (legendItems, { showLegendExtra }): LegendItemLabel[] => { - return legendItems.map(({ label, defaultExtra }) => { - if (defaultExtra?.formatted != null) { - return { label: `${label}${showLegendExtra ? defaultExtra.formatted : ''}`, depth: 0 }; - } else { - return { label, depth: 0 }; - } - }); - }, + (legendItems, { showLegendExtra }): LegendItemLabel[] => legendItems.map(({ label, defaultExtra }) => { + if (defaultExtra?.formatted != null) { + return { label: `${label}${showLegendExtra ? defaultExtra.formatted : ''}`, depth: 0 }; + } + return { label, depth: 0 }; + }), )(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/get_oriented_projected_pointer_position.ts b/src/chart_types/xy_chart/state/selectors/get_oriented_projected_pointer_position.ts index 3628e54880..096538757a 100644 --- a/src/chart_types/xy_chart/state/selectors/get_oriented_projected_pointer_position.ts +++ b/src/chart_types/xy_chart/state/selectors/get_oriented_projected_pointer_position.ts @@ -14,17 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { Dimensions } from '../../../../utils/dimensions'; import createCachedSelector from 're-reselect'; -import { getProjectedPointerPositionSelector } from './get_projected_pointer_position'; -import { Point } from '../../../../utils/point'; -import { getOrientedXPosition, getOrientedYPosition } from '../../utils/interactions'; + import { SettingsSpec } from '../../../../specs/settings'; +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; +import { Dimensions } from '../../../../utils/dimensions'; +import { Point } from '../../../../utils/point'; +import { getOrientedXPosition, getOrientedYPosition } from '../../utils/interactions'; import { computeChartDimensionsSelector } from './compute_chart_dimensions'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getProjectedPointerPositionSelector } from './get_projected_pointer_position'; /** @internal */ export const getOrientedProjectedPointerPositionSelector = createCachedSelector( diff --git a/src/chart_types/xy_chart/state/selectors/get_projected_pointer_position.ts b/src/chart_types/xy_chart/state/selectors/get_projected_pointer_position.ts index ffadd602c3..5b78af8bd2 100644 --- a/src/chart_types/xy_chart/state/selectors/get_projected_pointer_position.ts +++ b/src/chart_types/xy_chart/state/selectors/get_projected_pointer_position.ts @@ -14,23 +14,23 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { Dimensions } from '../../../../utils/dimensions'; -import { computeChartDimensionsSelector } from './compute_chart_dimensions'; + import { GlobalChartState } from '../../../../state/chart_state'; -import { Point } from '../../../../utils/point'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { Dimensions } from '../../../../utils/dimensions'; +import { Point } from '../../../../utils/point'; +import { computeChartDimensionsSelector } from './compute_chart_dimensions'; const getCurrentPointerPosition = (state: GlobalChartState) => state.interactions.pointer.current.position; /** @internal */ export const getProjectedPointerPositionSelector = createCachedSelector( [getCurrentPointerPosition, computeChartDimensionsSelector], - (currentPointerPosition, chartDimensions): Point => { - return getProjectedPointerPosition(currentPointerPosition, chartDimensions.chartDimensions); - }, + (currentPointerPosition, chartDimensions): Point => getProjectedPointerPosition(currentPointerPosition, chartDimensions.chartDimensions), )(getChartIdSelector); /** diff --git a/src/chart_types/xy_chart/state/selectors/get_series_color_map.ts b/src/chart_types/xy_chart/state/selectors/get_series_color_map.ts index 45e2aeb10f..c60c34d622 100644 --- a/src/chart_types/xy_chart/state/selectors/get_series_color_map.ts +++ b/src/chart_types/xy_chart/state/selectors/get_series_color_map.ts @@ -14,18 +14,20 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { computeSeriesDomainsSelector } from './compute_series_domains'; -import { getSeriesSpecsSelector } from './get_specs'; -import { getSeriesColors } from '../../utils/series'; + import { SeriesKey } from '../../../../commons/series_id'; -import { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; -import { getCustomSeriesColors } from '../utils'; import { GlobalChartState } from '../../../../state/chart_state'; +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme'; import { Color } from '../../../../utils/commons'; +import { getSeriesColors } from '../../utils/series'; +import { getCustomSeriesColors } from '../utils'; +import { computeSeriesDomainsSelector } from './compute_series_domains'; +import { getSeriesSpecsSelector } from './get_specs'; function getColorOverrides({ colors }: GlobalChartState) { return colors; diff --git a/src/chart_types/xy_chart/state/selectors/get_specs.test.ts b/src/chart_types/xy_chart/state/selectors/get_specs.test.ts index 3c7f1f6d94..85421cada5 100644 --- a/src/chart_types/xy_chart/state/selectors/get_specs.test.ts +++ b/src/chart_types/xy_chart/state/selectors/get_specs.test.ts @@ -14,17 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { getSeriesSpecsSelector } from './get_specs'; -import { getInitialState } from '../../../../state/chart_state'; import { MockSeriesSpec } from '../../../../mocks/specs'; +import { getInitialState } from '../../../../state/chart_state'; +import { getSeriesSpecsSelector } from './get_specs'; describe('selector - get_specs', () => { const state = getInitialState('chartId1'); beforeEach(() => { - state.specs['bars1'] = MockSeriesSpec.bar({ id: 'bars1' }); - state.specs['bars2'] = MockSeriesSpec.bar({ id: 'bars2' }); + state.specs.bars1 = MockSeriesSpec.bar({ id: 'bars1' }); + state.specs.bars2 = MockSeriesSpec.bar({ id: 'bars2' }); }); it('shall return the same ref objects', () => { const series = getSeriesSpecsSelector(state); diff --git a/src/chart_types/xy_chart/state/selectors/get_specs.ts b/src/chart_types/xy_chart/state/selectors/get_specs.ts index 0288ba0a6e..a924893086 100644 --- a/src/chart_types/xy_chart/state/selectors/get_specs.ts +++ b/src/chart_types/xy_chart/state/selectors/get_specs.ts @@ -14,22 +14,22 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + +import { ChartTypes } from '../../..'; +import { SpecTypes } from '../../../../specs/settings'; import { GlobalChartState } from '../../../../state/chart_state'; +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { getSpecsFromStore } from '../../../../state/utils'; import { AxisSpec, BasicSeriesSpec, AnnotationSpec } from '../../utils/specs'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; -import { ChartTypes } from '../../..'; -import { SpecTypes } from '../../../../specs/settings'; const getSpecs = (state: GlobalChartState) => state.specs; /** @internal */ -export const getAxisSpecsSelector = createCachedSelector([getSpecs], (specs): AxisSpec[] => { - return getSpecsFromStore(specs, ChartTypes.XYAxis, SpecTypes.Axis); -})(getChartIdSelector); +export const getAxisSpecsSelector = createCachedSelector([getSpecs], (specs): AxisSpec[] => getSpecsFromStore(specs, ChartTypes.XYAxis, SpecTypes.Axis))(getChartIdSelector); /** @internal */ export const getSeriesSpecsSelector = createCachedSelector([getSpecs], (specs) => { @@ -38,6 +38,4 @@ export const getSeriesSpecsSelector = createCachedSelector([getSpecs], (specs) = })(getChartIdSelector); /** @internal */ -export const getAnnotationSpecsSelector = createCachedSelector([getSpecs], (specs) => { - return getSpecsFromStore(specs, ChartTypes.XYAxis, SpecTypes.Annotation); -})(getChartIdSelector); +export const getAnnotationSpecsSelector = createCachedSelector([getSpecs], (specs) => getSpecsFromStore(specs, ChartTypes.XYAxis, SpecTypes.Annotation))(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/get_tooltip_position.ts b/src/chart_types/xy_chart/state/selectors/get_tooltip_position.ts index e773710d3f..951a2ed782 100644 --- a/src/chart_types/xy_chart/state/selectors/get_tooltip_position.ts +++ b/src/chart_types/xy_chart/state/selectors/get_tooltip_position.ts @@ -14,17 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + +import { TooltipAnchorPosition } from '../../../../components/tooltip/types'; +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import { getTooltipAnchorPosition } from '../../crosshair/crosshair_utils'; -import { getProjectedPointerPositionSelector } from './get_projected_pointer_position'; +import { computeChartDimensionsSelector } from './compute_chart_dimensions'; import { getComputedScalesSelector } from './get_computed_scales'; import { getCursorBandPositionSelector } from './get_cursor_band'; -import { computeChartDimensionsSelector } from './compute_chart_dimensions'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; -import { TooltipAnchorPosition } from '../../../../components/tooltip/types'; +import { getProjectedPointerPositionSelector } from './get_projected_pointer_position'; /** @internal */ export const getTooltipAnchorPositionSelector = createCachedSelector( diff --git a/src/chart_types/xy_chart/state/selectors/get_tooltip_snap.ts b/src/chart_types/xy_chart/state/selectors/get_tooltip_snap.ts index 2dee19386e..26d57e592c 100644 --- a/src/chart_types/xy_chart/state/selectors/get_tooltip_snap.ts +++ b/src/chart_types/xy_chart/state/selectors/get_tooltip_snap.ts @@ -14,13 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; -import { SettingsSpec, isTooltipProps } from '../../../../specs/settings'; -import { DEFAULT_TOOLTIP_SNAP } from '../../../../specs/settings'; + +import { SettingsSpec, isTooltipProps, DEFAULT_TOOLTIP_SNAP } from '../../../../specs/settings'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; /** @internal */ export const getTooltipSnapSelector = createCachedSelector( diff --git a/src/chart_types/xy_chart/state/selectors/get_tooltip_type.ts b/src/chart_types/xy_chart/state/selectors/get_tooltip_type.ts index 70e9bf55df..37c5c0f1cb 100644 --- a/src/chart_types/xy_chart/state/selectors/get_tooltip_type.ts +++ b/src/chart_types/xy_chart/state/selectors/get_tooltip_type.ts @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; + import { getTooltipType } from '../../../../specs/settings'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; /** @internal */ export const getTooltipTypeSelector = createCachedSelector( diff --git a/src/chart_types/xy_chart/state/selectors/get_tooltip_values_highlighted_geoms.ts b/src/chart_types/xy_chart/state/selectors/get_tooltip_values_highlighted_geoms.ts index 41866a8c0c..2fb22ede77 100644 --- a/src/chart_types/xy_chart/state/selectors/get_tooltip_values_highlighted_geoms.ts +++ b/src/chart_types/xy_chart/state/selectors/get_tooltip_values_highlighted_geoms.ts @@ -14,24 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { getProjectedPointerPositionSelector } from './get_projected_pointer_position'; -import { Point } from '../../../../utils/point'; -import { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position'; -import { ComputedScales, getAxesSpecForSpecId, getSpecsById } from '../utils'; -import { getComputedScalesSelector } from './get_computed_scales'; -import { getElementAtCursorPositionSelector } from './get_elements_at_cursor_pos'; -import { IndexedGeometry } from '../../../../utils/geometry'; -import { getSeriesSpecsSelector, getAxisSpecsSelector } from './get_specs'; -import { BasicSeriesSpec, AxisSpec } from '../../utils/specs'; -import { Rotation } from '../../../../utils/commons'; -import { getTooltipTypeSelector } from './get_tooltip_type'; -import { formatTooltip } from '../../tooltip/tooltip'; -import { getTooltipHeaderFormatterSelector } from '../../../../state/selectors/get_tooltip_header_formatter'; -import { isPointOnGeometry } from '../../rendering/rendering'; -import { GlobalChartState } from '../../../../state/chart_state'; + +import { TooltipInfo } from '../../../../components/tooltip/types'; import { PointerEvent, isPointerOutEvent, @@ -41,12 +29,26 @@ import { isFollowTooltipType, SettingsSpec, } from '../../../../specs'; -import { isValidPointerOverEvent } from '../../../../utils/events'; -import { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation'; +import { GlobalChartState } from '../../../../state/chart_state'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; -import { hasSingleSeriesSelector } from './has_single_series'; -import { TooltipInfo } from '../../../../components/tooltip/types'; +import { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; +import { getTooltipHeaderFormatterSelector } from '../../../../state/selectors/get_tooltip_header_formatter'; +import { Rotation } from '../../../../utils/commons'; +import { isValidPointerOverEvent } from '../../../../utils/events'; +import { IndexedGeometry } from '../../../../utils/geometry'; +import { Point } from '../../../../utils/point'; +import { isPointOnGeometry } from '../../rendering/rendering'; +import { formatTooltip } from '../../tooltip/tooltip'; +import { BasicSeriesSpec, AxisSpec } from '../../utils/specs'; +import { ComputedScales, getAxesSpecForSpecId, getSpecsById } from '../utils'; +import { getComputedScalesSelector } from './get_computed_scales'; +import { getElementAtCursorPositionSelector } from './get_elements_at_cursor_pos'; +import { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position'; +import { getProjectedPointerPositionSelector } from './get_projected_pointer_position'; +import { getSeriesSpecsSelector, getAxisSpecsSelector } from './get_specs'; +import { getTooltipTypeSelector } from './get_tooltip_type'; +import { hasSingleSeriesSelector } from './has_single_series'; const EMPTY_VALUES = Object.freeze({ tooltip: { @@ -81,9 +83,7 @@ export const getTooltipInfoAndGeometriesSelector = createCachedSelector( getTooltipHeaderFormatterSelector, ], getTooltipAndHighlightFromValue, -)((state: GlobalChartState) => { - return state.chartId; -}); +)(({ chartId }) => chartId); function getTooltipAndHighlightFromValue( seriesSpecs: BasicSeriesSpec[], @@ -105,8 +105,7 @@ function getTooltipAndHighlightFromValue( if (tooltipType === TooltipType.None) { return EMPTY_VALUES; } - let x = orientedProjectedPointerPosition.x; - let y = orientedProjectedPointerPosition.y; + let { x, y } = orientedProjectedPointerPosition; if (isValidPointerOverEvent(scales.xScale, externalPointerEvent)) { const scaledX = scales.xScale.pureScale(externalPointerEvent.value); @@ -152,8 +151,8 @@ function getTooltipAndHighlightFromValue( // check if the pointer is on the geometry (avoid checking if using external pointer event) let isHighlighted = false; if ( - (!externalPointerEvent || isPointerOutEvent(externalPointerEvent)) && - isPointOnGeometry(x, y, indexedGeometry, settings.pointBuffer) + (!externalPointerEvent || isPointerOutEvent(externalPointerEvent)) + && isPointOnGeometry(x, y, indexedGeometry, settings.pointBuffer) ) { isHighlighted = true; highlightedGeometries.push(indexedGeometry); @@ -206,15 +205,11 @@ function getTooltipAndHighlightFromValue( /** @internal */ export const getTooltipInfoSelector = createCachedSelector( [getTooltipInfoAndGeometriesSelector], - ({ tooltip }): TooltipInfo => { - return tooltip; - }, + ({ tooltip }): TooltipInfo => tooltip, )(getChartIdSelector); /** @internal */ export const getHighlightedGeomsSelector = createCachedSelector( [getTooltipInfoAndGeometriesSelector], - (values): IndexedGeometry[] => { - return values.highlightedGeometries; - }, + ({ highlightedGeometries }): IndexedGeometry[] => highlightedGeometries, )(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/has_single_series.ts b/src/chart_types/xy_chart/state/selectors/has_single_series.ts index 5df4abfa9f..e67e14b803 100644 --- a/src/chart_types/xy_chart/state/selectors/has_single_series.ts +++ b/src/chart_types/xy_chart/state/selectors/has_single_series.ts @@ -14,16 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { computeSeriesDomainsSelector } from './compute_series_domains'; + import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { computeSeriesDomainsSelector } from './compute_series_domains'; /** @internal */ export const hasSingleSeriesSelector = createCachedSelector( [computeSeriesDomainsSelector], - (seriesDomainsAndData): boolean => { - return Boolean(seriesDomainsAndData) && seriesDomainsAndData.seriesCollection.size > 1; - }, + (seriesDomainsAndData): boolean => Boolean(seriesDomainsAndData) && seriesDomainsAndData.seriesCollection.size > 1, )(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/is_annotation_tooltip_visible.ts b/src/chart_types/xy_chart/state/selectors/is_annotation_tooltip_visible.ts index 45e2eb9ed9..31e21b8d9f 100644 --- a/src/chart_types/xy_chart/state/selectors/is_annotation_tooltip_visible.ts +++ b/src/chart_types/xy_chart/state/selectors/is_annotation_tooltip_visible.ts @@ -14,16 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { getAnnotationTooltipStateSelector } from './get_annotation_tooltip_state'; import createCachedSelector from 're-reselect'; + import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getAnnotationTooltipStateSelector } from './get_annotation_tooltip_state'; /** @internal */ export const isAnnotationTooltipVisibleSelector = createCachedSelector( [getAnnotationTooltipStateSelector], - (annotationTooltipState): boolean => { - return annotationTooltipState !== null && annotationTooltipState.isVisible; - }, + (annotationTooltipState): boolean => annotationTooltipState !== null && annotationTooltipState.isVisible, )(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/is_brush_available.ts b/src/chart_types/xy_chart/state/selectors/is_brush_available.ts index 35591ea356..e9a310566c 100644 --- a/src/chart_types/xy_chart/state/selectors/is_brush_available.ts +++ b/src/chart_types/xy_chart/state/selectors/is_brush_available.ts @@ -14,13 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; -import { getComputedScalesSelector } from './get_computed_scales'; + import { ScaleType } from '../../../../scales'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; +import { getComputedScalesSelector } from './get_computed_scales'; /** * The brush is available only for Ordinal xScales charts and diff --git a/src/chart_types/xy_chart/state/selectors/is_brushing.ts b/src/chart_types/xy_chart/state/selectors/is_brushing.ts index a103c30dc6..1787b85f38 100644 --- a/src/chart_types/xy_chart/state/selectors/is_brushing.ts +++ b/src/chart_types/xy_chart/state/selectors/is_brushing.ts @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + import { GlobalChartState } from '../../../../state/chart_state'; -import { isBrushAvailableSelector } from './is_brush_available'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { isBrushAvailableSelector } from './is_brush_available'; const getPointerSelector = (state: GlobalChartState) => state.interactions.pointer; diff --git a/src/chart_types/xy_chart/state/selectors/is_chart_animatable.ts b/src/chart_types/xy_chart/state/selectors/is_chart_animatable.ts index f8127dbf91..3eb989857c 100644 --- a/src/chart_types/xy_chart/state/selectors/is_chart_animatable.ts +++ b/src/chart_types/xy_chart/state/selectors/is_chart_animatable.ts @@ -14,17 +14,20 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import { computeSeriesGeometriesSelector } from './compute_series_geometries'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; // import { isChartAnimatable } from '../utils'; /** @internal */ export const isChartAnimatableSelector = createCachedSelector( [computeSeriesGeometriesSelector, getSettingsSpecSelector], + // eslint-disable-next-line arrow-body-style () => { // const { geometriesCounts } = seriesGeometries; // temporary disabled until diff --git a/src/chart_types/xy_chart/state/selectors/is_chart_empty.ts b/src/chart_types/xy_chart/state/selectors/is_chart_empty.ts index b9163cba06..da80e8a3c8 100644 --- a/src/chart_types/xy_chart/state/selectors/is_chart_empty.ts +++ b/src/chart_types/xy_chart/state/selectors/is_chart_empty.ts @@ -14,14 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; + +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { isAllSeriesDeselected } from '../utils'; import { computeLegendSelector } from './compute_legend'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; /** @internal */ -export const isChartEmptySelector = createCachedSelector([computeLegendSelector], (legendItems): boolean => { - return isAllSeriesDeselected(legendItems); -})(getChartIdSelector); +export const isChartEmptySelector = createCachedSelector([computeLegendSelector], (legendItems): boolean => isAllSeriesDeselected(legendItems))(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/is_histogram_mode_enabled.ts b/src/chart_types/xy_chart/state/selectors/is_histogram_mode_enabled.ts index 7fb7b22a05..78b928e500 100644 --- a/src/chart_types/xy_chart/state/selectors/is_histogram_mode_enabled.ts +++ b/src/chart_types/xy_chart/state/selectors/is_histogram_mode_enabled.ts @@ -14,14 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { getSeriesSpecsSelector } from './get_specs'; -import { isHistogramModeEnabled } from '../utils'; + import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { isHistogramModeEnabled } from '../utils'; +import { getSeriesSpecsSelector } from './get_specs'; /** @internal */ -export const isHistogramModeEnabledSelector = createCachedSelector([getSeriesSpecsSelector], (seriesSpecs): boolean => { - return isHistogramModeEnabled(seriesSpecs); -})(getChartIdSelector); +export const isHistogramModeEnabledSelector = createCachedSelector([getSeriesSpecsSelector], (seriesSpecs): boolean => isHistogramModeEnabled(seriesSpecs))(getChartIdSelector); diff --git a/src/chart_types/xy_chart/state/selectors/is_tooltip_snap_enabled.ts b/src/chart_types/xy_chart/state/selectors/is_tooltip_snap_enabled.ts index 779aae333e..206b27561e 100644 --- a/src/chart_types/xy_chart/state/selectors/is_tooltip_snap_enabled.ts +++ b/src/chart_types/xy_chart/state/selectors/is_tooltip_snap_enabled.ts @@ -14,20 +14,20 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { computeSeriesGeometriesSelector } from './compute_series_geometries'; + import { Scale } from '../../../../scales'; -import { getTooltipSnapSelector } from './get_tooltip_snap'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { computeSeriesGeometriesSelector } from './compute_series_geometries'; +import { getTooltipSnapSelector } from './get_tooltip_snap'; /** @internal */ export const isTooltipSnapEnableSelector = createCachedSelector( [computeSeriesGeometriesSelector, getTooltipSnapSelector], - (seriesGeometries, snap) => { - return isTooltipSnapEnabled(seriesGeometries.scales.xScale, snap); - }, + (seriesGeometries, snap) => isTooltipSnapEnabled(seriesGeometries.scales.xScale, snap), )(getChartIdSelector); function isTooltipSnapEnabled(xScale: Scale, snap: boolean) { diff --git a/src/chart_types/xy_chart/state/selectors/is_tooltip_visible.ts b/src/chart_types/xy_chart/state/selectors/is_tooltip_visible.ts index 445e0e22cf..173bfa280b 100644 --- a/src/chart_types/xy_chart/state/selectors/is_tooltip_visible.ts +++ b/src/chart_types/xy_chart/state/selectors/is_tooltip_visible.ts @@ -14,22 +14,22 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { Point } from '../../../../utils/point'; + +import { TooltipInfo } from '../../../../components/tooltip/types'; +import { TooltipType, getTooltipType } from '../../../../specs'; import { GlobalChartState, PointerStates } from '../../../../state/chart_state'; +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; +import { Point } from '../../../../utils/point'; import { getProjectedPointerPositionSelector } from './get_projected_pointer_position'; import { getTooltipInfoSelector } from './get_tooltip_values_highlighted_geoms'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; -import { TooltipType, getTooltipType } from '../../../../specs'; import { isAnnotationTooltipVisibleSelector } from './is_annotation_tooltip_visible'; -import { TooltipInfo } from '../../../../components/tooltip/types'; -const hasTooltipTypeDefinedSelector = (state: GlobalChartState): TooltipType | undefined => { - return getTooltipType(getSettingsSpecSelector(state)); -}; +const hasTooltipTypeDefinedSelector = (state: GlobalChartState): TooltipType | undefined => getTooltipType(getSettingsSpecSelector(state)); const getPointerSelector = (state: GlobalChartState) => state.interactions.pointer; @@ -53,11 +53,11 @@ function isTooltipVisible( isAnnotationTooltipVisible: boolean, ) { return ( - tooltipType !== TooltipType.None && - pointer.down === null && - projectedPointerPosition.x > -1 && - projectedPointerPosition.y > -1 && - tooltip.values.length > 0 && - !isAnnotationTooltipVisible + tooltipType !== TooltipType.None + && pointer.down === null + && projectedPointerPosition.x > -1 + && projectedPointerPosition.y > -1 + && tooltip.values.length > 0 + && !isAnnotationTooltipVisible ); } diff --git a/src/chart_types/xy_chart/state/selectors/merge_y_custom_domains.ts b/src/chart_types/xy_chart/state/selectors/merge_y_custom_domains.ts index 0f8c75b5b3..eff4d0f3e4 100644 --- a/src/chart_types/xy_chart/state/selectors/merge_y_custom_domains.ts +++ b/src/chart_types/xy_chart/state/selectors/merge_y_custom_domains.ts @@ -14,23 +14,23 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { getAxisSpecsSelector } from './get_specs'; -import { isYDomain, isCompleteBound, isLowerBound, isUpperBound, isBounded } from '../../utils/axis_utils'; -import { AxisSpec, DomainRange } from '../../utils/specs'; -import { Rotation } from '../../../../utils/commons'; -import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; + import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; +import { Rotation } from '../../../../utils/commons'; import { GroupId } from '../../../../utils/ids'; +import { isYDomain, isCompleteBound, isLowerBound, isUpperBound, isBounded } from '../../utils/axis_utils'; +import { AxisSpec, DomainRange } from '../../utils/specs'; +import { getAxisSpecsSelector } from './get_specs'; /** @internal */ export const mergeYCustomDomainsByGroupIdSelector = createCachedSelector( [getAxisSpecsSelector, getSettingsSpecSelector], - (axisSpecs, settingsSpec): Map => { - return mergeYCustomDomainsByGroupId(axisSpecs, settingsSpec ? settingsSpec.rotation : 0); - }, + (axisSpecs, settingsSpec): Map => mergeYCustomDomainsByGroupId(axisSpecs, settingsSpec ? settingsSpec.rotation : 0), )(getChartIdSelector); /** @internal */ @@ -62,8 +62,7 @@ export function mergeYCustomDomainsByGroupId( const prevGroupDomain = domainsByGroupId.get(groupId); if (prevGroupDomain) { - const prevDomain = prevGroupDomain as DomainRange; - + const prevDomain = prevGroupDomain; const prevMin = isLowerBound(prevDomain) ? prevDomain.min : undefined; const prevMax = isUpperBound(prevDomain) ? prevDomain.max : undefined; diff --git a/src/chart_types/xy_chart/state/selectors/on_brush_end_caller.ts b/src/chart_types/xy_chart/state/selectors/on_brush_end_caller.ts index 72f5cba142..c41d4f83ab 100644 --- a/src/chart_types/xy_chart/state/selectors/on_brush_end_caller.ts +++ b/src/chart_types/xy_chart/state/selectors/on_brush_end_caller.ts @@ -14,24 +14,26 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; import { Selector } from 'reselect'; + +import { ChartTypes } from '../../..'; +import { Scale } from '../../../../scales'; +import { BrushAxis, XYBrushArea, GroupBrushExtent, BrushEndListener } from '../../../../specs'; import { GlobalChartState, DragState } from '../../../../state/chart_state'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; -import { BrushAxis, XYBrushArea, GroupBrushExtent, BrushEndListener } from '../../../../specs'; -import { ChartTypes } from '../../../index'; -import { getComputedScalesSelector } from './get_computed_scales'; -import { computeChartDimensionsSelector } from './compute_chart_dimensions'; -import { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled'; -import { isBrushAvailableSelector } from './is_brush_available'; -import { Scale } from '../../../../scales'; +import { Rotation, minValueWithLowerLimit, maxValueWithUpperLimit } from '../../../../utils/commons'; import { Dimensions } from '../../../../utils/dimensions'; import { GroupId } from '../../../../utils/ids'; -import { Rotation, minValueWithLowerLimit, maxValueWithUpperLimit } from '../../../../utils/commons'; -import { getLeftPoint, getTopPoint } from './get_brush_area'; import { isVerticalRotation } from '../utils'; +import { computeChartDimensionsSelector } from './compute_chart_dimensions'; +import { getLeftPoint, getTopPoint } from './get_brush_area'; +import { getComputedScalesSelector } from './get_computed_scales'; +import { isBrushAvailableSelector } from './is_brush_available'; +import { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled'; const getLastDragSelector = (state: GlobalChartState) => state.interactions.pointer.lastDrag; diff --git a/src/chart_types/xy_chart/state/selectors/on_element_click_caller.ts b/src/chart_types/xy_chart/state/selectors/on_element_click_caller.ts index ff762708c0..488ec42fe8 100644 --- a/src/chart_types/xy_chart/state/selectors/on_element_click_caller.ts +++ b/src/chart_types/xy_chart/state/selectors/on_element_click_caller.ts @@ -14,19 +14,21 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; import { Selector } from 'reselect'; + +import { ChartTypes } from '../../..'; +import { SettingsSpec } from '../../../../specs'; import { GlobalChartState, PointerState } from '../../../../state/chart_state'; +import { getLastClickSelector } from '../../../../state/selectors/get_last_click'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; -import { getHighlightedGeomsSelector } from './get_tooltip_values_highlighted_geoms'; -import { SettingsSpec } from '../../../../specs'; +import { isClicking } from '../../../../state/utils'; import { IndexedGeometry, GeometryValue } from '../../../../utils/geometry'; -import { ChartTypes } from '../../../index'; import { XYChartSeriesIdentifier } from '../../utils/series'; -import { isClicking } from '../../../../state/utils'; -import { getLastClickSelector } from '../../../../state/selectors/get_last_click'; +import { getHighlightedGeomsSelector } from './get_tooltip_values_highlighted_geoms'; /** * Will call the onElementClick listener every time the following preconditions are met: diff --git a/src/chart_types/xy_chart/state/selectors/on_element_out_caller.ts b/src/chart_types/xy_chart/state/selectors/on_element_out_caller.ts index 4635a52647..4d0e043b6f 100644 --- a/src/chart_types/xy_chart/state/selectors/on_element_out_caller.ts +++ b/src/chart_types/xy_chart/state/selectors/on_element_out_caller.ts @@ -14,20 +14,22 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import createCachedSelector from 're-reselect'; +import { Selector } from 'react-redux'; + +import { ChartTypes } from '../../..'; +import { SettingsSpec } from '../../../../specs'; +import { GlobalChartState } from '../../../../state/chart_state'; +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; +import { IndexedGeometry } from '../../../../utils/geometry'; import { getTooltipInfoAndGeometriesSelector, TooltipAndHighlightedGeoms, } from './get_tooltip_values_highlighted_geoms'; -import { SettingsSpec } from '../../../../specs'; -import { GlobalChartState } from '../../../../state/chart_state'; -import { IndexedGeometry } from '../../../../utils/geometry'; -import { Selector } from 'react-redux'; -import { ChartTypes } from '../../../index'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; interface Props { settings: SettingsSpec | undefined; diff --git a/src/chart_types/xy_chart/state/selectors/on_element_over_caller.ts b/src/chart_types/xy_chart/state/selectors/on_element_over_caller.ts index 9b3f710380..1e3fd87cda 100644 --- a/src/chart_types/xy_chart/state/selectors/on_element_over_caller.ts +++ b/src/chart_types/xy_chart/state/selectors/on_element_over_caller.ts @@ -14,21 +14,23 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; import createCachedSelector from 're-reselect'; -import { - getTooltipInfoAndGeometriesSelector, - TooltipAndHighlightedGeoms, -} from './get_tooltip_values_highlighted_geoms'; +import { Selector } from 'react-redux'; + +import { ChartTypes } from '../../..'; import { SettingsSpec } from '../../../../specs'; import { GlobalChartState } from '../../../../state/chart_state'; -import { IndexedGeometry, GeometryValue } from '../../../../utils/geometry'; -import { Selector } from 'react-redux'; -import { ChartTypes } from '../../../index'; import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; +import { IndexedGeometry, GeometryValue } from '../../../../utils/geometry'; import { XYChartSeriesIdentifier } from '../../utils/series'; +import { + getTooltipInfoAndGeometriesSelector, + TooltipAndHighlightedGeoms, +} from './get_tooltip_values_highlighted_geoms'; interface Props { settings: SettingsSpec | undefined; diff --git a/src/chart_types/xy_chart/state/selectors/on_pointer_move_caller.ts b/src/chart_types/xy_chart/state/selectors/on_pointer_move_caller.ts index 11502f6d86..0250472051 100644 --- a/src/chart_types/xy_chart/state/selectors/on_pointer_move_caller.ts +++ b/src/chart_types/xy_chart/state/selectors/on_pointer_move_caller.ts @@ -14,20 +14,22 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; import { Selector } from 'reselect'; + +import { ChartTypes } from '../../..'; +import { Scale } from '../../../../scales'; +import { SettingsSpec, PointerEvent, PointerEventType } from '../../../../specs'; import { GlobalChartState } from '../../../../state/chart_state'; +import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; import { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_specs'; -import { SettingsSpec, PointerEvent, PointerEventType } from '../../../../specs'; -import { ChartTypes } from '../../../index'; -import { Scale } from '../../../../scales'; import { Point } from '../../../../utils/point'; -import { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position'; import { computeSeriesGeometriesSelector } from './compute_series_geometries'; import { getGeometriesIndexKeysSelector } from './get_geometries_index_keys'; -import { getChartIdSelector } from '../../../../state/selectors/get_chart_id'; +import { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position'; const getPointerEventSelector = createCachedSelector( [ @@ -36,14 +38,17 @@ const getPointerEventSelector = createCachedSelector( computeSeriesGeometriesSelector, getGeometriesIndexKeysSelector, ], - (chartId, orientedProjectedPointerPosition, seriesGeometries, geometriesIndexKeys): PointerEvent => { - return getPointerEvent( - chartId, - orientedProjectedPointerPosition, - seriesGeometries.scales.xScale, - geometriesIndexKeys, - ); - }, + ( + chartId, + orientedProjectedPointerPosition, + seriesGeometries, + geometriesIndexKeys, + ): PointerEvent => getPointerEvent( + chartId, + orientedProjectedPointerPosition, + seriesGeometries.scales.xScale, + geometriesIndexKeys, + ), )(getChartIdSelector); function getPointerEvent( @@ -87,20 +92,20 @@ function hasPointerEventChanged(prevPointerEvent: PointerEvent, nextPointerEvent return true; } if ( - nextPointerEvent && - prevPointerEvent.type === nextPointerEvent.type && - prevPointerEvent.type === PointerEventType.Out + nextPointerEvent + && prevPointerEvent.type === nextPointerEvent.type + && prevPointerEvent.type === PointerEventType.Out ) { return false; } // if something changed in the pointerEvent than recompute if ( - nextPointerEvent && - prevPointerEvent.type === PointerEventType.Over && - nextPointerEvent.type === PointerEventType.Over && - (prevPointerEvent.value !== nextPointerEvent.value || - prevPointerEvent.scale !== nextPointerEvent.scale || - prevPointerEvent.unit !== nextPointerEvent.unit) + nextPointerEvent + && prevPointerEvent.type === PointerEventType.Over + && nextPointerEvent.type === PointerEventType.Over + && (prevPointerEvent.value !== nextPointerEvent.value + || prevPointerEvent.scale !== nextPointerEvent.scale + || prevPointerEvent.unit !== nextPointerEvent.unit) ) { return true; } diff --git a/src/chart_types/xy_chart/state/utils.test.ts b/src/chart_types/xy_chart/state/utils.test.ts index d99e1a7d07..a4a4a677e0 100644 --- a/src/chart_types/xy_chart/state/utils.test.ts +++ b/src/chart_types/xy_chart/state/utils.test.ts @@ -14,8 +14,22 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { ChartTypes } from '../..'; +import { LegendItem } from '../../../commons/legend'; +import { MockSeriesCollection } from '../../../mocks/series/series_identifiers'; +import { MockSeriesSpecs, MockSeriesSpec } from '../../../mocks/specs'; +import { SeededDataGenerator } from '../../../mocks/utils'; +import { ScaleType, ScaleContinuous } from '../../../scales'; +import { SpecTypes } from '../../../specs/settings'; +import { ColorOverrides } from '../../../state/chart_state'; +import { BARCHART_1Y0G, BARCHART_1Y1G } from '../../../utils/data_samples/test_dataset'; +import { IndexedGeometry, BandedAccessorType } from '../../../utils/geometry'; +import { SpecId } from '../../../utils/ids'; +import { LIGHT_THEME } from '../../../utils/themes/light_theme'; +import { SeriesCollectionValue, getSeriesIndex, getSeriesColors } from '../utils/series'; import { AreaSeriesSpec, AxisSpec, @@ -26,10 +40,7 @@ import { SeriesTypes, SeriesColorAccessorFn, } from '../utils/specs'; -import { BARCHART_1Y0G, BARCHART_1Y1G } from '../../../utils/data_samples/test_dataset'; -import { LIGHT_THEME } from '../../../utils/themes/light_theme'; -import { SpecId } from '../../../utils/ids'; -import { ScaleType, ScaleContinuous } from '../../../scales'; +import { mergeYCustomDomainsByGroupId } from './selectors/merge_y_custom_domains'; import { computeSeriesDomains, computeSeriesGeometries, @@ -45,18 +56,8 @@ import { isUniqueArray, isDefined, isDefinedFrom, + updateDeselectedDataSeries, } from './utils'; -import { IndexedGeometry, BandedAccessorType } from '../../../utils/geometry'; -import { mergeYCustomDomainsByGroupId } from './selectors/merge_y_custom_domains'; -import { updateDeselectedDataSeries } from './utils'; -import { ChartTypes } from '../..'; -import { MockSeriesSpecs, MockSeriesSpec } from '../../../mocks/specs'; -import { MockSeriesCollection } from '../../../mocks/series/series_identifiers'; -import { SeededDataGenerator } from '../../../mocks/utils'; -import { SeriesCollectionValue, getSeriesIndex, getSeriesColors } from '../utils/series'; -import { SpecTypes } from '../../../specs/settings'; -import { ColorOverrides } from '../../../state/chart_state'; -import { LegendItem } from '../../../commons/legend'; describe('Chart State utils', () => { const emptySeriesOverrides: ColorOverrides = { @@ -91,7 +92,7 @@ describe('Chart State utils', () => { yScaleToDataExtent: false, data: BARCHART_1Y0G, }; - const domains = computeSeriesDomains([spec1, spec2], new Map(), undefined); + const domains = computeSeriesDomains([spec1, spec2], new Map()); expect(domains.xDomain).toEqual({ domain: [0, 3], isBandScale: false, @@ -148,7 +149,7 @@ describe('Chart State utils', () => { yScaleToDataExtent: false, data: BARCHART_1Y1G, }; - const domains = computeSeriesDomains([spec1, spec2], new Map(), undefined); + const domains = computeSeriesDomains([spec1, spec2], new Map()); expect(domains.xDomain).toEqual({ domain: [0, 3], isBandScale: false, @@ -498,7 +499,7 @@ describe('Chart State utils', () => { }; const chartTheme = { ...LIGHT_THEME, colors: chartColors }; const domainsByGroupId = mergeYCustomDomainsByGroupId(axesSpecs, chartRotation); - const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId, undefined); + const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId); const seriesColorMap = getSeriesColors( seriesDomains.seriesCollection, chartColors, @@ -560,7 +561,7 @@ describe('Chart State utils', () => { }; const chartTheme = { ...LIGHT_THEME, colors: chartColors }; const domainsByGroupId = mergeYCustomDomainsByGroupId(axesSpecs, chartRotation); - const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId, undefined); + const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId); const seriesColorMap = getSeriesColors( seriesDomains.seriesCollection, chartColors, @@ -624,7 +625,7 @@ describe('Chart State utils', () => { }; const chartTheme = { ...LIGHT_THEME, colors: chartColors }; const domainsByGroupId = mergeYCustomDomainsByGroupId(axesSpecs, chartRotation); - const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId, undefined); + const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId); const seriesColorMap = getSeriesColors( seriesDomains.seriesCollection, chartColors, @@ -715,7 +716,7 @@ describe('Chart State utils', () => { }; const chartTheme = { ...LIGHT_THEME, colors: chartColors }; const domainsByGroupId = mergeYCustomDomainsByGroupId(axesSpecs, chartRotation); - const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId, undefined); + const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId); const seriesColorMap = getSeriesColors( seriesDomains.seriesCollection, chartColors, @@ -793,7 +794,7 @@ describe('Chart State utils', () => { }; const chartTheme = { ...LIGHT_THEME, colors: chartColors }; const domainsByGroupId = mergeYCustomDomainsByGroupId(axesSpecs, chartRotation); - const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId, undefined); + const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId); const seriesColorMap = getSeriesColors( seriesDomains.seriesCollection, chartColors, @@ -871,7 +872,7 @@ describe('Chart State utils', () => { }; const chartTheme = { ...LIGHT_THEME, colors: chartColors }; const domainsByGroupId = mergeYCustomDomainsByGroupId(axesSpecs, chartRotation); - const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId, undefined); + const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId); const seriesColorMap = getSeriesColors( seriesDomains.seriesCollection, chartColors, @@ -957,7 +958,7 @@ describe('Chart State utils', () => { }; const chartTheme = { ...LIGHT_THEME, colors: chartColors }; const domainsByGroupId = mergeYCustomDomainsByGroupId(axesSpecs, chartRotation); - const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId, undefined); + const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId); const seriesColorMap = getSeriesColors( seriesDomains.seriesCollection, chartColors, @@ -1055,7 +1056,7 @@ describe('Chart State utils', () => { }; const chartTheme = { ...LIGHT_THEME, colors: chartColors }; const domainsByGroupId = mergeYCustomDomainsByGroupId(axesSpecs, chartRotation); - const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId, undefined); + const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId); const seriesColorMap = getSeriesColors( seriesDomains.seriesCollection, chartColors, @@ -1146,7 +1147,7 @@ describe('Chart State utils', () => { }; const chartTheme = { ...LIGHT_THEME, colors: chartColors }; const domainsByGroupId = mergeYCustomDomainsByGroupId(axesSpecs, chartRotation); - const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId, undefined); + const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId); const seriesColorMap = getSeriesColors( seriesDomains.seriesCollection, chartColors, @@ -1216,7 +1217,7 @@ describe('Chart State utils', () => { }, }; const domainsByGroupId = mergeYCustomDomainsByGroupId(axesSpecs, chartRotation); - const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId, undefined); + const seriesDomains = computeSeriesDomains(seriesSpecs, domainsByGroupId); const seriesColorMap = getSeriesColors( seriesDomains.seriesCollection, chartColors, @@ -1238,7 +1239,7 @@ describe('Chart State utils', () => { expect(geometries.geometries.bars[0].x).toBe(0); }); }); - xtest('can merge geometry indexes', () => { + test.skip('can merge geometry indexes', () => { const map1 = new Map(); map1.set('a', [ { @@ -1525,7 +1526,7 @@ describe('Chart State utils', () => { }); it('should return false for undefined', () => { - expect(isDefined(undefined)).toBe(false); + expect(isDefined()).toBe(false); }); it('should return true for zero', () => { diff --git a/src/chart_types/xy_chart/state/utils.ts b/src/chart_types/xy_chart/state/utils.ts index d8ddb76c13..8094a247ed 100644 --- a/src/chart_types/xy_chart/state/utils.ts +++ b/src/chart_types/xy_chart/state/utils.ts @@ -14,13 +14,27 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { isVerticalAxis } from '../utils/axis_utils'; +import { LegendItem } from '../../../commons/legend'; +import { SeriesKey, SeriesIdentifier } from '../../../commons/series_id'; +import { Scale } from '../../../scales'; +import { Spec } from '../../../specs'; +import { identity, mergePartial, Rotation, Color, RecursivePartial } from '../../../utils/commons'; import { CurveType } from '../../../utils/curves'; +import { Dimensions } from '../../../utils/dimensions'; +import { Domain } from '../../../utils/domain'; +import { PointGeometry, BarGeometry, AreaGeometry, LineGeometry, BubbleGeometry } from '../../../utils/geometry'; +import { GroupId, SpecId } from '../../../utils/ids'; +import { Point } from '../../../utils/point'; +import { ColorConfig, Theme } from '../../../utils/themes/theme'; +import { PrimitiveValue } from '../../partition_chart/layout/utils/group_by_rollup'; import { mergeXDomain, XDomain } from '../domains/x_domain'; import { mergeYDomain, YDomain } from '../domains/y_domain'; import { renderArea, renderBars, renderLine, renderBubble } from '../rendering/rendering'; +import { isVerticalAxis } from '../utils/axis_utils'; +import { IndexedGeometryMap } from '../utils/indexed_geometry_map'; import { computeXScale, computeYScales, countBarsInCluster } from '../utils/scales'; import { DataSeries, @@ -33,9 +47,7 @@ import { RawDataSeries, XYChartSeriesIdentifier, } from '../utils/series'; -import { SeriesKey, SeriesIdentifier } from '../../../commons/series_id'; import { - AreaSeriesSpec, AxisSpec, BasicSeriesSpec, DomainRange, @@ -44,25 +56,12 @@ import { isAreaSeriesSpec, isBarSeriesSpec, isLineSeriesSpec, - LineSeriesSpec, isBandedSpec, Fit, FitConfig, SeriesTypes, isBubbleSeriesSpec, } from '../utils/specs'; -import { ColorConfig, Theme } from '../../../utils/themes/theme'; -import { identity, mergePartial, Rotation, Color, RecursivePartial } from '../../../utils/commons'; -import { Dimensions } from '../../../utils/dimensions'; -import { Domain } from '../../../utils/domain'; -import { GroupId, SpecId } from '../../../utils/ids'; -import { Scale } from '../../../scales'; -import { PointGeometry, BarGeometry, AreaGeometry, LineGeometry, BubbleGeometry } from '../../../utils/geometry'; -import { LegendItem } from '../../../commons/legend'; -import { Spec } from '../../../specs'; -import { IndexedGeometryMap } from '../utils/indexed_geometry_map'; -import { Point } from '../../../utils/point'; -import { PrimitiveValue } from '../../partition_chart/layout/utils/group_by_rollup'; const MAX_ANIMATABLE_BARS = 300; const MAX_ANIMATABLE_LINES_AREA_POINTS = 600; @@ -174,6 +173,7 @@ export function getCustomSeriesColors( if (!color && spec.color) { if (typeof spec.color === 'string') { + // eslint-disable-next-line prefer-destructuring color = spec.color; } else { const counter = counters.get(seriesIdentifier.specId) || 0; @@ -384,7 +384,7 @@ export function computeSeriesGeometries( geometriesCounts.bubbles += geometries.geometriesCounts.bubbles; geometriesCounts.bubblePoints += geometries.geometriesCounts.bubblePoints; }); - formattedDataSeries.nonStacked.map((dataSeriesGroup) => { + formattedDataSeries.nonStacked.forEach((dataSeriesGroup) => { const { groupId, dataSeries } = dataSeriesGroup; const yScale = yScales.get(groupId); if (!yScale) { @@ -445,6 +445,7 @@ export function setBarSeriesAccessors(isHistogramMode: boolean, seriesSpecs: Map return; } + // eslint-disable-next-line no-restricted-syntax for (const [, spec] of seriesSpecs) { if (isBarSeriesSpec(spec)) { let stackAccessors = spec.stackAccessors ? [...spec.stackAccessors] : spec.yAccessors; @@ -456,15 +457,11 @@ export function setBarSeriesAccessors(isHistogramMode: boolean, seriesSpecs: Map spec.stackAccessors = stackAccessors; } } - - return; } /** @internal */ export function isHistogramModeEnabled(seriesSpecs: BasicSeriesSpec[]): boolean { - return seriesSpecs.some((spec) => { - return isBarSeriesSpec(spec) && spec.enableHistogramMode; - }); + return seriesSpecs.some((spec) => isBarSeriesSpec(spec) && spec.enableHistogramMode); } /** @internal */ @@ -614,12 +611,12 @@ function renderGeometries( xScale, yScale, color, - (spec as LineSeriesSpec).curve || CurveType.LINEAR, + spec.curve || CurveType.LINEAR, isBandedSpec(spec.y0Accessors), xScaleOffset, lineSeriesStyle, { - enabled: (spec as LineSeriesSpec).markSizeAccessor !== undefined, + enabled: spec.markSizeAccessor !== undefined, ratio: chartTheme.markSizeRatio, }, spec.pointStyleAccessor, @@ -642,12 +639,12 @@ function renderGeometries( xScale, yScale, color, - (spec as AreaSeriesSpec).curve || CurveType.LINEAR, + spec.curve || CurveType.LINEAR, isBandedSpec(spec.y0Accessors), xScaleOffset, areaSeriesStyle, { - enabled: (spec as LineSeriesSpec).markSizeAccessor !== undefined, + enabled: spec.markSizeAccessor !== undefined, ratio: chartTheme.markSizeRatio, }, isStacked, @@ -681,6 +678,7 @@ export function getSpecsById(specs: T[], id: string): T | undefi export function getAxesSpecForSpecId(axesSpecs: AxisSpec[], groupId: GroupId) { let xAxis; let yAxis; + // eslint-disable-next-line no-restricted-syntax for (const axisSpec of axesSpecs) { if (axisSpec.groupId !== groupId) { continue; @@ -705,25 +703,26 @@ export function computeChartTransform(chartDimensions: Dimensions, chartRotation y: 0, rotate: 90, }; - } else if (chartRotation === -90) { + } + if (chartRotation === -90) { return { x: 0, y: chartDimensions.height, rotate: -90, }; - } else if (chartRotation === 180) { + } + if (chartRotation === 180) { return { x: chartDimensions.width, y: chartDimensions.height, rotate: 180, }; - } else { - return { - x: 0, - y: 0, - rotate: 0, - }; } + return { + x: 0, + y: 0, + rotate: 0, + }; } /** @internal */ @@ -742,9 +741,7 @@ export function isVerticalRotation(chartRotation: Rotation) { * @internal */ export function isLineAreaOnlyChart(specs: BasicSeriesSpec[]) { - return !specs.some((spec) => { - return spec.seriesType === SeriesTypes.Bar; - }); + return !specs.some((spec) => spec.seriesType === SeriesTypes.Bar); } /** @internal */ @@ -760,6 +757,7 @@ export function isChartAnimatable(geometriesCounts: GeometriesCounts, animationE /** @internal */ export function isAllSeriesDeselected(legendItems: LegendItem[]): boolean { + // eslint-disable-next-line no-restricted-syntax for (const legendItem of legendItems) { if (!legendItem.isSeriesHidden) { return false; @@ -814,7 +812,7 @@ export function isUniqueArray(arr: B[], extractor?: (value: B) => T) { values.add(value); return true; }); - })(); + }()); } /** @@ -844,7 +842,7 @@ export const isDefinedFrom = (typeCheck: (value: RecursivePartial) => bool try { return typeCheck(value); - } catch (error) { + } catch { return false; } }; diff --git a/src/chart_types/xy_chart/tooltip/tooltip.test.ts b/src/chart_types/xy_chart/tooltip/tooltip.test.ts index a8b4141fe0..845f29c9d1 100644 --- a/src/chart_types/xy_chart/tooltip/tooltip.test.ts +++ b/src/chart_types/xy_chart/tooltip/tooltip.test.ts @@ -14,15 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { ChartTypes } from '../..'; import { ScaleType } from '../../../scales'; -import { AxisSpec, BarSeriesSpec, SeriesTypes } from '../utils/specs'; +import { SpecTypes } from '../../../specs/settings'; import { Position } from '../../../utils/commons'; -import { formatTooltip } from './tooltip'; import { BarGeometry } from '../../../utils/geometry'; -import { ChartTypes } from '../..'; -import { SpecTypes } from '../../../specs/settings'; +import { AxisSpec, BarSeriesSpec, SeriesTypes } from '../utils/specs'; +import { formatTooltip } from './tooltip'; describe('Tooltip formatting', () => { const SPEC_ID_1 = 'bar_1'; @@ -125,7 +126,7 @@ describe('Tooltip formatting', () => { expect(tooltipValue.isHighlighted).toBe(false); expect(tooltipValue.color).toBe('blue'); expect(tooltipValue.value).toBe('10'); - expect(YAXIS_SPEC.tickFormat).not.toBeCalledWith(null, undefined); + expect(YAXIS_SPEC.tickFormat).not.toBeCalledWith(null); }); it('should set name as spec name when provided', () => { const name = 'test - spec'; diff --git a/src/chart_types/xy_chart/tooltip/tooltip.ts b/src/chart_types/xy_chart/tooltip/tooltip.ts index 640176c207..a991ed2730 100644 --- a/src/chart_types/xy_chart/tooltip/tooltip.ts +++ b/src/chart_types/xy_chart/tooltip/tooltip.ts @@ -14,8 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { LegendItemExtraValues } from '../../../commons/legend'; +import { SeriesKey } from '../../../commons/series_id'; +import { TooltipValue } from '../../../specs'; +import { getAccessorFormatLabel } from '../../../utils/accessor'; +import { IndexedGeometry, BandedAccessorType } from '../../../utils/geometry'; +import { getSeriesName } from '../utils/series'; import { AxisSpec, BasicSeriesSpec, @@ -24,12 +31,6 @@ import { isBarSeriesSpec, TickFormatterOptions, } from '../utils/specs'; -import { IndexedGeometry, BandedAccessorType } from '../../../utils/geometry'; -import { getAccessorFormatLabel } from '../../../utils/accessor'; -import { getSeriesName } from '../utils/series'; -import { SeriesKey } from '../../../commons/series_id'; -import { TooltipValue } from '../../../specs'; -import { LegendItemExtraValues } from '../../../commons/legend'; export const Y0_ACCESSOR_POSTFIX = ' - lower'; export const Y1_ACCESSOR_POSTFIX = ' - upper'; @@ -42,7 +43,7 @@ export function getHighligthedValues( const seriesTooltipValues = new Map(); tooltipValues.forEach(({ value, seriesIdentifier, valueAccessor }) => { - const seriesValue = defaultValue ? defaultValue : value; + const seriesValue = defaultValue || value; const current: LegendItemExtraValues = seriesTooltipValues.get(seriesIdentifier.key) ?? new Map(); if (defaultValue) { if (!current.has(BandedAccessorType.Y0)) { diff --git a/src/chart_types/xy_chart/utils/axis_utils.test.ts b/src/chart_types/xy_chart/utils/axis_utils.test.ts index 5526381cc7..58518a885a 100644 --- a/src/chart_types/xy_chart/utils/axis_utils.test.ts +++ b/src/chart_types/xy_chart/utils/axis_utils.test.ts @@ -14,15 +14,24 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { XDomain } from '../domains/x_domain'; -import { YDomain } from '../domains/y_domain'; -import { AxisSpec, DomainRange, AxisStyle, DEFAULT_GLOBAL_ID } from './specs'; +import { DateTime } from 'luxon'; +import moment from 'moment-timezone'; + +import { ChartTypes } from '../..'; +import { ScaleType, Scale } from '../../../scales'; +import { SpecTypes } from '../../../specs/settings'; +import { CanvasTextBBoxCalculator } from '../../../utils/bbox/canvas_text_bbox_calculator'; +import { SvgTextBBoxCalculator } from '../../../utils/bbox/svg_text_bbox_calculator'; import { Position } from '../../../utils/commons'; -import { LIGHT_THEME } from '../../../utils/themes/light_theme'; +import { niceTimeFormatter } from '../../../utils/data/formatters'; import { AxisId, GroupId } from '../../../utils/ids'; -import { ScaleType, Scale } from '../../../scales'; +import { LIGHT_THEME } from '../../../utils/themes/light_theme'; +import { XDomain } from '../domains/x_domain'; +import { YDomain } from '../domains/y_domain'; +import { mergeYCustomDomainsByGroupId } from '../state/selectors/merge_y_custom_domains'; import { AxisTick, AxisTicksDimensions, @@ -50,15 +59,8 @@ import { isHorizontalGrid, enableDuplicatedTicks, } from './axis_utils'; -import { CanvasTextBBoxCalculator } from '../../../utils/bbox/canvas_text_bbox_calculator'; -import { SvgTextBBoxCalculator } from '../../../utils/bbox/svg_text_bbox_calculator'; -import { niceTimeFormatter } from '../../../utils/data/formatters'; -import { mergeYCustomDomainsByGroupId } from '../state/selectors/merge_y_custom_domains'; -import { ChartTypes } from '../..'; -import { SpecTypes } from '../../../specs/settings'; -import { DateTime } from 'luxon'; import { computeXScale } from './scales'; -import moment from 'moment-timezone'; +import { AxisSpec, DomainRange, AxisStyle, DEFAULT_GLOBAL_ID } from './specs'; describe('Axis computational utils', () => { const mockedRect = { @@ -108,9 +110,7 @@ describe('Axis computational utils', () => { position: Position.Left, tickSize: 10, tickPadding: 10, - tickFormat: (value: any) => { - return `${value}`; - }, + tickFormat: (value: any) => `${value}`, showGridLines: true, integersOnly: false, }; @@ -126,9 +126,7 @@ describe('Axis computational utils', () => { position: Position.Top, tickSize: 10, tickPadding: 10, - tickFormat: (value: any) => { - return `${value}`; - }, + tickFormat: (value: any) => `${value}`, integersOnly: false, }; @@ -144,9 +142,7 @@ describe('Axis computational utils', () => { position: Position.Left, tickSize: 10, tickPadding: 10, - tickFormat: (value: any) => { - return `${value}`; - }, + tickFormat: (value: any) => `${value}`, showGridLines: true, integersOnly: false, }; diff --git a/src/chart_types/xy_chart/utils/axis_utils.ts b/src/chart_types/xy_chart/utils/axis_utils.ts index cee1e43200..b4a159a9b8 100644 --- a/src/chart_types/xy_chart/utils/axis_utils.ts +++ b/src/chart_types/xy_chart/utils/axis_utils.ts @@ -14,10 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { Scale } from '../../../scales'; +import { BBox, BBoxCalculator } from '../../../utils/bbox/bbox_calculator'; +import { Position, Rotation, getUniqueValues } from '../../../utils/commons'; +import { Dimensions, Margins } from '../../../utils/dimensions'; +import { AxisId } from '../../../utils/ids'; +import { AxisConfig, Theme } from '../../../utils/themes/theme'; import { XDomain } from '../domains/x_domain'; import { YDomain } from '../domains/y_domain'; +import { getSpecsById } from '../state/utils'; import { computeXScale, computeYScales } from './scales'; import { AxisSpec, @@ -29,13 +37,6 @@ import { AxisStyle, TickFormatterOptions, } from './specs'; -import { Position, Rotation, getUniqueValues } from '../../../utils/commons'; -import { AxisConfig, Theme } from '../../../utils/themes/theme'; -import { Dimensions, Margins } from '../../../utils/dimensions'; -import { AxisId } from '../../../utils/ids'; -import { Scale } from '../../../scales'; -import { BBox, BBoxCalculator } from '../../../utils/bbox/bbox_calculator'; -import { getSpecsById } from '../state/utils'; export type AxisLinePosition = [number, number, number, number]; @@ -165,17 +166,16 @@ export function getScaleForAxisSpec( return yScales.get(axisSpec.groupId)!; } return null; - } else { - return computeXScale({ - xDomain, - totalBarsInCluster, - range, - barsPadding, - enableHistogramMode, - ticks: axisSpec.ticks, - integersOnly: axisSpec.integersOnly, - }); } + return computeXScale({ + xDomain, + totalBarsInCluster, + range, + barsPadding, + enableHistogramMode, + ticks: axisSpec.ticks, + integersOnly: axisSpec.integersOnly, + }); } /** @internal */ @@ -240,9 +240,7 @@ function computeTickDimensions( tickFormatOptions?: TickFormatterOptions, ) { const tickValues = scale.ticks(); - const tickLabels = tickValues.map((d) => { - return tickFormat(d, tickFormatOptions); - }); + const tickLabels = tickValues.map((d) => tickFormat(d, tickFormatOptions)); const { tickLabelStyle: { fontFamily, fontSize }, } = axisConfig; @@ -296,7 +294,7 @@ export function getTickLabelProps( y: tickPosition, offsetX, offsetY: 0, - align: isRotated ? 'center' : isLeftAxis ? 'right' : 'left', + align: isRotated ? 'center' : (isLeftAxis ? 'right' : 'left'), verticalAlign: 'middle', }; } @@ -309,7 +307,7 @@ export function getTickLabelProps( offsetX: 0, offsetY: isAxisTop ? -maxLabelBboxHeight / 2 : maxLabelBboxHeight / 2, align: 'center', - verticalAlign: isRotated ? 'middle' : isAxisTop ? 'bottom' : 'top', + verticalAlign: isRotated ? 'middle' : (isAxisTop ? 'bottom' : 'top'), }; } @@ -369,15 +367,13 @@ export function getMinMaxRange( return getBottomTopAxisMinMaxRange(chartRotation, width); case Position.Left: case Position.Right: + default: return getLeftAxisMinMaxRange(chartRotation, height); } } function getBottomTopAxisMinMaxRange(chartRotation: Rotation, width: number) { switch (chartRotation) { - case 0: - // dealing with x domain - return { minRange: 0, maxRange: width }; case 90: // dealing with y domain return { minRange: 0, maxRange: width }; @@ -387,13 +383,14 @@ function getBottomTopAxisMinMaxRange(chartRotation: Rotation, width: number) { case 180: // dealing with x domain return { minRange: width, maxRange: 0 }; + case 0: + default: + // dealing with x domain + return { minRange: 0, maxRange: width }; } } function getLeftAxisMinMaxRange(chartRotation: Rotation, height: number) { switch (chartRotation) { - case 0: - // dealing with y domain - return { minRange: height, maxRange: 0 }; case 90: // dealing with x domain return { minRange: 0, maxRange: height }; @@ -403,6 +400,10 @@ function getLeftAxisMinMaxRange(chartRotation: Rotation, height: number) { case 180: // dealing with y domain return { minRange: 0, maxRange: height }; + case 0: + default: + // dealing with y domain + return { minRange: height, maxRange: 0 }; } } @@ -465,13 +466,11 @@ export function enableDuplicatedTicks( tickFormatOptions?: TickFormatterOptions, ) { const ticks = scale.ticks(); - const allTicks: AxisTick[] = ticks.map((tick) => { - return { - value: tick, - label: axisSpec.tickFormat(tick, tickFormatOptions), - position: (scale.scale(tick) ?? 0) + offset, - }; - }); + const allTicks: AxisTick[] = ticks.map((tick) => ({ + value: tick, + label: axisSpec.tickFormat(tick, tickFormatOptions), + position: (scale.scale(tick) ?? 0) + offset, + })); if (axisSpec.showDuplicatedTicks === true) { return allTicks; @@ -652,9 +651,7 @@ export function getAxisTicksPositions( if (axisSpec.showGridLines) { const isVertical = isVerticalAxis(axisSpec.position); const gridLines = visibleTicks.map( - (tick: AxisTick): AxisLinePosition => { - return computeAxisGridLinePositions(isVertical, tick.position, chartDimensions); - }, + (tick: AxisTick): AxisLinePosition => computeAxisGridLinePositions(isVertical, tick.position, chartDimensions), ); axisGridLinesPositions.set(id, gridLines); } @@ -736,11 +733,11 @@ export const isDuplicateAxis = ( let hasDuplicate = false; tickMap.forEach(({ tickLabels: axisTickLabels }, axisId) => { if ( - !hasDuplicate && - axisTickLabels && - tickLabels.length === axisTickLabels.length && - firstTickLabel === axisTickLabels[0] && - lastTickLabel === axisTickLabels.slice(-1)[0] + !hasDuplicate + && axisTickLabels + && tickLabels.length === axisTickLabels.length + && firstTickLabel === axisTickLabels[0] + && lastTickLabel === axisTickLabels.slice(-1)[0] ) { const spec = getSpecsById(specs, axisId); diff --git a/src/chart_types/xy_chart/utils/dimensions.test.ts b/src/chart_types/xy_chart/utils/dimensions.test.ts index 7fe938092f..57c4a14e6a 100644 --- a/src/chart_types/xy_chart/utils/dimensions.test.ts +++ b/src/chart_types/xy_chart/utils/dimensions.test.ts @@ -14,18 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { AxisTicksDimensions } from './axis_utils'; -import { AxisSpec } from './specs'; +import { ChartTypes } from '../..'; +import { SpecTypes } from '../../../specs/settings'; import { Position } from '../../../utils/commons'; +import { Margins } from '../../../utils/dimensions'; +import { AxisId } from '../../../utils/ids'; import { LIGHT_THEME } from '../../../utils/themes/light_theme'; import { LegendStyle } from '../../../utils/themes/theme'; +import { AxisTicksDimensions } from './axis_utils'; import { computeChartDimensions } from './dimensions'; -import { AxisId } from '../../../utils/ids'; -import { Margins } from '../../../utils/dimensions'; -import { ChartTypes } from '../..'; -import { SpecTypes } from '../../../specs/settings'; +import { AxisSpec } from './specs'; describe('Computed chart dimensions', () => { const parentDim = { @@ -66,9 +67,7 @@ describe('Computed chart dimensions', () => { position: Position.Left, tickSize: 10, tickPadding: 10, - tickFormat: (value: any) => { - return `${value}`; - }, + tickFormat: (value: any) => `${value}`, }; const legend: LegendStyle = { verticalWidth: 10, diff --git a/src/chart_types/xy_chart/utils/dimensions.ts b/src/chart_types/xy_chart/utils/dimensions.ts index dfcf2b1811..bbc4b2ce0a 100644 --- a/src/chart_types/xy_chart/utils/dimensions.ts +++ b/src/chart_types/xy_chart/utils/dimensions.ts @@ -14,15 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { AxisTicksDimensions } from './axis_utils'; -import { AxisSpec } from './specs'; import { Position } from '../../../utils/commons'; -import { Theme } from '../../../utils/themes/theme'; -import { AxisId } from '../../../utils/ids'; import { Dimensions } from '../../../utils/dimensions'; +import { AxisId } from '../../../utils/ids'; +import { Theme } from '../../../utils/themes/theme'; import { getSpecsById } from '../state/utils'; +import { AxisTicksDimensions } from './axis_utils'; +import { AxisSpec } from './specs'; /** * Compute the chart dimensions. It's computed removing from the parent dimensions @@ -86,14 +87,15 @@ export function computeChartDimensions( // find the max half label size to accomodate the left/right labels horizontalEdgeLabelOverflow = Math.max(horizontalEdgeLabelOverflow, maxLabelBboxWidth / 2); break; - case Position.Left: - vLeftAxisSpecWidth += maxAxisWidth + chartMargins.left; - verticalEdgeLabelOverflow = Math.max(verticalEdgeLabelOverflow, maxLabelBboxHeight / 2); - break; case Position.Right: vRightAxisSpecWidth += maxAxisWidth + chartMargins.right; verticalEdgeLabelOverflow = Math.max(verticalEdgeLabelOverflow, maxLabelBboxHeight / 2); break; + case Position.Left: + default: + vLeftAxisSpecWidth += maxAxisWidth + chartMargins.left; + verticalEdgeLabelOverflow = Math.max(verticalEdgeLabelOverflow, maxLabelBboxHeight / 2); + break; } }); const chartLeftAxisMaxWidth = Math.max(vLeftAxisSpecWidth, horizontalEdgeLabelOverflow + chartMargins.left); diff --git a/src/chart_types/xy_chart/utils/fit_function.test.ts b/src/chart_types/xy_chart/utils/fit_function.test.ts index f37dd2d40a..0f28dcda46 100644 --- a/src/chart_types/xy_chart/utils/fit_function.test.ts +++ b/src/chart_types/xy_chart/utils/fit_function.test.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { MockDataSeries, @@ -23,12 +24,11 @@ import { getYResolvedData, MockDataSeriesDatum, } from '../../../mocks'; -import { Fit } from './specs'; import { ScaleType } from '../../../scales'; +import * as testModule from './fit_function'; import { DataSeries } from './series'; - +import { Fit } from './specs'; import * as seriesUtils from './stacked_series_utils'; -import * as testModule from './fit_function'; describe('Fit Function', () => { describe('getValue', () => { @@ -179,7 +179,7 @@ describe('Fit Function', () => { }); }); - it('should return current datum with value from next when previous is null', () => { + it('should return current datum with value from previous when next is null', () => { const previous = MockDataSeriesDatum.full({ x: 4, y1: 20 }); const current = MockDataSeriesDatum.simple({ x: 3 }); const actual = testModule.getValue(current, 0, previous, null, Fit.Nearest); @@ -191,7 +191,7 @@ describe('Fit Function', () => { }); }); - describe(`endValue is set to 'nearest'`, () => { + describe('endValue is set to \'nearest\'', () => { it('should return current datum with value from next when previous is null', () => { const current = MockDataSeriesDatum.simple({ x: 3 }); const next = MockDataSeriesDatum.full({ x: 4, y1: 20 }); @@ -203,7 +203,7 @@ describe('Fit Function', () => { }); }); - it('should return current datum with value from next when previous is null', () => { + it('should return current datum with value from previous when next is null', () => { const previous = MockDataSeriesDatum.full({ x: 0, y1: 20 }); const current = MockDataSeriesDatum.simple({ x: 3 }); const actual = testModule.getValue(current, 0, previous, null, Fit.Average, 'nearest'); @@ -363,7 +363,7 @@ describe('Fit Function', () => { }); }); - it('should return current datum with value from next when previous is null', () => { + it('should return current datum with value from previous when next is null', () => { const previous = MockDataSeriesDatum.full({ x: 4, y1: 20, fittingIndex: 0 }); const current = MockDataSeriesDatum.simple({ x: 'c' }); const actual = testModule.getValue(current, 3, previous, null, Fit.Nearest); @@ -375,7 +375,7 @@ describe('Fit Function', () => { }); }); - describe("endValue is set to 'nearest'", () => { + describe('endValue is set to \'nearest\'', () => { it('should return current datum with value from next when previous is null', () => { const current = MockDataSeriesDatum.simple({ x: 'c' }); const next = MockDataSeriesDatum.full({ x: 'e', y1: 20, fittingIndex: 4 }); @@ -387,7 +387,7 @@ describe('Fit Function', () => { }); }); - it('should return current datum with value from next when previous is null', () => { + it('should return current datum with value from previous when next is null', () => { const previous = MockDataSeriesDatum.full({ x: 4, y1: 20, fittingIndex: 0 }); const current = MockDataSeriesDatum.simple({ x: 'c' }); const actual = testModule.getValue(current, 3, previous, null, Fit.Average, 'nearest'); @@ -602,7 +602,7 @@ describe('Fit Function', () => { }); }); - describe("'nearest' value", () => { + describe('\'nearest\' value', () => { const endValue = 'nearest'; it('should set end values - None', () => { @@ -772,7 +772,7 @@ describe('Fit Function', () => { it('should call getValue for only null values', () => { const actual = testModule.fitFunction(dataSeries, Fit.Lookahead, scaleType); - const length = getFilledNullData(actual.data).length; + const { length } = getFilledNullData(actual.data); expect(testModule.getValue).toBeCalledTimes(length); }); @@ -848,7 +848,7 @@ describe('Fit Function', () => { it('should call getValue for only null values', () => { const actual = testModule.fitFunction(dataSeries, Fit.Nearest, scaleType); - const length = getFilledNullData(actual.data).length; + const { length } = getFilledNullData(actual.data); expect(testModule.getValue).toBeCalledTimes(length); }); @@ -925,7 +925,7 @@ describe('Fit Function', () => { it('should call getValue for only null values', () => { const actual = testModule.fitFunction(dataSeries, Fit.Average, scaleType); - const length = getFilledNullData(actual.data).length; + const { length } = getFilledNullData(actual.data); expect(testModule.getValue).toBeCalledTimes(length); }); @@ -1002,7 +1002,7 @@ describe('Fit Function', () => { it('should call getValue for only null values', () => { const actual = testModule.fitFunction(dataSeries, Fit.Linear, scaleType); - const length = getFilledNullData(actual.data).length; + const { length } = getFilledNullData(actual.data); expect(testModule.getValue).toBeCalledTimes(length); }); diff --git a/src/chart_types/xy_chart/utils/fit_function.ts b/src/chart_types/xy_chart/utils/fit_function.ts index 5ea0e5c03b..b2512092e5 100644 --- a/src/chart_types/xy_chart/utils/fit_function.ts +++ b/src/chart_types/xy_chart/utils/fit_function.ts @@ -14,14 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { DeepNonNullable } from 'utility-types'; -import { Fit, FitConfig } from './specs'; +import { ScaleType } from '../../../scales'; import { DataSeries, DataSeriesDatum } from './series'; +import { Fit, FitConfig } from './specs'; import { datumXSortPredicate } from './stacked_series_utils'; -import { ScaleType } from '../../../scales'; /** * Fit type that requires previous and/or next `non-nullable` values @@ -46,9 +47,7 @@ export type WithIndex = T & { fittingIndex: number }; * Returns `[x, y1]` values for a given datum with `fittingIndex` * */ -const getXYValues = ({ x, y1, fittingIndex }: WithIndex): [number, number] => { - return [typeof x === 'string' ? fittingIndex : x, y1]; -}; +const getXYValues = ({ x, y1, fittingIndex }: WithIndex): [number, number] => [typeof x === 'string' ? fittingIndex : x, y1]; /** @internal */ export const getValue = ( @@ -66,14 +65,16 @@ export const getValue = ( y1: previous.y1, }, }; - } else if (next !== null && type === Fit.Lookahead) { + } + if (next !== null && type === Fit.Lookahead) { return { ...current, filled: { y1: next.y1, }, }; - } else if (previous !== null && next !== null) { + } + if (previous !== null && next !== null) { if (type === Fit.Average) { return { ...current, @@ -81,7 +82,8 @@ export const getValue = ( y1: (previous.y1 + next.y1) / 2, }, }; - } else if (current.x !== null && previous.x !== null && next.x !== null) { + } + if (current.x !== null && previous.x !== null && next.x !== null) { const [x1, y1] = getXYValues(previous); const [x2, y2] = getXYValues(next); const currentX = typeof current.x === 'string' ? currentIndex : current.x; @@ -95,7 +97,8 @@ export const getValue = ( y1: x1Delta > x2Delta ? y2 : y1, }, }; - } else if (type === Fit.Linear) { + } + if (type === Fit.Linear) { return { ...current, filled: { @@ -198,8 +201,7 @@ export const fitFunction = ( }; } - const sortedData = - sorted || xScaleType === ScaleType.Ordinal ? data : data.slice().sort(datumXSortPredicate(xScaleType)); + const sortedData = sorted || xScaleType === ScaleType.Ordinal ? data : data.slice().sort(datumXSortPredicate(xScaleType)); const newData: DataSeriesDatum[] = []; let previousNonNullDatum: WithIndex | null = null; let nextNonNullDatum: WithIndex | null = null; @@ -209,13 +211,13 @@ export const fitFunction = ( const current = sortedData[i]; if ( - current.y1 === null && - nextNonNullDatum === null && - (type === Fit.Lookahead || - type === Fit.Nearest || - type === Fit.Average || - type === Fit.Linear || - endValue === 'nearest') + current.y1 === null + && nextNonNullDatum === null + && (type === Fit.Lookahead + || type === Fit.Nearest + || type === Fit.Average + || type === Fit.Linear + || endValue === 'nearest') ) { // Forward lookahead to get next non-null value for (j = i + 1; j < sortedData.length; j++) { @@ -231,8 +233,7 @@ export const fitFunction = ( } } - const newValue = - current.y1 === null ? getValue(current, i, previousNonNullDatum, nextNonNullDatum, type, endValue) : current; + const newValue = current.y1 === null ? getValue(current, i, previousNonNullDatum, nextNonNullDatum, type, endValue) : current; newData[i] = newValue; diff --git a/src/chart_types/xy_chart/utils/indexed_geometry_linear_map.ts b/src/chart_types/xy_chart/utils/indexed_geometry_linear_map.ts index 24580ac299..4d19b8ccd4 100644 --- a/src/chart_types/xy_chart/utils/indexed_geometry_linear_map.ts +++ b/src/chart_types/xy_chart/utils/indexed_geometry_linear_map.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { IndexedGeometry } from '../../../utils/geometry'; diff --git a/src/chart_types/xy_chart/utils/indexed_geometry_map.ts b/src/chart_types/xy_chart/utils/indexed_geometry_map.ts index 31ad08c622..8cbdb03cb9 100644 --- a/src/chart_types/xy_chart/utils/indexed_geometry_map.ts +++ b/src/chart_types/xy_chart/utils/indexed_geometry_map.ts @@ -14,20 +14,21 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { $Values } from 'utility-types'; +import { Bounds } from '../../../utils/d3-delaunay'; import { IndexedGeometry, isPointGeometry } from '../../../utils/geometry'; import { Point } from '../../../utils/point'; import { IndexedGeometryLinearMap } from './indexed_geometry_linear_map'; import { IndexedGeometrySpatialMap } from './indexed_geometry_spatial_map'; -import { Bounds } from '../../../utils/d3-delaunay'; /** @internal */ export const GeometryType = Object.freeze({ - linear: 'linear' as 'linear', - spatial: 'spatial' as 'spatial', + linear: 'linear' as const, + spatial: 'spatial' as const, }); /** @internal */ export type GeometryType = $Values; @@ -85,6 +86,7 @@ export class IndexedGeometryMap { * @param indexedMaps */ merge(...indexedMaps: IndexedGeometryMap[]) { + // eslint-disable-next-line no-restricted-syntax for (const indexedMap of indexedMaps) { const { spatialGeometries, linearGeometries } = indexedMap.getMergeData(); this.spatialMap.set(spatialGeometries); diff --git a/src/chart_types/xy_chart/utils/indexed_geometry_spatial_map.ts b/src/chart_types/xy_chart/utils/indexed_geometry_spatial_map.ts index df2e30c53a..5c7a340281 100644 --- a/src/chart_types/xy_chart/utils/indexed_geometry_spatial_map.ts +++ b/src/chart_types/xy_chart/utils/indexed_geometry_spatial_map.ts @@ -14,13 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { Delaunay, Bounds } from '../../../utils/d3-delaunay'; import { IndexedGeometry, PointGeometry } from '../../../utils/geometry'; import { Point } from '../../../utils/point'; -import { getDistance } from '../state/utils'; -import { Delaunay, Bounds } from '../../../utils/d3-delaunay'; import { DEFAULT_HIGHLIGHT_PADDING } from '../rendering/rendering'; +import { getDistance } from '../state/utils'; /** @internal */ export type IndexedGeometrySpatialMapPoint = [number, number]; @@ -67,9 +68,7 @@ export class IndexedGeometrySpatialMap { } } - triangulation = (bounds?: Bounds) => { - return this.map?.voronoi(bounds); - }; + triangulation = (bounds?: Bounds) => this.map?.voronoi(bounds); getMergeData() { return [...this.pointGeometries]; diff --git a/src/chart_types/xy_chart/utils/interactions.test.ts b/src/chart_types/xy_chart/utils/interactions.test.ts index e6a01c7950..ad6c21e23c 100644 --- a/src/chart_types/xy_chart/utils/interactions.test.ts +++ b/src/chart_types/xy_chart/utils/interactions.test.ts @@ -14,17 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { TooltipType, isCrosshairTooltipType, isFollowTooltipType } from '../../../specs'; import { Dimensions } from '../../../utils/dimensions'; +import { IndexedGeometry, PointGeometry } from '../../../utils/geometry'; import { areIndexedGeometryArraysEquals, areIndexedGeomsEquals, getOrientedXPosition, getOrientedYPosition, } from './interactions'; -import { IndexedGeometry, PointGeometry } from '../../../utils/geometry'; -import { TooltipType, isCrosshairTooltipType, isFollowTooltipType } from '../../../specs'; const seriesStyle = { rect: { diff --git a/src/chart_types/xy_chart/utils/interactions.ts b/src/chart_types/xy_chart/utils/interactions.ts index 1c67da80af..40bf069667 100644 --- a/src/chart_types/xy_chart/utils/interactions.ts +++ b/src/chart_types/xy_chart/utils/interactions.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { Rotation } from '../../../utils/commons'; import { Dimensions } from '../../../utils/dimensions'; @@ -30,28 +31,30 @@ import { BarGeometry, PointGeometry, IndexedGeometry, isPointGeometry, isBarGeom */ export function getOrientedXPosition(xPos: number, yPos: number, chartRotation: Rotation, chartDimension: Dimensions) { switch (chartRotation) { - case 0: - return xPos; case 180: return chartDimension.width - xPos; case 90: return yPos; case -90: return chartDimension.height - yPos; + case 0: + default: + return xPos; } } /** @internal */ export function getOrientedYPosition(xPos: number, yPos: number, chartRotation: Rotation, chartDimension: Dimensions) { switch (chartRotation) { - case 0: - return yPos; case 180: return chartDimension.height - yPos; case -90: return xPos; case 90: return chartDimension.width - xPos; + case 0: + default: + return yPos; } } @@ -60,7 +63,7 @@ export function areIndexedGeometryArraysEquals(arr1: IndexedGeometry[], arr2: In if (arr1.length !== arr2.length) { return false; } - for (let i = arr1.length; i--; ) { + for (let i = arr1.length; i--;) { return areIndexedGeomsEquals(arr1[i], arr2[i]); } return true; @@ -79,22 +82,22 @@ export function areIndexedGeomsEquals(ig1: IndexedGeometry, ig2: IndexedGeometry function arePointsEqual(ig1: PointGeometry, ig2: PointGeometry) { return ( - ig1.seriesIdentifier.specId === ig2.seriesIdentifier.specId && - ig1.color === ig2.color && - ig1.x === ig2.x && - ig1.transform.x === ig2.transform.x && - ig1.transform.y === ig2.transform.y && - ig1.y === ig2.y && - ig1.radius === ig2.radius + ig1.seriesIdentifier.specId === ig2.seriesIdentifier.specId + && ig1.color === ig2.color + && ig1.x === ig2.x + && ig1.transform.x === ig2.transform.x + && ig1.transform.y === ig2.transform.y + && ig1.y === ig2.y + && ig1.radius === ig2.radius ); } function areBarEqual(ig1: BarGeometry, ig2: BarGeometry) { return ( - ig1.seriesIdentifier.specId === ig2.seriesIdentifier.specId && - ig1.color === ig2.color && - ig1.x === ig2.x && - ig1.y === ig2.y && - ig1.width === ig2.width && - ig1.height === ig2.height + ig1.seriesIdentifier.specId === ig2.seriesIdentifier.specId + && ig1.color === ig2.color + && ig1.x === ig2.x + && ig1.y === ig2.y + && ig1.width === ig2.width + && ig1.height === ig2.height ); } diff --git a/src/chart_types/xy_chart/utils/nonstacked_series_utils.test.ts b/src/chart_types/xy_chart/utils/nonstacked_series_utils.test.ts index fc3b29b22a..53f1829321 100644 --- a/src/chart_types/xy_chart/utils/nonstacked_series_utils.test.ts +++ b/src/chart_types/xy_chart/utils/nonstacked_series_utils.test.ts @@ -14,15 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { RawDataSeries } from './series'; -import { ScaleType } from '../../../scales'; import { MockRawDataSeries, MockDataSeries } from '../../../mocks'; import { MockSeriesSpecs, MockSeriesSpec } from '../../../mocks/specs'; - +import { ScaleType } from '../../../scales'; import * as fitFunctionModule from './fit_function'; import * as testModule from './nonstacked_series_utils'; +import { RawDataSeries } from './series'; import { Fit } from './specs'; const EMPTY_DATA_SET: RawDataSeries[] = [ @@ -372,7 +372,7 @@ describe('Non-Stacked Series Utils', () => { mark: null, }); }); - test('format data with nulls', () => { + test('format data with nulls - fit functions', () => { const formattedData = testModule.formatNonStackedDataSeriesValues( WITH_NULL_DATASET_WY0, false, @@ -470,8 +470,7 @@ describe('Non-Stacked Series Utils', () => { describe.each(['area', 'line'])('Spec type - %s', (specType) => { const rawDataSeries = [MockRawDataSeries.fitFunction({ shuffle: false })]; const dataSeries = MockDataSeries.fitFunction({ shuffle: false }); - const spec = - specType === 'area' ? MockSeriesSpec.area({ fit: Fit.Linear }) : MockSeriesSpec.line({ fit: Fit.Linear }); + const spec = specType === 'area' ? MockSeriesSpec.area({ fit: Fit.Linear }) : MockSeriesSpec.line({ fit: Fit.Linear }); const seriesSpecs = MockSeriesSpecs.fromSpecs([spec]); beforeAll(() => { @@ -492,8 +491,7 @@ describe('Non-Stacked Series Utils', () => { }); it('return not call fitFunction if no fit specified', () => { - const spec = - specType === 'area' ? MockSeriesSpec.area({ fit: undefined }) : MockSeriesSpec.line({ fit: undefined }); + const spec = specType === 'area' ? MockSeriesSpec.area({ fit: undefined }) : MockSeriesSpec.line({ fit: undefined }); const noFitSpec = MockSeriesSpecs.fromSpecs([spec]); testModule.formatNonStackedDataSeriesValues(rawDataSeries, false, noFitSpec, ScaleType.Linear); diff --git a/src/chart_types/xy_chart/utils/nonstacked_series_utils.ts b/src/chart_types/xy_chart/utils/nonstacked_series_utils.ts index 7cdfdd959c..f622d6643d 100644 --- a/src/chart_types/xy_chart/utils/nonstacked_series_utils.ts +++ b/src/chart_types/xy_chart/utils/nonstacked_series_utils.ts @@ -14,13 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { DataSeries, DataSeriesDatum, RawDataSeries } from './series'; -import { fitFunction } from './fit_function'; -import { isAreaSeriesSpec, isLineSeriesSpec, SeriesSpecs, BasicSeriesSpec } from './specs'; import { ScaleType } from '../../../scales'; import { getSpecsById, isDefined } from '../state/utils'; +import { fitFunction } from './fit_function'; +import { DataSeries, DataSeriesDatum, RawDataSeries } from './series'; +import { isAreaSeriesSpec, isLineSeriesSpec, SeriesSpecs, BasicSeriesSpec } from './specs'; /** @internal */ export const formatNonStackedDataSeriesValues = ( @@ -36,10 +37,10 @@ export const formatNonStackedDataSeriesValues = ( const spec = getSpecsById(seriesSpecs, formattedDataValue.specId); if ( - spec !== null && - spec !== undefined && - (isAreaSeriesSpec(spec) || isLineSeriesSpec(spec)) && - spec.fit !== undefined + spec !== null + && spec !== undefined + && (isAreaSeriesSpec(spec) || isLineSeriesSpec(spec)) + && spec.fit !== undefined ) { const fittedData = fitFunction(formattedDataValue, spec.fit, xScaleType); formattedValues.push(fittedData); @@ -63,12 +64,10 @@ export const formatNonStackedDataValues = (dataSeries: RawDataSeries, scaleToExt let y0: number | null; if (y1 === null) { y0 = null; + } else if (scaleToExtent) { + y0 = data.y0 ? data.y0 : y1; } else { - if (scaleToExtent) { - y0 = data.y0 ? data.y0 : y1; - } else { - y0 = data.y0 ? data.y0 : 0; - } + y0 = data.y0 ? data.y0 : 0; } const formattedValue: DataSeriesDatum = { diff --git a/src/chart_types/xy_chart/utils/scales.test.ts b/src/chart_types/xy_chart/utils/scales.test.ts index add552ee05..cdae3fcb11 100644 --- a/src/chart_types/xy_chart/utils/scales.test.ts +++ b/src/chart_types/xy_chart/utils/scales.test.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { ScaleType } from '../../../scales'; import { XDomain } from '../domains/x_domain'; @@ -68,7 +69,7 @@ describe('Series scales', () => { type: 'xDomain', isBandScale: true, domain: [singleDomainValue, singleDomainValue], - minInterval: minInterval, + minInterval, scaleType: ScaleType.Linear, }; const enableHistogramMode = true; @@ -91,7 +92,7 @@ describe('Series scales', () => { type: 'xDomain', isBandScale: true, domain: [singleDomainValue, singleDomainValue], - minInterval: minInterval, + minInterval, scaleType: ScaleType.Linear, }; const enableHistogramMode = false; diff --git a/src/chart_types/xy_chart/utils/scales.ts b/src/chart_types/xy_chart/utils/scales.ts index 1a6dbdf117..04e7989fa6 100644 --- a/src/chart_types/xy_chart/utils/scales.ts +++ b/src/chart_types/xy_chart/utils/scales.ts @@ -14,10 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { GroupId } from '../../../utils/ids'; import { Scale, ScaleType, ScaleBand, ScaleContinuous } from '../../../scales'; +import { GroupId } from '../../../utils/ids'; import { XDomain } from '../domains/x_domain'; import { YDomain } from '../domains/y_domain'; import { FormattedDataSeries } from './series'; @@ -40,13 +41,9 @@ export function countBarsInCluster( // along x axis, we count one "space" per bar series. // we ignore the points, areas, lines as they are // aligned with the x value and doesn't occupy space - const nonStackedBarsInCluster = nonStacked.reduce((acc, ns) => { - return acc + ns.counts.barSeries; - }, 0); + const nonStackedBarsInCluster = nonStacked.reduce((acc, ns) => acc + ns.counts.barSeries, 0); // count stacked bars groups as 1 per group - const stackedBarsInCluster = stacked.reduce((acc, ns) => { - return acc + (ns.counts.barSeries > 0 ? 1 : 0); - }, 0); + const stackedBarsInCluster = stacked.reduce((acc, ns) => acc + (ns.counts.barSeries > 0 ? 1 : 0), 0); const totalBarsInCluster = nonStackedBarsInCluster + stackedBarsInCluster; return { nonStackedBarsInCluster, @@ -97,44 +94,42 @@ export function computeXScale(options: XScaleOptions): Scale { const dividend = totalBarsInCluster > 0 ? totalBarsInCluster : 1; const bandwidth = rangeDiff / (domain.length * dividend); return new ScaleBand(domain, range, bandwidth, barsPadding); - } else { - if (isBandScale) { - const [domainMin, domainMax] = domain; - const isSingleValueHistogram = !!enableHistogramMode && domainMax - domainMin === 0; + } + if (isBandScale) { + const [domainMin, domainMax] = domain; + const isSingleValueHistogram = !!enableHistogramMode && domainMax - domainMin === 0; - const adjustedDomainMax = isSingleValueHistogram ? domainMin + minInterval : domainMax; - const adjustedDomain = [domainMin, adjustedDomainMax]; + const adjustedDomainMax = isSingleValueHistogram ? domainMin + minInterval : domainMax; + const adjustedDomain = [domainMin, adjustedDomainMax]; - const intervalCount = (adjustedDomain[1] - adjustedDomain[0]) / minInterval; - const intervalCountOffest = isSingleValueHistogram ? 0 : 1; - const bandwidth = rangeDiff / (intervalCount + intervalCountOffest); - const { start, end } = getBandScaleRange(isInverse, isSingleValueHistogram, range[0], range[1], bandwidth); + const intervalCount = (adjustedDomain[1] - adjustedDomain[0]) / minInterval; + const intervalCountOffest = isSingleValueHistogram ? 0 : 1; + const bandwidth = rangeDiff / (intervalCount + intervalCountOffest); + const { start, end } = getBandScaleRange(isInverse, isSingleValueHistogram, range[0], range[1], bandwidth); - const scale = new ScaleContinuous( - { - type: scaleType, - domain: adjustedDomain, - range: [start, end], - }, - { - bandwidth: totalBarsInCluster > 0 ? bandwidth / totalBarsInCluster : bandwidth, - minInterval, - timeZone, - totalBarsInCluster, - barsPadding, - ticks, - isSingleValueHistogram, - }, - ); + const scale = new ScaleContinuous( + { + type: scaleType, + domain: adjustedDomain, + range: [start, end], + }, + { + bandwidth: totalBarsInCluster > 0 ? bandwidth / totalBarsInCluster : bandwidth, + minInterval, + timeZone, + totalBarsInCluster, + barsPadding, + ticks, + isSingleValueHistogram, + }, + ); - return scale; - } else { - return new ScaleContinuous( - { type: scaleType, domain, range }, - { bandwidth: 0, minInterval, timeZone, totalBarsInCluster, barsPadding, ticks, integersOnly }, - ); - } + return scale; } + return new ScaleContinuous( + { type: scaleType, domain, range }, + { bandwidth: 0, minInterval, timeZone, totalBarsInCluster, barsPadding, ticks, integersOnly }, + ); } interface YScaleOptions { diff --git a/src/chart_types/xy_chart/utils/series.test.ts b/src/chart_types/xy_chart/utils/series.test.ts index ea760d1fb8..398e61a67c 100644 --- a/src/chart_types/xy_chart/utils/series.test.ts +++ b/src/chart_types/xy_chart/utils/series.test.ts @@ -14,10 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { ColorConfig } from '../../../utils/themes/theme'; +import { ChartTypes } from '../..'; +import { MockSeriesIdentifier } from '../../../mocks/series/series_identifiers'; +import { MockSeriesSpec } from '../../../mocks/specs'; +import { SeededDataGenerator } from '../../../mocks/utils'; import { ScaleType } from '../../../scales'; +import { SpecTypes } from '../../../specs/settings'; +import { AccessorFn } from '../../../utils/accessor'; +import * as TestDataset from '../../../utils/data_samples/test_dataset'; +import { ColorConfig } from '../../../utils/themes/theme'; import { SeriesCollectionValue, getFormattedDataseries, @@ -32,13 +40,6 @@ import { } from './series'; import { BasicSeriesSpec, LineSeriesSpec, SeriesTypes, AreaSeriesSpec } from './specs'; import { formatStackedDataSeriesValues } from './stacked_series_utils'; -import * as TestDataset from '../../../utils/data_samples/test_dataset'; -import { ChartTypes } from '../..'; -import { SpecTypes } from '../../../specs/settings'; -import { MockSeriesSpec } from '../../../mocks/specs'; -import { SeededDataGenerator } from '../../../mocks/utils'; -import { MockSeriesIdentifier } from '../../../mocks/series/series_identifiers'; -import { AccessorFn } from '../../../utils/accessor'; const dg = new SeededDataGenerator(); diff --git a/src/chart_types/xy_chart/utils/series.ts b/src/chart_types/xy_chart/utils/series.ts index f6863e2e87..08ac039847 100644 --- a/src/chart_types/xy_chart/utils/series.ts +++ b/src/chart_types/xy_chart/utils/series.ts @@ -14,20 +14,21 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { ColorConfig } from '../../../utils/themes/theme'; +import { SeriesIdentifier, SeriesKey } from '../../../commons/series_id'; +import { ScaleType } from '../../../scales'; +import { ColorOverrides } from '../../../state/chart_state'; import { Accessor, AccessorFn, getAccessorValue } from '../../../utils/accessor'; +import { Datum, Color } from '../../../utils/commons'; import { GroupId, SpecId } from '../../../utils/ids'; +import { ColorConfig } from '../../../utils/themes/theme'; import { splitSpecsByGroupId, YBasicSeriesSpec } from '../domains/y_domain'; +import { LastValues } from '../state/utils'; import { formatNonStackedDataSeriesValues } from './nonstacked_series_utils'; import { BasicSeriesSpec, SeriesTypes, SeriesSpecs, SeriesNameConfigOptions } from './specs'; import { formatStackedDataSeriesValues } from './stacked_series_utils'; -import { ScaleType } from '../../../scales'; -import { LastValues } from '../state/utils'; -import { Datum, Color } from '../../../utils/commons'; -import { ColorOverrides } from '../../../state/chart_state'; -import { SeriesIdentifier, SeriesKey } from '../../../commons/series_id'; /** @internal */ export const SERIES_DELIMITER = ' - '; @@ -378,6 +379,7 @@ function getRawDataSeries( counts.lineSeries += ds ? ds.length : 0; break; case SeriesTypes.Area: + default: counts.areaSeries += ds ? ds.length : 0; break; } @@ -409,6 +411,7 @@ export function getSplittedSeries( const seriesCollection = new Map(); const xValues: Set = new Set(); let isOrdinalScale = false; + // eslint-disable-next-line no-restricted-syntax for (const spec of seriesSpecs) { const dataSeries = splitSeries(spec); let currentRawDataSeries = dataSeries.rawDataSeries; @@ -416,9 +419,7 @@ export function getSplittedSeries( isOrdinalScale = true; } if (deselectedDataSeries.length > 0) { - currentRawDataSeries = dataSeries.rawDataSeries.filter(({ key }) => { - return !deselectedDataSeries.some(({ key: deselectedKey }) => key === deselectedKey); - }); + currentRawDataSeries = dataSeries.rawDataSeries.filter(({ key }) => !deselectedDataSeries.some(({ key: deselectedKey }) => key === deselectedKey)); } splittedSeries.set(spec.id, currentRawDataSeries); @@ -434,6 +435,7 @@ export function getSplittedSeries( }); }); + // eslint-disable-next-line no-restricted-syntax for (const xValue of dataSeries.xValues) { xValues.add(xValue); } @@ -502,8 +504,7 @@ export function getSeriesName( } let name = ''; - const nameKeys = - spec && spec.yAccessors.length > 1 ? seriesIdentifier.seriesKeys : seriesIdentifier.seriesKeys.slice(0, -1); + const nameKeys = spec && spec.yAccessors.length > 1 ? seriesIdentifier.seriesKeys : seriesIdentifier.seriesKeys.slice(0, -1); // there is one series, the is only one yAccessor, the first part is not null if (hasSingleSeries || nameKeys.length === 0 || nameKeys[0] == null) { @@ -532,9 +533,7 @@ export function getSortedDataSeriesColorsValuesMap( seriesCollection: Map, ): Map { const seriesColorsArray = [...seriesCollection]; - seriesColorsArray.sort(([, specA], [, specB]) => { - return getSortIndex(specA, seriesCollection.size) - getSortIndex(specB, seriesCollection.size); - }); + seriesColorsArray.sort(([, specA], [, specB]) => getSortIndex(specA, seriesCollection.size) - getSortIndex(specB, seriesCollection.size)); return new Map([...seriesColorsArray]); } diff --git a/src/chart_types/xy_chart/utils/specs.ts b/src/chart_types/xy_chart/utils/specs.ts index d33b81afa1..1255ab5c1f 100644 --- a/src/chart_types/xy_chart/utils/specs.ts +++ b/src/chart_types/xy_chart/utils/specs.ts @@ -14,9 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { $Values } from 'utility-types'; + +import { ChartTypes } from '../..'; +import { ScaleContinuousType, ScaleType } from '../../../scales'; +import { SpecTypes, Spec } from '../../../specs'; +import { Accessor, AccessorFormat, AccessorFn } from '../../../utils/accessor'; +import { RecursivePartial, Color, Position, Datum } from '../../../utils/commons'; +import { CurveType } from '../../../utils/curves'; +import { AxisId, GroupId } from '../../../utils/ids'; import { AreaSeriesStyle, BarSeriesStyle, @@ -27,25 +36,18 @@ import { RectAnnotationStyle, BubbleSeriesStyle, } from '../../../utils/themes/theme'; -import { RecursivePartial, Color, Position, Datum } from '../../../utils/commons'; -import { Accessor, AccessorFormat, AccessorFn } from '../../../utils/accessor'; -import { AxisId, GroupId } from '../../../utils/ids'; -import { ScaleContinuousType, ScaleType } from '../../../scales'; -import { CurveType } from '../../../utils/curves'; -import { RawDataSeriesDatum, XYChartSeriesIdentifier } from './series'; -import { AnnotationTooltipFormatter } from '../annotations/types'; -import { SpecTypes, Spec } from '../../../specs'; -import { ChartTypes } from '../..'; import { PrimitiveValue } from '../../partition_chart/layout/utils/group_by_rollup'; +import { AnnotationTooltipFormatter } from '../annotations/types'; +import { RawDataSeriesDatum, XYChartSeriesIdentifier } from './series'; export type BarStyleOverride = RecursivePartial | Color | null; export type PointStyleOverride = RecursivePartial | Color | null; export const SeriesTypes = Object.freeze({ - Area: 'area' as 'area', - Bar: 'bar' as 'bar', - Line: 'line' as 'line', - Bubble: 'bubble' as 'bubble', + Area: 'area' as const, + Bar: 'bar' as const, + Line: 'line' as const, + Bubble: 'bubble' as const, }); export type SeriesTypes = $Values; @@ -145,7 +147,7 @@ export const Fit = Object.freeze({ * [2, null, null, 8] => [2, null null, 8] * ``` */ - None: 'none' as 'none', + None: 'none' as const, /** * Use the previous non-`null` value * @@ -157,7 +159,7 @@ export const Fit = Object.freeze({ * [2, null, null, 8] => [2, 2, 2, 8] * ``` */ - Carry: 'carry' as 'carry', + Carry: 'carry' as const, /** * Use the next non-`null` value * @@ -169,7 +171,7 @@ export const Fit = Object.freeze({ * [2, null, null, 8] => [2, 8, 8, 8] * ``` */ - Lookahead: 'lookahead' as 'lookahead', + Lookahead: 'lookahead' as const, /** * Use the closest non-`null` value (before or after) * @@ -178,7 +180,7 @@ export const Fit = Object.freeze({ * [2, null, null, 8] => [2, 2, 8, 8] * ``` */ - Nearest: 'nearest' as 'nearest', + Nearest: 'nearest' as const, /** * Average between the closest non-`null` values * @@ -187,7 +189,7 @@ export const Fit = Object.freeze({ * [2, null, null, 8] => [2, 5, 5, 8] * ``` */ - Average: 'average' as 'average', + Average: 'average' as const, /** * Linear interpolation between the closest non-`null` values * @@ -196,7 +198,7 @@ export const Fit = Object.freeze({ * [2, null, null, 8] => [2, 4, 6, 8] * ``` */ - Linear: 'linear' as 'linear', + Linear: 'linear' as const, /** * Sets all `null` values to `0` * @@ -205,7 +207,7 @@ export const Fit = Object.freeze({ * [2, null, null, 8] => [2, 0, 0, 8] * ``` */ - Zero: 'zero' as 'zero', + Zero: 'zero' as const, /** * Specify an explicit value `X` * @@ -214,7 +216,7 @@ export const Fit = Object.freeze({ * [2, null, null, 8] => [2, X, X, 8] * ``` */ - Explicit: 'explicit' as 'explicit', + Explicit: 'explicit' as const, }); export type Fit = $Values; @@ -279,7 +281,8 @@ export interface SeriesSpec extends Spec { * The name of the spec. Also a mechanism to provide custom series names. */ name?: SeriesNameAccessor; - /** The ID of the spec group + /** + * The ID of the spec group * @defaultValue {@link DEFAULT_GLOBAL_ID} */ groupId: string; @@ -291,7 +294,8 @@ export interface SeriesSpec extends Spec { seriesType: SeriesTypes; /** Set colors for specific series */ color?: SeriesColorAccessor; - /** If the series should appear in the legend + /** + * If the series should appear in the legend * @defaultValue `false` */ hideInLegend?: boolean; @@ -495,7 +499,8 @@ export type AreaSeriesSpec = BasicSeriesSpec & }; export interface HistogramConfig { - /** Determines how points in the series will align to bands in histogram mode + /** + * Determines how points in the series will align to bands in histogram mode * @defaultValue `start` */ histogramModeAlignment?: HistogramModeAlignment; @@ -519,7 +524,8 @@ export interface AxisSpec extends Spec { id: AxisId; /** Style options for grid line */ gridLineStyle?: GridLineConfig; - /** The ID of the axis group + /** + * The ID of the axis group * @defaultValue {@link DEFAULT_GLOBAL_ID} */ groupId: GroupId; @@ -552,7 +558,7 @@ export interface AxisSpec extends Spec { domain?: DomainRange; /** Object to hold custom styling */ style?: AxisStyle; - /** Show only integar values **/ + /** Show only integar values * */ integersOnly?: boolean; /** * Show duplicated ticks @@ -573,9 +579,9 @@ export interface AxisStyle { } export const AnnotationTypes = Object.freeze({ - Line: 'line' as 'line', - Rectangle: 'rectangle' as 'rectangle', - Text: 'text' as 'text', + Line: 'line' as const, + Rectangle: 'rectangle' as const, + Text: 'text' as const, }); export type AnnotationType = $Values; @@ -585,8 +591,8 @@ export type AnnotationType = $Values; * @public */ export const AnnotationDomainTypes = Object.freeze({ - XDomain: 'xDomain' as 'xDomain', - YDomain: 'yDomain' as 'yDomain', + XDomain: 'xDomain' as const, + YDomain: 'yDomain' as const, }); /** @@ -632,11 +638,13 @@ export type LineAnnotationSpec = BaseAnnotationSpec< }; /** Annotation lines are hidden */ hideLines?: boolean; - /** Hide tooltip when hovering over the line + /** + * Hide tooltip when hovering over the line * @defaultValue `true` */ hideLinesTooltips?: boolean; - /** z-index of the annotation relative to other elements in the chart + /** + * z-index of the annotation relative to other elements in the chart * @defaultValue 1 */ zIndex?: number; @@ -680,7 +688,8 @@ export type RectAnnotationSpec = BaseAnnotationSpec< > & { /** Custom rendering function for tooltip */ renderTooltip?: AnnotationTooltipFormatter; - /** z-index of the annotation relative to other elements in the chart + /** + * z-index of the annotation relative to other elements in the chart * @defaultValue -1 */ zIndex?: number; diff --git a/src/chart_types/xy_chart/utils/stacked_percent_series_utils.test.ts b/src/chart_types/xy_chart/utils/stacked_percent_series_utils.test.ts index 256aea4861..0459b27d82 100644 --- a/src/chart_types/xy_chart/utils/stacked_percent_series_utils.test.ts +++ b/src/chart_types/xy_chart/utils/stacked_percent_series_utils.test.ts @@ -14,11 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { formatStackedDataSeriesValues } from './stacked_series_utils'; -import { ScaleType } from '../../../scales'; import { MockRawDataSeries } from '../../../mocks'; +import { ScaleType } from '../../../scales'; +import { formatStackedDataSeriesValues } from './stacked_series_utils'; describe('Stacked Series Utils', () => { const STANDARD_DATA_SET = MockRawDataSeries.fromData([[{ x: 0, y1: 10 }], [{ x: 0, y1: 20 }], [{ x: 0, y1: 70 }]], { @@ -137,7 +138,7 @@ describe('Stacked Series Utils', () => { expect(data2.y0).toBe(0.36); expect(data2.y1).toBe(1); }); - test('format data with nulls', () => { + test('format data with nulls - missing points', () => { const formattedData = formatStackedDataSeriesValues( WITH_NULL_DATASET_WY0, false, diff --git a/src/chart_types/xy_chart/utils/stacked_series_utils.test.ts b/src/chart_types/xy_chart/utils/stacked_series_utils.test.ts index 4a1398bc90..b7a4b8f4b7 100644 --- a/src/chart_types/xy_chart/utils/stacked_series_utils.test.ts +++ b/src/chart_types/xy_chart/utils/stacked_series_utils.test.ts @@ -14,8 +14,10 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { ScaleType } from '../../../scales'; import { RawDataSeries } from './series'; import { computeYStackedMapValues, @@ -24,7 +26,6 @@ import { getStackedFormattedSeriesDatum, StackedValues, } from './stacked_series_utils'; -import { ScaleType } from '../../../scales'; describe('Stacked Series Utils', () => { const EMPTY_DATA_SET: RawDataSeries[] = [ @@ -377,7 +378,7 @@ describe('Stacked Series Utils', () => { mark: null, }); }); - test('format data with nulls', () => { + test('format data with nulls - missing points', () => { const formattedData = formatStackedDataSeriesValues( WITH_NULL_DATASET_WY0, false, diff --git a/src/chart_types/xy_chart/utils/stacked_series_utils.ts b/src/chart_types/xy_chart/utils/stacked_series_utils.ts index dc67d79e4b..c668b32a1f 100644 --- a/src/chart_types/xy_chart/utils/stacked_series_utils.ts +++ b/src/chart_types/xy_chart/utils/stacked_series_utils.ts @@ -14,11 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { DataSeries, DataSeriesDatum, RawDataSeries, RawDataSeriesDatum, FilledValues } from './series'; import { ScaleType } from '../../../scales'; import { isDefined } from '../state/utils'; +import { DataSeries, DataSeriesDatum, RawDataSeries, RawDataSeriesDatum, FilledValues } from './series'; /** @internal */ export interface StackedValues { @@ -56,6 +57,7 @@ export function getYValueStackMap( missingXValues.delete(datum.x); } }); + // eslint-disable-next-line no-restricted-syntax for (const x of missingXValues.values()) { const stack = stackMap.get(x) || new Array(dataseries.length).fill(0); // currently filling as 0 value @@ -146,6 +148,7 @@ export function formatStackedDataSeriesValues( missingXValues.delete(data.x); newData.push(formattedSeriesDatum); }); + // eslint-disable-next-line no-restricted-syntax for (const x of missingXValues.values()) { const filledSeriesDatum = getStackedFormattedSeriesDatum( { @@ -202,15 +205,17 @@ export function getStackedFormattedSeriesDatum( y0 = stack.total !== 0 ? data.y0 / stack.total : 0; } } else { + // eslint-disable-next-line prefer-destructuring y1 = data.y1; + // eslint-disable-next-line prefer-destructuring y0 = data.y0; } let computedY0: number | null; if (scaleToExtent) { - computedY0 = y0 ? y0 : y1; + computedY0 = y0 || y1; } else { - computedY0 = y0 ? y0 : null; + computedY0 = y0 || null; } const initialY0 = y0 == null ? null : y0; const mark = isDefined(markValue) ? markValue : null; @@ -226,37 +231,36 @@ export function getStackedFormattedSeriesDatum( datum, ...(filled && { filled }), }; + } + const stackY = isPercentageMode ? stack.percent[seriesIndex] : stack.values[seriesIndex]; + let stackedY1: number | null = null; + let stackedY0: number | null = null; + if (isPercentageMode) { + stackedY1 = y1 !== null && stackY != null ? stackY + y1 : null; + stackedY0 = y0 != null && stackY != null ? stackY + y0 : stackY; } else { - const stackY = isPercentageMode ? stack.percent[seriesIndex] : stack.values[seriesIndex]; - let stackedY1: number | null = null; - let stackedY0: number | null = null; - if (isPercentageMode) { - stackedY1 = y1 !== null && stackY != null ? stackY + y1 : null; - stackedY0 = y0 != null && stackY != null ? stackY + y0 : stackY; + if (stackY == null) { + stackedY1 = y1 !== null ? y1 : null; + stackedY0 = y0 != null ? y0 : stackY; } else { - if (stackY == null) { - stackedY1 = y1 !== null ? y1 : null; - stackedY0 = y0 != null ? y0 : stackY; - } else { - stackedY1 = y1 !== null ? stackY + y1 : null; - stackedY0 = y0 != null ? stackY + y0 : stackY; - } - // configure null y0 if y1 is null - // it's semantically correct to say y0 is null if y1 is null - if (stackedY1 === null) { - stackedY0 = null; - } + stackedY1 = y1 !== null ? stackY + y1 : null; + stackedY0 = y0 != null ? stackY + y0 : stackY; + } + // configure null y0 if y1 is null + // it's semantically correct to say y0 is null if y1 is null + if (stackedY1 === null) { + stackedY0 = null; } - - return { - x, - y1: stackedY1, - y0: stackedY0, - initialY1: y1, - initialY0, - mark, - datum, - ...(filled && { filled }), - }; } + + return { + x, + y1: stackedY1, + y0: stackedY0, + initialY1: y1, + initialY0, + mark, + datum, + ...(filled && { filled }), + }; } diff --git a/src/commons/legend.ts b/src/commons/legend.ts index 903d3f1cf8..01e94d8e4e 100644 --- a/src/commons/legend.ts +++ b/src/commons/legend.ts @@ -14,11 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { PrimitiveValue } from '../chart_types/partition_chart/layout/utils/group_by_rollup'; import { Color } from '../utils/commons'; import { SeriesIdentifier } from './series_id'; -import { PrimitiveValue } from '../chart_types/partition_chart/layout/utils/group_by_rollup'; /** @internal */ export type LegendItemChildId = string; diff --git a/src/commons/series_id.ts b/src/commons/series_id.ts index 949eded811..ca5d0958bf 100644 --- a/src/commons/series_id.ts +++ b/src/commons/series_id.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { SpecId } from '../utils/ids'; diff --git a/src/components/chart.snap.test.ts b/src/components/chart.snap.test.ts index db17738802..715a10c73f 100644 --- a/src/components/chart.snap.test.ts +++ b/src/components/chart.snap.test.ts @@ -14,9 +14,10 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { Chart } from '../components/chart'; +import { Chart } from './chart'; describe('test getPNGSnapshot in Chart class', () => { jest.mock('../components/chart'); diff --git a/src/components/chart.test.tsx b/src/components/chart.test.tsx index 6be95918b7..f131857ee3 100644 --- a/src/components/chart.test.tsx +++ b/src/components/chart.test.tsx @@ -1,6 +1,3 @@ -/** - * @jest-environment node - */ /* * Licensed to Elasticsearch B.V. under one or more contributor * license agreements. See the NOTICE file distributed with @@ -17,26 +14,25 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ -// Using node env because JSDOM environment throws warnings: -// Jest doesn't work well with the environment detection hack that react-redux uses internally. -// https://github.com/reduxjs/react-redux/issues/1373 + * under the License. + */ -import React from 'react'; -import { Chart } from './chart'; import { render } from 'enzyme'; +import React from 'react'; + import { Settings } from '../specs'; +import { Chart } from './chart'; describe('Chart', () => { - it("should render 'No data to display' without series", () => { + it('should render \'No data to display\' without series', () => { const wrapper = render(); expect(wrapper.text()).toContain('No data to display'); }); - it("should render 'No data to display' with settings but without series", () => { + it('should render \'No data to display\' with settings but without series', () => { const wrapper = render( - + , ); expect(wrapper.text()).toContain('No data to display'); diff --git a/src/components/chart.tsx b/src/components/chart.tsx index fded2da8dd..7fe2ae72ff 100644 --- a/src/components/chart.tsx +++ b/src/components/chart.tsx @@ -14,30 +14,33 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import React, { createRef } from 'react'; import classNames from 'classnames'; +import React, { createRef } from 'react'; import { Provider } from 'react-redux'; import { createStore, Store, Unsubscribe } from 'redux'; import uuid from 'uuid'; -import { SpecsParser } from '../specs/specs_parser'; -import { ChartResizer } from './chart_resizer'; -import { Legend } from './legend/legend'; -import { ChartContainer } from './chart_container'; + import { isHorizontalAxis } from '../chart_types/xy_chart/utils/axis_utils'; -import { Position } from '../utils/commons'; -import { ChartSize, getChartSize } from '../utils/chart_size'; -import { ChartStatus } from './chart_status'; -import { chartStoreReducer, GlobalChartState } from '../state/chart_state'; -import { getSettingsSpecSelector } from '../state/selectors/get_settings_specs'; -import { onExternalPointerEvent } from '../state/actions/events'; import { PointerEvent } from '../specs'; +import { SpecsParser } from '../specs/specs_parser'; +import { onExternalPointerEvent } from '../state/actions/events'; +import { chartStoreReducer, GlobalChartState } from '../state/chart_state'; import { getInternalIsInitializedSelector } from '../state/selectors/get_internal_is_intialized'; +import { getSettingsSpecSelector } from '../state/selectors/get_settings_specs'; +import { ChartSize, getChartSize } from '../utils/chart_size'; +import { Position } from '../utils/commons'; import { ChartBackground } from './chart_background'; +import { ChartContainer } from './chart_container'; +import { ChartResizer } from './chart_resizer'; +import { ChartStatus } from './chart_status'; +import { Legend } from './legend/legend'; interface ChartProps { - /** The type of rendered + /** + * The type of rendered * @defaultValue `canvas` */ renderer?: 'svg' | 'canvas'; @@ -54,6 +57,7 @@ export class Chart extends React.Component { static defaultProps: ChartProps = { renderer: 'canvas', }; + private unsubscribeToStore: Unsubscribe; private chartStore: Store; private chartContainerRef: React.RefObject; @@ -66,10 +70,9 @@ export class Chart extends React.Component { const id = uuid.v4(); const storeReducer = chartStoreReducer(id); - const enhancers = - typeof window !== 'undefined' && (window as any).__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ - ? (window as any).__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({ trace: true, name: `@elastic/charts (id: ${id})` })() - : undefined; + const enhancers = typeof window !== 'undefined' && (window as any).__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ + ? (window as any).__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({ trace: true, name: `@elastic/charts (id: ${id})` })() + : undefined; this.chartStore = createStore(storeReducer, enhancers); this.state = { @@ -97,10 +100,6 @@ export class Chart extends React.Component { this.unsubscribeToStore(); } - dispatchExternalPointerEvent(event: PointerEvent) { - this.chartStore.dispatch(onExternalPointerEvent(event)); - } - getPNGSnapshot( options = { backgroundColor: 'transparent', @@ -133,17 +132,18 @@ export class Chart extends React.Component { blobOrDataUrl, browser: 'IE11', }; - } else { - return { - blobOrDataUrl: backgroundCanvas.toDataURL(), - browser: 'other', - }; } + return { + blobOrDataUrl: backgroundCanvas.toDataURL(), + browser: 'other', + }; } - getChartContainerRef = () => { - return this.chartContainerRef; - }; + getChartContainerRef = () => this.chartContainerRef; + + dispatchExternalPointerEvent(event: PointerEvent) { + this.chartStore.dispatch(onExternalPointerEvent(event)); + } render() { const { size, className } = this.props; diff --git a/src/components/chart_background.tsx b/src/components/chart_background.tsx index 082b20e104..3598592488 100644 --- a/src/components/chart_background.tsx +++ b/src/components/chart_background.tsx @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; import { connect } from 'react-redux'; -import { getChartThemeSelector } from '../state/selectors/get_chart_theme'; + import { GlobalChartState } from '../state/chart_state'; +import { getChartThemeSelector } from '../state/selectors/get_chart_theme'; import { getInternalIsInitializedSelector } from '../state/selectors/get_internal_is_intialized'; interface ChartBackgroundProps { @@ -28,10 +30,6 @@ interface ChartBackgroundProps { export class ChartBackgroundComponent extends React.Component { static displayName = 'ChartBackground'; - constructor(props: ChartBackgroundProps) { - super(props); - } - render() { const { backgroundColor } = this.props; return
; diff --git a/src/components/chart_container.tsx b/src/components/chart_container.tsx index 4fd72ba329..dcb8a115a4 100644 --- a/src/components/chart_container.tsx +++ b/src/components/chart_container.tsx @@ -14,22 +14,24 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { bindActionCreators, Dispatch } from 'redux'; import { connect } from 'react-redux'; -import { deepEqual } from '../utils/fast_deep_equal'; -import { GlobalChartState, BackwardRef } from '../state/chart_state'; +import { bindActionCreators, Dispatch } from 'redux'; + +import { SettingsSpec } from '../specs'; import { onMouseUp, onMouseDown, onPointerMove } from '../state/actions/mouse'; +import { GlobalChartState, BackwardRef } from '../state/chart_state'; import { getInternalChartRendererSelector } from '../state/selectors/get_chart_type_components'; import { getInternalPointerCursor } from '../state/selectors/get_internal_cursor_pointer'; -import { getInternalIsBrushingAvailableSelector } from '../state/selectors/get_internal_is_brushing_available'; -import { isInternalChartEmptySelector } from '../state/selectors/is_chart_empty'; -import { getSettingsSpecSelector } from '../state/selectors/get_settings_specs'; -import { SettingsSpec } from '../specs'; import { getInternalIsBrushingSelector } from '../state/selectors/get_internal_is_brushing'; +import { getInternalIsBrushingAvailableSelector } from '../state/selectors/get_internal_is_brushing_available'; import { getInternalIsInitializedSelector } from '../state/selectors/get_internal_is_intialized'; +import { getSettingsSpecSelector } from '../state/selectors/get_settings_specs'; +import { isInternalChartEmptySelector } from '../state/selectors/is_chart_empty'; +import { deepEqual } from '../utils/fast_deep_equal'; interface ChartContainerComponentStateProps { initialized: boolean; @@ -80,6 +82,7 @@ class ChartContainerComponent extends React.Component { timeStamp, ); }; + handleMouseLeave = ({ nativeEvent: { timeStamp } }: React.MouseEvent) => { const { isChartEmpty, onPointerMove, isBrushing } = this.props; if (isChartEmpty) { @@ -90,6 +93,7 @@ class ChartContainerComponent extends React.Component { } onPointerMove({ x: -1, y: -1 }, timeStamp); }; + handleMouseDown = ({ nativeEvent: { offsetX, offsetY, timeStamp }, }: React.MouseEvent) => { @@ -108,6 +112,7 @@ class ChartContainerComponent extends React.Component { timeStamp, ); }; + handleMouseUp = ({ nativeEvent: { offsetX, offsetY, timeStamp } }: React.MouseEvent) => { const { isChartEmpty, onMouseUp } = this.props; if (isChartEmpty) { @@ -121,6 +126,7 @@ class ChartContainerComponent extends React.Component { timeStamp, ); }; + handleBrushEnd = () => { const { onMouseUp } = this.props; diff --git a/src/components/chart_resizer.tsx b/src/components/chart_resizer.tsx index 199f9b3d41..d09dd5ca40 100644 --- a/src/components/chart_resizer.tsx +++ b/src/components/chart_resizer.tsx @@ -14,17 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React, { RefObject } from 'react'; +import { connect } from 'react-redux'; +import { Dispatch, bindActionCreators } from 'redux'; import ResizeObserver from 'resize-observer-polyfill'; import { debounce } from 'ts-debounce'; -import { Dimensions } from '../utils/dimensions'; + import { updateParentDimensions } from '../state/actions/chart_settings'; -import { Dispatch, bindActionCreators } from 'redux'; -import { connect } from 'react-redux'; -import { getSettingsSpecSelector } from '../state/selectors/get_settings_specs'; import { GlobalChartState } from '../state/chart_state'; +import { getSettingsSpecSelector } from '../state/selectors/get_settings_specs'; +import { Dimensions } from '../utils/dimensions'; interface ResizerStateProps { resizeDebounce: number; @@ -41,7 +43,6 @@ class Resizer extends React.Component { private containerRef: RefObject; private ro: ResizeObserver; private animationFrameID: number | null; - private onResizeDebounced: (entries: ResizeObserverEntry[]) => void = () => undefined; constructor(props: ResizerProps) { super(props); @@ -66,6 +67,16 @@ class Resizer extends React.Component { this.ro.disconnect(); } + private onResizeDebounced: (entries: ResizeObserverEntry[]) => void = () => {}; + private handleResize = (entries: ResizeObserverEntry[]) => { + if (this.initialResizeComplete) { + this.onResizeDebounced(entries); + } else { + this.initialResizeComplete = true; + this.onResize(entries); + } + }; + onResize = (entries: ResizeObserverEntry[]) => { if (!Array.isArray(entries)) { return; @@ -82,15 +93,6 @@ class Resizer extends React.Component { render() { return
; } - - private handleResize = (entries: ResizeObserverEntry[]) => { - if (this.initialResizeComplete) { - this.onResizeDebounced(entries); - } else { - this.initialResizeComplete = true; - this.onResize(entries); - } - }; } const mapDispatchToProps = (dispatch: Dispatch): ResizerDispatchProps => @@ -103,8 +105,7 @@ const mapDispatchToProps = (dispatch: Dispatch): ResizerDispatchProps => const mapStateToProps = (state: GlobalChartState): ResizerStateProps => { const settings = getSettingsSpecSelector(state); - const resizeDebounce = - settings.resizeDebounce === undefined || settings.resizeDebounce === null ? 200 : settings.resizeDebounce; + const resizeDebounce = settings.resizeDebounce === undefined || settings.resizeDebounce === null ? 200 : settings.resizeDebounce; return { resizeDebounce, }; diff --git a/src/components/chart_status.tsx b/src/components/chart_status.tsx index 67ded61f75..81496eee06 100644 --- a/src/components/chart_status.tsx +++ b/src/components/chart_status.tsx @@ -14,13 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; import { connect } from 'react-redux'; + +import { RenderChangeListener } from '../specs'; import { GlobalChartState } from '../state/chart_state'; import { getSettingsSpecSelector } from '../state/selectors/get_settings_specs'; -import { RenderChangeListener } from '../specs'; interface ChartStatusStateProps { rendered: boolean; @@ -31,9 +33,11 @@ class ChartStatusComponent extends React.Component { componentDidMount() { this.dispatchRenderChange(); } + componentDidUpdate() { this.dispatchRenderChange(); } + dispatchRenderChange = () => { const { onRenderChange, rendered } = this.props; if (onRenderChange) { @@ -42,19 +46,18 @@ class ChartStatusComponent extends React.Component { }); } }; + render() { const { rendered, renderedCount } = this.props; return
; } } -const mapStateToProps = (state: GlobalChartState): ChartStatusStateProps => { - return { - rendered: state.chartRendered, - renderedCount: state.chartRenderedCount, - onRenderChange: getSettingsSpecSelector(state).onRenderChange, - }; -}; +const mapStateToProps = (state: GlobalChartState): ChartStatusStateProps => ({ + rendered: state.chartRendered, + renderedCount: state.chartRenderedCount, + onRenderChange: getSettingsSpecSelector(state).onRenderChange, +}); /** @internal */ export const ChartStatus = connect(mapStateToProps)(ChartStatusComponent); diff --git a/src/components/icons/assets/alert.tsx b/src/components/icons/assets/alert.tsx index 3a41d660d7..d04ae67de7 100644 --- a/src/components/icons/assets/alert.tsx +++ b/src/components/icons/assets/alert.tsx @@ -14,10 +14,10 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ - -/** tslint:disable:max-line-length */ + * under the License. + */ import React from 'react'; + import { IconComponentProps } from '../icon'; /** @internal */ diff --git a/src/components/icons/assets/dot.tsx b/src/components/icons/assets/dot.tsx index e0089e4894..d9e99d0305 100644 --- a/src/components/icons/assets/dot.tsx +++ b/src/components/icons/assets/dot.tsx @@ -14,9 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + import { deepEqual } from '../../../utils/fast_deep_equal'; import { IconComponentProps } from '../icon'; diff --git a/src/components/icons/assets/empty.tsx b/src/components/icons/assets/empty.tsx index b9f6a29a4b..a5dc26fd6e 100644 --- a/src/components/icons/assets/empty.tsx +++ b/src/components/icons/assets/empty.tsx @@ -14,9 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + import { IconComponentProps } from '../icon'; /** @internal */ diff --git a/src/components/icons/assets/eye.tsx b/src/components/icons/assets/eye.tsx index 09410c627f..4ed081aba7 100644 --- a/src/components/icons/assets/eye.tsx +++ b/src/components/icons/assets/eye.tsx @@ -14,10 +14,10 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ - -/** tslint:disable:max-line-length */ + * under the License. + */ import React from 'react'; + import { IconComponentProps } from '../icon'; /** @internal */ diff --git a/src/components/icons/assets/eye_closed.tsx b/src/components/icons/assets/eye_closed.tsx index 4896cc9bd7..77502756ac 100644 --- a/src/components/icons/assets/eye_closed.tsx +++ b/src/components/icons/assets/eye_closed.tsx @@ -14,10 +14,10 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ - -/** tslint:disable:max-line-length */ + * under the License. + */ import React from 'react'; + import { IconComponentProps } from '../icon'; /** @internal */ diff --git a/src/components/icons/assets/list.tsx b/src/components/icons/assets/list.tsx index b04398b5b3..93706c1e3f 100644 --- a/src/components/icons/assets/list.tsx +++ b/src/components/icons/assets/list.tsx @@ -14,10 +14,10 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ - -/** tslint:disable:max-line-length */ + * under the License. + */ import React from 'react'; + import { IconComponentProps } from '../icon'; /** @internal */ diff --git a/src/components/icons/assets/question_in_circle.tsx b/src/components/icons/assets/question_in_circle.tsx index b1b41bbdb0..c907182d19 100644 --- a/src/components/icons/assets/question_in_circle.tsx +++ b/src/components/icons/assets/question_in_circle.tsx @@ -14,10 +14,10 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ - -/** tslint:disable:max-line-length */ + * under the License. + */ import React from 'react'; + import { IconComponentProps } from '../icon'; /** @internal */ diff --git a/src/components/icons/icon.tsx b/src/components/icons/icon.tsx index 0ec88b4a4d..1be30d8ddf 100644 --- a/src/components/icons/icon.tsx +++ b/src/components/icons/icon.tsx @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import classNames from 'classnames'; import React, { SVGAttributes } from 'react'; + import { deepEqual } from '../../utils/fast_deep_equal'; import { AlertIcon } from './assets/alert'; import { DotIcon } from './assets/dot'; @@ -72,12 +74,14 @@ export class Icon extends React.Component { const Svg = (type && typeToIconMap[type]) || EmptyIcon; - // This is a fix for IE and Edge, which ignores tabindex="-1" on an SVG, but respects - // focusable="false". - // - If there's no tab index specified, we'll default the icon to not be focusable, - // which is how SVGs behave in Chrome, Safari, and FF. - // - If tab index is -1, then the consumer wants the icon to not be focusable. - // - For all other values, the consumer wants the icon to be focusable. + /* + * This is a fix for IE and Edge, which ignores tabindex="-1" on an SVG, but respects + * focusable="false". + * - If there's no tab index specified, we'll default the icon to not be focusable, + * which is how SVGs behave in Chrome, Safari, and FF. + * - If tab index is -1, then the consumer wants the icon to not be focusable. + * - For all other values, the consumer wants the icon to be focusable. + */ const focusable = tabIndex == null || tabIndex === -1 ? 'false' : 'true'; return ; diff --git a/src/components/index.ts b/src/components/index.ts index 268c300476..54a53b4d9a 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export { Chart } from './chart'; export { Placement } from './portal'; diff --git a/src/components/legend/__snapshots__/legend.test.tsx.snap b/src/components/legend/__snapshots__/legend.test.tsx.snap index 66561e4f75..b45628e10d 100644 --- a/src/components/legend/__snapshots__/legend.test.tsx.snap +++ b/src/components/legend/__snapshots__/legend.test.tsx.snap @@ -4,6 +4,6 @@ exports[`Legend #legendColorPicker should match snapshot after onChange is calle exports[`Legend #legendColorPicker should match snapshot after onClose is called 1`] = `"
  • splita
  • splitb
  • splitc
  • splitd
    • "`; -exports[`Legend #legendColorPicker should render colorPicker when color is clicked 1`] = `"
    Custom Color Picker
    "`; +exports[`Legend #legendColorPicker should render colorPicker when color is clicked 1`] = `"
    Custom Color Picker
    "`; -exports[`Legend #legendColorPicker should render colorPicker when color is clicked 2`] = `"
  • splita
    • Custom Color Picker
  • splitb
  • splitc
  • splitd
    • "`; +exports[`Legend #legendColorPicker should render colorPicker when color is clicked 2`] = `"
  • splita
    • Custom Color Picker
  • splitb
  • splitc
  • splitd
    • "`; diff --git a/src/components/legend/color.tsx b/src/components/legend/color.tsx index a073afd92f..1c65e27b61 100644 --- a/src/components/legend/color.tsx +++ b/src/components/legend/color.tsx @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import React, { MouseEventHandler } from 'react'; import classNames from 'classnames'; +import React, { MouseEventHandler } from 'react'; + import { Icon } from '../icons/icon'; interface ColorProps { diff --git a/src/components/legend/extra.tsx b/src/components/legend/extra.tsx index d2dc76cb72..657288b4c5 100644 --- a/src/components/legend/extra.tsx +++ b/src/components/legend/extra.tsx @@ -14,10 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import React from 'react'; import classNames from 'classnames'; +import React from 'react'; /** * @internal @@ -26,7 +27,7 @@ import classNames from 'classnames'; */ export function renderExtra(extra: string | number, isSeriesHidden?: boolean) { const extraClassNames = classNames('echLegendItem__extra', { - ['echLegendItem__extra--hidden']: isSeriesHidden, + 'echLegendItem__extra--hidden': isSeriesHidden, }); return (
    diff --git a/src/components/legend/label.tsx b/src/components/legend/label.tsx index 808ce73f11..162a72eefa 100644 --- a/src/components/legend/label.tsx +++ b/src/components/legend/label.tsx @@ -14,10 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import React, { MouseEventHandler } from 'react'; import classNames from 'classnames'; +import React, { MouseEventHandler } from 'react'; interface LabelProps { label: string; @@ -29,7 +30,7 @@ interface LabelProps { */ export function Label({ label, onClick }: LabelProps) { const labelClassNames = classNames('echLegendItem__label', { - ['echLegendItem__label--clickable']: Boolean(onClick), + 'echLegendItem__label--clickable': Boolean(onClick), }); return (
    diff --git a/src/components/legend/legend.test.tsx b/src/components/legend/legend.test.tsx index 30e6699292..68e98ebb6a 100644 --- a/src/components/legend/legend.test.tsx +++ b/src/components/legend/legend.test.tsx @@ -14,16 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import React, { Component } from 'react'; import { mount, ReactWrapper } from 'enzyme'; -import { Chart } from '../chart'; -import { Settings, BarSeries, LegendColorPicker } from '../../specs'; +import React, { Component } from 'react'; + +import { SeededDataGenerator } from '../../mocks/utils'; import { ScaleType } from '../../scales'; +import { Settings, BarSeries, LegendColorPicker } from '../../specs'; +import { Chart } from '../chart'; import { Legend } from './legend'; import { LegendListItem } from './legend_item'; -import { SeededDataGenerator } from '../../mocks/utils'; const dg = new SeededDataGenerator(); @@ -161,25 +163,24 @@ describe('Legend', () => { data = dg.generateGroupedSeries(10, 4, 'split'); - legendColorPickerFn: LegendColorPicker = ({ onClose }) => { - return ( -
    - Custom Color Picker - - -
    - ); - }; + legendColorPickerFn: LegendColorPicker = ({ onClose }) => ( +
    + Custom Color Picker + + +
    + ); render() { return ( diff --git a/src/components/legend/legend.tsx b/src/components/legend/legend.tsx index b69e83756b..364655b795 100644 --- a/src/components/legend/legend.tsx +++ b/src/components/legend/legend.tsx @@ -14,35 +14,36 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import React from 'react'; import classNames from 'classnames'; -import { Dispatch, bindActionCreators } from 'redux'; +import React from 'react'; import { connect } from 'react-redux'; -import { Position } from '../../utils/commons'; -import { GlobalChartState } from '../../state/chart_state'; -import { getLegendItemsSelector } from '../../state/selectors/get_legend_items'; -import { getSettingsSpecSelector } from '../../state/selectors/get_settings_specs'; -import { getChartThemeSelector } from '../../state/selectors/get_chart_theme'; -import { getLegendExtraValuesSelector } from '../../state/selectors/get_legend_items_values'; -import { getLegendSizeSelector } from '../../state/selectors/get_legend_size'; -import { onToggleLegend } from '../../state/actions/legend'; -import { LIGHT_THEME } from '../../utils/themes/light_theme'; -import { LegendItemProps } from './legend_item'; -import { Theme } from '../../utils/themes/theme'; +import { Dispatch, bindActionCreators } from 'redux'; + import { LegendItem, LegendItemExtraValues } from '../../commons/legend'; -import { BBox } from '../../utils/bbox/bbox_calculator'; +import { LegendItemListener, BasicListener, LegendColorPicker } from '../../specs'; +import { clearTemporaryColors, setTemporaryColor, setPersistedColor } from '../../state/actions/colors'; import { + onToggleLegend, onToggleDeselectSeriesAction, onLegendItemOutAction, onLegendItemOverAction, } from '../../state/actions/legend'; -import { clearTemporaryColors, setTemporaryColor, setPersistedColor } from '../../state/actions/colors'; -import { LegendItemListener, BasicListener, LegendColorPicker } from '../../specs'; -import { getLegendStyle, getLegendListStyle } from './style_utils'; -import { renderLegendItem } from './legend_item'; +import { GlobalChartState } from '../../state/chart_state'; +import { getChartThemeSelector } from '../../state/selectors/get_chart_theme'; import { getInternalIsInitializedSelector } from '../../state/selectors/get_internal_is_intialized'; +import { getLegendItemsSelector } from '../../state/selectors/get_legend_items'; +import { getLegendExtraValuesSelector } from '../../state/selectors/get_legend_items_values'; +import { getLegendSizeSelector } from '../../state/selectors/get_legend_size'; +import { getSettingsSpecSelector } from '../../state/selectors/get_settings_specs'; +import { BBox } from '../../utils/bbox/bbox_calculator'; +import { Position } from '../../utils/commons'; +import { LIGHT_THEME } from '../../utils/themes/light_theme'; +import { Theme } from '../../utils/themes/theme'; +import { LegendItemProps, renderLegendItem } from './legend_item'; +import { getLegendStyle, getLegendListStyle } from './style_utils'; interface LegendStateProps { debug: boolean; @@ -112,9 +113,7 @@ export class LegendComponent extends React.Component {
      - {items.map((item, index) => { - return renderLegendItem(item, itemProps, items.length, index); - })} + {items.map((item, index) => renderLegendItem(item, itemProps, items.length, index))}
    diff --git a/src/components/legend/legend_item.tsx b/src/components/legend/legend_item.tsx index 38321663c3..35877cf4ba 100644 --- a/src/components/legend/legend_item.tsx +++ b/src/components/legend/legend_item.tsx @@ -14,29 +14,31 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import classNames from 'classnames'; import React, { Component, createRef, MouseEventHandler } from 'react'; -import { deepEqual } from '../../utils/fast_deep_equal'; -import { LegendItemListener, BasicListener, LegendColorPicker } from '../../specs/settings'; + import { LegendItem, LegendItemExtraValues } from '../../commons/legend'; -import { - onLegendItemOutAction, - onLegendItemOverAction, - onToggleDeselectSeriesAction, -} from '../../state/actions/legend'; -import { Position, Color } from '../../utils/commons'; import { SeriesIdentifier } from '../../commons/series_id'; +import { LegendItemListener, BasicListener, LegendColorPicker } from '../../specs/settings'; import { clearTemporaryColors as clearTemporaryColorsAction, setTemporaryColor as setTemporaryColorAction, setPersistedColor as setPersistedColorAction, } from '../../state/actions/colors'; -import { getExtra } from './utils'; +import { + onLegendItemOutAction, + onLegendItemOverAction, + onToggleDeselectSeriesAction, +} from '../../state/actions/legend'; +import { Position, Color } from '../../utils/commons'; +import { deepEqual } from '../../utils/fast_deep_equal'; import { Color as ItemColor } from './color'; -import { Label as ItemLabel } from './label'; import { renderExtra } from './extra'; +import { Label as ItemLabel } from './label'; +import { getExtra } from './utils'; /** @internal */ export const LEGEND_HIERARCHY_MARGIN = 10; @@ -105,8 +107,8 @@ interface LegendItemState { /** @internal */ export class LegendListItem extends Component { static displayName = 'LegendItem'; - ref = createRef(); + ref = createRef(); state: LegendItemState = { isOpen: false, }; @@ -123,34 +125,6 @@ export class LegendListItem extends Component } : undefined; - renderColorPicker() { - const { - colorPicker: ColorPicker, - item, - clearTemporaryColorsAction, - setTemporaryColorAction, - setPersistedColorAction, - } = this.props; - const { seriesIdentifier, color } = item; - - const handleClose = () => { - setPersistedColorAction(seriesIdentifier.key, color); - clearTemporaryColorsAction(); - this.toggleIsOpen(); - }; - if (ColorPicker && this.state.isOpen && this.ref.current) { - return ( - setTemporaryColorAction(seriesIdentifier.key, color)} - seriesIdentifier={seriesIdentifier} - /> - ); - } - } - toggleIsOpen = () => { this.setState(({ isOpen }) => ({ isOpen: !isOpen })); }; @@ -194,6 +168,34 @@ export class LegendListItem extends Component }; }; + renderColorPicker() { + const { + colorPicker: ColorPicker, + item, + clearTemporaryColorsAction, + setTemporaryColorAction, + setPersistedColorAction, + } = this.props; + const { seriesIdentifier, color } = item; + + const handleClose = () => { + setPersistedColorAction(seriesIdentifier.key, color); + clearTemporaryColorsAction(); + this.toggleIsOpen(); + }; + if (ColorPicker && this.state.isOpen && this.ref.current) { + return ( + setTemporaryColorAction(seriesIdentifier.key, color)} + seriesIdentifier={seriesIdentifier} + /> + ); + } + } + render() { const { extraValues, item, showExtra, colorPicker, position, totalItems } = this.props; const { color, isSeriesHidden, isItemHidden, seriesIdentifier, label } = item; diff --git a/src/components/legend/style_utils.ts b/src/components/legend/style_utils.ts index 051b1e4f0d..a458df1ecd 100644 --- a/src/components/legend/style_utils.ts +++ b/src/components/legend/style_utils.ts @@ -14,12 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { LegendStyle as ThemeLegendStyle } from '../../utils/themes/theme'; -import { Margins } from '../../utils/dimensions'; -import { Position } from '../../utils/commons'; import { BBox } from '../../utils/bbox/bbox_calculator'; +import { Position } from '../../utils/commons'; +import { Margins } from '../../utils/dimensions'; +import { LegendStyle as ThemeLegendStyle } from '../../utils/themes/theme'; /** @internal */ export interface LegendStyle { diff --git a/src/components/legend/utils.ts b/src/components/legend/utils.ts index e0a4e86c1b..3a6494cfe2 100644 --- a/src/components/legend/utils.ts +++ b/src/components/legend/utils.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { LegendItemExtraValues, LegendItem } from '../../commons/legend'; /** @internal */ @@ -32,10 +33,8 @@ export function getExtra(extraValues: Map, item: if (extraValues.size !== totalItems) { if (actionExtra != null) { return actionExtra; - } else { - return ''; } - } else { - return actionExtra !== null ? actionExtra : defaultExtra?.formatted ?? ''; + return ''; } + return actionExtra !== null ? actionExtra : defaultExtra?.formatted ?? ''; } diff --git a/src/components/portal/index.ts b/src/components/portal/index.ts index a05f9ad0c4..250f942bb1 100644 --- a/src/components/portal/index.ts +++ b/src/components/portal/index.ts @@ -14,9 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ - -/** @internal */ + * under the License. + */ export * from './tooltip_portal'; export * from './types'; export * from './utils'; diff --git a/src/components/portal/tooltip_portal.tsx b/src/components/portal/tooltip_portal.tsx index b819d2cc9f..3a98b0f48e 100644 --- a/src/components/portal/tooltip_portal.tsx +++ b/src/components/portal/tooltip_portal.tsx @@ -14,15 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { createPopper, Instance } from '@popperjs/core'; import classNames from 'classnames'; import React, { useRef, useEffect, useCallback, ReactNode, useMemo, useState } from 'react'; import { createPortal } from 'react-dom'; -import { createPopper, Instance } from '@popperjs/core'; -import { mergePartial } from '../../utils/commons'; import { isDefined } from '../../chart_types/xy_chart/state/utils'; +import { mergePartial } from '../../utils/commons'; import { PopperSettings, PortalAnchorRef } from './types'; import { DEFAULT_POPPER_SETTINGS, getOrCreateNode, isHTMLElement } from './utils'; @@ -195,7 +196,7 @@ const TooltipPortalComponent = ({ anchor, scope, settings, children, visible, ch useEffect(() => { if (popper.current) { updateAnchorDimensions(); - popper.current.update(); + void popper.current.update(); } }, [updateAnchorDimensions, popper]); diff --git a/src/components/portal/types.ts b/src/components/portal/types.ts index 69a1684291..349198a30b 100644 --- a/src/components/portal/types.ts +++ b/src/components/portal/types.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { $Values } from 'utility-types'; @@ -23,21 +24,21 @@ import { $Values } from 'utility-types'; * @public */ export const Placement = Object.freeze({ - Top: 'top' as 'top', - Bottom: 'bottom' as 'bottom', - Left: 'left' as 'left', - Right: 'right' as 'right', - TopStart: 'top-start' as 'top-start', - TopEnd: 'top-end' as 'top-end', - BottomStart: 'bottom-start' as 'bottom-start', - BottomEnd: 'bottom-end' as 'bottom-end', - RightStart: 'right-start' as 'right-start', - RightEnd: 'right-end' as 'right-end', - LeftStart: 'left-start' as 'left-start', - LeftEnd: 'left-end' as 'left-end', - Auto: 'auto' as 'auto', - AutoStart: 'auto-start' as 'auto-start', - AutoEnd: 'auto-end' as 'auto-end', + Top: 'top' as const, + Bottom: 'bottom' as const, + Left: 'left' as const, + Right: 'right' as const, + TopStart: 'top-start' as const, + TopEnd: 'top-end' as const, + BottomStart: 'bottom-start' as const, + BottomEnd: 'bottom-end' as const, + RightStart: 'right-start' as const, + RightEnd: 'right-end' as const, + LeftStart: 'left-start' as const, + LeftEnd: 'left-end' as const, + Auto: 'auto' as const, + AutoStart: 'auto-start' as const, + AutoEnd: 'auto-end' as const, }); /** diff --git a/src/components/portal/utils.ts b/src/components/portal/utils.ts index 6669387e53..7d5dc87dc3 100644 --- a/src/components/portal/utils.ts +++ b/src/components/portal/utils.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { PopperSettings, Placement } from './types'; @@ -29,8 +30,9 @@ export const DEFAULT_POPPER_SETTINGS: PopperSettings = { * Creates new dom element with given id and attaches to parent * * @internal - * */ + */ export function getOrCreateNode(id: string, parent: HTMLElement = document.body): HTMLDivElement { + // eslint-disable-next-line unicorn/prefer-query-selector const node = document.getElementById(id); if (node) { return node as HTMLDivElement; diff --git a/src/components/tooltip/index.ts b/src/components/tooltip/index.ts index f31ce31c3f..842fc85eb8 100644 --- a/src/components/tooltip/index.ts +++ b/src/components/tooltip/index.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ /** @internal */ export { Tooltip } from './tooltip'; diff --git a/src/components/tooltip/tooltip.tsx b/src/components/tooltip/tooltip.tsx index 1df38d383f..8b776b6dbd 100644 --- a/src/components/tooltip/tooltip.tsx +++ b/src/components/tooltip/tooltip.tsx @@ -14,26 +14,27 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import classNames from 'classnames'; +import React, { memo, useCallback, useMemo, useEffect } from 'react'; import { connect } from 'react-redux'; import { bindActionCreators, Dispatch } from 'redux'; -import React, { memo, useCallback, useMemo, useEffect } from 'react'; -import { TooltipInfo, TooltipAnchorPosition } from './types'; import { TooltipValueFormatter, TooltipSettings, TooltipValue } from '../../specs'; -import { TooltipPortal, PopperSettings, AnchorPosition, Placement } from '../portal'; -import { getInternalIsTooltipVisibleSelector } from '../../state/selectors/get_internal_is_tooltip_visible'; -import { getTooltipHeaderFormatterSelector } from '../../state/selectors/get_tooltip_header_formatter'; -import { getInternalTooltipInfoSelector } from '../../state/selectors/get_internal_tooltip_info'; -import { getInternalTooltipAnchorPositionSelector } from '../../state/selectors/get_internal_tooltip_anchor_position'; +import { onPointerMove } from '../../state/actions/mouse'; import { GlobalChartState, BackwardRef } from '../../state/chart_state'; +import { getChartRotationSelector } from '../../state/selectors/get_chart_rotation'; import { getInternalIsInitializedSelector } from '../../state/selectors/get_internal_is_intialized'; +import { getInternalIsTooltipVisibleSelector } from '../../state/selectors/get_internal_is_tooltip_visible'; +import { getInternalTooltipAnchorPositionSelector } from '../../state/selectors/get_internal_tooltip_anchor_position'; +import { getInternalTooltipInfoSelector } from '../../state/selectors/get_internal_tooltip_info'; import { getSettingsSpecSelector } from '../../state/selectors/get_settings_specs'; -import { onPointerMove } from '../../state/actions/mouse'; -import { getChartRotationSelector } from '../../state/selectors/get_chart_rotation'; +import { getTooltipHeaderFormatterSelector } from '../../state/selectors/get_tooltip_header_formatter'; import { Rotation } from '../../utils/commons'; +import { TooltipPortal, PopperSettings, AnchorPosition, Placement } from '../portal'; +import { TooltipInfo, TooltipAnchorPosition } from './types'; interface TooltipDispatchProps { onPointerMove: typeof onPointerMove; @@ -97,7 +98,6 @@ const TooltipComponent = ({ return null; } const classes = classNames('echTooltip__item', { - /* eslint @typescript-eslint/camelcase:0 */ echTooltip__rowHighlighted: isHighlighted, }); return ( @@ -111,7 +111,13 @@ const TooltipComponent = ({ > {label} {value} - {markValue &&  ({markValue})} + {markValue && ( + +  ( + {markValue} + ) + + )}
    ); }, @@ -147,9 +153,9 @@ const TooltipComponent = ({ const height = y0 !== undefined ? y1 - y0 : 0; return { left: x1 - width, - width: width, + width, top: y1 - height, - height: height, + height, }; }, [isVisible, position?.x0, position?.x1, position?.y0, position?.y1]); // eslint-disable-line react-hooks/exhaustive-deps @@ -164,8 +170,8 @@ const TooltipComponent = ({ ...rest, placement: placement ?? (rotation === 0 || rotation === 180 ? Placement.Right : Placement.Top), fallbackPlacements: - fallbackPlacements ?? - (rotation === 0 || rotation === 180 + fallbackPlacements + ?? (rotation === 0 || rotation === 180 ? [Placement.Right, Placement.Left, Placement.Top, Placement.Bottom] : [Placement.Top, Placement.Bottom, Placement.Right, Placement.Left]), boundary: boundary === 'chart' && chartRef.current ? chartRef.current : undefined, diff --git a/src/components/tooltip/types.ts b/src/components/tooltip/types.ts index 32c0035634..37e274fbf5 100644 --- a/src/components/tooltip/types.ts +++ b/src/components/tooltip/types.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { ComponentType } from 'react'; diff --git a/src/geoms/types.ts b/src/geoms/types.ts index fa1bed611f..4d7de40eed 100644 --- a/src/geoms/types.ts +++ b/src/geoms/types.ts @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { RgbObject } from '../chart_types/partition_chart/layout/utils/color_library_wrappers'; import { Radian } from '../chart_types/partition_chart/layout/types/geometry_types'; +import { RgbObject } from '../chart_types/partition_chart/layout/utils/color_library_wrappers'; + export interface Text { text: string; x: number; diff --git a/src/index.ts b/src/index.ts index a6ae8eddb5..0bdb58973b 100644 --- a/src/index.ts +++ b/src/index.ts @@ -14,9 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ - -// polyfill for Path2D canvas + * under the License. + */ import 'path2d-polyfill'; export * from './components'; @@ -42,7 +41,6 @@ export { export { Layer as PartitionLayer } from './chart_types/partition_chart/specs/index'; export { Goal } from './chart_types/goal_chart/specs/index'; export { AccessorFn, IndexedAccessorFn, UnaryAccessorFn } from './utils/accessor'; -export { SpecTypes } from './specs/settings'; export { CustomTooltip, TooltipInfo } from './components/tooltip/types'; // scales diff --git a/src/mocks/geometries.ts b/src/mocks/geometries.ts index 7b9c686710..93d6723739 100644 --- a/src/mocks/geometries.ts +++ b/src/mocks/geometries.ts @@ -14,13 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import { omit } from 'lodash'; -import { AreaGeometry, PointGeometry, BarGeometry, LineGeometry, BubbleGeometry } from '../utils/geometry'; -import { MockSeriesIdentifier } from './series/series_identifiers'; import { mergePartial, RecursivePartial } from '../utils/commons'; +import { AreaGeometry, PointGeometry, BarGeometry, LineGeometry, BubbleGeometry } from '../utils/geometry'; import { LIGHT_THEME } from '../utils/themes/light_theme'; -import { omit } from 'lodash'; +import { MockSeriesIdentifier } from './series/series_identifiers'; const color = 'red'; const { barSeriesStyle, lineSeriesStyle, areaSeriesStyle, bubbleSeriesStyle } = LIGHT_THEME; diff --git a/src/mocks/hierarchical/dimension_codes.ts b/src/mocks/hierarchical/dimension_codes.ts index 39dafa659b..b1d82b551e 100644 --- a/src/mocks/hierarchical/dimension_codes.ts +++ b/src/mocks/hierarchical/dimension_codes.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export const productDimension = [ { sitc1: '0', name: 'Food and live animals' }, @@ -45,7 +46,7 @@ export const countryDimension = [ { continentCountry: 'afbfa', country: 'bfa', name: 'Burkina Faso' }, { continentCountry: 'afbwa', country: 'bwa', name: 'Botswana' }, { continentCountry: 'afcaf', country: 'caf', name: 'Central African Republic' }, - { continentCountry: 'afciv', country: 'civ', name: "Cote d'Ivoire" }, + { continentCountry: 'afciv', country: 'civ', name: 'Cote d\'Ivoire' }, { continentCountry: 'afcmr', country: 'cmr', name: 'Cameroon' }, { continentCountry: 'afcod', country: 'cod', name: 'Democratic Republic of the Congo' }, { continentCountry: 'afcog', country: 'cog', name: 'Republic of the Congo' }, @@ -303,6 +304,3 @@ export const countryDimension = [ { continentCountry: 'xxwld', country: 'wld', name: 'World' }, { continentCountry: 'xxxxh', country: 'xxa', name: 'Areas' }, ]; - -// prettier-ignore -// const sitc4 = arrayToLookup((d: any) => d.sitc, [{"sitc":"0","name":"Food and live animals chiefly for food"},{"sitc":"00","name":"Live animals chiefly for food"},{"sitc":"001","name":"Live animals chiefly for food"},{"sitc":"0011","name":"Animals of the bovine species (including buffaloes), live"},{"sitc":"00111","name":"-- pure bred for breeding"},{"sitc":"00119","name":"-- other than pure bred for breeding"},{"sitc":"0012","name":"Sheep and goats, live"},{"sitc":"00121","name":"Sheep, live"},{"sitc":"00122","name":"Goats, live"},{"sitc":"0013","name":"Swine, live"},{"sitc":"0014","name":"Poultry, live"},{"sitc":"00141","name":"Live poultry of 185 grams or less"},{"sitc":"00149","name":"Live poultry over 185 grams"},{"sitc":"0015","name":"Equine species, live"},{"sitc":"0019","name":"Live animals of a kind mainly used for human food, nes"},{"sitc":"01","name":"Meat and preparations"},{"sitc":"011","name":"Meat and edible meat offal, fresh, chilled or frozen"},{"sitc":"0111","name":"Bovine meat, fresh, chilled or frozen"},{"sitc":"01111","name":"Bovine meat fresh, chilled or frozen, with bone"},{"sitc":"01112","name":"Bovine meat fresh, chilled or frozen, boneless"},{"sitc":"0112","name":"Meat of sheep and goats, fresh, chilled or frozen"},{"sitc":"0113","name":"Pig meat fresh, chilled or frozen"},{"sitc":"0114","name":"Poultry, dead and edible offal, fresh, chilled or frozen"},{"sitc":"0115","name":"Meat of horses, asses, mules and hinnies, fresh, chilled or frozen"},{"sitc":"0116","name":"Edible offal of headings 0011-5 and 0015, fresh, chilled or frozen"},{"sitc":"0118","name":"Other fresh, chilled or frozen meat or edible meat offal"},{"sitc":"01181","name":"Poultry liver fresh, chilled, frozen, salted or in brine"},{"sitc":"01189","name":"Meat and edible meat offal, fresh, chilled, or frozen, nes"},{"sitc":"012","name":"Meat and edible meat offal, in brine, dried, salted or smoked"},{"sitc":"0121","name":"Bacon, ham, other dried, salted or smoked meat of domestic swine"},{"sitc":"0129","name":"Meat and edible meat offal, nes, in brine, dried, salted or smoked"},{"sitc":"014","name":"Meat and edible meat offal, prepared, preserved, nes; fish extracts"},{"sitc":"0141","name":"Meat extracts and juices; fish extracts"},{"sitc":"0142","name":"Sausages and the like, of meat, meat offal or animal blood"},{"sitc":"0149","name":"Other prepared or preserved meat or meat offal"},{"sitc":"02","name":"Dairy products and birds' eggs"},{"sitc":"022","name":"Milk and cream"},{"sitc":"0223","name":"Milk and cream fresh, not concentrated or sweetened"},{"sitc":"0224","name":"Milk and cream, preserved, concentrated or sweetened"},{"sitc":"02241","name":"Whey"},{"sitc":"02242","name":"Milk dry, containing not more than 1.5% of fat"},{"sitc":"02243","name":"Milk and cream dry, containing more than 1.5% fat"},{"sitc":"02249","name":"Milk and cream (not dry), concentrated, preserved or sweetened"},{"sitc":"023","name":"Butter"},{"sitc":"0230","name":"Butter"},{"sitc":"024","name":"Cheese and curd"},{"sitc":"0240","name":"Cheese and curd"},{"sitc":"025","name":"Eggs, birds', and egg yolks, fresh, dried or preserved"},{"sitc":"0251","name":"Eggs, birds', and egg yolks, fresh, dried or preserved, in shell"},{"sitc":"0252","name":"Eggs, birds', egg yolks, fresh, dried or preserved, not in shell"},{"sitc":"03","name":"Fish, crustacean and molluscs, and preparations thereof"},{"sitc":"034","name":"Fish, fresh, chilled or frozen"},{"sitc":"0341","name":"Fish, fresh or chilled, excluding fillet"},{"sitc":"0342","name":"Fish, frozen, excluding fillets"},{"sitc":"0343","name":"Fish fillets, fresh or chilled"},{"sitc":"0344","name":"Fish fillets, frozen"},{"sitc":"035","name":"Fish, dried, salted or in brine; smoked fish"},{"sitc":"0350","name":"Fish, dried, salted or in brine; smoked fish"},{"sitc":"03501","name":"Fish meal fit for human consumption"},{"sitc":"03502","name":"Cod (not in fillets) dried, whether or not salted"},{"sitc":"03503","name":"Fish (excluding cod) dried, salted or in brine"},{"sitc":"03504","name":"Fish smoked"},{"sitc":"036","name":"Crustaceans and molluscs, fresh, chilled, frozen, salted, etc"},{"sitc":"0360","name":"Crustaceans and molluscs, fresh, chilled, frozen, salted, etc"},{"sitc":"037","name":"Fish, crustaceans and molluscs, prepared or preserved, nes"},{"sitc":"0371","name":"Fish, prepared or preserved, nes"},{"sitc":"0372","name":"Crustaceans and molluscs, prepared or prepared, nes"},{"sitc":"04","name":"Cereals and cereal preparations"},{"sitc":"041","name":"Wheat and meslin, unmilled"},{"sitc":"0411","name":"Durum wheat, unmilled"},{"sitc":"0412","name":"Other wheat and meslin, unmilled"},{"sitc":"042","name":"Rice"},{"sitc":"0421","name":"Rice in the husk or husked, but not farther prepared"},{"sitc":"04211","name":"Rice in the husk"},{"sitc":"04212","name":"Rice husked, but not further prepared"},{"sitc":"0422","name":"Rice, semi-milled or wholly milled"},{"sitc":"04221","name":"Rice, semi-milled or milled (unbroken)"},{"sitc":"04222","name":"Rice broken"},{"sitc":"043","name":"Barley, unmilled"},{"sitc":"0430","name":"Barley, unmilled"},{"sitc":"044","name":"Maize, unmilled"},{"sitc":"0440","name":"Maize, unmilled"},{"sitc":"045","name":"Cereals, unmilled"},{"sitc":"0451","name":"Rye, unmilled"},{"sitc":"0452","name":"Oats, unmilled"},{"sitc":"0459","name":"Buckwheat, millet, etc, and other cereals, unmilled, nes"},{"sitc":"04591","name":"Millet, unmilled"},{"sitc":"04592","name":"Sorghum, unmilled"},{"sitc":"04599","name":"Other cereals, unmilled, nes"},{"sitc":"046","name":"Meal and flour of wheat and flour of meslin"},{"sitc":"0460","name":"Meal and flour of wheat and flour of meslin"},{"sitc":"04601","name":"Flour of wheat or of meslin"},{"sitc":"04602","name":"Groats, meal and pellets, of wheat"},{"sitc":"047","name":"Other cereal meals and flour"},{"sitc":"0470","name":"Other cereal meals and flour"},{"sitc":"04701","name":"Cereal flours (non-wheat or meslin)"},{"sitc":"04702","name":"Cereal groats, meal and pellets (non-wheat)"},{"sitc":"048","name":"Cereal, flour or starch preparations of fruits or vegetables"},{"sitc":"0481","name":"Cereal grains, worked or prepared, not elsewhere specified"},{"sitc":"04811","name":"Other worked cereal grains, flaked, rolled, etc"},{"sitc":"04812","name":"Prepared cereal, roasted, puffed, etc"},{"sitc":"0482","name":"Malt, roasted or not, including flour"},{"sitc":"0483","name":"Macaroni, spaghetti and similar products"},{"sitc":"0484","name":"Bakery products"},{"sitc":"04841","name":"Bread, biscuit, communion wafers (non-sugars, eggs fat, etc)"},{"sitc":"04842","name":"Pastry, biscuits, cakes etc, with or without cocoa"},{"sitc":"0488","name":"Malt extract; cereals preparations with less 50% of cocoa"},{"sitc":"05","name":"Vegetables and fruit"},{"sitc":"054","name":"Vegetables, fresh or simply preserved; roots and tubers, nes"},{"sitc":"0541","name":"Potatoes, fresh or chilled, excluding sweet potatoes"},{"sitc":"0542","name":"Beans, peas, other leguminous vegetables, dried, shelled"},{"sitc":"0544","name":"Tomatoes, fresh or chilled"},{"sitc":"0545","name":"Other fresh or chilled vegetables"},{"sitc":"05451","name":"Alliaceous vegetables, fresh or chilled"},{"sitc":"05459","name":"Vegetables, fresh or chilled, nes"},{"sitc":"0546","name":"Vegetables, frozen or in temporary preservative"},{"sitc":"05461","name":"Vegetables, preserved by freezing"},{"sitc":"05462","name":"Vegetables temporarily preserved, unfrozen"},{"sitc":"0548","name":"Vegetable products roots and tubers, nes, fresh, dried"},{"sitc":"05481","name":"Roots and tubers, with high starch or insulin, fresh or dried"},{"sitc":"05482","name":"Sugar beet, fresh or dried; sugar cane"},{"sitc":"05484","name":"Hop cones and lupulin"},{"sitc":"05488","name":"Vegetable products, primarily for human food, nes"},{"sitc":"056","name":"Vegetables, roots and tubers, prepared or preserved, nes"},{"sitc":"0561","name":"Vegetables (excluding leguminous), dried, evaporated, etc"},{"sitc":"0564","name":"Flour, meals and flakes of potatoes, fruit and vegetables, nes"},{"sitc":"05643","name":"Flour, meal and flakes of potato"},{"sitc":"05645","name":"Tapioca, sago and substitutes obtained from starches"},{"sitc":"05649","name":"Flours of leguminous, fruits, roots and tubers"},{"sitc":"0565","name":"Vegetables, prepared or preserved, nes"},{"sitc":"05651","name":"Vegetables and fruit, in vinegar or acetic acid"},{"sitc":"05659","name":"Vegetables prepared or preserved other than vinegar, nes"},{"sitc":"057","name":"Fruit and nuts, fresh, dried"},{"sitc":"0571","name":"Oranges, mandarins, etc, fresh or dried"},{"sitc":"05711","name":"Oranges, fresh or dried"},{"sitc":"05712","name":"Mandarins and similar citrus, fresh or dried"},{"sitc":"0572","name":"Other citrus fruits, fresh or dried"},{"sitc":"05721","name":"Lemons and limes, fresh or dried"},{"sitc":"05722","name":"Grapefruits, fresh or dried"},{"sitc":"05729","name":"Citrus fruit, nes, fresh or dried"},{"sitc":"0573","name":"Banana, plantain, fresh or dried"},{"sitc":"0574","name":"Apples, fresh"},{"sitc":"0575","name":"Grapes, fresh or dried"},{"sitc":"05751","name":"Grapes fresh"},{"sitc":"05752","name":"Grapes dried (raisins)"},{"sitc":"0576","name":"Figs, fresh or dried"},{"sitc":"0577","name":"Nuts edible, fresh or dried"},{"sitc":"05771","name":"Coconuts, fresh or dried (excluding copra)"},{"sitc":"05772","name":"Brazil nuts, fresh or dried"},{"sitc":"05773","name":"Cashew nuts, fresh or dried"},{"sitc":"05774","name":"Almonds, fresh or dried"},{"sitc":"05775","name":"Hazelnuts, fresh or dried"},{"sitc":"05779","name":"Edible nuts, fresh or dry, nes"},{"sitc":"0579","name":"Fruit, fresh or dried, nes"},{"sitc":"05792","name":"Pears and quinces, fresh"},{"sitc":"05793","name":"Stone fruit, nes, fresh"},{"sitc":"05794","name":"Berries, fresh"},{"sitc":"05795","name":"Pineapples, fresh or dried"},{"sitc":"05796","name":"Dates, fresh or dried"},{"sitc":"05797","name":"Avocados, mangoes, guavas, mangos-teens, fresh or dried"},{"sitc":"05798","name":"Other fresh fruit"},{"sitc":"05799","name":"Other dried fruit"},{"sitc":"058","name":"Fruit, preserved, and fruits preparations"},{"sitc":"0582","name":"Fruit, fruit-peel and parts of plants, preserved by sugar"},{"sitc":"0583","name":"Jams, jellies, marmalades, etc, as cooked preparations"},{"sitc":"0585","name":"Fruit or vegetable juices"},{"sitc":"05851","name":"Orange juice"},{"sitc":"05852","name":"Grapefruit juice"},{"sitc":"05853","name":"Juice of any other citrus fruit"},{"sitc":"05854","name":"Pineapple juice"},{"sitc":"05855","name":"Tomato juice"},{"sitc":"05857","name":"Juice of any other fruit or vegetable"},{"sitc":"05858","name":"Mixtures of fruit or vegetable juices"},{"sitc":"0586","name":"Fruit, temporarily preserved"},{"sitc":"05861","name":"Fruit, frozen without sugar"},{"sitc":"05862","name":"Fruit, frozen with sugar"},{"sitc":"05863","name":"Fruit temporarily preserved, unfrozen"},{"sitc":"05864","name":"Peel of melons or citrus fruit, fresh, frozen, dried etc"},{"sitc":"0589","name":"Fruit prepared or preserved, nes"},{"sitc":"05891","name":"Nuts, roasted (including peanut)"},{"sitc":"05899","name":"Fruit and nuts, prepared, preserved, nes"},{"sitc":"06","name":"Sugar, sugar preparations and honey"},{"sitc":"061","name":"Sugar and honey"},{"sitc":"0611","name":"Sugars, beet and cane, raw, solid"},{"sitc":"0612","name":"Refined sugar etc"},{"sitc":"0615","name":"Molasses"},{"sitc":"0616","name":"Natural honey"},{"sitc":"0619","name":"Sugars and syrups nes; artificial honey; caramel"},{"sitc":"062","name":"Sugar confectionery and preparations, non-chocolate"},{"sitc":"0620","name":"Sugar confectionery and preparations, non-chocolate"},{"sitc":"06201","name":"Sugar confectionery, non-chocolate. pre-1978"},{"sitc":"06202","name":"Flavoured sugars and molasses, non-fruit juices. pre-1978"},{"sitc":"07","name":"Coffee, tea, cocoa, spices, and manufactures thereof"},{"sitc":"071","name":"Coffee and coffee substitutes"},{"sitc":"0711","name":"Coffee green, roasted; coffee substitutes containing coffee"},{"sitc":"07111","name":"Coffee, not roasted; coffee husks and skins"},{"sitc":"07112","name":"Coffee, roasted"},{"sitc":"07113","name":"Coffee substitutes containing coffee"},{"sitc":"0712","name":"Coffee extracts, essences or concentrates"},{"sitc":"072","name":"Cocoa"},{"sitc":"0721","name":"Cocoa beans, raw, roasted"},{"sitc":"0722","name":"Cocoa powder, unsweetened"},{"sitc":"0723","name":"Cocoa butter and paste"},{"sitc":"07231","name":"Cocoa paste, whether or not defatted"},{"sitc":"07232","name":"Cocoa butter (fat or oil)"},{"sitc":"073","name":"Chocolate and other preparations containing cocoa, nes"},{"sitc":"0730","name":"Chocolate and other preparations containing cocoa, nes"},{"sitc":"074","name":"Tea and mate"},{"sitc":"0741","name":"Tea"},{"sitc":"0742","name":"Mate"},{"sitc":"075","name":"Spices"},{"sitc":"0751","name":"Pepper of \"piper\"; pimento of \"capsicum or pimenta\""},{"sitc":"0752","name":"Spices, except pepper and pimento"},{"sitc":"07521","name":"Vanilla"},{"sitc":"07522","name":"Cinnamon and cinnamon-tree flowers"},{"sitc":"07523","name":"Cloves"},{"sitc":"07524","name":"Nutmeg, mace, cardamoms"},{"sitc":"07525","name":"Seeds of anise, badian, coriander, cumin, etc"},{"sitc":"07526","name":"Ginger (except in sugar or in syrup)"},{"sitc":"07528","name":"Thyme, saffron, bay leaves; other spices"},{"sitc":"08","name":"Feeding stuff for animals (not including unmilled cereals)"},{"sitc":"081","name":"Feeding stuff for animals (not including unmilled cereals)"},{"sitc":"0811","name":"Hay and fodder, green or dry"},{"sitc":"08111","name":"Cereal straw and husks, unprepared"},{"sitc":"08112","name":"Mangolds, swedes, fodder roots, hay, etc"},{"sitc":"08119","name":"Products of vegetable origin for animal food, nes"},{"sitc":"0812","name":"Bran, sharps and other residues derives of cereals"},{"sitc":"08121","name":"Bran, sharps, etc, of maize or rice"},{"sitc":"08122","name":"Bran, sharps, etc, of other cereals"},{"sitc":"08123","name":"Bran, sharps, etc, of leguminous vegetables"},{"sitc":"0813","name":"Oilcake and other residues (except dregs)"},{"sitc":"08131","name":"-- of soya beans"},{"sitc":"08132","name":"-- of groundnuts"},{"sitc":"08133","name":"-- of cotton seeds"},{"sitc":"08134","name":"-- of linseed"},{"sitc":"08135","name":"-- of sunflower seeds"},{"sitc":"08136","name":"-- of rape or colza seed"},{"sitc":"08137","name":"-- of coconut (copra)"},{"sitc":"08138","name":"-- of palm nuts, kernels"},{"sitc":"08139","name":"-- of other oilseeds and oleaginous fruits"},{"sitc":"0814","name":"Flours and meals, of meat, fish,etc, unfit for human; greaves"},{"sitc":"08141","name":"Flours and meals of meat, fish, etc, unfit for human; greaves"},{"sitc":"08142","name":"Flours and meals of fish, crustacean, etc, unfit for human"},{"sitc":"0819","name":"Food waste and prepared animal feed, nes"},{"sitc":"08192","name":"Cocoa shells, husks, skin and waste"},{"sitc":"08193","name":"Beet-pulp, bagasse and other waste of sugar manufacture"},{"sitc":"08194","name":"Wine lees, argol"},{"sitc":"08199","name":"Sweetened forage; other preparation for animal feeding, nes"},{"sitc":"09","name":"Miscellaneous edible products and preparations"},{"sitc":"091","name":"Margarine and shortening"},{"sitc":"0913","name":"Lard, pig and poultry fat, rendered or solvent-extracted"},{"sitc":"0914","name":"Margarine, imitation lard and other prepared edible fats, nes"},{"sitc":"09141","name":"Margarine"},{"sitc":"09149","name":"Imitation lard and other prepared edible fats, nes"},{"sitc":"098","name":"Edible products and preparations, nes"},{"sitc":"0980","name":"Edible products and preparations, nes"},{"sitc":"09801","name":"Homogenized composite food preparations"},{"sitc":"09802","name":"Extracts, essences or concentrates of tea or mate"},{"sitc":"09803","name":"Mustard flour and prepared mustard"},{"sitc":"09804","name":"Sauces; mixed condiments and seasonings"},{"sitc":"09805","name":"Soups and broth, in liquid, solid or powder form"},{"sitc":"09806","name":"Natural yeast; prepared baking powders"},{"sitc":"09807","name":"Vinegar and substitutes for vinegar"},{"sitc":"09808","name":"Edible products of animal origin, nes"},{"sitc":"09809","name":"Food preparations, nes"},{"sitc":"1","name":"Beverages and tobacco"},{"sitc":"11","name":"Beverages"},{"sitc":"111","name":"Non-alcoholic beverages, nes"},{"sitc":"1110","name":"Non-alcoholic beverages, nes"},{"sitc":"11101","name":"Water, ice and snow"},{"sitc":"11102","name":"Flavored waters, and other non-alcoholic beverages, nes"},{"sitc":"112","name":"Alcoholic beverages"},{"sitc":"1121","name":"Wine of fresh grapes etc"},{"sitc":"11211","name":"Grape must, with fermentation arrested other than by alcohol"},{"sitc":"11212","name":"Wine of fresh grapes"},{"sitc":"11213","name":"Vermouth, other wines of fresh grapes with aromatic extracts"},{"sitc":"1122","name":"Other fermented beverages, nes (cider, perry, mead, etc)"},{"sitc":"1123","name":"Beer made from malt (including ale, stout and porter)"},{"sitc":"1124","name":"Distilled alcoholic beverages, nes"},{"sitc":"11241","name":"Whisky"},{"sitc":"11242","name":"Spirits obtained by distilling wine or grape marc"},{"sitc":"11249","name":"Other alcoholic beverages, nes"},{"sitc":"12","name":"Tobacco and tobacco manufactures"},{"sitc":"121","name":"Tobacco unmanufactured; tobacco refuse"},{"sitc":"1211","name":"Tobacco, not stripped"},{"sitc":"12111","name":"-- flue-cured, of the Virginia type"},{"sitc":"12119","name":"-- other than Virginia-type flue-cured"},{"sitc":"1212","name":"Tobacco, wholly or partly stripped"},{"sitc":"12121","name":"-- flue-cured, of the Virginia type"},{"sitc":"12129","name":"-- other than Virginia-type flue-cured"},{"sitc":"1213","name":"Tobacco refuse"},{"sitc":"122","name":"Tobacco, manufactured"},{"sitc":"1221","name":"Cigars, cheroots: cigarillos"},{"sitc":"1222","name":"Cigarettes"},{"sitc":"1223","name":"Tobacco, manufactured; tobacco extract and essences"},{"sitc":"2","name":"Crude materials, inedible, except fuels"},{"sitc":"21","name":"Hides, skins and furskins, raw"},{"sitc":"211","name":"Hides and skins, excluding furs, raw"},{"sitc":"2111","name":"Bovine and equine hides, raw, whether or not split"},{"sitc":"2112","name":"Calf skins, raw, whether or not split"},{"sitc":"2114","name":"Goat and kid skins, raw, whether or not split"},{"sitc":"2116","name":"Sheep and lamb skin with the wool on, raw, whether or not split"},{"sitc":"2117","name":"Sheep and lamb skin without the wool, raw, whether or not split"},{"sitc":"2119","name":"Hides and skins, nes; waste and used leather"},{"sitc":"21191","name":"Waste and used leather; leather dust, powder and flour"},{"sitc":"21199","name":"Hides and skins nes, raw, whether or not split"},{"sitc":"212","name":"Furskins, raw"},{"sitc":"2120","name":"Furskins, raw"},{"sitc":"21201","name":"Mink skins, raw"},{"sitc":"21209","name":"Other furskins, raw"},{"sitc":"22","name":"Oil seeds and oleaginous fruit"},{"sitc":"222","name":"Seeds and oleaginous fruit, whole or broken, for 'soft' fixed oil"},{"sitc":"2221","name":"Groundnuts, green"},{"sitc":"2222","name":"Soya beans"},{"sitc":"2223","name":"Cotton seeds"},{"sitc":"2224","name":"Sunflower seeds"},{"sitc":"2225","name":"Sesame seeds"},{"sitc":"2226","name":"Rape and colza seeds"},{"sitc":"223","name":"Seeds and oleaginous fruit, whole or broken, for other fixed oils"},{"sitc":"2231","name":"Copra"},{"sitc":"2232","name":"Palm nuts and kernels"},{"sitc":"2234","name":"Linseed"},{"sitc":"2235","name":"Castor oil seeds"},{"sitc":"2238","name":"Oil seeds and oleaginous fruits, nes"},{"sitc":"2239","name":"Flour or meals of oil seeds or oleaginous fruit, non-defatted"},{"sitc":"23","name":"Crude rubber (including synthetic and reclaimed)"},{"sitc":"232","name":"Natural rubber latex; rubber and gums"},{"sitc":"2320","name":"Natural rubber latex; natural rubber and gums"},{"sitc":"23201","name":"Natural rubber latex; pre-vulcanized natural rubber latex"},{"sitc":"23202","name":"Natural rubber (other than latex)"},{"sitc":"23203","name":"Balata, gutta-percha and similar natural gums"},{"sitc":"233","name":"Synthetic rubber, latex, etc; waste, scrap of unhardened rubber"},{"sitc":"2331","name":"Synthetic rubber, latex; factice derived from oils"},{"sitc":"23311","name":"Polybutadiene-styrene latex"},{"sitc":"23312","name":"Other synthetic rubber latex"},{"sitc":"23313","name":"Polybutadiene rubber (BR)"},{"sitc":"23314","name":"Polychlorobutadiene rubber (CR)"},{"sitc":"23315","name":"Polybutadiene-styrene rubber (SBR)"},{"sitc":"23316","name":"Butyl rubber (IIR)"},{"sitc":"23319","name":"Other synthetic rubbers, factice derived from oils"},{"sitc":"2332","name":"Reclaimed rubber, waste, scrap of unhardened rubber"},{"sitc":"23321","name":"Reclaimed rubber"},{"sitc":"23322","name":"Scraps, powders and waste of unhardened rubber"},{"sitc":"24","name":"Cork and wood"},{"sitc":"244","name":"Cork, natural, raw and waste"},{"sitc":"2440","name":"Cork, natural, raw and waste"},{"sitc":"24401","name":"Cork, natural, unworked, crushed or ground; waste cork"},{"sitc":"24402","name":"Cork, natural, in blocks, plates, sheets or strips"},{"sitc":"245","name":"Fuel wood and wood charcoal"},{"sitc":"2450","name":"Fuel wood and wood charcoal"},{"sitc":"24501","name":"Fuel wood, in logs, in billets, in twigs or in faggots"},{"sitc":"24502","name":"Wood charcoal, agglomerated or not"},{"sitc":"246","name":"Pulpwood (including chips and wood waste)"},{"sitc":"2460","name":"Pulpwood (including chips and wood waste)"},{"sitc":"24601","name":"Pulpwood in the round or quarter-split"},{"sitc":"24602","name":"Pulpwood in chips or particles"},{"sitc":"24603","name":"Wood waste (including sawdust)"},{"sitc":"247","name":"Other wood in the rough or roughly squared"},{"sitc":"2471","name":"Sawlogs and veneer logs, of coniferous species"},{"sitc":"24711","name":"-- in the rough"},{"sitc":"24712","name":"-- roughly or half squared"},{"sitc":"2472","name":"Sawlogs and veneer logs, of non-coniferous species"},{"sitc":"24721","name":"-- in the rough"},{"sitc":"24722","name":"-- roughly or half squared"},{"sitc":"2479","name":"Pitprops, poles, piling, post and other wood in the rough, nes"},{"sitc":"248","name":"Wood, simply worked, and railway sleepers of wood"},{"sitc":"2481","name":"Railway or tramway sleepers (ties) of wood"},{"sitc":"2482","name":"Wood of coniferous species, sawn, planed, tongued, grooved, etc"},{"sitc":"24821","name":"Wood of coniferous, sawn lengthwise, sliced or peeled"},{"sitc":"24822","name":"Wood of coniferous, planed, tongued, grooved, etc"},{"sitc":"2483","name":"Wood, non-coniferous species, sawn, planed, tongued, grooved, etc"},{"sitc":"24831","name":"Wood of non-coniferous, sawn lengthwise, sliced or peeled"},{"sitc":"24832","name":"Wood of non-coniferous, planed, tongued, grooved, etc"},{"sitc":"25","name":"Pulp and waste paper"},{"sitc":"251","name":"Pulp and waste paper"},{"sitc":"2511","name":"Waste paper and paperboard, etc"},{"sitc":"2512","name":"Mechanical wood pulp"},{"sitc":"2516","name":"Chemical wood pulp, dissolving grades"},{"sitc":"2517","name":"Chemical wood pulp, soda or sulphate"},{"sitc":"25171","name":"-- unbleached"},{"sitc":"25172","name":"-- bleached or semi-bleached (other than dissolving grades)"},{"sitc":"2518","name":"Chemical wood pulp, sulphite"},{"sitc":"25181","name":"-- unbleached"},{"sitc":"25182","name":"-- bleached or semi-bleached (non-dissolving grades)"},{"sitc":"2519","name":"Other cellulosic pulps"},{"sitc":"25191","name":"Semi-chemical wood pulp"},{"sitc":"25192","name":"Pulp, other than wood pulp"},{"sitc":"26","name":"Textile fibres (not wool tops) and their wastes (not in yarn)"},{"sitc":"261","name":"Silk"},{"sitc":"2613","name":"Raw silk (not thrown)"},{"sitc":"2614","name":"Silk worm cocoons and silk waste"},{"sitc":"26141","name":"Silk worm cocoons suitable for reeling"},{"sitc":"26142","name":"Silk waste, including cocoons unsuitable for reeling"},{"sitc":"263","name":"Cotton"},{"sitc":"2631","name":"Raw cotton, excluding linters, not carded or combed"},{"sitc":"2632","name":"Cotton linters"},{"sitc":"2633","name":"Cotton waste, not carded or combed"},{"sitc":"2634","name":"Cotton, carded or combed"},{"sitc":"264","name":"Jute, other textile bast fibres, nes, raw, processed but not spun"},{"sitc":"2640","name":"Jute, other textile bast fibres, nes, raw, processed but not spun"},{"sitc":"265","name":"Vegetable textile fibres, excluding cotton, jute, and waste"},{"sitc":"2651","name":"Flax and ramie, flax tow, ramie noils, and waste"},{"sitc":"26511","name":"Flax, raw or retted"},{"sitc":"26512","name":"Flax, broken, scutched, hackled, but not spun"},{"sitc":"26513","name":"Flax tow and waste"},{"sitc":"26514","name":"Ramie, raw or processed but not spun, its noils and waste"},{"sitc":"2652","name":"True hemp, raw or processed but not spun, its tow and waste"},{"sitc":"2654","name":"Sisal, agave fibres, raw or processed but not spun, and waste"},{"sitc":"2655","name":"Manila hemp, raw or processed but not spun, its tow and waste"},{"sitc":"2659","name":"Vegetable textile fibres, nes, and waste"},{"sitc":"26591","name":"Coir (coconut fibres) and coir waste"},{"sitc":"26599","name":"Other vegetable textile fibres, nes, and waste"},{"sitc":"266","name":"Synthetic fibres suitable for spinning"},{"sitc":"2665","name":"Discontinuous synthetic fibres, not carded or combed"},{"sitc":"26651","name":"-- polyamide"},{"sitc":"26652","name":"-- polyester"},{"sitc":"26653","name":"-- acrylic"},{"sitc":"26659","name":"-- other"},{"sitc":"2666","name":"Continuous filament tow for synthetic (discontinuous) fibres"},{"sitc":"26661","name":"-- of polyamide fibres"},{"sitc":"26662","name":"-- of polyester fibres"},{"sitc":"26663","name":"-- of acrylic fibres"},{"sitc":"26669","name":"-- of other synthetic fibres"},{"sitc":"2667","name":"Discontinuous synthetic fibres, carded or combed"},{"sitc":"26671","name":"-- polyamide"},{"sitc":"26672","name":"-- polyester"},{"sitc":"26673","name":"-- acrylic"},{"sitc":"26679","name":"-- other"},{"sitc":"267","name":"Other man-made fibres suitable for spinning, and waste"},{"sitc":"2671","name":"Regenerated fibre suitable for spinning"},{"sitc":"26711","name":"Discontinuous regenerated fibre, not carded or combed"},{"sitc":"26712","name":"Continuous filament tow for regenerated fibres (discontinuous)"},{"sitc":"26713","name":"Discontinuous regenerated fibres, carded or combed"},{"sitc":"2672","name":"Waste of man-made fibres, not carded or combed"},{"sitc":"26721","name":"-- synthetic"},{"sitc":"26722","name":"-- regenerated"},{"sitc":"268","name":"Wool and other animal hair (excluding tops)"},{"sitc":"2681","name":"Wool greasy or fleece-washed of sheep or lambs"},{"sitc":"2682","name":"Wool degreased, uncombed of sheep or lambs"},{"sitc":"2683","name":"Fine animal hair, not carded or combed"},{"sitc":"2685","name":"Horsehair and other coarse animal hair, not carded or combed"},{"sitc":"26851","name":"Horsehair and horsehair waste"},{"sitc":"26859","name":"Other coarse animal hair, not carded or combed, nes"},{"sitc":"2686","name":"Waste of sheep's or lambs' wool, or of other animal hair, nes"},{"sitc":"26861","name":"-- not pulled or garnetted"},{"sitc":"26862","name":"-- pulled or garnetted"},{"sitc":"2687","name":"Sheep's or lambs' wool, or of other animal hair, carded or combed"},{"sitc":"269","name":"Old clothing and other old textile articles; rags"},{"sitc":"2690","name":"Old clothing and other old textile articles; rags"},{"sitc":"26901","name":"Bulk textile waste, old clothing, traded in bulk or in bales"},{"sitc":"26902","name":"Rags, scrap twine, cordage, rope and cables etc"},{"sitc":"27","name":"Crude fertilizer and crude minerals"},{"sitc":"271","name":"Fertilizers, crude"},{"sitc":"2711","name":"Animal or vegetable fertilizer, crude"},{"sitc":"2712","name":"Natural sodium nitrate"},{"sitc":"2713","name":"Natural calcium phosphates, natural aluminium, etc"},{"sitc":"27131","name":"-- unground"},{"sitc":"27132","name":"-- ground"},{"sitc":"2714","name":"Potassium salts, natural, crude"},{"sitc":"273","name":"Stone, sand and gravel"},{"sitc":"2731","name":"Building and monumental (dimension) stone, roughly squared, split"},{"sitc":"27311","name":"Slate, roughly worked"},{"sitc":"27312","name":"Marble, travertine, building stone, etc, roughly worked"},{"sitc":"27313","name":"Granite, porphyry, basalt, sandstone, etc, roughly worked"},{"sitc":"2732","name":"Gypsum, plasters, limestone flux and calcareous stone"},{"sitc":"27322","name":"Limestone flux and calcareous stone"},{"sitc":"27323","name":"Gypsum and anhydrite"},{"sitc":"27324","name":"Calcined gypsum, and plasters with a basis of calcium sulphate"},{"sitc":"2733","name":"Sands, excluding metal-bearing sands"},{"sitc":"2734","name":"Pebbles, gravel, crushed or broken stone, etc"},{"sitc":"274","name":"Sulphur and unroasted iron pyrites"},{"sitc":"2741","name":"Sulphur (other than sublimed, precipitated or colloidal)"},{"sitc":"2742","name":"Iron pyrites, unroasted"},{"sitc":"277","name":"Natural abrasives, nes"},{"sitc":"2771","name":"Industrial diamonds"},{"sitc":"2772","name":"Other natural abrasives"},{"sitc":"27721","name":"Dust, powder of natural, synthetic precious or semiprecious stones"},{"sitc":"27722","name":"Pumice stone; emery; other natural abrasives, nes"},{"sitc":"278","name":"Other crude minerals"},{"sitc":"2782","name":"Clay and other refractory minerals, nes"},{"sitc":"27821","name":"Clay (excluding expanded clays), andalusite, kyanite, etc"},{"sitc":"27822","name":"Graphite, natural"},{"sitc":"27823","name":"Dolomite"},{"sitc":"27824","name":"Magnesium carbonate, natural"},{"sitc":"2783","name":"Common salt; pure sodium chloride; salt liquors; sea water"},{"sitc":"2784","name":"Asbestos"},{"sitc":"2785","name":"Quartz, mica, felspar, fluorspar, cryolite and chiolite"},{"sitc":"27851","name":"Natural quartz, quartzite"},{"sitc":"27852","name":"Mica; mica waste"},{"sitc":"27853","name":"Cryolite and chiolite, natural"},{"sitc":"27854","name":"Felspar, leucite, nepheline and nepheline syenite; fluorspar"},{"sitc":"2786","name":"Slag, scalings, dross and similar waste, nes"},{"sitc":"27861","name":"Slag, dross, etc, from iron or steel manufacture"},{"sitc":"27862","name":"Slag and ash, nes (including kelp)"},{"sitc":"2789","name":"Minerals, crude, nes"},{"sitc":"27891","name":"Chalk"},{"sitc":"27892","name":"Natural barium sulphate or carbonate"},{"sitc":"27893","name":"Talc, natural steatite"},{"sitc":"27894","name":"Crude natural borates and concentrates"},{"sitc":"27895","name":"Siliceous earths"},{"sitc":"27896","name":"Bitumen and asphalt, natural; bituminous shale; tar sands, etc"},{"sitc":"27899","name":"Mineral substances, nes"},{"sitc":"28","name":"Metalliferous ores and metal scrap"},{"sitc":"281","name":"Iron ore and concentrates"},{"sitc":"2814","name":"Roasted iron pyrites"},{"sitc":"2815","name":"Iron ore and concentrates, not agglomerated"},{"sitc":"2816","name":"Iron ore agglomerates"},{"sitc":"282","name":"Waste and scrap metal of iron or steel"},{"sitc":"2820","name":"Waste and scrap metal of iron or steel"},{"sitc":"28201","name":"-- of pig or cast iron"},{"sitc":"28202","name":"-- of alloy steel"},{"sitc":"28209","name":"-- of other iron or steel"},{"sitc":"286","name":"Ores and concentrates of uranium and thorium"},{"sitc":"2860","name":"Ores and concentrates of uranium and thorium"},{"sitc":"287","name":"Ores and concentrates of base metals, nes"},{"sitc":"2871","name":"Copper ore and concentrates; copper matte; cement copper"},{"sitc":"28711","name":"Copper ores and concentrates"},{"sitc":"28712","name":"Copper matte; cement copper"},{"sitc":"2872","name":"Nickel ores and concentrates; nickel mattes, etc"},{"sitc":"28721","name":"Nickel ores and concentrates"},{"sitc":"28722","name":"Nickel matte, sinters, etc"},{"sitc":"2873","name":"Aluminium ores and concentrates (including alumina)"},{"sitc":"28731","name":"Aluminium ore and concentrate"},{"sitc":"28732","name":"Alumina (aluminium oxide)"},{"sitc":"2874","name":"Lead ores and concentrates"},{"sitc":"2875","name":"Zinc ores and concentrates"},{"sitc":"2876","name":"Tin ores and concentrates"},{"sitc":"2877","name":"Manganese ore and concentrates"},{"sitc":"2879","name":"Ores and concentrates of other non-ferrous base metals"},{"sitc":"28791","name":"Chromium ore and concentrate"},{"sitc":"28792","name":"Tungsten ore and concentrate"},{"sitc":"28793","name":"Ores and concentrates of molybdenum, niobium, titanium, etc"},{"sitc":"28799","name":"Other base metal ore and concentrates, nes"},{"sitc":"288","name":"Non-ferrous base metal waste and scrap, nes"},{"sitc":"2881","name":"Ash and residues, nes"},{"sitc":"2882","name":"Other non-ferrous base metal waste and scrap, nes"},{"sitc":"28821","name":"Copper waste and scrap"},{"sitc":"28822","name":"Nickel waste and scrap"},{"sitc":"28823","name":"Aluminium waste and scrap"},{"sitc":"28824","name":"Lead waste and scrap"},{"sitc":"28825","name":"Zinc waste and scrap (other than dust)"},{"sitc":"28826","name":"Tin waste and scrap"},{"sitc":"289","name":"Ores and concentrates of precious metals, waste, scrap"},{"sitc":"2890","name":"Ores and concentrates of precious metals, waste, scrap"},{"sitc":"28901","name":"Ores and concentrates of precious metals"},{"sitc":"28902","name":"Precious metal, waste and scrap"},{"sitc":"29","name":"Crude animal and vegetable materials, nes"},{"sitc":"291","name":"Crude animal materials, nes"},{"sitc":"2911","name":"Bones, ivory, horns, coral, shells and similar products"},{"sitc":"29111","name":"Bone, horn-core, unworked, defatted, degelatinized, etc, and waste"},{"sitc":"29115","name":"Coral, shells, unworked or simply prepared, and waste"},{"sitc":"29116","name":"Ivory, tortoise-shell etc, unworked or simply prepared, and waste"},{"sitc":"2919","name":"Other materials of animal origin, nes"},{"sitc":"29191","name":"Human hair, unworked; waste of human hair"},{"sitc":"29192","name":"Brush-making hair, etc, and waste"},{"sitc":"29193","name":"Gut, bladders, and stomachs of animals (other than fish)"},{"sitc":"29194","name":"Fish waste"},{"sitc":"29196","name":"Skins and other parts of birds with feathers or down, etc, parts of"},{"sitc":"29197","name":"Natural sponges"},{"sitc":"29198","name":"Ambergris, civet, musk, etc, used for pharmaceutical products"},{"sitc":"29199","name":"Animal products, nes; dead animals unfit for human consumption"},{"sitc":"292","name":"Crude vegetable materials, nes"},{"sitc":"2922","name":"Natural gums, resins, lacs and balsams"},{"sitc":"2923","name":"Vegetable plaiting materials"},{"sitc":"2924","name":"Plants and parts of trees used in perfumery; in pharmacy; etc"},{"sitc":"2925","name":"Seeds, fruits and spores, nes, for planting"},{"sitc":"2926","name":"Live plants, bulbs, etc"},{"sitc":"29261","name":"Bulbs, tubers, corms and others; dormant, in growth or in flower"},{"sitc":"29269","name":"Other live plants"},{"sitc":"2927","name":"Cut flowers and foliage"},{"sitc":"29271","name":"Cut flowers and flower buds, fresh, dried, bleached etc"},{"sitc":"29272","name":"Cut foliage, fresh, dried, bleached etc"},{"sitc":"2929","name":"Other materials of vegetable origin, nes"},{"sitc":"29291","name":"Vegetable saps and extracts; agar-agar and other mucilages"},{"sitc":"29292","name":"Vegetable padding or stuffing materials"},{"sitc":"29293","name":"Vegetable materials for brushes or brooms"},{"sitc":"29298","name":"Vegetable materials and products, nes"},{"sitc":"3","name":"Mineral fuels, lubricants and related materials"},{"sitc":"32","name":"Coal, coke and briquettes"},{"sitc":"322","name":"Coal, lignite and peat"},{"sitc":"3221","name":"Anthracite, not agglomerated"},{"sitc":"3222","name":"Other coal, not agglomerated"},{"sitc":"3223","name":"Lignite, not agglomerated"},{"sitc":"3224","name":"Peat, not agglomerated"},{"sitc":"323","name":"Briquettes; coke and semi-coke; lignite or peat; retort carbon"},{"sitc":"3231","name":"Briquettes, ovoids, from coal, lignite or peat"},{"sitc":"32311","name":"Briquettes, ovoids and similar solid fuels of coal"},{"sitc":"32312","name":"Lignite, agglomerated"},{"sitc":"32313","name":"Peat, agglomerated"},{"sitc":"3232","name":"Coke and semi-coke of coal, of lignite or peat; retort carbon"},{"sitc":"32321","name":"Coke and semi-coke of coal; retort carbon"},{"sitc":"32322","name":"Coke and semi-coke of lignite or of peat"},{"sitc":"33","name":"Petroleum, petroleum products and related materials"},{"sitc":"333","name":"Crude petroleum and oils obtained from bituminous minerals"},{"sitc":"3330","name":"Crude petroleum and oils obtained from bituminous materials"},{"sitc":"334","name":"Petroleum products, refined"},{"sitc":"3341","name":"Gasoline and other light oils"},{"sitc":"33411","name":"Motor spirit, including aviation spirit"},{"sitc":"33412","name":"Spirit type jet fuel"},{"sitc":"33419","name":"Other light petroleum oils"},{"sitc":"3342","name":"Kerosene and other medium oils"},{"sitc":"33421","name":"Kerosene (including kerosene type jet fuel)"},{"sitc":"33429","name":"Other medium petroleum oil"},{"sitc":"3343","name":"Gas oils"},{"sitc":"3344","name":"Fuel oils, nes"},{"sitc":"3345","name":"Lubricating petroleum oils, and preparations, nes"},{"sitc":"33451","name":"Lubricating petroleum oils (high petroleum content) etc"},{"sitc":"33452","name":"Lubricating preparations (low petroleum content)"},{"sitc":"335","name":"Residual petroleum products, nes and related materials"},{"sitc":"3351","name":"Petroleum jelly and mineral waxes"},{"sitc":"33511","name":"Petroleum jelly"},{"sitc":"33512","name":"Mineral waxes"},{"sitc":"3352","name":"Mineral tars and products"},{"sitc":"33521","name":"Mineral tars"},{"sitc":"33522","name":"Benzole"},{"sitc":"33523","name":"Toluole"},{"sitc":"33524","name":"Xylole"},{"sitc":"33525","name":"Mineral tar oils etc, nes"},{"sitc":"3353","name":"Mineral tar pitch, pitch coke"},{"sitc":"33531","name":"Pitch from mineral tars"},{"sitc":"33532","name":"Pitch coke"},{"sitc":"3354","name":"Petroleum bitumen, petroleum coke and bituminous mixtures, nes"},{"sitc":"33541","name":"Petroleum bitumen, etc"},{"sitc":"33542","name":"Petroleum coke"},{"sitc":"33543","name":"Bituminous mixtures etc"},{"sitc":"34","name":"Gas, natural and manufactured"},{"sitc":"341","name":"Gas, natural and manufactured"},{"sitc":"3413","name":"Petroleum gases and other gaseous hydrocarbons, nes, liquefied"},{"sitc":"34131","name":"Liquefied propane and butane"},{"sitc":"34139","name":"Liquefied gaseous hydrocarbons, nes"},{"sitc":"3414","name":"Petroleum gases, nes, in gaseous state"},{"sitc":"3415","name":"Coal gas, water gas and similar gases"},{"sitc":"35","name":"Electric current"},{"sitc":"351","name":"Electric current"},{"sitc":"3510","name":"Electric current"},{"sitc":"4","name":"Animal and vegetable oils, fats and waxes"},{"sitc":"41","name":"Animal oils and fats"},{"sitc":"411","name":"Animal oils and fats"},{"sitc":"4111","name":"Fat and oils of fish and marine mammals"},{"sitc":"41111","name":"Fish liver oil"},{"sitc":"41112","name":"Fish oils and fats (other than fish liver oil)"},{"sitc":"41113","name":"Oils and fats of marine mammals"},{"sitc":"4113","name":"Animals oils, fats and greases, nes"},{"sitc":"41131","name":"Pig and poultry fat unrendered"},{"sitc":"41132","name":"Fats of bovine cattle, sheep or goats"},{"sitc":"41133","name":"Lard stearin and oils, etc"},{"sitc":"41134","name":"Wool grease and fatty substances derived therefrom"},{"sitc":"41139","name":"Animal oils and fats, nes"},{"sitc":"42","name":"Fixed vegetable oils and fats"},{"sitc":"423","name":"Fixed vegetable oils, soft, crude refined or purified"},{"sitc":"4232","name":"Soya bean oil"},{"sitc":"4233","name":"Cotton seed oil"},{"sitc":"4234","name":"Groundnut (peanut) oil"},{"sitc":"4235","name":"Olive oil"},{"sitc":"4236","name":"Sunflower seed oil"},{"sitc":"4239","name":"Other fixed vegetable oils, soft"},{"sitc":"42391","name":"Rape, colza and mustard oils"},{"sitc":"42392","name":"Sesame oil"},{"sitc":"424","name":"Other fixed vegetable oils, fluid or solid, crude, refined"},{"sitc":"4241","name":"Linseed oil"},{"sitc":"4242","name":"Palm oil"},{"sitc":"4243","name":"Coconut (copra) oil"},{"sitc":"4244","name":"Palm kernel oil"},{"sitc":"4245","name":"Castor oil"},{"sitc":"4249","name":"Fixed vegetable oils, nes"},{"sitc":"43","name":"Animal and vegetable oils and fats, processed, and waxes"},{"sitc":"431","name":"Animal and vegetable oils and fats, processed, and waxes"},{"sitc":"4311","name":"Processed animal and vegetable oils"},{"sitc":"4312","name":"Hydrogenated animal or vegetable oils and fats"},{"sitc":"4313","name":"Fatty acids, acid oils, and residues; degras"},{"sitc":"43131","name":"Fatty acids; acid oils from refining"},{"sitc":"43133","name":"Residues of treating fat; degras"},{"sitc":"4314","name":"Waxes of animal or vegetable origin"},{"sitc":"43143","name":"Vegetable waxes"},{"sitc":"43144","name":"Spermaceti, crude or refined; insect waxes"},{"sitc":"5","name":"Chemicals and related products, nes"},{"sitc":"51","name":"Organic chemicals"},{"sitc":"511","name":"Hydrocarbons, nes, and derivatives"},{"sitc":"5111","name":"Acyclic hydrocarbons"},{"sitc":"51111","name":"Ethylene"},{"sitc":"51112","name":"Propylene"},{"sitc":"51113","name":"Butylenes, butadienes and methylbutadienes"},{"sitc":"51119","name":"Other acyclic hydrocarbons"},{"sitc":"5112","name":"Cyclic hydrocarbons"},{"sitc":"51121","name":"Cyclohexane"},{"sitc":"51122","name":"Benzene, chemically pure"},{"sitc":"51123","name":"Toluene, chemically pure"},{"sitc":"51124","name":"Xylenes, chemically pure"},{"sitc":"51125","name":"Styrene"},{"sitc":"51126","name":"Ethylbenzene"},{"sitc":"51129","name":"Other cyclic hydrocarbons"},{"sitc":"5113","name":"Halogenated derivatives of hydrocarbons"},{"sitc":"51131","name":"Vinyl chloride (chloroethylene)"},{"sitc":"51132","name":"Trichloroethylene"},{"sitc":"51133","name":"Tetrachloroethylene (perchloroethylene)"},{"sitc":"51139","name":"Other halogenated derivatives of hydrocarbons"},{"sitc":"5114","name":"Hydrocarbons derivatives, nonhaloganeted"},{"sitc":"512","name":"Alcohols, phenols etc, and their derivatives"},{"sitc":"5121","name":"Acyclic alcohols, and their derivatives"},{"sitc":"51211","name":"Methyl alcohol (methanol)"},{"sitc":"51212","name":"Propanols"},{"sitc":"51213","name":"Butyl alcohols (butanols)"},{"sitc":"51214","name":"Octyl alcohols (octanols)"},{"sitc":"51215","name":"Ethylene glycol"},{"sitc":"51216","name":"Ethyl alcohol; denatured spirits"},{"sitc":"51217","name":"Fatty alcohols"},{"sitc":"51218","name":"Glycerol and glycerol lyes"},{"sitc":"51219","name":"Other acyclic alcohols, and their derivatives"},{"sitc":"5122","name":"Cyclic alcohols, and their derivatives"},{"sitc":"5123","name":"Phenols and phenol-alcohols, and their derivatives"},{"sitc":"51234","name":"Phenol pure, and its salts"},{"sitc":"51235","name":"Cresols, nes, and their salts"},{"sitc":"51236","name":"Other phenols and phenol-alcohols"},{"sitc":"51237","name":"Derivatives of phenol or phenol-alcohols"},{"sitc":"513","name":"Carboxylic acids, and their derivatives"},{"sitc":"5137","name":"Monocarboxylic acids and their derivatives"},{"sitc":"51371","name":"Acetic acid and its salts"},{"sitc":"51372","name":"Esters of acetic acid"},{"sitc":"51373","name":"Methacrylic acid and its salts and esters"},{"sitc":"51379","name":"Other monocarboxylic acids, and their derivatives"},{"sitc":"5138","name":"Polycarboxylic acids and their derivatives"},{"sitc":"51381","name":"Maleic anhydride"},{"sitc":"51382","name":"Phthalic anhydride"},{"sitc":"51383","name":"Dioctyl orthophthalates"},{"sitc":"51384","name":"Esters of terephthalic acid"},{"sitc":"51389","name":"Other polyacarboxylic acids, and their derivatives"},{"sitc":"5139","name":"Oxygen-function acids, and their derivatives"},{"sitc":"514","name":"Nitrogen-function compounds"},{"sitc":"5145","name":"Amine-function compounds"},{"sitc":"5146","name":"Oxygen-function amino-compounds"},{"sitc":"5147","name":"Amide-function compounds; excluding urea"},{"sitc":"5148","name":"Other nitrogen-function compounds"},{"sitc":"51481","name":"Quaternary ammonium salts and hydroxides; lecithin, etc"},{"sitc":"51482","name":"Carboxyimide and imide-function compounds"},{"sitc":"51483","name":"Acrylonitrile"},{"sitc":"51484","name":"Other nitrile-function compounds"},{"sitc":"51485","name":"Diazo-, azo-, azoxy-compounds"},{"sitc":"51486","name":"Organic derivatives of hydrazine or of hydroxylamine"},{"sitc":"51489","name":"Compounds with other nitrogen functions"},{"sitc":"515","name":"Organo-inorganic and heterocyclic compounds"},{"sitc":"5154","name":"Organo-sulphur compounds"},{"sitc":"5155","name":"Other organo-inorganic compounds"},{"sitc":"51551","name":"Organo-mercury compounds"},{"sitc":"51559","name":"Organo-inorganic compounds, nes"},{"sitc":"5156","name":"Heterocyclic compound; nucleic acids"},{"sitc":"51561","name":"Lactams"},{"sitc":"51569","name":"Other heterocyclic compounds; nucleic acids"},{"sitc":"5157","name":"Sulphonamides, sultones and sultams"},{"sitc":"51571","name":"Sulphonamides"},{"sitc":"51572","name":"Sultones and sultams"},{"sitc":"516","name":"Other organic chemicals"},{"sitc":"5161","name":"Ethers, epoxides, acetals"},{"sitc":"51611","name":"Ethers, ether-alcohol, etc, and their derivatives"},{"sitc":"51612","name":"Acetals, hemiacetals, etc, and their derivatives"},{"sitc":"51613","name":"Ethylene oxide (oxirane)"},{"sitc":"51614","name":"Propylene oxide"},{"sitc":"51619","name":"Other epoxides etc"},{"sitc":"5162","name":"Aldehyde, ketone and quinone-function compounds"},{"sitc":"51621","name":"Oxygen-function aldehyde"},{"sitc":"51622","name":"Oxygen-function aldehyde derivatives"},{"sitc":"51623","name":"Acetone"},{"sitc":"51624","name":"Ethyl methyl ketone"},{"sitc":"51629","name":"Other ketones etc, and their derivatives"},{"sitc":"5163","name":"Inorganic esters, their salts and derivatives"},{"sitc":"51631","name":"Phosphoric esters, their salts and derivatives"},{"sitc":"51639","name":"Other inorganic esters, their salts and derivatives"},{"sitc":"5169","name":"Organic chemicals, nes"},{"sitc":"51691","name":"Enzymes"},{"sitc":"51692","name":"Sugars, chemically pure etc, nes"},{"sitc":"51699","name":"Other organic compounds"},{"sitc":"52","name":"Inorganic chemicals"},{"sitc":"522","name":"Inorganic chemical elements, oxides and halogen salts"},{"sitc":"5221","name":"Chemical elements"},{"sitc":"52211","name":"Oxygen, nitrogen, hydrogen and rare gases"},{"sitc":"52212","name":"Selenium, tellurium, phosphorus, arsenic, silicon and boron"},{"sitc":"52213","name":"Chlorine"},{"sitc":"52214","name":"Fluorine, bromine and iodine"},{"sitc":"52215","name":"Sulphur, purified"},{"sitc":"52216","name":"Mercury"},{"sitc":"52217","name":"Alkali and alkaline-earth metals; rare earth metals"},{"sitc":"52218","name":"Carbon (including carbon black), nes"},{"sitc":"5222","name":"Inorganic acids and oxygen compounds of non-metals"},{"sitc":"52221","name":"Hydrochloric acid and chlorosulphuric acid"},{"sitc":"52222","name":"Sulphuric acid; oleum"},{"sitc":"52223","name":"Nitric acid; sulphonitric acids"},{"sitc":"52224","name":"Phosphorus pentoxide and phosphoric acids"},{"sitc":"52225","name":"Boric oxide and boric acid"},{"sitc":"52229","name":"Other inorganic acids and oxygen compounds of non-metals"},{"sitc":"5223","name":"Halogen and sulphur compounds of non-metals"},{"sitc":"52231","name":"Halogen compounds of non-metals"},{"sitc":"52232","name":"Sulphides of non-metals; phophorus trisulphide"},{"sitc":"5224","name":"Metallic oxides of zinc, iron, lead, chromium etc"},{"sitc":"52241","name":"Zinc oxide and zinc peroxide"},{"sitc":"52242","name":"Chromium oxide and hydroxides"},{"sitc":"52243","name":"Manganese oxides"},{"sitc":"52244","name":"Iron oxides and hydroxides"},{"sitc":"52245","name":"Cobalt oxides and hydroxides"},{"sitc":"52246","name":"Titanium oxides"},{"sitc":"52247","name":"Lead oxides"},{"sitc":"5225","name":"Inorganic bases and metallic oxides, hydroxides and peroxides"},{"sitc":"52251","name":"Ammonia, anhydrous, or in aqueous solution"},{"sitc":"52252","name":"Sodium hydroxide (caustic soda), solid"},{"sitc":"52253","name":"Sodium hydroxide in aqueous solution"},{"sitc":"52254","name":"Potassium hydroxide; peroxides of sodium or potassium"},{"sitc":"52255","name":"Oxides, hydroxides and peroxides of Mg, Sr and Ba"},{"sitc":"52256","name":"Aluminium hydroxide"},{"sitc":"52257","name":"Artificial corundum"},{"sitc":"52259","name":"Inorganic bases and metallic oxides, nes"},{"sitc":"523","name":"Other inorganic chemicals; compounds of precious metals"},{"sitc":"5231","name":"Metallic salts and peroxysalts of inorganic acids"},{"sitc":"52311","name":"Flourides and other complex fluorine salts"},{"sitc":"52312","name":"Chlorides, bromides, iodides, etc"},{"sitc":"52313","name":"Chlorites and hypochlorites"},{"sitc":"52314","name":"Chlorates, bromates, iodates, etc"},{"sitc":"52315","name":"Sulphides; polysulphides"},{"sitc":"52316","name":"Dithionite; sulphoxylates"},{"sitc":"52317","name":"Sulphites and thiosulphates"},{"sitc":"52318","name":"Sodium sulphate, sodium pyrosulphate, etc"},{"sitc":"52319","name":"Other sulphates and persulphates"},{"sitc":"5232","name":"Metallic salts and peroxysalts of inorganic acids"},{"sitc":"52321","name":"Nitrites and nitrates"},{"sitc":"52322","name":"Phosphites, hydrophosphites and phosphates"},{"sitc":"52323","name":"Neutral sodium carbonate"},{"sitc":"52324","name":"Carbonate nes, percabonate"},{"sitc":"52325","name":"Cyanides and complex cyanide"},{"sitc":"52326","name":"Fulminates, cyanates and thiocynates"},{"sitc":"52327","name":"Silicates"},{"sitc":"52328","name":"Borates and perborates"},{"sitc":"52329","name":"Salts and peroxysalts of inorganic acids, nes"},{"sitc":"5233","name":"Salts of metallic acids; compounds of precious metals"},{"sitc":"52331","name":"Salts of metallic acids"},{"sitc":"52332","name":"Colloidal, amalgams, salts etc, of precious metals,"},{"sitc":"5239","name":"Inorganic chemical products, nes"},{"sitc":"52391","name":"Hydrogen peroxide"},{"sitc":"52392","name":"Phosphides"},{"sitc":"52393","name":"Calcium carbide"},{"sitc":"52394","name":"Carbides (other than calcium carbide)"},{"sitc":"52395","name":"Hydrides, nitrides, etc"},{"sitc":"52399","name":"Other inorganic compounds, nes; amalgams; liquid air etc"},{"sitc":"524","name":"Radioactive and associated material"},{"sitc":"5241","name":"Radio-active chemical elements, isotopes etc"},{"sitc":"5249","name":"Other radio-active and associated materials"},{"sitc":"52491","name":"Isotopes and their compounds (other than those in heading 524.1)"},{"sitc":"52492","name":"Compounds of thorium, uranium, yttrium, scandium etc"},{"sitc":"53","name":"Dyeing, tanning and colouring materials"},{"sitc":"531","name":"Synthetic dye, natural indigo, lakes"},{"sitc":"5311","name":"Synthetic organic dyestuffs, etc, natural indigo and colour lakes"},{"sitc":"5312","name":"Synthetic organic luminophores, indigo, lakes"},{"sitc":"53121","name":"Synthetic organic luminophores etc; natural indigo"},{"sitc":"53122","name":"Colour lakes"},{"sitc":"532","name":"Dyeing and tanning extracts, and synthetic tanning materials"},{"sitc":"5322","name":"Dyeing, tanning extracts, tannins and their derivatives"},{"sitc":"53221","name":"Tanning extracts of vegetable origin; tannins"},{"sitc":"53222","name":"Dyeing extracts of vegetable or animal origin"},{"sitc":"5323","name":"Synthetic tanning substances; tanning preparations"},{"sitc":"533","name":"Pigments, paints, varnishes and related materials"},{"sitc":"5331","name":"Other colouring matter; inorganic products use as luminophores"},{"sitc":"5332","name":"Printing inks"},{"sitc":"5334","name":"Varnishes and lacquers; distempers etc"},{"sitc":"53341","name":"Water-thinned paints"},{"sitc":"53342","name":"Other paints, varnishes etc, nes"},{"sitc":"53343","name":"Pigments in paint or anamel media"},{"sitc":"53344","name":"Distempers, dyes etc, in forms or packings for retail"},{"sitc":"5335","name":"Glazes, driers, putty etc"},{"sitc":"53351","name":"Prepared pigments, glazes etc"},{"sitc":"53352","name":"Artists colours"},{"sitc":"53353","name":"Prepared driers"},{"sitc":"53354","name":"Putty, other fillings etc"},{"sitc":"54","name":"Medicinal and pharmaceutical products"},{"sitc":"541","name":"Medicinal and pharmaceutical products"},{"sitc":"5411","name":"Provitamins and vitamins"},{"sitc":"5413","name":"Antibiotics, not put up as medicaments"},{"sitc":"54131","name":"Penicillins and their derivatives"},{"sitc":"54132","name":"Streptomycins and their derivatives"},{"sitc":"54133","name":"Tetracyclines and their derivatives"},{"sitc":"54139","name":"Other antibiotics, not put up as medicaments"},{"sitc":"5414","name":"Vegetable alkaloids and derivatives, not put up as medicaments"},{"sitc":"5415","name":"Hormones, natural, or reproduce by synthesis, in bulk"},{"sitc":"54151","name":"Insulin"},{"sitc":"54152","name":"Pituitary and similar hormones"},{"sitc":"54153","name":"Adrenal cortical hormones"},{"sitc":"54159","name":"Other hormones, derivatives and other steroids etc"},{"sitc":"5416","name":"Glycosides, glands, antisera, vaccines and similar products"},{"sitc":"54161","name":"Glycosides and derivatives"},{"sitc":"54162","name":"Organo-therapeutic glands etc and extracts"},{"sitc":"54164","name":"Antisera and microbial vaccines"},{"sitc":"54165","name":"Toxins, microbial cultures and similar products"},{"sitc":"5417","name":"Medicaments (including veterinary medicaments)"},{"sitc":"54171","name":"-- containing antibiotics"},{"sitc":"54172","name":"-- containing hormones"},{"sitc":"54173","name":"-- containing alkaloids"},{"sitc":"54179","name":"-- containing other substances"},{"sitc":"5419","name":"Pharmaceutical goods, other than medicaments"},{"sitc":"54191","name":"Wadding, gauze, bandages prepared etc"},{"sitc":"54199","name":"Other pharmaceutical goods"},{"sitc":"55","name":"Oils and perfume materials; toilet and cleansing preparations"},{"sitc":"551","name":"Essential oils, perfume and flavour materials"},{"sitc":"5513","name":"Essential oil, resinoid, etc"},{"sitc":"5514","name":"Mixtures of odoriferous substances, used in perfumery, food etc"},{"sitc":"553","name":"Perfumery, cosmetics, toilet preparations, etc"},{"sitc":"5530","name":"Perfumery, cosmetics, toilet preparations, etc"},{"sitc":"554","name":"Soap, cleansing and polishing preparations"},{"sitc":"5541","name":"Soaps, organic products and preparations for use as soap"},{"sitc":"5542","name":"Organic surface-active agents, nes"},{"sitc":"5543","name":"Polishes and creams, for furniture, floors, footwear, metals etc"},{"sitc":"56","name":"Fertilizers, manufactured"},{"sitc":"562","name":"Fertilizers, manufactured"},{"sitc":"5621","name":"Mineral or chemical fertilizers, nitrogenous"},{"sitc":"56211","name":"Ammonium nitrate"},{"sitc":"56212","name":"Ammonium sulphonitrate"},{"sitc":"56213","name":"Ammonium sulphate"},{"sitc":"56214","name":"Calcium nitrate containing 16% or less by weight of nitrogen"},{"sitc":"56215","name":"Calcium cyanamide containing 25% or less by weight of nitrogen"},{"sitc":"56216","name":"Urea"},{"sitc":"56219","name":"Mineral or chemical fertilizers; nitrogenous, nes"},{"sitc":"5622","name":"Mineral or chemical fertilizers, phosphatic"},{"sitc":"56221","name":"Basic slag (Thomas slag)"},{"sitc":"56222","name":"Superphosphates"},{"sitc":"56229","name":"Mineral or chemical fertilize, phosphatic, nes"},{"sitc":"5623","name":"Mineral or chemical fertilizer, potassic"},{"sitc":"56231","name":"Potassium chloride"},{"sitc":"56232","name":"Potassium sulphate containing 52% or less by weight of K2O"},{"sitc":"56239","name":"Mineral or chemical fertilizer, potassic, nes"},{"sitc":"5629","name":"Fertilizers, nes"},{"sitc":"56291","name":"Nitrogen-phosphorus-potassium fertilizer, nes"},{"sitc":"56292","name":"Nitrogen-phosphorus fertilizer, nes"},{"sitc":"56293","name":"Nitrogen-potassium fertilizer, nes"},{"sitc":"56299","name":"Other fertilizers, nes"},{"sitc":"57","name":"Explosives and pyrotechnic products"},{"sitc":"572","name":"Explosives and pyrotechnic products"},{"sitc":"5721","name":"Propellent powders and other prepared explosives"},{"sitc":"57211","name":"Propellent powders"},{"sitc":"57212","name":"Prepared explosives (other than propellent powders)"},{"sitc":"5722","name":"Fuses, caps, igniters, detonators"},{"sitc":"5723","name":"Pyrotechnic articles"},{"sitc":"58","name":"Artificial resins and plastic materials, and cellulose esters etc"},{"sitc":"582","name":"Condensation, polycondensation and polyaddition products"},{"sitc":"5821","name":"Phenoplasts"},{"sitc":"58211","name":"-- in primary forms"},{"sitc":"58212","name":"-- in the form of plates, film, sheets, foil or strip"},{"sitc":"58219","name":"-- in other forms (including waste and scrap)"},{"sitc":"5822","name":"Aminoplasts"},{"sitc":"58221","name":"-- in primary forms"},{"sitc":"58222","name":"-- in the form of plates, film, sheets, foil or strip"},{"sitc":"58229","name":"-- in other forms (including waste and scrap)"},{"sitc":"5823","name":"Alkyds and other polyesters"},{"sitc":"58231","name":"-- in primary forms"},{"sitc":"58232","name":"-- in the forms of plates, film, sheets, foil or strip"},{"sitc":"58239","name":"-- in other forms (including waste and scrap)"},{"sitc":"5824","name":"Polyamides"},{"sitc":"58241","name":"-- in primary forms"},{"sitc":"58242","name":"-- in the forms of plates, film, sheets, foil or strip"},{"sitc":"58249","name":"-- in other forms (including waste and scrap)"},{"sitc":"5825","name":"Polyurethanes"},{"sitc":"58251","name":"-- in primary forms"},{"sitc":"58259","name":"-- in other forms (including waste and scrap)"},{"sitc":"5826","name":"Epoxide resins"},{"sitc":"58261","name":"-- in primary forms"},{"sitc":"58269","name":"-- in other forms (including waste and scrap)"},{"sitc":"5827","name":"Silicones"},{"sitc":"5828","name":"Ion exchangers of the condensation, polycondensation etc"},{"sitc":"5829","name":"Other condensation, polycodensation or polyaddition products"},{"sitc":"583","name":"Polymerization and copolymerization products"},{"sitc":"5831","name":"Polyethylene"},{"sitc":"58311","name":"-- in primary forms"},{"sitc":"58312","name":"-- in the form of monofil, tubes, rods, sticks or profile shapes"},{"sitc":"58313","name":"-- in the form of plates, sheets, film, foil or strip"},{"sitc":"58319","name":"-- in the form of waste and scrap"},{"sitc":"5832","name":"Polypropylene"},{"sitc":"58321","name":"-- in primary forms"},{"sitc":"58322","name":"-- in the form of plates, sheets, film, foil or strip"},{"sitc":"58329","name":"-- in other forms (including waste and scrap)"},{"sitc":"5833","name":"Polystyrene and its copolymers"},{"sitc":"58331","name":"-- in primary forms"},{"sitc":"58332","name":"-- in the form of monofil, tubes, rods, sticks or profile shapes"},{"sitc":"58333","name":"-- in the form of plates, sheets, film, foil or strip"},{"sitc":"58339","name":"-- in the form of waste and scrap"},{"sitc":"5834","name":"Polyvinyl chloride"},{"sitc":"58341","name":"-- in primary forms"},{"sitc":"58342","name":"-- in the form of monofil, tubes, rods, sticks or profile shapes"},{"sitc":"58343","name":"-- in the form of plates, sheets, strip, film or foil"},{"sitc":"58349","name":"-- in the form of waste and scrap"},{"sitc":"5835","name":"Copolymers of vinyl chloride and vinyl acetate"},{"sitc":"58351","name":"-- in primary forms"},{"sitc":"58352","name":"-- in the form of monofil, tubes, rods, sticks or profile shapes"},{"sitc":"58353","name":"-- in the form of plates, sheets, strip, film or foil"},{"sitc":"58359","name":"-- in the form of waste and scrap"},{"sitc":"5836","name":"Acrylic and methaacrylic polymers; acrylo-methacrylic copolymers"},{"sitc":"58361","name":"-- in primary forms"},{"sitc":"58362","name":"-- in the form of plates, sheets, strip, film or foil"},{"sitc":"58369","name":"-- in other forms (including waste and scrap)"},{"sitc":"5837","name":"Polyvinyl acetate"},{"sitc":"5838","name":"Ion exchangers of the polymerization or copolymerization type"},{"sitc":"5839","name":"Other polymerization and copolymarization products"},{"sitc":"584","name":"Regenerated cellulose; derivatives of cellulose; vulcanized fibre"},{"sitc":"5841","name":"Regenerated cellulose"},{"sitc":"5842","name":"Cellulose nitrates"},{"sitc":"58421","name":"-- non-plasticized"},{"sitc":"58422","name":"-- plasticized"},{"sitc":"5843","name":"Cellulose acetates"},{"sitc":"58431","name":"-- non-plasticized"},{"sitc":"58432","name":"-- plasticized"},{"sitc":"5849","name":"Other chemical derivatives of cellulose; vulcanized fibre"},{"sitc":"58491","name":"Other chemical derivatives of cellulose, non-plasticized"},{"sitc":"58492","name":"Other chemical derivatives of cellulose, plasticized"},{"sitc":"58493","name":"Vulcanized fibre"},{"sitc":"585","name":"Other artificial resins and plastic materials"},{"sitc":"5851","name":"Modified natural resins etc; derivatives of natural rubber"},{"sitc":"5852","name":"Other artificial plastic materials, nes"},{"sitc":"58521","name":"Hardened proteins"},{"sitc":"58522","name":"Alginic acid its salts and esters"},{"sitc":"58529","name":"Other high polymers etc, nes; linoxyn"},{"sitc":"59","name":"Chemical materials and products, nes"},{"sitc":"591","name":"Pesticides, disinfectants"},{"sitc":"5911","name":"Insecticides, for sale by retail or as preparations"},{"sitc":"5912","name":"Fungicides, for sale by retail or as preparation"},{"sitc":"5913","name":"Herbicides, for sale by retail or as preparation"},{"sitc":"5914","name":"Disinfectants, etc, for sale by retail or as preparation"},{"sitc":"59141","name":"Disinfectants, for sale by retail or as preparation"},{"sitc":"59149","name":"Anti-sprouting products, rat poisons etc for sale by retail"},{"sitc":"592","name":"Starches, insulin and wheat gluten; albuminoidal substances; glues"},{"sitc":"5921","name":"Starches, insulin and wheat gluten"},{"sitc":"59211","name":"Starches, inulin"},{"sitc":"59212","name":"Wheat gluten, whether or not dried"},{"sitc":"5922","name":"Albuminoid substances; glues"},{"sitc":"59221","name":"Casein, caseinates and other casein derivatives; casein glues"},{"sitc":"59222","name":"Albumins, albuminates and other albumin derivatives"},{"sitc":"59223","name":"Gelatin and derivatives; glues derived from bones etc; isinglass"},{"sitc":"59224","name":"Protein and derivatives; hide powder"},{"sitc":"59225","name":"Dextrin; starch glues; soluble or roasted starches"},{"sitc":"59229","name":"Prepared glues, nes; products use as glues, for sale by retail"},{"sitc":"598","name":"Miscellaneous chemical products, nes"},{"sitc":"5981","name":"Woods and resin-based chemical products"},{"sitc":"59811","name":"Tall oil"},{"sitc":"59812","name":"Concentrated sulphite lye"},{"sitc":"59813","name":"Spirits of turpentine; crude dipentene; sulphite turpentene etc"},{"sitc":"59814","name":"Rosin and resin acids, and derivatives; rosin spirits and oils"},{"sitc":"59819","name":"Wood tar and oils; vegetable pitch; acetone oil, etc"},{"sitc":"5982","name":"Anti-knock preparation, anti-corrosive; viscosity improvers; etc"},{"sitc":"5983","name":"Organic chemical products, nes"},{"sitc":"59831","name":"Artificial waxes; prepared waxes, not emulsified or with solvents"},{"sitc":"59832","name":"Artificial graphite; colloidal graphite"},{"sitc":"59833","name":"Prepared rubber accelerators"},{"sitc":"5989","name":"Chemical products and preparations, nes"},{"sitc":"59891","name":"Prepared glazings, dressings and mordants"},{"sitc":"59892","name":"Activated natural mineral products; activated carbon; animal black"},{"sitc":"59893","name":"Prepared culture media for development of micro-organisms"},{"sitc":"59894","name":"Preparations and charges for fire extinguishers"},{"sitc":"59895","name":"Modelling pastes; \"dental wax\" or \"dental impression compounds\""},{"sitc":"59896","name":"Pickling preparations for metal surfaces; fluxes, etc"},{"sitc":"59897","name":"Composite solvents and thinners for varnishes, etc"},{"sitc":"59898","name":"Compound catalysts"},{"sitc":"59899","name":"Other chemical products and preparations, nes"},{"sitc":"6","name":"Manufactured goods classified chiefly by materials"},{"sitc":"61","name":"Leather, leather manufactures, nes, and dressed furskins"},{"sitc":"611","name":"Leather"},{"sitc":"6112","name":"Composition leather, in slabs, sheets or rolls"},{"sitc":"6113","name":"Calf leather"},{"sitc":"6114","name":"Leather of other bovine cattle and equine leather"},{"sitc":"6115","name":"Sheep and lamb skin leather"},{"sitc":"6116","name":"Leather of other hides or skins"},{"sitc":"61161","name":"Goat and kid skin leather"},{"sitc":"61169","name":"Leather, nes"},{"sitc":"6118","name":"Leather, specially dressed or finished, nes"},{"sitc":"61181","name":"Chamois-dressed leather"},{"sitc":"61182","name":"Parchment-dressed leather pre-1978"},{"sitc":"61183","name":"Patent leather and imitation patent leather; metallized leather"},{"sitc":"612","name":"Manufactures of leather or of composition leather, nes; etc"},{"sitc":"6121","name":"Articles of leather use in machinery or mechanical appliances, etc"},{"sitc":"6122","name":"Saddlery and harness, of any material, for any kind of animal"},{"sitc":"6123","name":"Parts of footwear of any material except metal and asbestos"},{"sitc":"6129","name":"Other articles of leather or of composition leather"},{"sitc":"613","name":"Furskins, tanned or dressed; pieces of furskin, tanned or dressed"},{"sitc":"6130","name":"Furskins, tanned or dressed; pieces of furskin, tanned or dressed"},{"sitc":"62","name":"Rubber manufactures, nes"},{"sitc":"621","name":"Materials of rubber"},{"sitc":"6210","name":"Materials of rubber"},{"sitc":"62101","name":"Plates, sheets and strip, nes, of unvulcanized rubber"},{"sitc":"62102","name":"Unvulcanized rubber, in other forms; articles etc"},{"sitc":"62103","name":"Vulcanized rubber thread and cord"},{"sitc":"62104","name":"Plates, sheets, strip, rods, etc, of unhardened vulcanized rubber"},{"sitc":"62105","name":"Piping and tubing, of unhardened vulcanized rubber"},{"sitc":"62106","name":"Hardened rubber, in bulk, plates etc; scrap of hardened rubber"},{"sitc":"625","name":"Rubber tires, tire cases, inner and flaps, for wheels of all kinds"},{"sitc":"6251","name":"Tires, pneumatic, new, for motor cars"},{"sitc":"6252","name":"Tires, pneumatic, new, for buses and lorries"},{"sitc":"6253","name":"Tires, pneumatic, new, for aircraft"},{"sitc":"6254","name":"Tires, pneumatic, new, for motorcycles and bicycles"},{"sitc":"6259","name":"Other tires, tire cases, tire flaps and inner tubes, etc"},{"sitc":"62591","name":"Inner tubes"},{"sitc":"62599","name":"Tires, nes, tire cases, interchangeable tire treads and tire flaps"},{"sitc":"628","name":"Articles of rubber, nes"},{"sitc":"6281","name":"Hygienic, pharmaceutical articles of unhardened vulcanized rubber"},{"sitc":"6282","name":"Transmission, conveyor or elevator belts, of vulcanized rubber"},{"sitc":"6289","name":"Other articles of rubber, nes"},{"sitc":"62898","name":"Articles of unhardened rubber, nes"},{"sitc":"62899","name":"Articles of hardened rubber, nes"},{"sitc":"63","name":"Cork and wood, cork manufactures"},{"sitc":"633","name":"Cork manufactures"},{"sitc":"6330","name":"Cork manufactures"},{"sitc":"63301","name":"Articles of natural cork"},{"sitc":"63302","name":"Agglomerated cork and articles of agglomerated cork"},{"sitc":"634","name":"Veneers, plywood, \"improved\" wood and other wood, worked, nes"},{"sitc":"6341","name":"Wood sawn lengthwise, veneer sheets etc, up to 5 mm in thickness"},{"sitc":"6342","name":"Plywood consisting solely of sheets of wood"},{"sitc":"6343","name":"Improved wood and reconstituted wood"},{"sitc":"63431","name":"Improved wood, in sheets, blocks or the like"},{"sitc":"63432","name":"Reconstituted wood, in sheets, blocks or the like"},{"sitc":"6344","name":"Wood-based panels, nes"},{"sitc":"63441","name":"Blockboard, laminboard, and similar laminated wood products"},{"sitc":"63442","name":"Inlaid wood and wood marquetry"},{"sitc":"63443","name":"Cellular wood panels"},{"sitc":"6349","name":"Wood, simply shaped, nes"},{"sitc":"63491","name":"Hoopwood; split poles; wooden sticks; chipwood; etc"},{"sitc":"63492","name":"Wooden beadings and mouldings"},{"sitc":"63493","name":"Wood wool and wood flour"},{"sitc":"635","name":"Wood manufactures, nes"},{"sitc":"6351","name":"Wood packing cases, boxes, cases, crates, etc, complete"},{"sitc":"6352","name":"Casks, barrels; other coopers products and parts, including staves"},{"sitc":"6353","name":"Builders` carpentry and joinery (including prefabricated)"},{"sitc":"6354","name":"Manufactures of wood for domestic or decorative use"},{"sitc":"63541","name":"Wooden picture frames, mirror frames and the like"},{"sitc":"63542","name":"Household utensils of wood"},{"sitc":"63549","name":"Lamps, caskets, trays, and other articles of woods, domestic"},{"sitc":"6359","name":"Manufactured articles of wood, nes"},{"sitc":"63591","name":"Wooden tools, tool bodies, handles, broom etc; boot and shoe lasts"},{"sitc":"63592","name":"Spools, cops, bobbins, sewing thread reels, etc, of turned wood"},{"sitc":"63599","name":"Other articles of wood, nes"},{"sitc":"64","name":"Paper, paperboard, and articles of pulp, of paper or of paperboard"},{"sitc":"641","name":"Paper and paperboard"},{"sitc":"6411","name":"Newsprint"},{"sitc":"6412","name":"Printing paper and writing paper, in rolls or sheets"},{"sitc":"64121","name":"-- uncoated"},{"sitc":"64122","name":"-- coated, impregnated, surface-coloured, decorated or printed"},{"sitc":"6413","name":"Kraft paper and paperboard, in rolls or sheets"},{"sitc":"64131","name":"Kraft liner, in rolls or sheets"},{"sitc":"64132","name":"Sack Kraft paper, in rolls or sheets"},{"sitc":"64139","name":"Kraft paper and paperboard, in rolls or sheets, nes"},{"sitc":"6415","name":"Paper and paperboard, in rolls or sheets, nes"},{"sitc":"64151","name":"Semi-chemical fluting paper, in rolls or sheets"},{"sitc":"64152","name":"Sulphite wrapping paper, in roll or sheets"},{"sitc":"64153","name":"Greaseproof paper and paperboard, etc, in rolls or sheets"},{"sitc":"64159","name":"Other paper and paperboard, in rolls or sheets, nes"},{"sitc":"6416","name":"Fibre building board of wood or other vegetable material"},{"sitc":"64161","name":"-- compressed (hardboard)"},{"sitc":"64162","name":"-- non-compressed (insulating board, etc)"},{"sitc":"6417","name":"Paper and paperboard, creped, crinkled, etc, in rolls or sheets"},{"sitc":"64171","name":"Kraft paper, creped or crinkled, in rolls or sheet"},{"sitc":"64172","name":"Paper, creped or crinkled, for household use, in rolls or sheets"},{"sitc":"64173","name":"Other creped or crinkled paper, in rolls or sheets"},{"sitc":"64174","name":"Paper and paperboard, corrugated, in rolls or sheets"},{"sitc":"6418","name":"Paper and paperboard, coated, impregnated, etc, in rolls or sheets"},{"sitc":"64181","name":"Paper, etc, coated with artificial resins, in rolls or sheets"},{"sitc":"64182","name":"Paper and paperboard, tarred, asphalted, etc, in rolls or sheets"},{"sitc":"64189","name":"Paper and paperboard, coated, etc, nes, in rolls or sheets"},{"sitc":"6419","name":"Converted paper and paperboard, nes"},{"sitc":"64192","name":"Composite paper and paperboard not coated, etc, in rolls or sheets"},{"sitc":"64196","name":"Filter blocks, slabs and plates, of paper pulp"},{"sitc":"64197","name":"Wallpaper and lincrusta; window transparencies of paper"},{"sitc":"642","name":"Paper and paperboard, precut, and articles of paper or paperboard"},{"sitc":"6421","name":"Packing containers, box files, etc, of paper, used in offices"},{"sitc":"6422","name":"Correspondence stationary"},{"sitc":"6423","name":"Registers, exercise books, file and book covers, etc, of paper"},{"sitc":"6424","name":"Paper and paperboard cut to size or shape, nes"},{"sitc":"64241","name":"Cigarette paper, precut, in booklets or tubes"},{"sitc":"64242","name":"Copying papers and transfer papers cut to size"},{"sitc":"64243","name":"Toilet paper cut to size, in rolls or in sheets"},{"sitc":"64244","name":"Gummed or adhesive paper in strip or rolls"},{"sitc":"64249","name":"Other paper and paperboard, cut to size or shape, nes"},{"sitc":"6428","name":"Articles of paper pulp, paper, paperboard or cellulose wadding, nes"},{"sitc":"64281","name":"Bobbins, spools, etc of paper pulp, paper or paperboard"},{"sitc":"64282","name":"Cards for punched-card machines"},{"sitc":"64283","name":"Trays, dishes, cups, etc, of paper pulp, paper or paperboard"},{"sitc":"64284","name":"Paper tissues, towels, bed sheets, etc; paper under garments"},{"sitc":"64285","name":"Sanitary towels and tampons; diapers, of paper or cellulose wadding"},{"sitc":"64289","name":"Other articles of paper pulp, paper, cellulose wadding, etc, nes"},{"sitc":"65","name":"Textile yarn, fabrics, made-up articles, nes, and related products"},{"sitc":"651","name":"Textile yarn"},{"sitc":"6511","name":"Silk yarn and spun from noil or waste; silkworm gut"},{"sitc":"65111","name":"Silk yarn (other than waste) not put up for retail sale"},{"sitc":"65116","name":"Yarn spun from noil or other waste of silk, not for retail sale"},{"sitc":"65117","name":"Silk yarn, spun from silk waste, for retail; silkworm gut"},{"sitc":"6512","name":"Yarn of wool or animal hair (including wool tops)"},{"sitc":"65121","name":"Wool tops"},{"sitc":"65122","name":"Carded sheep's or lambs' wool (woolen yarn), not for retail sale"},{"sitc":"65123","name":"Combed sheep's or lambs' wool (worsted yarn), not for retail sale"},{"sitc":"65124","name":"Fine hair yarn (carded or combed), not for retail sale"},{"sitc":"65125","name":"Coarse hair yarn, not for retail sale"},{"sitc":"65126","name":"Yarn of sheep's or lamb's wool or of fine animal hair, for retail"},{"sitc":"65127","name":"Yarn of carded sheep's or lamb's wool, blended, not for retail"},{"sitc":"65128","name":"Yarn of combed sheep's or lamb's wool, blended, not for retail"},{"sitc":"65129","name":"Wool etc blend yarn for retail"},{"sitc":"6513","name":"Cotton yarn"},{"sitc":"65131","name":"-- measuring, per single yarn, 14 km/kg or less, not for retail"},{"sitc":"65132","name":"-- measuring, per single yarn, from 14 to 40 km/kg, not for retail"},{"sitc":"65133","name":"-- measuring, per single yarn, from 40 but less 80km/kg, non retail"},{"sitc":"65134","name":"-- measuring, per single yarn, 80 km/kg or more, not for retail"},{"sitc":"65135","name":"-- put up for retail sale"},{"sitc":"6514","name":"Yarn 85% of synthetic fibres, not for retail; monofil, strip, etc"},{"sitc":"65141","name":"-- textured, of continuous polyamide"},{"sitc":"65142","name":"-- nontextured of continuous polyamide, from non to 50 turns per mt"},{"sitc":"65143","name":"-- other non-textured yarns of continuous polyamide"},{"sitc":"65144","name":"-- textured, of continuous polyester"},{"sitc":"65145","name":"-- nontextured of continuous polyester, from non to 50 turns per mt"},{"sitc":"65146","name":"-- other non-textured yarns of continuous polyester"},{"sitc":"65147","name":"-- of other continuous synthetic fibres"},{"sitc":"65148","name":"-- of discontinuous synthetic fibres"},{"sitc":"65149","name":"-- monofil, strip and imitation catgut"},{"sitc":"6515","name":"Yarn containing 85% or more of synthetic fibres, put up for retail"},{"sitc":"65151","name":"-- of continuous fibres"},{"sitc":"65152","name":"-- of discontinuous fibres"},{"sitc":"6516","name":"Yarn containing less than 85% of discontinuous synthetic fibres"},{"sitc":"65166","name":"-- mixed mainly or solely with cotton, not for retail"},{"sitc":"65167","name":"-- mixed mainly with wool, fine animal hair, etc, not for retail"},{"sitc":"65168","name":"-- mixed with other than wool, cotton, etc, not put for retail"},{"sitc":"65169","name":"-- put up for retail sale"},{"sitc":"6517","name":"Yarn of regenerated fibres, not for retail, monofil, strip, etc"},{"sitc":"65171","name":"Yarn of continuous viscose rayon"},{"sitc":"65172","name":"Yarn of continuous acetate fibres"},{"sitc":"65173","name":"Yarn of other continuous regenerated textile fibres"},{"sitc":"65174","name":"Yarn with 85% or more of discontinuous regenerated fibres"},{"sitc":"65175","name":"Yarn with less than 85% discontinuous regenerated fibres/cotton"},{"sitc":"65176","name":"Yarn with less than 85% discontinuous regenerated fibres/wool, etc"},{"sitc":"65177","name":"Other discontinuous regenerated blend yarn"},{"sitc":"65178","name":"Monofil, strip and imitation catgut, of regenerated fibre materials"},{"sitc":"6518","name":"Yarn of regenerated fibres, put up for retail sale"},{"sitc":"65181","name":"-- of continuous fibres"},{"sitc":"65182","name":"-- of discontin fibres"},{"sitc":"6519","name":"Yarn of textile fibres, nes"},{"sitc":"65191","name":"Metallized yarn, being textile yarn spun with metal"},{"sitc":"65195","name":"Yarn, slivers and roving of glass fibre"},{"sitc":"65196","name":"Flax or ramie yarn not put up for retail sale"},{"sitc":"65197","name":"Flax or ramie yarn put up for retail sale"},{"sitc":"65198","name":"Yarn of jute or of other textile bast fibres of heading 264.0"},{"sitc":"65199","name":"Yarn of other vegetable textile fibres, nes; paper yarn"},{"sitc":"652","name":"Cotton fabrics, woven (not including narrow or special fabrics)"},{"sitc":"6521","name":"Cotton fabrics, woven, unbleached, not mercerized"},{"sitc":"65211","name":"Cotton gauze, unbleached, not mercerized"},{"sitc":"65212","name":"Terry fabrics, of cotton, unbleached, not mercerized"},{"sitc":"65214","name":"Other woven fabrics with 85% or more of grey cotton, not mercerized"},{"sitc":"65215","name":"Other woven cotton fabrics, less 85% of grey cotton, not mercerized"},{"sitc":"6522","name":"Cotton fabrics, woven, bleached, dyed, etc, or otherwise finished"},{"sitc":"65221","name":"Cotton gauze, bleached, dyed, printed, etc, or otherwise finished"},{"sitc":"65222","name":"Terry fabrics, of cotton, bleached, etc, or otherwise finished"},{"sitc":"65223","name":"Pile and chenille fabrics, woven, of cotton (no terry fabrics)"},{"sitc":"65224","name":"Other woven fabrics, 85% plus of cotton, bleached, etc, finished"},{"sitc":"65225","name":"Other woven fabrics, less 85% of cotton, bleached, etc, finished"},{"sitc":"653","name":"Fabrics, woven, of man-made fibres (not narrow or special fabrics)"},{"sitc":"6531","name":"Fabrics, woven, of continuous synthetic textile materials"},{"sitc":"65314","name":"Tire cord fabric, of continuous synthetic textile materials"},{"sitc":"65315","name":"Fabrics, woven, 85% plus of continuous synthetic textile materials"},{"sitc":"65316","name":"Fabrics, woven, less 85% of continuous synthetic textile materials"},{"sitc":"6532","name":"Fabrics, woven, 85% plus of discontinuous synthetic fibres"},{"sitc":"6534","name":"Fabrics, woven, less 85% of discontinuous synthetic fibres"},{"sitc":"65341","name":" -- mixed mainly or solely with cotton"},{"sitc":"65342","name":" -- mixed mainly or solely with wool or fine animal hair"},{"sitc":"65343","name":" -- mixed mainly with continuous man-made textile materials"},{"sitc":"65349","name":" -- mixed mainly with fibres other than cotton, wool, etc"},{"sitc":"6535","name":"Fabric, woven of continuous regenerated textile materials"},{"sitc":"65354","name":"Tire cord fabric of continuous regenerated textile materials"},{"sitc":"65355","name":"Fabrics, woven, 85% plus continuous regenerated textile materials"},{"sitc":"65356","name":"Fabrics, woven, less 85% continuous regenerated textile materials"},{"sitc":"6536","name":"Fabrics, woven, 85% plus of discontinuous regenerated fibres"},{"sitc":"6538","name":"Fabrics, woven, less 85% of discontinuous regenerated fibres"},{"sitc":"65381","name":"-- mixed mainly or solely with cotton"},{"sitc":"65382","name":"-- mixed mainly or solely with wool or fine animal hair"},{"sitc":"65383","name":"-- mixed mainly with continuous man-made textile materials"},{"sitc":"65389","name":"-- mixed mainly with fibres other than cotton, wool, etc"},{"sitc":"6539","name":"Pile and chenille fabrics, woven, of man-made fibres"},{"sitc":"65397","name":"-- synthetics"},{"sitc":"65398","name":"-- regenerated"},{"sitc":"654","name":"Textile fabrics, woven, other than cotton or man-made fibres"},{"sitc":"6541","name":"Fabrics, woven, of silk, of noil or other waste silk"},{"sitc":"6542","name":"Fabrics, woven, 85% plus of sheep's or lambs' wool or of fine hair"},{"sitc":"65421","name":"-- of carded wool or carded fine animal hair"},{"sitc":"65422","name":"-- of combed wool or combed fine animal hair"},{"sitc":"6543","name":"Fabrics, woven, of sheep's or lambs' wool or of fine hair, nes"},{"sitc":"65431","name":"-- less 85% wool or fine hair, mixed continuous synthetic fibres"},{"sitc":"65432","name":"-- less 85% wool or hair, mixed discontinuous synthetic fibres"},{"sitc":"65433","name":"-- less 85% wool or hair, mixed with other synthetic fibres"},{"sitc":"65434","name":"Pile fabrics and chenille fabrics, woven, of wool or fine hair"},{"sitc":"6544","name":"Fabrics, woven, of flax or of ramie"},{"sitc":"6545","name":"Fabrics, woven of jute or other textile bast fibres of heading 2640"},{"sitc":"6546","name":"Fabrics of glass fibre (including narrow, pile fabrics, lace, etc)"},{"sitc":"6549","name":"Fabrics, woven, nes"},{"sitc":"65491","name":"Fabrics, woven, of metallized yarn, used in furnishing fabrics, etc"},{"sitc":"65492","name":"Fabrics, woven, of horsehair or of other coarse animal hair"},{"sitc":"65498","name":"Fabrics, woven, of other vegetable textile fibres; of paper yarn"},{"sitc":"65499","name":"Pile fabrics and chenille fabrics, woven, nes"},{"sitc":"655","name":"Knitted or crocheted fabrics (including tubular, etc, fabrics)"},{"sitc":"6551","name":"Knitted etc, not elastic nor rubberized, of synthetic fibres"},{"sitc":"6552","name":"Knitted, not elastic nor rubberized, of fibres other than synthetic"},{"sitc":"65521","name":"-- of wool or fine animal hair"},{"sitc":"65522","name":"-- of cotton"},{"sitc":"65523","name":"-- of regenerated fibres"},{"sitc":"65529","name":"-- of other fibres"},{"sitc":"6553","name":"Knitted or crocheted fabrics, elastic or rubberized"},{"sitc":"656","name":"Tulle, lace, embroidery, ribbons, trimmings and other small wares"},{"sitc":"6560","name":"Tulle, lace, embroidery, ribbons, trimmings and other small wares"},{"sitc":"65601","name":"Narrow woven fabrics, and narrow fabrics (bolduc)"},{"sitc":"65602","name":"Woven labels, badges and the like, not embroidered, in strips, etc"},{"sitc":"65603","name":"Chenille and gimped yarn; braid, tassels, pompons and the like"},{"sitc":"65604","name":"Tulle and other net fabrics, plain"},{"sitc":"65605","name":"Tulle and other net fabrics, figured; lace, in strips or in motifs"},{"sitc":"65606","name":"Embroidery, in the piece, in strips or in motifs"},{"sitc":"657","name":"Special textile fabrics and related products"},{"sitc":"6571","name":"Felt, articles of felt, nes, whether or not impregnated or coated"},{"sitc":"6572","name":"Bonded fibre fabrics, etc, whether or not impregnated or coated"},{"sitc":"6573","name":"Coated or impregnated textile fabrics and products, nes"},{"sitc":"65731","name":"Textile fabrics coated with gum or amylaceous substances"},{"sitc":"65732","name":"Textile fabrics coated with plastic or cellulose derivatives"},{"sitc":"65733","name":"Rubberized textile fabrics (other than knitted or crocheted goods)"},{"sitc":"65739","name":"Impregnated or coated textile fabrics; studio backcloths, etc"},{"sitc":"6574","name":"Elastic fabrics and trimming (not knitted or crocheted)"},{"sitc":"6575","name":"Twine, cordage, ropes and cables and manufactures thereof"},{"sitc":"65751","name":"Twine, cordage, ropes and cables plaited or not"},{"sitc":"65752","name":"Nets and netting made of twine, cordage or rope, etc"},{"sitc":"65759","name":"Other articles made from yarn, twine, cordage, rope or cable"},{"sitc":"6576","name":"Hat shapes, hat-forms, hat bodies and hoods"},{"sitc":"65761","name":"Hat-forms, hat bodies, etc, of felt; plateaux and manchons"},{"sitc":"65762","name":"Hat-shapes, plaited or made from plaited or strips of any material"},{"sitc":"6577","name":"Wadding, wicks and textiles fabrics for use in machinery or plant"},{"sitc":"65771","name":"Wadding and articles of, nes; textile flock, dust and mill neps"},{"sitc":"65772","name":"Wicks, of woven, plaited or knitted textile materials etc"},{"sitc":"65773","name":"Textile fabrics and articles for machinery or plants"},{"sitc":"6579","name":"Special products of textile materials"},{"sitc":"65791","name":"Textile hosepiping, and similar tubing, etc"},{"sitc":"65792","name":"Transmission, conveyor, belts, etc, of textile material"},{"sitc":"658","name":"Made-up articles, wholly or chiefly of textile materials, nes"},{"sitc":"6581","name":"Bags, sacks of textile materials, for the packing of goods"},{"sitc":"6582","name":"Tarpaulins, sails, tents, camping goods, etc, of textile fabrics"},{"sitc":"65821","name":"-- of cotton"},{"sitc":"65829","name":"-- other than of cotton"},{"sitc":"6583","name":"Travelling rugs, blankets (non electric), not knitted or crocheted"},{"sitc":"65831","name":"-- of wool or fine animal hair"},{"sitc":"65832","name":"-- of cotton"},{"sitc":"65833","name":"-- of synthetic fibres"},{"sitc":"65839","name":"-- of other fibres"},{"sitc":"6584","name":"Linens and furnishing articles of textile, not knitted or crocheted"},{"sitc":"65841","name":"Bed linen of cotton"},{"sitc":"65842","name":"Bed linen of other fibres"},{"sitc":"65843","name":"Table linen of cotton"},{"sitc":"65844","name":"Table linen of other fibres"},{"sitc":"65845","name":"Toilet and kitchen linen of cotton"},{"sitc":"65846","name":"Toilet and kitchen linen of other fibres"},{"sitc":"65848","name":"Other furnishing articles of cotton"},{"sitc":"65849","name":"Other furnishing articles of other fibres"},{"sitc":"6589","name":"Other made-up articles of textile materials, nes"},{"sitc":"65891","name":"Tapestries, hand-made, and needle-worked made in panels by hand"},{"sitc":"65898","name":"Knitted or crocheted textile articles, nes, not elastics, etc"},{"sitc":"65899","name":"Made-up textile articles not knitted or crocheted, nes"},{"sitc":"659","name":"Floor coverings, etc"},{"sitc":"6591","name":"Linoleum and similar floor covering"},{"sitc":"65911","name":"Floor coverings prepared on a base of paper or paperboard"},{"sitc":"65912","name":"Linoleum and materials prepared on textile base"},{"sitc":"6592","name":"Carpets, carpeting and rugs, knotted"},{"sitc":"65921","name":"-- of wool or fine animal hair"},{"sitc":"65929","name":"-- of other textile materials"},{"sitc":"6593","name":"Kelem, Schumacks and Karamanie rugs and the like"},{"sitc":"6594","name":"Carpets, rugs, mats, of wool or fine animal hair"},{"sitc":"65941","name":"-- tufted"},{"sitc":"65942","name":"-- woven"},{"sitc":"65949","name":"-- other than knotted, tufted, woven or of felt"},{"sitc":"6595","name":"Carpets, rugs, mats, of man-made textile materials, nes"},{"sitc":"65951","name":"-- tufted"},{"sitc":"65952","name":"-- woven"},{"sitc":"65959","name":"-- other than knotted, tufted, woven or of felt"},{"sitc":"6596","name":"Carpets, rugs, mats, of other textile materials, nes"},{"sitc":"65961","name":"-- tufted"},{"sitc":"65962","name":"-- other than knotted, tufted, or of felt"},{"sitc":"65963","name":"Floor coverings of felt, of tufted felt or of needleloom felt"},{"sitc":"6597","name":"Plaits, plaited products for all uses; straw envelopes for bottles"},{"sitc":"66","name":"Non-metallic mineral manufactures, nes"},{"sitc":"661","name":"Lime, cement, and fabricated construction materials"},{"sitc":"6611","name":"Lime, quick, slaked and hydraulic (no calcium oxide or hydroxide)"},{"sitc":"6612","name":"Cement"},{"sitc":"6613","name":"Building and monumental stone, worked, and articles thereof"},{"sitc":"66131","name":"Road and paving setts, curb and flagstones, of natural stone"},{"sitc":"66132","name":"Building and monumental stone, worked, and articles thereof"},{"sitc":"66133","name":"Slate, worked, articles of slate"},{"sitc":"6618","name":"Construction materials, of asbestos-cement or fibre-cements, etc"},{"sitc":"66181","name":"Articles of asphalt or of similar material"},{"sitc":"66182","name":"Panel, blocks, etc of mixed vegetable-mineral substances"},{"sitc":"66183","name":"Articles of asbestos-cement, of cellulose fibre-cement or the like"},{"sitc":"662","name":"Clay and refractory construction materials"},{"sitc":"6623","name":"Refractory bricks and other refractory construction materials"},{"sitc":"66231","name":"Heat-insulated bricks, blocks, etc, of siliceous earth"},{"sitc":"66232","name":"Refractory bricks, blocks, tiles, etc, other than heading 66231"},{"sitc":"66233","name":"Refractory cement, mortars and similar composition"},{"sitc":"6624","name":"Non-refractory ceramic bricks, tiles, pipes and similar products"},{"sitc":"66241","name":"Building bricks"},{"sitc":"66242","name":"Roofing tiles, chimney-pots, etc, and ceramic constructional goods"},{"sitc":"66243","name":"Ceramic piping, conduits and guttering"},{"sitc":"66244","name":"Unglazed ceramic setts, flags and paving, hearth and wall tiles"},{"sitc":"66245","name":"Glazed ceramic setts, flags and paving, hearth and wall tiles"},{"sitc":"663","name":"Mineral manufactures, nes"},{"sitc":"6631","name":"Hand polishing stone, grindstones, grinding wheels, etc"},{"sitc":"6632","name":"Abrasive power or grain, on a base of woven fabrics"},{"sitc":"6633","name":"Manufactures of mineral materials, nes (other than ceramic)"},{"sitc":"66331","name":"Articles of plastering material"},{"sitc":"66332","name":"Articles of cement, concrete or artificial stone, reinforce or not"},{"sitc":"66333","name":"Mica, worked, and articles of mica"},{"sitc":"66339","name":"Articles of stone or of other mineral substances, nes"},{"sitc":"6635","name":"Wool; expanding or insulating mineral materials, nes"},{"sitc":"6637","name":"Refractory goods, nes"},{"sitc":"6638","name":"Manufactures of asbestos; friction materials"},{"sitc":"66381","name":"Fabricated asbestos and articles thereof"},{"sitc":"66382","name":"Friction materials"},{"sitc":"6639","name":"Articles of ceramic materials, nes"},{"sitc":"66391","name":"Laboratory, chemical or industrial ware, ceramic, non-refractory"},{"sitc":"66392","name":"Other articles of ceramic materials, nes"},{"sitc":"664","name":"Glass"},{"sitc":"6641","name":"Glass in the mass, in balls, rods or tubes (nonoptical); waste"},{"sitc":"66414","name":"Glass in the mass (nonoptical); waste glass (cullet)"},{"sitc":"66415","name":"Glass in balls, rods and tubes, unworked (nonoptical)"},{"sitc":"6642","name":"Optical glass and elements of optical glass (unworked)"},{"sitc":"6643","name":"Drawn or blown glass (flashed glass), unworked, in rectangles"},{"sitc":"6644","name":"Glass, cast, rolled, etc, surface-ground, but no further worked"},{"sitc":"6645","name":"Cast, rolled glass (flashed or wired), unworked, in rectangles"},{"sitc":"6646","name":"Bricks, tiles, etc of pressed or moulded glass, used in building"},{"sitc":"6647","name":"Safety glass consisting of toughened or laminated glass, cut or not"},{"sitc":"6648","name":"Glass mirror, unframed, framed or backed"},{"sitc":"6649","name":"Glass, nes"},{"sitc":"66491","name":"Glass cut to shape, or bent or otherwise worked"},{"sitc":"66492","name":"Glass envelopes (bulbs, tubes) lamps, electronic valves, etc"},{"sitc":"66493","name":"Clock and watch glasses etc"},{"sitc":"66494","name":"Glass fibre (including wool) and articles made therefrom, nes"},{"sitc":"665","name":"Glassware"},{"sitc":"6651","name":"Bottles etc of glass"},{"sitc":"66511","name":"Jars, pots, etc, of glass, for conveyance of goods; stoppers etc"},{"sitc":"66512","name":"Glass inners for vacuum flasks or for other vacuum vessels"},{"sitc":"6652","name":"Glassware (other than heading 66582), for indoor decoration"},{"sitc":"6658","name":"Articles made of glass, nes"},{"sitc":"66581","name":"Laboratory, hygienic and pharmaceutical glassware; glass ampoules"},{"sitc":"66582","name":"Glass ornaments nes"},{"sitc":"66589","name":"Other articles of glass, nes"},{"sitc":"666","name":"Pottery"},{"sitc":"6664","name":"Porcelain or china house ware"},{"sitc":"6665","name":"Articles of domestic or toilet purposes, of other kind of pottery"},{"sitc":"6666","name":"Ornaments, personal articles of porcelain, china, or ceramic, nes"},{"sitc":"667","name":"Pearl, precious and semi-precious stones, unworked or worked"},{"sitc":"6671","name":"Pearls, not mounted, set or strung"},{"sitc":"6672","name":"Diamonds (non-industrial), not mounted or set"},{"sitc":"66721","name":"Diamonds, rough, unsorted"},{"sitc":"66722","name":"Diamonds, sorted, rough or simply sawn, cleaved or bruted"},{"sitc":"66729","name":"Diamonds cut or otherwise worked, but not mounted or set"},{"sitc":"6673","name":"Precious and semi-precious stones, not mounted, set or strung"},{"sitc":"6674","name":"Synthetic or reconstructed precious or semi-precious stones"},{"sitc":"67","name":"Iron and steel"},{"sitc":"671","name":"Pig and sponge iron, spiegeleisen, etc, and ferro-alloys"},{"sitc":"6712","name":"Pig iron, cast iron, spiegeleisen, in pigs, blocks, lumps, etc"},{"sitc":"6713","name":"Iron and steel powders, shot or sponge"},{"sitc":"67131","name":"Iron or steel shot and angular grit, graded or not; wire pellets"},{"sitc":"67132","name":"Iron or steel powders"},{"sitc":"67133","name":"Sponge iron or steel, not in powder form"},{"sitc":"6716","name":"Ferro-alloys"},{"sitc":"67161","name":"Ferro-manganese"},{"sitc":"67162","name":"Ferro-silicon"},{"sitc":"67169","name":"Other ferro-alloys"},{"sitc":"672","name":"Ingots and other primary forms, of iron or steel"},{"sitc":"6724","name":"Puddled bars, pilings; ingots, blocks, lumps, etc, of iron or steel"},{"sitc":"67241","name":"Ingots of iron or steel, other than of high carbon or alloy steel"},{"sitc":"67242","name":"Ingots of high carbon steel"},{"sitc":"67243","name":"Ingots of stainless or heat-resistant steel"},{"sitc":"67244","name":"Ingots of other alloy steel"},{"sitc":"67245","name":"Puddled bars, piling; blocks, lumps, etc, of iron or steel"},{"sitc":"6725","name":"Blooms, billets, slabs and sheet bars, of iron or steel"},{"sitc":"67251","name":"-- of other than high carbon or alloy steel"},{"sitc":"67252","name":"-- of high carbon steel"},{"sitc":"67254","name":"-- of stainless or heat-resistant steel"},{"sitc":"67255","name":"-- of other alloy steel"},{"sitc":"6727","name":"Iron or steel coils for re-rolling"},{"sitc":"67271","name":"-- of other than high carbon or alloy steel"},{"sitc":"67272","name":"-- of high carbon steel"},{"sitc":"67274","name":"-- of stainless or heat resisting steel"},{"sitc":"67275","name":"-- other alloy steel"},{"sitc":"673","name":"Iron and steel bars, rods, shapes and sections"},{"sitc":"6731","name":"Wire rod of iron or steel"},{"sitc":"67311","name":"-- of other than high carbon or alloy steel"},{"sitc":"67312","name":"-- of high carbon steel"},{"sitc":"67314","name":"-- of stainless or heat-resistant steel"},{"sitc":"67315","name":"-- of other alloy steel"},{"sitc":"6732","name":"Bars, rods (not wire rod), from iron or steel; hollow mining drill"},{"sitc":"67322","name":"-- of high carbon steel"},{"sitc":"67324","name":"-- of stainless or heat-resistant steel"},{"sitc":"67325","name":"-- of other alloy steel"},{"sitc":"67326","name":"Bars, rods, hot rolled or extruded (not high carbon or alloy steel)"},{"sitc":"67327","name":"Bars, rods, forget, cold formed (not high carbon, alloy steel), etc"},{"sitc":"6733","name":"Angles, shapes, sections and sheet piling, of iron or steel"},{"sitc":"67331","name":"U, I, H sections, hot-rolled (not high carbon, alloy), of less 80mm"},{"sitc":"67332","name":"U, I, H sections, hot-rolled (not high carbon, alloy), of 80mm plus"},{"sitc":"67333","name":"Other profiles hot-rolled of iron or steel (not high carbon, alloy)"},{"sitc":"67334","name":"Other profiles cold-formed of iron or steel (not high carbon, alloy)"},{"sitc":"67335","name":"Other angles, shapes, etc, of iron or steel (not high carbon, alloy)"},{"sitc":"67336","name":"Sheet piling of iron or steel (not of high carbon or alloy steel)"},{"sitc":"67337","name":"Angles, shapes and sections, of high carbon steel"},{"sitc":"67338","name":"Angles, shapes and sections, of stainless or heat-resistant steel"},{"sitc":"67339","name":"Angles, shapes and sections, of other alloy steel"},{"sitc":"674","name":"Universals, plates, and sheets, of iron or steel"},{"sitc":"6741","name":"Universal plates of iron or steel"},{"sitc":"67414","name":"-- of other than high carbon or alloy steel"},{"sitc":"67415","name":"-- of high carbon or alloy steel"},{"sitc":"6744","name":"Sheet, plates, rolled of thickness 4,75mm plus, of iron or steel"},{"sitc":"67441","name":"-- of other than high carbon or alloy steel"},{"sitc":"67442","name":"-- of high carbon steel"},{"sitc":"67443","name":"-- of stainless or heat-resistant steel"},{"sitc":"67444","name":"-- of other alloy steel"},{"sitc":"6745","name":"Sheet, plates, rolled of thickness 3mm to 4,75mm, of iron or steel"},{"sitc":"67451","name":"-- of other than high carbon or alloy steel"},{"sitc":"67452","name":"-- of high carbon steel"},{"sitc":"67453","name":"-- of stainless or heat-resistant steel"},{"sitc":"67454","name":"-- of other alloy steel"},{"sitc":"6746","name":"Sheet, plates, rolled of thickness less 3mm, of iron or steel"},{"sitc":"67461","name":"-- of other than high carbon or alloy steel"},{"sitc":"67462","name":"-- of high carbon steel"},{"sitc":"67463","name":"-- of stainless or heat-resistant steel"},{"sitc":"67464","name":"-- of other alloy steel"},{"sitc":"6747","name":"Tinned sheets, plates of steel (not of high carbon or alloy steel)"},{"sitc":"6749","name":"Other sheet and plates, of iron or steel, worked"},{"sitc":"67491","name":"-- of other than high carbon or alloy steel (excluding tinned)"},{"sitc":"67492","name":"-- of high carbon steel"},{"sitc":"67493","name":"-- of stainless or heat-resistant steel"},{"sitc":"67494","name":"-- of other alloy steel"},{"sitc":"675","name":"Hoop and strip of iron or steel, hot-rolled or cold-rolled"},{"sitc":"6750","name":"Hoop and strip of iron or steel, hot-rolled or cold-rolled"},{"sitc":"67501","name":"-- of other than high carbon or alloy steel"},{"sitc":"67502","name":"-- of high carbon steel"},{"sitc":"67504","name":"-- of stainless or heat-resistant steel"},{"sitc":"67505","name":"-- of other alloy steel"},{"sitc":"676","name":"Rails and railway track construction materials, of iron or steel"},{"sitc":"6760","name":"Rails and railway track construction materials, of iron or steel"},{"sitc":"67601","name":"Rails (other than check and rack rails) of iron or steel"},{"sitc":"67602","name":"Other railway, tramway track construction material of iron or steel"},{"sitc":"677","name":"Iron or steel wire (excluding wire rod), not insulated"},{"sitc":"6770","name":"Iron or steel wire (excluding wire rod), not insulated"},{"sitc":"67701","name":"-- of other than high carbon or alloy steel"},{"sitc":"67702","name":"-- of high carbon steel"},{"sitc":"67704","name":"-- of stainless or heat-resistant steel"},{"sitc":"67705","name":"-- of other alloy steel"},{"sitc":"678","name":"Tube, pipes and fittings, of iron or steel"},{"sitc":"6781","name":"Tubes and pipes, of cast iron"},{"sitc":"6782","name":"Seamless tubes, pipes; blanks for tubes and pipes, of iron or steel"},{"sitc":"6783","name":"Other tubes and pipes, of iron or steel"},{"sitc":"6784","name":"High-pressure hydro-electric conduit of steel"},{"sitc":"6785","name":"Tube and pipes fittings, of iron or steel"},{"sitc":"679","name":"Iron, steel casting, forging and stamping, in the rough state, nes"},{"sitc":"6793","name":"Steel and iron forging and stampings, in the rough state"},{"sitc":"6794","name":"Castings of iron or steel, in rough state"},{"sitc":"67941","name":"Iron castings rough"},{"sitc":"67942","name":"Steel castings rough"},{"sitc":"68","name":"Non-ferrous metals"},{"sitc":"681","name":"Silver, platinum and other metals of the platinum group"},{"sitc":"6811","name":"Silver, unwrought, unworked, or semi-manufactured"},{"sitc":"68112","name":"Rolled silver"},{"sitc":"68113","name":"Silver unwrought (including silver guilt, platinum-plated silver)"},{"sitc":"68114","name":"Silver semi-manufactured"},{"sitc":"6812","name":"Metals of platinum group, unwrought, unworked, or semi-manufactured"},{"sitc":"68122","name":"Rolled platinum, unworked, or semi-manufactured"},{"sitc":"68123","name":"Platinum and platinum alloys, unwrought"},{"sitc":"68124","name":"Other metals of the platinum group and alloys thereof, unwrought"},{"sitc":"68125","name":"Platinum, metals of the platinum group, alloys, semi-manufactured"},{"sitc":"682","name":"Copper"},{"sitc":"6821","name":"Copper and copper alloys, refined or not, unwrought"},{"sitc":"68211","name":"Unrefined copper (blister copper but excluding cement copper)"},{"sitc":"68212","name":"Refined copper, (including alloys except master alloys), unwrought"},{"sitc":"68213","name":"Master alloy of copper"},{"sitc":"6822","name":"Copper and copper alloys, worked"},{"sitc":"68221","name":"Copper bars, rods, angles, shapes, sections, wrought; copper wire"},{"sitc":"68222","name":"Copper plates, sheets and strips, wrought"},{"sitc":"68223","name":"Copper foil not exceeding 0.15 mm"},{"sitc":"68224","name":"Copper powders and flakes"},{"sitc":"68225","name":"Copper tubes, pipes, and blanks thereof; hollow bars of cooper"},{"sitc":"68226","name":"Copper tubes and pipes fittings"},{"sitc":"683","name":"Nickel"},{"sitc":"6831","name":"Nickel and nickel alloys, unwrought"},{"sitc":"6832","name":"Nickel and nickel alloys, worked"},{"sitc":"68321","name":"Nickel bars, rods, angles, shapes, sections, wrought; nickel wire"},{"sitc":"68322","name":"Nickel sheet, plates, strip, wrought; nickel foil, powders, flakes"},{"sitc":"68323","name":"Nickel tube, pipe, blanks; hollow bars; tube and pipe fittings"},{"sitc":"68324","name":"Electro-plating anodes, of nickel"},{"sitc":"684","name":"Aluminium"},{"sitc":"6841","name":"Aluminium and aluminium alloys, unwrought"},{"sitc":"6842","name":"Aluminium and aluminium alloys, worked"},{"sitc":"68421","name":"Aluminium bars, rods, angles, shapes, etc, wrought; aluminium wire"},{"sitc":"68422","name":"Aluminium plates, sheets and strips, wrought"},{"sitc":"68423","name":"Aluminium foil, of a thickness not exceeding 0.20 mm"},{"sitc":"68424","name":"Aluminium powders and flakes"},{"sitc":"68425","name":"Aluminium tubes, pipes and blanks; hollow bars of aluminium"},{"sitc":"68426","name":"Aluminium tubes and pipes fittings"},{"sitc":"685","name":"Lead"},{"sitc":"6851","name":"Lead, and lead alloys, unwrought"},{"sitc":"68511","name":"Unrefined lead"},{"sitc":"68512","name":"Refine lead (excluding lead alloys), unwrought"},{"sitc":"68513","name":"Lead alloys, unwrought"},{"sitc":"6852","name":"Lead and lead alloys, worked"},{"sitc":"68521","name":"Lead bars, rods, angles, shapes and section, wrought; lead wire"},{"sitc":"68522","name":"Lead plate, sheets and strip, wrought"},{"sitc":"68523","name":"Lead foil, of a weight of 1,700 g/m2 or less; lead powder, flakes"},{"sitc":"68524","name":"Lead tubes, pipes, blanks; hollow bars, tube and pipes fittings"},{"sitc":"686","name":"Zinc"},{"sitc":"6861","name":"Zinc and zinc alloys, unwrought"},{"sitc":"6863","name":"Zinc and zinc alloys worked"},{"sitc":"68631","name":"Zinc bars, rods, angles, shapes and section, wrought; zinc wire"},{"sitc":"68632","name":"Zinc plates, sheets and strip, wrought; zinc foil"},{"sitc":"68633","name":"Zinc powders, dust (blue powder) and flakes"},{"sitc":"68634","name":"Zinc tubes, pipes, blanks; hollow bars, tube and pipes fittings"},{"sitc":"687","name":"Tin"},{"sitc":"6871","name":"Tin and tin alloys, unwrought"},{"sitc":"6872","name":"Tin and tin alloys worked"},{"sitc":"68721","name":"Tin bars, rods, angles, shapes and section, wrought; tin wire"},{"sitc":"68722","name":"Tin plates, sheets and strip, wrought"},{"sitc":"68723","name":"Tin foil, of a weight of 1 kg/m2 or less; tin powder and flakes"},{"sitc":"68724","name":"Tin tubes, pipes, blanks; hollow bars, tube and pipes fittings"},{"sitc":"688","name":"Uranium depleted in U235, thorium, and alloys, nes; waste and scrap"},{"sitc":"6880","name":"Uranium depleted in U235, thorium, and alloys, nes; waste and scrap"},{"sitc":"689","name":"Miscellaneous non-ferrous base metals, employed in metallurgy"},{"sitc":"6891","name":"Tungsten, molybdenum, tantalum, magnesium, unwrought; waste, scrap"},{"sitc":"68911","name":"Tungsten (wolfram), unwrought; waste and scrap"},{"sitc":"68912","name":"Molybdenum, unwrought; waste and scrap"},{"sitc":"68913","name":"Tantalum, unwrought; waste and scrap"},{"sitc":"68914","name":"Magnesium waste and scrap"},{"sitc":"68915","name":"Magnesium, unwrought"},{"sitc":"6899","name":"Base metals, nes and cermets, unwrought (including waste and scrap)"},{"sitc":"68991","name":"Beryllium, unwrought; waste and scrap"},{"sitc":"68999","name":"Other base metals, nes, and cermets, unwrought; waste and scrap"},{"sitc":"69","name":"Manufactures of metals, nes"},{"sitc":"691","name":"Structures and parts, nes, of iron, steel or aluminium"},{"sitc":"6911","name":"Structures and parts of, of iron, steel; plates, rods, and the like"},{"sitc":"6912","name":"Structures and parts of, of aluminium; plates, rods, and the like"},{"sitc":"692","name":"Metal containers for storage and transport"},{"sitc":"6921","name":"Iron, steel, aluminium reservoirs, tanks, etc, capacity 300 lt plus"},{"sitc":"69211","name":"-- of iron or steel"},{"sitc":"69213","name":"-- of aluminium"},{"sitc":"6924","name":"Cask, drums, etc, of iron, steel, aluminium, for packing goods"},{"sitc":"69241","name":"Cask, drums, boxes, etc, of iron, steel, for packing goods"},{"sitc":"69242","name":"Cask, drums, boxes, etc, of aluminium, for packing goods"},{"sitc":"69243","name":"Containers, of iron or steel, for compress or liquefied gas"},{"sitc":"69244","name":"Containers, of aluminium, for compress or liquefied gas"},{"sitc":"693","name":"Wire products (excluding insulated electrical wire); fencing grills"},{"sitc":"6931","name":"Wire, cables, cordage, ropes, plaited bans, sling and the like"},{"sitc":"69311","name":"-- of iron or steel"},{"sitc":"69312","name":"-- of copper"},{"sitc":"69313","name":"-- of aluminium"},{"sitc":"6932","name":"Barbed iron or steel wire: fencing wire"},{"sitc":"6935","name":"Gauze, cloth, grill, netting, reinforced fabric and the like"},{"sitc":"69351","name":"-- of iron"},{"sitc":"69352","name":"-- of copper"},{"sitc":"694","name":"Nails, screws, nuts, bolts, rivets, etc, of iron, steel or copper"},{"sitc":"6940","name":"Nails, screws, nuts, bolts, rivets, etc, of iron, steel or copper"},{"sitc":"69401","name":"Iron or steel nails, tacks, hook-nails, spike cramps, studs, etc"},{"sitc":"69402","name":"Iron or steel nuts, bolts, rivets, cotters, washers, etc"},{"sitc":"69403","name":"Copper nails, bolts, spikes, rivets, cotters, washers, etc"},{"sitc":"695","name":"Tools for use in the hand or in machines"},{"sitc":"6951","name":"Hand tools, used in agriculture, horticulture or forestry"},{"sitc":"6953","name":"Other hand tools"},{"sitc":"69531","name":"Saws and blades for hand or machine saws"},{"sitc":"69532","name":"Wrenches and spanners"},{"sitc":"69533","name":"Files and rasps"},{"sitc":"69534","name":"Other hand tools, pliers, pincers, snips, bolt croppers, etc"},{"sitc":"69539","name":"Hand tools, nes; portable forges; grinding wheels with frameworks"},{"sitc":"6954","name":"Interchangeable tools for hand or machine tools (tips, blades, etc)"},{"sitc":"69541","name":"Interchangeable tools for hand, machine, power-operated hand tools"},{"sitc":"69542","name":"Knives or cutting blades for machines or mechanical appliances"},{"sitc":"69543","name":"Carbide tool tips etc"},{"sitc":"696","name":"Cutlery"},{"sitc":"6960","name":"Cutlery"},{"sitc":"69603","name":"Razors and razor blades"},{"sitc":"69604","name":"Scissors and blades therefor"},{"sitc":"69605","name":"Other articles of cutlery (secateurs, clippers, cleavers, etc)"},{"sitc":"69606","name":"Spoons, forks, ladles, etc, and similar kitchen or tableware"},{"sitc":"69607","name":"Cutlery handles of base metal"},{"sitc":"69608","name":"Knives with cutting blades, other of heading 69542"},{"sitc":"697","name":"Household equipment of base metal, nes"},{"sitc":"6973","name":"Domestic, non-electric, heating, cooking apparatus, and parts, nes"},{"sitc":"69731","name":"Cooking apparatus, plate warmers, non-electrical, of iron, steel"},{"sitc":"69732","name":"Domestic heating apparatus, non-electrical, of iron or steel"},{"sitc":"69733","name":"Parts, nes of iron or steel, of apparatus of heading 6973"},{"sitc":"69734","name":"Domestic heating apparatus, non-electrical, and parts, of copper"},{"sitc":"69735","name":"Domestic, non-electrical water heaters, and parts thereof, nes"},{"sitc":"6974","name":"Base metal domestic articles, nes, and parts thereof, nes"},{"sitc":"69741","name":"-- of iron or steel"},{"sitc":"69742","name":"-- of copper"},{"sitc":"69743","name":"-- of aluminium"},{"sitc":"6975","name":"Base metal indoors sanitary ware, and parts thereof, nes"},{"sitc":"69751","name":"-- iron or steel"},{"sitc":"69752","name":"-- copper"},{"sitc":"69753","name":"-- aluminium"},{"sitc":"6978","name":"Household appliances, decorative article, etc, of base metal, nes"},{"sitc":"69781","name":"Domestic food appliances, non-electrical"},{"sitc":"69782","name":"Base metal ornaments for indoors used; mirrors of base metal"},{"sitc":"699","name":"Manufactures of base metal, nes"},{"sitc":"6991","name":"Locksmiths wares, safes, etc, and hardware, nes, of base metal"},{"sitc":"69911","name":"Locks and padlocks, and parts thereof, of base metal"},{"sitc":"69912","name":"Base metal safes etc"},{"sitc":"69913","name":"Base metal fitting and mountings, hat-racks, brackets and the like"},{"sitc":"6992","name":"Chain and parts thereof, of iron or steel"},{"sitc":"6993","name":"Pins, needles, etc, of iron, steel; metal fittings for clothing"},{"sitc":"69931","name":"Hand needles, bodkins, crochet hooks, etc, of iron or steel"},{"sitc":"69932","name":"Pins, hairpins and curling grips, of iron or steel (not ornamental)"},{"sitc":"69933","name":"Base metal hooks, eyes, etc, used for clothing or travel goods"},{"sitc":"6994","name":"Springs and leaves for springs, of iron, steel or copper"},{"sitc":"69941","name":"Springs and leaves for springs, of iron or steel"},{"sitc":"69942","name":"Springs of copper"},{"sitc":"6996","name":"Miscellaneous articles of base metal"},{"sitc":"69961","name":"Flexible tubing and piping, of base metal"},{"sitc":"69962","name":"Bells, gongs, non-electric, of base metal, and parts of base metal"},{"sitc":"69963","name":"Stoppers, caps, etc, and other packing accessories, of base metal"},{"sitc":"69964","name":"Sign-plates, numbers, letters and other signs, of base metal"},{"sitc":"69965","name":"Rods, electrodes, wire, and the like, for soldering, of base metal"},{"sitc":"6997","name":"Articles of iron or steel, nes"},{"sitc":"69971","name":"Anchors and grapnels and parts thereof, of iron or steel"},{"sitc":"69979","name":"Other articles of iron or steel, nes"},{"sitc":"6998","name":"Articles, nes, of copper, nickel, aluminium, lead, zinc and tin"},{"sitc":"69981","name":"-- of copper"},{"sitc":"69982","name":"-- of nickel"},{"sitc":"69983","name":"-- of aluminium"},{"sitc":"69984","name":"-- of lead"},{"sitc":"69985","name":"-- of zinc"},{"sitc":"69986","name":"-- of tin"},{"sitc":"6999","name":"Other base metal manufactures, nes; and of cermets"},{"sitc":"69991","name":"Tungsten, wrought, and articles of tungsten, nes"},{"sitc":"69992","name":"Molybdenum wrought, and articles of molybdenum, nes"},{"sitc":"69993","name":"Tantalum wrought, and articles of tantalum, nes"},{"sitc":"69994","name":"Magnesium wrought, and articles of magnesium, like rods, wire, etc"},{"sitc":"69995","name":"Beryllium wrought, and articles of beryllium, nes"},{"sitc":"69999","name":"Base metals and cermets, nes, wrought, and articles thereof"},{"sitc":"7","name":"Machinery and transport equipment"},{"sitc":"71","name":"Power generating machinery and equipment"},{"sitc":"711","name":"Steam boilers and auxiliary plant; and parts thereof, nes"},{"sitc":"7111","name":"Steam and other vapour-generated boilers; super-heated water boiler"},{"sitc":"7112","name":"Auxiliary plant for boilers of heading 7111; condensers"},{"sitc":"7119","name":"Parts, nes of boilers and auxiliary plant of headings 7111 and 7112"},{"sitc":"71191","name":"Parts, nes of the boilers falling within heading 7111"},{"sitc":"71199","name":"Parts, nes of the apparatus, appliances falling within heading 7112"},{"sitc":"712","name":"Steam engines, turbines"},{"sitc":"7126","name":"Steam power units (mobile engines but not steam tractors, etc)"},{"sitc":"7129","name":"Parts, nes of steam power units"},{"sitc":"713","name":"Internal combustion piston engines, and parts thereof, nes"},{"sitc":"7131","name":"Internal combustion piston engines, for aircraft, and parts, nes"},{"sitc":"71311","name":"Internal combustion piston engines, for aircraft"},{"sitc":"71319","name":"Parts, nes of the aircraft engines falling within heading 71311"},{"sitc":"7132","name":"Motor vehicles piston engines, headings: 722; 78; 74411 and 95101"},{"sitc":"7133","name":"Internal combustion piston engines, marine propulsion"},{"sitc":"71331","name":"-- outboard"},{"sitc":"71332","name":"-- other than outboard"},{"sitc":"7138","name":"Internal combustion piston engines, nes"},{"sitc":"7139","name":"Piston engines parts, nes, falling in headings: 7132, 7133 and 7138"},{"sitc":"714","name":"Engines and motors, non-electric; parts, nes; group 714, item 71888"},{"sitc":"7144","name":"Reaction engines"},{"sitc":"7148","name":"Gas turbines, nes"},{"sitc":"71481","name":"Turbo-propellers"},{"sitc":"71488","name":"Other gas turbines, nes"},{"sitc":"7149","name":"Parts, nes of the engines and motors of group 714 and item 71888"},{"sitc":"71491","name":"Parts, nes of reaction engines or turbo-propellers"},{"sitc":"71499","name":"Parts, nes of the engines and motors of headings 71488 and 71888"},{"sitc":"716","name":"Rotating electric plant and parts thereof, nes"},{"sitc":"7161","name":"Motors and generators, direct current"},{"sitc":"7162","name":"Electric motors, generators (not direct current); generating sets"},{"sitc":"71621","name":"Electric motors (including ac/dc motors), other than direct current"},{"sitc":"71622","name":"Generators, alternating current"},{"sitc":"71623","name":"Generating sets with internal combustion piston engines"},{"sitc":"7163","name":"Rotary converters"},{"sitc":"7169","name":"Parts, nes, of rotating electric plant"},{"sitc":"718","name":"Other power generating machinery and parts thereof, nes"},{"sitc":"7187","name":"Nuclear reactors, and parts thereof, nes"},{"sitc":"7188","name":"Engines and motors, nes (wind, hot air engines, water wheel, etc)"},{"sitc":"71881","name":"Water turbines"},{"sitc":"71882","name":"Other hydraulic engines and motors (including waterwheels)"},{"sitc":"71888","name":"Other engines and motors, nes"},{"sitc":"71889","name":"Regulators for and parts, nes, of headings 71881, 71882"},{"sitc":"72","name":"Machinery specialized for particular industries"},{"sitc":"721","name":"Agricultural machinery (excluding tractors) and parts thereof, nes"},{"sitc":"7211","name":"Agricultural and horticultural machinery for soil preparation, etc"},{"sitc":"72111","name":"Ploughs"},{"sitc":"72112","name":"Seeders, planters, etc (other than hand tools)"},{"sitc":"72113","name":"Scarifiers, cultivators, weeders, etc (other than hand tools)"},{"sitc":"72118","name":"Other agricultural, horticultural machinery; lawn, ground rollers"},{"sitc":"72119","name":"Parts, nes of the machinery falling within heading 7211"},{"sitc":"7212","name":"Harvesting and threshing machines; fodder presses, etc; parts nes"},{"sitc":"72121","name":"Lawn mowers"},{"sitc":"72122","name":"Combine harvester-thresher"},{"sitc":"72123","name":"Other harvesting, threshing machines; mowers, straw, fodder presses"},{"sitc":"72124","name":"Agricultural cleaning, grading machines"},{"sitc":"72129","name":"Parts, nes, of the machines falling within heading 7212"},{"sitc":"7213","name":"Dairy machinery, nes (including milking machines), and parts nes"},{"sitc":"72131","name":"Milking machines"},{"sitc":"72138","name":"Other dairy machinery, nes"},{"sitc":"72139","name":"Parts, nes of the machinery falling within heading 7213"},{"sitc":"7219","name":"Agricultural machinery and appliances, nes, and parts thereof, nes"},{"sitc":"72191","name":"Presses, crushers and other machinery for wine, cider-making, etc"},{"sitc":"72197","name":"Other agricultural, horticultural, poultry-keeping, etc machinery"},{"sitc":"72198","name":"Parts, nes of the machinery falling within heading 72191"},{"sitc":"72199","name":"Parts, nes of the machinery and appliances of heading 72197"},{"sitc":"722","name":"Tractors (other than those falling in heading 74411 and 7832)"},{"sitc":"7223","name":"Track-laying tractors"},{"sitc":"7224","name":"Wheeled tractors (other than those falling in heading 74411, 7832)"},{"sitc":"723","name":"Civil engineering, contractors' plant and equipment and parts, nes"},{"sitc":"7233","name":"Road rollers, mechanically propelled"},{"sitc":"7234","name":"Construction and mining machinery, nes"},{"sitc":"72341","name":"Bulldozers, angledozers and levellers, self-propelled"},{"sitc":"72342","name":"Mechanical shovels and excavators, self-propelled"},{"sitc":"72343","name":"Other excavating, tamping, boring, etc, machinery, self-propelled"},{"sitc":"72344","name":"Boring and sinking machinery, not self-propelled"},{"sitc":"72345","name":"Pile drivers; snow-ploughs, not self -propelled"},{"sitc":"72346","name":"Other excavating, levelling, etc machinery, not self-propelled"},{"sitc":"72348","name":"Machines and mechanical appliance for public works, nes"},{"sitc":"7239","name":"Parts, nes of machinery and equipment of headings 72341 to 72346"},{"sitc":"724","name":"Textile and leather machinery, and parts thereof, nes"},{"sitc":"7243","name":"Sewing machines, furniture, needles etc, and parts thereof, nes"},{"sitc":"72431","name":"Sewing machines"},{"sitc":"72439","name":"Sewing machine needles; furniture specially for sewing; parts, nes"},{"sitc":"7244","name":"Machines for extruding man-made textile; other textile machinery"},{"sitc":"72441","name":"Machine for extruding man-made textiles"},{"sitc":"72442","name":"Machines for processing natural or man-made textile fibres, nes"},{"sitc":"72443","name":"Textile spinning, twisting, doubling, throwing and reeling machines"},{"sitc":"72449","name":"Parts, nes, and accessories for use in machines of heading 7244"},{"sitc":"7245","name":"Weaving, knitting, etc, machines, machines for preparing yarns, etc"},{"sitc":"72451","name":"Weaving machines (looms)"},{"sitc":"72452","name":"Knitting machines"},{"sitc":"72453","name":"Gimping, warping, netting, etc machines"},{"sitc":"72454","name":"Machinery for the manufacture or finishing of felt, and parts, nes"},{"sitc":"7246","name":"Auxiliary machinery for use with those of headings 72451 to 72453"},{"sitc":"72461","name":"Auxiliary machinery for use with those of headings 72451 to 72453"},{"sitc":"72469","name":"Parts, nes, accessories for machines of headings 72451-53 and 72461"},{"sitc":"7247","name":"Textile machinery, nes for cleaning, cutting, etc, and parts nes"},{"sitc":"72471","name":"Clothes-washing machines, of a dry linen capacity of more than 6 kg"},{"sitc":"72472","name":"Dry-cleaning machines"},{"sitc":"72473","name":"Drying machines, industrial"},{"sitc":"72474","name":"Other textile machines, nes"},{"sitc":"72479","name":"Parts, nes of the machines falling within headings 7247 and 7751"},{"sitc":"7248","name":"Machinery for preparing, tanning, working leather, etc; parts nes"},{"sitc":"725","name":"Paper and paper manufacture machinery, and parts thereof, nes"},{"sitc":"7251","name":"Machinery for making, finishing cellulose pulp, paper or paperboard"},{"sitc":"72511","name":"Machinery for making cellulosic pulp"},{"sitc":"72512","name":"Machinery for making or finishing paper or paperboard"},{"sitc":"7252","name":"Machinery for making paper pulp, paper, paperboard; cutting machines"},{"sitc":"7259","name":"Parts, nes of the machines falling within heading 725"},{"sitc":"72591","name":"Parts, nes of the machines falling within heading 7251"},{"sitc":"72599","name":"Parts, nes of the machines falling within heading 7252"},{"sitc":"726","name":"Printing, bookbinding machinery, and parts thereof, nes"},{"sitc":"7263","name":"Machinery, accessories for type-setting, for printing blocks, etc"},{"sitc":"72631","name":"Type founding or setting machinery; machinery for printing blocks"},{"sitc":"72632","name":"Printing type, impress flongs and matrices, printing plates, etc"},{"sitc":"7264","name":"Printing presses"},{"sitc":"72641","name":"Rotary printing presses"},{"sitc":"72642","name":"Platen printing presses"},{"sitc":"7267","name":"Other printing machinery; machines for uses ancilliary to printing"},{"sitc":"72671","name":"Printing machinery"},{"sitc":"72672","name":"Machines for uses ancillary to printing"},{"sitc":"7268","name":"Bookbinding machinery; parts thereof, nes"},{"sitc":"72681","name":"Bookbinding machinery (including book sewing machines)"},{"sitc":"72689","name":"Parts, nes of bookbinding machinery"},{"sitc":"7269","name":"Parts, nes of machines falling within headings 72631, 7264, 7267"},{"sitc":"72691","name":"Parts, nes of the machines falling within headings 72631"},{"sitc":"72699","name":"Parts, nes of the machines falling within headings 7264 and 7267"},{"sitc":"727","name":"Food-processing machines (non-domestic) and parts thereof, nes"},{"sitc":"7271","name":"Machinery for the grain milling industry; working cereals, parts"},{"sitc":"72711","name":"Machinery for grain milling, working of cereals or dried leguminous"},{"sitc":"72719","name":"Parts, nes of the machinery falling within heading 72711"},{"sitc":"7272","name":"Other food-processing machinery and parts thereof, nes"},{"sitc":"72721","name":"Machines, appliances for animal, vegetable fats and oils industry"},{"sitc":"72722","name":"Machinery, nes for the food and drink industries"},{"sitc":"72729","name":"Parts, nes for food-processing machinery falling in heading 72722"},{"sitc":"728","name":"Other machinery, equipment, for specialized industries; parts nes"},{"sitc":"7281","name":"Machine-tools for specialized industries; parts or accessories, nes"},{"sitc":"72811","name":"Mach-tools for working minerals or for working glass in the cold"},{"sitc":"72812","name":"Mach-tools for working wood, ebonite, or hard carving materials"},{"sitc":"72819","name":"Parts, nes of and accessories for machine-tools of heading 7281"},{"sitc":"7283","name":"Other mineral working machinery; and parts thereof, nes"},{"sitc":"72831","name":"Machinery for sorting, screening, washing, etc, mineral substances"},{"sitc":"72832","name":"Machinery for crushing, grinding, etc, mineral substances"},{"sitc":"72833","name":"Machinery for mixing, kneading mineral substances"},{"sitc":"72834","name":"Machinery for agglomerating, moulding, shaping, etc, minerals"},{"sitc":"72839","name":"Parts, nes of the machinery falling within heading 7283"},{"sitc":"7284","name":"Machinery for specialized industries and parts thereof, nes"},{"sitc":"72841","name":"Glass-working machines; machines discharge lamps, etc, parts nes"},{"sitc":"72842","name":"Machines for the rubber and plastics materials industries, nes"},{"sitc":"72843","name":"Machines and mechanical appliances for the tobacco industry, nes"},{"sitc":"72844","name":"Machines and mechanical appliances for treating wood, nes"},{"sitc":"72845","name":"Machines and mechanical appliances for treating metals, nes"},{"sitc":"72848","name":"Other machinery, mechanical appliances having individual functions"},{"sitc":"72849","name":"Parts, nes of machines in headings 72348, 72721, and 72842-72848"},{"sitc":"73","name":"Metalworking machinery"},{"sitc":"736","name":"Metalworking machine-tools, parts and accessories thereof, nes"},{"sitc":"7361","name":"Metal cutting machine-tools"},{"sitc":"73611","name":"Metalworking machine-tools; ultrasonic machine-tools"},{"sitc":"73612","name":"Gear-cutting machines"},{"sitc":"73613","name":"Lathes, metalworking"},{"sitc":"73614","name":"Reaming or milling machines, metalworking"},{"sitc":"73615","name":"Drilling and boring machines, metalworking"},{"sitc":"73616","name":"Sawing machines, metalworking"},{"sitc":"73617","name":"Planing machines, metalworking"},{"sitc":"73618","name":"Tapping or screw-cuttings machines"},{"sitc":"73619","name":"Other metal cutting or surfacing machine-tools"},{"sitc":"7362","name":"Metal forming machine-tool"},{"sitc":"73621","name":"Forging machines and stamping machines, metalworking"},{"sitc":"73622","name":"Bending, forming, folding or flattering machines, metalworking"},{"sitc":"73623","name":"Shearing, punching or notching machines, metalworking"},{"sitc":"73628","name":"Other metalworking presses"},{"sitc":"7367","name":"Other machines-tools for working metal or metal carbides, nes"},{"sitc":"7368","name":"Work holders, dividing heads for machine-tools, etc; tool holders"},{"sitc":"7369","name":"Parts, nes of and accessories for machine-tools of heading 736"},{"sitc":"737","name":"Metalworking machinery (other than machine-tools), and parts, nes"},{"sitc":"7371","name":"Metallurgy and metal foundry equipment, and parts thereof, nes"},{"sitc":"73711","name":"Converters, ladles, ingot mould and casting machines"},{"sitc":"73719","name":"Parts, nes of machines and appliances falling within heading 73711"},{"sitc":"7372","name":"Rolling mills, rolls therefor, and parts, nes of rolling mills"},{"sitc":"73721","name":"Rolling mills"},{"sitc":"73729","name":"Rolls for and parts, nes of rolling mills"},{"sitc":"7373","name":"Welding, brazing, cutting, etc machines and appliances, parts, nes"},{"sitc":"73731","name":"Gas operated welding, surface-tempering appliances, etc, parts, nes"},{"sitc":"73732","name":"Electric or laser-operated welders, etc, machines, and parts, nes"},{"sitc":"74","name":"General industrial machinery and equipment, nes, and parts of, nes"},{"sitc":"741","name":"Heating and cooling equipment and parts thereof, nes"},{"sitc":"7411","name":"Gas generators, and parts, nes of gas generators"},{"sitc":"7412","name":"Furnace burners; mechanical stokers, etc, and parts thereof, nes"},{"sitc":"7413","name":"Industrial and laboratory furnaces and ovens, etc, parts, nes"},{"sitc":"74131","name":"Industrial electric furnaces, ovens, heating equipment, parts, nes"},{"sitc":"74132","name":"Industrial, laboratory furnaces and ovens, non-electric, parts, nes"},{"sitc":"7414","name":"Non-domestic refrigerators and refrigerating equipment, parts, nes"},{"sitc":"74141","name":"Non-domestic refrigerators and refrigerating equipment"},{"sitc":"74149","name":"Parts, nes of refrigerators and refrigerating equipment"},{"sitc":"7415","name":"Air conditioning machines and parts thereof, nes"},{"sitc":"7416","name":"Machinery, plant, laboratory equipment for heating and cooling, nes"},{"sitc":"742","name":"Pumps for liquids; liquid elevators; and parts thereof, nes"},{"sitc":"7421","name":"Reciprocating pumps (other than those of heading 74281)"},{"sitc":"7422","name":"Centrifugal pumps (other than those of heading 74281)"},{"sitc":"7423","name":"Rotary pumps (other than those of heading 74281)"},{"sitc":"7428","name":"Other pumps for liquids and liquid elevators"},{"sitc":"74281","name":"Garage-type fuel or lubricant pumps"},{"sitc":"74288","name":"Pumps for liquids, nes and liquid elevators"},{"sitc":"7429","name":"Parts, nes of pumps and liquids elevators falling in heading 742"},{"sitc":"743","name":"Pumps, compressors; centrifuges; filtering apparatus; etc, parts"},{"sitc":"7431","name":"Air pumps, vacuum pumps and air or gas compressors"},{"sitc":"7432","name":"Parts, nes of the pumps and compressor falling within heading 7431"},{"sitc":"7433","name":"Free-piston generators for gas turbines and parts thereof, nes"},{"sitc":"7434","name":"Fans, blowers and the like, and parts thereof, nes"},{"sitc":"7435","name":"Centrifuges"},{"sitc":"7436","name":"Filtering and purifying machinery, apparatus for liquids and gases"},{"sitc":"7439","name":"Parts, nes of the machines falling within headings 7435 and 7436"},{"sitc":"744","name":"Mechanical handling equipment, and parts thereof, nes"},{"sitc":"7441","name":"Work trucks, of the type use in factories, dock areas, etc"},{"sitc":"74411","name":"Work trucks, of the type use in factories, dock areas, etc"},{"sitc":"74419","name":"Parts, nes of the trucks and tractors falling within heading 74411"},{"sitc":"7442","name":"Lifting, handling, loading machinery, telphers and conveyors"},{"sitc":"74421","name":"Pulley tackle and hoists, winches and capstans"},{"sitc":"74422","name":"Ships' derricks; cranes (non-cable cranes); mobile lifting frames"},{"sitc":"74423","name":"Pneumatic elevators and conveyors"},{"sitc":"74424","name":"Lifts and skip hoists"},{"sitc":"74425","name":"Escalator and moving pavements"},{"sitc":"74428","name":"Other lifting, handling, loading and unloading machinery, nes"},{"sitc":"7449","name":"Parts, nes of the machinery falling within heading 7442"},{"sitc":"745","name":"Other non-electric machinery, tools and mechanical apparatus, nes"},{"sitc":"7451","name":"Power hand tools, pneumatic or non-electric, and parts thereof, nes"},{"sitc":"74511","name":"Power hand tools pneumatic or self-contained non-electric motor"},{"sitc":"74519","name":"Parts, nes of the tools falling within heading 74511"},{"sitc":"7452","name":"Other non-electrical machines and parts thereof, nes"},{"sitc":"74521","name":"Calendering and other rolling machines and cylinders thereof, parts"},{"sitc":"74522","name":"Packaging, bottling, etc machinery"},{"sitc":"74523","name":"Parts, nes of the machinery falling within headings 74522 and 7753"},{"sitc":"74524","name":"Automatic vending machines; and parts thereof, nes"},{"sitc":"74525","name":"Weighing machinery"},{"sitc":"74526","name":"Weighing machine weights of all kinds; parts, nes"},{"sitc":"74527","name":"Spraying machinery; fire extinguishers; etc, and parts thereof, nes"},{"sitc":"749","name":"Non-electric parts and accessories of machinery, nes"},{"sitc":"7491","name":"Ball, roller or needle roller bearings"},{"sitc":"7492","name":"Cocks, valves and similar appliances, for pipes boiler shells, etc"},{"sitc":"7493","name":"Shaft, crank, bearing housing, pulley and pulley blocks, etc"},{"sitc":"7499","name":"Other non-electric parts and accessories of machinery, nes"},{"sitc":"74991","name":"Foundry moulds, and moulds for glass, mineral, rubber or plastic"},{"sitc":"74992","name":"Metal-plastic gaskets"},{"sitc":"74999","name":"Machinery parts, non-electrical, nes"},{"sitc":"75","name":"Office machines and automatic data processing equipment"},{"sitc":"751","name":"Office machines"},{"sitc":"7511","name":"Typewriters; cheque-writing machines"},{"sitc":"75111","name":"Typewriters with ordinary characters, electric"},{"sitc":"75112","name":"Typewriters with ordinary characters, non-electric"},{"sitc":"75118","name":"Typewriters, nes; cheque-writing machines"},{"sitc":"7512","name":"Calculating, accounting, cash registers, ticketing, etc, machines"},{"sitc":"75121","name":"Calculating machines"},{"sitc":"75122","name":"Accounting machines"},{"sitc":"75123","name":"Cash registers"},{"sitc":"75128","name":"Postage-franking, tickets-issuing and similar machines"},{"sitc":"7518","name":"Office machines, nes"},{"sitc":"75181","name":"Duplicating machine, hectograph or stencil"},{"sitc":"75182","name":"Photo-copying and thermo-copying apparatus"},{"sitc":"75188","name":"Other office machines, nes"},{"sitc":"752","name":"Automatic data processing machines and units thereof"},{"sitc":"7521","name":"Analogue and hybrid data processing machines"},{"sitc":"7522","name":"Complete digital data processing machines"},{"sitc":"7523","name":"Complete digital central processing units; digital processors"},{"sitc":"7524","name":"Digital central storage units, separately consigned"},{"sitc":"7525","name":"Peripheral units, including control and adapting units"},{"sitc":"7528","name":"Off-line data processing equipment, nes"},{"sitc":"759","name":"Parts, nes of and accessories for machines of headings 751 or 752"},{"sitc":"7591","name":"Parts, nes of and accessories for machines of headings 7511 or 7518"},{"sitc":"75911","name":"Parts, nes of and accessories for typewriters of heading 7511"},{"sitc":"75915","name":"Parts, accessories for machines of headings 75181, 75188 and 75118"},{"sitc":"75919","name":"Parts, nes of and accessories for photo and thermo-coping machines"},{"sitc":"7599","name":"Parts, nes of and accessories for machines of headings 7512 and 752"},{"sitc":"76","name":"Telecommunications, sound recording and reproducing equipment"},{"sitc":"761","name":"Television receivers"},{"sitc":"7611","name":"Television receivers, colour"},{"sitc":"7612","name":"Television receivers, monochrome"},{"sitc":"762","name":"Radio-broadcast receivers"},{"sitc":"7621","name":"Radio receivers for motor-vehicles"},{"sitc":"7622","name":"Portable radio receivers"},{"sitc":"7628","name":"Other radio receivers"},{"sitc":"763","name":"Gramophones, dictating machines and other sound recorders"},{"sitc":"7631","name":"Gramophones and record players, electric"},{"sitc":"76311","name":"Gramophones, electric, coin-operated"},{"sitc":"76318","name":"Other electric gramophones and record players"},{"sitc":"7638","name":"Other sound recording and reproducer, nes; video recorders"},{"sitc":"76381","name":"Television image and sound recorders or reproducers"},{"sitc":"76388","name":"Dictating machines and other sound recorders and reproducers, nes"},{"sitc":"764","name":"Telecommunication equipment, nes; parts and accessories, nes"},{"sitc":"7641","name":"Electrical line telephonic and telegraphic apparatus"},{"sitc":"7642","name":"Microphones; loud-speakers; audio-frequency electric amplifiers"},{"sitc":"7643","name":"Television, radio-broadcasting; transmitters, etc"},{"sitc":"7648","name":"Telecommunications equipment, nes"},{"sitc":"76481","name":"Radiotelephonic or radiotelegraphic receivers"},{"sitc":"76482","name":"Television cameras"},{"sitc":"76483","name":"Radio navigational aid apparatus, radar apparatus etc"},{"sitc":"7649","name":"Parts, nes of and accessories for apparatus falling in heading 76"},{"sitc":"76491","name":"Parts, nes of the apparatus falling within heading 7641"},{"sitc":"76492","name":"Parts, nes of the apparatus, equipment falling within heading 7642"},{"sitc":"76493","name":"Parts, nes of the apparatus of the heading 761, 762, 7643 and 7648"},{"sitc":"76499","name":"Parts, nes of and accessories for apparatus falling in heading 763"},{"sitc":"77","name":"Electric machinery, apparatus and appliances, nes, and parts, nes"},{"sitc":"771","name":"Electric power machinery, and parts thereof, nes"},{"sitc":"7711","name":"Transformers, electrical"},{"sitc":"77111","name":"Liquid dielectric transformers"},{"sitc":"77118","name":"Other electric transformers"},{"sitc":"7712","name":"Other electric power machinery, parts, nes"},{"sitc":"77121","name":"Static converters, rectifiers and rectifying apparatus"},{"sitc":"77122","name":"Inductors"},{"sitc":"77129","name":"Parts, nes of the electric power machinery falling in heading 771"},{"sitc":"772","name":"Electrical apparatus for making and breaking electrical circuits"},{"sitc":"7721","name":"Switches, relays, fuses, etc; switchboards and control panels, nes"},{"sitc":"7722","name":"Printed circuits, and parts thereof, nes"},{"sitc":"7723","name":"Fixed, variable resistors, other than heating resistors, parts, nes"},{"sitc":"773","name":"Equipment for distribution of electricity"},{"sitc":"7731","name":"Insulated electric wire, cable, bars, etc"},{"sitc":"7732","name":"Electrical insulating equipment"},{"sitc":"77321","name":"Electrical insulated conduit tubing and joints, of base metal"},{"sitc":"77322","name":"Electrical insulators of glass"},{"sitc":"77323","name":"Electrical insulators of ceramic materials"},{"sitc":"77324","name":"Electrical insulators of other materials"},{"sitc":"77325","name":"Glass electrical insulators fittings"},{"sitc":"77326","name":"Ceramic electrical insulators fittings"},{"sitc":"77327","name":"Other electrical insulators fittings nes"},{"sitc":"774","name":"Electro-medical and radiological equipment"},{"sitc":"7741","name":"Electro-medical equipment"},{"sitc":"7742","name":"X-ray apparatus and equipment; accessories; and parts, nes"},{"sitc":"775","name":"Household type equipment, nes"},{"sitc":"7751","name":"Household laundry equipment, nes"},{"sitc":"77511","name":"Domestic washing machines"},{"sitc":"77512","name":"Domestic drying machines"},{"sitc":"7752","name":"Domestic refrigerators and freezers"},{"sitc":"77521","name":"Domestic refrigerators"},{"sitc":"77522","name":"Domestic deep-freezers"},{"sitc":"7753","name":"Domestic dishwashing machines"},{"sitc":"7754","name":"Electric shavers and hair clippers, parts thereof, nes"},{"sitc":"7757","name":"Domestic electro-mechanical appliances; and parts thereof, nes"},{"sitc":"77571","name":"Domestic electric vacuum cleaners and floor polishers"},{"sitc":"77572","name":"Domestic electric room fans and vented hoods"},{"sitc":"77573","name":"Domestic electric food grinders and mixers, etc"},{"sitc":"77578","name":"Other domestic electric appliances, nes"},{"sitc":"77579","name":"Parts, nes of the electro-domestic equipment of heading 7757"},{"sitc":"7758","name":"Electro-thermic appliances, nes"},{"sitc":"77581","name":"Electric water heaters"},{"sitc":"77582","name":"Electric soil and space heaters"},{"sitc":"77583","name":"Electric hair dressing apparatus"},{"sitc":"77584","name":"Electric smoothing irons"},{"sitc":"77585","name":"Electric blankets"},{"sitc":"77586","name":"Electro-thermic domestic appliances, nes"},{"sitc":"77587","name":"Non-carbon electric heating resistors"},{"sitc":"77589","name":"Parts, nes of the electro-thermic appliances"},{"sitc":"776","name":"Thermionic, microcircuits, transistors, valves, etc"},{"sitc":"7761","name":"Television picture tubes, cathode ray"},{"sitc":"7762","name":"Other electronic valves and tubes"},{"sitc":"7763","name":"Diodes, transistors, photocells, etc"},{"sitc":"7764","name":"Electronic microcircuits"},{"sitc":"7768","name":"Crystals, and parts, nes of electronic components of heading 776"},{"sitc":"77681","name":"Piezo-electric crystals, mounted"},{"sitc":"77689","name":"Electronic components, parts nes"},{"sitc":"778","name":"Electrical machinery and apparatus, nes"},{"sitc":"7781","name":"Batteries and electric accumulators, and parts thereof, nes"},{"sitc":"77811","name":"Primary batteries and cells, and parts thereof, nes"},{"sitc":"77812","name":"Electric accumulators"},{"sitc":"77819","name":"Parts, nes of electric accumulators"},{"sitc":"7782","name":"Electric filament lamps and discharge lamps; arc-lamps"},{"sitc":"77821","name":"Filament lamps"},{"sitc":"77822","name":"Discharge lamps"},{"sitc":"77824","name":"Ultraviolet, infra-red lamps and arc lamps"},{"sitc":"77829","name":"Parts nes of lamps falling within heading 7782"},{"sitc":"7783","name":"Automotive electrical equipment; and parts thereof, nes"},{"sitc":"77831","name":"Ignition, starting equipment, generators, etc, parts thereof, nes"},{"sitc":"77832","name":"Vehicles electric lighting equipment; defrosters, etc, parts, nes"},{"sitc":"7784","name":"Electro-mechanical hand tools, and parts thereof, nes"},{"sitc":"7788","name":"Other electrical machinery and equipment, nes"},{"sitc":"77881","name":"Electro-magnets etc"},{"sitc":"77882","name":"Electric traffic control equipment"},{"sitc":"77883","name":"Electric sound and visual signaling equipment"},{"sitc":"77884","name":"Electrical condensers"},{"sitc":"77885","name":"Particle accelerators, and parts thereof, nes"},{"sitc":"77886","name":"Other electrical appliances and apparatus, nes"},{"sitc":"77887","name":"Electrical carbons articles for electrical purposes"},{"sitc":"77889","name":"Electrical parts of machinery and apparatus, nes"},{"sitc":"78","name":"Road vehicles"},{"sitc":"781","name":"Passenger motor vehicles (excluding buses)"},{"sitc":"7810","name":"Passenger motor vehicles (excluding buses)"},{"sitc":"782","name":"Lorries and special purposes motor vehicles"},{"sitc":"7821","name":"Motor vehicles for the transport of goods or materials"},{"sitc":"7822","name":"Special purpose motor lorries and vans"},{"sitc":"783","name":"Road motor vehicles, nes"},{"sitc":"7831","name":"Public service type passenger motor vehicles"},{"sitc":"7832","name":"Road tractors for semi-trailers"},{"sitc":"784","name":"Motor vehicle parts and accessories, nes"},{"sitc":"7841","name":"Chassis fitted with engines, for vehicles of headings 722, 781-783"},{"sitc":"7842","name":"Bodies, for vehicles of headings 722, 781-783"},{"sitc":"7849","name":"Other parts and accessories, for vehicles of headings 722, 781-783"},{"sitc":"785","name":"Cycles, scooters, motorized or not; invalid carriages"},{"sitc":"7851","name":"Motorcycles, auto-cycles; side-cars of all kind, etc"},{"sitc":"7852","name":"Cycles, not motorized"},{"sitc":"7853","name":"Invalid carriages; parts, nes of articles of heading 785"},{"sitc":"78531","name":"Invalid carriages"},{"sitc":"78539","name":"Parts, nes and accessories for articles of heading 785"},{"sitc":"786","name":"Trailers, and other vehicles, not motorized, nes"},{"sitc":"7861","name":"Trailers and transports containers"},{"sitc":"78611","name":"Housing or camping trailers"},{"sitc":"78612","name":"Trailers for the transports of goods"},{"sitc":"78613","name":"Containers for carriage by one or more modes of transport"},{"sitc":"7868","name":"Other not mechanically propelled vehicles; and parts, nes"},{"sitc":"78681","name":"Other not mechanically propelled vehicles"},{"sitc":"78689","name":"Parts, nes of trailers and vehicles of heading 78681"},{"sitc":"79","name":"Other transport equipment"},{"sitc":"791","name":"Railway vehicles and associated equipment"},{"sitc":"7911","name":"Rail locomotives, electric"},{"sitc":"7912","name":"Other rail locomotives; tenders"},{"sitc":"7913","name":"Mechanically propelled railway, tramway, trolleys, etc"},{"sitc":"7914","name":"Railway, tramway passenger coaches, etc, not mechanically propelled"},{"sitc":"7915","name":"Railway and tramway freight, etc, not mechanically propelled"},{"sitc":"79151","name":"Railway service vehicles, not mechanically propelled"},{"sitc":"79152","name":"Railway freight cars"},{"sitc":"7919","name":"Railway track fixtures, and fittings, etc, parts nes of heading 791"},{"sitc":"79191","name":"Railway track fixtures and fittings, parts thereof, nes"},{"sitc":"79199","name":"Parts, nes of the railway, tramway locomotives, headings 7911-7915"},{"sitc":"792","name":"Aircraft and associated equipment, and parts thereof, nes"},{"sitc":"7921","name":"Helicopters"},{"sitc":"7922","name":"Aircraft of an unladen weight not exceeding 2000 kg"},{"sitc":"7923","name":"Aircraft of an unladen weight from 2000 kg to 15000 kg"},{"sitc":"7924","name":"Aircraft of an unladen weight exceeding 15000 kg"},{"sitc":"7928","name":"Aircraft, nes and associated equipment"},{"sitc":"79281","name":"Gliders, kites, rotochutes"},{"sitc":"79282","name":"Balloons and airships"},{"sitc":"79283","name":"Aircraft launching gear; ground flying trainers; and parts nes"},{"sitc":"7929","name":"Parts, nes of the aircraft of heading 792"},{"sitc":"793","name":"Ships, boats and floating structures"},{"sitc":"7931","name":"Warships"},{"sitc":"7932","name":"Ships, boats and other vessels"},{"sitc":"79321","name":"Yachts and sports vessels"},{"sitc":"79322","name":"Tankers of all kinds"},{"sitc":"79323","name":"Other cargo vessels"},{"sitc":"79324","name":"Trawlers and other fishing vessels; factory ships, etc"},{"sitc":"79328","name":"Ships, boats and other vessels, nes"},{"sitc":"7933","name":"Ships, boats and other vessels for breaking up"},{"sitc":"7938","name":"Tugs, special purpose vessels and floating structures"},{"sitc":"79381","name":"Tugs"},{"sitc":"79382","name":"Special purpose vessels, floating docks, etc"},{"sitc":"79383","name":"Floating structures, other than vessels"},{"sitc":"8","name":"Miscellaneous manufactured articles"},{"sitc":"81","name":"Sanitary, plumbing, heating, lighting fixtures and fittings, nes"},{"sitc":"812","name":"Sanitary, plumbing, heating, lighting fixtures and fittings, nes"},{"sitc":"8121","name":"Central heating equipment, not electrically heated, parts, nes"},{"sitc":"8122","name":"Ceramic plumbing fixtures"},{"sitc":"8124","name":"Lighting fixture and fittings, lamps, lanterns, and parts, nes"},{"sitc":"81241","name":"Illuminating, signaling glassware and optical elements of glass"},{"sitc":"81242","name":"Lamps and lighting fittings, of base metal, and parts thereof, nes"},{"sitc":"81243","name":"Portable electric battery and magneto lamps"},{"sitc":"82","name":"Furniture and parts thereof"},{"sitc":"821","name":"Furniture and parts thereof"},{"sitc":"8211","name":"Chairs and other seats; and parts thereof, nes"},{"sitc":"82111","name":"Chairs and other seats, whether or not convertible into beds"},{"sitc":"82119","name":"Parts, nes of chairs and other seats falling in heading 82111"},{"sitc":"8212","name":"Furniture for medical, surgical, dental or veterinary practice"},{"sitc":"82121","name":"Medical, surgical, dental or veterinary furniture, and parts, nes"},{"sitc":"82122","name":"Mattress supports; articles of bedding, etc, parts thereof, nes"},{"sitc":"8219","name":"Other furniture and parts thereof, nes"},{"sitc":"82191","name":"Furniture, nes of metal"},{"sitc":"82192","name":"Furniture, nes of wood"},{"sitc":"82199","name":"Furniture, nes of other materials; parts, nes"},{"sitc":"83","name":"Travel goods, handbags and similar containers"},{"sitc":"831","name":"Travel goods, handbags etc, of leather, plastics, textile, others"},{"sitc":"8310","name":"Travel goods, handbags etc, of leather, plastics, textile, others"},{"sitc":"83101","name":"Handbags"},{"sitc":"83102","name":"Travel goods and toilet-cases"},{"sitc":"83103","name":"Satchels and brief-cases"},{"sitc":"83109","name":"Other similar containers, of leather, plastics, textile, etc"},{"sitc":"84","name":"Articles of apparel and clothing accessories"},{"sitc":"842","name":"Men's and boys' outerwear, textile fabrics not knitted or crocheted"},{"sitc":"8421","name":"-- overcoats and other coats"},{"sitc":"84211","name":"---- of wool or fine animal hair"},{"sitc":"84219","name":"---- of other fibres"},{"sitc":"8422","name":"-- suits"},{"sitc":"84221","name":"---- of wool or fine animal hair"},{"sitc":"84222","name":"---- of cotton"},{"sitc":"84223","name":"---- of man-made fibres"},{"sitc":"84229","name":"---- of other fibres"},{"sitc":"8423","name":"-- trousers, breeches and the like"},{"sitc":"84231","name":"---- of wool or fine animal hair"},{"sitc":"84232","name":"---- of cotton"},{"sitc":"84233","name":"---- of man-made fibres"},{"sitc":"84239","name":"---- of other fibres"},{"sitc":"8424","name":"-- jackets, blazers and the like"},{"sitc":"84241","name":"---- of wool or fine animal hair"},{"sitc":"84242","name":"---- of cotton"},{"sitc":"84243","name":"---- of man-made fibres"},{"sitc":"84249","name":"---- of other fibres"},{"sitc":"8429","name":"-- other outer garments"},{"sitc":"84291","name":"---- of the fabrics of headings 65732, 65733 and 65739"},{"sitc":"84292","name":"---- of wool or fine animal hair"},{"sitc":"84293","name":"---- of cotton"},{"sitc":"84294","name":"---- of man-made fibres"},{"sitc":"84299","name":"---- of other fibres"},{"sitc":"843","name":"Womens, girls, infants outerwear, textile, not knitted or crocheted"},{"sitc":"8431","name":"-- coats and jackets"},{"sitc":"84311","name":"---- of wool or fine animal hair"},{"sitc":"84312","name":"---- of cotton"},{"sitc":"84313","name":"---- of man-made fibres"},{"sitc":"84319","name":"---- of other fibres"},{"sitc":"8432","name":"-- suits and costumes"},{"sitc":"84321","name":"---- of wool, fine hair"},{"sitc":"84322","name":"---- of cotton"},{"sitc":"84323","name":"---- of man-made fibres"},{"sitc":"84329","name":"---- of other fibres"},{"sitc":"8433","name":"-- dresses"},{"sitc":"84331","name":"---- of wool or fine animal hair"},{"sitc":"84332","name":"---- of cotton"},{"sitc":"84333","name":"---- of man-made fibres"},{"sitc":"84339","name":"---- of other fibres"},{"sitc":"8434","name":"-- skirts"},{"sitc":"84341","name":"---- of wool or fine animal hair"},{"sitc":"84342","name":"---- of cotton"},{"sitc":"84343","name":"---- of man-made fibres"},{"sitc":"84349","name":"---- of other fibres"},{"sitc":"8435","name":"-- blouses"},{"sitc":"84351","name":"---- of cotton"},{"sitc":"84352","name":"---- of man-made fibres"},{"sitc":"84359","name":"---- of other fibres"},{"sitc":"8439","name":"-- other outer garments of textile fabrics, not knitted, crocheted"},{"sitc":"84391","name":"---- of the fabrics of headings 65732, 65733 and 65739"},{"sitc":"84392","name":"---- of wool or fine animal hair"},{"sitc":"84393","name":"---- of cotton"},{"sitc":"84394","name":"---- of man-made fibres"},{"sitc":"84399","name":"---- of other fibres"},{"sitc":"844","name":"Under garments of textile fabrics, not knitted or crocheted"},{"sitc":"8441","name":"-- mens and boys shirts"},{"sitc":"84411","name":"---- of cotton"},{"sitc":"84412","name":"---- of synthetic fibres"},{"sitc":"84419","name":"---- of other fibres"},{"sitc":"8442","name":"-- mens, boys under garments; other than shirts"},{"sitc":"84421","name":"---- of cotton"},{"sitc":"84422","name":"---- of synthetic fibres"},{"sitc":"84429","name":"---- of other fibres"},{"sitc":"8443","name":"-- womens, girls, infants under garments, textile, not knitted, etc"},{"sitc":"84431","name":"-- of cotton"},{"sitc":"84432","name":"-- of synthetic fibres"},{"sitc":"84439","name":"-- of other fibres"},{"sitc":"845","name":"Outerwear knitted or crocheted, not elastic nor rubberized"},{"sitc":"8451","name":"-- jerseys, pullovers, slip-overs, cardigans, etc"},{"sitc":"84511","name":"---- of wool or fine animal hair"},{"sitc":"84512","name":"---- of cotton"},{"sitc":"84513","name":"---- of synthetic fibres"},{"sitc":"84514","name":"---- of regenerated fibres"},{"sitc":"84519","name":"---- of other fibres"},{"sitc":"8452","name":"-- womens, girls, infants, suits, dresses, etc, knitted, crocheted"},{"sitc":"84521","name":"---- of wool or fine animal hair"},{"sitc":"84522","name":"---- of cotton"},{"sitc":"84523","name":"---- of synthetic fibres"},{"sitc":"84524","name":"---- of regenerated fibres"},{"sitc":"84529","name":"---- of other fibres"},{"sitc":"8459","name":"-- other, clothing accessories, non-elastic, knitted or crocheted"},{"sitc":"84591","name":"---- of wool or fine animal hair"},{"sitc":"84592","name":"---- of cotton"},{"sitc":"84593","name":"---- of synthetic fibres"},{"sitc":"84594","name":"---- of regenerated fibres"},{"sitc":"84599","name":"---- of other fibres"},{"sitc":"846","name":"Under-garments, knitted or crocheted"},{"sitc":"8461","name":"-- of wool or fine animal hair, not elastic nor rubberized"},{"sitc":"84611","name":"---- panty hose (tights)"},{"sitc":"84619","name":"---- other wool or fine animal hair under garments"},{"sitc":"8462","name":"-- of cotton, not elastic nor rubberized"},{"sitc":"84621","name":"---- men's and boys, shirts"},{"sitc":"84629","name":"---- other cotton under garments"},{"sitc":"8463","name":"-- of synthetic fibres not elastic nor rubberized"},{"sitc":"84631","name":"---- panty hose (tights)"},{"sitc":"84632","name":"---- men's and boys', shirts"},{"sitc":"84633","name":"---- other under garments, men's and boys',"},{"sitc":"84634","name":"---- other under garments, women's, girls' and infants'"},{"sitc":"8464","name":"-- of other fibres, not elastic nor rubberized"},{"sitc":"84641","name":"---- of regenerated fibres"},{"sitc":"84649","name":"---- of other fibres, nes"},{"sitc":"8465","name":"Corsets, garters, etc, not knitted or crocheted, elastic or not"},{"sitc":"84651","name":"Brassieres"},{"sitc":"84652","name":"Corsets, braces, suspenders, garters and the like"},{"sitc":"847","name":"Clothing accessories, of textile fabrics, nes"},{"sitc":"8471","name":"Clothing accessories, of textile fabrics, not knitted or crocheted"},{"sitc":"84711","name":"Handkerchiefs"},{"sitc":"84712","name":"Shawls, scarves, mantillas, veils and the like"},{"sitc":"84713","name":"Ties, bow ties and cravats"},{"sitc":"84714","name":"Gloves, mittens, stockings, socks and sockettes"},{"sitc":"84719","name":"Made up accessories, nes, for articles of apparel"},{"sitc":"8472","name":"Clothing accessories, knitted or crocheted, nes"},{"sitc":"84721","name":"Gloves, mittens and mitts, not elastic nor rubberized"},{"sitc":"84722","name":"Stockings, socks and the like, not elastic nor rubberized"},{"sitc":"84723","name":"Articles, nes, elastic or rubberized"},{"sitc":"848","name":"Articles of apparel, clothing accessories, non-textile, headgear"},{"sitc":"8481","name":"Articles of apparel, clothing accessories of leather"},{"sitc":"8482","name":"Articles of apparel, clothing accessories of plastic or rubber"},{"sitc":"84821","name":"-- of artificial plastic materials, including gloves"},{"sitc":"84822","name":"-- of unhardened vulcanized rubber, including gloves"},{"sitc":"8483","name":"Fur clothing (not headgear) and other articles made of furskins"},{"sitc":"84831","name":"Articles of furskin, nes"},{"sitc":"84832","name":"Artificial fur and articles made thereof, nes"},{"sitc":"8484","name":"Headgear and fitting thereof, nes"},{"sitc":"84841","name":"Felt hats and other felt headgear"},{"sitc":"84842","name":"Hats and other headgear, plaited"},{"sitc":"84843","name":"Hats and other headgear, knitted, crocheted, made of lace, textile"},{"sitc":"84848","name":"Head-bands, linings, covers, foundations, frames, etc"},{"sitc":"84849","name":"Other headgear"},{"sitc":"85","name":"Footwear"},{"sitc":"851","name":"Footwear"},{"sitc":"8510","name":"Footwear"},{"sitc":"85101","name":"Footwear with outer soles and uppers of rubber or plastic"},{"sitc":"85102","name":"Footwear with outer soles of leather, of rubber or plastic"},{"sitc":"85103","name":"Footwear with outer soles of wood or cork"},{"sitc":"85104","name":"Footwear with outer soles of other materials"},{"sitc":"85105","name":"Gaiters, leggings, putties, shin-guards, etc, and parts thereof"},{"sitc":"87","name":"Professional, scientific, controlling instruments, apparatus, nes"},{"sitc":"871","name":"Optical instruments and apparatus"},{"sitc":"8710","name":"Optical instruments and apparatus"},{"sitc":"87101","name":"Refracting telescopes, monocular and binocular"},{"sitc":"87102","name":"Astronomical instruments, nes, and mountings thereof"},{"sitc":"87103","name":"Microscopes and diffraction apparatus, electron and proton"},{"sitc":"87104","name":"Compound optical microscopes"},{"sitc":"87109","name":"Optical appliance and instruments, nes; lasers (other than diodes)"},{"sitc":"872","name":"Medical instruments and appliances, nes"},{"sitc":"8720","name":"Medical instruments and appliances, nes"},{"sitc":"87201","name":"Dental instruments and appliances"},{"sitc":"87202","name":"Medical, surgical and veterinary instruments and appliances"},{"sitc":"87203","name":"Mechano-therapy appliances; massage apparatus; etc"},{"sitc":"873","name":"Meters and counters, nes"},{"sitc":"8731","name":"Gas, liquid and electricity supply or production meters; etc"},{"sitc":"8732","name":"Counting devices non-electrical; stroboscopes"},{"sitc":"874","name":"Measuring, checking, analysis, controlling instruments, nes, parts"},{"sitc":"8741","name":"Surveying, navigational, compasses, etc, instruments, nonelectrical"},{"sitc":"87411","name":"Navigational instruments, non-electrical; compasses"},{"sitc":"87412","name":"Surveying hydrographic, geophysical, instruments, etc nonelectrical"},{"sitc":"8742","name":"Drawing, marking-out and mathematical calculating instruments, etc"},{"sitc":"87421","name":"Drawing, marking-out and mathematical calculating instruments, etc"},{"sitc":"87429","name":"Parts, nes of and accessories for the instruments of heading 87421"},{"sitc":"8743","name":"Gas, liquid control instruments and apparatus, non-electrical"},{"sitc":"8744","name":"Nonmechanical or electrical instruments for physical, etc, analysis"},{"sitc":"8745","name":"Measuring, controlling and scientific instruments, nes"},{"sitc":"87451","name":"Balances, non-electric, of a sensitivity of 5 cg or better"},{"sitc":"87452","name":"Instruments, etc for demonstrational purposes only"},{"sitc":"87453","name":"Apparatus for mechanically testing hardness, strength, etc material"},{"sitc":"87454","name":"Thermometers, hydrometers, etc, non-electric"},{"sitc":"8748","name":"Electrical measuring, controlling, etc, instruments, apparatus, nes"},{"sitc":"87481","name":"Electronic automatic regulators"},{"sitc":"87482","name":"Electronic instruments for measuring ionizing radiation"},{"sitc":"87483","name":"Other electronic measuring, controlling, etc, apparatus"},{"sitc":"87484","name":"Electro-mechanical (non-electronic) automatic regulators"},{"sitc":"87489","name":"Other electrical (non-electronic) measuring, etc, instruments, nes"},{"sitc":"8749","name":"Parts, nes, and accessories of headings 873, 8743, 87454 or 8748"},{"sitc":"88","name":"Photographic equipment and supplies, optical goods; watches, etc"},{"sitc":"881","name":"Photographic apparatus and equipment, nes"},{"sitc":"8811","name":"Photographic cameras, flashlight apparatus, parts, accessories, nes"},{"sitc":"88111","name":"Photographic cameras"},{"sitc":"88112","name":"Photographic flashlight apparatus"},{"sitc":"88119","name":"Parts, nes of and accessories of heading 8811"},{"sitc":"8812","name":"Cinematographic cameras, projectors, etc, parts, accessories, nes"},{"sitc":"88121","name":"-- for film under 16 mm width"},{"sitc":"88122","name":"-- for film 16 mm width or greater"},{"sitc":"88129","name":"Parts, nes of and accessories, of heading 8812"},{"sitc":"8813","name":"Photographic and cinematographic apparatus and equipment, nes"},{"sitc":"88131","name":"Image projectors, photographic enlargers, etc (non-cinematographic)"},{"sitc":"88139","name":"Photo, cine laboratories equipment, nes; screens for projectors"},{"sitc":"882","name":"Photographic and cinematographic supplies"},{"sitc":"8821","name":"Chemical products and flashlight materials for use in photografy"},{"sitc":"8822","name":"Photographic film, plates and paper (other than cinematograph film)"},{"sitc":"88221","name":"Photographic plates, film in the flat, sensitized, unexposed"},{"sitc":"88222","name":"Film in rolls, sensitized, unexposed"},{"sitc":"88223","name":"Paper, paperboard, cloth, sensitized, exposed or not, not developed"},{"sitc":"88224","name":"Plates, film, sensitized, exposed, but not developed"},{"sitc":"88225","name":"Plates, film, sensitized, exposed and developed"},{"sitc":"883","name":"Cinematograph film, exposed and developed"},{"sitc":"8830","name":"Cinematograph film, exposed and developed"},{"sitc":"884","name":"Optical goods nes"},{"sitc":"8841","name":"Lenses and other optical elements of any material"},{"sitc":"88411","name":"-- unmounted; sheets or plates of polarizing material"},{"sitc":"88412","name":"-- mounted"},{"sitc":"8842","name":"Spectacles and spectacle frames"},{"sitc":"88421","name":"Spectacle frames and mounting, and parts thereof"},{"sitc":"88422","name":"Spectacles, goggles and the like, corrective, protective, etc"},{"sitc":"885","name":"Watches and clocks"},{"sitc":"8851","name":"Watches, watch movements and case"},{"sitc":"88511","name":"Watches"},{"sitc":"88512","name":"Clocks with watch movements"},{"sitc":"88513","name":"Watch movements assembled"},{"sitc":"88514","name":"Watch cases and parts of watch cases"},{"sitc":"8852","name":"Clocks, clock movements and parts"},{"sitc":"88521","name":"Instrument panel clocks, for vehicles, aircraft or vessels"},{"sitc":"88522","name":"Clocks, nes"},{"sitc":"88523","name":"Time of day recording apparatus, etc"},{"sitc":"88524","name":"Time switches with clock, watch movement or with synchronous motor"},{"sitc":"88525","name":"Clock movements, assembled"},{"sitc":"88526","name":"Clock cases, and parts thereof"},{"sitc":"88529","name":"Clock and watch parts, nes"},{"sitc":"89","name":"Miscellaneous manufactured articles, nes"},{"sitc":"892","name":"Printed matter"},{"sitc":"8921","name":"Printed books, pamphlets, maps and globes"},{"sitc":"89211","name":"Printed books, booklets, brochures, pamphlets and leaflets"},{"sitc":"89212","name":"Children's picture books and painted books, etc"},{"sitc":"89213","name":"Maps, charts, etc; printed globes"},{"sitc":"8922","name":"Newspapers, journals and periodicals"},{"sitc":"8924","name":"Picture postcards, decalcomanias, etc, printed"},{"sitc":"89241","name":"Decalcomanias"},{"sitc":"89242","name":"Picture postcards, greeting cards, etc, printed by any process"},{"sitc":"8928","name":"Printed matter, nes"},{"sitc":"89281","name":"Paper and paperboard labels"},{"sitc":"89282","name":"Plans, drawings, for architectural, etc, purpose; manuscripts"},{"sitc":"89283","name":"Unused postage; stamp-impressed papers; stock; cheque books, etc"},{"sitc":"89284","name":"Calendars of paper or paperboard"},{"sitc":"89285","name":"Music, printed or in manuscript"},{"sitc":"89286","name":"Trade advertising material, catalogues and the like"},{"sitc":"89289","name":"Other printed matter"},{"sitc":"893","name":"Articles, nes of plastic materials"},{"sitc":"8931","name":"Plastic packing containers, lids, stoppers and other closures"},{"sitc":"8932","name":"Plastic sanitary and toilet articles"},{"sitc":"8933","name":"Personal adornments and ornaments articles of plastic"},{"sitc":"8935","name":"Articles of electric lighting of plastic"},{"sitc":"8939","name":"Miscellaneous articles of plastic"},{"sitc":"89391","name":"Polyvinyl chloride in the form of plates, flooring tiles, etc"},{"sitc":"89392","name":"Co-polymers of vinyl chloride, acetate, form of floor tiles, etc"},{"sitc":"89393","name":"Plastic roller blinds, venetian blinds, etc"},{"sitc":"89394","name":"Plastic office or school supplies"},{"sitc":"89399","name":"Other articles, nes of plastic"},{"sitc":"894","name":"Baby carriages, toys, games and sporting goods"},{"sitc":"8941","name":"Baby carriages and parts thereof, nes"},{"sitc":"8942","name":"Children's toys, indoor games, etc"},{"sitc":"89421","name":"Wheeled toys to be ridden by children; dolls' prams, etc"},{"sitc":"89422","name":"Dolls"},{"sitc":"89423","name":"Toys, nes; working models for recreational purposes"},{"sitc":"89424","name":"Indoor game equipment, table and funfair games for adults, children"},{"sitc":"89425","name":"Carnival and entertainment articles, Christmas adornments, etc"},{"sitc":"8946","name":"Non-military arms and ammunition therefor"},{"sitc":"89461","name":"Firearms, nes"},{"sitc":"89462","name":"Other arms (airguns, truncheons, etc)"},{"sitc":"89463","name":"Sporting, hunting and target-shooting ammunition and parts thereof"},{"sitc":"8947","name":"Other sporting goods and fairground amusements, etc"},{"sitc":"89471","name":"Fishing and hunting equipment, nes"},{"sitc":"89472","name":"Appliances, apparatus, accessories, etc, for sport, outdoor games"},{"sitc":"89473","name":"Fairground amusements; travelling circus, theatres, etc"},{"sitc":"895","name":"Office and stationary supplies, nes"},{"sitc":"8951","name":"Office and stationary supplies, of base metal"},{"sitc":"89511","name":"Office equipment, of base metal (other than those of heading 8219)"},{"sitc":"89512","name":"Stationery goods, of base metal"},{"sitc":"8952","name":"Pens, pencils and, fountain pens"},{"sitc":"89521","name":"Fountain pens, stylograph pens, and pencils, their holders, parts"},{"sitc":"89522","name":"Pen nibs and nib points"},{"sitc":"89523","name":"Pencils (other than of heading 89521), crayons, etc"},{"sitc":"8959","name":"Other office and stationary supplies"},{"sitc":"89591","name":"Writing ink, excluding printing ink"},{"sitc":"89592","name":"Slates and boards for writing or drawing"},{"sitc":"89593","name":"Date, sealing or numbering stamps, and the like"},{"sitc":"89594","name":"Typewriter ribbons, ink pads"},{"sitc":"89595","name":"Sealing wax; copying paste"},{"sitc":"896","name":"Works of art, collectors' pieces and antiques"},{"sitc":"8960","name":"Works of art, collectors' pieces and antiques"},{"sitc":"89601","name":"Hand paintings, drawings and pastels"},{"sitc":"89602","name":"Original engravings, prints and lithographs"},{"sitc":"89603","name":"Original sculptures and statuary"},{"sitc":"89604","name":"Stamps for philately"},{"sitc":"89605","name":"Coins, nature collections"},{"sitc":"89606","name":"Antiques of an age exceeding 100 years, nes"},{"sitc":"897","name":"Gold, silver ware, jewelry and articles of precious materials, nes"},{"sitc":"8972","name":"Imitation jewellery"},{"sitc":"8973","name":"Precious jewellery, goldsmiths' or silversmiths' wares"},{"sitc":"89731","name":"Precious metal jewellery (except watches and watches cases)"},{"sitc":"89732","name":"Articles of goldsmiths', silversmiths' wares, and parts thereof"},{"sitc":"89733","name":"Articles incorporating pearls, precious or semiprecious stones, nes"},{"sitc":"8974","name":"Other articles of precious metals or rolled precious metals, nes"},{"sitc":"898","name":"Musical instruments, parts and accessories thereof"},{"sitc":"8981","name":"Pianos, other string musical instruments"},{"sitc":"89811","name":"Pianos; harpsichords and other keyboard stringed instruments, harp"},{"sitc":"89819","name":"Other string musical instruments"},{"sitc":"8982","name":"Musical instruments, nes"},{"sitc":"89821","name":"Pipe and reed organs"},{"sitc":"89822","name":"Accordions, concertinas and the like; mouth organs"},{"sitc":"89823","name":"Other wind musical instruments"},{"sitc":"89824","name":"Percussion musical instruments"},{"sitc":"89825","name":"Electrical musical instruments"},{"sitc":"89829","name":"Other musical instruments"},{"sitc":"8983","name":"Sound recording tape, discs"},{"sitc":"89831","name":"Prepared media for sound or similar recording"},{"sitc":"89832","name":"Gramophone records, recorded tapes and other sound recorded media"},{"sitc":"8989","name":"Parts, nes of and accessories for musical instruments; metronomes"},{"sitc":"899","name":"Other miscellaneous manufactured articles, nes"},{"sitc":"8991","name":"Articles and manufacture of carving, moulding materials, nes"},{"sitc":"89911","name":"Articles of animal carving materials, nes"},{"sitc":"89919","name":"Articles of vegetable or mineral carving materials, nes"},{"sitc":"8993","name":"Candles, matches, combustible products, etc"},{"sitc":"89931","name":"Candles, tapers, night-lights and the like"},{"sitc":"89932","name":"Matches"},{"sitc":"89934","name":"Mechanical lighters and similar lighters, and parts thereof"},{"sitc":"89935","name":"Smoking pipes and parts; cigar and cigarette holder"},{"sitc":"89939","name":"Pyrophoric alloys; combustible products nes"},{"sitc":"8994","name":"Umbrellas, canes and similar articles and parts thereof"},{"sitc":"89941","name":"Umbrellas and sunshades"},{"sitc":"89942","name":"Canes, riding-crops, etc"},{"sitc":"89949","name":"Parts, fittings and accessories of articles of heading 89941-89942"},{"sitc":"8996","name":"Orthopaedic appliances, hearing aids, artificial parts of the body"},{"sitc":"89961","name":"Hearing aids"},{"sitc":"89962","name":"Orthopaedic appliances to compensate for a defect or disability"},{"sitc":"8997","name":"Basketwork, wickerwork; brooms, paint rollers, etc"},{"sitc":"89971","name":"Basketwork, wickerwork and articles of plaiting materials, nes"},{"sitc":"89972","name":"Brushes, brooms, mops, etc, of vegetable materials"},{"sitc":"8998","name":"Small-wares and toilet articles, nes; sieves; tailors' dummies, etc"},{"sitc":"89981","name":"Hand sieves and hand riddles"},{"sitc":"89982","name":"Powder-puffs, and pads for applying cosmetics"},{"sitc":"89983","name":"Buttons and button moulds, studs, etc; blanks and parts thereof"},{"sitc":"89984","name":"Slide fasteners and parts thereof"},{"sitc":"89985","name":"Combs, hair-slides and the like"},{"sitc":"89986","name":"Scent and similar sprays for toilet purposes"},{"sitc":"89987","name":"Tailors' dummies, etc; animated displays for window dressing"},{"sitc":"89988","name":"Feather dusters pre-1978"},{"sitc":"89989","name":"Corset busks pre-1978"},{"sitc":"8999","name":"Manufactured goods, nes"},{"sitc":"89991","name":"Articles made of gut, from bladders, etc"},{"sitc":"89992","name":"Skin and other parts of birds with feather, feather, etc"},{"sitc":"89993","name":"Artificial flowers, fruits etc, and parts thereof"},{"sitc":"89994","name":"Human hair worked; animal or artificial hair prepared for wigs"},{"sitc":"89995","name":"Wigs, false beards, etc, of human, animal hair or textile"},{"sitc":"89997","name":"Vacuum flasks, etc, complete with cases; parts thereof"},{"sitc":"89998","name":"Parachutes and parts thereof and accessories thereto"},{"sitc":"9","name":"Commodities and transactions not classified elsewhere in the SITC"},{"sitc":"91","name":"Postal packages not classified according to kind"},{"sitc":"911","name":"Postal packages not classified according to kind"},{"sitc":"9110","name":"Postal packages not classified according to kind"},{"sitc":"93","name":"Special transactions, commodity not classified according to class"},{"sitc":"931","name":"Special transactions, commodity not classified according to class"},{"sitc":"9310","name":"Special transactions, commodity not classified according to class"},{"sitc":"94","name":"Animals, live, nes, (including zoo animals, pets, insects, etc)"},{"sitc":"941","name":"Animals, live, nes, (including zoo animals, pets, insects, etc)"},{"sitc":"9410","name":"Animals, live, nes, (including zoo animals, pets, insects, etc)"},{"sitc":"95","name":"Armoured fighting vehicles, war firearms, ammunition, parts, nes"},{"sitc":"951","name":"Armoured fighting vehicles, war firearms, ammunition, parts, nes"},{"sitc":"9510","name":"Armoured fighting vehicles, war firearms, ammunition, parts, nes"},{"sitc":"95101","name":"Tanks and other armored fighting vehicles, motorized, parts, nes"},{"sitc":"95102","name":"Artillery weapons and other military firearms and projectors"},{"sitc":"95104","name":"Side-arms and parts nes"},{"sitc":"95105","name":"Revolvers and pistols"},{"sitc":"95106","name":"Bombs, torpedoes, missiles and similar ammunition of war; parts nes"},{"sitc":"95109","name":"Parts of arms"},{"sitc":"96","name":"Coin (other than gold coin), not being legal tender"},{"sitc":"961","name":"Coin (other than gold coin), not being legal tender"},{"sitc":"9610","name":"Coin (other than gold coin), not being legal tender"},{"sitc":"97","name":"Gold, non-monetary (excluding gold ores and concentrates)"},{"sitc":"971","name":"Gold, non-monetary (excluding gold ores and concentrates)"},{"sitc":"9710","name":"Gold, non-monetary (excluding gold ores and concentrates)"},{"sitc":"97101","name":"Gold, non-monetary, unwrought or semi-manufactured"},{"sitc":"97102","name":"Rolled gold on base metal or silver, unworked or semi-manufactured"},{"sitc":"97103","name":"Gold, silver and jewels sweepings, residues, lemels, waste, etc"}]); diff --git a/src/mocks/hierarchical/index.ts b/src/mocks/hierarchical/index.ts index 0d19551e3e..dbd0d18fe7 100644 --- a/src/mocks/hierarchical/index.ts +++ b/src/mocks/hierarchical/index.ts @@ -14,12 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { manyPieMock } from './many_pie'; +import { miniSunburstMock } from './mini_sunburst'; import { pieMock } from './pie'; import { sunburstMock } from './sunburst'; -import { miniSunburstMock } from './mini_sunburst'; -import { manyPieMock } from './many_pie'; export const mocks = { pie: pieMock, diff --git a/src/mocks/hierarchical/many_pie.ts b/src/mocks/hierarchical/many_pie.ts index 03429ba501..fb42d545bc 100644 --- a/src/mocks/hierarchical/many_pie.ts +++ b/src/mocks/hierarchical/many_pie.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export const manyPieMock = [ { origin: 'chn', exportVal: 1680027842644 }, diff --git a/src/mocks/hierarchical/mini_sunburst.ts b/src/mocks/hierarchical/mini_sunburst.ts index f9b40f3ca2..8b9be521fc 100644 --- a/src/mocks/hierarchical/mini_sunburst.ts +++ b/src/mocks/hierarchical/mini_sunburst.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export const miniSunburstMock = [ { sitc1: '7', dest: 'usa', exportVal: 553359100104 }, diff --git a/src/mocks/hierarchical/palettes.ts b/src/mocks/hierarchical/palettes.ts index 4e40d2f9e2..e96c9f191a 100644 --- a/src/mocks/hierarchical/palettes.ts +++ b/src/mocks/hierarchical/palettes.ts @@ -14,15 +14,528 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { RgbTuple } from '../../chart_types/partition_chart/layout/utils/color_library_wrappers'; -// prettier-ignore -const CET2s: RgbTuple[] = [[46, 34, 235], [49, 32, 237], [52, 30, 238], [56, 29, 239], [59, 28, 240], [63, 27, 241], [66, 27, 242], [70, 27, 242], [73, 27, 243], [77, 28, 244], [80, 29, 244], [84, 30, 245], [87, 31, 245], [91, 32, 246], [94, 33, 246], [97, 35, 246], [100, 36, 247], [103, 38, 247], [106, 39, 248], [109, 41, 248], [112, 42, 248], [115, 44, 249], [118, 45, 249], [121, 47, 249], [123, 48, 250], [126, 49, 250], [129, 51, 250], [132, 52, 251], [135, 53, 251], [137, 54, 251], [140, 56, 251], [143, 57, 251], [146, 58, 252], [149, 59, 252], [152, 60, 252], [155, 60, 252], [158, 61, 252], [162, 62, 252], [165, 63, 252], [168, 63, 252], [171, 64, 252], [175, 65, 252], [178, 65, 252], [181, 66, 252], [185, 66, 252], [188, 66, 252], [191, 67, 252], [195, 67, 252], [198, 68, 252], [201, 68, 251], [204, 69, 251], [207, 69, 251], [211, 70, 251], [214, 70, 251], [217, 71, 250], [219, 72, 250], [222, 73, 250], [225, 74, 249], [227, 75, 249], [230, 76, 248], [232, 78, 247], [234, 79, 246], [236, 81, 245], [238, 83, 244], [240, 85, 243], [242, 88, 241], [243, 90, 240], [244, 93, 238], [245, 96, 236], [246, 99, 234], [247, 102, 232], [248, 105, 230], [249, 108, 227], [249, 111, 225], [250, 114, 223], [250, 117, 220], [251, 120, 217], [251, 123, 215], [252, 127, 212], [252, 130, 210], [252, 133, 207], [252, 136, 204], [252, 139, 201], [253, 141, 199], [253, 144, 196], [253, 147, 193], [253, 150, 190], [253, 153, 188], [253, 156, 185], [253, 158, 182], [253, 161, 179], [253, 164, 177], [253, 166, 174], [253, 169, 171], [253, 171, 168], [253, 174, 165], [252, 176, 162], [252, 179, 160], [252, 181, 157], [252, 184, 154], [252, 186, 151], [253, 188, 148], [253, 191, 145], [253, 193, 142], [253, 195, 139], [253, 198, 136], [253, 200, 133], [253, 202, 130], [253, 204, 127], [253, 207, 124], [253, 209, 120], [253, 211, 117], [253, 213, 114], [253, 215, 110], [253, 217, 107], [253, 219, 104], [253, 221, 100], [252, 223, 96], [252, 225, 93], [252, 227, 89], [251, 229, 85], [250, 231, 81], [250, 232, 77], [249, 234, 73], [248, 235, 69], [246, 236, 65], [245, 237, 61], [243, 238, 57], [242, 239, 54], [240, 239, 50], [238, 239, 46], [235, 239, 43], [233, 239, 40], [231, 239, 37], [228, 239, 35], [225, 238, 33], [223, 238, 31], [220, 237, 29], [217, 236, 27], [214, 235, 26], [211, 234, 25], [209, 233, 24], [206, 232, 24], [203, 231, 23], [200, 230, 22], [197, 229, 22], [194, 228, 21], [191, 227, 21], [188, 226, 21], [185, 225, 20], [182, 224, 20], [179, 223, 20], [176, 221, 19], [173, 220, 19], [170, 219, 19], [167, 218, 18], [164, 217, 18], [161, 216, 17], [158, 215, 17], [154, 214, 17], [151, 213, 16], [148, 211, 16], [145, 210, 16], [142, 209, 15], [139, 208, 15], [136, 207, 15], [132, 206, 14], [129, 205, 14], [126, 204, 14], [122, 202, 13], [119, 201, 13], [116, 200, 13], [112, 199, 13], [109, 198, 12], [105, 197, 12], [102, 196, 12], [98, 194, 12], [94, 193, 12], [91, 192, 12], [87, 191, 12], [83, 190, 13], [79, 188, 14], [76, 187, 15], [72, 186, 16], [68, 185, 18], [65, 183, 20], [62, 182, 22], [59, 181, 25], [56, 179, 27], [54, 178, 30], [52, 176, 34], [51, 175, 37], [50, 173, 40], [50, 172, 44], [50, 170, 48], [51, 168, 51], [52, 167, 55], [53, 165, 59], [54, 163, 63], [56, 161, 67], [57, 160, 71], [59, 158, 74], [60, 156, 78], [62, 154, 82], [63, 152, 86], [64, 150, 90], [66, 148, 93], [67, 147, 97], [67, 145, 101], [68, 143, 104], [69, 141, 108], [69, 139, 111], [69, 137, 115], [70, 135, 118], [70, 133, 122], [69, 131, 125], [69, 129, 129], [69, 128, 132], [68, 126, 135], [67, 124, 139], [67, 122, 142], [66, 120, 145], [64, 118, 149], [63, 116, 152], [62, 114, 155], [60, 112, 158], [59, 110, 162], [57, 108, 165], [56, 106, 168], [54, 104, 171], [53, 102, 174], [51, 100, 177], [50, 98, 180], [48, 96, 183], [47, 93, 185], [46, 91, 188], [45, 89, 191], [44, 86, 193], [43, 84, 196], [42, 81, 199], [41, 79, 201], [40, 76, 204], [40, 73, 206], [39, 70, 209], [38, 68, 211], [38, 65, 213], [37, 62, 216], [37, 59, 218], [37, 56, 220], [37, 53, 222], [37, 50, 224], [37, 47, 227], [38, 44, 228], [40, 41, 230], [42, 39, 232], [44, 36, 234],]; +const CET2s: RgbTuple[] = [ + [46, 34, 235], + [49, 32, 237], + [52, 30, 238], + [56, 29, 239], + [59, 28, 240], + [63, 27, 241], + [66, 27, 242], + [70, 27, 242], + [73, 27, 243], + [77, 28, 244], + [80, 29, 244], + [84, 30, 245], + [87, 31, 245], + [91, 32, 246], + [94, 33, 246], + [97, 35, 246], + [100, 36, 247], + [103, 38, 247], + [106, 39, 248], + [109, 41, 248], + [112, 42, 248], + [115, 44, 249], + [118, 45, 249], + [121, 47, 249], + [123, 48, 250], + [126, 49, 250], + [129, 51, 250], + [132, 52, 251], + [135, 53, 251], + [137, 54, 251], + [140, 56, 251], + [143, 57, 251], + [146, 58, 252], + [149, 59, 252], + [152, 60, 252], + [155, 60, 252], + [158, 61, 252], + [162, 62, 252], + [165, 63, 252], + [168, 63, 252], + [171, 64, 252], + [175, 65, 252], + [178, 65, 252], + [181, 66, 252], + [185, 66, 252], + [188, 66, 252], + [191, 67, 252], + [195, 67, 252], + [198, 68, 252], + [201, 68, 251], + [204, 69, 251], + [207, 69, 251], + [211, 70, 251], + [214, 70, 251], + [217, 71, 250], + [219, 72, 250], + [222, 73, 250], + [225, 74, 249], + [227, 75, 249], + [230, 76, 248], + [232, 78, 247], + [234, 79, 246], + [236, 81, 245], + [238, 83, 244], + [240, 85, 243], + [242, 88, 241], + [243, 90, 240], + [244, 93, 238], + [245, 96, 236], + [246, 99, 234], + [247, 102, 232], + [248, 105, 230], + [249, 108, 227], + [249, 111, 225], + [250, 114, 223], + [250, 117, 220], + [251, 120, 217], + [251, 123, 215], + [252, 127, 212], + [252, 130, 210], + [252, 133, 207], + [252, 136, 204], + [252, 139, 201], + [253, 141, 199], + [253, 144, 196], + [253, 147, 193], + [253, 150, 190], + [253, 153, 188], + [253, 156, 185], + [253, 158, 182], + [253, 161, 179], + [253, 164, 177], + [253, 166, 174], + [253, 169, 171], + [253, 171, 168], + [253, 174, 165], + [252, 176, 162], + [252, 179, 160], + [252, 181, 157], + [252, 184, 154], + [252, 186, 151], + [253, 188, 148], + [253, 191, 145], + [253, 193, 142], + [253, 195, 139], + [253, 198, 136], + [253, 200, 133], + [253, 202, 130], + [253, 204, 127], + [253, 207, 124], + [253, 209, 120], + [253, 211, 117], + [253, 213, 114], + [253, 215, 110], + [253, 217, 107], + [253, 219, 104], + [253, 221, 100], + [252, 223, 96], + [252, 225, 93], + [252, 227, 89], + [251, 229, 85], + [250, 231, 81], + [250, 232, 77], + [249, 234, 73], + [248, 235, 69], + [246, 236, 65], + [245, 237, 61], + [243, 238, 57], + [242, 239, 54], + [240, 239, 50], + [238, 239, 46], + [235, 239, 43], + [233, 239, 40], + [231, 239, 37], + [228, 239, 35], + [225, 238, 33], + [223, 238, 31], + [220, 237, 29], + [217, 236, 27], + [214, 235, 26], + [211, 234, 25], + [209, 233, 24], + [206, 232, 24], + [203, 231, 23], + [200, 230, 22], + [197, 229, 22], + [194, 228, 21], + [191, 227, 21], + [188, 226, 21], + [185, 225, 20], + [182, 224, 20], + [179, 223, 20], + [176, 221, 19], + [173, 220, 19], + [170, 219, 19], + [167, 218, 18], + [164, 217, 18], + [161, 216, 17], + [158, 215, 17], + [154, 214, 17], + [151, 213, 16], + [148, 211, 16], + [145, 210, 16], + [142, 209, 15], + [139, 208, 15], + [136, 207, 15], + [132, 206, 14], + [129, 205, 14], + [126, 204, 14], + [122, 202, 13], + [119, 201, 13], + [116, 200, 13], + [112, 199, 13], + [109, 198, 12], + [105, 197, 12], + [102, 196, 12], + [98, 194, 12], + [94, 193, 12], + [91, 192, 12], + [87, 191, 12], + [83, 190, 13], + [79, 188, 14], + [76, 187, 15], + [72, 186, 16], + [68, 185, 18], + [65, 183, 20], + [62, 182, 22], + [59, 181, 25], + [56, 179, 27], + [54, 178, 30], + [52, 176, 34], + [51, 175, 37], + [50, 173, 40], + [50, 172, 44], + [50, 170, 48], + [51, 168, 51], + [52, 167, 55], + [53, 165, 59], + [54, 163, 63], + [56, 161, 67], + [57, 160, 71], + [59, 158, 74], + [60, 156, 78], + [62, 154, 82], + [63, 152, 86], + [64, 150, 90], + [66, 148, 93], + [67, 147, 97], + [67, 145, 101], + [68, 143, 104], + [69, 141, 108], + [69, 139, 111], + [69, 137, 115], + [70, 135, 118], + [70, 133, 122], + [69, 131, 125], + [69, 129, 129], + [69, 128, 132], + [68, 126, 135], + [67, 124, 139], + [67, 122, 142], + [66, 120, 145], + [64, 118, 149], + [63, 116, 152], + [62, 114, 155], + [60, 112, 158], + [59, 110, 162], + [57, 108, 165], + [56, 106, 168], + [54, 104, 171], + [53, 102, 174], + [51, 100, 177], + [50, 98, 180], + [48, 96, 183], + [47, 93, 185], + [46, 91, 188], + [45, 89, 191], + [44, 86, 193], + [43, 84, 196], + [42, 81, 199], + [41, 79, 201], + [40, 76, 204], + [40, 73, 206], + [39, 70, 209], + [38, 68, 211], + [38, 65, 213], + [37, 62, 216], + [37, 59, 218], + [37, 56, 220], + [37, 53, 222], + [37, 50, 224], + [37, 47, 227], + [38, 44, 228], + [40, 41, 230], + [42, 39, 232], + [44, 36, 234], +]; -// prettier-ignore -const turbo: RgbTuple[] = [[48, 18, 59], [50, 21, 67], [51, 24, 74], [52, 27, 81], [53, 30, 88], [54, 33, 95], [55, 36, 102], [56, 39, 109], [57, 42, 115], [58, 45, 121], [59, 47, 128], [60, 50, 134], [61, 53, 139], [62, 56, 145], [63, 59, 151], [63, 62, 156], [64, 64, 162], [65, 67, 167], [65, 70, 172], [66, 73, 177], [66, 75, 181], [67, 78, 186], [68, 81, 191], [68, 84, 195], [68, 86, 199], [69, 89, 203], [69, 92, 207], [69, 94, 211], [70, 97, 214], [70, 100, 218], [70, 102, 221], [70, 105, 224], [70, 107, 227], [71, 110, 230], [71, 113, 233], [71, 115, 235], [71, 118, 238], [71, 120, 240], [71, 123, 242], [70, 125, 244], [70, 128, 246], [70, 130, 248], [70, 133, 250], [70, 135, 251], [69, 138, 252], [69, 140, 253], [68, 143, 254], [67, 145, 254], [66, 148, 255], [65, 150, 255], [64, 153, 255], [62, 155, 254], [61, 158, 254], [59, 160, 253], [58, 163, 252], [56, 165, 251], [55, 168, 250], [53, 171, 248], [51, 173, 247], [49, 175, 245], [47, 178, 244], [46, 180, 242], [44, 183, 240], [42, 185, 238], [40, 188, 235], [39, 190, 233], [37, 192, 231], [35, 195, 228], [34, 197, 226], [32, 199, 223], [31, 201, 221], [30, 203, 218], [28, 205, 216], [27, 208, 213], [26, 210, 210], [26, 212, 208], [25, 213, 205], [24, 215, 202], [24, 217, 200], [24, 219, 197], [24, 221, 194], [24, 222, 192], [24, 224, 189], [25, 226, 187], [25, 227, 185], [26, 228, 182], [28, 230, 180], [29, 231, 178], [31, 233, 175], [32, 234, 172], [34, 235, 170], [37, 236, 167], [39, 238, 164], [42, 239, 161], [44, 240, 158], [47, 241, 155], [50, 242, 152], [53, 243, 148], [56, 244, 145], [60, 245, 142], [63, 246, 138], [67, 247, 135], [70, 248, 132], [74, 248, 128], [78, 249, 125], [82, 250, 122], [85, 250, 118], [89, 251, 115], [93, 252, 111], [97, 252, 108], [101, 253, 105], [105, 253, 102], [109, 254, 98], [113, 254, 95], [117, 254, 92], [121, 254, 89], [125, 255, 86], [128, 255, 83], [132, 255, 81], [136, 255, 78], [139, 255, 75], [143, 255, 73], [146, 255, 71], [150, 254, 68], [153, 254, 66], [156, 254, 64], [159, 253, 63], [161, 253, 61], [164, 252, 60], [167, 252, 58], [169, 251, 57], [172, 251, 56], [175, 250, 55], [177, 249, 54], [180, 248, 54], [183, 247, 53], [185, 246, 53], [188, 245, 52], [190, 244, 52], [193, 243, 52], [195, 241, 52], [198, 240, 52], [200, 239, 52], [203, 237, 52], [205, 236, 52], [208, 234, 52], [210, 233, 53], [212, 231, 53], [215, 229, 53], [217, 228, 54], [219, 226, 54], [221, 224, 55], [223, 223, 55], [225, 221, 55], [227, 219, 56], [229, 217, 56], [231, 215, 57], [233, 213, 57], [235, 211, 57], [236, 209, 58], [238, 207, 58], [239, 205, 58], [241, 203, 58], [242, 201, 58], [244, 199, 58], [245, 197, 58], [246, 195, 58], [247, 193, 58], [248, 190, 57], [249, 188, 57], [250, 186, 57], [251, 184, 56], [251, 182, 55], [252, 179, 54], [252, 177, 54], [253, 174, 53], [253, 172, 52], [254, 169, 51], [254, 167, 50], [254, 164, 49], [254, 161, 48], [254, 158, 47], [254, 155, 45], [254, 153, 44], [254, 150, 43], [254, 147, 42], [254, 144, 41], [253, 141, 39], [253, 138, 38], [252, 135, 37], [252, 132, 35], [251, 129, 34], [251, 126, 33], [250, 123, 31], [249, 120, 30], [249, 117, 29], [248, 114, 28], [247, 111, 26], [246, 108, 25], [245, 105, 24], [244, 102, 23], [243, 99, 21], [242, 96, 20], [241, 93, 19], [240, 91, 18], [239, 88, 17], [237, 85, 16], [236, 83, 15], [235, 80, 14], [234, 78, 13], [232, 75, 12], [231, 73, 12], [229, 71, 11], [228, 69, 10], [226, 67, 10], [225, 65, 9], [223, 63, 8], [221, 61, 8], [220, 59, 7], [218, 57, 7], [216, 55, 6], [214, 53, 6], [212, 51, 5], [210, 49, 5], [208, 47, 5], [206, 45, 4], [204, 43, 4], [202, 42, 4], [200, 40, 3], [197, 38, 3], [195, 37, 3], [193, 35, 2], [190, 33, 2], [188, 32, 2], [185, 30, 2], [183, 29, 2], [180, 27, 1], [178, 26, 1], [175, 24, 1], [172, 23, 1], [169, 22, 1], [167, 20, 1], [164, 19, 1], [161, 18, 1], [158, 16, 1], [155, 15, 1], [152, 14, 1], [149, 13, 1], [146, 11, 1], [142, 10, 1], [139, 9, 2], [136, 8, 2], [133, 7, 2], [129, 6, 2], [126, 5, 2], [122, 4, 3]] +const turbo: RgbTuple[] = [ + [48, 18, 59], + [50, 21, 67], + [51, 24, 74], + [52, 27, 81], + [53, 30, 88], + [54, 33, 95], + [55, 36, 102], + [56, 39, 109], + [57, 42, 115], + [58, 45, 121], + [59, 47, 128], + [60, 50, 134], + [61, 53, 139], + [62, 56, 145], + [63, 59, 151], + [63, 62, 156], + [64, 64, 162], + [65, 67, 167], + [65, 70, 172], + [66, 73, 177], + [66, 75, 181], + [67, 78, 186], + [68, 81, 191], + [68, 84, 195], + [68, 86, 199], + [69, 89, 203], + [69, 92, 207], + [69, 94, 211], + [70, 97, 214], + [70, 100, 218], + [70, 102, 221], + [70, 105, 224], + [70, 107, 227], + [71, 110, 230], + [71, 113, 233], + [71, 115, 235], + [71, 118, 238], + [71, 120, 240], + [71, 123, 242], + [70, 125, 244], + [70, 128, 246], + [70, 130, 248], + [70, 133, 250], + [70, 135, 251], + [69, 138, 252], + [69, 140, 253], + [68, 143, 254], + [67, 145, 254], + [66, 148, 255], + [65, 150, 255], + [64, 153, 255], + [62, 155, 254], + [61, 158, 254], + [59, 160, 253], + [58, 163, 252], + [56, 165, 251], + [55, 168, 250], + [53, 171, 248], + [51, 173, 247], + [49, 175, 245], + [47, 178, 244], + [46, 180, 242], + [44, 183, 240], + [42, 185, 238], + [40, 188, 235], + [39, 190, 233], + [37, 192, 231], + [35, 195, 228], + [34, 197, 226], + [32, 199, 223], + [31, 201, 221], + [30, 203, 218], + [28, 205, 216], + [27, 208, 213], + [26, 210, 210], + [26, 212, 208], + [25, 213, 205], + [24, 215, 202], + [24, 217, 200], + [24, 219, 197], + [24, 221, 194], + [24, 222, 192], + [24, 224, 189], + [25, 226, 187], + [25, 227, 185], + [26, 228, 182], + [28, 230, 180], + [29, 231, 178], + [31, 233, 175], + [32, 234, 172], + [34, 235, 170], + [37, 236, 167], + [39, 238, 164], + [42, 239, 161], + [44, 240, 158], + [47, 241, 155], + [50, 242, 152], + [53, 243, 148], + [56, 244, 145], + [60, 245, 142], + [63, 246, 138], + [67, 247, 135], + [70, 248, 132], + [74, 248, 128], + [78, 249, 125], + [82, 250, 122], + [85, 250, 118], + [89, 251, 115], + [93, 252, 111], + [97, 252, 108], + [101, 253, 105], + [105, 253, 102], + [109, 254, 98], + [113, 254, 95], + [117, 254, 92], + [121, 254, 89], + [125, 255, 86], + [128, 255, 83], + [132, 255, 81], + [136, 255, 78], + [139, 255, 75], + [143, 255, 73], + [146, 255, 71], + [150, 254, 68], + [153, 254, 66], + [156, 254, 64], + [159, 253, 63], + [161, 253, 61], + [164, 252, 60], + [167, 252, 58], + [169, 251, 57], + [172, 251, 56], + [175, 250, 55], + [177, 249, 54], + [180, 248, 54], + [183, 247, 53], + [185, 246, 53], + [188, 245, 52], + [190, 244, 52], + [193, 243, 52], + [195, 241, 52], + [198, 240, 52], + [200, 239, 52], + [203, 237, 52], + [205, 236, 52], + [208, 234, 52], + [210, 233, 53], + [212, 231, 53], + [215, 229, 53], + [217, 228, 54], + [219, 226, 54], + [221, 224, 55], + [223, 223, 55], + [225, 221, 55], + [227, 219, 56], + [229, 217, 56], + [231, 215, 57], + [233, 213, 57], + [235, 211, 57], + [236, 209, 58], + [238, 207, 58], + [239, 205, 58], + [241, 203, 58], + [242, 201, 58], + [244, 199, 58], + [245, 197, 58], + [246, 195, 58], + [247, 193, 58], + [248, 190, 57], + [249, 188, 57], + [250, 186, 57], + [251, 184, 56], + [251, 182, 55], + [252, 179, 54], + [252, 177, 54], + [253, 174, 53], + [253, 172, 52], + [254, 169, 51], + [254, 167, 50], + [254, 164, 49], + [254, 161, 48], + [254, 158, 47], + [254, 155, 45], + [254, 153, 44], + [254, 150, 43], + [254, 147, 42], + [254, 144, 41], + [253, 141, 39], + [253, 138, 38], + [252, 135, 37], + [252, 132, 35], + [251, 129, 34], + [251, 126, 33], + [250, 123, 31], + [249, 120, 30], + [249, 117, 29], + [248, 114, 28], + [247, 111, 26], + [246, 108, 25], + [245, 105, 24], + [244, 102, 23], + [243, 99, 21], + [242, 96, 20], + [241, 93, 19], + [240, 91, 18], + [239, 88, 17], + [237, 85, 16], + [236, 83, 15], + [235, 80, 14], + [234, 78, 13], + [232, 75, 12], + [231, 73, 12], + [229, 71, 11], + [228, 69, 10], + [226, 67, 10], + [225, 65, 9], + [223, 63, 8], + [221, 61, 8], + [220, 59, 7], + [218, 57, 7], + [216, 55, 6], + [214, 53, 6], + [212, 51, 5], + [210, 49, 5], + [208, 47, 5], + [206, 45, 4], + [204, 43, 4], + [202, 42, 4], + [200, 40, 3], + [197, 38, 3], + [195, 37, 3], + [193, 35, 2], + [190, 33, 2], + [188, 32, 2], + [185, 30, 2], + [183, 29, 2], + [180, 27, 1], + [178, 26, 1], + [175, 24, 1], + [172, 23, 1], + [169, 22, 1], + [167, 20, 1], + [164, 19, 1], + [161, 18, 1], + [158, 16, 1], + [155, 15, 1], + [152, 14, 1], + [149, 13, 1], + [146, 11, 1], + [142, 10, 1], + [139, 9, 2], + [136, 8, 2], + [133, 7, 2], + [129, 6, 2], + [126, 5, 2], + [122, 4, 3], +]; /** @internal */ export const palettes = { diff --git a/src/mocks/hierarchical/pie.ts b/src/mocks/hierarchical/pie.ts index 165ce10576..c46f07ef5a 100644 --- a/src/mocks/hierarchical/pie.ts +++ b/src/mocks/hierarchical/pie.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export const pieMock = [ { sitc1: '7', exportVal: 3110253391368 }, diff --git a/src/mocks/hierarchical/sunburst.ts b/src/mocks/hierarchical/sunburst.ts index 85a8d2ee18..3a6529f9b0 100644 --- a/src/mocks/hierarchical/sunburst.ts +++ b/src/mocks/hierarchical/sunburst.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export const sunburstMock = [ { sitc1: '7', dest: 'usa', exportVal: 553359100104 }, diff --git a/src/mocks/index.ts b/src/mocks/index.ts index 5311c06a27..7f81239f45 100644 --- a/src/mocks/index.ts +++ b/src/mocks/index.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export * from './series'; export * from './geometries'; diff --git a/src/mocks/scale/index.ts b/src/mocks/scale/index.ts index 553d793f9c..25d73e3473 100644 --- a/src/mocks/scale/index.ts +++ b/src/mocks/scale/index.ts @@ -14,7 +14,6 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ - -/** @internal */ + * under the License. + */ export * from './scale'; diff --git a/src/mocks/scale/scale.ts b/src/mocks/scale/scale.ts index 7bb4cbc244..658713d4ac 100644 --- a/src/mocks/scale/scale.ts +++ b/src/mocks/scale/scale.ts @@ -14,10 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { mergePartial } from '../../utils/commons'; import { Scale, ScaleType } from '../../scales'; +import { mergePartial } from '../../utils/commons'; /** @internal */ export class MockScale { diff --git a/src/mocks/series/data.ts b/src/mocks/series/data.ts index 13feb2723e..ba922aa431 100644 --- a/src/mocks/series/data.ts +++ b/src/mocks/series/data.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { DataSeriesDatum } from '../../chart_types/xy_chart/utils/series'; diff --git a/src/mocks/series/index.ts b/src/mocks/series/index.ts index 50e7d91f44..51fbb4026d 100644 --- a/src/mocks/series/index.ts +++ b/src/mocks/series/index.ts @@ -14,9 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ - -/** @internal */ + * under the License. + */ export * from './series'; /** @internal */ diff --git a/src/mocks/series/series.ts b/src/mocks/series/series.ts index 7bad6b1cd8..b55bd195b3 100644 --- a/src/mocks/series/series.ts +++ b/src/mocks/series/series.ts @@ -14,20 +14,21 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { shuffle } from 'lodash'; -import { mergePartial } from '../../utils/commons'; +import { FullDataSeriesDatum, WithIndex } from '../../chart_types/xy_chart/utils/fit_function'; import { DataSeries, DataSeriesDatum, RawDataSeries, RawDataSeriesDatum, } from '../../chart_types/xy_chart/utils/series'; -import { fitFunctionData } from './data'; -import { FullDataSeriesDatum, WithIndex } from '../../chart_types/xy_chart/utils/fit_function'; +import { mergePartial } from '../../utils/commons'; import { getRandomNumberGenerator } from '../utils'; +import { fitFunctionData } from './data'; const rng = getRandomNumberGenerator(); @@ -112,12 +113,10 @@ export class MockRawDataSeries { } static defaults(partials: Partial[], defaults?: Partial): RawDataSeries[] { - return partials.map((partial) => { - return MockRawDataSeries.default({ - ...defaults, - ...partial, - }); - }); + return partials.map((partial) => MockRawDataSeries.default({ + ...defaults, + ...partial, + })); } static fitFunction( diff --git a/src/mocks/series/series_identifiers.ts b/src/mocks/series/series_identifiers.ts index 05cdd10e59..80e37d8de5 100644 --- a/src/mocks/series/series_identifiers.ts +++ b/src/mocks/series/series_identifiers.ts @@ -14,14 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { BasicSeriesSpec } from '../../specs'; import { SeriesCollectionValue, getSplittedSeries, XYChartSeriesIdentifier, } from '../../chart_types/xy_chart/utils/series'; +import { BasicSeriesSpec } from '../../specs'; import { mergePartial } from '../../utils/commons'; type SeriesCollection = Map; diff --git a/src/mocks/series/utils.ts b/src/mocks/series/utils.ts index d56e08e110..167bbca7aa 100644 --- a/src/mocks/series/utils.ts +++ b/src/mocks/series/utils.ts @@ -14,39 +14,32 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { DataSeriesDatum } from '../../chart_types/xy_chart/utils/series'; import { getYValue } from '../../chart_types/xy_chart/rendering/rendering'; +import { DataSeriesDatum } from '../../chart_types/xy_chart/utils/series'; /** * Helper function to return array of rendered y1 values * @internal */ -export const getFilledNullData = (data: DataSeriesDatum[]): (number | undefined)[] => { - return data.filter(({ y1 }) => y1 === null).map(({ filled }) => filled && filled.y1); -}; +export const getFilledNullData = (data: DataSeriesDatum[]): (number | undefined)[] => data.filter(({ y1 }) => y1 === null).map(({ filled }) => filled && filled.y1); /** * Helper function to return array of rendered y1 values * @internal */ -export const getFilledNonNullData = (data: DataSeriesDatum[]): (number | undefined)[] => { - return data.filter(({ y1 }) => y1 !== null).map(({ filled }) => filled && filled.y1); -}; +export const getFilledNonNullData = (data: DataSeriesDatum[]): (number | undefined)[] => data.filter(({ y1 }) => y1 !== null).map(({ filled }) => filled && filled.y1); /** * Helper function to return array of rendered x values * @internal */ -export const getXValueData = (data: DataSeriesDatum[]): (number | string)[] => { - return data.map(({ x }) => x); -}; +export const getXValueData = (data: DataSeriesDatum[]): (number | string)[] => data.map(({ x }) => x); /** * Returns value of `y1` or `filled.y1` or null * @internal */ -export const getYResolvedData = (data: DataSeriesDatum[]): (number | null)[] => { - return data.map(getYValue); -}; +export const getYResolvedData = (data: DataSeriesDatum[]): (number | null)[] => data.map(getYValue); diff --git a/src/mocks/specs/index.ts b/src/mocks/specs/index.ts index f1e1b9ddc7..dc17aa2d87 100644 --- a/src/mocks/specs/index.ts +++ b/src/mocks/specs/index.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ /** @internal */ export * from './specs'; diff --git a/src/mocks/specs/specs.ts b/src/mocks/specs/specs.ts index c033694072..ed6da43eca 100644 --- a/src/mocks/specs/specs.ts +++ b/src/mocks/specs/specs.ts @@ -14,9 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { mergePartial, Position, RecursivePartial } from '../../utils/commons'; +import { ChartTypes } from '../../chart_types'; +import { config, percentFormatter } from '../../chart_types/partition_chart/layout/config/config'; +import { PartitionLayout } from '../../chart_types/partition_chart/layout/types/config_types'; +import { ShapeTreeNode } from '../../chart_types/partition_chart/layout/types/viewmodel_types'; +import { AGGREGATE_KEY, PrimitiveValue } from '../../chart_types/partition_chart/layout/utils/group_by_rollup'; +import { PartitionSpec } from '../../chart_types/partition_chart/specs'; import { SeriesSpecs, DEFAULT_GLOBAL_ID, @@ -35,15 +41,9 @@ import { AxisSpec, } from '../../chart_types/xy_chart/utils/specs'; import { ScaleType } from '../../scales'; -import { ChartTypes } from '../../chart_types'; import { SettingsSpec, SpecTypes, TooltipType } from '../../specs'; +import { Datum, mergePartial, Position, RecursivePartial } from '../../utils/commons'; import { LIGHT_THEME } from '../../utils/themes/light_theme'; -import { PartitionSpec } from '../../chart_types/partition_chart/specs'; -import { config, percentFormatter } from '../../chart_types/partition_chart/layout/config/config'; -import { ShapeTreeNode } from '../../chart_types/partition_chart/layout/types/viewmodel_types'; -import { Datum } from '../../utils/commons'; -import { AGGREGATE_KEY, PrimitiveValue } from '../../chart_types/partition_chart/layout/utils/group_by_rollup'; -import { PartitionLayout } from '../../chart_types/partition_chart/layout/types/config_types'; /** @internal */ export class MockSeriesSpec { @@ -230,6 +230,7 @@ export class MockSeriesSpec { return MockSeriesSpec.barBase; } } + static byTypePartial(type?: 'line' | 'bar' | 'area' | 'histogram') { switch (type) { case 'line': @@ -270,8 +271,8 @@ export class MockGlobalSpec { id: '__global__settings___', chartType: ChartTypes.Global, specType: SpecTypes.Settings, - rendering: 'canvas' as 'canvas', - rotation: 0 as 0, + rendering: 'canvas' as const, + rotation: 0 as const, animateData: true, showLegend: false, resizeDebounce: 10, @@ -317,11 +318,13 @@ export class MockGlobalSpec { static settings(partial?: Partial): SettingsSpec { return mergePartial(MockGlobalSpec.settingsBase, partial, { mergeOptionalPartialValues: true }); } + static settingsNoMargins(partial?: Partial): SettingsSpec { return mergePartial(MockGlobalSpec.settingsBaseNoMargings, partial, { mergeOptionalPartialValues: true, }); } + static axis(partial?: Partial): AxisSpec { return mergePartial(MockGlobalSpec.axisBase, partial, { mergeOptionalPartialValues: true }); } @@ -351,6 +354,7 @@ export class MockAnnotationSpec { static line(partial?: Partial): LineAnnotationSpec { return mergePartial(MockAnnotationSpec.lineBase, partial, { mergeOptionalPartialValues: true }); } + static rect(partial?: Partial): RectAnnotationSpec { return mergePartial(MockAnnotationSpec.rectBase, partial, { mergeOptionalPartialValues: true }); } diff --git a/src/mocks/store/index.ts b/src/mocks/store/index.ts index 4702768221..80ea22c76c 100644 --- a/src/mocks/store/index.ts +++ b/src/mocks/store/index.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ /** @internal */ export * from './store'; diff --git a/src/mocks/store/store.ts b/src/mocks/store/store.ts index 14110e9398..52222f53d9 100644 --- a/src/mocks/store/store.ts +++ b/src/mocks/store/store.ts @@ -14,13 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { chartStoreReducer, GlobalChartState } from '../../state/chart_state'; import { createStore, Store } from 'redux'; -import { specParsing, upsertSpec, specParsed } from '../../state/actions/specs'; + import { Spec } from '../../specs'; import { updateParentDimensions } from '../../state/actions/chart_settings'; +import { specParsing, upsertSpec, specParsed } from '../../state/actions/specs'; +import { chartStoreReducer, GlobalChartState } from '../../state/chart_state'; /** @internal */ export class MockStore { diff --git a/src/mocks/theme.ts b/src/mocks/theme.ts index d0056acad1..ea13596d47 100644 --- a/src/mocks/theme.ts +++ b/src/mocks/theme.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { RecursivePartial, mergePartial } from '../utils/commons'; import { @@ -42,7 +43,8 @@ import { * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export class MockStyles { static rect(partial: RecursivePartial = {}): RectStyle { diff --git a/src/mocks/utils.ts b/src/mocks/utils.ts index fa985baaaf..c90529ce6d 100644 --- a/src/mocks/utils.ts +++ b/src/mocks/utils.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import seedrandom from 'seedrandom'; @@ -27,9 +28,7 @@ import { DataGenerator, RandomNumberGenerator } from '../utils/data_generators/d * * @param obj partial object type */ -export const forcedType = (obj: Partial): T => { - return obj as T; -}; +export const forcedType = >(obj: Partial): T => obj as T; /** * Return rng function with optional `min`, `max` and `fractionDigits` params diff --git a/src/renderers/canvas/index.ts b/src/renderers/canvas/index.ts index e148b3f0b2..48ef9339bb 100644 --- a/src/renderers/canvas/index.ts +++ b/src/renderers/canvas/index.ts @@ -14,11 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { Coordinate } from '../../chart_types/partition_chart/layout/types/geometry_types'; -import { ClippedRanges } from '../../utils/geometry'; import { Rect } from '../../geoms/types'; +import { ClippedRanges } from '../../utils/geometry'; import { Point } from '../../utils/point'; /** @@ -40,14 +41,12 @@ export function withContext(ctx: CanvasRenderingContext2D, fun: (ctx: CanvasRend export function clearCanvas( ctx: CanvasRenderingContext2D, width: Coordinate, - height: Coordinate /*, backgroundColor: string*/, + height: Coordinate, ) { withContext(ctx, (ctx) => { // two steps, as the backgroundColor may have a non-one opacity // todo we should avoid `fillRect` by setting the element background via CSS ctx.clearRect(-width, -height, 2 * width, 2 * height); // remove past contents - // ctx.fillStyle = backgroundColor; - // ctx.fillRect(-width, -height, 2 * width, 2 * height); // new background }); } @@ -93,7 +92,7 @@ export function withClipRanges( fun: (ctx: CanvasRenderingContext2D) => void, ) { withContext(ctx, (ctx) => { - const length = clippedRanges.length; + const { length } = clippedRanges; const { width, height } = clippings; ctx.beginPath(); if (negate) { diff --git a/src/scales/index.ts b/src/scales/index.ts index 99bffc752a..69ddb4cb51 100644 --- a/src/scales/index.ts +++ b/src/scales/index.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { $Values } from 'utility-types'; @@ -61,11 +62,11 @@ export interface Scale { * The scale type */ export const ScaleType = Object.freeze({ - Linear: 'linear' as 'linear', - Ordinal: 'ordinal' as 'ordinal', - Log: 'log' as 'log', - Sqrt: 'sqrt' as 'sqrt', - Time: 'time' as 'time', + Linear: 'linear' as const, + Ordinal: 'ordinal' as const, + Log: 'log' as const, + Sqrt: 'sqrt' as const, + Time: 'time' as const, }); export type ScaleType = $Values; diff --git a/src/scales/scale_band.test.ts b/src/scales/scale_band.test.ts index c670076377..88402ce3ea 100644 --- a/src/scales/scale_band.test.ts +++ b/src/scales/scale_band.test.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { ScaleBand } from '.'; @@ -61,7 +62,7 @@ describe('Scale Band', () => { expect(scale.scale(1)).toBe(20); expect(scale.scale(null)).toBe(40); expect(scale.scale('d')).toBe(60); - expect(scale.scale(undefined)).toBe(80); + expect(scale.scale()).toBe(80); }); it('shall scale remove domain duplicates', () => { const scale = new ScaleBand(['a', 'a', 'b', 'c', 'c', 'd'], [0, 100]); diff --git a/src/scales/scale_band.ts b/src/scales/scale_band.ts index 78d112c1cc..bfaf9cbeea 100644 --- a/src/scales/scale_band.ts +++ b/src/scales/scale_band.ts @@ -14,14 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { scaleBand, scaleQuantize, ScaleQuantize, ScaleBand as D3ScaleBand } from 'd3-scale'; -import { maxValueWithUpperLimit } from '../utils/commons'; import { ScaleType, Scale } from '.'; -import { stringifyNullsUndefined } from '../chart_types/xy_chart/state/utils'; import { PrimitiveValue } from '../chart_types/partition_chart/layout/utils/group_by_rollup'; +import { stringifyNullsUndefined } from '../chart_types/xy_chart/state/utils'; +import { maxValueWithUpperLimit } from '../utils/commons'; /** * Categorical scale diff --git a/src/scales/scale_continuous.test.ts b/src/scales/scale_continuous.test.ts index fa9a8a2045..d54f479c28 100644 --- a/src/scales/scale_continuous.test.ts +++ b/src/scales/scale_continuous.test.ts @@ -14,13 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { DateTime, Settings } from 'luxon'; + +import { ScaleContinuous, ScaleType, ScaleBand } from '.'; import { XDomain } from '../chart_types/xy_chart/domains/x_domain'; import { computeXScale } from '../chart_types/xy_chart/utils/scales'; import { Domain } from '../utils/domain'; -import { DateTime, Settings } from 'luxon'; -import { ScaleContinuous, ScaleType, ScaleBand } from '.'; import { isLogarithmicScale } from './types'; describe('Scale Continuous', () => { @@ -222,7 +224,7 @@ describe('Scale Continuous', () => { Settings.defaultZoneName = currentTz; }); - timezonesToTest.map((tz) => { + timezonesToTest.forEach((tz) => { describe(`standard tests in ${tz}`, () => { beforeEach(() => { Settings.defaultZoneName = tz; @@ -328,7 +330,7 @@ describe('Scale Continuous', () => { ]); }); - xtest('should not leave gaps in hourly ticks on dst switch summer to winter time', () => { + test.skip('should not leave gaps in hourly ticks on dst switch summer to winter time', () => { Settings.defaultZoneName = 'Europe/Berlin'; const ticks = getTicksForDomain( @@ -470,7 +472,7 @@ describe('Scale Continuous', () => { }); it('should throw for undefined values', () => { - expect(() => scale.scaleOrThrow(undefined)).toThrow(); + expect(() => scale.scaleOrThrow()).toThrow(); }); }); }); diff --git a/src/scales/scale_continuous.ts b/src/scales/scale_continuous.ts index 5c414912a5..3eeb8acc42 100644 --- a/src/scales/scale_continuous.ts +++ b/src/scales/scale_continuous.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { bisectLeft } from 'd3-array'; import { @@ -28,10 +29,10 @@ import { ScaleTime, } from 'd3-scale'; -import { maxValueWithUpperLimit, mergePartial } from '../utils/commons'; import { ScaleContinuousType, ScaleType, Scale } from '.'; -import { getMomentWithTz } from '../utils/data/date_time'; import { PrimitiveValue } from '../chart_types/partition_chart/layout/utils/group_by_rollup'; +import { maxValueWithUpperLimit, mergePartial } from '../utils/commons'; +import { getMomentWithTz } from '../utils/data/date_time'; /** * d3 scales excluding time scale @@ -61,36 +62,34 @@ export function limitLogScaleDomain(domain: any[]) { if (domain[0] === 0) { if (domain[1] > 0) { return [1, domain[1]]; - } else if (domain[1] < 0) { + } + if (domain[1] < 0) { return [-1, domain[1]]; - } else { - return [1, 1]; } + return [1, 1]; } if (domain[1] === 0) { if (domain[0] > 0) { return [domain[0], 1]; - } else if (domain[0] < 0) { + } + if (domain[0] < 0) { return [domain[0], -1]; - } else { - return [1, 1]; } + return [1, 1]; } if (domain[0] < 0 && domain[1] > 0) { const isD0Min = Math.abs(domain[1]) - Math.abs(domain[0]) >= 0; if (isD0Min) { return [1, domain[1]]; - } else { - return [domain[0], -1]; } + return [domain[0], -1]; } if (domain[0] > 0 && domain[1] < 0) { const isD0Max = Math.abs(domain[0]) - Math.abs(domain[1]) >= 0; if (isD0Max) { return [domain[0], 1]; - } else { - return [-1, domain[1]]; } + return [-1, domain[1]]; } return domain; } @@ -139,7 +138,7 @@ interface ScaleOptions { ticks: number; /** true if the scale was adjusted to fit one single value histogram */ isSingleValueHistogram: boolean; - /** Show only integer values **/ + /** Show only integer values */ integersOnly?: boolean; } const defaultScaleOptions: ScaleOptions = { @@ -222,16 +221,11 @@ export class ScaleContinuous implements Scale { return currentDateTime.subtract(currentOffset, 'minutes').valueOf(); }); } else { - /** - * This case is for the xScale (minInterval is > 0) when we want to show bars (bandwidth > 0) - * - * We want to avoid displaying inner ticks between bars in a bar chart when using linear x scale - */ + // This case is for the xScale (minInterval is > 0) when we want to show bars (bandwidth > 0) + // We want to avoid displaying inner ticks between bars in a bar chart when using linear x scale if (minInterval > 0 && bandwidth > 0) { const intervalCount = Math.floor((this.domain[1] - this.domain[0]) / this.minInterval); - this.tickValues = new Array(intervalCount + 1).fill(0).map((_, i) => { - return this.domain[0] + i * this.minInterval; - }); + this.tickValues = new Array(intervalCount + 1).fill(0).map((_, i) => this.domain[0] + i * this.minInterval); } else { this.tickValues = this.getTicks(ticks, integersOnly!); } @@ -255,7 +249,7 @@ export class ScaleContinuous implements Scale { ? (this.d3Scale as D3ScaleNonTime) .ticks(ticks) .filter((item: number) => typeof item === 'number' && item % 1 === 0) - .map((item: number) => parseInt(item.toFixed(0))) + .map((item: number) => parseInt(item.toFixed(0), 10)) : (this.d3Scale as D3ScaleNonTime).ticks(ticks); } diff --git a/src/scales/scale_time.test.ts b/src/scales/scale_time.test.ts index d685998925..29b208ede4 100644 --- a/src/scales/scale_time.test.ts +++ b/src/scales/scale_time.test.ts @@ -14,9 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { DateTime } from 'luxon'; + import { ScaleContinuous, ScaleType } from '.'; describe('[Scale Time] - timezones', () => { @@ -228,9 +230,7 @@ describe('[Scale Time] - timezones', () => { { type: ScaleType.Time, domain, range: [minRange, maxRange] }, { bandwidth: undefined, minInterval, timeZone: timezone }, ); - const formatFunction = (d: number) => { - return DateTime.fromMillis(d, { zone: timezone }).toISO(); - }; + const formatFunction = (d: number) => DateTime.fromMillis(d, { zone: timezone }).toISO(); expect(scale.invert(0)).toBe(startTime); expect(scale.invert(49.5)).toBe(midTime); expect(scale.invert(99)).toBe(endTime); diff --git a/src/scales/scales.test.ts b/src/scales/scales.test.ts index eb81b282fb..e9bb793157 100644 --- a/src/scales/scales.test.ts +++ b/src/scales/scales.test.ts @@ -14,9 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { DateTime } from 'luxon'; + import { ScaleType, ScaleBand } from '.'; import { limitLogScaleDomain, ScaleContinuous } from './scale_continuous'; diff --git a/src/scales/types.ts b/src/scales/types.ts index 23cc8dbe9b..6d34cb6e94 100644 --- a/src/scales/types.ts +++ b/src/scales/types.ts @@ -14,11 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { ScaleContinuous } from './scale_continuous'; import { Scale, ScaleType } from '.'; import { ScaleBand } from './scale_band'; +import { ScaleContinuous } from './scale_continuous'; /** * Check if a scale is logaritmic diff --git a/src/specs/index.ts b/src/specs/index.ts index 6bb03ff421..c90bebcdd3 100644 --- a/src/specs/index.ts +++ b/src/specs/index.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { ChartTypes } from '../chart_types'; @@ -23,7 +24,7 @@ export interface Spec { id: string; /** Chart type define the type of chart that use this spec */ chartType: ChartTypes; - /** The type of spec, can be series, axis, annotation, settings etc*/ + /** The type of spec, can be series, axis, annotation, settings etc */ specType: string; } diff --git a/src/specs/settings.test.tsx b/src/specs/settings.test.tsx index cf79d83afc..c75120f0ce 100644 --- a/src/specs/settings.test.tsx +++ b/src/specs/settings.test.tsx @@ -14,32 +14,32 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { mount } from 'enzyme'; import React from 'react'; +import { Provider } from 'react-redux'; +import { createStore, Store } from 'redux'; + +import { chartStoreReducer, GlobalChartState } from '../state/chart_state'; +import { getChartThemeSelector } from '../state/selectors/get_chart_theme'; +import { getSettingsSpecSelector } from '../state/selectors/get_settings_specs'; import { Position, Rendering, Rotation } from '../utils/commons'; import { DARK_THEME } from '../utils/themes/dark_theme'; -import { Settings, SettingsSpec, TooltipType } from './settings'; -import { PartialTheme } from '../utils/themes/theme'; import { LIGHT_THEME } from '../utils/themes/light_theme'; -import { chartStoreReducer, GlobalChartState } from '../state/chart_state'; -import { createStore, Store } from 'redux'; +import { PartialTheme } from '../utils/themes/theme'; +import { Settings, SettingsSpec, TooltipType } from './settings'; import { SpecsParser } from './specs_parser'; -import { Provider } from 'react-redux'; -import { getSettingsSpecSelector } from '../state/selectors/get_settings_specs'; -import { getChartThemeSelector } from '../state/selectors/get_chart_theme'; -const getProxy = (chartStore: Store) => { - return function SettingsProxy({ settings }: { settings?: Partial }) { - return ( - - - - - - ); - }; +const getProxy = (chartStore: Store) => function SettingsProxy({ settings }: { settings?: Partial }) { + return ( + + + + + + ); }; describe('Settings spec component', () => { let chartStore: Store; @@ -120,25 +120,13 @@ describe('Settings spec component', () => { expect(settingSpec.onLegendItemPlusClick).toBeUndefined(); expect(settingSpec.onLegendItemMinusClick).toBeUndefined(); - const onElementClick = (): void => { - return; - }; - const onElementOver = (): void => { - return; - }; - const onOut = () => undefined; - const onBrushEnd = (): void => { - return; - }; - const onLegendEvent = (): void => { - return; - }; - const onPointerUpdateEvent = (): void => { - return; - }; - const onRenderChangeEvent = (): void => { - return; - }; + const onElementClick = (): void => {}; + const onElementOver = (): void => {}; + const onOut = () => {}; + const onBrushEnd = (): void => {}; + const onLegendEvent = (): void => {}; + const onPointerUpdateEvent = (): void => {}; + const onRenderChangeEvent = (): void => {}; const updatedProps: Partial = { onElementClick, @@ -202,8 +190,10 @@ describe('Settings spec component', () => { mount(); settingSpec = getSettingsSpecSelector(chartStore.getState()); - // the theme is no longer stored into the setting spec. - // it's final theme object is computed through selectors + /* + * the theme is no longer stored into the setting spec. + * it's final theme object is computed through selectors + */ const theme = getChartThemeSelector(chartStore.getState()); expect(theme).toEqual({ ...DARK_THEME, diff --git a/src/specs/settings.tsx b/src/specs/settings.tsx index 43651dab72..27f3d9e825 100644 --- a/src/specs/settings.tsx +++ b/src/specs/settings.tsx @@ -14,28 +14,29 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; import { $Values } from 'utility-types'; -import { DomainRange } from '../chart_types/xy_chart/utils/specs'; -import { PartialTheme, Theme } from '../utils/themes/theme'; -import { Domain } from '../utils/domain'; -import { getConnect, specComponentFactory } from '../state/spec_factory'; import { Spec } from '.'; -import { LIGHT_THEME } from '../utils/themes/light_theme'; import { ChartTypes } from '../chart_types'; -import { GeometryValue } from '../utils/geometry'; +import { PrimitiveValue } from '../chart_types/partition_chart/layout/utils/group_by_rollup'; import { XYChartSeriesIdentifier } from '../chart_types/xy_chart/utils/series'; +import { DomainRange } from '../chart_types/xy_chart/utils/specs'; import { SeriesIdentifier } from '../commons/series_id'; +import { Placement } from '../components/portal'; +import { CustomTooltip } from '../components/tooltip/types'; +import { ScaleContinuousType, ScaleOrdinalType } from '../scales'; +import { getConnect, specComponentFactory } from '../state/spec_factory'; import { Accessor } from '../utils/accessor'; import { Position, Rendering, Rotation, Color } from '../utils/commons'; -import { ScaleContinuousType, ScaleOrdinalType } from '../scales'; -import { PrimitiveValue } from '../chart_types/partition_chart/layout/utils/group_by_rollup'; +import { Domain } from '../utils/domain'; +import { GeometryValue } from '../utils/geometry'; import { GroupId } from '../utils/ids'; -import { CustomTooltip } from '../components/tooltip/types'; -import { Placement } from '../components/portal'; +import { LIGHT_THEME } from '../utils/themes/light_theme'; +import { PartialTheme, Theme } from '../utils/themes/theme'; export interface LayerValue { groupByRollup: PrimitiveValue; @@ -68,8 +69,8 @@ export type RenderChangeListener = (isRendered: boolean) => void; export type BasicListener = () => undefined | void; export const PointerEventType = Object.freeze({ - Over: 'Over' as 'Over', - Out: 'Out' as 'Out', + Over: 'Over' as const, + Out: 'Out' as const, }); export type PointerEventType = $Values; @@ -105,13 +106,13 @@ export type PointerEvent = PointerOverEvent | PointerOutEvent; */ export const TooltipType = Object.freeze({ /** Vertical cursor parallel to x axis */ - VerticalCursor: 'vertical' as 'vertical', + VerticalCursor: 'vertical' as const, /** Vertical and horizontal cursors */ - Crosshairs: 'cross' as 'cross', + Crosshairs: 'cross' as const, /** Follow the mouse coordinates */ - Follow: 'follow' as 'follow', + Follow: 'follow' as const, /** Hide every tooltip */ - None: 'none' as 'none', + None: 'none' as const, }); /** @@ -121,9 +122,9 @@ export const TooltipType = Object.freeze({ export type TooltipType = $Values; export const BrushAxis = Object.freeze({ - X: 'x' as 'x', - Y: 'y' as 'y', - Both: 'both' as 'both', + X: 'x' as const, + Y: 'y' as const, + Both: 'both' as const, }); export type BrushAxis = $Values; @@ -366,10 +367,10 @@ export const DEFAULT_TOOLTIP_TYPE = TooltipType.VerticalCursor; export const DEFAULT_TOOLTIP_SNAP = true; export const SpecTypes = Object.freeze({ - Series: 'series' as 'series', - Axis: 'axis' as 'axis', - Annotation: 'annotation' as 'annotation', - Settings: 'settings' as 'settings', + Series: 'series' as const, + Axis: 'axis' as const, + Annotation: 'annotation' as const, + Settings: 'settings' as const, }); export type SpecTypes = $Values; @@ -378,8 +379,8 @@ export const DEFAULT_SETTINGS_SPEC: SettingsSpec = { id: '__global__settings___', chartType: ChartTypes.Global, specType: SpecTypes.Settings, - rendering: 'canvas' as 'canvas', - rotation: 0 as 0, + rendering: 'canvas' as const, + rotation: 0 as const, animateData: true, showLegend: false, resizeDebounce: 10, diff --git a/src/specs/specs_parser.test.tsx b/src/specs/specs_parser.test.tsx index 768284e40d..a77525d740 100644 --- a/src/specs/specs_parser.test.tsx +++ b/src/specs/specs_parser.test.tsx @@ -14,17 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { mount } from 'enzyme'; import React from 'react'; -import { createStore } from 'redux'; import { Provider } from 'react-redux'; -import { SpecsParser } from './specs_parser'; +import { createStore } from 'redux'; + +import { BarSeries } from '../chart_types/specs'; +import { BarSeriesSpec } from '../chart_types/xy_chart/utils/specs'; import { chartStoreReducer } from '../state/chart_state'; import { DEFAULT_SETTINGS_SPEC } from './settings'; -import { BarSeriesSpec } from '../chart_types/xy_chart/utils/specs'; -import { BarSeries } from '../chart_types/specs'; +import { SpecsParser } from './specs_parser'; describe('Specs parser', () => { test('can mount the spec parser', () => { @@ -82,8 +84,8 @@ describe('Specs parser', () => { const state = chartStore.getState(); expect(state.specsInitialized).toBe(true); expect(Object.keys(state.specs)).toEqual([DEFAULT_SETTINGS_SPEC.id, 'bars', 'bars2']); - expect(state.specs['bars']).toBeDefined(); - expect(state.specs['bars2']).toBeDefined(); + expect(state.specs.bars).toBeDefined(); + expect(state.specs.bars2).toBeDefined(); }); test('can update a component', () => { const storeReducer = chartStoreReducer('chart_id'); @@ -123,7 +125,7 @@ describe('Specs parser', () => { ), }); const state = chartStore.getState(); - expect((state.specs['bars'] as BarSeriesSpec).xAccessor).toBe(1); + expect((state.specs.bars as BarSeriesSpec).xAccessor).toBe(1); }); test('set initialization to false on unmount', () => { const storeReducer = chartStoreReducer('chart_id'); diff --git a/src/specs/specs_parser.tsx b/src/specs/specs_parser.tsx index 7ef2cba3a3..b91fd8dead 100644 --- a/src/specs/specs_parser.tsx +++ b/src/specs/specs_parser.tsx @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React, { useEffect } from 'react'; -import { bindActionCreators, Dispatch } from 'redux'; import { connect } from 'react-redux'; +import { bindActionCreators, Dispatch } from 'redux'; + import { specParsing, specParsed, specUnmounted } from '../state/actions/specs'; -const SpecsParserComponent: React.FunctionComponent<{}> = (props) => { +const SpecsParserComponent: React.FunctionComponent = (props) => { const injected = props as DispatchProps; injected.specParsing(); useEffect(() => { diff --git a/src/state/actions/chart.ts b/src/state/actions/chart.ts index d3443643fe..dbfbabb9f5 100644 --- a/src/state/actions/chart.ts +++ b/src/state/actions/chart.ts @@ -14,9 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ - -/** @internal */ + * under the License. + */ export const CHART_RENDERED = 'CHART_RENDERED'; interface ChartRenderedAction { diff --git a/src/state/actions/chart_settings.ts b/src/state/actions/chart_settings.ts index 8e04928f1d..40cf51e76e 100644 --- a/src/state/actions/chart_settings.ts +++ b/src/state/actions/chart_settings.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { Dimensions } from '../../utils/dimensions'; diff --git a/src/state/actions/colors.ts b/src/state/actions/colors.ts index 618cf42deb..07be8d29cd 100644 --- a/src/state/actions/colors.ts +++ b/src/state/actions/colors.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { SeriesKey } from '../../commons/series_id'; import { Color } from '../../utils/commons'; diff --git a/src/state/actions/events.ts b/src/state/actions/events.ts index df2de07374..2f49f1ae9c 100644 --- a/src/state/actions/events.ts +++ b/src/state/actions/events.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { PointerEvent } from '../../specs/settings'; diff --git a/src/state/actions/index.ts b/src/state/actions/index.ts index 40e3a854bc..4b17236e8d 100644 --- a/src/state/actions/index.ts +++ b/src/state/actions/index.ts @@ -14,15 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { SpecActions } from './specs'; import { ChartActions } from './chart'; import { ChartSettingsActions } from './chart_settings'; -import { LegendActions } from './legend'; +import { ColorsActions } from './colors'; import { EventsActions } from './events'; +import { LegendActions } from './legend'; import { MouseActions } from './mouse'; -import { ColorsActions } from './colors'; +import { SpecActions } from './specs'; /** @internal */ export type StateActions = diff --git a/src/state/actions/legend.ts b/src/state/actions/legend.ts index 8ec7042af0..c9d33a804d 100644 --- a/src/state/actions/legend.ts +++ b/src/state/actions/legend.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { SeriesIdentifier } from '../../commons/series_id'; diff --git a/src/state/actions/mouse.ts b/src/state/actions/mouse.ts index efb2f9fc32..ae13e6cf8d 100644 --- a/src/state/actions/mouse.ts +++ b/src/state/actions/mouse.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { Point } from '../../utils/point'; diff --git a/src/state/actions/specs.ts b/src/state/actions/specs.ts index 18b77089c4..c77b4a6585 100644 --- a/src/state/actions/specs.ts +++ b/src/state/actions/specs.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { Spec } from '../../specs'; diff --git a/src/state/chart_state.ts b/src/state/chart_state.ts index 1a593939de..4024e2f402 100644 --- a/src/state/chart_state.ts +++ b/src/state/chart_state.ts @@ -14,33 +14,33 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React, { RefObject } from 'react'; -import React from 'react'; -import { SPEC_PARSED, SPEC_UNMOUNTED, UPSERT_SPEC, REMOVE_SPEC, SPEC_PARSING } from './actions/specs'; -import { SET_PERSISTED_COLOR, SET_TEMPORARY_COLOR, CLEAR_TEMPORARY_COLORS } from './actions/colors'; -import { interactionsReducer } from './reducers/interactions'; import { ChartTypes } from '../chart_types'; +import { GoalState } from '../chart_types/goal_chart/state/chart_state'; +import { PartitionState } from '../chart_types/partition_chart/state/chart_state'; import { XYAxisChartState } from '../chart_types/xy_chart/state/chart_state'; +import { LegendItem, LegendItemExtraValues } from '../commons/legend'; import { SeriesKey, SeriesIdentifier } from '../commons/series_id'; +import { TooltipInfo, TooltipAnchorPosition } from '../components/tooltip/types'; import { Spec, PointerEvent } from '../specs'; import { DEFAULT_SETTINGS_SPEC } from '../specs/settings'; +import { Color } from '../utils/commons'; import { Dimensions } from '../utils/dimensions'; import { Point } from '../utils/point'; -import { LegendItem, LegendItemExtraValues } from '../commons/legend'; import { StateActions } from './actions'; import { CHART_RENDERED } from './actions/chart'; import { UPDATE_PARENT_DIMENSION } from './actions/chart_settings'; +import { SET_PERSISTED_COLOR, SET_TEMPORARY_COLOR, CLEAR_TEMPORARY_COLORS } from './actions/colors'; import { EXTERNAL_POINTER_EVENT } from './actions/events'; -import { RefObject } from 'react'; -import { GoalState } from '../chart_types/goal_chart/state/chart_state'; -import { PartitionState } from '../chart_types/partition_chart/state/chart_state'; -import { TooltipInfo } from '../components/tooltip/types'; -import { TooltipAnchorPosition } from '../components/tooltip/types'; -import { Color } from '../utils/commons'; -import { LegendItemLabel } from './selectors/get_legend_items_labels'; -import { getLegendItemsSelector } from './selectors/get_legend_items'; +import { SPEC_PARSED, SPEC_UNMOUNTED, UPSERT_SPEC, REMOVE_SPEC, SPEC_PARSING } from './actions/specs'; +import { interactionsReducer } from './reducers/interactions'; import { getInternalIsInitializedSelector } from './selectors/get_internal_is_intialized'; +import { getLegendItemsSelector } from './selectors/get_legend_items'; +import { LegendItemLabel } from './selectors/get_legend_items_labels'; export type BackwardRef = () => React.RefObject; @@ -285,13 +285,13 @@ export const chartStoreReducer = (chartId: string) => { chartType, internalChartState, }; - } else { - return { - ...state, - specsInitialized: true, - chartType, - }; } + return { + ...state, + specsInitialized: true, + chartType, + }; + case SPEC_UNMOUNTED: return { ...state, @@ -411,9 +411,8 @@ function findMainChartType(specs: SpecList): ChartTypes | null { // eslint-disable-next-line no-console console.warn('Multiple chart type on the same configuration'); return null; - } else { - return chartTypes[0] as ChartTypes; } + return chartTypes[0] as ChartTypes; } function initInternalChartState(chartType: ChartTypes | null): InternalChartState | null { diff --git a/src/state/reducers/interactions.ts b/src/state/reducers/interactions.ts index cdb963ac32..175d60192e 100644 --- a/src/state/reducers/interactions.ts +++ b/src/state/reducers/interactions.ts @@ -14,9 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { InteractionsState } from '../chart_state'; +import { getSeriesIndex } from '../../chart_types/xy_chart/utils/series'; +import { LegendItem } from '../../commons/legend'; +import { SeriesIdentifier } from '../../commons/series_id'; import { ON_TOGGLE_LEGEND, ON_LEGEND_ITEM_OUT, @@ -26,9 +29,7 @@ import { ToggleDeselectSeriesAction, } from '../actions/legend'; import { ON_MOUSE_DOWN, ON_MOUSE_UP, ON_POINTER_MOVE, MouseActions } from '../actions/mouse'; -import { getSeriesIndex } from '../../chart_types/xy_chart/utils/series'; -import { SeriesIdentifier } from '../../commons/series_id'; -import { LegendItem } from '../../commons/legend'; +import { InteractionsState } from '../chart_state'; /** @internal */ export function interactionsReducer( @@ -42,7 +43,7 @@ export function interactionsReducer( ...state, pointer: { ...state.pointer, - dragging: state.pointer.down && state.pointer.down.time < action.time ? true : false, + dragging: !!(state.pointer.down && state.pointer.down.time < action.time), current: { position: { ...action.position, diff --git a/src/state/selectors/get_chart_container_dimensions.ts b/src/state/selectors/get_chart_container_dimensions.ts index c1e885c5f7..0ba846fd6a 100644 --- a/src/state/selectors/get_chart_container_dimensions.ts +++ b/src/state/selectors/get_chart_container_dimensions.ts @@ -14,15 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { getSettingsSpecSelector } from './get_settings_specs'; -import { getLegendSizeSelector } from './get_legend_size'; -import { GlobalChartState } from '../chart_state'; -import { Dimensions } from '../../utils/dimensions'; + import { isVerticalAxis } from '../../chart_types/xy_chart/utils/axis_utils'; +import { Dimensions } from '../../utils/dimensions'; +import { GlobalChartState } from '../chart_state'; import { getChartIdSelector } from './get_chart_id'; +import { getLegendSizeSelector } from './get_legend_size'; +import { getSettingsSpecSelector } from './get_settings_specs'; const getParentDimension = (state: GlobalChartState) => state.parentDimensions; @@ -40,13 +42,12 @@ export const getChartContainerDimensionsSelector = createCachedSelector( width: parentDimensions.width - legendSize.width, height: parentDimensions.height, }; - } else { - return { - left: 0, - top: 0, - width: parentDimensions.width, - height: parentDimensions.height - legendSize.height, - }; } + return { + left: 0, + top: 0, + width: parentDimensions.width, + height: parentDimensions.height - legendSize.height, + }; }, )(getChartIdSelector); diff --git a/src/state/selectors/get_chart_id.ts b/src/state/selectors/get_chart_id.ts index e9fba2cf10..add7928beb 100644 --- a/src/state/selectors/get_chart_id.ts +++ b/src/state/selectors/get_chart_id.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { GlobalChartState } from '../chart_state'; diff --git a/src/state/selectors/get_chart_rotation.ts b/src/state/selectors/get_chart_rotation.ts index 78549abaf1..ef2c2b2471 100644 --- a/src/state/selectors/get_chart_rotation.ts +++ b/src/state/selectors/get_chart_rotation.ts @@ -14,18 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { getSettingsSpecSelector } from './get_settings_specs'; import { Rotation } from '../../utils/commons'; import { getChartIdSelector } from './get_chart_id'; +import { getSettingsSpecSelector } from './get_settings_specs'; /** @internal */ export const getChartRotationSelector = createCachedSelector( [getSettingsSpecSelector], - (settingsSpec): Rotation => { - return settingsSpec.rotation; - }, + (settingsSpec): Rotation => settingsSpec.rotation, )(getChartIdSelector); diff --git a/src/state/selectors/get_chart_theme.ts b/src/state/selectors/get_chart_theme.ts index 5be89e5752..c62c101cfa 100644 --- a/src/state/selectors/get_chart_theme.ts +++ b/src/state/selectors/get_chart_theme.ts @@ -14,24 +14,24 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { getSettingsSpecSelector } from './get_settings_specs'; -import { PartialTheme, Theme, mergeWithDefaultTheme } from '../../utils/themes/theme'; + import { LIGHT_THEME } from '../../utils/themes/light_theme'; +import { PartialTheme, Theme, mergeWithDefaultTheme } from '../../utils/themes/theme'; import { getChartIdSelector } from './get_chart_id'; +import { getSettingsSpecSelector } from './get_settings_specs'; /** @internal */ export const getChartThemeSelector = createCachedSelector( [getSettingsSpecSelector], - (settingsSpec): Theme => { - return getTheme(settingsSpec.baseTheme, settingsSpec.theme); - }, + (settingsSpec): Theme => getTheme(settingsSpec.baseTheme, settingsSpec.theme), )(getChartIdSelector); function getTheme(baseTheme?: Theme, theme?: PartialTheme | PartialTheme[]): Theme { - const base = baseTheme ? baseTheme : LIGHT_THEME; + const base = baseTheme || LIGHT_THEME; if (Array.isArray(theme)) { const [firstTheme, ...axillaryThemes] = theme; diff --git a/src/state/selectors/get_chart_type_components.ts b/src/state/selectors/get_chart_type_components.ts index 6dbb50012a..643610be8d 100644 --- a/src/state/selectors/get_chart_type_components.ts +++ b/src/state/selectors/get_chart_type_components.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { GlobalChartState, BackwardRef } from '../chart_state'; @@ -27,7 +28,6 @@ type ChartRendererFn = ( export const getInternalChartRendererSelector = (state: GlobalChartState): ChartRendererFn => { if (state.internalChartState) { return state.internalChartState.chartRenderer; - } else { - return () => null; } + return () => null; }; diff --git a/src/state/selectors/get_internal_cursor_pointer.ts b/src/state/selectors/get_internal_cursor_pointer.ts index 2bcbe1d1ca..94ceab39e0 100644 --- a/src/state/selectors/get_internal_cursor_pointer.ts +++ b/src/state/selectors/get_internal_cursor_pointer.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { GlobalChartState } from '../chart_state'; @@ -22,7 +23,6 @@ import { GlobalChartState } from '../chart_state'; export const getInternalPointerCursor = (state: GlobalChartState): string => { if (state.internalChartState) { return state.internalChartState.getPointerCursor(state); - } else { - return 'default'; } + return 'default'; }; diff --git a/src/state/selectors/get_internal_is_brushing.ts b/src/state/selectors/get_internal_is_brushing.ts index 0b9c20949f..f59e852c63 100644 --- a/src/state/selectors/get_internal_is_brushing.ts +++ b/src/state/selectors/get_internal_is_brushing.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { GlobalChartState } from '../chart_state'; @@ -22,7 +23,6 @@ import { GlobalChartState } from '../chart_state'; export const getInternalIsBrushingSelector = (state: GlobalChartState): boolean => { if (state.internalChartState) { return state.internalChartState.isBrushing(state); - } else { - return false; } + return false; }; diff --git a/src/state/selectors/get_internal_is_brushing_available.ts b/src/state/selectors/get_internal_is_brushing_available.ts index ba0f3c2405..d010f035c3 100644 --- a/src/state/selectors/get_internal_is_brushing_available.ts +++ b/src/state/selectors/get_internal_is_brushing_available.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { GlobalChartState } from '../chart_state'; @@ -22,7 +23,6 @@ import { GlobalChartState } from '../chart_state'; export const getInternalIsBrushingAvailableSelector = (state: GlobalChartState): boolean => { if (state.internalChartState) { return state.internalChartState.isBrushAvailable(state); - } else { - return false; } + return false; }; diff --git a/src/state/selectors/get_internal_is_intialized.ts b/src/state/selectors/get_internal_is_intialized.ts index 4409be9f70..eea59e1e30 100644 --- a/src/state/selectors/get_internal_is_intialized.ts +++ b/src/state/selectors/get_internal_is_intialized.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { GlobalChartState } from '../chart_state'; @@ -22,7 +23,6 @@ import { GlobalChartState } from '../chart_state'; export const getInternalIsInitializedSelector = (state: GlobalChartState): boolean => { if (state.internalChartState) { return state.internalChartState.isInitialized(state); - } else { - return false; } + return false; }; diff --git a/src/state/selectors/get_internal_is_tooltip_visible.ts b/src/state/selectors/get_internal_is_tooltip_visible.ts index 2154d97d57..dfb76c0011 100644 --- a/src/state/selectors/get_internal_is_tooltip_visible.ts +++ b/src/state/selectors/get_internal_is_tooltip_visible.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { GlobalChartState } from '../chart_state'; @@ -22,7 +23,6 @@ import { GlobalChartState } from '../chart_state'; export const getInternalIsTooltipVisibleSelector = (state: GlobalChartState): boolean => { if (state.internalChartState) { return state.internalChartState.isTooltipVisible(state); - } else { - return false; } + return false; }; diff --git a/src/state/selectors/get_internal_tooltip_anchor_position.ts b/src/state/selectors/get_internal_tooltip_anchor_position.ts index 067700a017..777d7b7d92 100644 --- a/src/state/selectors/get_internal_tooltip_anchor_position.ts +++ b/src/state/selectors/get_internal_tooltip_anchor_position.ts @@ -14,16 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { GlobalChartState } from '../chart_state'; import { TooltipAnchorPosition } from '../../components/tooltip/types'; +import { GlobalChartState } from '../chart_state'; /** @internal */ export const getInternalTooltipAnchorPositionSelector = (state: GlobalChartState): TooltipAnchorPosition | null => { if (state.internalChartState) { return state.internalChartState.getTooltipAnchor(state); - } else { - return null; } + return null; }; diff --git a/src/state/selectors/get_internal_tooltip_info.ts b/src/state/selectors/get_internal_tooltip_info.ts index 575b65602f..b026d8599a 100644 --- a/src/state/selectors/get_internal_tooltip_info.ts +++ b/src/state/selectors/get_internal_tooltip_info.ts @@ -14,16 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { GlobalChartState } from '../chart_state'; import { TooltipInfo } from '../../components/tooltip/types'; +import { GlobalChartState } from '../chart_state'; /** @internal */ export const getInternalTooltipInfoSelector = (state: GlobalChartState): TooltipInfo | undefined => { if (state.internalChartState) { return state.internalChartState.getTooltipInfo(state); - } else { - return undefined; } }; diff --git a/src/state/selectors/get_last_click.ts b/src/state/selectors/get_last_click.ts index 8a98343cdb..ec17cd0494 100644 --- a/src/state/selectors/get_last_click.ts +++ b/src/state/selectors/get_last_click.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { GlobalChartState } from '../chart_state'; diff --git a/src/state/selectors/get_legend_items.ts b/src/state/selectors/get_legend_items.ts index 3f0cb7247d..e0882f183c 100644 --- a/src/state/selectors/get_legend_items.ts +++ b/src/state/selectors/get_legend_items.ts @@ -14,10 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { GlobalChartState } from '../chart_state'; import { LegendItem } from '../../commons/legend'; +import { GlobalChartState } from '../chart_state'; const EMPTY_LEGEND_LIST: LegendItem[] = []; @@ -25,7 +26,6 @@ const EMPTY_LEGEND_LIST: LegendItem[] = []; export const getLegendItemsSelector = (state: GlobalChartState): LegendItem[] => { if (state.internalChartState) { return state.internalChartState.getLegendItems(state); - } else { - return EMPTY_LEGEND_LIST; } + return EMPTY_LEGEND_LIST; }; diff --git a/src/state/selectors/get_legend_items_labels.ts b/src/state/selectors/get_legend_items_labels.ts index f0ce652128..d53b125061 100644 --- a/src/state/selectors/get_legend_items_labels.ts +++ b/src/state/selectors/get_legend_items_labels.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { GlobalChartState } from '../chart_state'; @@ -28,7 +29,6 @@ export interface LegendItemLabel { export const getLegendItemsLabelsSelector = (state: GlobalChartState): LegendItemLabel[] => { if (state.internalChartState) { return state.internalChartState.getLegendItemsLabels(state); - } else { - return []; } + return []; }; diff --git a/src/state/selectors/get_legend_items_values.ts b/src/state/selectors/get_legend_items_values.ts index ca645cbb2f..af872ad54b 100644 --- a/src/state/selectors/get_legend_items_values.ts +++ b/src/state/selectors/get_legend_items_values.ts @@ -14,11 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { GlobalChartState } from '../chart_state'; -import { SeriesKey } from '../../commons/series_id'; import { LegendItemExtraValues } from '../../commons/legend'; +import { SeriesKey } from '../../commons/series_id'; +import { GlobalChartState } from '../chart_state'; const EMPTY_ITEM_LIST = new Map(); @@ -26,7 +27,6 @@ const EMPTY_ITEM_LIST = new Map(); export const getLegendExtraValuesSelector = (state: GlobalChartState): Map => { if (state.internalChartState) { return state.internalChartState.getLegendExtraValues(state); - } else { - return EMPTY_ITEM_LIST; } + return EMPTY_ITEM_LIST; }; diff --git a/src/state/selectors/get_legend_size.ts b/src/state/selectors/get_legend_size.ts index f278377d49..1f9e4e05cf 100644 --- a/src/state/selectors/get_legend_size.ts +++ b/src/state/selectors/get_legend_size.ts @@ -14,18 +14,20 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { CanvasTextBBoxCalculator } from '../../utils/bbox/canvas_text_bbox_calculator'; -import { BBox } from '../../utils/bbox/bbox_calculator'; -import { getSettingsSpecSelector } from './get_settings_specs'; + import { isVerticalAxis } from '../../chart_types/xy_chart/utils/axis_utils'; -import { getChartThemeSelector } from './get_chart_theme'; +import { LEGEND_HIERARCHY_MARGIN } from '../../components/legend/legend_item'; +import { BBox } from '../../utils/bbox/bbox_calculator'; +import { CanvasTextBBoxCalculator } from '../../utils/bbox/canvas_text_bbox_calculator'; import { GlobalChartState } from '../chart_state'; import { getChartIdSelector } from './get_chart_id'; +import { getChartThemeSelector } from './get_chart_theme'; import { getLegendItemsLabelsSelector } from './get_legend_items_labels'; -import { LEGEND_HIERARCHY_MARGIN } from '../../components/legend/legend_item'; +import { getSettingsSpecSelector } from './get_settings_specs'; const getParentDimensionSelector = (state: GlobalChartState) => state.parentDimensions; @@ -70,20 +72,18 @@ export const getLegendSizeSelector = createCachedSelector( if (!showLegend) { return { width: 0, height: 0 }; } - const legendItemWidth = - MARKER_WIDTH + MARKER_LEFT_MARGIN + bbox.width + (showLegendDisplayValue ? VALUE_LEFT_MARGIN : 0); + const legendItemWidth = MARKER_WIDTH + MARKER_LEFT_MARGIN + bbox.width + (showLegendDisplayValue ? VALUE_LEFT_MARGIN : 0); if (isVerticalAxis(legendPosition)) { const legendItemHeight = bbox.height + VERTICAL_PADDING * 2; return { width: Math.floor(Math.min(legendItemWidth + spacingBuffer, verticalWidth)), height: legendItemHeight, }; - } else { - const isSingleLine = (parentDimensions.width - 20) / 200 > labels.length; - return { - height: isSingleLine ? bbox.height + 16 : bbox.height * 2 + 24, - width: Math.floor(Math.min(legendItemWidth + spacingBuffer, verticalWidth)), - }; } + const isSingleLine = (parentDimensions.width - 20) / 200 > labels.length; + return { + height: isSingleLine ? bbox.height + 16 : bbox.height * 2 + 24, + width: Math.floor(Math.min(legendItemWidth + spacingBuffer, verticalWidth)), + }; }, )(getChartIdSelector); diff --git a/src/state/selectors/get_settings_specs.test.ts b/src/state/selectors/get_settings_specs.test.ts index 6e59bbfd4a..d31aee7ecc 100644 --- a/src/state/selectors/get_settings_specs.test.ts +++ b/src/state/selectors/get_settings_specs.test.ts @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { getSettingsSpecSelector } from './get_settings_specs'; -import { getInitialState } from '../chart_state'; import { DEFAULT_SETTINGS_SPEC } from '../../specs'; +import { getInitialState } from '../chart_state'; +import { getSettingsSpecSelector } from './get_settings_specs'; + describe('selectors - getSettingsSpecSelector', () => { const state = getInitialState('chartId1'); it('shall return the same reference', () => { diff --git a/src/state/selectors/get_settings_specs.ts b/src/state/selectors/get_settings_specs.ts index 0cbefd8466..982c81a2f3 100644 --- a/src/state/selectors/get_settings_specs.ts +++ b/src/state/selectors/get_settings_specs.ts @@ -14,13 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { GlobalChartState } from '../chart_state'; + import { ChartTypes } from '../../chart_types'; -import { getSpecsFromStore } from '../utils'; import { SettingsSpec, SpecTypes, DEFAULT_SETTINGS_SPEC } from '../../specs/settings'; +import { GlobalChartState } from '../chart_state'; +import { getSpecsFromStore } from '../utils'; import { getChartIdSelector } from './get_chart_id'; const getSpecs = (state: GlobalChartState) => state.specs; diff --git a/src/state/selectors/get_tooltip_header_formatter.ts b/src/state/selectors/get_tooltip_header_formatter.ts index 38ee8f12cb..4d657ef64e 100644 --- a/src/state/selectors/get_tooltip_header_formatter.ts +++ b/src/state/selectors/get_tooltip_header_formatter.ts @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import createCachedSelector from 're-reselect'; -import { getSettingsSpecSelector } from './get_settings_specs'; + import { SettingsSpec, TooltipValueFormatter, isTooltipProps } from '../../specs/settings'; import { getChartIdSelector } from './get_chart_id'; +import { getSettingsSpecSelector } from './get_settings_specs'; /** @internal */ export const getTooltipHeaderFormatterSelector = createCachedSelector( @@ -32,5 +34,4 @@ function getTooltipHeaderFormatter(settings: SettingsSpec): TooltipValueFormatte if (tooltip && isTooltipProps(tooltip)) { return tooltip.headerFormatter; } - return undefined; } diff --git a/src/state/selectors/is_chart_empty.ts b/src/state/selectors/is_chart_empty.ts index 54cb527d7a..30a40ea6e0 100644 --- a/src/state/selectors/is_chart_empty.ts +++ b/src/state/selectors/is_chart_empty.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { GlobalChartState } from '../chart_state'; @@ -22,7 +23,5 @@ import { GlobalChartState } from '../chart_state'; export const isInternalChartEmptySelector = (state: GlobalChartState): boolean | undefined => { if (state.internalChartState) { return state.internalChartState.isChartEmpty(state); - } else { - return undefined; } }; diff --git a/src/state/spec_factory.ts b/src/state/spec_factory.ts index 3e6a7a8ae7..e851e77d94 100644 --- a/src/state/spec_factory.ts +++ b/src/state/spec_factory.ts @@ -14,13 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { useEffect, useRef } from 'react'; -import { Dispatch, bindActionCreators } from 'redux'; import { connect } from 'react-redux'; -import { upsertSpec, removeSpec } from './actions/specs'; +import { Dispatch, bindActionCreators } from 'redux'; + import { Spec } from '../specs'; +import { upsertSpec, removeSpec } from './actions/specs'; /** @internal */ export interface DispatchProps { diff --git a/src/state/utils.test.ts b/src/state/utils.test.ts index df78932d2e..3edca46b22 100644 --- a/src/state/utils.test.ts +++ b/src/state/utils.test.ts @@ -14,11 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { getSpecsFromStore } from './utils'; import { ChartTypes } from '../chart_types'; import { SpecTypes } from '../specs/settings'; +import { getSpecsFromStore } from './utils'; describe('State utils', () => { it('getSpecsFromStore shall return always the same object reference excluding the array', () => { diff --git a/src/state/utils.ts b/src/state/utils.ts index 6f91bd8984..0e7148d345 100644 --- a/src/state/utils.ts +++ b/src/state/utils.ts @@ -14,11 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { SpecList, PointerState } from './chart_state'; -import { Spec } from '../specs'; import { ChartTypes } from '../chart_types'; +import { Spec } from '../specs'; +import { SpecList, PointerState } from './chart_state'; /** @internal */ export function getSpecsFromStore(specs: SpecList, chartType: ChartTypes, specType?: string): U[] { @@ -29,9 +30,7 @@ export function getSpecsFromStore(specs: SpecList, chartType: Ch const sameSpecType = specType ? currentSpec.specType === specType : true; return sameChartType && sameSpecType; }) - .map((specId) => { - return specs[specId] as U; - }); + .map((specId) => specs[specId] as U); } /** @internal */ diff --git a/src/utils/__mocks__/commons.ts b/src/utils/__mocks__/commons.ts index 7d43635644..9f75847475 100644 --- a/src/utils/__mocks__/commons.ts +++ b/src/utils/__mocks__/commons.ts @@ -14,12 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ const module = jest.requireActual('../commons.ts'); -export const ColorVariant = module.ColorVariant; -export const Position = module.Position; +export const { ColorVariant, Position } = module; export const identity = jest.fn(module.identity); export const compareByValueAsc = jest.fn(module.compareByValueAsc); diff --git a/src/utils/accessor.ts b/src/utils/accessor.ts index bbee6f8ece..acc970a65d 100644 --- a/src/utils/accessor.ts +++ b/src/utils/accessor.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { Datum } from './commons'; @@ -64,9 +65,7 @@ export type AccessorFormat = string | ((value: string) => string); * @internal */ export function getAccessorFn(accessor: Accessor): AccessorFn { - return (datum: Datum) => { - return typeof datum === 'object' && datum !== null ? datum[accessor as keyof typeof datum] : undefined; - }; + return (datum: Datum) => typeof datum === 'object' && datum !== null ? datum[accessor as keyof typeof datum] : undefined; } /** diff --git a/src/utils/bbox/bbox_calculator.ts b/src/utils/bbox/bbox_calculator.ts index 168112dc90..daf54fce74 100644 --- a/src/utils/bbox/bbox_calculator.ts +++ b/src/utils/bbox/bbox_calculator.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export interface BBox { width: number; diff --git a/src/utils/bbox/canvas_text_bbox_calculator.test.ts b/src/utils/bbox/canvas_text_bbox_calculator.test.ts index cc898212cf..ead76e1ccf 100644 --- a/src/utils/bbox/canvas_text_bbox_calculator.test.ts +++ b/src/utils/bbox/canvas_text_bbox_calculator.test.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { CanvasTextBBoxCalculator } from './canvas_text_bbox_calculator'; diff --git a/src/utils/bbox/canvas_text_bbox_calculator.ts b/src/utils/bbox/canvas_text_bbox_calculator.ts index 62e5309d71..1ff42f27e2 100644 --- a/src/utils/bbox/canvas_text_bbox_calculator.ts +++ b/src/utils/bbox/canvas_text_bbox_calculator.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { BBox, BBoxCalculator, DEFAULT_EMPTY_BBOX } from './bbox_calculator'; @@ -32,6 +33,7 @@ export class CanvasTextBBoxCalculator implements BBoxCalculator { this.attachedRoot = rootElement || document.documentElement; this.attachedRoot.appendChild(this.offscreenCanvas); } + compute(text: string, padding: number, fontSize = 16, fontFamily = 'Arial', lineHeight = 1, fontWeight = 400): BBox { if (!this.context) { return DEFAULT_EMPTY_BBOX; @@ -48,6 +50,7 @@ export class CanvasTextBBoxCalculator implements BBoxCalculator { height: fontSize * lineHeight, }; } + destroy(): void { this.attachedRoot.removeChild(this.offscreenCanvas); } diff --git a/src/utils/bbox/dom_text_bbox_calculator.ts b/src/utils/bbox/dom_text_bbox_calculator.ts index 07bd2f03c9..3f591eb889 100644 --- a/src/utils/bbox/dom_text_bbox_calculator.ts +++ b/src/utils/bbox/dom_text_bbox_calculator.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { BBox, BBoxCalculator } from './bbox_calculator'; @@ -31,6 +32,7 @@ export class DOMTextBBoxCalculator implements BBoxCalculator { this.attachedRoot = rootElement || document.documentElement; this.attachedRoot.appendChild(this.offscreenCanvas); } + compute(text: string, padding: number, fontSize = 16, fontFamily = 'Arial', lineHeight = 1, fontWeight = 400): BBox { this.offscreenCanvas.style.fontSize = `${fontSize}px`; this.offscreenCanvas.style.fontFamily = fontFamily; @@ -43,6 +45,7 @@ export class DOMTextBBoxCalculator implements BBoxCalculator { height: Math.ceil(this.offscreenCanvas.clientHeight), }; } + destroy(): void { this.attachedRoot.removeChild(this.offscreenCanvas); } diff --git a/src/utils/bbox/svg_text_bbox_calculator.ts b/src/utils/bbox/svg_text_bbox_calculator.ts index 0bbc80ab1e..c0fe521955 100644 --- a/src/utils/bbox/svg_text_bbox_calculator.ts +++ b/src/utils/bbox/svg_text_bbox_calculator.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { BBox, BBoxCalculator } from './bbox_calculator'; @@ -23,6 +24,7 @@ export class SvgTextBBoxCalculator implements BBoxCalculator { textElem: SVGTextElement; attachedRoot: HTMLElement; textNode: Text; + // TODO specify styles for text // TODO specify how to hide the svg from the current dom view // like moving it a -9999999px @@ -36,6 +38,7 @@ export class SvgTextBBoxCalculator implements BBoxCalculator { this.attachedRoot = rootElement || document.documentElement; this.attachedRoot.appendChild(this.svgElem); } + compute(text: string): BBox { this.textNode.textContent = text; const rect = this.textElem.getBoundingClientRect(); @@ -44,6 +47,7 @@ export class SvgTextBBoxCalculator implements BBoxCalculator { height: rect.height, }; } + destroy(): void { this.attachedRoot.removeChild(this.svgElem); } diff --git a/src/utils/chart_size.test.ts b/src/utils/chart_size.test.ts index 6c2adb89d6..12ddf19cee 100644 --- a/src/utils/chart_size.test.ts +++ b/src/utils/chart_size.test.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { getChartSize } from './chart_size'; diff --git a/src/utils/chart_size.ts b/src/utils/chart_size.ts index 1503582018..09f0c5c18d 100644 --- a/src/utils/chart_size.ts +++ b/src/utils/chart_size.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export type ChartSizeArray = [number | string | undefined, number | string | undefined]; export interface ChartSizeObject { @@ -34,7 +35,8 @@ export function getChartSize(size?: ChartSize): ChartSizeObject { width: size[0] === undefined ? '100%' : size[0], height: size[1] === undefined ? '100%' : size[1], }; - } else if (typeof size === 'object') { + } + if (typeof size === 'object') { return { width: size.width === undefined ? '100%' : size.width, height: size.height === undefined ? '100%' : size.height, diff --git a/src/utils/commons.test.ts b/src/utils/commons.test.ts index 12a4608ea1..dbccc1b8bf 100644 --- a/src/utils/commons.test.ts +++ b/src/utils/commons.test.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { maxValueWithUpperLimit, @@ -56,7 +57,7 @@ describe('commons utilities', () => { const a = {}; expect(identity(a)).toBe(a); expect(identity(null)).toBe(null); - expect(identity(undefined)).toBe(undefined); + expect(identity(undefined)).toBeUndefined(); const fn = () => ({}); expect(identity(fn)).toBe(fn); }); @@ -430,7 +431,7 @@ describe('commons utilities', () => { const newBase = mergePartial(base, partial); expect(newBase).toEqual({ ...newBase, - array1: partial!.array1, + array1: partial.array1, }); }); @@ -439,7 +440,7 @@ describe('commons utilities', () => { const newBase = mergePartial(base, partial); expect(newBase).toEqual({ ...newBase, - array2: partial!.array2, + array2: partial.array2, }); }); @@ -450,7 +451,7 @@ describe('commons utilities', () => { ...newBase, nested: { ...newBase.nested, - number: partial!.nested!.number, + number: partial.nested!.number, }, }); }); @@ -508,7 +509,7 @@ describe('commons utilities', () => { ); }); - it('should merge nested Maps', () => { + it('should merge nested Maps with partail', () => { const result = mergePartial( { test: new Map([ @@ -895,7 +896,7 @@ describe('commons utilities', () => { const newBase = mergePartial(base, partial, {}, partials); expect(newBase).toEqual({ ...newBase, - array2: partials![1].array2, + array2: partials[1].array2, }); }); @@ -907,7 +908,7 @@ describe('commons utilities', () => { ...newBase, nested: { ...newBase.nested, - number: partial!.nested!.number, + number: partial.nested!.number, }, }); }); @@ -920,7 +921,7 @@ describe('commons utilities', () => { ...newBase, nested: { ...newBase.nested, - number: partials![0].nested!.number, + number: partials[0].nested!.number, }, }); }); diff --git a/src/utils/commons.ts b/src/utils/commons.ts index 40d5c4c76a..bc44be706a 100644 --- a/src/utils/commons.ts +++ b/src/utils/commons.ts @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { v1 as uuidV1 } from 'uuid'; import { $Values } from 'utility-types'; +import { v1 as uuidV1 } from 'uuid'; + import { PrimitiveValue } from '../chart_types/partition_chart/layout/utils/group_by_rollup'; /** @@ -29,11 +31,11 @@ export const ColorVariant = Object.freeze({ * Uses series color. Rather than setting a static color, this will use the * default series color for a given series. */ - Series: '__use__series__color__' as '__use__series__color__', + Series: '__use__series__color__' as const, /** * Uses empty color, similar to transparent. */ - None: '__use__empty__color__' as '__use__empty__color__', + None: '__use__empty__color__' as const, }); export type ColorVariant = $Values; @@ -44,10 +46,10 @@ export type Color = string; export type StrokeStyle = Color; // now narrower than string | CanvasGradient | CanvasPattern export const Position = Object.freeze({ - Top: 'top' as 'top', - Bottom: 'bottom' as 'bottom', - Left: 'left' as 'left', - Right: 'right' as 'right', + Top: 'top' as const, + Bottom: 'bottom' as const, + Left: 'left' as const, + Right: 'right' as const, }); export type Position = $Values; @@ -86,7 +88,8 @@ export function maxValueWithUpperLimit(val1: number, val2: number, upperLimit: n /** * Returns color given any color variant * - * @internal */ + * @internal + */ export function getColorFromVariant(seriesColor: Color, color?: Color | ColorVariant): Color { if (color === ColorVariant.Series) { return seriesColor; @@ -274,10 +277,9 @@ export function mergePartial( ); } } else if (!(key in baseClone)) { - (baseClone as any)[key] = - (partial as any)[key] !== undefined - ? (partial as any)[key] - : (additionalPartials.find((v: any) => v[key] !== undefined) || ({} as any))[key]; + baseClone[key] = (partial as any)[key] !== undefined + ? (partial as any)[key] + : (additionalPartials.find((v: any) => v[key] !== undefined) || ({} as any))[key]; } }); } @@ -314,7 +316,7 @@ export function mergePartial( const partialValues = additionalPartials.map((v) => (typeof v === 'object' ? (v as any)[key] : undefined)); const baseValue = (base as any)[key]; - (newBase as any)[key] = mergePartial(baseValue, partialValue, options, partialValues); + newBase[key] = mergePartial(baseValue, partialValue, options, partialValues); return newBase; }, baseClone); diff --git a/src/utils/curves.test.ts b/src/utils/curves.test.ts index 8a9ced15a7..57621b347c 100644 --- a/src/utils/curves.test.ts +++ b/src/utils/curves.test.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { curveBasis, @@ -28,6 +29,7 @@ import { curveStepAfter, curveStepBefore, } from 'd3-shape'; + import { CurveType, getCurveFactory } from './curves'; describe('Curve utils', () => { diff --git a/src/utils/curves.ts b/src/utils/curves.ts index 6e2d0f5fb1..74d0a104d0 100644 --- a/src/utils/curves.ts +++ b/src/utils/curves.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { curveBasis, @@ -31,16 +32,16 @@ import { import { $Values } from 'utility-types'; export const CurveType = Object.freeze({ - CURVE_CARDINAL: 0 as 0, - CURVE_NATURAL: 1 as 1, - CURVE_MONOTONE_X: 2 as 2, - CURVE_MONOTONE_Y: 3 as 3, - CURVE_BASIS: 4 as 4, - CURVE_CATMULL_ROM: 5 as 5, - CURVE_STEP: 6 as 6, - CURVE_STEP_AFTER: 7 as 7, - CURVE_STEP_BEFORE: 8 as 8, - LINEAR: 9 as 9, + CURVE_CARDINAL: 0 as const, + CURVE_NATURAL: 1 as const, + CURVE_MONOTONE_X: 2 as const, + CURVE_MONOTONE_Y: 3 as const, + CURVE_BASIS: 4 as const, + CURVE_CATMULL_ROM: 5 as const, + CURVE_STEP: 6 as const, + CURVE_STEP_AFTER: 7 as const, + CURVE_STEP_BEFORE: 8 as const, + LINEAR: 9 as const, }); export type CurveType = $Values; diff --git a/src/utils/data/date_time.ts b/src/utils/data/date_time.ts index 5bc382e128..1a6be01f92 100644 --- a/src/utils/data/date_time.ts +++ b/src/utils/data/date_time.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import moment from 'moment-timezone'; diff --git a/src/utils/data/formatters.ts b/src/utils/data/formatters.ts index eae397b66f..32bbcb42cb 100644 --- a/src/utils/data/formatters.ts +++ b/src/utils/data/formatters.ts @@ -14,16 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import moment from 'moment-timezone'; import { TickFormatter, TickFormatterOptions } from '../../chart_types/xy_chart/utils/specs'; import { getMomentWithTz } from './date_time'; -import moment from 'moment-timezone'; export function timeFormatter(format: string): TickFormatter { - return (value: number, options?: TickFormatterOptions): string => { - return getMomentWithTz(value, options && options.timeZone).format(format); - }; + return (value: number, options?: TickFormatterOptions): string => getMomentWithTz(value, options && options.timeZone).format(format); } export function niceTimeFormatter(domain: [number, number]): TickFormatter { diff --git a/src/utils/data/formatters.tz.test.ts b/src/utils/data/formatters.tz.test.ts index 55071eb400..c6c4361074 100644 --- a/src/utils/data/formatters.tz.test.ts +++ b/src/utils/data/formatters.tz.test.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { niceTimeFormatter } from './formatters'; diff --git a/src/utils/data/formatters.tz.test.utc.ts b/src/utils/data/formatters.tz.test.utc.ts index dc07c5cc8e..cc33e0192f 100644 --- a/src/utils/data/formatters.tz.test.utc.ts +++ b/src/utils/data/formatters.tz.test.utc.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { niceTimeFormatter } from './formatters'; diff --git a/src/utils/data_generators/data_generator.ts b/src/utils/data_generators/data_generator.ts index 851bd82a43..1ddbdceba5 100644 --- a/src/utils/data_generators/data_generator.ts +++ b/src/utils/data_generators/data_generator.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { Simple1DNoise } from './simple_noise'; @@ -39,55 +40,49 @@ export class DataGenerator { private randomNumberGenerator: RandomNumberGenerator; private generator: Simple1DNoise; private frequency: number; + constructor(frequency = 500, randomNumberGenerator: RandomNumberGenerator = defaultRNG) { this.randomNumberGenerator = randomNumberGenerator; this.generator = new Simple1DNoise(this.randomNumberGenerator); this.frequency = frequency; } + generateBasicSeries(totalPoints = 50, offset = 0, amplitude = 1) { - const dataPoints = new Array(totalPoints).fill(0).map((_, i) => { - return { - x: i, - y: (this.generator.getValue(i) + offset) * amplitude, - }; - }); + const dataPoints = new Array(totalPoints).fill(0).map((_, i) => ({ + x: i, + y: (this.generator.getValue(i) + offset) * amplitude, + })); return dataPoints; } + generateSimpleSeries(totalPoints = 50, groupIndex = 1, groupPrefix = '') { const group = String.fromCharCode(97 + groupIndex); - const dataPoints = new Array(totalPoints).fill(0).map((_, i) => { - return { - x: i, - y: 3 + Math.sin(i / this.frequency) + this.generator.getValue(i), - g: `${groupPrefix}${group}`, - }; - }); + const dataPoints = new Array(totalPoints).fill(0).map((_, i) => ({ + x: i, + y: 3 + Math.sin(i / this.frequency) + this.generator.getValue(i), + g: `${groupPrefix}${group}`, + })); return dataPoints; } + generateGroupedSeries(totalPoints = 50, totalGroups = 2, groupPrefix = '') { - const groups = new Array(totalGroups).fill(0).map((group, i) => { - // eslint-disable-line - return this.generateSimpleSeries(totalPoints, i, groupPrefix); - }); + const groups = new Array(totalGroups).fill(0).map((group, i) => this.generateSimpleSeries(totalPoints, i, groupPrefix)); return groups.reduce((acc, curr) => [...acc, ...curr]); } + generateRandomSeries(totalPoints = 50, groupIndex = 1, groupPrefix = '') { const group = String.fromCharCode(97 + groupIndex); - const dataPoints = new Array(totalPoints).fill(0).map(() => { - return { - x: this.randomNumberGenerator(0, 100), - y: this.randomNumberGenerator(0, 100), - z: this.randomNumberGenerator(0, 100), - g: `${groupPrefix}${group}`, - }; - }); + const dataPoints = new Array(totalPoints).fill(0).map(() => ({ + x: this.randomNumberGenerator(0, 100), + y: this.randomNumberGenerator(0, 100), + z: this.randomNumberGenerator(0, 100), + g: `${groupPrefix}${group}`, + })); return dataPoints; } + generateRandomGroupedSeries(totalPoints = 50, totalGroups = 2, groupPrefix = '') { - const groups = new Array(totalGroups).fill(0).map((group, i) => { - // eslint-disable-line - return this.generateRandomSeries(totalPoints, i, groupPrefix); - }); + const groups = new Array(totalGroups).fill(0).map((group, i) => this.generateRandomSeries(totalPoints, i, groupPrefix)); return groups.reduce((acc, curr) => [...acc, ...curr]); } } diff --git a/src/utils/data_generators/simple_noise.ts b/src/utils/data_generators/simple_noise.ts index ddfbec7f60..1977f006f0 100644 --- a/src/utils/data_generators/simple_noise.ts +++ b/src/utils/data_generators/simple_noise.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { RandomNumberGenerator } from './data_generator'; diff --git a/src/utils/data_samples/test_dataset.ts b/src/utils/data_samples/test_dataset.ts index 6450f3e852..e96afbb7b0 100644 --- a/src/utils/data_samples/test_dataset.ts +++ b/src/utils/data_samples/test_dataset.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export const BARCHART_1Y0G = [ { x: 0, y: 1 }, diff --git a/src/utils/data_samples/test_dataset_github.ts b/src/utils/data_samples/test_dataset_github.ts index cddf1cb63a..4b4c5002c7 100644 --- a/src/utils/data_samples/test_dataset_github.ts +++ b/src/utils/data_samples/test_dataset_github.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export const GITHUB_DATASET = [ { diff --git a/src/utils/data_samples/test_dataset_kibana.ts b/src/utils/data_samples/test_dataset_kibana.ts index ab508ae5f0..0affba76a8 100644 --- a/src/utils/data_samples/test_dataset_kibana.ts +++ b/src/utils/data_samples/test_dataset_kibana.ts @@ -1,4 +1,3 @@ -/* eslint @typescript-eslint/camelcase:0 */ /* * Licensed to Elasticsearch B.V. under one or more contributor * license agreements. See the NOTICE file distributed with @@ -15,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export const KIBANA_METRICS = { metrics: { diff --git a/src/utils/data_samples/test_dataset_random.ts b/src/utils/data_samples/test_dataset_random.ts index 304a6c4def..07dc5a0c9a 100644 --- a/src/utils/data_samples/test_dataset_random.ts +++ b/src/utils/data_samples/test_dataset_random.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export const SINGLE_SERIES_DATASET_50 = [ { diff --git a/src/utils/data_samples/test_dataset_tsvb.ts b/src/utils/data_samples/test_dataset_tsvb.ts index 9b62ffb4b7..e27b552c1e 100644 --- a/src/utils/data_samples/test_dataset_tsvb.ts +++ b/src/utils/data_samples/test_dataset_tsvb.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export const TSVB_DATASET = { id: '61ca57f0-469d-11e7-af02-69e470af7417', diff --git a/src/utils/dimensions.ts b/src/utils/dimensions.ts index 44ff02531d..efbdbd028d 100644 --- a/src/utils/dimensions.ts +++ b/src/utils/dimensions.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export interface Dimensions { top: number; @@ -31,6 +32,8 @@ export interface PerSideDistance { right: number; } -// fixme consider deactivating @typescript-eslint/no-empty-interface -// see https://github.com/elastic/elastic-charts/pull/660#discussion_r419474171 +/* + * fixme consider deactivating @typescript-eslint/no-empty-interface + * see https://github.com/elastic/elastic-charts/pull/660#discussion_r419474171 + */ export type Margins = PerSideDistance; diff --git a/src/utils/domain.test.ts b/src/utils/domain.test.ts index 90d6da936d..72ada25cac 100644 --- a/src/utils/domain.test.ts +++ b/src/utils/domain.test.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { AccessorFn } from './accessor'; import { diff --git a/src/utils/domain.ts b/src/utils/domain.ts index 1f2a793d10..5ac0c677be 100644 --- a/src/utils/domain.ts +++ b/src/utils/domain.ts @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { extent, sum } from 'd3-array'; import { nest } from 'd3-collection'; + import { AccessorFn } from './accessor'; export type Domain = any[]; @@ -37,9 +39,7 @@ export function computeOrdinalDataDomain( const domain = data.map(accessor).filter((d) => (removeNull ? d !== null : true)); const uniqueValues = [...new Set(domain)]; return sorted - ? uniqueValues.sort((a, b) => { - return `${a}`.localeCompare(`${b}`); - }) + ? uniqueValues.sort((a, b) => `${a}`.localeCompare(`${b}`)) : uniqueValues; } @@ -67,7 +67,8 @@ export function computeDomainExtent( if (start != null && end != null) { if (start >= 0 && end >= 0) { return scaleToExtent || fitToExtent ? [start, end] : [0, end]; - } else if (start < 0 && end < 0) { + } + if (start < 0 && end < 0) { return scaleToExtent || fitToExtent ? [start, end] : [start, 0]; } return [start, end]; @@ -99,9 +100,7 @@ export function computeStackedContinuousDomain( ): any { const groups = nest() .key((datum: any) => `${xAccessor(datum)}`) - .rollup((values: any) => { - return sum(values, yAccessor); - }) + .rollup((values: any) => sum(values, yAccessor)) .entries(data); const cumulativeSumAccessor = (d: any) => d.value; return computeContinuousDataDomain(groups, cumulativeSumAccessor, scaleToExtent); diff --git a/src/utils/events.ts b/src/utils/events.ts index 6ca30c92f7..747c0b61d7 100644 --- a/src/utils/events.ts +++ b/src/utils/events.ts @@ -14,10 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { PointerEvent, isPointerOverEvent, PointerOverEvent } from '../specs'; import { Scale } from '../scales'; +import { PointerEvent, isPointerOverEvent, PointerOverEvent } from '../specs'; /** @internal */ export function isValidPointerOverEvent( diff --git a/src/utils/fast_deep_equal.ts b/src/utils/fast_deep_equal.ts index 482ee72a81..c78c53bc8f 100644 --- a/src/utils/fast_deep_equal.ts +++ b/src/utils/fast_deep_equal.ts @@ -1,4 +1,4 @@ -/* eslint-disable file-header/file-header */ +/* eslint-disable header/header, @typescript-eslint/explicit-module-boundary-types, prefer-destructuring, no-restricted-syntax, no-self-compare */ /** * @notice @@ -32,7 +32,7 @@ export function deepEqual(a: any, b: any): boolean { if (a === b) return true; - if (a && b && typeof a == 'object' && typeof b == 'object') { + if (a && b && typeof a === 'object' && typeof b === 'object') { if (a.constructor !== b.constructor) return false; let length: number; @@ -41,7 +41,7 @@ export function deepEqual(a: any, b: any): boolean { if (Array.isArray(a)) { length = a.length; if (length != b.length) return false; - for (i = length; i-- !== 0; ) if (!deepEqual(a[i], b[i])) return false; + for (i = length; i-- !== 0;) if (!deepEqual(a[i], b[i])) return false; return true; } if (a instanceof Map && b instanceof Map) { @@ -68,9 +68,9 @@ export function deepEqual(a: any, b: any): boolean { length = keys.length; if (length !== Object.keys(b).length) return false; - for (i = length; i-- !== 0; ) if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false; + for (i = length; i-- !== 0;) if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false; - for (i = length; i-- !== 0; ) { + for (i = length; i-- !== 0;) { const key = keys[i]; if (key === '_owner' && a.$$typeof) { // React-specific: avoid traversing React elements' _owner. @@ -87,3 +87,5 @@ export function deepEqual(a: any, b: any): boolean { // true if both NaN, false otherwise return a !== a && b !== b; } + +/* eslint-enable */ diff --git a/src/utils/geometry.ts b/src/utils/geometry.ts index 9f1a8e8a99..ced00b4c58 100644 --- a/src/utils/geometry.ts +++ b/src/utils/geometry.ts @@ -14,19 +14,21 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { $Values } from 'utility-types'; -import { BarSeriesStyle, PointStyle, AreaStyle, LineStyle, ArcStyle } from './themes/theme'; + import { XYChartSeriesIdentifier } from '../chart_types/xy_chart/utils/series'; import { Color } from './commons'; +import { BarSeriesStyle, PointStyle, AreaStyle, LineStyle, ArcStyle } from './themes/theme'; /** * The accessor type */ export const BandedAccessorType = Object.freeze({ - Y0: 'y0' as 'y0', - Y1: 'y1' as 'y1', + Y0: 'y0' as const, + Y1: 'y1' as const, }); export type BandedAccessorType = $Values; diff --git a/src/utils/ids.test.ts b/src/utils/ids.test.ts index d1268418da..a3fb08b584 100644 --- a/src/utils/ids.test.ts +++ b/src/utils/ids.test.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { AnnotationId, AxisId, GroupId } from './ids'; diff --git a/src/utils/ids.ts b/src/utils/ids.ts index 2e4d02133d..995e1a25a2 100644 --- a/src/utils/ids.ts +++ b/src/utils/ids.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export type GroupId = string; export type AxisId = string; diff --git a/src/utils/point.ts b/src/utils/point.ts index 930a9df73f..295f6451b9 100644 --- a/src/utils/point.ts +++ b/src/utils/point.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export interface Point { x: number; diff --git a/src/utils/themes/colors.ts b/src/utils/themes/colors.ts index 14ddc7e4c7..417da04509 100644 --- a/src/utils/themes/colors.ts +++ b/src/utils/themes/colors.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export interface ColorScales { [key: string]: string; diff --git a/src/utils/themes/dark_theme.ts b/src/utils/themes/dark_theme.ts index 834e846cde..bdee8e4180 100644 --- a/src/utils/themes/dark_theme.ts +++ b/src/utils/themes/dark_theme.ts @@ -14,11 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { palettes } from './colors'; import { Theme } from './theme'; - import { DEFAULT_CHART_MARGINS, DEFAULT_CHART_PADDING, diff --git a/src/utils/themes/light_theme.ts b/src/utils/themes/light_theme.ts index b434763791..379630b7a7 100644 --- a/src/utils/themes/light_theme.ts +++ b/src/utils/themes/light_theme.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { palettes } from './colors'; import { Theme } from './theme'; diff --git a/src/utils/themes/theme.test.ts b/src/utils/themes/theme.test.ts index c82b11b02c..206d5206f2 100644 --- a/src/utils/themes/theme.test.ts +++ b/src/utils/themes/theme.test.ts @@ -14,9 +14,10 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { Margins } from '../../utils/dimensions'; +import { Margins } from '../dimensions'; import { DARK_THEME } from './dark_theme'; import { LIGHT_THEME } from './light_theme'; import { @@ -260,11 +261,11 @@ describe('Theme', () => { }, rectBorder: { ...DARK_THEME.barSeriesStyle.rectBorder, - ...partialTheme!.barSeriesStyle!.rectBorder, + ...partialTheme.barSeriesStyle!.rectBorder, }, displayValue: { ...DARK_THEME.barSeriesStyle.displayValue, - ...partialTheme!.barSeriesStyle!.displayValue, + ...partialTheme.barSeriesStyle!.displayValue, }, }, }); @@ -285,7 +286,7 @@ describe('Theme', () => { ...DARK_THEME.sharedStyle, highlighted: { ...DARK_THEME.sharedStyle.highlighted, - ...partialTheme!.sharedStyle!.highlighted, + ...partialTheme.sharedStyle!.highlighted, }, }, }); @@ -302,7 +303,7 @@ describe('Theme', () => { ...DARK_THEME, scales: { ...DARK_THEME.scales, - ...partialTheme!.scales, + ...partialTheme.scales, }, }); }); @@ -325,11 +326,11 @@ describe('Theme', () => { ...DARK_THEME.axes, axisTitleStyle: { ...DARK_THEME.axes.axisTitleStyle, - ...partialTheme!.axes!.axisTitleStyle, + ...partialTheme.axes!.axisTitleStyle, }, axisLineStyle: { ...DARK_THEME.axes.axisLineStyle, - ...partialTheme!.axes!.axisLineStyle, + ...partialTheme.axes!.axisLineStyle, }, }, }); @@ -346,7 +347,7 @@ describe('Theme', () => { ...DARK_THEME, colors: { ...DARK_THEME.colors, - ...partialTheme!.colors, + ...partialTheme.colors, }, }); }); @@ -362,7 +363,7 @@ describe('Theme', () => { ...DARK_THEME, legend: { ...DARK_THEME.legend, - ...partialTheme!.legend, + ...partialTheme.legend, }, }); }); @@ -385,11 +386,11 @@ describe('Theme', () => { ...DARK_THEME.crosshair, band: { ...DARK_THEME.crosshair.band, - ...partialTheme!.crosshair!.band, + ...partialTheme.crosshair!.band, }, line: { ...DARK_THEME.crosshair.line, - ...partialTheme!.crosshair!.line, + ...partialTheme.crosshair!.line, }, }, }); diff --git a/src/utils/themes/theme.ts b/src/utils/themes/theme.ts index e888da1ccd..ff6ff47fba 100644 --- a/src/utils/themes/theme.ts +++ b/src/utils/themes/theme.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { mergePartial, RecursivePartial, Color, ColorVariant } from '../commons'; import { Margins } from '../dimensions'; diff --git a/src/utils/themes/theme_commons.ts b/src/utils/themes/theme_commons.ts index 04abda1093..70a7ec79e1 100644 --- a/src/utils/themes/theme_commons.ts +++ b/src/utils/themes/theme_commons.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { Margins } from '../dimensions'; import { SharedGeometryStateStyle } from './theme'; diff --git a/stories/annotations/lines/1_x_continuous.tsx b/stories/annotations/lines/1_x_continuous.tsx index 6f2b4b18bb..95cee1093c 100644 --- a/stories/annotations/lines/1_x_continuous.tsx +++ b/stories/annotations/lines/1_x_continuous.tsx @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean } from '@storybook/addon-knobs'; import React from 'react'; + import { AnnotationDomainTypes, Axis, @@ -29,8 +31,8 @@ import { Settings, } from '../../../src'; import { Icon } from '../../../src/components/icons/icon'; -import { getChartRotationKnob, arrayKnobs } from '../../utils/knobs'; import { Position } from '../../../src/utils/commons'; +import { getChartRotationKnob, arrayKnobs } from '../../utils/knobs'; function generateAnnotationData(values: any[]): LineAnnotationDatum[] { return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` })); diff --git a/stories/annotations/lines/2_x_ordinal.tsx b/stories/annotations/lines/2_x_ordinal.tsx index 416a40278e..4635245236 100644 --- a/stories/annotations/lines/2_x_ordinal.tsx +++ b/stories/annotations/lines/2_x_ordinal.tsx @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean } from '@storybook/addon-knobs'; import React from 'react'; + import { AnnotationDomainTypes, Axis, @@ -29,8 +31,8 @@ import { Settings, } from '../../../src'; import { Icon } from '../../../src/components/icons/icon'; -import { getChartRotationKnob, arrayKnobs } from '../../utils/knobs'; import { Position } from '../../../src/utils/commons'; +import { getChartRotationKnob, arrayKnobs } from '../../utils/knobs'; function generateAnnotationData(values: any[]): LineAnnotationDatum[] { return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` })); diff --git a/stories/annotations/lines/3_x_time.tsx b/stories/annotations/lines/3_x_time.tsx index 439ce69495..1c848e087a 100644 --- a/stories/annotations/lines/3_x_time.tsx +++ b/stories/annotations/lines/3_x_time.tsx @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean } from '@storybook/addon-knobs'; import React from 'react'; + import { AnnotationDomainTypes, Axis, @@ -30,9 +32,9 @@ import { timeFormatter, } from '../../../src'; import { Icon } from '../../../src/components/icons/icon'; +import { Position } from '../../../src/utils/commons'; import { KIBANA_METRICS } from '../../../src/utils/data_samples/test_dataset_kibana'; import { getChartRotationKnob } from '../../utils/knobs'; -import { Position } from '../../../src/utils/commons'; const dateFormatter = timeFormatter('HH:mm:ss'); diff --git a/stories/annotations/lines/4_y_domain.tsx b/stories/annotations/lines/4_y_domain.tsx index 936b6209f2..bc8d2519d0 100644 --- a/stories/annotations/lines/4_y_domain.tsx +++ b/stories/annotations/lines/4_y_domain.tsx @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean } from '@storybook/addon-knobs'; import React from 'react'; + import { AnnotationDomainTypes, Axis, @@ -29,8 +31,8 @@ import { Settings, } from '../../../src'; import { Icon } from '../../../src/components/icons/icon'; -import { getChartRotationKnob, arrayKnobs } from '../../utils/knobs'; import { Position } from '../../../src/utils/commons'; +import { getChartRotationKnob, arrayKnobs } from '../../utils/knobs'; function generateAnnotationData(values: any[]): LineAnnotationDatum[] { return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` })); diff --git a/stories/annotations/lines/5_styling.tsx b/stories/annotations/lines/5_styling.tsx index c4aac6d574..88a4c26cba 100644 --- a/stories/annotations/lines/5_styling.tsx +++ b/stories/annotations/lines/5_styling.tsx @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean, color, number, select } from '@storybook/addon-knobs'; import React from 'react'; + import { AnnotationDomainTypes, Axis, @@ -30,8 +32,8 @@ import { LineAnnotationStyle, } from '../../../src'; import { Icon } from '../../../src/components/icons/icon'; -import { getChartRotationKnob } from '../../utils/knobs'; import { Position } from '../../../src/utils/commons'; +import { getChartRotationKnob } from '../../utils/knobs'; function generateAnnotationData(values: any[]): LineAnnotationDatum[] { return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` })); diff --git a/stories/annotations/lines/6_test_single_bar_histogram.tsx b/stories/annotations/lines/6_test_single_bar_histogram.tsx index e44c8b7dd9..2f3172ad75 100644 --- a/stories/annotations/lines/6_test_single_bar_histogram.tsx +++ b/stories/annotations/lines/6_test_single_bar_histogram.tsx @@ -14,13 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean } from '@storybook/addon-knobs'; import React from 'react'; + import { AnnotationDomainTypes, Axis, BarSeries, Chart, LineAnnotation, ScaleType, Settings } from '../../../src'; -import { getChartRotationKnob } from '../../utils/knobs'; import { Position } from '../../../src/utils/commons'; +import { getChartRotationKnob } from '../../utils/knobs'; export const Example = () => { const debug = boolean('debug', false); @@ -63,7 +65,7 @@ export const Example = () => { { const debug = boolean('debug', false); diff --git a/stories/annotations/rects/2_ordinal_bar_chart.tsx b/stories/annotations/rects/2_ordinal_bar_chart.tsx index 7042928d32..a2329a6412 100644 --- a/stories/annotations/rects/2_ordinal_bar_chart.tsx +++ b/stories/annotations/rects/2_ordinal_bar_chart.tsx @@ -14,13 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean } from '@storybook/addon-knobs'; import React from 'react'; + import { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings } from '../../../src'; -import { getChartRotationKnob } from '../../utils/knobs'; import { Position } from '../../../src/utils/commons'; +import { getChartRotationKnob } from '../../utils/knobs'; export const Example = () => { const debug = boolean('debug', false); diff --git a/stories/annotations/rects/3_linear_line_chart.tsx b/stories/annotations/rects/3_linear_line_chart.tsx index 8bdade6d5c..d5049c85d8 100644 --- a/stories/annotations/rects/3_linear_line_chart.tsx +++ b/stories/annotations/rects/3_linear_line_chart.tsx @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean, select } from '@storybook/addon-knobs'; import React from 'react'; + import { Axis, Chart, LineSeries, RectAnnotation, ScaleType, Settings, RectAnnotationDatum } from '../../../src'; -import { getChartRotationKnob } from '../../utils/knobs'; -import { BandedAccessorType } from '../../../src/utils/geometry'; import { Position } from '../../../src/utils/commons'; +import { BandedAccessorType } from '../../../src/utils/geometry'; +import { getChartRotationKnob } from '../../utils/knobs'; export const Example = () => { const debug = boolean('debug', false); @@ -52,7 +54,7 @@ export const Example = () => { const dataValuesBlue: RectAnnotationDatum[] = [ { coordinates: { - x0: 2.0, + x0: 2, x1: 2.1, y0: 0, y1: 7, diff --git a/stories/annotations/rects/4_styling.tsx b/stories/annotations/rects/4_styling.tsx index 47abc04c68..2474837aed 100644 --- a/stories/annotations/rects/4_styling.tsx +++ b/stories/annotations/rects/4_styling.tsx @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean, color, number } from '@storybook/addon-knobs'; import React from 'react'; + import { Axis, Chart, LineSeries, RectAnnotation, ScaleType, Settings } from '../../../src'; import { Icon } from '../../../src/components/icons/icon'; -import { getChartRotationKnob } from '../../utils/knobs'; import { Position } from '../../../src/utils/commons'; +import { getChartRotationKnob } from '../../utils/knobs'; export const Example = () => { const debug = boolean('debug', false); diff --git a/stories/annotations/rects/5_tooltip_visibility.tsx b/stories/annotations/rects/5_tooltip_visibility.tsx index e82d7e9c62..916d274b7d 100644 --- a/stories/annotations/rects/5_tooltip_visibility.tsx +++ b/stories/annotations/rects/5_tooltip_visibility.tsx @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { select } from '@storybook/addon-knobs'; import React from 'react'; + import { AnnotationTooltipFormatter, Axis, BarSeries, Chart, ScaleType, RectAnnotation } from '../../../src'; import { Position } from '../../../src/utils/commons'; diff --git a/stories/annotations/rects/rects.stories.tsx b/stories/annotations/rects/rects.stories.tsx index b625287276..d3442ef2ac 100644 --- a/stories/annotations/rects/rects.stories.tsx +++ b/stories/annotations/rects/rects.stories.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { SB_KNOBS_PANEL } from '../../utils/storybook'; diff --git a/stories/area/10_stacked_same_naming.tsx b/stories/area/10_stacked_same_naming.tsx index 1e98f4f3ee..f5b0508d3f 100644 --- a/stories/area/10_stacked_same_naming.tsx +++ b/stories/area/10_stacked_same_naming.tsx @@ -14,65 +14,65 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + import { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; import { SB_SOURCE_PANEL } from '../utils/storybook'; const dateFormatter = timeFormatter('HH:mm'); -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} - /> - - - - - ); -}; +export const Example = () => ( + + + + Number(d).toFixed(2)} + /> + + + + +); // storybook configuration Example.story = { diff --git a/stories/area/11_test_linear.tsx b/stories/area/11_test_linear.tsx index a0332899d1..edb87f88f9 100644 --- a/stories/area/11_test_linear.tsx +++ b/stories/area/11_test_linear.tsx @@ -14,9 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + import { AreaSeries, Axis, Chart, Position, ScaleType } from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; import { SB_SOURCE_PANEL } from '../utils/storybook'; diff --git a/stories/area/12_test_time.tsx b/stories/area/12_test_time.tsx index fe09a7d320..99fcb1f0d3 100644 --- a/stories/area/12_test_time.tsx +++ b/stories/area/12_test_time.tsx @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { DateTime } from 'luxon'; import React from 'react'; + import { AreaSeries, Axis, Chart, Position, ScaleType, timeFormatter } from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; import { SB_SOURCE_PANEL } from '../utils/storybook'; diff --git a/stories/area/13_band_area.tsx b/stories/area/13_band_area.tsx index 9a8f4e62cc..0a5555bbc8 100644 --- a/stories/area/13_band_area.tsx +++ b/stories/area/13_band_area.tsx @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean, text } from '@storybook/addon-knobs'; import React from 'react'; + import { AreaSeries, Axis, @@ -29,23 +31,19 @@ import { Settings, timeFormatter, } from '../../src'; -import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; import { getRandomNumberGenerator } from '../../src/mocks/utils'; +import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; const dateFormatter = timeFormatter('HH:mm'); export const Example = () => { const getRandomNumber = getRandomNumberGenerator(); - const data = KIBANA_METRICS.metrics.kibana_os_load[0].data.map((d) => { - return { - x: d[0], - max: d[1] + 4 + 4 * getRandomNumber(), - min: d[1] - 4 - 4 * getRandomNumber(), - }; - }); - const lineData = KIBANA_METRICS.metrics.kibana_os_load[0].data.map((d) => { - return [d[0], d[1]]; - }); + const data = KIBANA_METRICS.metrics.kibana_os_load[0].data.map((d) => ({ + x: d[0], + max: d[1] + 4 + 4 * getRandomNumber(), + min: d[1] - 4 - 4 * getRandomNumber(), + })); + const lineData = KIBANA_METRICS.metrics.kibana_os_load[0].data.map((d) => [d[0], d[1]]); const scaleToDataExtent = boolean('scale to extent', true); const y0AccessorFormat = text('y0AccessorFormat', ''); const y1AccessorFormat = text('y1AccessorFormat', ''); @@ -56,7 +54,7 @@ export const Example = () => { id="bottom" title="timestamp per 1 minute" position={Position.Bottom} - showOverlappingTicks={true} + showOverlappingTicks tickFormat={dateFormatter} /> { - const data = KIBANA_METRICS.metrics.kibana_os_load[0].data; + const { data } = KIBANA_METRICS.metrics.kibana_os_load[0]; const data2 = KIBANA_METRICS.metrics.kibana_os_load[0].data.map((d) => [d[0], 20, 10]); const scaleToDataExtent = boolean('scale to extent', false); @@ -35,7 +37,7 @@ export const Example = () => { id="bottom" title="timestamp per 1 minute" position={Position.Bottom} - showOverlappingTicks={true} + showOverlappingTicks tickFormat={dateFormatter} /> { - const data = KIBANA_METRICS.metrics.kibana_os_load[0].data; + const { data } = KIBANA_METRICS.metrics.kibana_os_load[0]; return ( { - return ( - - - Number(d).toFixed(2)} - /> +export const Example = () => ( + + + Number(d).toFixed(2)} + /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/area/3_with_linear.tsx b/stories/area/3_with_linear.tsx index 88cfc9182b..b79611e401 100644 --- a/stories/area/3_with_linear.tsx +++ b/stories/area/3_with_linear.tsx @@ -14,18 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + import { AreaSeries, Axis, Chart, CurveType, Position, ScaleType } from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; import { SB_SOURCE_PANEL } from '../utils/storybook'; export const Example = () => { const start = KIBANA_METRICS.metrics.kibana_os_load[0].data[0][0]; - const data = KIBANA_METRICS.metrics.kibana_os_load[0].data.slice(0, 20).map((d) => { - return [(d[0] - start) / 30000, d[1]]; - }); + const data = KIBANA_METRICS.metrics.kibana_os_load[0].data.slice(0, 20).map((d) => [(d[0] - start) / 30000, d[1]]); return ( diff --git a/stories/area/4_with_log.tsx b/stories/area/4_with_log.tsx index 999619ac55..3c22d29924 100644 --- a/stories/area/4_with_log.tsx +++ b/stories/area/4_with_log.tsx @@ -14,9 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + import { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, timeFormatter } from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; import { SB_SOURCE_PANEL } from '../utils/storybook'; @@ -24,9 +26,7 @@ import { SB_SOURCE_PANEL } from '../utils/storybook'; const dateFormatter = timeFormatter('HH:mm'); export const Example = () => { - const data = KIBANA_METRICS.metrics.kibana_os_load[0].data.map((d) => { - return d[1] < 7 ? [d[0], null] : [d[0], d[1] - 10]; - }); + const data = KIBANA_METRICS.metrics.kibana_os_load[0].data.map((d) => d[1] < 7 ? [d[0], null] : [d[0], d[1] - 10]); return ( diff --git a/stories/area/5_with_4_axes.tsx b/stories/area/5_with_4_axes.tsx index b336738644..8137af1c9b 100644 --- a/stories/area/5_with_4_axes.tsx +++ b/stories/area/5_with_4_axes.tsx @@ -14,51 +14,51 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + import { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; import { SB_SOURCE_PANEL } from '../utils/storybook'; const dateFormatter = timeFormatter('HH:mm'); -export const Example = () => { - return ( - - - - `${Number(d).toFixed(0)}%`} - /> - - `${Number(d).toFixed(0)} %`} - /> +export const Example = () => ( + + + + `${Number(d).toFixed(0)}%`} + /> + + `${Number(d).toFixed(0)} %`} + /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/area/6_with_axis_and_legend.tsx b/stories/area/6_with_axis_and_legend.tsx index 675893ba16..541519c8a5 100644 --- a/stories/area/6_with_axis_and_legend.tsx +++ b/stories/area/6_with_axis_and_legend.tsx @@ -14,44 +14,44 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + import { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; import { SB_SOURCE_PANEL } from '../utils/storybook'; const dateFormatter = timeFormatter('HH:mm'); -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} - /> +export const Example = () => ( + + + + Number(d).toFixed(2)} + /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/area/7_stacked.tsx b/stories/area/7_stacked.tsx index 886dbdcc07..df00917db2 100644 --- a/stories/area/7_stacked.tsx +++ b/stories/area/7_stacked.tsx @@ -14,9 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + import { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; import { SB_SOURCE_PANEL } from '../utils/storybook'; @@ -24,15 +26,15 @@ import { SB_SOURCE_PANEL } from '../utils/storybook'; const dateFormatter = timeFormatter('HH:mm'); export const Example = () => { - const data1 = KIBANA_METRICS.metrics.kibana_os_load[0].data.map((d) => { - return [...d, KIBANA_METRICS.metrics.kibana_os_load[0].metric.label]; - }); - const data2 = KIBANA_METRICS.metrics.kibana_os_load[1].data.map((d) => { - return [...d, KIBANA_METRICS.metrics.kibana_os_load[1].metric.label]; - }); - const data3 = KIBANA_METRICS.metrics.kibana_os_load[2].data.map((d) => { - return [...d, KIBANA_METRICS.metrics.kibana_os_load[2].metric.label]; - }); + const data1 = KIBANA_METRICS.metrics.kibana_os_load[0].data.map((d) => [ + ...d, KIBANA_METRICS.metrics.kibana_os_load[0].metric.label, + ]); + const data2 = KIBANA_METRICS.metrics.kibana_os_load[1].data.map((d) => [ + ...d, KIBANA_METRICS.metrics.kibana_os_load[1].metric.label, + ]); + const data3 = KIBANA_METRICS.metrics.kibana_os_load[2].data.map((d) => [ + ...d, KIBANA_METRICS.metrics.kibana_os_load[2].metric.label, + ]); const allMetrics = [...data3, ...data2, ...data1]; return ( @@ -41,7 +43,7 @@ export const Example = () => { id="bottom" position={Position.Bottom} title="timestamp per 1 minute" - showOverlappingTicks={true} + showOverlappingTicks tickFormat={dateFormatter} /> { @@ -25,7 +27,7 @@ export const Example = () => { return ( - + { - return ( - - - - `${Number(d * 100).toFixed(0)} %`} - /> +export const Example = () => ( + + + + `${Number(d * 100).toFixed(0)} %`} + /> - - - - - ); -}; + + + + +); const DATA = [ { diff --git a/stories/area/9_stacked_separate_specs.tsx b/stories/area/9_stacked_separate_specs.tsx index a117d64cac..9ad0a784ec 100644 --- a/stories/area/9_stacked_separate_specs.tsx +++ b/stories/area/9_stacked_separate_specs.tsx @@ -14,65 +14,65 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + import { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; import { SB_SOURCE_PANEL } from '../utils/storybook'; const dateFormatter = timeFormatter('HH:mm'); -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} - /> - - - - - ); -}; +export const Example = () => ( + + + + Number(d).toFixed(2)} + /> + + + + +); // storybook configuration Example.story = { diff --git a/stories/area/area.stories.tsx b/stories/area/area.stories.tsx index 7bfd7a37dd..a918c21d20 100644 --- a/stories/area/area.stories.tsx +++ b/stories/area/area.stories.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { SB_KNOBS_PANEL } from '../utils/storybook'; diff --git a/stories/axes/10_one_domain_bound.tsx b/stories/axes/10_one_domain_bound.tsx index af08befe7b..d3acef7e1b 100644 --- a/stories/axes/10_one_domain_bound.tsx +++ b/stories/axes/10_one_domain_bound.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { number } from '@storybook/addon-knobs'; import React from 'react'; @@ -33,7 +34,7 @@ export const Example = () => { return ( - + { const now = DateTime.fromISO('2019-01-11T00:00:00.000') diff --git a/stories/axes/1_basic.tsx b/stories/axes/1_basic.tsx index 1b8dd228f7..42ead10316 100644 --- a/stories/axes/1_basic.tsx +++ b/stories/axes/1_basic.tsx @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean, number } from '@storybook/addon-knobs'; import React from 'react'; + import { AreaSeries, Axis, Chart, Position, ScaleType, Settings, niceTimeFormatter } from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; diff --git a/stories/axes/2_tick_label_rotation.tsx b/stories/axes/2_tick_label_rotation.tsx index cdc1fc1012..642f866e60 100644 --- a/stories/axes/2_tick_label_rotation.tsx +++ b/stories/axes/2_tick_label_rotation.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean, number } from '@storybook/addon-knobs'; import React from 'react'; @@ -32,7 +33,7 @@ export const Example = () => { id="bottom" position={Position.Bottom} title="Bottom axis" - showOverlappingTicks={true} + showOverlappingTicks tickLabelRotation={number('bottom axis tick label rotation', 0, { range: true, min: -90, diff --git a/stories/axes/3_axis_4_axes.tsx b/stories/axes/3_axis_4_axes.tsx index f6aee9acf7..ff922de378 100644 --- a/stories/axes/3_axis_4_axes.tsx +++ b/stories/axes/3_axis_4_axes.tsx @@ -14,58 +14,51 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean } from '@storybook/addon-knobs'; import React from 'react'; import { AreaSeries, Axis, Chart, Position, ScaleType } from '../../src'; -export const Example = () => { - return ( - - - Number(d).toFixed(2)} - hide={boolean('hide left axis', false)} - /> - - Number(d).toFixed(2)} - hide={boolean('hide right axis', false)} - /> +export const Example = () => ( + + + Number(d).toFixed(2)} + hide={boolean('hide left axis', false)} + /> + + Number(d).toFixed(2)} + hide={boolean('hide right axis', false)} + /> - - - ); -}; + + +); diff --git a/stories/axes/4_multi_axis.tsx b/stories/axes/4_multi_axis.tsx index ca00bd8f2b..c214f6a490 100644 --- a/stories/axes/4_multi_axis.tsx +++ b/stories/axes/4_multi_axis.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean, number } from '@storybook/addon-knobs'; import React from 'react'; diff --git a/stories/axes/5_multi_axis_bar_lines.tsx b/stories/axes/5_multi_axis_bar_lines.tsx index 13ce6877f4..eb55668644 100644 --- a/stories/axes/5_multi_axis_bar_lines.tsx +++ b/stories/axes/5_multi_axis_bar_lines.tsx @@ -14,57 +14,56 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; import { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '../../src'; import { SB_SOURCE_PANEL } from '../utils/storybook'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> - Number(d).toFixed(2)} - /> - - - - ); -}; +export const Example = () => ( + + + + Number(d).toFixed(2)} /> + Number(d).toFixed(2)} + /> + + + +); // storybook configuration Example.story = { diff --git a/stories/axes/6_different_tooltip.tsx b/stories/axes/6_different_tooltip.tsx index a221d80f2a..51b3bdeb62 100644 --- a/stories/axes/6_different_tooltip.tsx +++ b/stories/axes/6_different_tooltip.tsx @@ -14,65 +14,64 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; import { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '../../src'; import { SB_SOURCE_PANEL } from '../utils/storybook'; -export const Example = () => { - return ( - - - - `${Number(d).toFixed(2)} %`} - /> - `${Number(d).toFixed(2)}/s`} - /> - - - - ); -}; +export const Example = () => ( + + + + `${Number(d).toFixed(2)} %`} + /> + `${Number(d).toFixed(2)}/s`} + /> + + + +); // storybook configuration Example.story = { diff --git a/stories/axes/7_many_tick_labels.tsx b/stories/axes/7_many_tick_labels.tsx index 26061c2fc2..c746413684 100644 --- a/stories/axes/7_many_tick_labels.tsx +++ b/stories/axes/7_many_tick_labels.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { number } from '@storybook/addon-knobs'; import React from 'react'; @@ -32,14 +33,8 @@ export const Example = () => { return ( - - + + { return ( - + { return ( - + { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/bar/11_stacked_with_axis_and_legend.tsx b/stories/bar/11_stacked_with_axis_and_legend.tsx index 382149cc00..f6b1d126a7 100644 --- a/stories/bar/11_stacked_with_axis_and_legend.tsx +++ b/stories/bar/11_stacked_with_axis_and_legend.tsx @@ -14,42 +14,41 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; import { SB_SOURCE_PANEL } from '../utils/storybook'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/bar/12_stacked_as_percentage.tsx b/stories/bar/12_stacked_as_percentage.tsx index 54769d8f24..ff95d6031f 100644 --- a/stories/bar/12_stacked_as_percentage.tsx +++ b/stories/bar/12_stacked_as_percentage.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean } from '@storybook/addon-knobs'; import React from 'react'; @@ -28,7 +29,7 @@ export const Example = () => { return ( - + { theme={theme} rotation={getChartRotationKnob()} /> - + Number(d).toFixed(2)} /> { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - - - ); -}; + + + + +); // storybook configuration Example.story = { diff --git a/stories/bar/15_time_clustered.tsx b/stories/bar/15_time_clustered.tsx index 60a7a9eff3..2bc93588d2 100644 --- a/stories/bar/15_time_clustered.tsx +++ b/stories/bar/15_time_clustered.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean } from '@storybook/addon-knobs'; import React from 'react'; diff --git a/stories/bar/17_time_stacked.tsx b/stories/bar/17_time_stacked.tsx index 28661988cf..05805fce31 100644 --- a/stories/bar/17_time_stacked.tsx +++ b/stories/bar/17_time_stacked.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean } from '@storybook/addon-knobs'; import React from 'react'; diff --git a/stories/bar/18_bar_chart_1y0g.tsx b/stories/bar/18_bar_chart_1y0g.tsx index 971370916f..c0cf5eac90 100644 --- a/stories/bar/18_bar_chart_1y0g.tsx +++ b/stories/bar/18_bar_chart_1y0g.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; @@ -22,24 +23,22 @@ import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src import * as TestDatasets from '../../src/utils/data_samples/test_dataset'; import { SB_SOURCE_PANEL } from '../utils/storybook'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/bar/19_bar_chart_1y1g.tsx b/stories/bar/19_bar_chart_1y1g.tsx index d57957eae5..e9f2aab0f2 100644 --- a/stories/bar/19_bar_chart_1y1g.tsx +++ b/stories/bar/19_bar_chart_1y1g.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; @@ -22,25 +23,23 @@ import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src import * as TestDatasets from '../../src/utils/data_samples/test_dataset'; import { SB_SOURCE_PANEL } from '../utils/storybook'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/bar/1_basic.tsx b/stories/bar/1_basic.tsx index 84d5b54dea..1dec743da2 100644 --- a/stories/bar/1_basic.tsx +++ b/stories/bar/1_basic.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean } from '@storybook/addon-knobs'; import React from 'react'; diff --git a/stories/bar/20_bar_chart_1y2g.tsx b/stories/bar/20_bar_chart_1y2g.tsx index a5d96397ff..2d41806a84 100644 --- a/stories/bar/20_bar_chart_1y2g.tsx +++ b/stories/bar/20_bar_chart_1y2g.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; @@ -22,25 +23,23 @@ import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src import * as TestDatasets from '../../src/utils/data_samples/test_dataset'; import { SB_SOURCE_PANEL } from '../utils/storybook'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/bar/21_bar_chart_2y0g.tsx b/stories/bar/21_bar_chart_2y0g.tsx index b30f23d9e4..681ac641f4 100644 --- a/stories/bar/21_bar_chart_2y0g.tsx +++ b/stories/bar/21_bar_chart_2y0g.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; @@ -22,24 +23,22 @@ import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src import * as TestDatasets from '../../src/utils/data_samples/test_dataset'; import { SB_SOURCE_PANEL } from '../utils/storybook'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/bar/22_barchart_2y1g.tsx b/stories/bar/22_barchart_2y1g.tsx index 9f1287e5fa..611eede490 100644 --- a/stories/bar/22_barchart_2y1g.tsx +++ b/stories/bar/22_barchart_2y1g.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; @@ -22,25 +23,23 @@ import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src import * as TestDatasets from '../../src/utils/data_samples/test_dataset'; import { SB_SOURCE_PANEL } from '../utils/storybook'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/bar/23_bar_chart_2y2g.tsx b/stories/bar/23_bar_chart_2y2g.tsx index 9abab1e3c3..6eb8a6b7aa 100644 --- a/stories/bar/23_bar_chart_2y2g.tsx +++ b/stories/bar/23_bar_chart_2y2g.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; @@ -22,25 +23,23 @@ import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src import * as TestDatasets from '../../src/utils/data_samples/test_dataset'; import { SB_SOURCE_PANEL } from '../utils/storybook'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/bar/24_tooltip_visibility.tsx b/stories/bar/24_tooltip_visibility.tsx index 637dd9c7c0..497c1376c2 100644 --- a/stories/bar/24_tooltip_visibility.tsx +++ b/stories/bar/24_tooltip_visibility.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; @@ -23,13 +24,11 @@ import * as TestDatasets from '../../src/utils/data_samples/test_dataset'; import { SB_SOURCE_PANEL } from '../utils/storybook'; export const Example = () => { - const isVisibleFunction: FilterPredicate = (series) => { - return series.splitAccessors.get('g1') === 'cloudflare.com'; - }; + const isVisibleFunction: FilterPredicate = (series) => series.splitAccessors.get('g1') === 'cloudflare.com'; return ( - + Number(d).toFixed(2)} /> { - return ( - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/bar/29_single_data_stacked.tsx b/stories/bar/29_single_data_stacked.tsx index 37caac04c2..c24cb9d999 100644 --- a/stories/bar/29_single_data_stacked.tsx +++ b/stories/bar/29_single_data_stacked.tsx @@ -14,37 +14,36 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; import { Axis, BarSeries, Chart, Position, ScaleType } from '../../src'; import { SB_SOURCE_PANEL } from '../utils/storybook'; -export const Example = () => { - return ( - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/bar/2_label_value.tsx b/stories/bar/2_label_value.tsx index 98be6b50de..75f79c210b 100644 --- a/stories/bar/2_label_value.tsx +++ b/stories/bar/2_label_value.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean, color, number, select } from '@storybook/addon-knobs'; import React from 'react'; @@ -56,7 +57,7 @@ export const Example = () => { barSeriesStyle: { displayValue: { fontSize: number('value font size', 10), - fontFamily: `'Open Sans', Helvetica, Arial, sans-serif`, + fontFamily: '\'Open Sans\', Helvetica, Arial, sans-serif', fontStyle: 'normal', padding: 0, fill: color('value color', '#000'), @@ -85,7 +86,7 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> { - return ( - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/bar/31_negative_and_positive_x_values.tsx b/stories/bar/31_negative_and_positive_x_values.tsx index 17c5c99f81..2aa2f614b8 100644 --- a/stories/bar/31_negative_and_positive_x_values.tsx +++ b/stories/bar/31_negative_and_positive_x_values.tsx @@ -14,39 +14,38 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; import { Axis, BarSeries, Chart, Position, ScaleType } from '../../src'; import { SB_SOURCE_PANEL } from '../utils/storybook'; -export const Example = () => { - return ( - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/bar/32_scale_to_extent.tsx b/stories/bar/32_scale_to_extent.tsx index 897e00dc47..01ab3ea1f4 100644 --- a/stories/bar/32_scale_to_extent.tsx +++ b/stories/bar/32_scale_to_extent.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean, select } from '@storybook/addon-knobs'; import React from 'react'; @@ -49,8 +50,8 @@ export const Example = () => { data = allPositive; break; case 'all negative': + default: data = allNegative; - break; } return ( diff --git a/stories/bar/33_band_bar.tsx b/stories/bar/33_band_bar.tsx index 36bfd99d59..11dc58d290 100644 --- a/stories/bar/33_band_bar.tsx +++ b/stories/bar/33_band_bar.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean } from '@storybook/addon-knobs'; import React from 'react'; @@ -27,16 +28,12 @@ const dateFormatter = timeFormatter('HH:mm:ss'); export const Example = () => { const getRandomNumber = getRandomNumberGenerator(); - const data = KIBANA_METRICS.metrics.kibana_os_load[0].data.map((d: any) => { - return { - x: d[0], - max: d[1] + 4 + 4 * getRandomNumber(), - min: d[1] - 4 - 4 * getRandomNumber(), - }; - }); - const lineData = KIBANA_METRICS.metrics.kibana_os_load[0].data.map((d: any) => { - return [d[0], d[1]]; - }); + const data = KIBANA_METRICS.metrics.kibana_os_load[0].data.map((d: any) => ({ + x: d[0], + max: d[1] + 4 + 4 * getRandomNumber(), + min: d[1] - 4 - 4 * getRandomNumber(), + })); + const lineData = KIBANA_METRICS.metrics.kibana_os_load[0].data.map((d: any) => [d[0], d[1]]); const scaleToDataExtent = boolean('scale to extent', true); return ( @@ -44,7 +41,7 @@ export const Example = () => { id="bottom" title="timestamp per 1 minute" position={Position.Bottom} - showOverlappingTicks={true} + showOverlappingTicks tickFormat={dateFormatter} /> { return ( - + Number(d).toFixed(2)} /> { - return ( - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/bar/41_test_histogram_linear.tsx b/stories/bar/41_test_histogram_linear.tsx index 8a7b579d7e..6169d85374 100644 --- a/stories/bar/41_test_histogram_linear.tsx +++ b/stories/bar/41_test_histogram_linear.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean, number, select } from '@storybook/addon-knobs'; import React from 'react'; @@ -79,28 +80,27 @@ export const Example = () => { const pointAlignment = select('point series alignment', HistogramModeAlignments, HistogramModeAlignments.Center); const pointData = TestDatasets.BARCHART_1Y0G; - const otherSeries = - otherSeriesSelection === 'line' ? ( - - ) : ( - - ); + const otherSeries = otherSeriesSelection === 'line' ? ( + + ) : ( + + ); const hasHistogramBarSeries = boolean('hasHistogramBarSeries', false); return ( diff --git a/stories/bar/42_test_histogram_ordinal.tsx b/stories/bar/42_test_histogram_ordinal.tsx index 9821c18bc2..a1a1eaf67b 100644 --- a/stories/bar/42_test_histogram_ordinal.tsx +++ b/stories/bar/42_test_histogram_ordinal.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean, number } from '@storybook/addon-knobs'; import React from 'react'; diff --git a/stories/bar/43_test_discover.tsx b/stories/bar/43_test_discover.tsx index e3a09ac52e..eb3a51cbf4 100644 --- a/stories/bar/43_test_discover.tsx +++ b/stories/bar/43_test_discover.tsx @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean } from '@storybook/addon-knobs'; import React from 'react'; + import { Axis, Chart, diff --git a/stories/bar/44_test_single_histogram.tsx b/stories/bar/44_test_single_histogram.tsx index 268babe9c1..b3b437b2fa 100644 --- a/stories/bar/44_test_single_histogram.tsx +++ b/stories/bar/44_test_single_histogram.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; @@ -46,7 +47,7 @@ export const Example = () => { id="bottom" title="timestamp per 1 minute" position={Position.Bottom} - showOverlappingTicks={true} + showOverlappingTicks tickFormat={formatter} /> diff --git a/stories/bar/45_min_height.tsx b/stories/bar/45_min_height.tsx index 2595ad23c0..bfe378028e 100644 --- a/stories/bar/45_min_height.tsx +++ b/stories/bar/45_min_height.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { number } from '@storybook/addon-knobs'; import React from 'react'; diff --git a/stories/bar/46_test_min_height.tsx b/stories/bar/46_test_min_height.tsx index 2bc6ff492b..769e3f5c05 100644 --- a/stories/bar/46_test_min_height.tsx +++ b/stories/bar/46_test_min_height.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { number } from '@storybook/addon-knobs'; import React from 'react'; diff --git a/stories/bar/47_stacked_only_grouped.tsx b/stories/bar/47_stacked_only_grouped.tsx index 5a10bb5149..996d0f82e2 100644 --- a/stories/bar/47_stacked_only_grouped.tsx +++ b/stories/bar/47_stacked_only_grouped.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; @@ -94,7 +95,7 @@ export const Example = () => { title={KIBANA_METRICS.metrics.kibana_os_load[0].metric.title} position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} - hide={true} + hide domain={{ min: 0, max: 15 }} /> (
    { if (typeof knob === 'string') { // @ts-ignore return knob.split(', '); - // @ts-ignore - } else if (knob.length === 0) { - return undefined; + } + + // @ts-ignore + if (knob.length === 0) { + return; } return knob; @@ -101,7 +104,7 @@ export const Example = () => {
    - + { - return ( - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/bar/5_linear.tsx b/stories/bar/5_linear.tsx index de070bfa97..0cb1b15b56 100644 --- a/stories/bar/5_linear.tsx +++ b/stories/bar/5_linear.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { number } from '@storybook/addon-knobs'; import React from 'react'; @@ -43,7 +44,7 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> ( - + Number(d).toFixed(2)} /> { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/bar/9_with_stacked_log.tsx b/stories/bar/9_with_stacked_log.tsx index 81d3b0b4cf..de0c3368a7 100644 --- a/stories/bar/9_with_stacked_log.tsx +++ b/stories/bar/9_with_stacked_log.tsx @@ -14,50 +14,49 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; import { Axis, BarSeries, Chart, Position, ScaleType } from '../../src'; import { SB_SOURCE_PANEL } from '../utils/storybook'; -export const Example = () => { - return ( - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/bar/bars.stories.tsx b/stories/bar/bars.stories.tsx index a0d6daab00..f0400b34af 100644 --- a/stories/bar/bars.stories.tsx +++ b/stories/bar/bars.stories.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { SB_KNOBS_PANEL } from '../utils/storybook'; diff --git a/stories/bubble/1_simple.tsx b/stories/bubble/1_simple.tsx index 4e82483417..346cba9c1d 100644 --- a/stories/bubble/1_simple.tsx +++ b/stories/bubble/1_simple.tsx @@ -14,14 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import React from 'react'; +import { action } from '@storybook/addon-actions'; import { number, boolean } from '@storybook/addon-knobs'; +import React from 'react'; import { Axis, Chart, BubbleSeries, Position, ScaleType, Settings, TooltipType } from '../../src'; import { SeededDataGenerator } from '../../src/mocks/utils'; -import { action } from '@storybook/addon-actions'; const dg = new SeededDataGenerator(); const data = dg.generateRandomSeries(100); diff --git a/stories/bubble/2_ordinal.tsx b/stories/bubble/2_ordinal.tsx index 30580833f6..142b362142 100644 --- a/stories/bubble/2_ordinal.tsx +++ b/stories/bubble/2_ordinal.tsx @@ -14,23 +14,22 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import React from 'react'; +import { action } from '@storybook/addon-actions'; import { number, boolean } from '@storybook/addon-knobs'; +import React from 'react'; import { Axis, Chart, BubbleSeries, Position, ScaleType, Settings, TooltipType } from '../../src'; import { getRandomNumberGenerator } from '../../src/mocks/utils'; -import { action } from '@storybook/addon-actions'; const rng = getRandomNumberGenerator(); -const data = new Array(100).fill(0).map(() => { - return { - x: String.fromCharCode(rng(97, 122)), - y: rng(0, 100), - z: rng(0, 100), - }; -}); +const data = new Array(100).fill(0).map(() => ({ + x: String.fromCharCode(rng(97, 122)), + y: rng(0, 100), + z: rng(0, 100), +})); export const Example = () => { const onElementListeners = { diff --git a/stories/bubble/3_multiple.tsx b/stories/bubble/3_multiple.tsx index a1148bf89b..8af360406a 100644 --- a/stories/bubble/3_multiple.tsx +++ b/stories/bubble/3_multiple.tsx @@ -14,14 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import React from 'react'; +import { action } from '@storybook/addon-actions'; import { number, boolean } from '@storybook/addon-knobs'; +import React from 'react'; import { Axis, Chart, BubbleSeries, Position, ScaleType, Settings, TooltipType } from '../../src'; import { SeededDataGenerator } from '../../src/mocks/utils'; -import { action } from '@storybook/addon-actions'; const dg = new SeededDataGenerator(); diff --git a/stories/bubble/4_mixed.tsx b/stories/bubble/4_mixed.tsx index 69842c0709..a2f9298863 100644 --- a/stories/bubble/4_mixed.tsx +++ b/stories/bubble/4_mixed.tsx @@ -14,14 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import React from 'react'; +import { action } from '@storybook/addon-actions'; import { number, boolean } from '@storybook/addon-knobs'; +import React from 'react'; import { Axis, Chart, BubbleSeries, Position, ScaleType, Settings, LineSeries } from '../../src'; import { SeededDataGenerator, getRandomNumberGenerator } from '../../src/mocks/utils'; -import { action } from '@storybook/addon-actions'; const dg = new SeededDataGenerator(); const rng = getRandomNumberGenerator(); diff --git a/stories/bubble/mixed.stories.tsx b/stories/bubble/mixed.stories.tsx index 8dab4cfa32..b8ce63ceec 100644 --- a/stories/bubble/mixed.stories.tsx +++ b/stories/bubble/mixed.stories.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { SB_SOURCE_PANEL } from '../utils/storybook'; diff --git a/stories/goal/10_band_in_band.tsx b/stories/goal/10_band_in_band.tsx index ccf8ad46df..01fdfb529b 100644 --- a/stories/goal/10_band_in_band.tsx +++ b/stories/goal/10_band_in_band.tsx @@ -14,13 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Goal } from '../../src'; import { config } from '../../src/chart_types/goal_chart/layout/config/config'; -import React from 'react'; +import { BandFillColorAccessorInput, GOAL_SUBTYPES } from '../../src/chart_types/goal_chart/specs'; import { Color } from '../../src/utils/commons'; -import { BandFillColorAccessorInput, GOAL_SUBTYPES } from '../../src/chart_types/goal_chart/specs/index'; const subtype = GOAL_SUBTYPES[0]; @@ -32,7 +34,7 @@ const colorMap: { [k: number]: Color } = { const bandFillColor = (x: number): Color => colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + colorMap[x]; export const Example = () => ( - + { id="bottom" position={Position.Bottom} title="Bottom axis" - showOverlappingTicks={true} + showOverlappingTicks showGridLines={boolean('show bottom axis grid lines', false, 'bottom axis')} gridLineStyle={toggleBottomAxisGridLineStyle ? bottomAxisGridLineConfig : undefined} integersOnly={boolean('bottom axis show only integer values', false, 'bottom axis')} @@ -115,7 +117,7 @@ export const Example = () => { id="top" position={Position.Top} title="Top axis" - showOverlappingTicks={true} + showOverlappingTicks showGridLines={boolean('show top axis grid lines', false, 'top axis')} gridLineStyle={topAxisGridLineConfig} integersOnly={boolean('top axis show only integer values', false, 'top axis')} diff --git a/stories/grids/2_multiple_axes.tsx b/stories/grids/2_multiple_axes.tsx index db20a6956d..542047f405 100644 --- a/stories/grids/2_multiple_axes.tsx +++ b/stories/grids/2_multiple_axes.tsx @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean, color, number } from '@storybook/addon-knobs'; import React from 'react'; + import { Axis, BarSeries, Chart, GridLineConfig, LineSeries, Position, ScaleType, Settings } from '../../src'; function generateGridLineConfig(group: string, gridColor = 'purple'): GridLineConfig { diff --git a/stories/grids/grids.stories.tsx b/stories/grids/grids.stories.tsx index 0adfc23007..a5f87767d1 100644 --- a/stories/grids/grids.stories.tsx +++ b/stories/grids/grids.stories.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { SB_KNOBS_PANEL } from '../utils/storybook'; diff --git a/stories/interactions/10_brush_selection_bar.tsx b/stories/interactions/10_brush_selection_bar.tsx index 4bb6d5cd59..061166d2da 100644 --- a/stories/interactions/10_brush_selection_bar.tsx +++ b/stories/interactions/10_brush_selection_bar.tsx @@ -14,35 +14,34 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { action } from '@storybook/addon-actions'; import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src/'; +import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; import { getChartRotationKnob } from '../utils/knobs'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> + + Number(d).toFixed(2)} /> - - - ); -}; + + +); diff --git a/stories/interactions/11_brush_time.tsx b/stories/interactions/11_brush_time.tsx index 32aea6729c..3b12071dd4 100644 --- a/stories/interactions/11_brush_time.tsx +++ b/stories/interactions/11_brush_time.tsx @@ -14,16 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { action } from '@storybook/addon-actions'; -import React from 'react'; -import { Axis, BarSeries, Chart, LineSeries, niceTimeFormatter, Position, ScaleType, Settings } from '../../src'; - import { boolean } from '@storybook/addon-knobs'; import { DateTime } from 'luxon'; -import { getChartRotationKnob } from '../utils/knobs'; import moment from 'moment-timezone'; +import React from 'react'; + +import { Axis, BarSeries, Chart, LineSeries, niceTimeFormatter, Position, ScaleType, Settings } from '../../src'; +import { getChartRotationKnob } from '../utils/knobs'; export const Example = () => { const now = DateTime.fromISO('2019-01-11T00:00:00.000') @@ -47,7 +48,7 @@ export const Example = () => { onElementClick={action('onElementClick')} rotation={getChartRotationKnob()} /> - + Number(d).toFixed(2)} /> { @@ -43,7 +44,7 @@ export const Example = () => { onElementClick={action('onElementClick')} rotation={getChartRotationKnob()} /> - + Number(d).toFixed(2)} /> { - return ( - - - - - - - ); -}; +export const Example = () => ( + + + + + + +); diff --git a/stories/interactions/14_crosshair_time.tsx b/stories/interactions/14_crosshair_time.tsx index 5624bb6588..b02a65c3c0 100644 --- a/stories/interactions/14_crosshair_time.tsx +++ b/stories/interactions/14_crosshair_time.tsx @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ - -import { SB_KNOBS_PANEL } from '../utils/storybook'; + * under the License. + */ +import { boolean, select } from '@storybook/addon-knobs'; import React from 'react'; + +import { switchTheme } from '../../.storybook/theme_service'; import { Axis, BarSeries, @@ -32,12 +34,10 @@ import { Settings, timeFormatter, TooltipType, -} from '../../src/'; - -import { boolean, select } from '@storybook/addon-knobs'; -import { switchTheme } from '../../.storybook/theme_service'; +} from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; import { getChartRotationKnob } from '../utils/knobs'; +import { SB_KNOBS_PANEL } from '../utils/storybook'; export const Example = () => { const hideBars = boolean('hideBars', false); diff --git a/stories/interactions/15_render_change.tsx b/stories/interactions/15_render_change.tsx index 85c3b2af69..e97a9a9587 100644 --- a/stories/interactions/15_render_change.tsx +++ b/stories/interactions/15_render_change.tsx @@ -14,42 +14,42 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { action } from '@storybook/addon-actions'; import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src/'; + +import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; const onRenderChange = action('onRenderChange'); -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); Example.story = { parameters: { info: { - text: `Sends an event every time the chart render state changes. This is provided to bind attributes to the chart for visulaization loading checks.`, + text: 'Sends an event every time the chart render state changes. This is provided to bind attributes to the chart for visulaization loading checks.', }, }, }; diff --git a/stories/interactions/16_cursor_update_action.tsx b/stories/interactions/16_cursor_update_action.tsx index 903cbb0dcf..ea7c934800 100644 --- a/stories/interactions/16_cursor_update_action.tsx +++ b/stories/interactions/16_cursor_update_action.tsx @@ -14,41 +14,41 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { action } from '@storybook/addon-actions'; import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src/'; + +import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; const onPointerUpdate = action('onPointerUpdate'); -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); Example.story = { parameters: { info: { - text: `Sends an event every time the cursor changes. This is provided to sync cursors between multiple charts.`, + text: 'Sends an event every time the cursor changes. This is provided to sync cursors between multiple charts.', }, }, }; diff --git a/stories/interactions/17_png_export.tsx b/stories/interactions/17_png_export.tsx index fcad898136..7c7d587107 100644 --- a/stories/interactions/17_png_export.tsx +++ b/stories/interactions/17_png_export.tsx @@ -14,12 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ +import { button } from '@storybook/addon-knobs'; import React from 'react'; -import { Axis, BarSeries, Chart, niceTimeFormatter, Position, ScaleType, Settings } from '../../src/'; -import { button } from '@storybook/addon-knobs'; +import { Axis, BarSeries, Chart, niceTimeFormatter, Position, ScaleType, Settings } from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; import { SB_KNOBS_PANEL } from '../utils/storybook'; @@ -75,7 +76,7 @@ export const Example = () => { xAccessor={0} yAccessors={[1]} data={data} - yScaleToDataExtent={true} + yScaleToDataExtent /> ); @@ -86,7 +87,7 @@ Example.story = { parameters: { options: { selectedPanel: SB_KNOBS_PANEL }, info: { - text: `Generate a PNG of the chart by clicking on the Export PNG button in the knobs section. In this Example, the button handler is setting the PNG background to white with a pixel ratio of 2. If the browser is detected to be IE11, msSaveBlob will be used instead of a PNG capture.`, + text: 'Generate a PNG of the chart by clicking on the Export PNG button in the knobs section. In this Example, the button handler is setting the PNG background to white with a pixel ratio of 2. If the browser is detected to be IE11, msSaveBlob will be used instead of a PNG capture.', }, }, }; diff --git a/stories/interactions/1_bar_clicks.tsx b/stories/interactions/1_bar_clicks.tsx index eafc5d0d86..cb7e16d541 100644 --- a/stories/interactions/1_bar_clicks.tsx +++ b/stories/interactions/1_bar_clicks.tsx @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { action } from '@storybook/addon-actions'; import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings, TooltipValue, TooltipValueFormatter } from '../../src/'; + +import { Axis, BarSeries, Chart, Position, ScaleType, Settings, TooltipValue, TooltipValueFormatter } from '../../src'; const onElementListeners = { onElementClick: action('onElementClick'), @@ -53,7 +55,7 @@ export const Example = () => { {...onElementListeners} tooltip={tooltipProps} /> - + Number(d).toFixed(2)} /> { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); diff --git a/stories/interactions/3_line_point_clicks.tsx b/stories/interactions/3_line_point_clicks.tsx index a0afbb3d9f..7f0b8abb67 100644 --- a/stories/interactions/3_line_point_clicks.tsx +++ b/stories/interactions/3_line_point_clicks.tsx @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { action } from '@storybook/addon-actions'; import React from 'react'; -import { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '../../src/'; + +import { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '../../src'; const onElementListeners = { onElementClick: action('onElementClick'), @@ -26,26 +28,24 @@ const onElementListeners = { onElementOut: action('onElementOut'), }; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); diff --git a/stories/interactions/4_line_area_bar_clicks.tsx b/stories/interactions/4_line_area_bar_clicks.tsx index f6bf6fef8b..b43ee0758a 100644 --- a/stories/interactions/4_line_area_bar_clicks.tsx +++ b/stories/interactions/4_line_area_bar_clicks.tsx @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { action } from '@storybook/addon-actions'; import React from 'react'; -import { AreaSeries, Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '../../src/'; + +import { AreaSeries, Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '../../src'; const onElementListeners = { onElementClick: action('onElementClick'), @@ -26,52 +28,50 @@ const onElementListeners = { onElementOut: action('onElementOut'), }; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - - - ); -}; + + + + +); diff --git a/stories/interactions/4_sunburst_slice_clicks.tsx b/stories/interactions/4_sunburst_slice_clicks.tsx index 6d6a30d604..a6f0c52905 100644 --- a/stories/interactions/4_sunburst_slice_clicks.tsx +++ b/stories/interactions/4_sunburst_slice_clicks.tsx @@ -14,10 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { action } from '@storybook/addon-actions'; +import { select } from '@storybook/addon-knobs'; import React from 'react'; + import { Chart, Position, Settings, Partition, PartitionLayout } from '../../src'; import { indexInterpolatedFillColor, @@ -25,7 +28,6 @@ import { categoricalFillColor, colorBrewerCategoricalPastel12, } from '../utils/utils'; -import { select } from '@storybook/addon-knobs'; const onElementListeners = { onElementClick: action('onElementClick'), @@ -67,43 +69,31 @@ export const Example = () => { config={{ partitionLayout, }} - valueAccessor={(d) => { - return d[3]; - }} + valueAccessor={(d) => d[3]} layers={[ { - groupByRollup: (d: PieDatum) => { - return d[0]; - }, - nodeLabel: (d) => { - return `dest: ${d}`; - }, + groupByRollup: (d: PieDatum) => d[0], + nodeLabel: (d) => `dest: ${d}`, shape: { fillColor: (d) => { if (partitionLayout === 'sunburst') { // pick color from color palette based on mean angle - rather distinct colors in the inner ring return indexInterpolatedFillColor(interpolatorCET2s)(d, (d.x0 + d.x1) / 2 / (2 * Math.PI), []); - } else { - return categoricalFillColor(colorBrewerCategoricalPastel12)(d.sortIndex); } + return categoricalFillColor(colorBrewerCategoricalPastel12)(d.sortIndex); }, }, }, { - groupByRollup: (d: PieDatum) => { - return d[2]; - }, - nodeLabel: (d) => { - return `source: ${d}`; - }, + groupByRollup: (d: PieDatum) => d[2], + nodeLabel: (d) => `source: ${d}`, shape: { fillColor: (d) => { if (partitionLayout === 'sunburst') { // pick color from color palette based on mean angle - rather distinct colors in the inner ring return indexInterpolatedFillColor(interpolatorCET2s)(d, (d.x0 + d.x1) / 2 / (2 * Math.PI), []); - } else { - return categoricalFillColor(colorBrewerCategoricalPastel12)(d.sortIndex); } + return categoricalFillColor(colorBrewerCategoricalPastel12)(d.sortIndex); }, }, }, diff --git a/stories/interactions/5_clicks_legend_items_bar.tsx b/stories/interactions/5_clicks_legend_items_bar.tsx index 2c104b6c90..f3396bbc3f 100644 --- a/stories/interactions/5_clicks_legend_items_bar.tsx +++ b/stories/interactions/5_clicks_legend_items_bar.tsx @@ -14,13 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { action } from '@storybook/addon-actions'; +import { array, boolean, number, select } from '@storybook/addon-knobs'; import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src/'; -import { array, boolean, number, select } from '@storybook/addon-knobs'; +import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; import { BARCHART_2Y2G } from '../../src/utils/data_samples/test_dataset'; const onLegendItemListeners = { @@ -77,7 +78,7 @@ export const Example = () => { {...onLegendItemListeners} xDomain={xDomain} /> - + { - return ( - - - - Number(d).toFixed(2)} /> +import { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '../../src'; - - - ); -}; +export const Example = () => ( + + + + Number(d).toFixed(2)} /> + + + +); diff --git a/stories/interactions/7_clicks_legend_items_line.tsx b/stories/interactions/7_clicks_legend_items_line.tsx index e3c4c7239f..a67750341c 100644 --- a/stories/interactions/7_clicks_legend_items_line.tsx +++ b/stories/interactions/7_clicks_legend_items_line.tsx @@ -14,110 +14,110 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { action } from '@storybook/addon-actions'; import React from 'react'; -import { Axis, Chart, CurveType, LineSeries, Position, ScaleType, Settings } from '../../src/'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +import { Axis, Chart, CurveType, LineSeries, Position, ScaleType, Settings } from '../../src'; - - - - - - - - ); -}; +export const Example = () => ( + + + + Number(d).toFixed(2)} /> + + + + + + + + +); diff --git a/stories/interactions/8_clicks_legend_items_mixed.tsx b/stories/interactions/8_clicks_legend_items_mixed.tsx index f3104d1648..d2850f6495 100644 --- a/stories/interactions/8_clicks_legend_items_mixed.tsx +++ b/stories/interactions/8_clicks_legend_items_mixed.tsx @@ -14,53 +14,53 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { action } from '@storybook/addon-actions'; import React from 'react'; -import { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '../../src/'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +import { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '../../src'; - - - - ); -}; +export const Example = () => ( + + + + Number(d).toFixed(2)} /> + + + + +); diff --git a/stories/interactions/9_brush_selection_linear.tsx b/stories/interactions/9_brush_selection_linear.tsx index 6003b7d54a..96dd49aa19 100644 --- a/stories/interactions/9_brush_selection_linear.tsx +++ b/stories/interactions/9_brush_selection_linear.tsx @@ -14,36 +14,35 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { action } from '@storybook/addon-actions'; import React from 'react'; -import { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '../../src/'; +import { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '../../src'; import { getChartRotationKnob } from '../utils/knobs'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> + + Number(d).toFixed(2)} /> - - - ); -}; + + +); diff --git a/stories/interactions/9a_brush_selection_linear.tsx b/stories/interactions/9a_brush_selection_linear.tsx index ef7a3061da..58e6f7775e 100644 --- a/stories/interactions/9a_brush_selection_linear.tsx +++ b/stories/interactions/9a_brush_selection_linear.tsx @@ -14,14 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { action } from '@storybook/addon-actions'; +import { select } from '@storybook/addon-knobs'; import React from 'react'; -import { AreaSeries, Axis, Chart, Position, ScaleType, Settings, BrushAxis } from '../../src'; +import { AreaSeries, Axis, Chart, Position, ScaleType, Settings, BrushAxis } from '../../src'; import { getChartRotationKnob } from '../utils/knobs'; -import { select } from '@storybook/addon-knobs'; export const Example = () => { const brushAxisSelect = select( @@ -36,9 +37,9 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> - + Number(d).toFixed(2)} /> { const flatLegend = boolean('flatLegend', true); @@ -39,39 +41,33 @@ export const Example = () => { }); return ( - + d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, nodeLabel: (d: any) => productLookup[d].name, shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.7)(d.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.7)(d.sortIndex), }, }, { - groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.substr(0, 2), + groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2), nodeLabel: (d: any) => regionLookup[d].regionName, shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.5)(d.parent.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.5)(d.parent.sortIndex), }, }, { groupByRollup: (d: Datum) => d.dest, nodeLabel: (d: any) => countryLookup[d].name, shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.3)(d.parent.parent.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.3)(d.parent.parent.sortIndex), }, }, ]} @@ -83,7 +79,7 @@ export const Example = () => { }, fontFamily: 'Arial', fillLabel: { - valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, fontStyle: 'italic', textInvertible: true, fontWeight: 900, diff --git a/stories/legend/1_legend_right.tsx b/stories/legend/1_legend_right.tsx index a96830db2e..829b17d2a7 100644 --- a/stories/legend/1_legend_right.tsx +++ b/stories/legend/1_legend_right.tsx @@ -14,10 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src/'; + +import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; import * as TestDatasets from '../../src/utils/data_samples/test_dataset'; import { SB_SOURCE_PANEL } from '../utils/storybook'; @@ -28,7 +30,7 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/legend/3_legend_left.tsx b/stories/legend/3_legend_left.tsx index c91a4114b9..0e50a979ca 100644 --- a/stories/legend/3_legend_left.tsx +++ b/stories/legend/3_legend_left.tsx @@ -14,32 +14,32 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src/'; + +import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; import * as TestDatasets from '../../src/utils/data_samples/test_dataset'; import { SB_SOURCE_PANEL } from '../utils/storybook'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/legend/4_legend_top.tsx b/stories/legend/4_legend_top.tsx index efcebcd241..fecfef6335 100644 --- a/stories/legend/4_legend_top.tsx +++ b/stories/legend/4_legend_top.tsx @@ -14,32 +14,32 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src/'; + +import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; import * as TestDatasets from '../../src/utils/data_samples/test_dataset'; import { SB_SOURCE_PANEL } from '../utils/storybook'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/legend/5_changing_specs.tsx b/stories/legend/5_changing_specs.tsx index 27c467d4ea..370a5edd81 100644 --- a/stories/legend/5_changing_specs.tsx +++ b/stories/legend/5_changing_specs.tsx @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean } from '@storybook/addon-knobs'; import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src/'; + +import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; import * as TestDatasets from '../../src/utils/data_samples/test_dataset'; export const Example = () => { @@ -26,7 +28,7 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> { const hideBarSeriesInLegend = boolean('hide bar series in legend', false); @@ -27,7 +29,7 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> { const namesArray = arrayKnobs('series names (in sort order)', ['jpg', 'php', 'png', 'css', 'gif']); const seriesComponents = tsvbSeries.map((series: any) => { - const nameIndex = namesArray.findIndex((name) => { - return name === series.label; - }); + const nameIndex = namesArray.findIndex((name) => name === series.label); const sortIndex = nameIndex > -1 ? nameIndex : undefined; return ( @@ -62,8 +62,8 @@ export const Example = () => { }); return ( - - + + Number(d).toFixed(2)} /> {seriesComponents} diff --git a/stories/legend/8_spacing_buffer.tsx b/stories/legend/8_spacing_buffer.tsx index 612df246e4..e56f3ea641 100644 --- a/stories/legend/8_spacing_buffer.tsx +++ b/stories/legend/8_spacing_buffer.tsx @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { number } from '@storybook/addon-knobs'; import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '../../src/'; + +import { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '../../src'; export const Example = () => { const theme: PartialTheme = { @@ -30,7 +32,7 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> { }; return ( - + Done @@ -59,7 +59,7 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> { diff --git a/stories/line/2_w_axis.tsx b/stories/line/2_w_axis.tsx index dd4cabf9d0..3b09ddfed7 100644 --- a/stories/line/2_w_axis.tsx +++ b/stories/line/2_w_axis.tsx @@ -14,36 +14,36 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { Axis, Chart, LineSeries, niceTimeFormatByDay, Position, ScaleType, timeFormatter } from '../../src/'; + +import { Axis, Chart, LineSeries, niceTimeFormatByDay, Position, ScaleType, timeFormatter } from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; import { SB_SOURCE_PANEL } from '../utils/storybook'; const dateFormatter = timeFormatter(niceTimeFormatByDay(1)); -export const Example = () => { - return ( - - - `${Number(d).toFixed(2)}%`} - /> - - - ); -}; +export const Example = () => ( + + + `${Number(d).toFixed(2)}%`} + /> + + +); // storybook configuration Example.story = { diff --git a/stories/line/3_ordinal.tsx b/stories/line/3_ordinal.tsx index 145bf56b0a..467bd3dd25 100644 --- a/stories/line/3_ordinal.tsx +++ b/stories/line/3_ordinal.tsx @@ -14,38 +14,38 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { Axis, Chart, LineSeries, niceTimeFormatByDay, Position, ScaleType, Settings, timeFormatter } from '../../src/'; + +import { Axis, Chart, LineSeries, niceTimeFormatByDay, Position, ScaleType, Settings, timeFormatter } from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; import { getChartRotationKnob } from '../utils/knobs'; import { SB_KNOBS_PANEL } from '../utils/storybook'; const dateFormatter = timeFormatter(niceTimeFormatByDay(1)); -export const Example = () => { - return ( - - - - `${Number(d).toFixed(2)}%`} - /> - - - ); -}; +export const Example = () => ( + + + + `${Number(d).toFixed(2)}%`} + /> + + +); // storybook configuration Example.story = { diff --git a/stories/line/4_linear.tsx b/stories/line/4_linear.tsx index 707aa85e9c..e8a17e7902 100644 --- a/stories/line/4_linear.tsx +++ b/stories/line/4_linear.tsx @@ -14,32 +14,32 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { Axis, Chart, LineSeries, niceTimeFormatByDay, Position, ScaleType, timeFormatter } from '../../src/'; + +import { Axis, Chart, LineSeries, niceTimeFormatByDay, Position, ScaleType, timeFormatter } from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; const dateFormatter = timeFormatter(niceTimeFormatByDay(1)); -export const Example = () => { - return ( - - - `${Number(d).toFixed(2)}%`} - /> - - - ); -}; +export const Example = () => ( + + + `${Number(d).toFixed(2)}%`} + /> + + +); diff --git a/stories/line/5_w_axis_and_legend.tsx b/stories/line/5_w_axis_and_legend.tsx index 83e363a22d..de67ed29cd 100644 --- a/stories/line/5_w_axis_and_legend.tsx +++ b/stories/line/5_w_axis_and_legend.tsx @@ -14,33 +14,33 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { Axis, Chart, LineSeries, niceTimeFormatByDay, Position, ScaleType, Settings, timeFormatter } from '../../src/'; + +import { Axis, Chart, LineSeries, niceTimeFormatByDay, Position, ScaleType, Settings, timeFormatter } from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; const dateFormatter = timeFormatter(niceTimeFormatByDay(1)); -export const Example = () => { - return ( - - - - `${Number(d).toFixed(0)}%`} - /> - - - ); -}; +export const Example = () => ( + + + + `${Number(d).toFixed(0)}%`} + /> + + +); diff --git a/stories/line/6_curved.tsx b/stories/line/6_curved.tsx index 2321a5ed22..f77dd5b2da 100644 --- a/stories/line/6_curved.tsx +++ b/stories/line/6_curved.tsx @@ -14,9 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + import { Axis, Chart, @@ -27,77 +29,75 @@ import { ScaleType, Settings, timeFormatter, -} from '../../src/'; +} from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; const dateFormatter = timeFormatter(niceTimeFormatByDay(1)); -export const Example = () => { - return ( - - - - `${Number(d).toFixed(0)}%`} - /> +export const Example = () => ( + + + + `${Number(d).toFixed(0)}%`} + /> - - - - - - - - ); -}; + + + + + + + +); diff --git a/stories/line/7_multiple.tsx b/stories/line/7_multiple.tsx index 03ed7a6d16..db7b60c7db 100644 --- a/stories/line/7_multiple.tsx +++ b/stories/line/7_multiple.tsx @@ -14,9 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + import { Axis, Chart, @@ -27,50 +29,48 @@ import { ScaleType, Settings, timeFormatter, -} from '../../src/'; +} from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; const dateFormatter = timeFormatter(niceTimeFormatByDay(1)); -export const Example = () => { - return ( - - - - `${Number(d).toFixed(0)}%`} - /> +export const Example = () => ( + + + + `${Number(d).toFixed(0)}%`} + /> - - - - - ); -}; + + + + +); diff --git a/stories/line/8_stacked.tsx b/stories/line/8_stacked.tsx index a7d005ace0..a5a4bd24c5 100644 --- a/stories/line/8_stacked.tsx +++ b/stories/line/8_stacked.tsx @@ -14,9 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + import { Axis, Chart, @@ -27,52 +29,50 @@ import { ScaleType, Settings, timeFormatter, -} from '../../src/'; +} from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; const dateFormatter = timeFormatter(niceTimeFormatByDay(1)); -export const Example = () => { - return ( - - - - `${Number(d).toFixed(0)}%`} - /> - - - - - ); -}; +export const Example = () => ( + + + + `${Number(d).toFixed(0)}%`} + /> + + + + +); diff --git a/stories/line/9_multi_series.tsx b/stories/line/9_multi_series.tsx index 2dc2b89100..a7e487f5eb 100644 --- a/stories/line/9_multi_series.tsx +++ b/stories/line/9_multi_series.tsx @@ -14,9 +14,11 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + import { Axis, Chart, @@ -27,37 +29,33 @@ import { ScaleType, Settings, timeFormatter, -} from '../../src/'; +} from '../../src'; import { KIBANA_METRICS } from '../../src/utils/data_samples/test_dataset_kibana'; import { TSVB_DATASET } from '../../src/utils/data_samples/test_dataset_tsvb'; const dateFormatter = timeFormatter(niceTimeFormatByDay(1)); -export const Example = () => { - return ( - - - - `${Number(d).toFixed(0)}%`} +export const Example = () => ( + + + + `${Number(d).toFixed(0)}%`} + /> + {TSVB_DATASET.series.map((series) => ( + - {TSVB_DATASET.series.map((series) => { - return ( - - ); - })} - - ); -}; + ))} + +); diff --git a/stories/line/line.stories.tsx b/stories/line/line.stories.tsx index bc50e24f35..3a517f077b 100644 --- a/stories/line/line.stories.tsx +++ b/stories/line/line.stories.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { SB_SOURCE_PANEL } from '../utils/storybook'; diff --git a/stories/mixed/1_bars_and_lines.tsx b/stories/mixed/1_bars_and_lines.tsx index c3369289b7..246384ab6a 100644 --- a/stories/mixed/1_bars_and_lines.tsx +++ b/stories/mixed/1_bars_and_lines.tsx @@ -14,45 +14,44 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '../../src/'; +import { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '../../src'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - - ); -}; + + + +); diff --git a/stories/mixed/2_lines_and_areas.tsx b/stories/mixed/2_lines_and_areas.tsx index 7259ef714a..5ce773c6ad 100644 --- a/stories/mixed/2_lines_and_areas.tsx +++ b/stories/mixed/2_lines_and_areas.tsx @@ -14,46 +14,45 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { AreaSeries, Axis, Chart, LineSeries, Position, ScaleType, Settings } from '../../src/'; +import { AreaSeries, Axis, Chart, LineSeries, Position, ScaleType, Settings } from '../../src'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - - ); -}; + + + +); diff --git a/stories/mixed/3_areas_and_bars.tsx b/stories/mixed/3_areas_and_bars.tsx index 09bdf69784..ccf2c79df4 100644 --- a/stories/mixed/3_areas_and_bars.tsx +++ b/stories/mixed/3_areas_and_bars.tsx @@ -14,50 +14,49 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { AreaSeries, Axis, BarSeries, Chart, CurveType, Position, ScaleType, Settings } from '../../src/'; +import { AreaSeries, Axis, BarSeries, Chart, CurveType, Position, ScaleType, Settings } from '../../src'; -export const Example = () => { - return ( - - - - Number(d).toFixed(2)} /> - - Number(d).toFixed(2)} /> - - - - ); -}; +export const Example = () => ( + + + + Number(d).toFixed(2)} /> + + Number(d).toFixed(2)} /> + + + +); diff --git a/stories/mixed/4_test_bar.tsx b/stories/mixed/4_test_bar.tsx index c1fd6b051b..37de6ed9c2 100644 --- a/stories/mixed/4_test_bar.tsx +++ b/stories/mixed/4_test_bar.tsx @@ -14,11 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '../../src/'; +import { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '../../src'; export const Example = () => { const data1 = [ @@ -47,7 +48,7 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> { @@ -55,7 +56,7 @@ export const Example = () => { id="bottom" position={Position.Bottom} title="Bottom axis" - showOverlappingTicks={true} + showOverlappingTicks tickFormat={dateFormatter} /> Number(d).toFixed(2)} /> diff --git a/stories/mixed/6_fitting.tsx b/stories/mixed/6_fitting.tsx index 6e642f420b..72f2bd6eb7 100644 --- a/stories/mixed/6_fitting.tsx +++ b/stories/mixed/6_fitting.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { select, number } from '@storybook/addon-knobs'; import React from 'react'; @@ -30,8 +31,7 @@ import { Settings, Fit, SeriesTypes, -} from '../../src/'; - +} from '../../src'; import { SB_KNOBS_PANEL } from '../utils/storybook'; export const Example = () => { @@ -156,8 +156,8 @@ export const Example = () => { { None: 'none', nearest: 'nearest', - '0': 0, - '2': 2, + 0: 0, + 2: 2, }, 'none', ); @@ -176,7 +176,7 @@ export const Example = () => { }, }} /> - + {seriesType === SeriesTypes.Area ? ( ({ diff --git a/stories/mixed/mixed.stories.tsx b/stories/mixed/mixed.stories.tsx index b33d3ebc7c..fe39ce4db1 100644 --- a/stories/mixed/mixed.stories.tsx +++ b/stories/mixed/mixed.stories.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { SB_SOURCE_PANEL } from '../utils/storybook'; diff --git a/stories/rotations/1_ordinal.tsx b/stories/rotations/1_ordinal.tsx index a64d37faa0..67e6f8b218 100644 --- a/stories/rotations/1_ordinal.tsx +++ b/stories/rotations/1_ordinal.tsx @@ -14,73 +14,72 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ - -import { SB_SOURCE_PANEL } from '../utils/storybook'; + * under the License. + */ import { boolean, select } from '@storybook/addon-knobs'; import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src/'; -export const Example = () => { - return ( - - - - +import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; +import { SB_SOURCE_PANEL } from '../utils/storybook'; - - - ); -}; +export const Example = () => ( + + + + + + + +); // storybook configuration Example.story = { diff --git a/stories/rotations/2_negative_ordinal.tsx b/stories/rotations/2_negative_ordinal.tsx index 50e0db9b4b..bc1f6b571d 100644 --- a/stories/rotations/2_negative_ordinal.tsx +++ b/stories/rotations/2_negative_ordinal.tsx @@ -14,32 +14,32 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src/'; -export const Example = () => { - return ( - - - - - - - - - ); -}; +import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; + +export const Example = () => ( + + + + + + + + +); diff --git a/stories/rotations/3_rotations_ordinal.tsx b/stories/rotations/3_rotations_ordinal.tsx index 586f640b61..4bb93457f4 100644 --- a/stories/rotations/3_rotations_ordinal.tsx +++ b/stories/rotations/3_rotations_ordinal.tsx @@ -14,32 +14,32 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src/'; -export const Example = () => { - return ( - - - - - - - - - ); -}; +import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; + +export const Example = () => ( + + + + + + + + +); diff --git a/stories/rotations/4_90_ordinal.tsx b/stories/rotations/4_90_ordinal.tsx index 5d5452a7c5..6634990b7b 100644 --- a/stories/rotations/4_90_ordinal.tsx +++ b/stories/rotations/4_90_ordinal.tsx @@ -14,32 +14,32 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; -export const Example = () => { - return ( - - - - - - - - - ); -}; +export const Example = () => ( + + + + + + + + +); diff --git a/stories/rotations/5_180_ordinal.tsx b/stories/rotations/5_180_ordinal.tsx index 325c694e81..5d568c355d 100644 --- a/stories/rotations/5_180_ordinal.tsx +++ b/stories/rotations/5_180_ordinal.tsx @@ -14,32 +14,32 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; + import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; -export const Example = () => { - return ( - - - - - - - - - ); -}; +export const Example = () => ( + + + + + + + + +); diff --git a/stories/rotations/6_negative_linear.tsx b/stories/rotations/6_negative_linear.tsx index b4ba22b62e..630249b08f 100644 --- a/stories/rotations/6_negative_linear.tsx +++ b/stories/rotations/6_negative_linear.tsx @@ -14,32 +14,32 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src/'; -export const Example = () => { - return ( - - - - - - - - - ); -}; +import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; + +export const Example = () => ( + + + + + + + + +); diff --git a/stories/rotations/7_rotations_linear.tsx b/stories/rotations/7_rotations_linear.tsx index 0456af1bf2..1ab255cd68 100644 --- a/stories/rotations/7_rotations_linear.tsx +++ b/stories/rotations/7_rotations_linear.tsx @@ -14,32 +14,32 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src/'; -export const Example = () => { - return ( - - - - - - - - - ); -}; +import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; + +export const Example = () => ( + + + + + + + + +); diff --git a/stories/rotations/8_90_deg_linear.tsx b/stories/rotations/8_90_deg_linear.tsx index ecd3ce9de8..a71da8eb39 100644 --- a/stories/rotations/8_90_deg_linear.tsx +++ b/stories/rotations/8_90_deg_linear.tsx @@ -14,32 +14,32 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src/'; -export const Example = () => { - return ( - - - - - - - - - ); -}; +import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; + +export const Example = () => ( + + + + + + + + +); diff --git a/stories/rotations/9_180_deg_linear.tsx b/stories/rotations/9_180_deg_linear.tsx index f2e6a10d82..389f2084b6 100644 --- a/stories/rotations/9_180_deg_linear.tsx +++ b/stories/rotations/9_180_deg_linear.tsx @@ -14,32 +14,32 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import React from 'react'; -import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src/'; -export const Example = () => { - return ( - - - - - - - - - ); -}; +import { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '../../src'; + +export const Example = () => ( + + + + + + + + +); diff --git a/stories/rotations/rotations.stories.tsx b/stories/rotations/rotations.stories.tsx index 0d5dd5a992..4b8174e933 100644 --- a/stories/rotations/rotations.stories.tsx +++ b/stories/rotations/rotations.stories.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { SB_SOURCE_PANEL } from '../utils/storybook'; diff --git a/stories/scales/1_different_timezones.tsx b/stories/scales/1_different_timezones.tsx index 9ccc3face8..8a97739bdf 100644 --- a/stories/scales/1_different_timezones.tsx +++ b/stories/scales/1_different_timezones.tsx @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { select } from '@storybook/addon-knobs'; import { DateTime } from 'luxon'; import React from 'react'; + import { Axis, Chart, LineSeries, Position, ScaleType } from '../../src'; const today = new Date().getTime(); @@ -30,18 +32,18 @@ const UTC_MINUS8_DATE = DateTime.fromISO('2019-01-01T00:00:00.000-08:00', { setZone: true, }).toMillis(); const DAY_INCREMENT_1 = 1000 * 60 * 60 * 24; -const UTC_DATASET = new Array(10).fill(0).map((d, i) => { - return [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]; -}); -const CURRENT_TIMEZONE_DATASET = new Array(10).fill(0).map((d, i) => { - return [today + DAY_INCREMENT_1 * i, i % 5]; -}); -const OTHER_PLUS8_TIMEZONE_DATASET = new Array(10).fill(0).map((d, i) => { - return [UTC_PLUS8_DATE + DAY_INCREMENT_1 * i, i % 5]; -}); -const OTHER_MINUS8_TIMEZONE_DATASET = new Array(10).fill(0).map((d, i) => { - return [UTC_MINUS8_DATE + DAY_INCREMENT_1 * i, i % 5]; -}); +const UTC_DATASET = new Array(10).fill(0).map((d, i) => [ + UTC_DATE + DAY_INCREMENT_1 * i, i % 5, +]); +const CURRENT_TIMEZONE_DATASET = new Array(10).fill(0).map((d, i) => [ + today + DAY_INCREMENT_1 * i, i % 5, +]); +const OTHER_PLUS8_TIMEZONE_DATASET = new Array(10).fill(0).map((d, i) => [ + UTC_PLUS8_DATE + DAY_INCREMENT_1 * i, i % 5, +]); +const OTHER_MINUS8_TIMEZONE_DATASET = new Array(10).fill(0).map((d, i) => [ + UTC_MINUS8_DATE + DAY_INCREMENT_1 * i, i % 5, +]); export const Example = () => { const timezones = { @@ -72,27 +74,19 @@ export const Example = () => { let tooltipFn: (d: number) => string; switch (tooltipSelected) { case 'local': - tooltipFn = (d: number) => { - return DateTime.fromMillis(d).toFormat('yyyy-MM-dd HH:mm:ss'); - }; + tooltipFn = (d: number) => DateTime.fromMillis(d).toFormat('yyyy-MM-dd HH:mm:ss'); break; case 'utc+8': - tooltipFn = (d: number) => { - return DateTime.fromMillis(d, { zone: 'utc+8' }).toFormat('yyyy-MM-dd HH:mm:ss'); - }; + tooltipFn = (d: number) => DateTime.fromMillis(d, { zone: 'utc+8' }).toFormat('yyyy-MM-dd HH:mm:ss'); break; case 'utc-8': - tooltipFn = (d: number) => { - return DateTime.fromMillis(d, { zone: 'utc-8' }).toFormat('yyyy-MM-dd HH:mm:ss'); - }; + tooltipFn = (d: number) => DateTime.fromMillis(d, { zone: 'utc-8' }).toFormat('yyyy-MM-dd HH:mm:ss'); break; default: case 'utc': - tooltipFn = (d: number) => { - return DateTime.fromMillis(d) - .toUTC() - .toFormat('yyyy-MM-dd HH:mm:ss'); - }; + tooltipFn = (d: number) => DateTime.fromMillis(d) + .toUTC() + .toFormat('yyyy-MM-dd HH:mm:ss'); break; } return ( diff --git a/stories/scales/2_local_tooltip.tsx b/stories/scales/2_local_tooltip.tsx index e887de6c8e..eea6ae971b 100644 --- a/stories/scales/2_local_tooltip.tsx +++ b/stories/scales/2_local_tooltip.tsx @@ -14,42 +14,38 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { DateTime } from 'luxon'; import React from 'react'; + import { Axis, Chart, LineSeries, Position, ScaleType } from '../../src'; import { SB_SOURCE_PANEL } from '../utils/storybook'; const UTC_DATE = DateTime.fromISO('2019-01-01T00:00:00.000Z').toMillis(); const DAY_INCREMENT_1 = 1000 * 60 * 60 * 24; -const UTC_DATASET = new Array(10).fill(0).map((d, i) => { - return [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]; -}); +const UTC_DATASET = new Array(10).fill(0).map((d, i) => [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]); -export const Example = () => { - return ( - - { - return DateTime.fromMillis(d).toFormat('yyyy-MM-dd HH:mm:ss'); - }} - /> - - - - ); -}; +export const Example = () => ( + + DateTime.fromMillis(d).toFormat('yyyy-MM-dd HH:mm:ss')} + /> + + + +); Example.story = { parameters: { diff --git a/stories/scales/3_utc_tooltip.tsx b/stories/scales/3_utc_tooltip.tsx index caba860fd9..5c37ee2a44 100644 --- a/stories/scales/3_utc_tooltip.tsx +++ b/stories/scales/3_utc_tooltip.tsx @@ -14,44 +14,40 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { DateTime } from 'luxon'; import React from 'react'; + import { Axis, Chart, LineSeries, Position, ScaleType } from '../../src'; import { SB_SOURCE_PANEL } from '../utils/storybook'; const UTC_DATE = DateTime.fromISO('2019-01-01T00:00:00.000Z').toMillis(); const DAY_INCREMENT_1 = 1000 * 60 * 60 * 24; -const UTC_DATASET = new Array(10).fill(0).map((d, i) => { - return [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]; -}); +const UTC_DATASET = new Array(10).fill(0).map((d, i) => [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]); -export const Example = () => { - return ( - - { - return DateTime.fromMillis(d) - .toUTC() - .toFormat('yyyy-MM-dd HH:mm:ss'); - }} - /> - - - - ); -}; +export const Example = () => ( + + DateTime.fromMillis(d) + .toUTC() + .toFormat('yyyy-MM-dd HH:mm:ss')} + /> + + + +); Example.story = { parameters: { diff --git a/stories/scales/4_specified_timezone.tsx b/stories/scales/4_specified_timezone.tsx index fb05bec17a..1fd8e12ab7 100644 --- a/stories/scales/4_specified_timezone.tsx +++ b/stories/scales/4_specified_timezone.tsx @@ -14,42 +14,40 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { DateTime } from 'luxon'; import React from 'react'; + import { Axis, Chart, LineSeries, Position, ScaleType } from '../../src'; import { SB_SOURCE_PANEL } from '../utils/storybook'; -export const Example = () => { - return ( - - { - return DateTime.fromMillis(d, { zone: 'utc-6' }).toISO(); - }} - /> - - - - ); -}; +export const Example = () => ( + + DateTime.fromMillis(d, { zone: 'utc-6' }).toISO()} + /> + + + +); Example.story = { parameters: { diff --git a/stories/scales/5_remove_duplicates.tsx b/stories/scales/5_remove_duplicates.tsx index 7b1769b70b..16f030dbb9 100644 --- a/stories/scales/5_remove_duplicates.tsx +++ b/stories/scales/5_remove_duplicates.tsx @@ -14,44 +14,44 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean } from '@storybook/addon-knobs'; import React from 'react'; + import { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '../../src'; -export const Example = () => { - return ( - - - - `${d}%`} /> - `${d}%`} /> - `${d}%`} /> - `${d}%`} /> - - - ); -}; +export const Example = () => ( + + + + `${d}%`} /> + `${d}%`} /> + `${d}%`} /> + `${d}%`} /> + + +); Example.story = { parameters: { info: { - text: `hideDuplicateAxes will remove redundant axes that have the same min and max labels and position`, + text: 'hideDuplicateAxes will remove redundant axes that have the same min and max labels and position', }, }, }; diff --git a/stories/scales/scales.stories.tsx b/stories/scales/scales.stories.tsx index b17651e501..5225432259 100644 --- a/stories/scales/scales.stories.tsx +++ b/stories/scales/scales.stories.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { SB_KNOBS_PANEL } from '../utils/storybook'; diff --git a/stories/stylings/10_custom_bars.tsx b/stories/stylings/10_custom_bars.tsx index 1002287bef..2e112afefe 100644 --- a/stories/stylings/10_custom_bars.tsx +++ b/stories/stylings/10_custom_bars.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean, color, number } from '@storybook/addon-knobs'; import React from 'react'; @@ -67,7 +68,7 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> { return ( - + Number(d).toFixed(2)} /> { return ( - + Number(d).toFixed(2)} /> { const customSeriesNamingFn: SeriesNameFn = ({ yAccessor, splitAccessors }) => { - // eslint-disable-next-line react/prop-types if (yAccessor === 'y1' && splitAccessors.get('g') === 'a') { return 'Custom full series name'; } @@ -35,7 +35,7 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> { return ( - + Number(d).toFixed(2)} /> { @@ -64,7 +65,7 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> { tickLabelStyle: { fill: color('tickFill', '#333', 'Tick Label'), fontSize: range('tickFontSize', 0, 40, 10, 'Tick Label'), - fontFamily: `'Open Sans', Helvetica, Arial, sans-serif`, + fontFamily: '\'Open Sans\', Helvetica, Arial, sans-serif', fontStyle: 'normal', padding: number('Tick Label Padding Theme', 1, {}, 'Tick Label'), }, @@ -53,13 +54,7 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> { }, }} /> - + Number(d).toFixed(2)} /> { const fillOption = select( @@ -63,7 +64,7 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> { const customTheme: PartialTheme = { @@ -37,7 +38,7 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> { const customTheme: PartialTheme = { @@ -45,7 +46,7 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> { const partialColorTheme: PartialTheme = { @@ -45,33 +47,27 @@ export const Example = () => { id="spec_1" data={mocks.miniSunburst} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, nodeLabel: (d: any) => productLookup[d].name, shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.7)(d.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.7)(d.sortIndex), }, }, { - groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.substr(0, 2), + groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2), nodeLabel: (d: any) => regionLookup[d].regionName, shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.5)(d.parent.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.5)(d.parent.sortIndex), }, }, { groupByRollup: (d: Datum) => d.dest, nodeLabel: (d: any) => countryLookup[d].name, shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.3)(d.parent.parent.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.3)(d.parent.parent.sortIndex), }, }, ]} @@ -83,7 +79,7 @@ export const Example = () => { }, fontFamily: 'Arial', fillLabel: { - valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, fontStyle: 'italic', textInvertible: invertTextColors, textContrast: toggleTextContrast, diff --git a/stories/stylings/21_partition_labels.tsx b/stories/stylings/21_partition_labels.tsx index 65d625290b..53c7d4b06d 100644 --- a/stories/stylings/21_partition_labels.tsx +++ b/stories/stylings/21_partition_labels.tsx @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import { color } from '@storybook/addon-knobs'; +import React from 'react'; import { Chart, Datum, Partition, Settings } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; -import { color } from '@storybook/addon-knobs'; export const Example = () => { const partialCustomTheme = { @@ -36,7 +38,7 @@ export const Example = () => { id="spec_1" data={mocks.pie} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/stylings/2_margins.tsx b/stories/stylings/2_margins.tsx index 1cf858351a..b2644ee457 100644 --- a/stories/stylings/2_margins.tsx +++ b/stories/stylings/2_margins.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { boolean, number } from '@storybook/addon-knobs'; import React from 'react'; @@ -70,7 +71,7 @@ export const Example = () => { id="bottom" position={Position.Bottom} title={withBottomTitle ? 'Bottom axis' : undefined} - showOverlappingTicks={true} + showOverlappingTicks showGridLines={boolean('show bottom axis grid lines', false)} /> { id="top" position={Position.Top} title={withTopTitle ? 'Top axis' : undefined} - showOverlappingTicks={true} + showOverlappingTicks showGridLines={boolean('show top axis grid lines', false)} /> { fill: color('titleFill', '#333', 'Axis Title'), fontSize: range('titleFontSize', 0, 40, 12, 'Axis Title'), fontStyle: 'bold', - fontFamily: `'Open Sans', Helvetica, Arial, sans-serif`, + fontFamily: '\'Open Sans\', Helvetica, Arial, sans-serif', padding: range('titlePadding', 0, 40, 5, 'Axis Title'), }, axisLineStyle: { @@ -52,7 +53,7 @@ export const Example = () => { tickLabelStyle: { fill: color('tickFill', '#333', 'Tick Label'), fontSize: range('tickFontSize', 0, 40, 10, 'Tick Label'), - fontFamily: `'Open Sans', Helvetica, Arial, sans-serif`, + fontFamily: '\'Open Sans\', Helvetica, Arial, sans-serif', fontStyle: 'normal', padding: number('tickLabelPadding', 1, {}, 'Tick Label'), }, @@ -68,9 +69,9 @@ export const Example = () => { - + Number(d).toFixed(2)} /> { showLegendExtra legendPosition={Position.Right} /> - + Number(d).toFixed(2)} /> - + Number(d).toFixed(2)} /> { return ( - + Number(d).toFixed(2)} /> - + Number(d).toFixed(2)} /> { baseTheme={LIGHT_THEME} legendPosition={Position.Right} /> - + Number(d).toFixed(2)} /> - + Number(d).toFixed(2)} /> { return ( - + Number(d).toFixed(2)} /> - + Number(d).toFixed(2)} /> { - return ( - - - - Number(d).toFixed(2)} /> +export const Example = () => ( + + + + Number(d).toFixed(2)} /> - - - ); -}; + + +); // storybook configuration Example.story = { diff --git a/stories/stylings/9_custom_series_colors_function.tsx b/stories/stylings/9_custom_series_colors_function.tsx index 7b977bd0de..5d69fb2f58 100644 --- a/stories/stylings/9_custom_series_colors_function.tsx +++ b/stories/stylings/9_custom_series_colors_function.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { color } from '@storybook/addon-knobs'; import React from 'react'; @@ -26,12 +27,10 @@ export const Example = () => { const barColor = color('barSeriesColor', '#000'); const barSeriesColorAccessor: SeriesColorAccessor = ({ specId, yAccessor, splitAccessors }) => { if ( - specId === 'bars' && - yAccessor === 'y1' && - // eslint-disable-next-line react/prop-types - splitAccessors.get('g1') === 'cloudflare.com' && - // eslint-disable-next-line react/prop-types - splitAccessors.get('g2') === 'direct-cdn' + specId === 'bars' + && yAccessor === 'y1' + && splitAccessors.get('g1') === 'cloudflare.com' + && splitAccessors.get('g2') === 'direct-cdn' ) { return barColor; } @@ -40,7 +39,6 @@ export const Example = () => { const lineColor = color('linelineSeriesColor', '#ff0'); const lineSeriesColorAccessor: SeriesColorAccessor = ({ specId, yAccessor, splitAccessors }) => { - // eslint-disable-next-line react/prop-types if (specId === 'lines' && yAccessor === 'y1' && splitAccessors.size === 0) { return lineColor; } @@ -50,7 +48,7 @@ export const Example = () => { return ( - + Number(d).toFixed(2)} /> ( @@ -28,7 +30,7 @@ export const Example = () => ( id="spec_1" data={mocks.pie.slice(0, 2)} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/11_small_large.tsx b/stories/sunburst/11_small_large.tsx index ca1743eec9..d948482842 100644 --- a/stories/sunburst/11_small_large.tsx +++ b/stories/sunburst/11_small_large.tsx @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; import { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils'; export const Example = () => ( diff --git a/stories/sunburst/12_very_small.tsx b/stories/sunburst/12_very_small.tsx index c4ed106797..a37bc09831 100644 --- a/stories/sunburst/12_very_small.tsx +++ b/stories/sunburst/12_very_small.tsx @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; import { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils'; export const Example = () => ( diff --git a/stories/sunburst/13_empty.tsx b/stories/sunburst/13_empty.tsx index 5e88507d41..811e7168b8 100644 --- a/stories/sunburst/13_empty.tsx +++ b/stories/sunburst/13_empty.tsx @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( diff --git a/stories/sunburst/14_full_zero.tsx b/stories/sunburst/14_full_zero.tsx index ce7c2573fb..8a2866812e 100644 --- a/stories/sunburst/14_full_zero.tsx +++ b/stories/sunburst/14_full_zero.tsx @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( diff --git a/stories/sunburst/15_single.tsx b/stories/sunburst/15_single.tsx index 70916513f2..d4d6d61e8f 100644 --- a/stories/sunburst/15_single.tsx +++ b/stories/sunburst/15_single.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -28,7 +30,7 @@ export const Example = () => ( id="spec_1" data={mocks.pie.slice(0, 1)} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/15_single_sunburst.tsx b/stories/sunburst/15_single_sunburst.tsx index cd1c7bf409..86f52f80cf 100644 --- a/stories/sunburst/15_single_sunburst.tsx +++ b/stories/sunburst/15_single_sunburst.tsx @@ -14,13 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout, Settings } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; import { ShapeTreeNode } from '../../src/chart_types/partition_chart/layout/types/viewmodel_types'; +import { mocks } from '../../src/mocks/hierarchical'; import { categoricalFillColor, colorBrewerCategoricalStark9, @@ -30,39 +32,33 @@ import { } from '../utils/utils'; export const Example = () => ( - + d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, nodeLabel: (d: any) => productLookup[d].name, shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.7)(d.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.7)(d.sortIndex), }, }, { - groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.substr(0, 2), + groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2), nodeLabel: (d: any) => regionLookup[d].regionName.replace(/\s/g, '\u00A0'), shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.5)(d.parent.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.5)(d.parent.sortIndex), }, }, { groupByRollup: (d: Datum) => d.dest, nodeLabel: (d: any) => countryLookup[d].name.replace(/\s/g, '\u00A0'), shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.3)(d.parent.parent.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.3)(d.parent.parent.sortIndex), }, }, ]} @@ -74,7 +70,7 @@ export const Example = () => ( }, fontFamily: 'Arial', fillLabel: { - valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, fontStyle: 'italic', textInvertible: true, fontWeight: 900, diff --git a/stories/sunburst/16_single_small.tsx b/stories/sunburst/16_single_small.tsx index 8218d59ecf..532631ff05 100644 --- a/stories/sunburst/16_single_small.tsx +++ b/stories/sunburst/16_single_small.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -28,7 +30,7 @@ export const Example = () => ( id="spec_1" data={mocks.pie.slice(0, 1)} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/17_single_very_small.tsx b/stories/sunburst/17_single_very_small.tsx index 33723bd454..45c74d5b11 100644 --- a/stories/sunburst/17_single_very_small.tsx +++ b/stories/sunburst/17_single_very_small.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -28,7 +30,7 @@ export const Example = () => ( id="spec_1" data={mocks.pie.slice(0, 1)} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/18_no_sliced.tsx b/stories/sunburst/18_no_sliced.tsx index 32b1c0b433..2c213ca3ed 100644 --- a/stories/sunburst/18_no_sliced.tsx +++ b/stories/sunburst/18_no_sliced.tsx @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -27,7 +29,7 @@ export const Example = () => ( id="spec_1" data={[]} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/19_negative.tsx b/stories/sunburst/19_negative.tsx index bdff9e2c27..f9cd60e3c2 100644 --- a/stories/sunburst/19_negative.tsx +++ b/stories/sunburst/19_negative.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -31,7 +33,7 @@ export const Example = () => ( .concat(mocks.pie.slice(2, 3).map((s) => ({ ...s, exportVal: -0.1 }))) .concat(mocks.pie.slice(3))} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/1_simple.tsx b/stories/sunburst/1_simple.tsx index 5c92adae39..3a775345ee 100644 --- a/stories/sunburst/1_simple.tsx +++ b/stories/sunburst/1_simple.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -28,7 +30,7 @@ export const Example = () => ( id="spec_1" data={mocks.pie} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/20_total_zero.tsx b/stories/sunburst/20_total_zero.tsx index a0199b0f67..014f571619 100644 --- a/stories/sunburst/20_total_zero.tsx +++ b/stories/sunburst/20_total_zero.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -28,7 +30,7 @@ export const Example = () => ( id="spec_1" data={mocks.pie.map((s) => ({ ...s, exportVal: 0 }))} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/21_high_pie.tsx b/stories/sunburst/21_high_pie.tsx index dd21bdf451..1b1f437f5f 100644 --- a/stories/sunburst/21_high_pie.tsx +++ b/stories/sunburst/21_high_pie.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { countryLookup, indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils'; export const Example = () => ( @@ -28,7 +30,7 @@ export const Example = () => ( id="spec_1" data={mocks.manyPie} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.origin, diff --git a/stories/sunburst/22_counter_clockwise.tsx b/stories/sunburst/22_counter_clockwise.tsx index 79b5af7712..56330c788d 100644 --- a/stories/sunburst/22_counter_clockwise.tsx +++ b/stories/sunburst/22_counter_clockwise.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -28,7 +30,7 @@ export const Example = () => ( id="spec_1" data={mocks.pie} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/23_clockwise.tsx b/stories/sunburst/23_clockwise.tsx index b93aa91c8f..be72f43ce2 100644 --- a/stories/sunburst/23_clockwise.tsx +++ b/stories/sunburst/23_clockwise.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -28,7 +30,7 @@ export const Example = () => ( id="spec_1" data={mocks.pie} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/24_linked_label.tsx b/stories/sunburst/24_linked_label.tsx index 1bb53b6622..9fb7c2fd60 100644 --- a/stories/sunburst/24_linked_label.tsx +++ b/stories/sunburst/24_linked_label.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -28,7 +30,7 @@ export const Example = () => ( id="spec_1" data={mocks.pie} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/25_no_labels.tsx b/stories/sunburst/25_no_labels.tsx index b2451f03c3..11440e5a12 100644 --- a/stories/sunburst/25_no_labels.tsx +++ b/stories/sunburst/25_no_labels.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -28,7 +30,7 @@ export const Example = () => ( id="spec_1" data={mocks.pie} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/26_percentage.tsx b/stories/sunburst/26_percentage.tsx index b3e945624f..ec671eaaff 100644 --- a/stories/sunburst/26_percentage.tsx +++ b/stories/sunburst/26_percentage.tsx @@ -14,12 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import React from 'react'; + +import { Chart, Datum, Partition, PartitionLayout } from '../../src'; +import { config } from '../../src/chart_types/partition_chart/layout/config/config'; import { ShapeTreeNode } from '../../src/chart_types/partition_chart/layout/types/viewmodel_types'; +import { mocks } from '../../src/mocks/hierarchical'; import { categoricalFillColor, colorBrewerCategoricalStark9, @@ -27,7 +30,6 @@ import { productLookup, regionLookup, } from '../utils/utils'; -import { config } from '../../src/chart_types/partition_chart/layout/config/config'; export const Example = () => ( @@ -36,34 +38,28 @@ export const Example = () => ( data={mocks.miniSunburst} valueAccessor={(d: Datum) => d.exportVal as number} valueGetter="percent" - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} percentFormatter={(d: number) => `${Math.round((d + Number.EPSILON) * 100) / 100}%`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, nodeLabel: (d: any) => productLookup[d].name, shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.7)(d.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.7)(d.sortIndex), }, }, { - groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.substr(0, 2), + groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2), nodeLabel: (d: any) => regionLookup[d].regionName, shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.5)(d.parent.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.5)(d.parent.sortIndex), }, }, { groupByRollup: (d: Datum) => d.dest, nodeLabel: (d: any) => countryLookup[d].name, shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.3)(d.parent.parent.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.3)(d.parent.parent.sortIndex), }, }, ]} diff --git a/stories/sunburst/27_heterogeneous_depth.tsx b/stories/sunburst/27_heterogeneous_depth.tsx index 59a83331d6..9dea00298c 100644 --- a/stories/sunburst/27_heterogeneous_depth.tsx +++ b/stories/sunburst/27_heterogeneous_depth.tsx @@ -14,13 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; import { ShapeTreeNode } from '../../src/chart_types/partition_chart/layout/types/viewmodel_types'; +import { PrimitiveValue } from '../../src/chart_types/partition_chart/layout/utils/group_by_rollup'; +import { mocks } from '../../src/mocks/hierarchical'; import { categoricalFillColor, colorBrewerCategoricalStark9, @@ -28,42 +31,35 @@ import { productLookup, regionLookup, } from '../utils/utils'; -import { PrimitiveValue } from '../../src/chart_types/partition_chart/layout/utils/group_by_rollup'; export const Example = () => ( - + d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, nodeLabel: (d: PrimitiveValue) => d !== null && productLookup[d].name, shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.7)(d.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.7)(d.sortIndex), }, }, { - groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.substr(0, 2), + groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2), nodeLabel: (d: PrimitiveValue) => d !== null && regionLookup[d].regionName, shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.5)(d.parent.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.5)(d.parent.sortIndex), }, }, { groupByRollup: (d: Datum) => d.dest, nodeLabel: (d: PrimitiveValue) => d !== null && countryLookup[d].name, - showAccessor: (d: PrimitiveValue) => (['chn', 'hkg', 'jpn', 'kor'] as PrimitiveValue[]).indexOf(d) === -1, + showAccessor: (d: PrimitiveValue) => !(['chn', 'hkg', 'jpn', 'kor'] as PrimitiveValue[]).includes(d), shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.3)(d.parent.parent.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.3)(d.parent.parent.sortIndex), }, }, ]} @@ -75,7 +71,7 @@ export const Example = () => ( }, fontFamily: 'Arial', fillLabel: { - valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, fontStyle: 'italic', textInvertible: true, fontWeight: 900, diff --git a/stories/sunburst/28_not_a_number.tsx b/stories/sunburst/28_not_a_number.tsx index 132bb08561..ef2c96105a 100644 --- a/stories/sunburst/28_not_a_number.tsx +++ b/stories/sunburst/28_not_a_number.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -31,7 +33,7 @@ export const Example = () => ( .concat(mocks.pie.slice(2, 3).map((s) => ({ ...s, exportVal: (undefined as unknown) as number }))) .concat(mocks.pie.slice(3))} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/29_custom_stroke.tsx b/stories/sunburst/29_custom_stroke.tsx index fb8177f1bd..e10389b3d6 100644 --- a/stories/sunburst/29_custom_stroke.tsx +++ b/stories/sunburst/29_custom_stroke.tsx @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import { color } from '@storybook/addon-knobs'; +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout, Settings, DARK_THEME } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { countryLookup, indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils'; -import { color } from '@storybook/addon-knobs'; export const Example = () => { const partialCustomTheme = { @@ -36,7 +38,7 @@ export const Example = () => { id="spec_1" data={mocks.manyPie} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.origin, diff --git a/stories/sunburst/2_value_formatted.tsx b/stories/sunburst/2_value_formatted.tsx index b7893dcd22..bfa1666952 100644 --- a/stories/sunburst/2_value_formatted.tsx +++ b/stories/sunburst/2_value_formatted.tsx @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import { number } from '@storybook/addon-knobs'; +import React from 'react'; import { Chart, Datum, Partition } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorTurbo, productLookup } from '../utils/utils'; -import { number } from '@storybook/addon-knobs'; export const Example = () => ( @@ -29,7 +31,7 @@ export const Example = () => ( id="spec_1" data={mocks.pie} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/30_largest_circle.tsx b/stories/sunburst/30_largest_circle.tsx index 964c55ab3c..3c3baa7338 100644 --- a/stories/sunburst/30_largest_circle.tsx +++ b/stories/sunburst/30_largest_circle.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -28,7 +30,7 @@ export const Example = () => ( id="spec_1" data={mocks.pie} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/31_bold_link_value.tsx b/stories/sunburst/31_bold_link_value.tsx index a04f1ce756..dcee1de9ba 100644 --- a/stories/sunburst/31_bold_link_value.tsx +++ b/stories/sunburst/31_bold_link_value.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -28,7 +30,7 @@ export const Example = () => ( id="spec_1" data={mocks.pie} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/3_value_formatted_2.tsx b/stories/sunburst/3_value_formatted_2.tsx index 3f2e7454eb..401f0f0667 100644 --- a/stories/sunburst/3_value_formatted_2.tsx +++ b/stories/sunburst/3_value_formatted_2.tsx @@ -14,13 +14,15 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; import { ShapeTreeNode } from '../../src/chart_types/partition_chart/layout/types/viewmodel_types'; +import { mocks } from '../../src/mocks/hierarchical'; import { categoricalFillColor, colorBrewerCategoricalPastel12, productLookup } from '../utils/utils'; export const Example = () => ( @@ -29,7 +31,7 @@ export const Example = () => ( id="spec_1" data={mocks.pie} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/4_fill_labels.tsx b/stories/sunburst/4_fill_labels.tsx index 290444803f..d0824c9dc0 100644 --- a/stories/sunburst/4_fill_labels.tsx +++ b/stories/sunburst/4_fill_labels.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -28,7 +30,7 @@ export const Example = () => ( id="spec_1" data={mocks.pie} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, @@ -47,7 +49,7 @@ export const Example = () => ( }, fontFamily: 'Arial', fillLabel: { - valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, fontStyle: 'italic', }, margin: { top: 0, bottom: 0, left: 0, right: 0 }, diff --git a/stories/sunburst/5_donut.tsx b/stories/sunburst/5_donut.tsx index df82b5d379..1aa35c9736 100644 --- a/stories/sunburst/5_donut.tsx +++ b/stories/sunburst/5_donut.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -28,7 +30,7 @@ export const Example = () => ( id="spec_1" data={mocks.pie} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, @@ -47,7 +49,7 @@ export const Example = () => ( }, fontFamily: 'Arial', fillLabel: { - valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, fontStyle: 'italic', }, margin: { top: 0, bottom: 0, left: 0.2, right: 0 }, diff --git a/stories/sunburst/6_pie_chart_labels.tsx b/stories/sunburst/6_pie_chart_labels.tsx index 2a345c78e6..95759c1ac8 100644 --- a/stories/sunburst/6_pie_chart_labels.tsx +++ b/stories/sunburst/6_pie_chart_labels.tsx @@ -14,11 +14,13 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; import { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils'; export const Example = () => ( diff --git a/stories/sunburst/7_zero_slice.tsx b/stories/sunburst/7_zero_slice.tsx index 433d218b9c..9f88cf73f9 100644 --- a/stories/sunburst/7_zero_slice.tsx +++ b/stories/sunburst/7_zero_slice.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils'; export const Example = () => ( @@ -31,7 +33,7 @@ export const Example = () => ( .concat(mocks.pie.slice(2, 4).map((s) => ({ ...s, exportVal: 0 }))) .concat(mocks.pie.slice(4))} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, diff --git a/stories/sunburst/8_sunburst_two_layers.tsx b/stories/sunburst/8_sunburst_two_layers.tsx index c9302bb5c5..c59eb7de18 100644 --- a/stories/sunburst/8_sunburst_two_layers.tsx +++ b/stories/sunburst/8_sunburst_two_layers.tsx @@ -14,12 +14,14 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout, Settings } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; +import { mocks } from '../../src/mocks/hierarchical'; import { countryLookup, indexInterpolatedFillColor, interpolatorCET2s, regionLookup } from '../utils/utils'; export const Example = () => ( @@ -29,30 +31,30 @@ export const Example = () => ( id="spec_1" data={mocks.sunburst} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { - groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.substr(0, 2), + groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2), nodeLabel: (d: any) => regionLookup[d].regionName, fillLabel: { fontFamily: 'Impact', - valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000000))}\xa0Tn`, + valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000000))}\u00A0Tn`, }, shape: { - fillColor: (d) => { + fillColor: (d) => // pick color from color palette based on mean angle - rather distinct colors in the inner ring - return indexInterpolatedFillColor(interpolatorCET2s)(d, (d.x0 + d.x1) / 2 / (2 * Math.PI), []); - }, + indexInterpolatedFillColor(interpolatorCET2s)(d, (d.x0 + d.x1) / 2 / (2 * Math.PI), []) + , }, }, { groupByRollup: (d: Datum) => d.dest, nodeLabel: (d: any) => countryLookup[d].name, shape: { - fillColor: (d) => { + fillColor: (d) => // pick color from color palette based on mean angle - related yet distinct colors in the outer ring - return indexInterpolatedFillColor(interpolatorCET2s)(d, (d.x0 + d.x1) / 2 / (2 * Math.PI), []); - }, + indexInterpolatedFillColor(interpolatorCET2s)(d, (d.x0 + d.x1) / 2 / (2 * Math.PI), []) + , }, }, ]} @@ -65,7 +67,7 @@ export const Example = () => ( fontFamily: 'Arial', fillLabel: { textInvertible: true, - valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, fontStyle: 'italic', }, margin: { top: 0, bottom: 0, left: 0, right: 0 }, diff --git a/stories/sunburst/9_sunburst_three_layers.tsx b/stories/sunburst/9_sunburst_three_layers.tsx index 72e14a7c27..81c5713543 100644 --- a/stories/sunburst/9_sunburst_three_layers.tsx +++ b/stories/sunburst/9_sunburst_three_layers.tsx @@ -14,13 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import { boolean } from '@storybook/addon-knobs'; +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout, Settings } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; -import React from 'react'; import { ShapeTreeNode } from '../../src/chart_types/partition_chart/layout/types/viewmodel_types'; +import { mocks } from '../../src/mocks/hierarchical'; import { categoricalFillColor, colorBrewerCategoricalStark9, @@ -28,35 +31,30 @@ import { productLookup, regionLookup, } from '../utils/utils'; -import { boolean } from '@storybook/addon-knobs'; export const Example = () => ( - + d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, nodeLabel: (d: any) => productLookup[d].name, fillLabel: { maximizeFontSize: boolean('Maximize font size layer 1', true) }, shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.7)(d.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.7)(d.sortIndex), }, }, { - groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.substr(0, 2), + groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2), nodeLabel: (d: any) => regionLookup[d].regionName, fillLabel: { maximizeFontSize: boolean('Maximize font size layer 2', true) }, shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.5)(d.parent.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.5)(d.parent.sortIndex), }, }, { @@ -64,9 +62,7 @@ export const Example = () => ( nodeLabel: (d: any) => countryLookup[d].name, fillLabel: { maximizeFontSize: boolean('Maximize font size layer 3', true) }, shape: { - fillColor: (d: ShapeTreeNode) => { - return categoricalFillColor(colorBrewerCategoricalStark9, 0.3)(d.parent.parent.sortIndex); - }, + fillColor: (d: ShapeTreeNode) => categoricalFillColor(colorBrewerCategoricalStark9, 0.3)(d.parent.parent.sortIndex), }, }, ]} @@ -78,7 +74,7 @@ export const Example = () => ( }, fontFamily: 'Arial', fillLabel: { - valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, fontStyle: 'italic', textInvertible: true, fontWeight: 900, diff --git a/stories/sunburst/sunburst.stories.tsx b/stories/sunburst/sunburst.stories.tsx index c36e064de8..6566a9586a 100644 --- a/stories/sunburst/sunburst.stories.tsx +++ b/stories/sunburst/sunburst.stories.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { SB_SOURCE_PANEL } from '../utils/storybook'; diff --git a/stories/treemap/10_three_layers.tsx b/stories/treemap/10_three_layers.tsx index 0b12cb1794..07a9845e4d 100644 --- a/stories/treemap/10_three_layers.tsx +++ b/stories/treemap/10_three_layers.tsx @@ -14,17 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ -import { Chart, Datum, Partition, PartitionLayout, Settings } from '../../src/index'; -import { mocks } from '../../src/mocks/hierarchical/index'; -import { config } from '../../src/chart_types/partition_chart/layout/config/config'; +import { boolean } from '@storybook/addon-knobs'; import React from 'react'; + +import { Chart, Datum, Partition, PartitionLayout, Settings } from '../../src'; +import { config } from '../../src/chart_types/partition_chart/layout/config/config'; import { ShapeTreeNode } from '../../src/chart_types/partition_chart/layout/types/viewmodel_types'; -import { countryLookup, productLookup, regionLookup } from '../utils/utils'; import { hueInterpolator } from '../../src/chart_types/partition_chart/layout/utils/calcs'; +import { mocks } from '../../src/mocks/hierarchical'; import { palettes } from '../../src/mocks/hierarchical/palettes'; -import { boolean } from '@storybook/addon-knobs'; +import { countryLookup, productLookup, regionLookup } from '../utils/utils'; const interpolator = hueInterpolator(palettes.CET2s.map(([r, g, b]) => [r, g, b, 0.5])); @@ -37,19 +39,19 @@ const countries = mocks.sunburst const countryCount = countries.length; export const Example = () => ( - + d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, nodeLabel: (d: any) => productLookup[d].name.toUpperCase(), fillLabel: { - valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, fontFamily: 'Helvetica', textColor: 'black', textInvertible: false, @@ -62,10 +64,10 @@ export const Example = () => ( shape: { fillColor: 'rgba(0,0,0,0)' }, }, { - groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.substr(0, 2), + groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2), nodeLabel: (d: any) => regionLookup[d].regionName, fillLabel: { - valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, textColor: 'black', textInvertible: false, fontWeight: 200, @@ -85,10 +87,10 @@ export const Example = () => ( groupByRollup: (d: Datum) => d.dest, nodeLabel: (d: any) => countryLookup[d].name, shape: { - fillColor: (d: ShapeTreeNode) => { + fillColor: (d: ShapeTreeNode) => // pick color by country - return interpolator(countries.indexOf(d.dataName) / countryCount); - }, + interpolator(countries.indexOf(d.dataName) / countryCount) + , }, fillLabel: { maximizeFontSize: boolean('Maximize font size layer 3', true) }, }, diff --git a/stories/treemap/1_one_layer.tsx b/stories/treemap/1_one_layer.tsx index 91dddfc8eb..9076348b07 100644 --- a/stories/treemap/1_one_layer.tsx +++ b/stories/treemap/1_one_layer.tsx @@ -14,15 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; import { arrayToLookup, hueInterpolator } from '../../src/chart_types/partition_chart/layout/utils/calcs'; +import { mocks } from '../../src/mocks/hierarchical'; import { productDimension } from '../../src/mocks/hierarchical/dimension_codes'; import { palettes } from '../../src/mocks/hierarchical/palettes'; -import React from 'react'; const productLookup = arrayToLookup((d: Datum) => d.sitc1, productDimension); @@ -37,14 +39,14 @@ export const Example = () => ( id="spec_1" data={mocks.pie} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, nodeLabel: (d: Datum) => productLookup[d].name, fillLabel: { textInvertible: true, - valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, }, shape: { fillColor: defaultFillColor(interpolatorCET2s), diff --git a/stories/treemap/2_one_layer_2.tsx b/stories/treemap/2_one_layer_2.tsx index 9eaedf14c8..41ffac1305 100644 --- a/stories/treemap/2_one_layer_2.tsx +++ b/stories/treemap/2_one_layer_2.tsx @@ -14,15 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; +import { ShapeTreeNode } from '../../src/chart_types/partition_chart/layout/types/viewmodel_types'; import { arrayToLookup } from '../../src/chart_types/partition_chart/layout/utils/calcs'; +import { mocks } from '../../src/mocks/hierarchical'; import { productDimension } from '../../src/mocks/hierarchical/dimension_codes'; -import React from 'react'; -import { ShapeTreeNode } from '../../src/chart_types/partition_chart/layout/types/viewmodel_types'; import { categoricalFillColor, colorBrewerCategoricalPastel12 } from '../utils/utils'; const productLookup = arrayToLookup((d: Datum) => d.sitc1, productDimension); @@ -33,14 +35,14 @@ export const Example = () => ( id="spec_1" data={mocks.pie} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, nodeLabel: (d: Datum) => productLookup[d].name, fillLabel: { textInvertible: true, - valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, valueFont: { fontWeight: 100, }, diff --git a/stories/treemap/3_mid_two.tsx b/stories/treemap/3_mid_two.tsx index e9e0956465..f7af0303ca 100644 --- a/stories/treemap/3_mid_two.tsx +++ b/stories/treemap/3_mid_two.tsx @@ -14,16 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout, Settings } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; +import { ShapeTreeNode } from '../../src/chart_types/partition_chart/layout/types/viewmodel_types'; import { arrayToLookup, hueInterpolator } from '../../src/chart_types/partition_chart/layout/utils/calcs'; +import { mocks } from '../../src/mocks/hierarchical'; import { countryDimension, regionDimension } from '../../src/mocks/hierarchical/dimension_codes'; import { palettes } from '../../src/mocks/hierarchical/palettes'; -import React from 'react'; -import { ShapeTreeNode } from '../../src/chart_types/partition_chart/layout/types/viewmodel_types'; const regionLookup = arrayToLookup((d: Datum) => d.region, regionDimension); const countryLookup = arrayToLookup((d: Datum) => d.country, countryDimension); @@ -37,13 +39,13 @@ export const Example = () => ( id="spec_1" data={mocks.sunburst} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { - groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.substr(0, 2), + groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2), nodeLabel: (d: any) => regionLookup[d].regionName, fillLabel: { - valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, fontFamily: 'Helvetica', textColor: 'grey', textInvertible: false, @@ -54,7 +56,7 @@ export const Example = () => ( groupByRollup: (d: Datum) => d.dest, nodeLabel: (d: any) => countryLookup[d].name, fillLabel: { - valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, textColor: 'black', textInvertible: false, fontWeight: 200, @@ -64,12 +66,12 @@ export const Example = () => ( valueFont: { fontWeight: 400, fontStyle: 'italic' }, }, shape: { - fillColor: (d: ShapeTreeNode) => { + fillColor: (d: ShapeTreeNode) => // primarily, pick color based on parent's index, but then perturb by the index within the parent - return interpolatorTurbo( + interpolatorTurbo( (d.parent.sortIndex + d.sortIndex / d.parent.children.length) / (d.parent.parent.children.length + 1), - ); - }, + ) + , }, }, ]} diff --git a/stories/treemap/4_two_layer_stress.tsx b/stories/treemap/4_two_layer_stress.tsx index 1dafdd6801..47f4beb976 100644 --- a/stories/treemap/4_two_layer_stress.tsx +++ b/stories/treemap/4_two_layer_stress.tsx @@ -14,17 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout, Settings } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; +import { ShapeTreeNode } from '../../src/chart_types/partition_chart/layout/types/viewmodel_types'; import { arrayToLookup, hueInterpolator } from '../../src/chart_types/partition_chart/layout/utils/calcs'; +import { mocks } from '../../src/mocks/hierarchical'; import { countryDimension, productDimension } from '../../src/mocks/hierarchical/dimension_codes'; - import { palettes } from '../../src/mocks/hierarchical/palettes'; -import React from 'react'; -import { ShapeTreeNode } from '../../src/chart_types/partition_chart/layout/types/viewmodel_types'; const productLookup = arrayToLookup((d: Datum) => d.sitc1, productDimension); const countryLookup = arrayToLookup((d: Datum) => d.country, countryDimension); @@ -38,7 +39,7 @@ export const Example = () => ( id="spec_1" data={mocks.sunburst} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, @@ -57,7 +58,7 @@ export const Example = () => ( groupByRollup: (d: Datum) => d.dest, nodeLabel: (d: any) => countryLookup[d].name, fillLabel: { - valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, textColor: 'black', textInvertible: true, fontWeight: 100, @@ -69,12 +70,12 @@ export const Example = () => ( }, }, shape: { - fillColor: (d: ShapeTreeNode) => { + fillColor: (d: ShapeTreeNode) => // primarily, pick color based on parent's index, but then perturb by the index within the parent - return interpolatorTurbo( + interpolatorTurbo( (d.parent.sortIndex + d.sortIndex / d.parent.children.length) / (d.parent.parent.children.length + 1), - ); - }, + ) + , }, }, ]} diff --git a/stories/treemap/5_multicolor.tsx b/stories/treemap/5_multicolor.tsx index c8596974a7..50f8982642 100644 --- a/stories/treemap/5_multicolor.tsx +++ b/stories/treemap/5_multicolor.tsx @@ -14,15 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; import { arrayToLookup, hueInterpolator } from '../../src/chart_types/partition_chart/layout/utils/calcs'; +import { mocks } from '../../src/mocks/hierarchical'; import { countryDimension } from '../../src/mocks/hierarchical/dimension_codes'; import { palettes } from '../../src/mocks/hierarchical/palettes'; -import React from 'react'; import { regionLookup } from '../utils/utils'; const countryLookup = arrayToLookup((d: Datum) => d.country, countryDimension); @@ -41,7 +43,7 @@ export const Example = () => ( className="story-chart" size={ { - /*height: 800*/ + /* height: 800 */ } } > @@ -49,11 +51,11 @@ export const Example = () => ( id="spec_1" data={mocks.sunburst} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} topGroove={0} layers={[ { - groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.substr(0, 2), + groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2), nodeLabel: (d: any) => regionLookup[d].regionName, fillLabel: { valueFormatter: () => '', @@ -67,7 +69,7 @@ export const Example = () => ( groupByRollup: (d: Datum) => d.dest, nodeLabel: (d: any) => countryLookup[d].name, fillLabel: { - valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, textColor: 'rgba(60,60,60,1)', textInvertible: false, fontWeight: 100, diff --git a/stories/treemap/6_custom_style.tsx b/stories/treemap/6_custom_style.tsx index 6d78fba020..b54174ca7d 100644 --- a/stories/treemap/6_custom_style.tsx +++ b/stories/treemap/6_custom_style.tsx @@ -14,14 +14,16 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; import { arrayToLookup } from '../../src/chart_types/partition_chart/layout/utils/calcs'; +import { mocks } from '../../src/mocks/hierarchical'; import { countryDimension } from '../../src/mocks/hierarchical/dimension_codes'; -import React from 'react'; import { regionLookup } from '../utils/utils'; const countryLookup = arrayToLookup((d: Datum) => d.country, countryDimension); @@ -39,7 +41,7 @@ export const Example = () => ( className="story-chart" size={ { - /*height: 800*/ + /* height: 800 */ } } > @@ -47,10 +49,10 @@ export const Example = () => ( id="spec_1" data={mocks.sunburst} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { - groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.substr(0, 2), + groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2), nodeLabel: (d: any) => regionLookup[d].regionName, fillLabel: { valueFormatter: () => '', @@ -64,7 +66,7 @@ export const Example = () => ( groupByRollup: (d: Datum) => d.dest, nodeLabel: (d: any) => countryLookup[d].name, fillLabel: { - valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, textColor: 'rgba(60,60,60,1)', textInvertible: false, fontWeight: 600, diff --git a/stories/treemap/7_percentage.tsx b/stories/treemap/7_percentage.tsx index 1e7c841536..d9c14ccb45 100644 --- a/stories/treemap/7_percentage.tsx +++ b/stories/treemap/7_percentage.tsx @@ -14,16 +14,18 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config, percentValueGetter } from '../../src/chart_types/partition_chart/layout/config/config'; +import { ShapeTreeNode } from '../../src/chart_types/partition_chart/layout/types/viewmodel_types'; import { arrayToLookup, hueInterpolator } from '../../src/chart_types/partition_chart/layout/utils/calcs'; +import { mocks } from '../../src/mocks/hierarchical'; import { countryDimension, regionDimension } from '../../src/mocks/hierarchical/dimension_codes'; import { palettes } from '../../src/mocks/hierarchical/palettes'; -import React from 'react'; -import { ShapeTreeNode } from '../../src/chart_types/partition_chart/layout/types/viewmodel_types'; const regionLookup = arrayToLookup((d: Datum) => d.region, regionDimension); const countryLookup = arrayToLookup((d: Datum) => d.country, countryDimension); @@ -35,7 +37,7 @@ export const Example = () => ( className="story-chart" size={ { - /*height: 800*/ + /* height: 800 */ } } > @@ -44,10 +46,10 @@ export const Example = () => ( data={mocks.sunburst} valueAccessor={(d: Datum) => d.exportVal as number} valueGetter={percentValueGetter} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { - groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.substr(0, 2), + groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2), nodeLabel: (d: any) => regionLookup[d].regionName, fillLabel: { fontFamily: 'Helvetica', @@ -70,12 +72,12 @@ export const Example = () => ( valueFont: { fontWeight: 400, fontStyle: 'italic' }, }, shape: { - fillColor: (d: ShapeTreeNode) => { + fillColor: (d: ShapeTreeNode) => // primarily, pick color based on parent's index, but then perturb by the index within the parent - return interpolatorTurbo( + interpolatorTurbo( (d.parent.sortIndex + d.sortIndex / d.parent.children.length) / (d.parent.parent.children.length + 1), - ); - }, + ) + , }, }, ]} diff --git a/stories/treemap/8_groove_text.tsx b/stories/treemap/8_groove_text.tsx index 543c717af2..16858dab88 100644 --- a/stories/treemap/8_groove_text.tsx +++ b/stories/treemap/8_groove_text.tsx @@ -14,17 +14,19 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import { number } from '@storybook/addon-knobs'; +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; +import { ShapeTreeNode } from '../../src/chart_types/partition_chart/layout/types/viewmodel_types'; import { arrayToLookup, hueInterpolator } from '../../src/chart_types/partition_chart/layout/utils/calcs'; +import { mocks } from '../../src/mocks/hierarchical'; import { countryDimension, regionDimension } from '../../src/mocks/hierarchical/dimension_codes'; import { palettes } from '../../src/mocks/hierarchical/palettes'; -import React from 'react'; -import { ShapeTreeNode } from '../../src/chart_types/partition_chart/layout/types/viewmodel_types'; -import { number } from '@storybook/addon-knobs'; const regionLookup = arrayToLookup((d: Datum) => d.region, regionDimension); const countryLookup = arrayToLookup((d: Datum) => d.country, countryDimension); @@ -34,25 +36,19 @@ const interpolatorTurbo = hueInterpolator(palettes.turbo.map(([r, g, b]) => [r, export const Example = () => ( d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { - groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.substr(0, 2), + groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2), nodeLabel: (d: any) => regionLookup[d].regionName.toUpperCase(), fillLabel: { - valueFormatter: () => ``, + valueFormatter: () => '', fontFamily: 'Helvetica', - // fontVariant: 'small-caps', textColor: '#555', textInvertible: false, fontWeight: 100, @@ -72,7 +68,7 @@ export const Example = () => ( groupByRollup: (d: Datum) => d.dest, nodeLabel: (d: any) => countryLookup[d].name, fillLabel: { - valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, textColor: 'black', textInvertible: true, fontWeight: 200, @@ -90,12 +86,12 @@ export const Example = () => ( idealFontSizeJump: 1.01, }, shape: { - fillColor: (d: ShapeTreeNode) => { + fillColor: (d: ShapeTreeNode) => // primarily, pick color based on parent's index, but then perturb by the index within the parent - return interpolatorTurbo( + interpolatorTurbo( (d.parent.sortIndex + d.sortIndex / d.parent.children.length) / (d.parent.parent.children.length + 1), - ); - }, + ) + , }, }, ]} diff --git a/stories/treemap/9_zero_values.tsx b/stories/treemap/9_zero_values.tsx index 6ecdecba69..7643d2907c 100644 --- a/stories/treemap/9_zero_values.tsx +++ b/stories/treemap/9_zero_values.tsx @@ -14,15 +14,17 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ + +import React from 'react'; import { Chart, Datum, Partition, PartitionLayout } from '../../src'; -import { mocks } from '../../src/mocks/hierarchical/index'; import { config } from '../../src/chart_types/partition_chart/layout/config/config'; import { arrayToLookup, hueInterpolator } from '../../src/chart_types/partition_chart/layout/utils/calcs'; +import { mocks } from '../../src/mocks/hierarchical'; import { productDimension } from '../../src/mocks/hierarchical/dimension_codes'; import { palettes } from '../../src/mocks/hierarchical/palettes'; -import React from 'react'; const productLookup = arrayToLookup((d: Datum) => d.sitc1, productDimension); @@ -37,14 +39,14 @@ export const Example = () => ( id="spec_1" data={mocks.pie.map((d: any, i: number) => (i ? d : { ...d, exportVal: 0 }))} valueAccessor={(d: Datum) => d.exportVal as number} - valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`} + valueFormatter={(d: number) => `$${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`} layers={[ { groupByRollup: (d: Datum) => d.sitc1, nodeLabel: (d: Datum) => productLookup[d].name, fillLabel: { textInvertible: true, - valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\xa0Bn`, + valueFormatter: (d: number) => `${config.fillLabel.valueFormatter(Math.round(d / 1000000000))}\u00A0Bn`, }, shape: { fillColor: defaultFillColor(interpolatorCET2s), diff --git a/stories/treemap/treemap.stories.tsx b/stories/treemap/treemap.stories.tsx index 8fc19d53fa..124fc16090 100644 --- a/stories/treemap/treemap.stories.tsx +++ b/stories/treemap/treemap.stories.tsx @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { SB_SOURCE_PANEL } from '../utils/storybook'; diff --git a/stories/utils/knobs.ts b/stories/utils/knobs.ts index 72d787f8fd..c214eb53ac 100644 --- a/stories/utils/knobs.ts +++ b/stories/utils/knobs.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { select, array } from '@storybook/addon-knobs'; @@ -25,7 +26,7 @@ export const numberSelect = ( options: { [s: string]: T }, value: T, groupId?: string, -): T => (parseInt(select(name, options, value, groupId) as string) as T) || value; +): T => (parseInt(select(name, options, value, groupId) as string, 10) as T) || value; export const getChartRotationKnob = () => numberSelect( @@ -92,7 +93,5 @@ export const getPlacementKnob = (name = 'placement', defaultValue?: Placement) = export function arrayKnobs(name: string, values: (string | number)[]): (string | number)[] { const stringifiedValues = values.map((d) => `${d}`); - return array(name, stringifiedValues).map((value: string) => { - return !isNaN(parseFloat(value)) ? parseFloat(value) : value; - }); + return array(name, stringifiedValues).map((value: string) => !isNaN(parseFloat(value)) ? parseFloat(value) : value); } diff --git a/stories/utils/storybook.ts b/stories/utils/storybook.ts index aad1340018..e8a5063c28 100644 --- a/stories/utils/storybook.ts +++ b/stories/utils/storybook.ts @@ -14,7 +14,8 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ export const SB_ACTION_PANEL = 'storybook/actions/panel'; export const SB_SOURCE_PANEL = 'storybook/source-loader/panel'; diff --git a/stories/utils/utils.ts b/stories/utils/utils.ts index 26d951c433..c1d7fbfe35 100644 --- a/stories/utils/utils.ts +++ b/stories/utils/utils.ts @@ -14,11 +14,12 @@ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations - * under the License. */ + * under the License. + */ import { arrayToLookup, hueInterpolator } from '../../src/chart_types/partition_chart/layout/utils/calcs'; -import { palettes } from '../../src/mocks/hierarchical/palettes'; import { countryDimension, productDimension, regionDimension } from '../../src/mocks/hierarchical/dimension_codes'; +import { palettes } from '../../src/mocks/hierarchical/palettes'; export const productLookup = arrayToLookup((d: any) => d.sitc1, productDimension); export const regionLookup = arrayToLookup((d: any) => d.region, regionDimension); @@ -37,13 +38,10 @@ type RGBStrings = [string, string, string][]; const colorBrewerExportMatcher = /rgb\((\d{1,3}),(\d{1,3}),(\d{1,3})\)/; const colorStringToTuple = (s: string) => (colorBrewerExportMatcher.exec(s) as string[]).slice(1); -// prettier-ignore export const colorBrewerCategorical12: RGBStrings = ['rgb(166,206,227)', 'rgb(31,120,180)', 'rgb(178,223,138)', 'rgb(51,160,44)', 'rgb(251,154,153)', 'rgb(227,26,28)', 'rgb(253,191,111)', 'rgb(255,127,0)', 'rgb(202,178,214)', 'rgb(106,61,154)', 'rgb(255,255,153)', 'rgb(177,89,40)'].map(colorStringToTuple) as RGBStrings; -// prettier-ignore export const colorBrewerCategoricalPastel12: RGBStrings = ['rgb(166,206,227)', 'rgb(31,120,180)', 'rgb(178,223,138)', 'rgb(51,160,44)', 'rgb(251,154,153)', 'rgb(227,26,28)', 'rgb(253,191,111)', 'rgb(255,127,0)', 'rgb(202,178,214)', 'rgb(106,61,154)', 'rgb(255,255,153)', 'rgb(177,89,40)'].map(colorStringToTuple) as RGBStrings; -// prettier-ignore export const colorBrewerCategoricalStark9: RGBStrings = ['rgb(228,26,28)', 'rgb(55,126,184)', 'rgb(77,175,74)', 'rgb(152,78,163)', 'rgb(255,127,0)', 'rgb(255,255,51)', 'rgb(166,86,40)', 'rgb(247,129,191)', 'rgb(153,153,153)'].map(colorStringToTuple) as RGBStrings; export const categoricalFillColor = (categoricalColors: RGBStrings, opacity = 1) => (i: number) => diff --git a/tsconfig.lint.json b/tsconfig.lint.json new file mode 100644 index 0000000000..14ae921ce5 --- /dev/null +++ b/tsconfig.lint.json @@ -0,0 +1,7 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "allowJs": true + }, + "include": ["./**/*", "./.*.js", "./.playground/**/*", "./.storybook/**/*", "./.storybook-docs/**/*"] +} diff --git a/yarn.lock b/yarn.lock index 6153a91fae..13eea8d14d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5211,25 +5211,36 @@ dependencies: "@types/yargs-parser" "*" -"@typescript-eslint/eslint-plugin@^2.10.0": - version "2.10.0" - resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-2.10.0.tgz#c4cb103275e555e8a7e9b3d14c5951eb6d431e70" - integrity sha512-rT51fNLW0u3fnDGnAHVC5nu+Das+y2CpW10yqvf6/j5xbuUV3FxA3mBaIbM24CXODXjbgUznNb4Kg9XZOUxKAw== +"@typescript-eslint/eslint-plugin@^3.0.2": + version "3.2.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-3.2.0.tgz#7fb997f391af32ae6ca1dbe56bcefe4dd30bda14" + integrity sha512-t9RTk/GyYilIXt6BmZurhBzuMT9kLKw3fQoJtK9ayv0tXTlznXEAnx07sCLXdkN3/tZDep1s1CEV95CWuARYWA== dependencies: - "@typescript-eslint/experimental-utils" "2.10.0" - eslint-utils "^1.4.3" + "@typescript-eslint/experimental-utils" "3.2.0" functional-red-black-tree "^1.0.1" regexpp "^3.0.0" + semver "^7.3.2" tsutils "^3.17.1" -"@typescript-eslint/experimental-utils@2.10.0": - version "2.10.0" - resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-2.10.0.tgz#8db1656cdfd3d9dcbdbf360b8274dea76f0b2c2c" - integrity sha512-FZhWq6hWWZBP76aZ7bkrfzTMP31CCefVIImrwP3giPLcoXocmLTmr92NLZxuIcTL4GTEOE33jQMWy9PwelL+yQ== +"@typescript-eslint/experimental-utils@2.34.0": + version "2.34.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-2.34.0.tgz#d3524b644cdb40eebceca67f8cf3e4cc9c8f980f" + integrity sha512-eS6FTkq+wuMJ+sgtuNTtcqavWXqsflWcfBnlYhg/nS4aZ1leewkXGbvBhaapn1q6qf4M71bsR1tez5JTRMuqwA== + dependencies: + "@types/json-schema" "^7.0.3" + "@typescript-eslint/typescript-estree" "2.34.0" + eslint-scope "^5.0.0" + eslint-utils "^2.0.0" + +"@typescript-eslint/experimental-utils@3.2.0": + version "3.2.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-3.2.0.tgz#4dab8fc9f44f059ec073470a81bb4d7d7d51e6c5" + integrity sha512-UbJBsk+xO9dIFKtj16+m42EvUvsjZbbgQ2O5xSTSfVT1Z3yGkL90DVu0Hd3029FZ5/uBgl+F3Vo8FAcEcqc6aQ== dependencies: "@types/json-schema" "^7.0.3" - "@typescript-eslint/typescript-estree" "2.10.0" + "@typescript-eslint/typescript-estree" "3.2.0" eslint-scope "^5.0.0" + eslint-utils "^2.0.0" "@typescript-eslint/experimental-utils@^2.5.0": version "2.9.0" @@ -5240,27 +5251,37 @@ "@typescript-eslint/typescript-estree" "2.9.0" eslint-scope "^5.0.0" -"@typescript-eslint/parser@^2.10.0": - version "2.10.0" - resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-2.10.0.tgz#24b2e48384ab6d5a6121e4c4faf8892c79657ad3" - integrity sha512-wQNiBokcP5ZsTuB+i4BlmVWq6o+oAhd8en2eSm/EE9m7BgZUIfEeYFd6z3S+T7bgNuloeiHA1/cevvbBDLr98g== +"@typescript-eslint/parser@^2.24.0": + version "2.34.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-2.34.0.tgz#50252630ca319685420e9a39ca05fe185a256bc8" + integrity sha512-03ilO0ucSD0EPTw2X4PntSIRFtDPWjrVq7C3/Z3VQHRC7+13YB55rcJI3Jt+YgeHbjUdJPcPa7b23rXCBokuyA== dependencies: "@types/eslint-visitor-keys" "^1.0.0" - "@typescript-eslint/experimental-utils" "2.10.0" - "@typescript-eslint/typescript-estree" "2.10.0" + "@typescript-eslint/experimental-utils" "2.34.0" + "@typescript-eslint/typescript-estree" "2.34.0" eslint-visitor-keys "^1.1.0" -"@typescript-eslint/typescript-estree@2.10.0": - version "2.10.0" - resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-2.10.0.tgz#89cdabd5e8c774e9d590588cb42fb9afd14dcbd9" - integrity sha512-oOYnplddQNm/LGVkqbkAwx4TIBuuZ36cAQq9v3nFIU9FmhemHuVzAesMSXNQDdAzCa5bFgCrfD3JWhYVKlRN2g== +"@typescript-eslint/parser@^3.0.2": + version "3.2.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-3.2.0.tgz#d9d7867456b1b8ecae9e724269b0bc932f06cbca" + integrity sha512-Vhu+wwdevDLVDjK1lIcoD6ZbuOa93fzqszkaO3iCnmrScmKwyW/AGkzc2UvfE5TCoCXqq7Jyt6SOXjsIlpqF4A== + dependencies: + "@types/eslint-visitor-keys" "^1.0.0" + "@typescript-eslint/experimental-utils" "3.2.0" + "@typescript-eslint/typescript-estree" "3.2.0" + eslint-visitor-keys "^1.1.0" + +"@typescript-eslint/typescript-estree@2.34.0": + version "2.34.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-2.34.0.tgz#14aeb6353b39ef0732cc7f1b8285294937cf37d5" + integrity sha512-OMAr+nJWKdlVM9LOqCqh3pQQPwxHAN7Du8DR6dmwCrAmxtiXQnhHJ6tBNtf+cggqfo51SG/FCwnKhXCIM7hnVg== dependencies: debug "^4.1.1" eslint-visitor-keys "^1.1.0" glob "^7.1.6" is-glob "^4.0.1" - lodash.unescape "4.0.1" - semver "^6.3.0" + lodash "^4.17.15" + semver "^7.3.2" tsutils "^3.17.1" "@typescript-eslint/typescript-estree@2.9.0": @@ -5276,6 +5297,19 @@ semver "^6.3.0" tsutils "^3.17.1" +"@typescript-eslint/typescript-estree@3.2.0": + version "3.2.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-3.2.0.tgz#c735f1ca6b4d3cd671f30de8c9bde30843e7ead8" + integrity sha512-uh+Y2QO7dxNrdLw7mVnjUqkwO/InxEqwN0wF+Za6eo3coxls9aH9kQ/5rSvW2GcNanebRTmsT5w1/92lAOb1bA== + dependencies: + debug "^4.1.1" + eslint-visitor-keys "^1.1.0" + glob "^7.1.6" + is-glob "^4.0.1" + lodash "^4.17.15" + semver "^7.3.2" + tsutils "^3.17.1" + "@webassemblyjs/ast@1.8.5": version "1.8.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.8.5.tgz#51b1c5fe6576a34953bf4b253df9f0d490d9e359" @@ -5530,10 +5564,10 @@ acorn@^7.1.0: resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.1.0.tgz#949d36f2c292535da602283586c2477c57eb2d6c" integrity sha512-kL5CuoXA/dgxlBbVrflsflzQ3PAas7RYZB52NOm/6839iVYJgKMJ3cQJD+t2i5+qFa8h3MDpEOJiS64E8JLnSQ== -acorn@^7.1.1: - version "7.1.1" - resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.1.1.tgz#e35668de0b402f359de515c5482a1ab9f89a69bf" - integrity sha512-add7dgA5ppRPxCFJoAGfMDi7PIBXq1RtGo7BhbLaxwrXPOmw8gq48Y9ozT01hUKy9byMjlR20EJhu5zlkErEkg== +acorn@^7.2.0: + version "7.2.0" + resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.2.0.tgz#17ea7e40d7c8640ff54a694c889c26f31704effe" + integrity sha512-apwXVmYVpQ34m/i71vrApRrRKCWQnZZF1+npOD0WV5xZFfwWOmKGQ2RWlfdy9vWITsenisM8M0Qeq8agcFHNiQ== address@1.1.2, address@^1.0.1: version "1.1.2" @@ -5676,7 +5710,7 @@ ansi-align@^3.0.0: dependencies: string-width "^3.0.0" -ansi-colors@^3.0.0: +ansi-colors@^3.0.0, ansi-colors@^3.2.1: version "3.2.4" resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-3.2.4.tgz#e3a3da4bfbae6c86a9c285625de124a234026fbf" integrity sha512-hHUXGagefjN2iRrID63xckIvotOXOojhQKWIPUZ4mNUZ9nLZW+7FMNoE1lOkEhNWYsx/7ysGIuJYCiMAA9FnrA== @@ -5693,6 +5727,13 @@ ansi-escapes@^4.2.1: dependencies: type-fest "^0.8.1" +ansi-escapes@^4.3.0: + version "4.3.1" + resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-4.3.1.tgz#a5c47cc43181f1f38ffd7076837700d395522a61" + integrity sha512-JWF7ocqNrp8u9oqpgV+wH5ftbt+cfvv+PTjOvKLT3AdYly/LmORARfEVT1iyjwN+4MqE5UmVKoAdIBqeoCHgLA== + dependencies: + type-fest "^0.11.0" + ansi-html@0.0.7: version "0.0.7" resolved "https://registry.yarnpkg.com/ansi-html/-/ansi-html-0.0.7.tgz#813584021962a9e9e6fd039f940d12f56ca7859e" @@ -5819,6 +5860,14 @@ argv-formatter@~1.0.0: resolved "https://registry.yarnpkg.com/argv-formatter/-/argv-formatter-1.0.0.tgz#a0ca0cbc29a5b73e836eebe1cbf6c5e0e4eb82f9" integrity sha1-oMoMvCmltz6Dbuvhy/bF4OTrgvk= +aria-query@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-3.0.0.tgz#65b3fcc1ca1155a8c9ae64d6eee297f15d5133cc" + integrity sha1-ZbP8wcoRVajJrmTW7uKX8V1RM8w= + dependencies: + ast-types-flow "0.0.7" + commander "^2.11.0" + arr-diff@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-4.0.0.tgz#d6461074febfec71e7e15235761a329a5dc7c520" @@ -5993,6 +6042,11 @@ assign-symbols@^1.0.0: resolved "https://registry.yarnpkg.com/assign-symbols/-/assign-symbols-1.0.0.tgz#59667f41fadd4f20ccbc2bb96b8d4f7f78ec0367" integrity sha1-WWZ/QfrdTyDMvCu5a41Pf3jsA2c= +ast-types-flow@0.0.7, ast-types-flow@^0.0.7: + version "0.0.7" + resolved "https://registry.yarnpkg.com/ast-types-flow/-/ast-types-flow-0.0.7.tgz#f70b735c6bca1a5c9c22d982c3e39e7feba3bdad" + integrity sha1-9wtzXGvKGlycItmCw+Oef+ujva0= + ast-types@0.11.3: version "0.11.3" resolved "https://registry.yarnpkg.com/ast-types/-/ast-types-0.11.3.tgz#c20757fe72ee71278ea0ff3d87e5c2ca30d9edf8" @@ -6018,6 +6072,11 @@ astral-regex@^1.0.0: resolved "https://registry.yarnpkg.com/astral-regex/-/astral-regex-1.0.0.tgz#6c8c3fb827dd43ee3918f27b82782ab7658a6fd9" integrity sha512-+Ryf6g3BKoRc7jfp7ad8tM4TtMiaWvbF/1/sQcZPkkS7ag3D5nMBCe2UfOTONtAkaG0tO0ij3C5Lwmf1EiyjHg== +astral-regex@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/astral-regex/-/astral-regex-2.0.0.tgz#483143c567aeed4785759c0865786dc77d7d2e31" + integrity sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ== + async-each@^1.0.1: version "1.0.3" resolved "https://registry.yarnpkg.com/async-each/-/async-each-1.0.3.tgz#b727dbf87d7651602f06f4d4ac387f47d91b0cbf" @@ -6098,6 +6157,11 @@ axios@^0.19.0: dependencies: follow-redirects "1.5.10" +axobject-query@^2.0.2: + version "2.1.2" + resolved "https://registry.yarnpkg.com/axobject-query/-/axobject-query-2.1.2.tgz#2bdffc0371e643e5f03ba99065d5179b9ca79799" + integrity sha512-ICt34ZmrVt8UQnvPl6TVyDTkmhXmAyAT4Jh5ugfGUX4MOrZ+U/ZY6/sdylRw3qGNr9Ub5AJsaHeDMzNLehRdOQ== + babel-code-frame@^6.22.0: version "6.26.0" resolved "https://registry.yarnpkg.com/babel-code-frame/-/babel-code-frame-6.26.0.tgz#63fd43f7dc1e3bb7ce35947db8fe369a3f58c74b" @@ -7189,6 +7253,14 @@ chalk@^3.0.0: ansi-styles "^4.1.0" supports-color "^7.1.0" +chalk@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.0.0.tgz#6e98081ed2d17faab615eb52ac66ec1fe6209e72" + integrity sha512-N9oWFcegS0sFr9oh1oz2d7Npos6vNoWW9HvtCg5N1KRFpUhaAhvTv5Y58g880fZaEYSNm3qDz8SU1UrGvp+n7A== + dependencies: + ansi-styles "^4.1.0" + supports-color "^7.1.0" + character-entities-html4@^1.0.0: version "1.1.3" resolved "https://registry.yarnpkg.com/character-entities-html4/-/character-entities-html4-1.1.3.tgz#5ce6e01618e47048ac22f34f7f39db5c6fd679ef" @@ -7396,6 +7468,14 @@ cli-table@^0.3.1: dependencies: colors "1.0.3" +cli-truncate@2.1.0, cli-truncate@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/cli-truncate/-/cli-truncate-2.1.0.tgz#c39e28bf05edcde5be3b98992a22deed5a2b93c7" + integrity sha512-n8fOixwDD6b/ObinzTrp1ZKFzbgvKZvuz/TvejnLn1aQfC6r52XEx85FmuC+3HI+JM7coBRXUvNqEU2PHVrHpg== + dependencies: + slice-ansi "^3.0.0" + string-width "^4.2.0" + cli-width@^2.0.0: version "2.2.0" resolved "https://registry.yarnpkg.com/cli-width/-/cli-width-2.2.0.tgz#ff19ede8a9a5e579324147b0c11f0fbcbabed639" @@ -7648,6 +7728,11 @@ commander@^3.0.2: resolved "https://registry.yarnpkg.com/commander/-/commander-3.0.2.tgz#6837c3fb677ad9933d1cfba42dd14d5117d6b39e" integrity sha512-Gar0ASD4BDyKC4hl4DwHqDrmvjoxWKZigVnAbn5H1owvm4CxCPdb0HQDehwNYMJpla5+M2tPmPARzhtYuwpHow== +commander@^5.1.0: + version "5.1.0" + resolved "https://registry.yarnpkg.com/commander/-/commander-5.1.0.tgz#46abbd1652f8e059bddaef99bbdcb2ad9cf179ae" + integrity sha512-P0CysNDQ7rtVw4QIQtm+MRxV66vKFSvlsQvGYXZWR3qFU0jlMKHZZZgw8e+8DSah4UDKMqnknRDQz+xuQXQ/Zg== + commitizen@^4.0.3: version "4.0.3" resolved "https://registry.yarnpkg.com/commitizen/-/commitizen-4.0.3.tgz#c19a4213257d0525b85139e2f36db7cc3b4f6dae" @@ -7762,6 +7847,11 @@ configstore@^3.0.0: write-file-atomic "^2.0.0" xdg-basedir "^3.0.0" +confusing-browser-globals@^1.0.9: + version "1.0.9" + resolved "https://registry.yarnpkg.com/confusing-browser-globals/-/confusing-browser-globals-1.0.9.tgz#72bc13b483c0276801681871d4898516f8f54fdd" + integrity sha512-KbS1Y0jMtyPgIxjO7ZzMAuUpAKMt1SzCL9fsrKsX6b0zJPTaT0SiSPmewwVZg9UAO83HVIlEhZF84LIjZ0lmAw== + connect-history-api-fallback@^1.6.0: version "1.6.0" resolved "https://registry.yarnpkg.com/connect-history-api-fallback/-/connect-history-api-fallback-1.6.0.tgz#8b32089359308d111115d81cad3fceab888f97bc" @@ -8082,7 +8172,7 @@ cross-env@^6.0.3: dependencies: cross-spawn "^7.0.0" -cross-spawn@6.0.5, cross-spawn@^6.0.0, cross-spawn@^6.0.5: +cross-spawn@6.0.5, cross-spawn@^6.0.0: version "6.0.5" resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-6.0.5.tgz#4a5ec7c64dfae22c3a14124dbacdee846d80cbc4" integrity sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ== @@ -8119,6 +8209,15 @@ cross-spawn@^7.0.0: shebang-command "^2.0.0" which "^2.0.1" +cross-spawn@^7.0.2: + version "7.0.3" + resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6" + integrity sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w== + dependencies: + path-key "^3.1.0" + shebang-command "^2.0.0" + which "^2.0.1" + crypto-browserify@^3.11.0: version "3.12.0" resolved "https://registry.yarnpkg.com/crypto-browserify/-/crypto-browserify-3.12.0.tgz#396cf9f3137f03e4b8e532c58f698254e00f80ec" @@ -8391,6 +8490,11 @@ d@1, d@^1.0.1: es5-ext "^0.10.50" type "^1.0.1" +damerau-levenshtein@^1.0.4: + version "1.0.6" + resolved "https://registry.yarnpkg.com/damerau-levenshtein/-/damerau-levenshtein-1.0.6.tgz#143c1641cb3d85c60c32329e26899adea8701791" + integrity sha512-JVrozIeElnj3QzfUIt8tB8YMluBJom4Vw9qTPpjGYQ9fYlB3D/rb6OordUxf3xeFB35LKWs0xqcO5U6ySvBtug== + dargs@^4.0.1: version "4.1.0" resolved "https://registry.yarnpkg.com/dargs/-/dargs-4.1.0.tgz#03a9dbb4b5c2f139bf14ae53f0b8a2a6a86f4e17" @@ -8489,7 +8593,7 @@ decompress-response@^4.2.0: dependencies: mimic-response "^2.0.0" -dedent@0.7.0: +dedent@0.7.0, dedent@^0.7.0: version "0.7.0" resolved "https://registry.yarnpkg.com/dedent/-/dedent-0.7.0.tgz#2495ddbaf6eb874abb0e1be9df22d2e5a544326c" integrity sha1-JJXduvbrh0q7Dhvp3yLS5aVEMmw= @@ -9056,7 +9160,7 @@ elliptic@^6.0.0: resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-6.1.1.tgz#c6cd0ec1b0642e2a3c67a1137efc5e796da4f88e" integrity sha1-xs0OwbBkLio8Z6ETfvxeeW2k+I4= -emoji-regex@^7.0.1: +emoji-regex@^7.0.1, emoji-regex@^7.0.2: version "7.0.3" resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-7.0.3.tgz#933a04052860c85e83c122479c4748a8e4c72156" integrity sha512-CwBLREIQ7LvYFB0WyRvwhq5N5qPhc6PMjD6bYggFlI5YyDgl+0vxq5VHbMOFqLg7hfWzmu8T5Z1QofhmTIhItA== @@ -9133,6 +9237,13 @@ enhanced-resolve@^4.0.0, enhanced-resolve@^4.1.0: memory-fs "^0.5.0" tapable "^1.0.0" +enquirer@^2.3.5: + version "2.3.5" + resolved "https://registry.yarnpkg.com/enquirer/-/enquirer-2.3.5.tgz#3ab2b838df0a9d8ab9e7dff235b0e8712ef92381" + integrity sha512-BNT1C08P9XD0vNg3J475yIUG+mVdp9T6towYFHUv897X0KoHBjB1shyrNmhmtHWKP17iSWgo7Gqh7BBuzLZMSA== + dependencies: + ansi-colors "^3.2.1" + entities@^1.1.1, entities@^1.1.2, entities@~1.1.1: version "1.1.2" resolved "https://registry.yarnpkg.com/entities/-/entities-1.1.2.tgz#bdfa735299664dfafd34529ed4f8522a275fea56" @@ -9420,6 +9531,33 @@ eslint-ast-utils@^1.1.0: lodash.get "^4.4.2" lodash.zip "^4.2.0" +eslint-config-airbnb-base@^14.1.0: + version "14.1.0" + resolved "https://registry.yarnpkg.com/eslint-config-airbnb-base/-/eslint-config-airbnb-base-14.1.0.tgz#2ba4592dd6843258221d9bff2b6831bd77c874e4" + integrity sha512-+XCcfGyCnbzOnktDVhwsCAx+9DmrzEmuwxyHUJpw+kqBVT744OUBrB09khgFKlK1lshVww6qXGsYPZpavoNjJw== + dependencies: + confusing-browser-globals "^1.0.9" + object.assign "^4.1.0" + object.entries "^1.1.1" + +eslint-config-airbnb-typescript@^7.2.1: + version "7.2.1" + resolved "https://registry.yarnpkg.com/eslint-config-airbnb-typescript/-/eslint-config-airbnb-typescript-7.2.1.tgz#bce3f02fa894d1ec2f31ac527992e03761a9b7d4" + integrity sha512-D3elVKUbdsCfkOVstSyWuiu+KGCVTrYxJPoenPIqZtL6Li/R4xBeVTXjZIui8B8D17bDN3Pz5dSr7jRLY5HqIg== + dependencies: + "@typescript-eslint/parser" "^2.24.0" + eslint-config-airbnb "^18.1.0" + eslint-config-airbnb-base "^14.1.0" + +eslint-config-airbnb@^18.1.0: + version "18.1.0" + resolved "https://registry.yarnpkg.com/eslint-config-airbnb/-/eslint-config-airbnb-18.1.0.tgz#724d7e93dadd2169492ff5363c5aaa779e01257d" + integrity sha512-kZFuQC/MPnH7KJp6v95xsLBf63G/w7YqdPfQ0MUanxQ7zcKUNG8j+sSY860g3NwCBOa62apw16J6pRN+AOgXzw== + dependencies: + eslint-config-airbnb-base "^14.1.0" + object.assign "^4.1.0" + object.entries "^1.1.1" + eslint-config-prettier@^6.9.0: version "6.9.0" resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-6.9.0.tgz#430d24822e82f7deb1e22a435bfa3999fae4ad64" @@ -9443,11 +9581,24 @@ eslint-module-utils@^2.4.1: debug "^2.6.9" pkg-dir "^2.0.0" +eslint-plugin-eslint-comments@^3.2.0: + version "3.2.0" + resolved "https://registry.yarnpkg.com/eslint-plugin-eslint-comments/-/eslint-plugin-eslint-comments-3.2.0.tgz#9e1cd7b4413526abb313933071d7aba05ca12ffa" + integrity sha512-0jkOl0hfojIHHmEHgmNdqv4fmh7300NdpA9FFpF7zaoLvB/QeXOGNLIo86oAveJFrfB1p05kC8hpEMHM8DwWVQ== + dependencies: + escape-string-regexp "^1.0.5" + ignore "^5.0.5" + eslint-plugin-file-header@^0.0.1: version "0.0.1" resolved "https://registry.yarnpkg.com/eslint-plugin-file-header/-/eslint-plugin-file-header-0.0.1.tgz#8de79de79c9ab35ac212db8e977e5003803b8bfb" integrity sha512-Xe7veqG+8s99Msd/bFm6YDBnKaufgd/oE+uOXQqpadLGZSrb3t+iW5n7c2rcBfgZ9oGjhuXIL3IsH3a+U8oVNQ== +eslint-plugin-header@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/eslint-plugin-header/-/eslint-plugin-header-3.0.0.tgz#0e048b5f0adfdd9754142d59d551ae6bfdaf90ad" + integrity sha512-OIu2ciVW8jK4Ove4JHm1I7X0C98PZuLCyCsoUhAm2HpyGS+zr34qLM6iV06unnDvssvvEh5BkOfaLRF+N7cGoQ== + eslint-plugin-import@^2.20.2: version "2.20.2" resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.20.2.tgz#91fc3807ce08be4837141272c8b99073906e588d" @@ -9473,6 +9624,21 @@ eslint-plugin-jest@^23.0.4: dependencies: "@typescript-eslint/experimental-utils" "^2.5.0" +eslint-plugin-jsx-a11y@^6.2.3: + version "6.2.3" + resolved "https://registry.yarnpkg.com/eslint-plugin-jsx-a11y/-/eslint-plugin-jsx-a11y-6.2.3.tgz#b872a09d5de51af70a97db1eea7dc933043708aa" + integrity sha512-CawzfGt9w83tyuVekn0GDPU9ytYtxyxyFZ3aSWROmnRRFQFT2BiPJd7jvRdzNDi6oLWaS2asMeYSNMjWTV4eNg== + dependencies: + "@babel/runtime" "^7.4.5" + aria-query "^3.0.0" + array-includes "^3.0.3" + ast-types-flow "^0.0.7" + axobject-query "^2.0.2" + damerau-levenshtein "^1.0.4" + emoji-regex "^7.0.2" + has "^1.0.3" + jsx-ast-utils "^2.2.1" + eslint-plugin-prettier@^3.1.2: version "3.1.2" resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-3.1.2.tgz#432e5a667666ab84ce72f945c72f77d996a5c9ba" @@ -9480,6 +9646,11 @@ eslint-plugin-prettier@^3.1.2: dependencies: prettier-linter-helpers "^1.0.0" +eslint-plugin-promise@^4.2.1: + version "4.2.1" + resolved "https://registry.yarnpkg.com/eslint-plugin-promise/-/eslint-plugin-promise-4.2.1.tgz#845fd8b2260ad8f82564c1222fce44ad71d9418a" + integrity sha512-VoM09vT7bfA7D+upt+FjeBO5eHIJQBUWki1aPvB+vbNiHS3+oGIJGIeyBtKQTME6UPXXy3vV07OL1tHd3ANuDw== + eslint-plugin-react-hooks@^4.0.3: version "4.0.3" resolved "https://registry.yarnpkg.com/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.0.3.tgz#031e4bdc1e60cc3b04cc7d2dfc08773d5c0a2bec" @@ -9503,22 +9674,24 @@ eslint-plugin-react@^7.19.0: string.prototype.matchall "^4.0.2" xregexp "^4.3.0" -eslint-plugin-unicorn@^17.2.0: - version "17.2.0" - resolved "https://registry.yarnpkg.com/eslint-plugin-unicorn/-/eslint-plugin-unicorn-17.2.0.tgz#8f147ba24d417dc5de948c7df7d006108a37a540" - integrity sha512-0kYjrywf0kQxevFz571KrDfYMIRZ5Kq6dDgPU1EEBFeC181r+fAaPatBScWX+/hisKJ4+eCRFebxTeVylsSYmw== +eslint-plugin-unicorn@^20.1.0: + version "20.1.0" + resolved "https://registry.yarnpkg.com/eslint-plugin-unicorn/-/eslint-plugin-unicorn-20.1.0.tgz#a43f60ffc98406d72ec2a5fcc6dad24ba0192bc9" + integrity sha512-XQxLBJT/gnwyRR6cfYsIK1AdekQchAt5tmcsnldevGjgR2xoZsRUa5/i6e0seNHy2RoT57CkTnbVHwHF8No8LA== dependencies: ci-info "^2.0.0" clean-regexp "^1.0.0" eslint-ast-utils "^1.1.0" - eslint-template-visitor "^1.1.0" + eslint-template-visitor "^2.0.0" + eslint-utils "^2.0.0" import-modules "^2.0.0" lodash "^4.17.15" + pluralize "^8.0.0" read-pkg-up "^7.0.1" - regexp-tree "^0.1.20" + regexp-tree "^0.1.21" reserved-words "^0.1.2" safe-regex "^2.1.1" - semver "^7.1.2" + semver "^7.3.2" eslint-scope@^4.0.3: version "4.0.3" @@ -9536,19 +9709,27 @@ eslint-scope@^5.0.0: esrecurse "^4.1.0" estraverse "^4.1.1" -eslint-template-visitor@^1.1.0: - version "1.1.0" - resolved "https://registry.yarnpkg.com/eslint-template-visitor/-/eslint-template-visitor-1.1.0.tgz#f090d124d1a52e05552149fc50468ed59608b166" - integrity sha512-Lmy6QVlmFiIGl5fPi+8ACnov3sare+0Ouf7deJAGGhmUfeWJ5fVarELUxZRpsZ9sHejiJUq8626d0dn9uvcZTw== +eslint-scope@^5.1.0: + version "5.1.0" + resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-5.1.0.tgz#d0f971dfe59c69e0cada684b23d49dbf82600ce5" + integrity sha512-iiGRvtxWqgtx5m8EyQUJihBloE4EnYeGE/bz1wSPwJE6tZuJUtHlhqDM4Xj2ukE8Dyy1+HCZ4hE0fzIVMzb58w== + dependencies: + esrecurse "^4.1.0" + estraverse "^4.1.1" + +eslint-template-visitor@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/eslint-template-visitor/-/eslint-template-visitor-2.0.0.tgz#7cb6471ed29a53ab28a1dcbfca38355251c2be06" + integrity sha512-WijrLXWk/TiiG9FBTeEeb2pj/nD8H4eKIYx1DhTv/c7QoFmelE5P+3gzKUcXWZz88AI2+Wjse9DTV8lXrhcUsw== dependencies: eslint-visitor-keys "^1.1.0" - espree "^6.1.1" - multimap "^1.0.2" + espree "^7.0.0" + multimap "^1.1.0" -eslint-utils@^1.4.3: - version "1.4.3" - resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-1.4.3.tgz#74fec7c54d0776b6f67e0251040b5806564e981f" - integrity sha512-fbBN5W2xdY45KulGXmLHZ3c3FHfVYmKg0IrAKGOkT/464PQsx2UeIzfz1RmEci+KLm1bBaAzZAh8+/E+XAeZ8Q== +eslint-utils@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-2.0.0.tgz#7be1cc70f27a72a76cd14aa698bcabed6890e1cd" + integrity sha512-0HCPuJv+7Wv1bACm8y5/ECVfYdfsAm9xmVb7saeFlxjPYALefjhbYoCkBjPdPzGH8wWyTpAez82Fh3VKYEZ8OA== dependencies: eslint-visitor-keys "^1.1.0" @@ -9557,22 +9738,27 @@ eslint-visitor-keys@^1.1.0: resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.1.0.tgz#e2a82cea84ff246ad6fb57f9bde5b46621459ec2" integrity sha512-8y9YjtM1JBJU/A9Kc+SbaOV4y29sSWckBwMHa+FGtVj5gN/sbnKDf6xJUl+8g7FAij9LVaP8C24DUiH/f/2Z9A== -eslint@^6.8.0: - version "6.8.0" - resolved "https://registry.yarnpkg.com/eslint/-/eslint-6.8.0.tgz#62262d6729739f9275723824302fb227c8c93ffb" - integrity sha512-K+Iayyo2LtyYhDSYwz5D5QdWw0hCacNzyq1Y821Xna2xSJj7cijoLLYmLxTQgcgZ9mC61nryMy9S7GRbYpI5Ig== +eslint-visitor-keys@^1.2.0: + version "1.2.0" + resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.2.0.tgz#74415ac884874495f78ec2a97349525344c981fa" + integrity sha512-WFb4ihckKil6hu3Dp798xdzSfddwKKU3+nGniKF6HfeW6OLd2OUDEPP7TcHtB5+QXOKg2s6B2DaMPE1Nn/kxKQ== + +eslint@^7.1.0: + version "7.2.0" + resolved "https://registry.yarnpkg.com/eslint/-/eslint-7.2.0.tgz#d41b2e47804b30dbabb093a967fb283d560082e6" + integrity sha512-B3BtEyaDKC5MlfDa2Ha8/D6DsS4fju95zs0hjS3HdGazw+LNayai38A25qMppK37wWGWNYSPOR6oYzlz5MHsRQ== dependencies: "@babel/code-frame" "^7.0.0" ajv "^6.10.0" - chalk "^2.1.0" - cross-spawn "^6.0.5" + chalk "^4.0.0" + cross-spawn "^7.0.2" debug "^4.0.1" doctrine "^3.0.0" - eslint-scope "^5.0.0" - eslint-utils "^1.4.3" - eslint-visitor-keys "^1.1.0" - espree "^6.1.2" - esquery "^1.0.1" + eslint-scope "^5.1.0" + eslint-utils "^2.0.0" + eslint-visitor-keys "^1.2.0" + espree "^7.1.0" + esquery "^1.2.0" esutils "^2.0.2" file-entry-cache "^5.0.1" functional-red-black-tree "^1.0.1" @@ -9585,38 +9771,28 @@ eslint@^6.8.0: is-glob "^4.0.0" js-yaml "^3.13.1" json-stable-stringify-without-jsonify "^1.0.1" - levn "^0.3.0" + levn "^0.4.1" lodash "^4.17.14" minimatch "^3.0.4" - mkdirp "^0.5.1" natural-compare "^1.4.0" - optionator "^0.8.3" + optionator "^0.9.1" progress "^2.0.0" - regexpp "^2.0.1" - semver "^6.1.2" - strip-ansi "^5.2.0" - strip-json-comments "^3.0.1" + regexpp "^3.1.0" + semver "^7.2.1" + strip-ansi "^6.0.0" + strip-json-comments "^3.1.0" table "^5.2.3" text-table "^0.2.0" v8-compile-cache "^2.0.3" -espree@^6.1.1: - version "6.2.1" - resolved "https://registry.yarnpkg.com/espree/-/espree-6.2.1.tgz#77fc72e1fd744a2052c20f38a5b575832e82734a" - integrity sha512-ysCxRQY3WaXJz9tdbWOwuWr5Y/XrPTGX9Kiz3yoUXwW0VZ4w30HTkQLaGx/+ttFjF8i+ACbArnB4ce68a9m5hw== +espree@^7.0.0, espree@^7.1.0: + version "7.1.0" + resolved "https://registry.yarnpkg.com/espree/-/espree-7.1.0.tgz#a9c7f18a752056735bf1ba14cb1b70adc3a5ce1c" + integrity sha512-dcorZSyfmm4WTuTnE5Y7MEN1DyoPYy1ZR783QW1FJoenn7RailyWFsq/UL6ZAAA7uXurN9FIpYyUs3OfiIW+Qw== dependencies: - acorn "^7.1.1" + acorn "^7.2.0" acorn-jsx "^5.2.0" - eslint-visitor-keys "^1.1.0" - -espree@^6.1.2: - version "6.1.2" - resolved "https://registry.yarnpkg.com/espree/-/espree-6.1.2.tgz#6c272650932b4f91c3714e5e7b5f5e2ecf47262d" - integrity sha512-2iUPuuPP+yW1PZaMSDM9eyVf8D5P0Hi8h83YtZ5bPc/zHYjII5khoixIUTMO794NOY8F/ThF1Bo8ncZILarUTA== - dependencies: - acorn "^7.1.0" - acorn-jsx "^5.1.0" - eslint-visitor-keys "^1.1.0" + eslint-visitor-keys "^1.2.0" esprima-fb@^15001.1.0-dev-harmony-fb: version "15001.1.0-dev-harmony-fb" @@ -9633,12 +9809,12 @@ esprima@^4.0.0, esprima@^4.0.1, esprima@~4.0.0: resolved "https://registry.yarnpkg.com/esprima/-/esprima-4.0.1.tgz#13b04cdb3e6c5d19df91ab6987a8695619b0aa71" integrity sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A== -esquery@^1.0.1: - version "1.0.1" - resolved "https://registry.yarnpkg.com/esquery/-/esquery-1.0.1.tgz#406c51658b1f5991a5f9b62b1dc25b00e3e5c708" - integrity sha512-SmiyZ5zIWH9VM+SRUReLS5Q8a7GxtRdxEBVZpm98rJM7Sb+A9DVCndXfkeFUd3byderg+EbDkfnevfCwynWaNA== +esquery@^1.2.0: + version "1.3.1" + resolved "https://registry.yarnpkg.com/esquery/-/esquery-1.3.1.tgz#b78b5828aa8e214e29fb74c4d5b752e1c033da57" + integrity sha512-olpvt9QG0vniUBZspVRN6lwB7hOZoTRtT+jzR+tS4ffYx2mzbw+z0XCOk44aaLYKApNX5nMm+E+P6o25ip/DHQ== dependencies: - estraverse "^4.0.0" + estraverse "^5.1.0" esrecurse@^4.1.0: version "4.2.1" @@ -9647,11 +9823,16 @@ esrecurse@^4.1.0: dependencies: estraverse "^4.1.0" -estraverse@^4.0.0, estraverse@^4.1.0, estraverse@^4.1.1, estraverse@^4.2.0: +estraverse@^4.1.0, estraverse@^4.1.1, estraverse@^4.2.0: version "4.3.0" resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-4.3.0.tgz#398ad3f3c5a24948be7725e83d11a7de28cdbd1d" integrity sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw== +estraverse@^5.1.0: + version "5.1.0" + resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-5.1.0.tgz#374309d39fd935ae500e7b92e8a6b4c720e59642" + integrity sha512-FyohXK+R0vE+y1nHLoBM7ZTyqRpqAlhdZHCWIWEviFLiGB8b04H6bQs8G+XTthacvT8VuwvteiP7RJSxMs8UEw== + esutils@^2.0.0, esutils@^2.0.2: version "2.0.3" resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.3.tgz#74d2eb4de0b8da1293711910d50775b9b710ef64" @@ -9764,6 +9945,21 @@ execa@^4.0.0: signal-exit "^3.0.2" strip-final-newline "^2.0.0" +execa@^4.0.1: + version "4.0.2" + resolved "https://registry.yarnpkg.com/execa/-/execa-4.0.2.tgz#ad87fb7b2d9d564f70d2b62d511bee41d5cbb240" + integrity sha512-QI2zLa6CjGWdiQsmSkZoGtDx2N+cQIGb3yNolGTdjSQzydzLgYYf8LRuagp7S7fPimjcrzUDSUFd/MgzELMi4Q== + dependencies: + cross-spawn "^7.0.0" + get-stream "^5.0.0" + human-signals "^1.1.1" + is-stream "^2.0.0" + merge-stream "^2.0.0" + npm-run-path "^4.0.0" + onetime "^5.1.0" + signal-exit "^3.0.2" + strip-final-newline "^2.0.0" + exit@^0.1.2: version "0.1.2" resolved "https://registry.yarnpkg.com/exit/-/exit-0.1.2.tgz#0632638f8d877cc82107d30a0fff1a17cba1cd0c" @@ -9972,7 +10168,7 @@ fast-json-stable-stringify@^2.0.0: resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz#874bf69c6f404c2b5d99c481341399fd55892633" integrity sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw== -fast-levenshtein@~2.0.4, fast-levenshtein@~2.0.6: +fast-levenshtein@^2.0.6, fast-levenshtein@~2.0.4: version "2.0.6" resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz#3d8a5c66883a16a30ca8643e851f19baa7797917" integrity sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc= @@ -10072,6 +10268,13 @@ figures@^3.0.0: dependencies: escape-string-regexp "^1.0.5" +figures@^3.2.0: + version "3.2.0" + resolved "https://registry.yarnpkg.com/figures/-/figures-3.2.0.tgz#625c18bd293c604dc4a8ddb2febf0c88341746af" + integrity sha512-yaduQFRKLXYOGgEn6AZau90j3ggSOyiqXU0F9JZfeXYhNa+Jk4X+s45A2zg5jns87GAFa34BBm2kXw4XpNcbdg== + dependencies: + escape-string-regexp "^1.0.5" + file-entry-cache@^5.0.1: version "5.0.1" resolved "https://registry.yarnpkg.com/file-entry-cache/-/file-entry-cache-5.0.1.tgz#ca0f6efa6dd3d561333fb14515065c2fafdf439c" @@ -10565,6 +10768,11 @@ get-caller-file@^2.0.1: resolved "https://registry.yarnpkg.com/get-caller-file/-/get-caller-file-2.0.5.tgz#4f94412a82db32f36e3b0b9741f8a97feb031f7e" integrity sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg== +get-own-enumerable-property-symbols@^3.0.0: + version "3.0.2" + resolved "https://registry.yarnpkg.com/get-own-enumerable-property-symbols/-/get-own-enumerable-property-symbols-3.0.2.tgz#b5fde77f22cbe35f390b4e089922c50bce6ef664" + integrity sha512-I0UBV/XOz1XkIJHEUDMZAbzCThU/H8DxmSfmdGcKPnVhu2VfFqr34jr9777IyaTYvxjedWhqVIilEDsCdP5G6g== + get-stdin@7.0.0, get-stdin@^7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/get-stdin/-/get-stdin-7.0.0.tgz#8d5de98f15171a125c5e516643c7a6d0ea8a96f6" @@ -11471,6 +11679,11 @@ ignore@^4.0.3, ignore@^4.0.6: resolved "https://registry.yarnpkg.com/ignore/-/ignore-4.0.6.tgz#750e3db5862087b4737ebac8207ffd1ef27b25fc" integrity sha512-cyFDKrqc/YdcWFniJhzI42+AzS+gNwmUzOSFcRCQYwySuBBBy/KjuxWLZ/FHEH6Moq1NizMOBWyTcv8O4OZIMg== +ignore@^5.0.5: + version "5.1.8" + resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.1.8.tgz#f150a8b50a34289b33e22f5889abd4d8016f0e57" + integrity sha512-BMpfD7PpiETpBl/A6S498BaIJ6Y/ABT93ETbby2fP00v4EbvPBXWEoaR1UBPKs3iR53pJY7EtZk5KACI57i1Uw== + ignore@^5.1.1, ignore@^5.1.4: version "5.1.4" resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.1.4.tgz#84b7b3dbe64552b6ef0eca99f6743dbec6d97adf" @@ -12046,7 +12259,7 @@ is-number@^7.0.0: resolved "https://registry.yarnpkg.com/is-number/-/is-number-7.0.0.tgz#7535345b896734d5f80c4d06c50955527a14f12b" integrity sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng== -is-obj@^1.0.0: +is-obj@^1.0.0, is-obj@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/is-obj/-/is-obj-1.0.1.tgz#3e4729ac1f5fde025cd7d83a896dab9f4f67db0f" integrity sha1-PkcprB9f3gJc19g6iW2rn09n2w8= @@ -12135,6 +12348,11 @@ is-regex@^1.0.4: dependencies: has "^1.0.1" +is-regexp@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/is-regexp/-/is-regexp-1.0.0.tgz#fd2d883545c46bac5a633e7b9a09e87fa2cb5069" + integrity sha1-/S2INUXEa6xaYz57mgnof6LLUGk= + is-relative@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/is-relative/-/is-relative-1.0.0.tgz#a1bb6935ce8c5dba1e8b9754b9b2dcc020e2260d" @@ -13181,6 +13399,14 @@ jstransformer@1.0.0: is-promise "^2.0.0" promise "^7.0.1" +jsx-ast-utils@^2.2.1: + version "2.3.0" + resolved "https://registry.yarnpkg.com/jsx-ast-utils/-/jsx-ast-utils-2.3.0.tgz#edd727794ea284d7fda575015ed1b0cde0289ab6" + integrity sha512-3HNoc7nZ1hpZIKB3hJ7BlFRkzCx2BynRtfSwbkqZdpRdvAPsGMnzclPwrvDBS7/lalHTj21NwIeaEpysHBOudg== + dependencies: + array-includes "^3.1.1" + object.assign "^4.1.0" + jsx-ast-utils@^2.2.3: version "2.2.3" resolved "https://registry.yarnpkg.com/jsx-ast-utils/-/jsx-ast-utils-2.2.3.tgz#8a9364e402448a3ce7f14d357738310d9248054f" @@ -13327,7 +13553,15 @@ levenary@^1.1.0: dependencies: leven "^3.1.0" -levn@^0.3.0, levn@~0.3.0: +levn@^0.4.1: + version "0.4.1" + resolved "https://registry.yarnpkg.com/levn/-/levn-0.4.1.tgz#ae4562c007473b932a6200d403268dd2fffc6ade" + integrity sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ== + dependencies: + prelude-ls "^1.2.1" + type-check "~0.4.0" + +levn@~0.3.0: version "0.3.0" resolved "https://registry.yarnpkg.com/levn/-/levn-0.3.0.tgz#3b09924edf9f083c0490fdd4c0bc4421e04764ee" integrity sha1-OwmSTt+fCDwEkP3UwLxEIeBHZO4= @@ -13481,6 +13715,41 @@ lines-and-columns@^1.1.6: resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.1.6.tgz#1c00c743b433cd0a4e80758f7b64a57440d9ff00" integrity sha1-HADHQ7QzzQpOgHWPe2SldEDZ/wA= +lint-staged@^10.2.7: + version "10.2.9" + resolved "https://registry.yarnpkg.com/lint-staged/-/lint-staged-10.2.9.tgz#6013ecfa80829cd422446b545fd30a96bca3098c" + integrity sha512-ziRAuXEqvJLSXg43ezBpHxRW8FOJCXISaXU//BWrxRrp5cBdRkIx7g5IsB3OI45xYGE0S6cOacfekSjDyDKF2g== + dependencies: + chalk "^4.0.0" + cli-truncate "2.1.0" + commander "^5.1.0" + cosmiconfig "^6.0.0" + debug "^4.1.1" + dedent "^0.7.0" + enquirer "^2.3.5" + execa "^4.0.1" + listr2 "^2.1.0" + log-symbols "^4.0.0" + micromatch "^4.0.2" + normalize-path "^3.0.0" + please-upgrade-node "^3.2.0" + string-argv "0.3.1" + stringify-object "^3.3.0" + +listr2@^2.1.0: + version "2.1.3" + resolved "https://registry.yarnpkg.com/listr2/-/listr2-2.1.3.tgz#f527e197de12ad8c488c566921fa2da34cbc67f6" + integrity sha512-6oy3QhrZAlJGrG8oPcRp1hix1zUpb5AvyvZ5je979HCyf48tIj3Hn1TG5+rfyhz30t7HfySH/OIaVbwrI2kruA== + dependencies: + chalk "^4.0.0" + cli-truncate "^2.1.0" + figures "^3.2.0" + indent-string "^4.0.0" + log-update "^4.0.0" + p-map "^4.0.0" + rxjs "^6.5.5" + through "^2.3.8" + load-json-file@^1.0.0: version "1.1.0" resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-1.1.0.tgz#956905708d58b4bab4c2261b04f59f31c99374c0" @@ -13745,6 +14014,23 @@ log-symbols@^2.1.0, log-symbols@^2.2.0: dependencies: chalk "^2.0.1" +log-symbols@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/log-symbols/-/log-symbols-4.0.0.tgz#69b3cc46d20f448eccdb75ea1fa733d9e821c920" + integrity sha512-FN8JBzLx6CzeMrB0tg6pqlGU1wCrXW+ZXGH481kfsBqer0hToTIiHdjH4Mq8xJUbvATujKCvaREGWpGUionraA== + dependencies: + chalk "^4.0.0" + +log-update@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/log-update/-/log-update-4.0.0.tgz#589ecd352471f2a1c0c570287543a64dfd20e0a1" + integrity sha512-9fkkDevMefjg0mmzWFBW8YkFP91OrizzkW3diF7CpG+S2EYdy4+TVfGwz1zeF8x7hCx1ovSPTOE9Ngib74qqUg== + dependencies: + ansi-escapes "^4.3.0" + cli-cursor "^3.1.0" + slice-ansi "^4.0.0" + wrap-ansi "^6.2.0" + logform@^2.1.1: version "2.1.2" resolved "https://registry.yarnpkg.com/logform/-/logform-2.1.2.tgz#957155ebeb67a13164069825ce67ddb5bb2dd360" @@ -14491,7 +14777,7 @@ multicast-dns@^6.0.1: dns-packet "^1.3.1" thunky "^1.0.2" -multimap@^1.0.2: +multimap@^1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/multimap/-/multimap-1.1.0.tgz#5263febc085a1791c33b59bb3afc6a76a2a10ca8" integrity sha512-0ZIR9PasPxGXmRsEF8jsDzndzHDj7tIav+JUmvIFB/WHswliFnquxECT/De7GR4yg99ky/NlRKJT82G1y271bw== @@ -15394,17 +15680,17 @@ optionator@^0.8.1: type-check "~0.3.2" wordwrap "~1.0.0" -optionator@^0.8.3: - version "0.8.3" - resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.8.3.tgz#84fa1d036fe9d3c7e21d99884b601167ec8fb495" - integrity sha512-+IW9pACdk3XWmmTXG8m3upGUJst5XRGzxMRjXzAuJ1XnIFNvfhjjIuYkDvysnPQ7qzqVzLt78BCruntqRhWQbA== +optionator@^0.9.1: + version "0.9.1" + resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.9.1.tgz#4f236a6373dae0566a6d43e1326674f50c291499" + integrity sha512-74RlY5FCnhq4jRxVUPKDaRwrVNXMqsGsiW6AJw4XK8hmtm10wC0ypZBLw5IIp85NZMr91+qd1RvvENwg7jjRFw== dependencies: - deep-is "~0.1.3" - fast-levenshtein "~2.0.6" - levn "~0.3.0" - prelude-ls "~1.1.2" - type-check "~0.3.2" - word-wrap "~1.2.3" + deep-is "^0.1.3" + fast-levenshtein "^2.0.6" + levn "^0.4.1" + prelude-ls "^1.2.1" + type-check "^0.4.0" + word-wrap "^1.2.3" ora@^3.4.0: version "3.4.0" @@ -15572,6 +15858,13 @@ p-map@^3.0.0: dependencies: aggregate-error "^3.0.0" +p-map@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/p-map/-/p-map-4.0.0.tgz#bb2f95a5eda2ec168ec9274e06a747c3e2904d2b" + integrity sha512-/bjOqmgETBYB5BoEeGVea8dmvHb2m9GLy1E9W43yeyfP6QQCZGFNa+XRceJEuDB6zqr+gKpIAmlLebMpykw/MQ== + dependencies: + aggregate-error "^3.0.0" + p-reduce@^2.0.0: version "2.1.0" resolved "https://registry.yarnpkg.com/p-reduce/-/p-reduce-2.1.0.tgz#09408da49507c6c274faa31f28df334bc712b64a" @@ -15967,6 +16260,11 @@ please-upgrade-node@^3.2.0: dependencies: semver-compare "^1.0.0" +pluralize@^8.0.0: + version "8.0.0" + resolved "https://registry.yarnpkg.com/pluralize/-/pluralize-8.0.0.tgz#1a6fa16a38d12a1901e0320fa017051c539ce3b1" + integrity sha512-Nc3IT5yHzflTfbjgqWcCPpo7DaKy4FnpB0l/zCAW0Tc7jxAiuqSxHasntB3D7887LSrA93kDJ9IXovxJYxyLCA== + pn@^1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/pn/-/pn-1.1.0.tgz#e2f4cef0e219f463c179ab37463e4e1ecdccbafb" @@ -16177,6 +16475,11 @@ postcss@^7.0.18, postcss@^7.0.26: source-map "^0.6.1" supports-color "^6.1.0" +prelude-ls@^1.2.1: + version "1.2.1" + resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396" + integrity sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g== + prelude-ls@~1.1.2: version "1.1.2" resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54" @@ -17516,7 +17819,7 @@ regex-not@^1.0.0, regex-not@^1.0.2: extend-shallow "^3.0.2" safe-regex "^1.1.0" -regexp-tree@^0.1.20, regexp-tree@~0.1.1: +regexp-tree@^0.1.21, regexp-tree@~0.1.1: version "0.1.21" resolved "https://registry.yarnpkg.com/regexp-tree/-/regexp-tree-0.1.21.tgz#55e2246b7f7d36f1b461490942fa780299c400d7" integrity sha512-kUUXjX4AnqnR8KRTCrayAo9PzYMRKmVoGgaz2tBuz0MF3g1ZbGebmtW0yFHfFK9CmBjQKeYIgoL22pFLBJY7sw== @@ -17536,16 +17839,16 @@ regexp.prototype.flags@^1.3.0: define-properties "^1.1.3" es-abstract "^1.17.0-next.1" -regexpp@^2.0.1: - version "2.0.1" - resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-2.0.1.tgz#8d19d31cf632482b589049f8281f93dbcba4d07f" - integrity sha512-lv0M6+TkDVniA3aD1Eg0DVpfU/booSu7Eev3TDO/mZKHBfVjgCGTV4t4buppESEYDtkArYFOxTJWv6S5C+iaNw== - regexpp@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-3.0.0.tgz#dd63982ee3300e67b41c1956f850aa680d9d330e" integrity sha512-Z+hNr7RAVWxznLPuA7DIh8UNX1j9CDrUQxskw9IrBE1Dxue2lyXT+shqEIeLUjrokxIP8CMy1WkjgG3rTsd5/g== +regexpp@^3.1.0: + version "3.1.0" + resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-3.1.0.tgz#206d0ad0a5648cffbdb8ae46438f3dc51c9f78e2" + integrity sha512-ZOIzd8yVsQQA7j8GCSlPGXwg5PfmA1mrq0JP4nGhh54LaKN3xdai/vHUDu74pKwV8OxseMS65u2NImosQcSD0Q== + regexpu-core@^4.6.0: version "4.6.0" resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-4.6.0.tgz#2037c18b327cfce8a6fea2a4ec441f2432afb8b6" @@ -18083,6 +18386,13 @@ rxjs@^6.4.0: dependencies: tslib "^1.9.0" +rxjs@^6.5.5: + version "6.5.5" + resolved "https://registry.yarnpkg.com/rxjs/-/rxjs-6.5.5.tgz#c5c884e3094c8cfee31bf27eb87e54ccfc87f9ec" + integrity sha512-WfQI+1gohdf0Dai/Bbmk5L5ItH5tYqm3ki2c5GdWhKjalzjg93N3avFjVStyZZz+A2Em+ZxKH5bNghw9UeylGQ== + dependencies: + tslib "^1.9.0" + safe-buffer@5.1.1: version "5.1.1" resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.1.tgz#893312af69b2123def71f57889001671eeb2c853" @@ -18333,7 +18643,7 @@ semver@6.2.0: resolved "https://registry.yarnpkg.com/semver/-/semver-6.2.0.tgz#4d813d9590aaf8a9192693d6c85b9344de5901db" integrity sha512-jdFC1VdUGT/2Scgbimf7FSx9iJLXoqfglSF+gJeuNWVpiE37OIbc1jywR/GJyFdz3mnkz2/id0L0J/cr0izR5A== -semver@6.x, semver@^6.0.0, semver@^6.1.2, semver@^6.3.0: +semver@6.x, semver@^6.0.0, semver@^6.3.0: version "6.3.0" resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d" integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw== @@ -18343,11 +18653,16 @@ semver@7.0.0: resolved "https://registry.yarnpkg.com/semver/-/semver-7.0.0.tgz#5f3ca35761e47e05b206c6daff2cf814f0316b8e" integrity sha512-+GB6zVA9LWh6zovYQLALHwv5rb2PHGlJi3lfiqIHxR0uuwCgefcOJc59v9fv1w8GbStwxuuqqAjI9NMAOOgq1A== -semver@^7.1.1, semver@^7.1.2: +semver@^7.1.1: version "7.1.3" resolved "https://registry.yarnpkg.com/semver/-/semver-7.1.3.tgz#e4345ce73071c53f336445cfc19efb1c311df2a6" integrity sha512-ekM0zfiA9SCBlsKa2X1hxyxiI4L3B6EbVJkkdgQXnSEEaHlGdvyodMruTiulSRWMMB4NeIuYNMC9rTKTz97GxA== +semver@^7.2.1, semver@^7.3.2: + version "7.3.2" + resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.2.tgz#604962b052b81ed0786aae84389ffba70ffd3938" + integrity sha512-OrOb32TeeambH6UrhtShmF7CRDqhL6/5XpPNp2DuRH6+9QLw/orhp72j87v8Qa1ScDkvrrBNpZcDejAirJmfXQ== + semver@~5.3.0: version "5.3.0" resolved "https://registry.yarnpkg.com/semver/-/semver-5.3.0.tgz#9b2ce5d3de02d17c6012ad326aa6b4d0cf54f94f" @@ -18653,6 +18968,24 @@ slice-ansi@^2.1.0: astral-regex "^1.0.0" is-fullwidth-code-point "^2.0.0" +slice-ansi@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/slice-ansi/-/slice-ansi-3.0.0.tgz#31ddc10930a1b7e0b67b08c96c2f49b77a789787" + integrity sha512-pSyv7bSTC7ig9Dcgbw9AuRNUb5k5V6oDudjZoMBSr13qpLBG7tB+zgCkARjq7xIUgdz5P1Qe8u+rSGdouOOIyQ== + dependencies: + ansi-styles "^4.0.0" + astral-regex "^2.0.0" + is-fullwidth-code-point "^3.0.0" + +slice-ansi@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/slice-ansi/-/slice-ansi-4.0.0.tgz#500e8dd0fd55b05815086255b3195adf2a45fe6b" + integrity sha512-qMCMfhY040cVHT43K9BFygqYbUPFZKHOg7K73mtTWJRb8pyP3fzf4Ixd5SzdEJQ6MRUg/WBnOLxghZtKKurENQ== + dependencies: + ansi-styles "^4.0.0" + astral-regex "^2.0.0" + is-fullwidth-code-point "^3.0.0" + slide@^1.1.6, slide@~1.1.3, slide@~1.1.6: version "1.1.6" resolved "https://registry.yarnpkg.com/slide/-/slide-1.1.6.tgz#56eb027d65b4d2dce6cb2e2d32c4d4afc9e1d707" @@ -19050,6 +19383,11 @@ strict-uri-encode@^2.0.0: resolved "https://registry.yarnpkg.com/strict-uri-encode/-/strict-uri-encode-2.0.0.tgz#b9c7330c7042862f6b142dc274bbcc5866ce3546" integrity sha1-ucczDHBChi9rFC3CdLvMWGbONUY= +string-argv@0.3.1: + version "0.3.1" + resolved "https://registry.yarnpkg.com/string-argv/-/string-argv-0.3.1.tgz#95e2fbec0427ae19184935f816d74aaa4c5c19da" + integrity sha512-a1uQGz7IyVy9YwhqjZIZu1c8JO8dNIe20xBmSS6qu9kv++k3JGzCVmprbNN5Kn+BgzD5E7YYwg1CcjuJMRNsvg== + string-length@^3.1.0: version "3.1.0" resolved "https://registry.yarnpkg.com/string-length/-/string-length-3.1.0.tgz#107ef8c23456e187a8abd4a61162ff4ac6e25837" @@ -19204,6 +19542,15 @@ stringify-entities@^1.0.1: is-alphanumerical "^1.0.0" is-hexadecimal "^1.0.0" +stringify-object@^3.3.0: + version "3.3.0" + resolved "https://registry.yarnpkg.com/stringify-object/-/stringify-object-3.3.0.tgz#703065aefca19300d3ce88af4f5b3956d7556629" + integrity sha512-rHqiFh1elqCQ9WPLIC8I0Q/g/wj5J1eMkyoiD6eoQApWHP0FtlK7rqnhmabL5VUY9JQCcqwwvlOaSuutekgyrw== + dependencies: + get-own-enumerable-property-symbols "^3.0.0" + is-obj "^1.0.1" + is-regexp "^1.0.0" + stringify-package@^1.0.0, stringify-package@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/stringify-package/-/stringify-package-1.0.1.tgz#e5aa3643e7f74d0f28628b72f3dad5cecfc3ba85" @@ -19281,6 +19628,11 @@ strip-json-comments@3.0.1, strip-json-comments@^3.0.1: resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-3.0.1.tgz#85713975a91fb87bf1b305cca77395e40d2a64a7" integrity sha512-VTyMAUfdm047mwKl+u79WIdrZxtFtn+nBxHeb844XBQ9uMNTuTHdx2hc5RiAJYqwTj3wc/xe5HLSdJSkJ+WfZw== +strip-json-comments@^3.1.0: + version "3.1.0" + resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-3.1.0.tgz#7638d31422129ecf4457440009fba03f9f9ac180" + integrity sha512-e6/d0eBu7gHtdCqFt0xJr642LdToM5/cN4Qb9DbHjVx1CP5RyeM+zH7pbecEmDv/lBqb0QH+6Uqq75rxFPkM0w== + strip-json-comments@~2.0.1: version "2.0.1" resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz#3c531942e908c2697c0ec344858c286c7ca0a60a" @@ -19607,7 +19959,7 @@ through2@^3.0.0: dependencies: readable-stream "2 || 3" -through@2, "through@>=2.2.7 <3", through@^2.3.6, through@~2.3.4: +through@2, "through@>=2.2.7 <3", through@^2.3.6, through@^2.3.8, through@~2.3.4: version "2.3.8" resolved "https://registry.yarnpkg.com/through/-/through-2.3.8.tgz#0dd4c9ffaabc357960b1b724115d7e0e86a2e1f5" integrity sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU= @@ -19927,6 +20279,13 @@ tweetnacl@^0.14.3, tweetnacl@~0.14.0: resolved "https://registry.yarnpkg.com/tweetnacl/-/tweetnacl-0.14.5.tgz#5ae68177f192d4456269d108afa93ff8743f4f64" integrity sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q= +type-check@^0.4.0, type-check@~0.4.0: + version "0.4.0" + resolved "https://registry.yarnpkg.com/type-check/-/type-check-0.4.0.tgz#07b8203bfa7056c0657050e3ccd2c37730bab8f1" + integrity sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew== + dependencies: + prelude-ls "^1.2.1" + type-check@~0.3.2: version "0.3.2" resolved "https://registry.yarnpkg.com/type-check/-/type-check-0.3.2.tgz#5884cab512cf1d355e3fb784f30804b2b520db72" @@ -19939,6 +20298,11 @@ type-detect@4.0.8: resolved "https://registry.yarnpkg.com/type-detect/-/type-detect-4.0.8.tgz#7646fb5f18871cfbb7749e69bd39a6388eb7450c" integrity sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g== +type-fest@^0.11.0: + version "0.11.0" + resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.11.0.tgz#97abf0872310fed88a5c466b25681576145e33f1" + integrity sha512-OdjXJxnCN1AvyLSzeKIgXTXxV+99ZuXl3Hpo9XpJAv9MBcHrrJOQ5kV7ypXOuQie+AmWG25hLbiKdwYTifzcfQ== + type-fest@^0.3.0, type-fest@^0.3.1: version "0.3.1" resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.3.1.tgz#63d00d204e059474fe5e1b7c011112bbd1dc29e1" @@ -20954,7 +21318,7 @@ with@^5.0.0: acorn "^3.1.0" acorn-globals "^3.0.0" -word-wrap@^1.0.3, word-wrap@~1.2.3: +word-wrap@^1.0.3, word-wrap@^1.2.3: version "1.2.3" resolved "https://registry.yarnpkg.com/word-wrap/-/word-wrap-1.2.3.tgz#610636f6b1f703891bd34771ccb17fb93b47079c" integrity sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ==