import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useIntl } from "react-intl";
import { olpGranteeRowMessages } from "../../locales.js";
import { bem } from "../@utils/bem.js";
import { UiGranteeAvatar } from "../UiGranteeAvatar/UiGranteeAvatar.js";
import { UiTag } from "../UiTag/UiTag.js";
const { b, e } = bem("gd-ui-kit-grantee-row");
/**
 * Grantee row used by the OLP share dialog. Renders avatar + name + optional
 * email subline + optional "Owner" tag + trailing controls slot.
 *
 * @internal
 */
export function UiGranteeRow({ kind, name, email, isOwner, isPending, controls, dataTestId, }) {
    const intl = useIntl();
    return (_jsxs("div", { className: b({ pending: Boolean(isPending) }), "data-testid": dataTestId, children: [
            _jsx(UiGranteeAvatar, { kind: kind, decorative: true }), _jsxs("div", { className: e("text"), children: [
                    _jsx("span", { className: e("name"), title: name, children: name }), email ? (_jsx("span", { className: e("email"), title: email, children: email })) : null] }), isOwner ? (_jsx(UiTag, { label: intl.formatMessage(olpGranteeRowMessages.ownerTag), size: "small", variant: "solid" })) : null, controls] }));
}
