[fix] numberOfLines=1 on Safari

Safari requires use of `white-space:nowrap` if not using the multi-line
technique. This patch uses the multi-lines styles to truncate single-lines.

Fix #2111
Close #2113
This commit is contained in:
Janic Duplessis
2021-08-23 19:39:48 +00:00
committed by Nicolas Gallagher
parent ea3975d357
commit 562db69a0f
2 changed files with 3 additions and 10 deletions
@@ -159,7 +159,7 @@ exports[`components/Text prop "numberOfLines" value is set 1`] = `
exports[`components/Text prop "numberOfLines" value is set to one 1`] = `
<div
class="css-text-901oao css-textOneLine-vcwn7f"
class="css-text-901oao css-textMultiLine-cens5h"
dir="auto"
/>
`;
+2 -9
View File
@@ -73,12 +73,11 @@ const Text: React.AbstractComponent<TextProps, HTMLElement & PlatformMethods> =
const classList = [
classes.text,
hasTextAncestor === true && classes.textHasAncestor,
numberOfLines === 1 && classes.textOneLine,
numberOfLines != null && numberOfLines > 1 && classes.textMultiLine
numberOfLines != null && classes.textMultiLine
];
const style = [
props.style,
numberOfLines != null && numberOfLines > 1 && { WebkitLineClamp: numberOfLines },
numberOfLines != null && { WebkitLineClamp: numberOfLines },
selectable === true && styles.selectable,
selectable === false && styles.notSelectable,
onPress && styles.pressable
@@ -180,12 +179,6 @@ const classes = css.create({
font: 'inherit',
whiteSpace: 'inherit'
},
textOneLine: {
maxWidth: '100%',
overflow: 'hidden',
textOverflow: 'ellipsis',
whiteSpace: 'pre'
},
// See #13
textMultiLine: {
display: '-webkit-box',