import Link from "../Link/Link";
import useTranslateValue from "../../Utils/Translation";
import React from "react";
const Banner = (props) => {
    const { translateString } = useTranslateValue();
    const translatedTitle = translateString(props.title) || props.title;
    const translatedDescription = translateString(props.description) || props.description;
    const getContent = () => {
        return (React.createElement(React.Fragment, null,
            React.createElement("strong", { className: "font-semibold" }, translatedTitle),
            React.createElement("svg", { viewBox: "0 0 2 2", className: "mx-2 inline h-0.5 w-0.5 fill-current", "aria-hidden": "true" },
                React.createElement("circle", { cx: "1", cy: "1", r: "1" })),
            translatedDescription,
            "\u00A0",
            React.createElement("span", { "aria-hidden": "true" }, "\u2192")));
    };
    return (React.createElement("div", { className: `flex border-gray-200 rounded-xl border-2 py-2.5 px-6 sm:px-3.5 mb-5${props.hideOnMobile ? " hidden md:flex" : ""}` },
        React.createElement("p", { className: "text-sm text-gray-400 hover:text-gray-500" },
            props.link && (React.createElement(Link, { to: props.link, openInNewTab: props.openInNewTab }, getContent())),
            !props.link && getContent())));
};
export default Banner;
//# sourceMappingURL=Banner.js.map