whiteSpace property not included in styles
I wanted to add the whiteSpace: 'pre-wrap' property to the styles for my text component and saw that react-pdf doesn't support that. Please support the available native CSS styles. Thanks.
Same here, needing ( whiteSpace: 'nowrap' ) to force text not to break.
The workaround I am using is to replace the content spaces with tabs.
example: content.replaceAll(' ', '\t')
You could achieve the whitespace: 'nowrap' effect by using Font.registerHyphenationCallback(word => [word]); Documentation here: https://react-pdf.org/fonts#registerHyphenationCallback :)
- as a hacky trick you can use
content.replace(" ", "\u00A0"), if need just prevent wrapping the content. - or using numberOfLines prop for Text component, this prop is commonly used with ellipsizeMode.
To achieve the whiteSpace: 'pre-wrap' effect you can use the following workaround:
Before
return <Text styles={{ whiteSpace: 'pre-wrap' }}>{description}</Text>
After
let output = null
const lines = description.split('\n')
output = lines.map((line, index) => {
return <Text key={`line_${index}`}>{line || <> </>}</Text>
})
return output