@hoddy-ui/core 2.5.23 → 2.5.25

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hoddy-ui/core",
-  "version": "2.5.23",
+  "version": "2.5.25",
   "description": "Core rich react native components written in typescript",
   "main": "index.ts",
   "repository": {

package/src/hooks.ts

@@ -1,7 +1,9 @@
 import { useContext } from "react";
-import { Platform } from "react-native";
+import { Platform, useColorScheme } from "react-native";
 import { UIThemeContext } from "./theme";
 import colors from "./theme/colors";
+import { ThemeModes, ThemeTypes } from "./types";
+import AsyncStorage from "@react-native-async-storage/async-storage";
 
 export const useColors = () => {
   const { themeState } = useContext(UIThemeContext);
@@ -14,8 +16,18 @@ export const useTheme = () => {
 };
 
 export const useThemeContext = () => {
-  const { themeState: theme, themeDispatch: setTheme } =
-    useContext(UIThemeContext);
+  const { themeState: theme, themeDispatch } = useContext(UIThemeContext);
+  const colorScheme: ThemeTypes = useColorScheme()!;
+
+  const setTheme = (theme: ThemeModes) => {
+    if (theme === "default") {
+      themeDispatch?.({ type: "default", payload: colorScheme });
+      AsyncStorage.setItem("theme", "default");
+    } else {
+      themeDispatch?.({ type: theme });
+      AsyncStorage.setItem("theme", theme);
+    }
+  };
   return { theme, setTheme };
 };
 
@@ -24,7 +36,6 @@ export const useNavScreenOptions = (type: "stack" | "tab" | "drawer") => {
   const options: any = {
     stack: {
       headerShown: false,
-
       headerStyle: {
         backgroundColor: colors.white[1],
       },

package/src/types.ts

@@ -55,7 +55,7 @@ export interface ThemeState {
 
 export interface ThemeContext {
   themeState: ThemeState;
-  themeDispatch?: any;
+  themeDispatch?: (action: ThemeActionTypes) => void;
 }
 export interface ThemeProviderProps {
   children: ReactNode;