From 5080fddf514ac4f58c3527868d4201d2093bba60 Mon Sep 17 00:00:00 2001
From: Andrea Accardo <hackardo@gmail.com>
Date: Mon, 29 Jun 2026 03:25:55 +0200
Subject: [PATCH] bugfix: fix list break with marker (#3177) (#3178)

* bugfix: fix list break with marker (#3177)

Signed-off-by: aaccardo <hackardo@gmail.com>

* refactor: fix code smell

Signed-off-by: aaccardo <hackardo@gmail.com>

---------

Signed-off-by: aaccardo <hackardo@gmail.com>
---
 packages/pdf/src/templates/shared/rich-text.tsx | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/packages/pdf/src/templates/shared/rich-text.tsx b/packages/pdf/src/templates/shared/rich-text.tsx
index 29514e243..c305b2b5d 100644
--- a/packages/pdf/src/templates/shared/rich-text.tsx
+++ b/packages/pdf/src/templates/shared/rich-text.tsx
@@ -60,6 +60,11 @@ const applyRtlDirectionRecursively = (node: ReactNode): ReactNode => {
 export const RichText = ({ children }: RichTextProps) => {
 	const { metadata, rtl } = useRender();
 	const rtlTextWrapStyle: Style | undefined = rtl ? { direction: "rtl", textAlign: "right" } : undefined;
+
+	const richListItemMarkerMargin: Style = {
+		marginLeft: rtl ? 4 : 0,
+		marginRight: rtl ? 0 : 4
+	};
 	const boldStyle = useTemplateStyle("bold");
 	const linkStyle = useTemplateStyle("link");
 	const richParagraphStyle = useTemplateStyle("richParagraph");
@@ -118,10 +123,11 @@ export const RichText = ({ children }: RichTextProps) => {
 					const contentItemStyles = itemStyles.map(stripRichTextVerticalMargins);
 
 					const markerNode = (
-						<PdfText key="marker" style={composeStyles(richListItemMarkerStyle)}>
+						<PdfText key="marker" style={composeStyles(richListItemMarkerStyle, richListItemMarkerMargin)}>
 							{marker}
 						</PdfText>
 					);
+
 					// Same BiDi-injection trick as the <p> renderer — see applyRtlDirectionRecursively.
 					const contentNode = rtl ? (
 						<PdfText
@@ -147,7 +153,10 @@ export const RichText = ({ children }: RichTextProps) => {
 								safeTextStyle,
 							)}
 						>
-							{children}
+							<View style={{ flexDirection: "row", alignItems: "flex-start" }}>
+								{markerNode}
+								{children}
+							</View>
 						</View>
 					);
 
@@ -162,7 +171,7 @@ export const RichText = ({ children }: RichTextProps) => {
 								getRichTextEdgeTrimStyle(element),
 							)}
 						>
-							{rtl ? [contentNode, markerNode] : [markerNode, contentNode]}
+							{rtl ? [contentNode, markerNode] : contentNode}
 						</View>
 					);
 				},