// tmp-babel/comments/web/CommentItem/CommentReplyButton/index.js
import { IconButton } from "@baseapp-frontend/design-system/components/web/buttons";
import { CommentReplyIcon } from "@baseapp-frontend/design-system/components/web/icons";
import { Typography } from "@mui/material";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
var CommentReplyButton = function CommentReplyButton2(_ref) {
  var onReply = _ref.onReply, isLoadingReplies = _ref.isLoadingReplies, totalCommentsCount = _ref.totalCommentsCount, commentId = _ref.commentId;
  return /* @__PURE__ */ _jsxs("div", {
    className: "grid grid-cols-[repeat(2,minmax(20px,max-content))] gap-1",
    children: [/* @__PURE__ */ _jsx(IconButton, {
      onClick: onReply,
      isLoading: isLoadingReplies,
      "aria-label": "reply to comment ".concat(commentId),
      children: /* @__PURE__ */ _jsx(CommentReplyIcon, {})
    }), /* @__PURE__ */ _jsx(Typography, {
      variant: "caption",
      color: "text.secondary",
      "aria-label": "replies count ".concat(commentId),
      children: totalCommentsCount !== null && totalCommentsCount !== void 0 ? totalCommentsCount : 0
    })]
  });
};
var CommentReplyButton_default = CommentReplyButton;

export {
  CommentReplyButton_default
};
//# sourceMappingURL=chunk-XBWD5725.mjs.map