TX004
<Box> nested inside <Text>
Console
Text.js error TX004: <Box> cannot be nested inside <Text>.
Why this happens
<Text> lays out a run of inline text; it cannot contain a Flexbox container. A <Box> (or a component that renders one, such as <Badge> or <Spacer>) was rendered inside a <Text>.
How to fix it
Move the <Box> out and put text siblings side by side in a row:
// Before<Text> Status: <Box><Text color="green">ok</Text></Box></Text>// After<Box flexDirection="row"> <Text>Status: </Text> <Text color="green">ok</Text></Box>Nested <Text> is fine; it renders as an inline span.