@liveblocks/emails 2.21.0-emails2 → 2.21.0

package/dist/index.cjs

@@ -3,7 +3,7 @@ var _core = require('@liveblocks/core');
 
 // src/version.ts
 var PKG_NAME = "@liveblocks/emails";
-var PKG_VERSION = "2.21.0-emails2";
+var PKG_VERSION = "2.21.0";
 var PKG_FORMAT = "cjs";
 
 // ../../node_modules/lib0/map.js
@@ -7368,9 +7368,6 @@ var isString = (value) => {
 var isMentionNodeAttributeId = (value) => {
   return isString(value) && value.startsWith("in_");
 };
-var exists = (input) => {
-  return input !== null && input !== void 0;
-};
 
 // src/lexical-editor.ts
 function createSerializedLexicalMapNode(item) {
@@ -8376,9 +8373,11 @@ async function prepareTextMentionNotificationEmailAsHtml(client, event, options
 
 
 
+// src/comment-body.tsx
+
+
 
 
-// src/comment-body.tsx
 
 
 
@@ -8386,40 +8385,77 @@ async function prepareTextMentionNotificationEmailAsHtml(client, event, options
 
 
 
-async function convertCommentBody(body, options) {
+var baseComponents2 = {
+  Container: ({ children }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { children }),
+  Paragraph: ({ children }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { children }),
+  Text: ({ element }) => {
+    let children = element.text;
+    if (element.bold) {
+      children = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "strong", { children });
+    }
+    if (element.italic) {
+      children = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "em", { children });
+    }
+    if (element.strikethrough) {
+      children = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "s", { children });
+    }
+    if (element.code) {
+      children = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "code", { children });
+    }
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { children });
+  },
+  Link: ({ element, href }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "a", { href, target: "_blank", rel: "noopener noreferrer", children: _nullishCoalesce(element.text, () => ( element.url)) }),
+  Mention: ({ element, user }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { "data-mention": true, children: [
+    MENTION_CHARACTER,
+    _nullishCoalesce(_optionalChain([user, 'optionalAccess', _17 => _17.name]), () => ( element.id))
+  ] })
+};
+async function convertCommentBodyAsReact(body, options) {
+  const Components = {
+    ...baseComponents2,
+    ..._optionalChain([options, 'optionalAccess', _18 => _18.components])
+  };
   const resolvedUsers = await _core.resolveUsersInCommentBody.call(void 0, 
     body,
-    _optionalChain([options, 'optionalAccess', _17 => _17.resolveUsers])
+    _optionalChain([options, 'optionalAccess', _19 => _19.resolveUsers])
   );
   const blocks = body.content.map((block, index) => {
     switch (block.type) {
       case "paragraph": {
         const children = block.children.map((inline, inlineIndex) => {
           if (_core.isCommentBodyMention.call(void 0, inline)) {
-            return options.elements.mention(
+            return inline.id ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              Components.Mention,
               {
                 element: inline,
                 user: resolvedUsers.get(inline.id)
               },
-              inlineIndex
-            );
+              `lb-comment-body-mention-${inlineIndex}`
+            ) : null;
           }
           if (_core.isCommentBodyLink.call(void 0, inline)) {
             const href = _nullishCoalesce(_core.toAbsoluteUrl.call(void 0, inline.url), () => ( inline.url));
-            return options.elements.link(
-              { element: inline, href },
-              inlineIndex
+            return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              Components.Link,
+              {
+                element: inline,
+                href
+              },
+              `lb-comment-body-link-${inlineIndex}`
             );
           }
           if (_core.isCommentBodyText.call(void 0, inline)) {
-            return options.elements.text({ element: inline }, inlineIndex);
+            return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              Components.Text,
+              {
+                element: inline
+              },
+              `lb-comment-body-text-${inlineIndex}`
+            );
           }
           return null;
-        }).filter(exists);
-        return options.elements.paragraph(
-          { element: block, children },
-          index
-        );
+        });
+        return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Components.Paragraph, { children }, `lb-comment-body-paragraph-${index}`);
       }
       default:
         console.warn(
@@ -8427,8 +8463,68 @@ async function convertCommentBody(body, options) {
         );
         return null;
     }
-  }).filter(exists);
-  return options.elements.container({ children: blocks });
+  });
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Components.Container, { children: blocks }, "lb-comment-body-container");
+}
+var baseStyles2 = {
+  paragraph: {
+    fontSize: "14px"
+  },
+  strong: {
+    fontWeight: 500
+  },
+  code: {
+    fontFamily: 'ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Mono", "Source Code Pro", "Fira Mono", "Droid Sans Mono", "Consolas", "Courier New", monospace',
+    backgroundColor: "rgba(0,0,0,0.05)",
+    border: "solid 1px rgba(0,0,0,0.1)",
+    borderRadius: "4px"
+  },
+  mention: {
+    color: "blue"
+  },
+  link: {
+    textDecoration: "underline"
+  }
+};
+async function convertCommentBodyAsHtml(body, options) {
+  const styles = { ...baseStyles2, ..._optionalChain([options, 'optionalAccess', _20 => _20.styles]) };
+  const htmlBody = await _core.stringifyCommentBody.call(void 0, body, {
+    format: "html",
+    resolveUsers: _optionalChain([options, 'optionalAccess', _21 => _21.resolveUsers]),
+    elements: {
+      // NOTE: using prettier-ignore to preserve template strings
+      paragraph: ({ children }) => (
+        // prettier-ignore
+        children ? _core.html`<p style="${toInlineCSSString(styles.paragraph)}">${_core.htmlSafe.call(void 0, children)}</p>` : children
+      ),
+      text: ({ element }) => {
+        let children = element.text;
+        if (!children) {
+          return _core.html`${children}`;
+        }
+        if (element.bold) {
+          children = _core.html`<strong style="${toInlineCSSString(styles.strong)}">${children}</strong>`;
+        }
+        if (element.italic) {
+          children = _core.html`<em>${children}</em>`;
+        }
+        if (element.strikethrough) {
+          children = _core.html`<s>${children}</s>`;
+        }
+        if (element.code) {
+          children = _core.html`<code style="${toInlineCSSString(styles.code)}">${children}</code>`;
+        }
+        return _core.html`${children}`;
+      },
+      link: ({ element, href }) => {
+        return _core.html`<a href="${href}" target="_blank" rel="noopener noreferrer" style="${toInlineCSSString(styles.link)}">${element.text ? _core.html`${element.text}` : element.url}</a>`;
+      },
+      mention: ({ element, user }) => {
+        return _core.html`<span data-mention style="${toInlineCSSString(styles.mention)}">${MENTION_CHARACTER}${_optionalChain([user, 'optionalAccess', _22 => _22.name]) ? _core.html`${_optionalChain([user, 'optionalAccess', _23 => _23.name])}` : element.id}</span>`;
+      }
+    }
+  });
+  return htmlBody;
 }
 
 // src/comment-with-body.ts
@@ -8446,7 +8542,6 @@ function filterCommentsWithBody(comments) {
 }
 
 // src/thread-notification.tsx
-
 var getUnreadComments = ({
   comments,
   inboxNotification,
@@ -8500,19 +8595,72 @@ var extractThreadNotificationData = async ({
     comments: unreadComments
   };
 };
-async function prepareThreadNotificationEmail(client, event, options) {
+var makeCommentEmailBaseData = ({
+  roomInfo,
+  comment
+}) => {
+  const url = _optionalChain([roomInfo, 'optionalAccess', _24 => _24.url]) ? _core.generateCommentUrl.call(void 0, {
+    roomUrl: _optionalChain([roomInfo, 'optionalAccess', _25 => _25.url]),
+    commentId: comment.id
+  }) : void 0;
+  return {
+    id: comment.id,
+    userId: comment.userId,
+    threadId: comment.threadId,
+    roomId: comment.roomId,
+    createdAt: comment.createdAt,
+    url,
+    rawBody: comment.body
+  };
+};
+var prepareThreadNotificationEmailBaseData = async ({
+  client,
+  event,
+  options = {}
+}) => {
+  const { roomId } = event.data;
+  const roomInfo = options.resolveRoomInfo ? await options.resolveRoomInfo({ roomId }) : void 0;
+  const resolvedRoomInfo = {
+    ...roomInfo,
+    name: _nullishCoalesce(_optionalChain([roomInfo, 'optionalAccess', _26 => _26.name]), () => ( roomId))
+  };
   const data = await extractThreadNotificationData({ client, event });
   if (data === null) {
     return null;
   }
-  const roomInfo = options.resolveRoomInfo ? await options.resolveRoomInfo({ roomId: event.data.roomId }) : void 0;
-  const resolvedRoomInfo = {
-    ...roomInfo,
-    name: _nullishCoalesce(_optionalChain([roomInfo, 'optionalAccess', _18 => _18.name]), () => ( event.data.roomId))
-  };
+  switch (data.type) {
+    case "unreadMention":
+      return {
+        type: "unreadMention",
+        comment: makeCommentEmailBaseData({
+          roomInfo,
+          comment: data.comment
+        }),
+        roomInfo: resolvedRoomInfo
+      };
+    case "unreadReplies": {
+      return {
+        type: "unreadReplies",
+        comments: data.comments.map(
+          (comment) => makeCommentEmailBaseData({ roomInfo, comment })
+        ),
+        roomInfo: resolvedRoomInfo
+      };
+    }
+  }
+};
+async function prepareThreadNotificationEmailAsHtml(client, event, options = {}) {
+  const data = await prepareThreadNotificationEmailBaseData({
+    client,
+    event,
+    options: { resolveRoomInfo: options.resolveRoomInfo }
+  });
+  if (data === null) {
+    return null;
+  }
   const batchUsersResolver = createBatchUsersResolver({
     resolveUsers: options.resolveUsers,
-    callerName: "prepareThreadNotificationEmail"
+    callerName: "prepareThreadNotificationEmailAsHtml"
   });
   switch (data.type) {
     case "unreadMention": {
@@ -8521,20 +8669,16 @@ async function prepareThreadNotificationEmail(client, event, options) {
         userIds: [comment.userId],
         resolveUsers: batchUsersResolver.resolveUsers
       });
-      const commentBodyPromise = convertCommentBody(comment.body, {
+      const commentBodyPromise = convertCommentBodyAsHtml(comment.rawBody, {
         resolveUsers: batchUsersResolver.resolveUsers,
-        elements: options.elements
+        styles: options.styles
       });
       await batchUsersResolver.resolve();
-      const [authorsInfo, commentBody] = await Promise.all([
+      const [authorsInfo, commentBodyHtml] = await Promise.all([
         authorsInfoPromise,
         commentBodyPromise
       ]);
       const authorInfo = authorsInfo.get(comment.userId);
-      const url = _optionalChain([roomInfo, 'optionalAccess', _19 => _19.url]) ? _core.generateCommentUrl.call(void 0, {
-        roomUrl: _optionalChain([roomInfo, 'optionalAccess', _20 => _20.url]),
-        commentId: comment.id
-      }) : void 0;
       return {
         type: "unreadMention",
         comment: {
@@ -8546,10 +8690,10 @@ async function prepareThreadNotificationEmail(client, event, options) {
             info: _nullishCoalesce(authorInfo, () => ( { name: comment.userId }))
           },
           createdAt: comment.createdAt,
-          url,
-          body: commentBody
+          url: comment.url,
+          htmlBody: commentBodyHtml
         },
-        roomInfo: resolvedRoomInfo
+        roomInfo: data.roomInfo
       };
     }
     case "unreadReplies": {
@@ -8559,9 +8703,9 @@ async function prepareThreadNotificationEmail(client, event, options) {
         resolveUsers: batchUsersResolver.resolveUsers
       });
       const commentBodiesPromises = comments.map(
-        (c) => convertCommentBody(c.body, {
+        (c) => convertCommentBodyAsHtml(c.rawBody, {
           resolveUsers: batchUsersResolver.resolveUsers,
-          elements: options.elements
+          styles: options.styles
         })
       );
       await batchUsersResolver.resolve();
@@ -8573,11 +8717,7 @@ async function prepareThreadNotificationEmail(client, event, options) {
         type: "unreadReplies",
         comments: comments.map((comment, index) => {
           const authorInfo = authorsInfo.get(comment.userId);
-          const commentBody = commentBodies[index];
-          const url = _optionalChain([roomInfo, 'optionalAccess', _21 => _21.url]) ? _core.generateCommentUrl.call(void 0, {
-            roomUrl: _optionalChain([roomInfo, 'optionalAccess', _22 => _22.url]),
-            commentId: comment.id
-          }) : void 0;
+          const commentBodyHtml = commentBodies[index];
           return {
             id: comment.id,
             threadId: comment.threadId,
@@ -8587,177 +8727,98 @@ async function prepareThreadNotificationEmail(client, event, options) {
               info: _nullishCoalesce(authorInfo, () => ( { name: comment.userId }))
             },
             createdAt: comment.createdAt,
-            url,
-            body: commentBody
+            url: comment.url,
+            htmlBody: _nullishCoalesce(commentBodyHtml, () => ( ""))
           };
         }),
-        roomInfo: resolvedRoomInfo
+        roomInfo: data.roomInfo
       };
     }
   }
 }
-var baseStyles2 = {
-  paragraph: {
-    fontSize: "14px"
-  },
-  strong: {
-    fontWeight: 500
-  },
-  code: {
-    fontFamily: 'ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Mono", "Source Code Pro", "Fira Mono", "Droid Sans Mono", "Consolas", "Courier New", monospace',
-    backgroundColor: "rgba(0,0,0,0.05)",
-    border: "solid 1px rgba(0,0,0,0.1)",
-    borderRadius: "4px"
-  },
-  mention: {
-    color: "blue"
-  },
-  link: {
-    textDecoration: "underline"
-  }
-};
-async function prepareThreadNotificationEmailAsHtml(client, event, options = {}) {
-  const styles = { ...baseStyles2, ..._optionalChain([options, 'optionalAccess', _23 => _23.styles]) };
-  const data = await prepareThreadNotificationEmail(
-    client,
-    event,
-    {
-      resolveUsers: options.resolveUsers,
-      resolveRoomInfo: options.resolveRoomInfo,
-      elements: {
-        container: ({ children }) => children.join("\n"),
-        paragraph: ({ children }) => {
-          const unsafe = children.join("");
-          return unsafe ? _core.html`<p style="${toInlineCSSString(styles.paragraph)}">${_core.htmlSafe.call(void 0, unsafe)}</p>` : unsafe;
-        },
-        text: ({ element }) => {
-          let children = element.text;
-          if (!children) {
-            return _core.html`${children}`;
-          }
-          if (element.bold) {
-            children = _core.html`<strong style="${toInlineCSSString(styles.strong)}">${children}</strong>`;
-          }
-          if (element.italic) {
-            children = _core.html`<em>${children}</em>`;
-          }
-          if (element.strikethrough) {
-            children = _core.html`<s>${children}</s>`;
-          }
-          if (element.code) {
-            children = _core.html`<code style="${toInlineCSSString(styles.code)}">${children}</code>`;
-          }
-          return _core.html`${children}`;
-        },
-        link: ({ element, href }) => {
-          return _core.html`<a href="${href}" target="_blank" rel="noopener noreferrer" style="${toInlineCSSString(styles.link)}">${element.text ? _core.html`${element.text}` : element.url}</a>`;
-        },
-        mention: ({ element, user }) => {
-          return _core.html`<span data-mention style="${toInlineCSSString(styles.mention)}">${MENTION_CHARACTER}${_optionalChain([user, 'optionalAccess', _24 => _24.name]) ? _core.html`${_optionalChain([user, 'optionalAccess', _25 => _25.name])}` : element.id}</span>`;
-        }
-      }
-    }
-  );
-  if (data === null) {
-    return null;
-  }
-  switch (data.type) {
-    case "unreadMention": {
-      return {
-        ...data,
-        comment: { ...data.comment, htmlBody: data.comment.body }
-      };
-    }
-    case "unreadReplies": {
-      return {
-        ...data,
-        comments: data.comments.map((comment) => ({
-          ...comment,
-          htmlBody: comment.body
-        }))
-      };
-    }
-  }
-}
-var baseComponents2 = {
-  Container: ({ children }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { children }),
-  Paragraph: ({ children }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { children }),
-  Text: ({ element }) => {
-    let children = element.text;
-    if (element.bold) {
-      children = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "strong", { children });
-    }
-    if (element.italic) {
-      children = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "em", { children });
-    }
-    if (element.strikethrough) {
-      children = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "s", { children });
-    }
-    if (element.code) {
-      children = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "code", { children });
-    }
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { children });
-  },
-  Link: ({ element, href }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "a", { href, target: "_blank", rel: "noopener noreferrer", children: _nullishCoalesce(element.text, () => ( element.url)) }),
-  Mention: ({ element, user }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { "data-mention": true, children: [
-    MENTION_CHARACTER,
-    _nullishCoalesce(_optionalChain([user, 'optionalAccess', _26 => _26.name]), () => ( element.id))
-  ] })
-};
 async function prepareThreadNotificationEmailAsReact(client, event, options = {}) {
-  const Components = { ...baseComponents2, ..._optionalChain([options, 'optionalAccess', _27 => _27.components]) };
-  const data = await prepareThreadNotificationEmail(
+  const data = await prepareThreadNotificationEmailBaseData({
     client,
     event,
-    {
-      resolveUsers: options.resolveUsers,
-      resolveRoomInfo: options.resolveRoomInfo,
-      elements: {
-        container: ({ children }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Components.Container, { children }, "lb-comment-body-container"),
-        paragraph: ({ children }, index) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Components.Paragraph, { children }, `lb-comment-body-paragraph-${index}`),
-        text: ({ element }, index) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          Components.Text,
-          {
-            element
-          },
-          `lb-comment-body-text-${index}`
-        ),
-        link: ({ element, href }, index) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          Components.Link,
-          {
-            element,
-            href
-          },
-          `lb-comment-body-link-${index}`
-        ),
-        mention: ({ element, user }, index) => element.id ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          Components.Mention,
-          {
-            element,
-            user
-          },
-          `lb-comment-body-mention-${index}`
-        ) : null
-      }
-    }
-  );
+    options: { resolveRoomInfo: options.resolveRoomInfo }
+  });
   if (data === null) {
     return null;
   }
+  const batchUsersResolver = createBatchUsersResolver({
+    resolveUsers: options.resolveUsers,
+    callerName: "prepareThreadNotificationEmailAsReact"
+  });
   switch (data.type) {
     case "unreadMention": {
+      const { comment } = data;
+      const authorsInfoPromise = resolveAuthorsInfo({
+        userIds: [comment.userId],
+        resolveUsers: batchUsersResolver.resolveUsers
+      });
+      const commentBodyPromise = convertCommentBodyAsReact(comment.rawBody, {
+        resolveUsers: batchUsersResolver.resolveUsers,
+        components: options.components
+      });
+      await batchUsersResolver.resolve();
+      const [authorsInfo, commentBodyReact] = await Promise.all([
+        authorsInfoPromise,
+        commentBodyPromise
+      ]);
+      const authorInfo = authorsInfo.get(comment.userId);
       return {
-        ...data,
-        comment: { ...data.comment, reactBody: data.comment.body }
+        type: "unreadMention",
+        comment: {
+          id: comment.id,
+          threadId: comment.threadId,
+          roomId: comment.roomId,
+          author: {
+            id: comment.userId,
+            info: _nullishCoalesce(authorInfo, () => ( { name: comment.userId }))
+          },
+          createdAt: comment.createdAt,
+          url: comment.url,
+          reactBody: commentBodyReact
+        },
+        roomInfo: data.roomInfo
       };
     }
     case "unreadReplies": {
+      const { comments } = data;
+      const authorsInfoPromise = resolveAuthorsInfo({
+        userIds: comments.map((c) => c.userId),
+        resolveUsers: batchUsersResolver.resolveUsers
+      });
+      const commentBodiesPromises = comments.map(
+        (c) => convertCommentBodyAsReact(c.rawBody, {
+          resolveUsers: batchUsersResolver.resolveUsers,
+          components: options.components
+        })
+      );
+      await batchUsersResolver.resolve();
+      const [authorsInfo, ...commentBodies] = await Promise.all([
+        authorsInfoPromise,
+        ...commentBodiesPromises
+      ]);
       return {
-        ...data,
-        comments: data.comments.map((comment) => ({
-          ...comment,
-          reactBody: comment.body
-        }))
+        type: "unreadReplies",
+        comments: comments.map((comment, index) => {
+          const authorInfo = authorsInfo.get(comment.userId);
+          const commentBodyReact = commentBodies[index];
+          return {
+            id: comment.id,
+            threadId: comment.threadId,
+            roomId: comment.roomId,
+            author: {
+              id: comment.userId,
+              info: _nullishCoalesce(authorInfo, () => ( { name: comment.userId }))
+            },
+            createdAt: comment.createdAt,
+            url: comment.url,
+            reactBody: _nullishCoalesce(commentBodyReact, () => ( null))
+          };
+        }),
+        roomInfo: data.roomInfo
       };
     }
   }