fix: fix for #192

Author: RichardLindhout

example/src/App.tsx

@@ -571,6 +571,7 @@ export default function AppWithProviders() {
   const [materialYouEnabled, setMaterialYouEnabled] = React.useState(true)
   const m3Theme = colorScheme === 'dark' ? MD3DarkTheme : MD3LightTheme
   const m2Theme = colorScheme === 'dark' ? MD2LightTheme : MD2LightTheme
+
   return (
     <SafeAreaProvider>
       <PaperProvider theme={materialYouEnabled ? m3Theme : m2Theme}>

src/Time/TimePickerModal.tsx

@@ -48,7 +48,7 @@ export function TimePickerModal({
   hours,
   minutes,
   label = 'Select time',
-  uppercase = true,
+  uppercase: _uppercase,
   cancelLabel = 'Cancel',
   confirmLabel = 'Ok',
   animationType = 'none',
@@ -77,7 +77,8 @@ export function TimePickerModal({
   defaultInputType?: PossibleInputTypes
 }) {
   const theme = useTheme()
-
+  const defaultUppercase = !theme.isV3
+  const uppercase = _uppercase ?? defaultUppercase
   let textFont
   let labelText = label
 

src/Time/timeUtils.ts

@@ -231,12 +231,17 @@ export function useInputColors(highlighted: boolean) {
         ? theme.colors.onPrimaryContainer
         : theme.colors.onBackground
     } else {
+      const t = theme as any as MD2Theme
       if (highlighted && !theme.dark) {
-        return theme.colors.primary
+        const primary = Color(t.colors.primary)
+        const background = Color(backgroundColor)
+        return background.isDark() && primary.isDark()
+          ? '#ffffffff'
+          : t.colors.primary
       }
       return (theme as any as MD2Theme).colors.text
     }
-  }, [highlighted, theme])
+  }, [highlighted, theme, backgroundColor])
 
   return { backgroundColor, color }
 }