@octopusdeploy/design-system-components/dist/src/components/Chart/ChartTooltip.js

The design systems component library.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ChartTooltip = ChartTooltip;
const jsx_runtime_1 = require("react/jsx-runtime");
const css_1 = require("@emotion/css");
const design_system_tokens_1 = require("@octopusdeploy/design-system-tokens");
function ChartTooltip({ children, ...props }) {
    if (props.active && props.payload && props.payload.length) {
        const { payload, ...rest } = props;
        const payloadArray = payload
            .filter((p) => p.payload !== undefined)
            .map((p) => {
            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
            const path = p.dataKey;
            return {
                ...p,
                payload: p.payload,
                dataKey: path,
            };
        });
        return (0, jsx_runtime_1.jsx)("div", { className: chartTooltipStyles, children: children({ ...rest, payload: payloadArray }) });
    }
    return null;
}
const chartTooltipStyles = (0, css_1.css)({
    padding: design_system_tokens_1.space[16],
    backgroundColor: "rgba(0,0,0,0.7)",
    borderRadius: design_system_tokens_1.borderRadius.medium,
});