fix useAppColorScheme hook to return correct scheme

jaredh159 · Feb 3, 2024 · 3f0ae88 · 3f0ae88
1 parent 10209f3
commit 3f0ae88
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 2 deletions.
diff --git a/src/create.ts b/src/create.ts
@@ -204,6 +204,10 @@ export function create(customConfig: TwConfig, platform: Platform): TailwindFn {
     configureCache();
   };
 
+  tailwindFn.getColorScheme = () => {
+    return device.colorScheme;
+  };
+
   return tailwindFn;
 }
 

diff --git a/src/hooks.ts b/src/hooks.ts
@@ -1,5 +1,5 @@
 import { useState } from 'react';
-import { useColorScheme, useWindowDimensions, Appearance } from 'react-native';
+import { useColorScheme, useWindowDimensions } from 'react-native';
 import type { TailwindFn, RnColorScheme } from './types';
 
 type Options = {
@@ -29,7 +29,7 @@ export function useAppColorScheme(
   setColorScheme: (colorScheme: RnColorScheme) => void,
 ] {
   const [colorScheme, setColorScheme] = useState<RnColorScheme>(
-    initialValue ?? Appearance.getColorScheme(),
+    initialValue ?? tw.getColorScheme(),
   );
   return [
     colorScheme,

diff --git a/src/types.ts b/src/types.ts
@@ -9,6 +9,7 @@ export interface TailwindFn {
   setFontScale: (fontScale: number) => unknown;
   setPixelDensity: (pixelDensity: 1 | 2) => unknown;
   setColorScheme: (colorScheme: RnColorScheme) => unknown;
+  getColorScheme: () => RnColorScheme;
 }
 
 export type ClassInput =