From 11d65ebf1b4f357f974083f5cfe8475c07eedd57 Mon Sep 17 00:00:00 2001
From: Niklas von Hertzen <niklasvh@gmail.com>
Date: Mon, 16 Aug 2021 20:21:04 +0800
Subject: [PATCH] fix: ios grapheme layout

---
 src/css/layout/text.ts | 24 ++++++++++++++++++------
 1 file changed, 18 insertions(+), 6 deletions(-)

diff --git a/src/css/layout/text.ts b/src/css/layout/text.ts
index 59f0bde..fa7563f 100644
--- a/src/css/layout/text.ts
+++ b/src/css/layout/text.ts
@@ -29,12 +29,24 @@ export const parseTextBounds = (
         if (styles.textDecorationLine.length || text.trim().length > 0) {
             if (FEATURES.SUPPORT_RANGE_BOUNDS) {
                 if (!FEATURES.SUPPORT_WORD_BREAKING) {
-                    textBounds.push(
-                        new TextBounds(
-                            text,
-                            Bounds.fromDOMRectList(context, createRange(node, offset, text.length).getClientRects())
-                        )
-                    );
+                    const rects = createRange(node, offset, text.length).getClientRects();
+                    if (rects.length > 1) {
+                        let graphemeOffset = 0;
+                        splitGraphemes(text).forEach((grapheme) => {
+                            textBounds.push(
+                                new TextBounds(
+                                    grapheme,
+                                    Bounds.fromDOMRectList(
+                                        context,
+                                        createRange(node, graphemeOffset + offset, grapheme.length).getClientRects()
+                                    )
+                                )
+                            );
+                            graphemeOffset += grapheme.length;
+                        });
+                    } else {
+                        textBounds.push(new TextBounds(text, Bounds.fromDOMRectList(context, rects)));
+                    }
                 } else {
                     textBounds.push(new TextBounds(text, getRangeBounds(context, node, offset, text.length)));
                 }