Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

SafeAreaView not respected when MarkdownTextInput rendered #619

Open
areknow opened this issue Feb 11, 2025 · 8 comments · May be fixed by #566
Open

SafeAreaView not respected when MarkdownTextInput rendered #619

areknow opened this issue Feb 11, 2025 · 8 comments · May be fixed by #566
Labels
bug Something isn't working

Comments

@areknow
Copy link

areknow commented Feb 11, 2025

When the MarkdownTextInput component is imported and rendered, the SafeAreaView is no longer respected:

Image 
return (
  <SafeAreaView>
    <Text>should be safe</Text>
    <MarkdownTextInput
      value={docValue}
      onChangeText={onInputChange}
      parser={parseExpensiMark}
    />
  </SafeAreaView>
);

After commenting out the MarkdownTextInput:

Image 
return (
  <SafeAreaView>
    <Text>should be safe</Text>
    {/* <MarkdownTextInput
      value={docValue}
      onChangeText={onInputChange}
      parser={parseExpensiMark}
    /> */}
  </SafeAreaView>
);
@tomekzaw tomekzaw added the bug Something isn't working label Feb 12, 2025
@Bob142403
Copy link

having the same issue

@surushTodzhibekov
Copy link

+1

@Abdullo-0901
Copy link

having the same issue

@tomekzaw
Copy link
Collaborator

Please make sure that the order of commit hooks is correct. There's ReanimatedCommitHook and LiveMarkdownCommitHook. ReanimatedCommitHook needs to be registered first. You can force this by wrapping your MarkdownTextInput in Animated.View from react-native-reanimated view.

@areknow
Copy link
Author

areknow commented Feb 24, 2025

Hey @tomekzaw, thanks for the reply. I tried your suggestion without success:

Image

I commited the demo code here: https://github.com/areknow/react-native-live-markdown-safe-area/blob/main/App.tsx

@tomekzaw
Copy link
Collaborator

tomekzaw commented Mar 7, 2025

@areknow Just wanted to ask, do you use react-native-live-markdown with the New Architecture enabled?

We're considering dropping support for the old architecture since Expensify uses this library only on the new architecture and we don't really maintain the old implementation for Paper.

@areknow
Copy link
Author

areknow commented Mar 7, 2025

@tomekzaw in the example I posted above, the new arch is enabled: https://github.com/areknow/react-native-live-markdown-safe-area/blob/main/ios/Podfile.properties.json#L4

@tomekzaw
Copy link
Collaborator

tomekzaw commented Mar 7, 2025

Thanks @areknow. I was able to reproduce the issue on current main. Good news is that the bug will be fixed by #566.

Image

@tomekzaw tomekzaw linked a pull request Mar 11, 2025 that will close this issue
Replace the commit hook with a wrapper component based on display: contents #566
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Something isn't working
Projects
None yet
Milestone
No milestone
5 participants
@areknow @tomekzaw @surushTodzhibekov @Bob142403 @Abdullo-0901