64 lines
1.7 KiB
TypeScript
64 lines
1.7 KiB
TypeScript
import React from 'react';
|
|
import { TextStyle, PressableProps, DimensionValue } from 'react-native';
|
|
import ThemedButton from '@/components/theme/buttons/ThemedButton';
|
|
import ThemedText from '@/components/theme/default/ThemedText';
|
|
import { Colors } from '@/constants/Colors';
|
|
import { useColorScheme } from '@/hooks/useColorScheme';
|
|
|
|
// Extend ThemedButton props (which already extends PressableProps)
|
|
type ThemedTextButtonProps = Omit<PressableProps, 'children'> & {
|
|
width?: DimensionValue;
|
|
height?: DimensionValue;
|
|
text: string;
|
|
fontSize?: number;
|
|
fontWeight?: 'normal' | 'semibold' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
|
|
textStyle?: TextStyle;
|
|
containerStyle?: object;
|
|
buttonStyle?: object;
|
|
textColor?: string;
|
|
backgroundColor?: string;
|
|
};
|
|
|
|
const ThemedTextButton: React.FC<ThemedTextButtonProps> = ({
|
|
width,
|
|
height,
|
|
text,
|
|
fontSize = 16,
|
|
fontWeight = 'normal',
|
|
textStyle,
|
|
containerStyle,
|
|
buttonStyle,
|
|
textColor = Colors[useColorScheme() ?? 'dark'].background,
|
|
backgroundColor = Colors[useColorScheme() ?? 'dark'].text,
|
|
...restProps // This includes onPress and all other Pressable props
|
|
}) => {
|
|
if (fontWeight === 'semibold') fontWeight = '600';
|
|
|
|
return (
|
|
<ThemedButton
|
|
width={width}
|
|
height={height}
|
|
containerStyle={containerStyle}
|
|
buttonStyle={buttonStyle}
|
|
backgroundColor={backgroundColor}
|
|
{...restProps}
|
|
>
|
|
<ThemedText
|
|
style={[
|
|
{
|
|
color: textColor,
|
|
fontSize,
|
|
lineHeight: fontSize * 1.5,
|
|
fontWeight,
|
|
},
|
|
textStyle,
|
|
]}
|
|
>
|
|
{text}
|
|
</ThemedText>
|
|
</ThemedButton>
|
|
);
|
|
};
|
|
|
|
export default ThemedTextButton;
|