import * as React from "react";
import * as cx from "classnames";
import * as FontAwesome from "react-fontawesome";
import { FlexBox } from "../";
import "./DeletedMessagingBubble.less";
function cssClass(element) {
    return "DeletedMessagingBubble--" + element;
}
/**
 * @deprecated Do not use. Instead, use [@clever/msg-bubble DeletedBubble](https://github.com/Clever/clever-ui/blob/master/packages/msg-bubble/src/lib/deleted/DeletedBubble.tsx)
 */
export var DeletedMessagingBubble = function (_a) {
    var className = _a.className, messageOwnership = _a.messageOwnership, deletionNoticeText = _a.deletionNoticeText;
    return (React.createElement(FlexBox, { className: cssClass("Container--" + messageOwnership) },
        React.createElement(FlexBox, { alignItems: "center", justify: "start", className: cx(cssClass("Message"), className) },
            React.createElement(FontAwesome, { name: "trash-o", className: cssClass("icon"), "aria-hidden": "true" }),
            React.createElement("div", { className: cssClass("text") }, deletionNoticeText))));
};
