@liveblocks/react-ui/dist/primitives/Comment/index.cjs

A set of React pre-built components for the Liveblocks products. Liveblocks is the all-in-one toolkit to build collaborative products like Figma, Notion, and more.

'use strict';

var jsxRuntime = require('react/jsx-runtime');
var reactSlot = require('@radix-ui/react-slot');
var react = require('react');
var mentions = require('../../slate/plugins/mentions.cjs');
var utils = require('./utils.cjs');

const COMMENT_MENTION_NAME = "CommentMention";
const COMMENT_BODY_NAME = "CommentBody";
const COMMENT_LINK_NAME = "CommentLink";
const CommentMention = react.forwardRef(
  ({ children, asChild, ...props }, forwardedRef) => {
    const Component = asChild ? reactSlot.Slot : "span";
    return /* @__PURE__ */ jsxRuntime.jsx(Component, {
      ...props,
      ref: forwardedRef,
      children
    });
  }
);
const CommentLink = react.forwardRef(
  ({ children, asChild, ...props }, forwardedRef) => {
    const Component = asChild ? reactSlot.Slot : "a";
    return /* @__PURE__ */ jsxRuntime.jsx(Component, {
      target: "_blank",
      rel: "noopener noreferrer nofollow",
      ...props,
      ref: forwardedRef,
      children
    });
  }
);
const defaultBodyComponents = {
  Mention: ({ userId }) => {
    return /* @__PURE__ */ jsxRuntime.jsxs(CommentMention, {
      children: [
        mentions.MENTION_CHARACTER,
        userId
      ]
    });
  },
  Link: ({ href, children }) => {
    return /* @__PURE__ */ jsxRuntime.jsx(CommentLink, {
      href,
      children
    });
  }
};
const CommentBody = react.forwardRef(
  ({ body, components, style, asChild, ...props }, forwardedRef) => {
    const Component = asChild ? reactSlot.Slot : "div";
    const { Mention, Link } = react.useMemo(
      () => ({ ...defaultBodyComponents, ...components }),
      [components]
    );
    if (!body || !body?.content) {
      return null;
    }
    return /* @__PURE__ */ jsxRuntime.jsx(Component, {
      ...props,
      style: { whiteSpace: "break-spaces", ...style },
      ref: forwardedRef,
      children: body.content.map((block, index) => {
        switch (block.type) {
          case "paragraph":
            return /* @__PURE__ */ jsxRuntime.jsx("p", {
              style: { minHeight: "1lh" },
              children: block.children.map((inline, index2) => {
                if (utils.isCommentBodyMention(inline)) {
                  return inline.id ? /* @__PURE__ */ jsxRuntime.jsx(Mention, {
                    userId: inline.id
                  }, index2) : null;
                }
                if (utils.isCommentBodyLink(inline)) {
                  const href = utils.toAbsoluteUrl(inline.url) ?? inline.url;
                  return /* @__PURE__ */ jsxRuntime.jsx(Link, {
                    href,
                    children: inline.text ?? inline.url
                  }, index2);
                }
                let children = inline.text;
                if (inline.bold) {
                  children = /* @__PURE__ */ jsxRuntime.jsx("strong", {
                    children
                  }, index2);
                }
                if (inline.italic) {
                  children = /* @__PURE__ */ jsxRuntime.jsx("em", {
                    children
                  }, index2);
                }
                if (inline.strikethrough) {
                  children = /* @__PURE__ */ jsxRuntime.jsx("s", {
                    children
                  }, index2);
                }
                if (inline.code) {
                  children = /* @__PURE__ */ jsxRuntime.jsx("code", {
                    children
                  }, index2);
                }
                return /* @__PURE__ */ jsxRuntime.jsx("span", {
                  children
                }, index2);
              })
            }, index);
          default:
            return null;
        }
      })
    });
  }
);
if (process.env.NODE_ENV !== "production") {
  CommentBody.displayName = COMMENT_BODY_NAME;
  CommentMention.displayName = COMMENT_MENTION_NAME;
  CommentLink.displayName = COMMENT_LINK_NAME;
}

exports.Body = CommentBody;
exports.Link = CommentLink;
exports.Mention = CommentMention;
//# sourceMappingURL=index.cjs.map