@netdata/charts/dist/components/line/legend/heatmapColors.js

Netdata frontend SDK and chart utilities

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;
var _react = _interopRequireDefault(require("react"));
var _styledComponents = _interopRequireDefault(require("styled-components"));
var _netdataUi = require("@netdata/netdata-ui");
var _provider = require("../../provider");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
var LinearColorScaleBar = (0, _styledComponents["default"])(_netdataUi.Flex).attrs({
  width: "320px",
  height: "12px",
  round: true
}).withConfig({
  displayName: "heatmapColors__LinearColorScaleBar",
  componentId: "sc-13fexd8-0"
})(["background:linear-gradient( to right,rgb(62,73,137),rgb(49,104,142),rgb(38,130,142),rgb(31,158,137),rgb(53,183,121),rgb(110,206,88),rgb(181,222,43),rgb(253,231,37) );"]);
var HeatmapColorsLegend = function HeatmapColorsLegend() {
  var chart = (0, _provider.useChart)();
  var max = (0, _provider.useAttributeValue)("max");
  var units = (0, _provider.useUnitSign)();
  (0, _provider.useAttributeValue)("theme"); // rerender on theme change

  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_netdataUi.Flex, {
    "data-testid": "heatmap-legend",
    gap: 2,
    alignItems: "center",
    padding: [2],
    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_netdataUi.TextNano, {
      children: [chart.getConvertedValue(0), " ", units]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(LinearColorScaleBar, {}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_netdataUi.TextNano, {
      children: [chart.getConvertedValue(max), " ", units]
    })]
  });
};
var _default = exports["default"] = HeatmapColorsLegend;