Text text-xl cutting text and with an odd behaviour (only for android)

[verissimor]

Description

Because it cut parts of the text with an odd behaviour.

CodeSandbox/Snack link

not informed

Steps to reproduce

Failing to render the text "AI Interview Buddy".

1. Create a text <Text size="3xl" className="font-extrabold text-orange-500 mb-2">AI Interview Buddy</Text>
2. See the system is cutting the word buddy
3. Change the text to "AI Interview Buddy1" and it works fine.

Obs.: Web and Ios works just fine.

More details: The code statement:

import { Box } from "@/components/ui/box";
import { Text } from "@/components/ui/text";

export default function TailWindCss() {
  return (
    <Box className="flex-1 items-center justify-center bg-white">
      <Text className="text-xl font-bold text-blue-500">Welcome to Nativewind x2!</Text>
      <Text size="3xl" className="font-extrabold text-orange-500 mb-2">AI Interview Buddy</Text>
    </Box>
  );
}

Renders as:

---

Just adding a "1" at the end of the text, making it "AI Interview Buddy1", it works:

export default function TailWindCss() {
  return (
    <Box className="flex-1 items-center justify-center bg-white">
      <Text className="text-xl font-bold text-blue-500">Welcome to Nativewind x2!</Text>
      <Text size="3xl" className="font-extrabold text-orange-500 mb-2">AI Interview Buddy1</Text>
    </Box>
  );
}

---

I tried removing font-extrabold and adding bold, it worked for that size, however, failed for xl:

<Text size="xl" bold className="text-orange-500 mb-2">AI Interview Buddy</Text>

gluestack-ui Version

v2

Platform

• [x] Expo
• [ ] React Native CLI
• [ ] Next
• [ ] Web
• [x] Android
• [ ] iOS

Other Platform

No response

Additional Information

No response

[acodexm]

I have the same issue. sometimes an empty space at the end helps but not always. but it might be react native issue too