🐛(frontend) convert newlines to <br> in styled text (#577)

BlockNote represents Shift+Enter hard breaks as \n characters
within StyledText.text rather than as separate inline content
nodes. The email exporter was rendering text as-is, causing
line breaks to be lost in the exported HTML.

Author: jbpenrath

src/frontend/src/features/blocknote/email-exporter/index.test.tsx

@@ -260,6 +260,25 @@ describe('EmailExporter', () => {
       ]);
       expect(html).toContain('background-color:#fbf3db');
     });
+
+    it('renders hard breaks (Shift+Enter) as <br>', () => {
+      const html = exportBlocks([
+        paragraph([styledText('Line one\nLine two')]),
+      ]);
+      expect(html).toContain('Line one');
+      expect(html).toContain('<br/>');
+      expect(html).toContain('Line two');
+    });
+
+    it('renders hard breaks within styled text as <br>', () => {
+      const html = exportBlocks([
+        paragraph([styledText('Bold line one\nBold line two', { bold: true })]),
+      ]);
+      expect(html).toContain('font-weight:bold');
+      expect(html).toContain('Bold line one');
+      expect(html).toContain('<br/>');
+      expect(html).toContain('Bold line two');
+    });
   });
 
   // -----------------------------------------------------------------------

src/frontend/src/features/blocknote/email-exporter/index.tsx

@@ -117,12 +117,26 @@ function styleOrUndefined(style: CSSProperties): CSSProperties | undefined {
 // Inline content rendering
 // ---------------------------------------------------------------------------
 
+function textWithBreaks(text: string): React.ReactNode {
+    if (!text.includes('\n')) {
+        return text;
+    }
+    const parts = text.split('\n');
+    return parts.map((part, i) => (
+        <React.Fragment key={i}>
+            {part}
+            {i < parts.length - 1 && <br />}
+        </React.Fragment>
+    ));
+}
+
 function renderStyledText(st: AnyStyledText, key: number): React.ReactNode {
     const style = inlineStylesToCSS(st.styles);
+    const content = textWithBreaks(st.text);
     if (Object.keys(style).length === 0) {
-        return st.text;
+        return <React.Fragment key={key}>{content}</React.Fragment>;
     }
-    return <span key={key} style={style}>{st.text}</span>;
+    return <span key={key} style={style}>{content}</span>;
 }
 
 function renderInlineContent(content: AnyInlineContent[]): React.ReactNode[] {