62 lines
1.4 KiB
TypeScript
62 lines
1.4 KiB
TypeScript
import React, { forwardRef } from 'react'
|
|
import {
|
|
Text as RNText,
|
|
TouchableOpacity,
|
|
TextProps as RNTextProps,
|
|
TouchableOpacityProps,
|
|
StyleProp,
|
|
TextStyle,
|
|
} from 'react-native'
|
|
import Animated from 'react-native-reanimated'
|
|
|
|
interface TextProps extends RNTextProps {
|
|
onClick?: () => void
|
|
touchProps?: TouchableOpacityProps
|
|
animated?: boolean
|
|
style?: StyleProp<TextStyle>
|
|
className?: string
|
|
}
|
|
|
|
const Text = forwardRef<RNText, TextProps>((props, ref) => {
|
|
const { onClick, touchProps = {}, animated, style, className = '', children, ...reset } = props
|
|
|
|
// Default style for dark theme - light text color
|
|
const defaultStyle: TextStyle = {
|
|
color: '#F5F5F5',
|
|
}
|
|
|
|
// Merge default style with provided style
|
|
const mergedStyle = Array.isArray(style)
|
|
? [defaultStyle, ...style]
|
|
: style
|
|
? { ...defaultStyle, ...(typeof style === 'object' ? style : {}) }
|
|
: defaultStyle
|
|
|
|
const textProps = {
|
|
className,
|
|
style: mergedStyle,
|
|
ref,
|
|
...reset,
|
|
}
|
|
|
|
const handlePress = () => {
|
|
onClick && onClick()
|
|
}
|
|
|
|
if (animated) {
|
|
return <Animated.Text {...textProps}>{children}</Animated.Text>
|
|
}
|
|
if (onClick) {
|
|
return (
|
|
<TouchableOpacity activeOpacity={1} onPress={handlePress} {...touchProps}>
|
|
<RNText {...textProps}>{children}</RNText>
|
|
</TouchableOpacity>
|
|
)
|
|
}
|
|
|
|
return <RNText {...textProps}>{children}</RNText>
|
|
})
|
|
|
|
Text.displayName = 'Text'
|
|
export default Text
|