Merge pull request #55706 from QichenZhu/fix/40025

Bump react-native-live-markdown to 0.1.223

ios/Podfile.lock

@@ -2514,7 +2514,7 @@ PODS:
   - RNGoogleSignin (10.0.1):
     - GoogleSignIn (~> 7.0)
     - React-Core
-  - RNLiveMarkdown (0.1.221):
+  - RNLiveMarkdown (0.1.223):
     - DoubleConversion
     - glog
     - hermes-engine
@@ -2534,10 +2534,10 @@ PODS:
     - ReactCodegen
     - ReactCommon/turbomodule/bridging
     - ReactCommon/turbomodule/core
-    - RNLiveMarkdown/newarch (= 0.1.221)
+    - RNLiveMarkdown/newarch (= 0.1.223)
     - RNReanimated/worklets
     - Yoga
-  - RNLiveMarkdown/newarch (0.1.221):
+  - RNLiveMarkdown/newarch (0.1.223):
     - DoubleConversion
     - glog
     - hermes-engine
@@ -3412,7 +3412,7 @@ SPEC CHECKSUMS:
   RNFS: 4ac0f0ea233904cb798630b3c077808c06931688
   RNGestureHandler: 364e6862a112045bb5c5d35601f0bdb0304af979
   RNGoogleSignin: ccaa4a81582cf713eea562c5dd9dc1961a715fd0
-  RNLiveMarkdown: 9940212ca19bf54101b585178e691ee040b82c35
+  RNLiveMarkdown: 5c76c659b125006ff525a095b65184ecb72392f3
   RNLocalize: d4b8af4e442d4bcca54e68fc687a2129b4d71a81
   rnmapbox-maps: d184c8d3213acf4c97ec71fbbb6f9d4954552d80
   RNPermissions: 0b1429b55af59d1d08b75a8be2459f65a8ac3f28

package.json

@@ -76,8 +76,8 @@
   },
   "dependencies": {
     "@dotlottie/react-player": "^1.6.3",
-    "@expensify/react-native-live-markdown": "0.1.221",
     "@expensify/react-native-background-task": "file:./modules/background-task",
+    "@expensify/react-native-live-markdown": "0.1.223",
     "@expo/metro-runtime": "^4.0.0",
     "@firebase/app": "^0.10.10",
     "@firebase/performance": "^0.6.8",

src/stories/Composer.stories.tsx

@@ -5,7 +5,7 @@ import React, {useState} from 'react';
 import {Image, View} from 'react-native';
 import type {FileObject} from '@components/AttachmentModal';
 import Composer from '@components/Composer';
-import type {ComposerProps} from '@components/Composer/types';
+import type {ComposerProps, CustomSelectionChangeEvent, TextSelection} from '@components/Composer/types';
 import RenderHTML from '@components/RenderHTML';
 import Text from '@components/Text';
 import withNavigationFallback from '@components/withNavigationFallback';
@@ -28,11 +28,17 @@ const story: Meta<typeof ComposerWithNavigation> = {
 
 const parser = new ExpensiMark();
 
+const DEFAULT_VALUE = `Composer can do the following:
+
+     * It can contain MD e.g. *bold* _italic_
+     * Supports Pasted Images via Ctrl+V`;
+
 function Default(props: ComposerProps) {
     const StyleUtils = useStyleUtils();
     const [pastedFile, setPastedFile] = useState<FileObject | null>(null);
-    const [comment, setComment] = useState(props.defaultValue);
+    const [comment, setComment] = useState(DEFAULT_VALUE);
     const renderedHTML = parser.replace(comment ?? '');
+    const [selection, setSelection] = useState<TextSelection>(() => ({start: DEFAULT_VALUE.length, end: DEFAULT_VALUE.length, positionX: 0, positionY: 0}));
 
     return (
         <View>
@@ -41,8 +47,13 @@ function Default(props: ComposerProps) {
                     // eslint-disable-next-line react/jsx-props-no-spreading
                     {...props}
                     multiline
+                    value={comment}
                     onChangeText={setComment}
                     onPasteFile={setPastedFile}
+                    selection={selection}
+                    onSelectionChange={(e: CustomSelectionChangeEvent) => {
+                        setSelection(e.nativeEvent.selection);
+                    }}
                     style={[defaultStyles.textInputCompose, defaultStyles.w100, defaultStyles.verticalAlignTop]}
                 />
             </View>
@@ -73,10 +84,6 @@ Default.args = {
     autoFocus: true,
     placeholder: 'Compose Text Here',
     placeholderTextColor: defaultTheme.placeholderText,
-    defaultValue: `Composer can do the following:
-
-     * It can contain MD e.g. *bold* _italic_
-     * Supports Pasted Images via Ctrl+V`,
     isDisabled: false,
     maxLines: 16,
 };