More cleanup. More robust themed compononents
This commit is contained in:
@ -10,34 +10,34 @@ const DEFAULT_HEIGHT = 68;
|
||||
type ThemedButtonProps = PressableProps & {
|
||||
width?: DimensionValue;
|
||||
height?: DimensionValue;
|
||||
backgroundColor?: string;
|
||||
containerStyle?: object;
|
||||
buttonStyle?: object;
|
||||
};
|
||||
|
||||
const ThemedButton: React.FC<ThemedButtonProps> = ({
|
||||
width,
|
||||
height,
|
||||
width = DEFAULT_WIDTH,
|
||||
height = DEFAULT_HEIGHT,
|
||||
backgroundColor = Colors[useColorScheme() ?? 'dark'].text,
|
||||
children,
|
||||
containerStyle,
|
||||
buttonStyle,
|
||||
style,
|
||||
...restProps // This now includes onPress automatically
|
||||
}) => {
|
||||
const scheme = useColorScheme() ?? 'dark';
|
||||
|
||||
return (
|
||||
<ThemedView
|
||||
style={[
|
||||
styles.buttonContainer,
|
||||
{
|
||||
width: width ?? DEFAULT_WIDTH,
|
||||
height: height ?? DEFAULT_HEIGHT,
|
||||
width,
|
||||
height,
|
||||
},
|
||||
containerStyle,
|
||||
]}
|
||||
>
|
||||
<Pressable
|
||||
style={[styles.button, { backgroundColor: Colors[scheme].text }, buttonStyle, style]}
|
||||
style={[styles.button, { backgroundColor }, buttonStyle, style]}
|
||||
{...restProps} // This passes onPress and all other Pressable props
|
||||
>
|
||||
{children}
|
||||
|
@ -15,6 +15,8 @@ type ThemedTextButtonProps = Omit<PressableProps, 'children'> & {
|
||||
textStyle?: TextStyle;
|
||||
containerStyle?: object;
|
||||
buttonStyle?: object;
|
||||
textColor?: string;
|
||||
backgroundColor?: string;
|
||||
};
|
||||
|
||||
const ThemedTextButton: React.FC<ThemedTextButtonProps> = ({
|
||||
@ -26,9 +28,10 @@ const ThemedTextButton: React.FC<ThemedTextButtonProps> = ({
|
||||
textStyle,
|
||||
containerStyle,
|
||||
buttonStyle,
|
||||
textColor = Colors[useColorScheme() ?? 'dark'].background,
|
||||
backgroundColor = Colors[useColorScheme() ?? 'dark'].text,
|
||||
...restProps // This includes onPress and all other Pressable props
|
||||
}) => {
|
||||
const scheme = useColorScheme() ?? 'dark';
|
||||
if (fontWeight === 'semibold') fontWeight = '600';
|
||||
|
||||
return (
|
||||
@ -37,12 +40,13 @@ const ThemedTextButton: React.FC<ThemedTextButtonProps> = ({
|
||||
height={height}
|
||||
containerStyle={containerStyle}
|
||||
buttonStyle={buttonStyle}
|
||||
backgroundColor={backgroundColor}
|
||||
{...restProps}
|
||||
>
|
||||
<ThemedText
|
||||
style={[
|
||||
{
|
||||
color: Colors[scheme].background,
|
||||
color: textColor,
|
||||
fontSize,
|
||||
lineHeight: fontSize * 1.5,
|
||||
fontWeight,
|
||||
|
Reference in New Issue
Block a user