diff options
Diffstat (limited to 'components/ThemedText.tsx')
-rw-r--r-- | components/ThemedText.tsx | 29 |
1 files changed, 15 insertions, 14 deletions
diff --git a/components/ThemedText.tsx b/components/ThemedText.tsx index 9d214a2..c545b1c 100644 --- a/components/ThemedText.tsx +++ b/components/ThemedText.tsx @@ -1,31 +1,32 @@ -import { StyleSheet, Text, type TextProps } from 'react-native'; +"use client"; +import { StyleSheet, Text, type TextProps } from "react-native"; -import { useThemeColor } from '@/hooks/useThemeColor'; +import { useThemeColor } from "@/hooks/useThemeColor"; export type ThemedTextProps = TextProps & { lightColor?: string; darkColor?: string; - type?: 'default' | 'title' | 'defaultSemiBold' | 'subtitle' | 'link'; + type?: "default" | "title" | "defaultSemiBold" | "subtitle" | "link"; }; export function ThemedText({ style, lightColor, darkColor, - type = 'default', + type = "default", ...rest }: ThemedTextProps) { - const color = useThemeColor({ light: lightColor, dark: darkColor }, 'text'); + const color = useThemeColor({ light: lightColor, dark: darkColor }, "text"); return ( <Text style={[ { color }, - type === 'default' ? styles.default : undefined, - type === 'title' ? styles.title : undefined, - type === 'defaultSemiBold' ? styles.defaultSemiBold : undefined, - type === 'subtitle' ? styles.subtitle : undefined, - type === 'link' ? styles.link : undefined, + type === "default" ? styles.default : undefined, + type === "title" ? styles.title : undefined, + type === "defaultSemiBold" ? styles.defaultSemiBold : undefined, + type === "subtitle" ? styles.subtitle : undefined, + type === "link" ? styles.link : undefined, style, ]} {...rest} @@ -41,20 +42,20 @@ const styles = StyleSheet.create({ defaultSemiBold: { fontSize: 16, lineHeight: 24, - fontWeight: '600', + fontWeight: "600", }, title: { fontSize: 32, - fontWeight: 'bold', + fontWeight: "bold", lineHeight: 32, }, subtitle: { fontSize: 20, - fontWeight: 'bold', + fontWeight: "bold", }, link: { lineHeight: 30, fontSize: 16, - color: '#0a7ea4', + color: "#0a7ea4", }, }); |