import React from 'react';
import NegativeRuleTooltipIcon from '../icons/NegativeRuleTooltipIcon';
import { useStyles } from './styles';
import i18n from 'ui-i18n';
export var MatchRulesTooltip = function (_a) {
    var _b = _a.isMlMatch, isMlMatch = _b === void 0 ? false : _b, matchRules = _a.matchRules;
    var styles = useStyles();
    var hasMatchRules = matchRules.length > 0;
    var showTitle = !isMlMatch && hasMatchRules;
    return (React.createElement("div", { className: styles.container },
        React.createElement("div", { className: showTitle ? styles.bodyWithMargin : styles.bodyWithoutMargin },
            showTitle && React.createElement("div", { className: styles.title }, i18n.text('Match rules')),
            hasMatchRules
                ? matchRules.map(function (match) { return (React.createElement("div", { key: match.uri },
                    '- ',
                    match.negativeRule && React.createElement(NegativeRuleTooltipIcon, { className: styles.negativeRuleIcon }),
                    match.label)); })
                : null)));
};
