import useTranslateValue from "../../Utils/Translation";
import React from "react";
export var TopAlertType;
(function (TopAlertType) {
    TopAlertType["INFO"] = "bg-indigo-700";
    TopAlertType["WARNING"] = "bg-yellow-700";
    TopAlertType["DANGER"] = "bg-red-700";
    TopAlertType["SUCCESS"] = "bg-green-700";
})(TopAlertType || (TopAlertType = {}));
const TopAlert = (props) => {
    var _a, _b;
    const { translateString, translateValue } = useTranslateValue();
    const translatedTitle = (_a = translateString(props.title)) !== null && _a !== void 0 ? _a : props.title;
    const translatedDescription = (_b = translateValue(props.description)) !== null && _b !== void 0 ? _b : props.description;
    const alertType = props.alertType || TopAlertType.INFO;
    return (React.createElement("div", { className: `flex items-center text-center gap-x-6 ${alertType.toString()} px-6 py-2.5 sm:px-3.5`, role: "alert", "aria-live": "polite" },
        React.createElement("div", { className: "text-sm leading-6 text-white w-full" },
            React.createElement("div", { className: "w-full" },
                React.createElement("strong", { className: "font-semibold" }, translatedTitle),
                "\u00A0-\u00A0",
                translatedDescription,
                " \u00A0\u00A0"))));
};
export default TopAlert;
//# sourceMappingURL=TopAlert.js.map