feat(superset-ui-style): export ThemeProvider and useTheme (#553)

apache-superset · Jun 1, 2020 · f6a8949 · f6a8949 · vercel · Jun 1, 2020
1 parent 67b5d75
commit f6a8949
Show file tree

Hide file tree

Showing 6 changed files with 13 additions and 13 deletions.
diff --git a/packages/superset-ui-demo/.storybook/themeDecorator.js b/packages/superset-ui-demo/.storybook/themeDecorator.js
@@ -1,7 +1,6 @@
 // themeDecorator.js
 import React from "react"
-import { ThemeProvider } from 'emotion-theming';
-import { supersetTheme } from '@superset-ui/style';
+import { supersetTheme, ThemeProvider } from '@superset-ui/style';
 
 const ThemeDecorator = storyFn => (
   <ThemeProvider theme={supersetTheme}>{storyFn()}</ThemeProvider>

diff --git a/packages/superset-ui-style/README.md b/packages/superset-ui-style/README.md
@@ -8,8 +8,7 @@ Provides a style object containing a variety of style parameters for theming Sup
 ## Usage
 
 ```ts
-import { ThemeProvider } from 'emotion-theming';
-import styled, { supersetTheme } from '@superset-ui/style';
+import { styled, supersetTheme, ThemeProvider } from '@superset-ui/style';
 
 // use emotion api as normal, but the theme uses the correct types
 const MyHeader = styled.h1`

diff --git a/packages/superset-ui-style/package.json b/packages/superset-ui-style/package.json
@@ -30,6 +30,7 @@
   },
   "dependencies": {
     "@emotion/core": "^10.0.28",
-    "@emotion/styled": "^10.0.27"
+    "@emotion/styled": "^10.0.27",
+    "emotion-theming": "^10.0.27"
   }
 }
diff --git a/packages/superset-ui-style/src/index.ts b/packages/superset-ui-style/src/index.ts
@@ -16,7 +16,9 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import styled, { CreateStyled } from '@emotion/styled';
+import emotionStyled, { CreateStyled } from '@emotion/styled';
+
+export { useTheme, ThemeProvider, withTheme } from 'emotion-theming';
 
 const defaultTheme = {
   borderRadius: 4,
@@ -60,10 +62,11 @@ const defaultTheme = {
   gridUnit: 4,
 };
 
-export default styled as CreateStyled<typeof defaultTheme>;
-
-export const supersetTheme = defaultTheme;
-
 export interface SupersetThemeProps {
   theme: typeof defaultTheme;
 }
+
+export const styled: CreateStyled<typeof defaultTheme> = emotionStyled;
+export const supersetTheme = defaultTheme;
+
+export default styled;
diff --git a/plugins/plugin-chart-word-cloud/package.json b/plugins/plugin-chart-word-cloud/package.json
@@ -33,7 +33,6 @@
     "@types/react": "^16.3.0",
     "d3-cloud": "^1.2.5",
     "d3-scale": "^3.0.1",
-    "emotion-theming": "^10.0.27",
     "encodable": "^0.3.3"
   },
   "peerDependencies": {

diff --git a/plugins/plugin-chart-word-cloud/src/chart/WordCloud.tsx b/plugins/plugin-chart-word-cloud/src/chart/WordCloud.tsx
@@ -1,8 +1,7 @@
 import React from 'react';
 import cloudLayout, { Word } from 'd3-cloud';
 import { PlainObject, createEncoderFactory, DeriveEncoding } from 'encodable';
-import { SupersetThemeProps } from '@superset-ui/style';
-import { withTheme } from 'emotion-theming';
+import { SupersetThemeProps, withTheme } from '@superset-ui/style';
 
 export const ROTATION = {
   flat: () => 0,