diff --git a/superset-frontend/plugins/legacy-plugin-chart-treemap/package.json b/superset-frontend/plugins/legacy-plugin-chart-treemap/package.json
index afd55b88c18a..96d582d7859c 100644
--- a/superset-frontend/plugins/legacy-plugin-chart-treemap/package.json
+++ b/superset-frontend/plugins/legacy-plugin-chart-treemap/package.json
@@ -2,31 +2,25 @@
"name": "@superset-ui/legacy-plugin-chart-treemap",
"version": "0.18.25",
"description": "Superset Legacy Chart - Treemap",
- "sideEffects": [
- "*.css"
- ],
- "main": "lib/index.js",
- "module": "esm/index.js",
- "files": [
- "esm",
- "lib"
- ],
- "repository": {
- "type": "git",
- "url": "git+https://github.com/apache-superset/superset-ui.git"
- },
"keywords": [
"superset"
],
- "author": "Superset",
- "license": "Apache-2.0",
+ "homepage": "https://github.com/apache-superset/superset-ui#readme",
"bugs": {
"url": "https://github.com/apache-superset/superset-ui/issues"
},
- "homepage": "https://github.com/apache-superset/superset-ui#readme",
- "publishConfig": {
- "access": "public"
+ "repository": {
+ "type": "git",
+ "url": "git+https://github.com/apache-superset/superset-ui.git"
},
+ "license": "Apache-2.0",
+ "author": "Superset",
+ "main": "lib/index.js",
+ "module": "esm/index.js",
+ "files": [
+ "esm",
+ "lib"
+ ],
"dependencies": {
"d3-hierarchy": "^1.1.8",
"d3-selection": "^1.4.0",
@@ -34,6 +28,10 @@
},
"peerDependencies": {
"@superset-ui/chart-controls": "*",
- "@superset-ui/core": "*"
+ "@superset-ui/core": "*",
+ "react": "^16.13.1"
+ },
+ "publishConfig": {
+ "access": "public"
}
}
diff --git a/superset-frontend/plugins/legacy-plugin-chart-treemap/src/ReactTreemap.js b/superset-frontend/plugins/legacy-plugin-chart-treemap/src/ReactTreemap.jsx
similarity index 52%
rename from superset-frontend/plugins/legacy-plugin-chart-treemap/src/ReactTreemap.js
rename to superset-frontend/plugins/legacy-plugin-chart-treemap/src/ReactTreemap.jsx
index 743115c01879..c00d8b5d1749 100644
--- a/superset-frontend/plugins/legacy-plugin-chart-treemap/src/ReactTreemap.js
+++ b/superset-frontend/plugins/legacy-plugin-chart-treemap/src/ReactTreemap.jsx
@@ -16,7 +16,36 @@
* specific language governing permissions and limitations
* under the License.
*/
-import { reactify } from '@superset-ui/core';
+import React from 'react';
+import { reactify, styled } from '@superset-ui/core';
import Component from './Treemap';
-export default reactify(Component);
+const ReactComponent = reactify(Component);
+
+const Treemap = ({ className, ...otherProps }) => (
+
+
+
+);
+
+export default styled(Treemap)`
+ ${({ theme }) => `
+ .superset-legacy-chart-treemap text {
+ font-size: ${theme.typography.sizes.s}px;
+ pointer-events: none;
+ }
+
+ .superset-legacy-chart-treemap tspan:last-child {
+ font-size: ${theme.typography.sizes.xs}px;
+ fill-opacity: 0.8;
+ }
+
+ .superset-legacy-chart-treemap .node rect {
+ shape-rendering: crispEdges;
+ }
+
+ .superset-legacy-chart-treemap .node--hover rect {
+ stroke: ${theme.colors.grayscale.dark2};
+ }
+ `}
+`;
diff --git a/superset-frontend/plugins/legacy-plugin-chart-treemap/src/Treemap.css b/superset-frontend/plugins/legacy-plugin-chart-treemap/src/Treemap.css
deleted file mode 100644
index f49b425f200b..000000000000
--- a/superset-frontend/plugins/legacy-plugin-chart-treemap/src/Treemap.css
+++ /dev/null
@@ -1,36 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF 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.
- */
-
-.superset-legacy-chart-treemap text {
- font-size: 11px;
- pointer-events: none;
-}
-
-.superset-legacy-chart-treemap tspan:last-child {
- font-size: 9px;
- fill-opacity: 0.8;
-}
-
-.superset-legacy-chart-treemap .node rect {
- shape-rendering: crispEdges;
-}
-
-.superset-legacy-chart-treemap .node--hover rect {
- stroke: #000;
-}
diff --git a/superset-frontend/plugins/legacy-plugin-chart-treemap/src/Treemap.js b/superset-frontend/plugins/legacy-plugin-chart-treemap/src/Treemap.js
index f218218ec8bb..e0f4e691220c 100644
--- a/superset-frontend/plugins/legacy-plugin-chart-treemap/src/Treemap.js
+++ b/superset-frontend/plugins/legacy-plugin-chart-treemap/src/Treemap.js
@@ -29,7 +29,6 @@ import {
getNumberFormatter,
CategoricalColorNamespace,
} from '@superset-ui/core';
-import './Treemap.css';
// Declare PropTypes for recursive data structures
// https://github.com/facebook/react/issues/5676