import React from "react";
import { useTranslation } from "react-i18next";
import { twMerge } from "tailwind-merge";
import { ColorIcon } from "@local-logic/design-system";
import * as styles from "./styles";
import { ScoreValue } from "~/sdks/LocalContent/components/ScoreValue";
import { ScoreIcon } from "~/components/ScoreIcon";
export function Score({ scoreKey, scoreValue, backgroundColor, fillColor, className, }) {
    const { t } = useTranslation(["common"]);
    if (scoreKey === null) {
        return null;
    }
    return (React.createElement("div", { className: twMerge(styles.container, className), "data-testid": "score-component" },
        React.createElement("span", { className: styles.title },
            React.createElement(ColorIcon, { element: React.createElement(ScoreIcon, { score: scoreKey }), backgroundColor: backgroundColor, fillColor: fillColor }),
            React.createElement("span", { className: styles.text }, t(`common:scores.${scoreKey}.title`))),
        React.createElement(ScoreValue, { scoreKey: scoreKey, value: scoreValue })));
}
//# sourceMappingURL=index.js.map