Skip to content

Commit

Permalink
refactor: Removes the CSS files from the Heatmap plugin (#19417)
Browse files Browse the repository at this point in the history
* refactor: Removes the CSS files from the Heatmap plugin

* Adds peer dependencies
  • Loading branch information
michael-s-molina authored Mar 31, 2022
1 parent 13467be commit ac6b2f2
Show file tree
Hide file tree
Showing 6 changed files with 166 additions and 190 deletions.
37 changes: 18 additions & 19 deletions superset-frontend/plugins/legacy-plugin-chart-heatmap/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,39 +2,38 @@
"name": "@superset-ui/legacy-plugin-chart-heatmap",
"version": "0.18.25",
"description": "Superset Legacy Chart - Heatmap",
"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": "^3.5.17",
"d3-svg-legend": "^1.x",
"d3-tip": "^0.9.1",
"prop-types": "^15.6.2"
},
"peerDependencies": {
"@emotion/react": "^11.4.1",
"@superset-ui/chart-controls": "*",
"@superset-ui/core": "*"
"@superset-ui/core": "*",
"react": "^16.13.1"
},
"publishConfig": {
"access": "public"
}
}

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -27,9 +27,6 @@ import {
getSequentialSchemeRegistry,
} from '@superset-ui/core';

import './vendor/d3tip.css';
import './Heatmap.css';

const propTypes = {
data: PropTypes.shape({
records: PropTypes.arrayOf(
Expand Down

This file was deleted.

Original file line number Diff line number Diff line change
@@ -0,0 +1,148 @@
/**
* 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.
*/
import React from 'react';
import { reactify, css, styled } from '@superset-ui/core';
import { Global } from '@emotion/react';
import Component from './Heatmap';

const ReactComponent = reactify(Component);

const Heatmap = ({ className, ...otherProps }) => (
<div className={className}>
<Global
styles={theme => css`
.d3-tip {
line-height: 1;
padding: ${theme.gridUnit * 3}px;
background: ${theme.colors.grayscale.dark2};
color: ${theme.colors.grayscale.light5};
border-radius: 4px;
pointer-events: none;
z-index: 1000;
font-size: ${theme.typography.sizes.s}px;
}
/* Creates a small triangle extender for the tooltip */
.d3-tip:after {
box-sizing: border-box;
display: inline;
font-size: ${theme.typography.sizes.xs};
width: 100%;
line-height: 1;
color: ${theme.colors.grayscale.dark2};
position: absolute;
pointer-events: none;
}
/* Northward tooltips */
.d3-tip.n:after {
content: '\\25BC';
margin: -${theme.gridUnit}px 0 0 0;
top: 100%;
left: 0;
text-align: center;
}
/* Eastward tooltips */
.d3-tip.e:after {
content: '\\25C0';
margin: -${theme.gridUnit}px 0 0 0;
top: 50%;
left: -${theme.gridUnit * 2}px;
}
/* Southward tooltips */
.d3-tip.s:after {
content: '\\25B2';
margin: 0;
top: -${theme.gridUnit * 2}px;
left: 0;
text-align: center;
}
/* Westward tooltips */
.d3-tip.w:after {
content: '\\25B6';
margin: -${theme.gridUnit}px 0 0 0px;
top: 50%;
left: 100%;
}
`}
/>
<ReactComponent {...otherProps} />
</div>
);

export default styled(Heatmap)`
${({ theme }) => `
.superset-legacy-chart-heatmap {
position: relative;
top: 0;
left: 0;
height: 100%;
}
.superset-legacy-chart-heatmap .axis text {
font-size: ${theme.typography.sizes.xs}px;
text-rendering: optimizeLegibility;
}
.superset-legacy-chart-heatmap .background-rect {
stroke: ${theme.colors.grayscale.light2};
fill-opacity: 0;
pointer-events: all;
}
.superset-legacy-chart-heatmap .axis path,
.superset-legacy-chart-heatmap .axis line {
fill: none;
stroke: ${theme.colors.grayscale.light2};
shape-rendering: crispEdges;
}
.superset-legacy-chart-heatmap canvas,
.superset-legacy-chart-heatmap img {
image-rendering: optimizeSpeed; /* Older versions of FF */
image-rendering: -moz-crisp-edges; /* FF 6.0+ */
image-rendering: -webkit-optimize-contrast; /* Safari */
image-rendering: -o-crisp-edges; /* OS X & Windows Opera (12.02+) */
image-rendering: pixelated; /* Awesome future-browsers */
-ms-interpolation-mode: nearest-neighbor; /* IE */
}
.superset-legacy-chart-heatmap .legendCells text {
font-size: ${theme.typography.sizes.xs}px;
font-weight: ${theme.typography.weights.normal};
opacity: 0;
}
.superset-legacy-chart-heatmap .legendCells .cell:first-child text {
opacity: 1;
}
.superset-legacy-chart-heatmap .legendCells .cell:last-child text {
opacity: 1;
}
.dashboard .superset-legacy-chart-heatmap .axis text {
font-size: ${theme.typography.sizes.xs}px;
opacity: ${theme.opacity.heavy};
}
`}
`;

This file was deleted.

0 comments on commit ac6b2f2

Please sign in to comment.