@liveblocks/emails 2.21.0 → 2.22.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";
+var PKG_VERSION = "2.22.0";
 var PKG_FORMAT = "cjs";
 
 // ../../node_modules/lib0/map.js
@@ -7368,6 +7368,9 @@ 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) {
@@ -8373,11 +8376,9 @@ async function prepareTextMentionNotificationEmailAsHtml(client, event, options
 
 
 
-// src/comment-body.tsx
-
-
 
 
+// src/comment-body.tsx
 
 
 
@@ -8385,77 +8386,40 @@ async function prepareTextMentionNotificationEmailAsHtml(client, event, 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])
-  };
+async function convertCommentBody(body, options) {
   const resolvedUsers = await _core.resolveUsersInCommentBody.call(void 0, 
     body,
-    _optionalChain([options, 'optionalAccess', _19 => _19.resolveUsers])
+    _optionalChain([options, 'optionalAccess', _17 => _17.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 inline.id ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              Components.Mention,
+            return options.elements.mention(
               {
                 element: inline,
                 user: resolvedUsers.get(inline.id)
               },
-              `lb-comment-body-mention-${inlineIndex}`
-            ) : null;
+              inlineIndex
+            );
           }
           if (_core.isCommentBodyLink.call(void 0, inline)) {
             const href = _nullishCoalesce(_core.toAbsoluteUrl.call(void 0, inline.url), () => ( inline.url));
-            return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              Components.Link,
-              {
-                element: inline,
-                href
-              },
-              `lb-comment-body-link-${inlineIndex}`
+            return options.elements.link(
+              { element: inline, href },
+              inlineIndex
             );
           }
           if (_core.isCommentBodyText.call(void 0, inline)) {
-            return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              Components.Text,
-              {
-                element: inline
-              },
-              `lb-comment-body-text-${inlineIndex}`
-            );
+            return options.elements.text({ element: inline }, inlineIndex);
           }
           return null;
-        });
-        return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Components.Paragraph, { children }, `lb-comment-body-paragraph-${index}`);
+        }).filter(exists);
+        return options.elements.paragraph(
+          { element: block, children },
+          index
+        );
       }
       default:
         console.warn(
@@ -8463,68 +8427,8 @@ async function convertCommentBodyAsReact(body, options) {
         );
         return null;
     }
-  });
-  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;
+  }).filter(exists);
+  return options.elements.container({ children: blocks });
 }
 
 // src/comment-with-body.ts
@@ -8542,6 +8446,7 @@ function filterCommentsWithBody(comments) {
 }
 
 // src/thread-notification.tsx
+
 var getUnreadComments = ({
   comments,
   inboxNotification,
@@ -8595,72 +8500,19 @@ var extractThreadNotificationData = async ({
     comments: unreadComments
   };
 };
-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))
-  };
+async function prepareThreadNotificationEmail(client, event, options, elements, callerName) {
   const data = await extractThreadNotificationData({ client, event });
   if (data === null) {
     return null;
   }
-  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 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))
+  };
   const batchUsersResolver = createBatchUsersResolver({
     resolveUsers: options.resolveUsers,
-    callerName: "prepareThreadNotificationEmailAsHtml"
+    callerName
   });
   switch (data.type) {
     case "unreadMention": {
@@ -8669,16 +8521,20 @@ async function prepareThreadNotificationEmailAsHtml(client, event, options = {})
         userIds: [comment.userId],
         resolveUsers: batchUsersResolver.resolveUsers
       });
-      const commentBodyPromise = convertCommentBodyAsHtml(comment.rawBody, {
+      const commentBodyPromise = convertCommentBody(comment.body, {
         resolveUsers: batchUsersResolver.resolveUsers,
-        styles: options.styles
+        elements
       });
       await batchUsersResolver.resolve();
-      const [authorsInfo, commentBodyHtml] = await Promise.all([
+      const [authorsInfo, commentBody] = 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: {
@@ -8690,10 +8546,10 @@ async function prepareThreadNotificationEmailAsHtml(client, event, options = {})
             info: _nullishCoalesce(authorInfo, () => ( { name: comment.userId }))
           },
           createdAt: comment.createdAt,
-          url: comment.url,
-          htmlBody: commentBodyHtml
+          url,
+          body: commentBody
         },
-        roomInfo: data.roomInfo
+        roomInfo: resolvedRoomInfo
       };
     }
     case "unreadReplies": {
@@ -8703,9 +8559,9 @@ async function prepareThreadNotificationEmailAsHtml(client, event, options = {})
         resolveUsers: batchUsersResolver.resolveUsers
       });
       const commentBodiesPromises = comments.map(
-        (c) => convertCommentBodyAsHtml(c.rawBody, {
+        (c) => convertCommentBody(c.body, {
           resolveUsers: batchUsersResolver.resolveUsers,
-          styles: options.styles
+          elements
         })
       );
       await batchUsersResolver.resolve();
@@ -8717,7 +8573,11 @@ async function prepareThreadNotificationEmailAsHtml(client, event, options = {})
         type: "unreadReplies",
         comments: comments.map((comment, index) => {
           const authorInfo = authorsInfo.get(comment.userId);
-          const commentBodyHtml = commentBodies[index];
+          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;
           return {
             id: comment.id,
             threadId: comment.threadId,
@@ -8727,98 +8587,179 @@ async function prepareThreadNotificationEmailAsHtml(client, event, options = {})
               info: _nullishCoalesce(authorInfo, () => ( { name: comment.userId }))
             },
             createdAt: comment.createdAt,
-            url: comment.url,
-            htmlBody: _nullishCoalesce(commentBodyHtml, () => ( ""))
+            url,
+            body: commentBody
           };
         }),
-        roomInfo: data.roomInfo
+        roomInfo: resolvedRoomInfo
       };
     }
   }
 }
-async function prepareThreadNotificationEmailAsReact(client, event, options = {}) {
-  const data = await prepareThreadNotificationEmailBaseData({
+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,
-    options: { resolveRoomInfo: options.resolveRoomInfo }
-  });
+    {
+      resolveUsers: options.resolveUsers,
+      resolveRoomInfo: options.resolveRoomInfo
+    },
+    {
+      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>`;
+      }
+    },
+    "prepareThreadNotificationEmailAsHtml"
+  );
   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 {
-        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
+        ...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(
+    client,
+    event,
+    {
+      resolveUsers: options.resolveUsers,
+      resolveRoomInfo: options.resolveRoomInfo
+    },
+    {
+      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
         },
-        roomInfo: data.roomInfo
+        `lb-comment-body-mention-${index}`
+      ) : null
+    },
+    "prepareThreadNotificationEmailAsReact"
+  );
+  if (data === null) {
+    return null;
+  }
+  switch (data.type) {
+    case "unreadMention": {
+      return {
+        ...data,
+        comment: { ...data.comment, reactBody: data.comment.body }
       };
     }
     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 {
-        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
+        ...data,
+        comments: data.comments.map((comment) => ({
+          ...comment,
+          reactBody: comment.body
+        }))
       };
     }
   }