import React from "react";
import styled from "styled-components";
import { Flex, TextNano } from "@netdata/netdata-ui";
const LinearColorScaleBar = styled(Flex).attrs({ width: "120px", height: "12px", round: true }) `
  background: linear-gradient(to right, #c6e3f6, #0e9aff);
`;
const Legend = ({ children }) => (React.createElement(Flex, { "data-testid": "groupBox-legend", gap: 4, alignItems: "center" },
    React.createElement(TextNano, { strong: true }, children),
    React.createElement(Flex, { gap: 2, alignItems: "center" },
        React.createElement(TextNano, null, "0%"),
        React.createElement(LinearColorScaleBar, null),
        React.createElement(TextNano, null, "100%"))));
export default Legend;
//# sourceMappingURL=legend.js.map