@superset-ui/legacy-plugin-chart-time-table/lib/SparklineCell.js

Superset Chart Plugin - Time Table

"use strict";

exports.__esModule = true;
exports.default = void 0;

var _propTypes = _interopRequireDefault(require("prop-types"));

var _react = _interopRequireDefault(require("react"));

var _sparkline = require("@data-ui/sparkline");

var _core = require("@superset-ui/core");

var _react2 = require("@emotion/react");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

const MARGIN = {
  top: 8,
  right: 8,
  bottom: 8,
  left: 8
};
const tooltipProps = {
  style: {
    opacity: 0.8
  },
  offsetTop: 0
};

function getSparklineTextWidth(text) {
  return (0, _core.getTextDimension)({
    text,
    style: {
      fontSize: '12px',
      fontWeight: 200,
      letterSpacing: 0.4
    }
  }).width + 5;
}

function isValidBoundValue(value) {
  return value !== null && value !== undefined && value !== '' && !Number.isNaN(value);
}

class SparklineCell extends _react.default.Component {
  renderHorizontalReferenceLine(value, label) {
    return (0, _react2.jsx)(_sparkline.HorizontalReferenceLine, {
      reference: value,
      labelPosition: "right",
      renderLabel: () => label,
      stroke: "#bbb",
      strokeDasharray: "3 3",
      strokeWidth: 1
    });
  }

  render() {
    const {
      width = 300,
      height = 50,
      data,
      ariaLabel,
      numberFormat = undefined,
      yAxisBounds = [undefined, undefined],
      showYAxis = false,
      renderTooltip = () => (0, _react2.jsx)("div", null)
    } = this.props;
    const yScale = {};
    let hasMinBound = false;
    let hasMaxBound = false;

    if (yAxisBounds) {
      const [minBound, maxBound] = yAxisBounds;
      hasMinBound = isValidBoundValue(minBound);

      if (hasMinBound) {
        yScale.min = minBound;
      }

      hasMaxBound = isValidBoundValue(maxBound);

      if (hasMaxBound) {
        yScale.max = maxBound;
      }
    }

    let min;
    let max;
    let minLabel;
    let maxLabel;
    let labelLength = 0;

    if (showYAxis) {
      const [minBound, maxBound] = yAxisBounds;
      min = hasMinBound ? minBound : data.reduce((acc, current) => Math.min(acc, current), data[0]);
      max = hasMaxBound ? maxBound : data.reduce((acc, current) => Math.max(acc, current), data[0]);
      minLabel = (0, _core.formatNumber)(numberFormat, min);
      maxLabel = (0, _core.formatNumber)(numberFormat, max);
      labelLength = Math.max(getSparklineTextWidth(minLabel), getSparklineTextWidth(maxLabel));
    }

    const margin = { ...MARGIN,
      right: MARGIN.right + labelLength
    };
    return (0, _react2.jsx)(_sparkline.WithTooltip, {
      tooltipProps: tooltipProps,
      hoverStyles: null,
      renderTooltip: renderTooltip
    }, ({
      onMouseLeave,
      onMouseMove,
      tooltipData
    }) => (0, _react2.jsx)(_sparkline.Sparkline, _extends({
      ariaLabel: ariaLabel,
      width: width,
      height: height,
      margin: margin,
      data: data,
      onMouseLeave: onMouseLeave,
      onMouseMove: onMouseMove
    }, yScale), showYAxis && this.renderHorizontalReferenceLine(min, minLabel), showYAxis && this.renderHorizontalReferenceLine(max, maxLabel), (0, _react2.jsx)(_sparkline.LineSeries, {
      showArea: false,
      stroke: "#767676"
    }), tooltipData && (0, _react2.jsx)(_sparkline.VerticalReferenceLine, {
      reference: tooltipData.index,
      strokeDasharray: "3 3",
      strokeWidth: 1
    }), tooltipData && (0, _react2.jsx)(_sparkline.PointSeries, {
      points: [tooltipData.index],
      fill: "#767676",
      strokeWidth: 1
    })));
  }

}

SparklineCell.propTypes = {
  ariaLabel: _propTypes.default.string.isRequired,
  className: _propTypes.default.string,
  height: _propTypes.default.number.isRequired,
  numberFormat: _propTypes.default.string.isRequired,
  renderTooltip: _propTypes.default.func.isRequired,
  showYAxis: _propTypes.default.bool.isRequired,
  width: _propTypes.default.number.isRequired,
  yAxisBounds: _propTypes.default.arrayOf(_propTypes.default.number).isRequired,
  data: _propTypes.default.arrayOf(_propTypes.default.number).isRequired
};
var _default = SparklineCell;
exports.default = _default;