From 212b2a3e0d23a6aceacb20baa29b87d07b337c3c Mon Sep 17 00:00:00 2001
From: Krystian Sienkiewicz <krystian.sienkiewicz@swmansion.com>
Date: Thu, 27 Aug 2026 11:15:52 +0200
Subject: [PATCH 1/5] feat: testing case

---
 apps/example/src/screens/DevScreen.tsx | 137 +++++--------------------
 1 file changed, 23 insertions(+), 114 deletions(-)

diff --git a/apps/example/src/screens/DevScreen.tsx b/apps/example/src/screens/DevScreen.tsx
index d5b4ba3f1..be0b2d324 100644
--- a/apps/example/src/screens/DevScreen.tsx
+++ b/apps/example/src/screens/DevScreen.tsx
@@ -1,37 +1,19 @@
 import { View, StyleSheet, Text, ScrollView } from 'react-native';
 import { EnrichedTextInput } from 'react-native-enriched-html';
 import { Button } from '../components/Button';
-import { Toolbar } from '../components/Toolbar';
-import { LinkModal } from '../components/LinkModal';
-import { ValueModal } from '../components/ValueModal';
-import { MentionPopup } from '../components/MentionPopup';
-import { HtmlSection } from '../components/HtmlSection';
-import { ImageModal } from '../components/ImageModal';
-import { useEditorState } from '../hooks/useEditorState';
 import {
   LINK_REGEX,
   htmlStyle,
   ANDROID_EXPERIMENTAL_SYNCHRONOUS_EVENTS,
 } from '../constants/editorConfig';
 import { useState } from 'react';
-import { TextRenderer } from '../components/TextRenderer';
 
 interface DevScreenProps {
   onSwitch: () => void;
 }
 
-export function DevScreen({ onSwitch }: DevScreenProps) {
-  const editor = useEditorState();
-  const [textNodes, setTextNodes] = useState<Array<string>>([]);
-
-  const handlePushTextNode = async () => {
-    const currentText = await editor.ref.current?.getHTML();
-    if (currentText) {
-      setTextNodes((prevTextNodes) => [...prevTextNodes, currentText]);
-    }
-
-    editor.ref.current?.setValue('');
-  };
+export function DevScreen({}: DevScreenProps) {
+  const [showEditor, setShowEditor] = useState(false);
 
   return (
     <>
@@ -40,103 +22,32 @@ export function DevScreen({ onSwitch }: DevScreenProps) {
         contentContainerStyle={styles.content}
       >
         <Text style={styles.label}>Enriched Text Input</Text>
-        <View style={styles.editor} testID="editor-container">
-          <EnrichedTextInput
-            ref={editor.ref}
-            mentionIndicators={['@', '#']}
-            style={styles.editorInput}
-            htmlStyle={htmlStyle}
-            placeholder="Type something here..."
-            placeholderTextColor="rgb(0, 26, 114)"
-            selectionColor="deepskyblue"
-            cursorColor="dodgerblue"
-            autoCapitalize="sentences"
-            linkRegex={LINK_REGEX}
-            onChangeText={(e) => editor.handleChangeText(e.nativeEvent)}
-            onChangeHtml={(e) => editor.handleChangeHtml(e.nativeEvent)}
-            onChangeState={(e) => editor.handleChangeState(e.nativeEvent)}
-            onLinkDetected={editor.handleLinkDetected}
-            onMentionDetected={console.log}
-            onStartMention={editor.handleStartMention}
-            onChangeMention={editor.handleChangeMention}
-            onEndMention={editor.handleEndMention}
-            onFocus={editor.handleFocusEvent}
-            onBlur={editor.handleBlurEvent}
-            onChangeSelection={(e) =>
-              editor.handleSelectionChangeEvent(e.nativeEvent)
-            }
-            onSubmitEditing={(e) =>
-              editor.handleSubmitEditingEvent(e.nativeEvent)
-            }
-            onKeyPress={(e) => editor.handleKeyPress(e.nativeEvent)}
-            androidExperimentalSynchronousEvents={
-              ANDROID_EXPERIMENTAL_SYNCHRONOUS_EVENTS
-            }
-            onPasteImages={(e) => editor.handlePasteImagesEvent(e.nativeEvent)}
-            testID="editor-input"
-          />
-          <Toolbar
-            stylesState={editor.stylesState}
-            editorRef={editor.ref}
-            onOpenLinkModal={editor.openLinkModal}
-            onSelectImage={editor.openImageModal}
-            layout="horizontal"
-          />
-        </View>
-        <HtmlSection currentHtml={editor.currentHtml} />
-        <View style={styles.buttonStack}>
-          <Button
-            title="Set input's value"
-            onPress={editor.openValueModal}
-            style={styles.button}
-          />
-          <Button
-            title="Push text"
-            onPress={handlePushTextNode}
-            style={styles.button}
-          />
-        </View>
         <Button
-          title="Test Screen"
-          onPress={onSwitch}
+          title="Toggle editor's presence"
+          onPress={() => setShowEditor((prev) => !prev)}
           style={styles.valueButton}
           testID="toggle-screen-button"
         />
-        <TextRenderer nodes={textNodes} />
+        <View style={styles.editor} testID="editor-container">
+          {showEditor && (
+            <EnrichedTextInput
+              style={styles.editorInput}
+              htmlStyle={htmlStyle}
+              placeholder="Type something here..."
+              placeholderTextColor="rgb(0, 26, 114)"
+              selectionColor="deepskyblue"
+              cursorColor="dodgerblue"
+              autoCapitalize="sentences"
+              linkRegex={LINK_REGEX}
+              androidExperimentalSynchronousEvents={
+                ANDROID_EXPERIMENTAL_SYNCHRONOUS_EVENTS
+              }
+              defaultValue={`<html><h4>heading</h4><ul><li>list1</li><li>list2</li><li><code>codelist</code></li></ul><h3><code>codeheading</code></h3></html>`}
+              testID="editor-input"
+            />
+          )}
+        </View>
       </ScrollView>
-      <LinkModal
-        isOpen={editor.isLinkModalOpen}
-        editedText={
-          editor.insideCurrentLink
-            ? editor.currentLink.text
-            : (editor.selection?.text ?? '')
-        }
-        editedUrl={editor.insideCurrentLink ? editor.currentLink.url : ''}
-        onSubmit={editor.submitLink}
-        onClose={editor.closeLinkModal}
-      />
-      <ImageModal
-        isOpen={editor.isImageModalOpen}
-        onSubmit={editor.selectImage}
-        onClose={editor.closeImageModal}
-      />
-      <ValueModal
-        isOpen={editor.isValueModalOpen}
-        onSubmit={editor.submitSetValue}
-        onClose={editor.closeValueModal}
-      />
-      <MentionPopup
-        variant="user"
-        data={editor.userMention.data}
-        isOpen={editor.isUserPopupOpen}
-        onItemPress={editor.handleUserMentionSelected}
-      />
-      <MentionPopup
-        variant="channel"
-        data={editor.channelMention.data}
-        isOpen={editor.isChannelPopupOpen}
-        onItemPress={editor.handleChannelMentionSelected}
-      />
     </>
   );
 }
@@ -176,9 +87,7 @@ const styles = StyleSheet.create({
   editorInput: {
     marginTop: 24,
     width: '100%',
-    maxHeight: 180,
     backgroundColor: 'gainsboro',
-    fontSize: 18,
     fontFamily: 'Nunito-Regular',
     paddingVertical: 12,
     paddingHorizontal: 14,

From 3a2701a6a074379f0a14c0691088a0bc3b538a30 Mon Sep 17 00:00:00 2001
From: Krystian Sienkiewicz <krystian.sienkiewicz@swmansion.com>
Date: Thu, 27 Aug 2026 11:30:07 +0200
Subject: [PATCH 2/5] fix: initialize shadow node's counter value

---
 .../ReactNativeEnrichedSpec/EnrichedTextInputShadowNode.h       | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/android/src/main/new_arch/react/renderer/components/ReactNativeEnrichedSpec/EnrichedTextInputShadowNode.h b/android/src/main/new_arch/react/renderer/components/ReactNativeEnrichedSpec/EnrichedTextInputShadowNode.h
index 79aa0135b..f90e7911e 100644
--- a/android/src/main/new_arch/react/renderer/components/ReactNativeEnrichedSpec/EnrichedTextInputShadowNode.h
+++ b/android/src/main/new_arch/react/renderer/components/ReactNativeEnrichedSpec/EnrichedTextInputShadowNode.h
@@ -47,7 +47,7 @@ class EnrichedTextInputShadowNode final
                  const LayoutConstraints &layoutConstraints) const override;
 
 private:
-  int forceHeightRecalculationCounter_;
+  int forceHeightRecalculationCounter_{0};
   std::shared_ptr<EnrichedTextInputMeasurementManager> measurementsManager_;
 };
 } // namespace facebook::react

From 43b82875312bb409f5394b0662ecb73ce5eb27e6 Mon Sep 17 00:00:00 2001
From: Krystian Sienkiewicz <krystian.sienkiewicz@swmansion.com>
Date: Thu, 27 Aug 2026 11:56:51 +0200
Subject: [PATCH 3/5] fix: desynced cache issue

---
 .../EnrichedTextInputViewLayoutManager.kt        | 16 +++++++++-------
 .../enriched/textinput/MeasurementStore.kt       | 13 ++++++++++---
 2 files changed, 19 insertions(+), 10 deletions(-)

diff --git a/android/src/main/java/com/swmansion/enriched/textinput/EnrichedTextInputViewLayoutManager.kt b/android/src/main/java/com/swmansion/enriched/textinput/EnrichedTextInputViewLayoutManager.kt
index 40894f82e..d9aca7673 100644
--- a/android/src/main/java/com/swmansion/enriched/textinput/EnrichedTextInputViewLayoutManager.kt
+++ b/android/src/main/java/com/swmansion/enriched/textinput/EnrichedTextInputViewLayoutManager.kt
@@ -11,14 +11,16 @@ class EnrichedTextInputViewLayoutManager(
     val text = view.text
     val paint = view.paint
 
-    val needUpdate = MeasurementStore.store(view.id, text, paint)
-    if (!needUpdate) return
+    MeasurementStore.store(view.id, text, paint) {
+      val stateWrapper = view.stateWrapper ?: return@store false
 
-    val counter = forceHeightRecalculationCounter
-    forceHeightRecalculationCounter++
-    val state = Arguments.createMap()
-    state.putInt("forceHeightRecalculationCounter", counter)
-    view.stateWrapper?.updateState(state)
+      forceHeightRecalculationCounter++
+      val state = Arguments.createMap()
+      state.putInt("forceHeightRecalculationCounter", forceHeightRecalculationCounter)
+      stateWrapper.updateState(state)
+
+      true
+    }
   }
 
   fun releaseMeasurementStore() {
diff --git a/android/src/main/java/com/swmansion/enriched/textinput/MeasurementStore.kt b/android/src/main/java/com/swmansion/enriched/textinput/MeasurementStore.kt
index 09363e08a..50d58b3ef 100644
--- a/android/src/main/java/com/swmansion/enriched/textinput/MeasurementStore.kt
+++ b/android/src/main/java/com/swmansion/enriched/textinput/MeasurementStore.kt
@@ -44,7 +44,8 @@ object MeasurementStore {
     id: Int,
     spannable: Spannable?,
     paint: TextPaint,
-  ): Boolean {
+    invalidateShadowNode: () -> Boolean,
+  ) {
     val cachedWidth = data[id]?.cachedWidth ?: 0f
     val cachedSize = data[id]?.cachedSize ?: 0L
     val initialized = data[id]?.initialized ?: true
@@ -52,8 +53,14 @@ object MeasurementStore {
     val size = measure(cachedWidth, spannable, paint)
     val paintParams = PaintParams(paint.typeface, paint.textSize)
 
-    data[id] = MeasurementParams(initialized, cachedWidth, size, spannable, paintParams)
-    return cachedSize != size
+    // stateWrapper might be null during the first measures,
+    // we want to cache the size only when it was actually
+    // handled in the shadow node. The cached size and the actual
+    // rendered one should be in sync.
+    val invalidated = cachedSize != size && invalidateShadowNode()
+    val storedSize = if (invalidated) size else cachedSize
+
+    data[id] = MeasurementParams(initialized, cachedWidth, storedSize, spannable, paintParams)
   }
 
   fun release(id: Int) {

From 4c478090f9fb36dbb3dd6e8489b3cf712a62b45f Mon Sep 17 00:00:00 2001
From: Krystian Sienkiewicz <krystian.sienkiewicz@swmansion.com>
Date: Thu, 27 Aug 2026 12:01:05 +0200
Subject: [PATCH 4/5] fix: fontSize prop fallback on initial measure size
 calculation

---
 .../java/com/swmansion/enriched/textinput/MeasurementStore.kt   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/android/src/main/java/com/swmansion/enriched/textinput/MeasurementStore.kt b/android/src/main/java/com/swmansion/enriched/textinput/MeasurementStore.kt
index 50d58b3ef..11e9016f3 100644
--- a/android/src/main/java/com/swmansion/enriched/textinput/MeasurementStore.kt
+++ b/android/src/main/java/com/swmansion/enriched/textinput/MeasurementStore.kt
@@ -137,7 +137,7 @@ object MeasurementStore {
     props: ReadableMap?,
   ): Float {
     val propsFontSize = props?.getDouble("fontSize")?.toFloat()
-    if (propsFontSize == null) return defaultView.textSize
+    if (propsFontSize == null || propsFontSize <= 0) return defaultView.textSize
 
     return ceil(pixelFromSpOrDp(propsFontSize, allowFontScalingFromProps(props)))
   }

From 040a7a3ed3b87279819395c3d176b8be3a88d745 Mon Sep 17 00:00:00 2001
From: Krystian Sienkiewicz <krystian.sienkiewicz@swmansion.com>
Date: Thu, 27 Aug 2026 12:02:27 +0200
Subject: [PATCH 5/5] chore: restore the test case

---
 apps/example/src/screens/DevScreen.tsx | 137 ++++++++++++++++++++-----
 1 file changed, 114 insertions(+), 23 deletions(-)

diff --git a/apps/example/src/screens/DevScreen.tsx b/apps/example/src/screens/DevScreen.tsx
index be0b2d324..d5b4ba3f1 100644
--- a/apps/example/src/screens/DevScreen.tsx
+++ b/apps/example/src/screens/DevScreen.tsx
@@ -1,19 +1,37 @@
 import { View, StyleSheet, Text, ScrollView } from 'react-native';
 import { EnrichedTextInput } from 'react-native-enriched-html';
 import { Button } from '../components/Button';
+import { Toolbar } from '../components/Toolbar';
+import { LinkModal } from '../components/LinkModal';
+import { ValueModal } from '../components/ValueModal';
+import { MentionPopup } from '../components/MentionPopup';
+import { HtmlSection } from '../components/HtmlSection';
+import { ImageModal } from '../components/ImageModal';
+import { useEditorState } from '../hooks/useEditorState';
 import {
   LINK_REGEX,
   htmlStyle,
   ANDROID_EXPERIMENTAL_SYNCHRONOUS_EVENTS,
 } from '../constants/editorConfig';
 import { useState } from 'react';
+import { TextRenderer } from '../components/TextRenderer';
 
 interface DevScreenProps {
   onSwitch: () => void;
 }
 
-export function DevScreen({}: DevScreenProps) {
-  const [showEditor, setShowEditor] = useState(false);
+export function DevScreen({ onSwitch }: DevScreenProps) {
+  const editor = useEditorState();
+  const [textNodes, setTextNodes] = useState<Array<string>>([]);
+
+  const handlePushTextNode = async () => {
+    const currentText = await editor.ref.current?.getHTML();
+    if (currentText) {
+      setTextNodes((prevTextNodes) => [...prevTextNodes, currentText]);
+    }
+
+    editor.ref.current?.setValue('');
+  };
 
   return (
     <>
@@ -22,32 +40,103 @@ export function DevScreen({}: DevScreenProps) {
         contentContainerStyle={styles.content}
       >
         <Text style={styles.label}>Enriched Text Input</Text>
+        <View style={styles.editor} testID="editor-container">
+          <EnrichedTextInput
+            ref={editor.ref}
+            mentionIndicators={['@', '#']}
+            style={styles.editorInput}
+            htmlStyle={htmlStyle}
+            placeholder="Type something here..."
+            placeholderTextColor="rgb(0, 26, 114)"
+            selectionColor="deepskyblue"
+            cursorColor="dodgerblue"
+            autoCapitalize="sentences"
+            linkRegex={LINK_REGEX}
+            onChangeText={(e) => editor.handleChangeText(e.nativeEvent)}
+            onChangeHtml={(e) => editor.handleChangeHtml(e.nativeEvent)}
+            onChangeState={(e) => editor.handleChangeState(e.nativeEvent)}
+            onLinkDetected={editor.handleLinkDetected}
+            onMentionDetected={console.log}
+            onStartMention={editor.handleStartMention}
+            onChangeMention={editor.handleChangeMention}
+            onEndMention={editor.handleEndMention}
+            onFocus={editor.handleFocusEvent}
+            onBlur={editor.handleBlurEvent}
+            onChangeSelection={(e) =>
+              editor.handleSelectionChangeEvent(e.nativeEvent)
+            }
+            onSubmitEditing={(e) =>
+              editor.handleSubmitEditingEvent(e.nativeEvent)
+            }
+            onKeyPress={(e) => editor.handleKeyPress(e.nativeEvent)}
+            androidExperimentalSynchronousEvents={
+              ANDROID_EXPERIMENTAL_SYNCHRONOUS_EVENTS
+            }
+            onPasteImages={(e) => editor.handlePasteImagesEvent(e.nativeEvent)}
+            testID="editor-input"
+          />
+          <Toolbar
+            stylesState={editor.stylesState}
+            editorRef={editor.ref}
+            onOpenLinkModal={editor.openLinkModal}
+            onSelectImage={editor.openImageModal}
+            layout="horizontal"
+          />
+        </View>
+        <HtmlSection currentHtml={editor.currentHtml} />
+        <View style={styles.buttonStack}>
+          <Button
+            title="Set input's value"
+            onPress={editor.openValueModal}
+            style={styles.button}
+          />
+          <Button
+            title="Push text"
+            onPress={handlePushTextNode}
+            style={styles.button}
+          />
+        </View>
         <Button
-          title="Toggle editor's presence"
-          onPress={() => setShowEditor((prev) => !prev)}
+          title="Test Screen"
+          onPress={onSwitch}
           style={styles.valueButton}
           testID="toggle-screen-button"
         />
-        <View style={styles.editor} testID="editor-container">
-          {showEditor && (
-            <EnrichedTextInput
-              style={styles.editorInput}
-              htmlStyle={htmlStyle}
-              placeholder="Type something here..."
-              placeholderTextColor="rgb(0, 26, 114)"
-              selectionColor="deepskyblue"
-              cursorColor="dodgerblue"
-              autoCapitalize="sentences"
-              linkRegex={LINK_REGEX}
-              androidExperimentalSynchronousEvents={
-                ANDROID_EXPERIMENTAL_SYNCHRONOUS_EVENTS
-              }
-              defaultValue={`<html><h4>heading</h4><ul><li>list1</li><li>list2</li><li><code>codelist</code></li></ul><h3><code>codeheading</code></h3></html>`}
-              testID="editor-input"
-            />
-          )}
-        </View>
+        <TextRenderer nodes={textNodes} />
       </ScrollView>
+      <LinkModal
+        isOpen={editor.isLinkModalOpen}
+        editedText={
+          editor.insideCurrentLink
+            ? editor.currentLink.text
+            : (editor.selection?.text ?? '')
+        }
+        editedUrl={editor.insideCurrentLink ? editor.currentLink.url : ''}
+        onSubmit={editor.submitLink}
+        onClose={editor.closeLinkModal}
+      />
+      <ImageModal
+        isOpen={editor.isImageModalOpen}
+        onSubmit={editor.selectImage}
+        onClose={editor.closeImageModal}
+      />
+      <ValueModal
+        isOpen={editor.isValueModalOpen}
+        onSubmit={editor.submitSetValue}
+        onClose={editor.closeValueModal}
+      />
+      <MentionPopup
+        variant="user"
+        data={editor.userMention.data}
+        isOpen={editor.isUserPopupOpen}
+        onItemPress={editor.handleUserMentionSelected}
+      />
+      <MentionPopup
+        variant="channel"
+        data={editor.channelMention.data}
+        isOpen={editor.isChannelPopupOpen}
+        onItemPress={editor.handleChannelMentionSelected}
+      />
     </>
   );
 }
@@ -87,7 +176,9 @@ const styles = StyleSheet.create({
   editorInput: {
     marginTop: 24,
     width: '100%',
+    maxHeight: 180,
     backgroundColor: 'gainsboro',
+    fontSize: 18,
     fontFamily: 'Nunito-Regular',
     paddingVertical: 12,
     paddingHorizontal: 14,