render TextInput if text should be selectable
This commit is contained in:
@@ -200,6 +200,7 @@ export const PostThreadItem = observer(function PostThreadItem({
|
|||||||
type="post-text-lg"
|
type="post-text-lg"
|
||||||
richText={item.richText}
|
richText={item.richText}
|
||||||
lineHeight={1.3}
|
lineHeight={1.3}
|
||||||
|
selectable={true}
|
||||||
/>
|
/>
|
||||||
</View>
|
</View>
|
||||||
) : undefined}
|
) : undefined}
|
||||||
|
|||||||
@@ -16,6 +16,7 @@ export function RichText({
|
|||||||
richText,
|
richText,
|
||||||
lineHeight = 1.2,
|
lineHeight = 1.2,
|
||||||
style,
|
style,
|
||||||
|
selectable = false,
|
||||||
numberOfLines,
|
numberOfLines,
|
||||||
}: {
|
}: {
|
||||||
testID?: string
|
testID?: string
|
||||||
@@ -24,6 +25,7 @@ export function RichText({
|
|||||||
lineHeight?: number
|
lineHeight?: number
|
||||||
style?: StyleProp<TextStyle>
|
style?: StyleProp<TextStyle>
|
||||||
numberOfLines?: number
|
numberOfLines?: number
|
||||||
|
selectable?: boolean
|
||||||
}) {
|
}) {
|
||||||
const theme = useTheme()
|
const theme = useTheme()
|
||||||
const pal = usePalette('default')
|
const pal = usePalette('default')
|
||||||
@@ -47,11 +49,13 @@ export function RichText({
|
|||||||
</Text>
|
</Text>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Text
|
<Text
|
||||||
testID={testID}
|
testID={testID}
|
||||||
type={type}
|
type={type}
|
||||||
style={[style, pal.text, lineHeightStyle]}
|
style={[style, pal.text, lineHeightStyle]}
|
||||||
|
selectable={selectable}
|
||||||
// @ts-ignore web only -prf
|
// @ts-ignore web only -prf
|
||||||
dataSet={WORD_WRAP}>
|
dataSet={WORD_WRAP}>
|
||||||
{text}
|
{text}
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
import {Text as RNText, TextProps} from 'react-native'
|
import {Text as RNText, TextInput, TextProps} from 'react-native'
|
||||||
import {s, lh} from 'lib/styles'
|
import {s, lh} from 'lib/styles'
|
||||||
import {useTheme, TypographyVariant} from 'lib/ThemeContext'
|
import {useTheme, TypographyVariant} from 'lib/ThemeContext'
|
||||||
|
|
||||||
@@ -13,11 +13,23 @@ export function Text({
|
|||||||
children,
|
children,
|
||||||
lineHeight,
|
lineHeight,
|
||||||
style,
|
style,
|
||||||
|
selectable,
|
||||||
...props
|
...props
|
||||||
}: React.PropsWithChildren<CustomTextProps>) {
|
}: React.PropsWithChildren<CustomTextProps>) {
|
||||||
const theme = useTheme()
|
const theme = useTheme()
|
||||||
const typography = theme.typography[type]
|
const typography = theme.typography[type]
|
||||||
const lineHeightStyle = lineHeight ? lh(theme, type, lineHeight) : undefined
|
const lineHeightStyle = lineHeight ? lh(theme, type, lineHeight) : undefined
|
||||||
|
if (selectable) {
|
||||||
|
return (
|
||||||
|
<TextInput
|
||||||
|
value={children as string}
|
||||||
|
scrollEnabled={false}
|
||||||
|
style={[s.black, typography, lineHeightStyle, style]}
|
||||||
|
editable={false}
|
||||||
|
multiline={true}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
return (
|
return (
|
||||||
<RNText style={[s.black, typography, lineHeightStyle, style]} {...props}>
|
<RNText style={[s.black, typography, lineHeightStyle, style]} {...props}>
|
||||||
{children}
|
{children}
|
||||||
|
|||||||
Reference in New Issue
Block a user