chore: upgrade storybook to 6.3.12

.gitignore

@@ -47,3 +47,5 @@ packages/*/yarn.lock
 # For country map geojson conversion script
 .ipynb_checkpoints/
 scripts/*.zip
+
+**/storybook-static

packages/superset-ui-core/src/color/colorSchemes/categorical/index.ts

@@ -0,0 +1,7 @@
+export { default as CategoricalAirbnb } from './airbnb';
+export { default as CategoricalD3 } from './d3';
+export { default as CategoricalEcharts } from './echarts';
+export { default as CategoricalGoogle } from './google';
+export { default as CategoricalLyft } from './lyft';
+export { default as CategoricalPreset } from './preset';
+export { default as CategoricalSuperset } from './superset';

packages/superset-ui-core/src/color/colorSchemes/index.ts

@@ -0,0 +1,2 @@
+export * from './categorical';
+export * from './sequential';

packages/superset-ui-core/src/color/colorSchemes/sequential/index.ts

@@ -0,0 +1,2 @@
+export { default as SequentialCommon } from './common';
+export { default as SequentialD3 } from './d3';

packages/superset-ui-core/src/color/index.ts

@@ -6,5 +6,6 @@ export { default as CategoricalScheme } from './CategoricalScheme';
 export { default as getCategoricalSchemeRegistry } from './CategoricalSchemeRegistrySingleton';
 export { default as getSequentialSchemeRegistry } from './SequentialSchemeRegistrySingleton';
 export { default as SequentialScheme } from './SequentialScheme';
+export * from './colorSchemes';
 
 export const BRAND_COLOR = '#00A699';

packages/superset-ui-demo/.storybook/main.js

@@ -9,17 +9,19 @@ const packages = readdirSync(basePath).filter(name => {
   return stat.isSymbolicLink();
 });
 
+// find @superset-ui/core source
+const corePath = path.resolve(__dirname, '../../../packages/superset-ui-core');
+
 const PLUGIN_PACKAGES_PATH_REGEXP = new RegExp(
   `${path.resolve(__dirname, '../../../plugins/(legacy-)*(plugin|preset)-')}.+/src`,
 );
 
 module.exports = {
   addons: [
-    '@storybook/preset-typescript',
-    '@storybook/addon-knobs/register',
-    'storybook-addon-jsx/register',
-    '@storybook/addon-actions/register',
-    '@storybook/addon-links/register',
+    '@storybook/addon-knobs',
+    'storybook-addon-jsx',
+    '@storybook/addon-actions',
+    '@storybook/addon-links',
   ],
   stories: ['../storybook/stories/**/*Stories.[tj]sx'],
   webpackFinal: config => {
@@ -60,6 +62,12 @@ module.exports = {
       ),
     });
 
+    // todo: remove hard code after move storybook to superset repo.
+    config.resolve.alias['@emotion/styled'] = path.resolve(
+      corePath,
+      './node_modules/@emotion/styled',
+    );
+
     config.devtool = 'eval-cheap-module-source-map';
     config.devServer = {
       ...config.devServer,

packages/superset-ui-demo/.storybook/preview.js

@@ -1,15 +1,15 @@
 import { addParameters, addDecorator } from '@storybook/react';
 import { jsxDecorator } from 'storybook-addon-jsx';
-import categoricalD3 from '@superset-ui/core/lib/color/colorSchemes/categorical/d3';
-import categoricalSuperset from '@superset-ui/core/lib/color/colorSchemes/categorical/superset';
-import sequentialCommon from '@superset-ui/core/lib/color/colorSchemes/sequential/common';
-import sequentialD3 from '@superset-ui/core/lib/color/colorSchemes/sequential/d3';
 import {
   configure,
   getTimeFormatterRegistry,
   smartDateFormatter,
   getCategoricalSchemeRegistry,
   getSequentialSchemeRegistry,
+  CategoricalD3,
+  CategoricalSuperset,
+  SequentialCommon,
+  SequentialD3,
 } from '@superset-ui/core';
 import { configureEncodable } from '@superset-ui/preset-chart-xy';
 import themeDecorator from './themeDecorator';
@@ -56,15 +56,15 @@ configure();
 
 // Register color schemes
 const categoricalSchemeRegistry = getCategoricalSchemeRegistry();
-[categoricalD3, categoricalSuperset].forEach(group => {
+[CategoricalD3, CategoricalSuperset].forEach(group => {
   group.forEach(scheme => {
     categoricalSchemeRegistry.registerValue(scheme.id, scheme);
   });
 });
 categoricalSchemeRegistry.setDefaultKey('d3Category10');
 
 const sequentialSchemeRegistry = getSequentialSchemeRegistry();
-[sequentialCommon, sequentialD3].forEach(group => {
+[SequentialCommon, SequentialD3].forEach(group => {
   group.forEach(scheme => {
     sequentialSchemeRegistry.registerValue(scheme.id, scheme);
   });

packages/superset-ui-demo/package.json

@@ -35,14 +35,13 @@
     "@emotion/react": "^11.4.1",
     "@emotion/styled": "^11.3.0",
     "@react-icons/all-files": "^4.1.0",
-    "@storybook/addon-actions": "^5.3.18",
-    "@storybook/addon-info": "^5.3.18",
-    "@storybook/addon-knobs": "^6.1.15",
-    "@storybook/addon-links": "^5.3.18",
-    "@storybook/addons": "^5.3.18",
-    "@storybook/preset-typescript": "^3.0.0",
-    "@storybook/react": "^5.3.18",
-    "@superset-ui/core": "file:../superset-ui-core/src",
+    "@storybook/addon-actions": "^6.3.12",
+    "@storybook/addon-info": "^5.3.21",
+    "@storybook/addon-knobs": "^6.3.1",
+    "@storybook/addon-links": "^6.3.12",
+    "@storybook/addons": "^6.3.12",
+    "@storybook/react": "^6.3.12",
+    "@superset-ui/core": "0.18.13",
     "@superset-ui/legacy-plugin-chart-calendar": "0.18.13",
     "@superset-ui/legacy-plugin-chart-chord": "0.18.13",
     "@superset-ui/legacy-plugin-chart-country-map": "0.18.13",
@@ -70,7 +69,6 @@
     "@superset-ui/plugin-chart-word-cloud": "0.18.13",
     "@types/react-loadable": "^5.5.3",
     "@types/react-resizable": "^1.7.2",
-    "@types/storybook__react": "5.2.1",
     "antd": "^4.9.4",
     "bootstrap": "^3.4.1",
     "core-js": "3.8.3",
@@ -81,7 +79,7 @@
     "react": "^16.13.1",
     "react-loadable": "^5.5.0",
     "react-resizable": "^1.10.1",
-    "storybook-addon-jsx": "^7.2.3"
+    "storybook-addon-jsx": "^7.3.14"
   },
   "devDependencies": {
     "@babel/core": "^7.9.0",

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-calendar/Stories.tsx

@@ -7,7 +7,7 @@ import dummyDatasource from '../../../shared/dummyDatasource';
 new CalendarChartPlugin().configure({ key: 'calendar' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-calendar',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-calendar',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-chord/Stories.tsx

@@ -6,7 +6,7 @@ import data from './data';
 new ChordChartPlugin().configure({ key: 'chord' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-chord',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-chord',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-country-map/CountryMapStories.tsx

@@ -17,8 +17,7 @@
  * under the License.
  */
 import React, { useEffect, useState } from 'react';
-import { JsonObject, seedRandom, SuperChart } from '@superset-ui/core';
-import schemas from '@superset-ui/core/esm/color/colorSchemes/sequential/d3';
+import { JsonObject, seedRandom, SuperChart, SequentialD3 } from '@superset-ui/core';
 import CountryMapChartPlugin from '@superset-ui/legacy-plugin-chart-country-map/src';
 import countries from '@superset-ui/legacy-plugin-chart-country-map/src/countries';
 import { withKnobs, select } from '@storybook/addon-knobs';
@@ -27,7 +26,7 @@ import { withResizableChartDemo } from '../../../shared/components/ResizableChar
 new CountryMapChartPlugin().configure({ key: 'country-map' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-country-map',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-country-map',
   decorators: [withKnobs, withResizableChartDemo],
 };
 
@@ -40,10 +39,10 @@ function generateData(geojson: JsonObject) {
 
 export const basic = function BasicCountryMapStory({ width, height }) {
   const country = select('Country', Object.keys(countries!), 'france');
-  const colorSchema = select(
+  const colorSchema = select<any>(
     'Color schema',
-    schemas,
-    schemas.find(x => x.id === 'schemeOranges'),
+    SequentialD3,
+    SequentialD3.find(x => x.id === 'schemeOranges'),
   );
   const [data, setData] = useState<JsonObject>();
 

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-event-flow/Stories.jsx

@@ -6,7 +6,7 @@ import EventFlowChartPlugin from '@superset-ui/legacy-plugin-chart-event-flow';
 new EventFlowChartPlugin().configure({ key: 'event-flow' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-event-flow',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-event-flow',
 };
 
 const data = sampleEvents.twentyUsers.allEvents.map(({ ENTITY_ID, EVENT_NAME, TS }) => ({

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-force-directed/Stories.tsx

@@ -7,7 +7,7 @@ import data from './data';
 new ForceDirectedChartPlugin().configure({ key: 'force-directed' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-force-directed',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-force-directed',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-heatmap/Stories.tsx

@@ -7,7 +7,7 @@ import data from './data';
 new HeatmapChartPlugin().configure({ key: 'heatmap' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-heatmap',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-heatmap',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-histogram/Stories.tsx

@@ -7,7 +7,7 @@ import data from './data';
 new HistogramChartPlugin().configure({ key: 'histogram' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-histogram',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-histogram',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-horizon/Stories.tsx

@@ -6,7 +6,7 @@ import data from './data';
 new HorizonChartPlugin().configure({ key: 'horizon' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-horizon',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-horizon',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-map-box/Stories.tsx

@@ -7,7 +7,7 @@ import data from './data';
 new MapBoxChartPlugin().configure({ key: 'map-box' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-map-box',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-map-box',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-paired-t-test/Stories.tsx

@@ -7,7 +7,7 @@ import data from './data';
 new PairedTTestChartPlugin().configure({ key: 'paired-t-test' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-paired-t-test',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-paired-t-test',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-parallel-coordinates/Stories.tsx

@@ -6,7 +6,7 @@ import data from './data';
 new ParallelCoordinatesChartPlugin().configure({ key: 'parallel-coordinates' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-parallel-coordinates',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-parallel-coordinates',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-partition/Stories.tsx

@@ -7,7 +7,7 @@ import dummyDatasource from '../../../shared/dummyDatasource';
 new PartitionChartPlugin().configure({ key: 'partition' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-partition',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-partition',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-pivot-table/Stories.tsx

@@ -7,7 +7,7 @@ import 'bootstrap/dist/css/bootstrap.min.css';
 new PivotTableChartPlugin().configure({ key: 'pivot-table' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-pivot-table',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-pivot-table',
 };
 
 const datasource = {

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-rose/Stories.tsx

@@ -7,7 +7,7 @@ import data from './data';
 new RoseChartPlugin().configure({ key: 'rose' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-rose',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-rose',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-sankey-loop/Stories.tsx

@@ -7,7 +7,7 @@ import data from './data';
 new SankeyLoopChartPlugin().configure({ key: 'sankey-loop' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-sankey-loop',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-sankey-loop',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-sankey/Stories.tsx

@@ -8,7 +8,7 @@ import data from './data';
 new SankeyChartPlugin().configure({ key: 'sankey' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-sankey',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-sankey',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-sunburst/Stories.tsx

@@ -8,7 +8,7 @@ import data from './data';
 new SunburstChartPlugin().configure({ key: 'sunburst' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-sunburst',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-sunburst',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-time-table/Stories.tsx

@@ -7,7 +7,7 @@ import data from './data';
 new TimeTableChartPlugin().configure({ key: 'time-table' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-time-table',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-time-table',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-treemap/Stories.tsx

@@ -7,7 +7,7 @@ import data from './data';
 new TreemapChartPlugin().configure({ key: 'treemap' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-treemap',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-treemap',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-plugin-chart-world-map/Stories.tsx

@@ -7,7 +7,7 @@ import data from './data';
 new WorldMapChartPlugin().configure({ key: 'world-map' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-plugin-chart-world-map',
+  title: 'Legacy Chart Plugins/legacy-plugin-chart-world-map',
 };
 
 export const basic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-preset-chart-big-number/BigNumber/BigNumberStories.tsx

@@ -56,7 +56,7 @@ function withNulls(origData: object[], nullPosition = 3) {
 }
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-preset-big-number/BigNumber',
+  title: 'Legacy Chart Plugins/legacy-preset-big-number/BigNumber',
 };
 
 export const basicWithTrendline = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-preset-chart-big-number/BigNumberTotal/BigNumberTotalStories.tsx

@@ -24,7 +24,7 @@ import data from './data';
 new BigNumberTotalChartPlugin().configure({ key: 'big-number-total' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-preset-big-number/BigNumberTotal',
+  title: 'Legacy Chart Plugins/legacy-preset-big-number/BigNumberTotal',
 };
 
 export const totalBasic = () => (

packages/superset-ui-demo/storybook/stories/plugins/legacy-preset-chart-nvd3/Area/Stories.tsx

@@ -3,7 +3,7 @@ import { AreaChartPlugin } from '@superset-ui/legacy-preset-chart-nvd3';
 new AreaChartPlugin().configure({ key: 'area' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-preset-chart-nvd3/Area',
+  title: 'Legacy Chart Plugins/legacy-preset-chart-nvd3/Area',
 };
 
 export { stacked } from './stories/stacked';

packages/superset-ui-demo/storybook/stories/plugins/legacy-preset-chart-nvd3/Bar/Stories.tsx

@@ -3,7 +3,7 @@ import { BarChartPlugin } from '@superset-ui/legacy-preset-chart-nvd3';
 new BarChartPlugin().configure({ key: 'bar' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-preset-chart-nvd3/Bar',
+  title: 'Legacy Chart Plugins/legacy-preset-chart-nvd3/Bar',
 };
 
 export { basic } from './stories/basic';

packages/superset-ui-demo/storybook/stories/plugins/legacy-preset-chart-nvd3/BoxPlot/Stories.tsx

@@ -3,7 +3,7 @@ import { BoxPlotChartPlugin } from '@superset-ui/legacy-preset-chart-nvd3';
 new BoxPlotChartPlugin().configure({ key: 'box-plot' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-preset-chart-nvd3/BoxPlot',
+  title: 'Legacy Chart Plugins/legacy-preset-chart-nvd3/BoxPlot',
 };
 
 export { basic } from './stories/basic';

packages/superset-ui-demo/storybook/stories/plugins/legacy-preset-chart-nvd3/Bubble/Stories.tsx

@@ -3,7 +3,7 @@ import { BubbleChartPlugin } from '@superset-ui/legacy-preset-chart-nvd3';
 new BubbleChartPlugin().configure({ key: 'bubble' }).register();
 
 export default {
-  title: 'Legacy Chart Plugins|legacy-preset-chart-nvd3/Bubble',
+  title: 'Legacy Chart Plugins/legacy-preset-chart-nvd3/Bubble',
 };
 
 export { basic } from './stories/basic';