related-ui-components 1.9.7 → 1.9.8

package/lib/module/theme/ThemeContext.js

@@ -1,42 +1,31 @@
 "use strict";
 
-import React, { createContext, useContext, useState, useEffect, useCallback } from "react";
-import { I18nManager, useColorScheme } from "react-native"; // Added Appearance
-import { lightTheme, darkTheme } from "./Colors.js"; // Assuming Colors.ts exists
+import React, { createContext, useContext, useState } from "react";
+import { I18nManager, useColorScheme } from "react-native";
+import { lightTheme, darkTheme } from "./Colors.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export const ThemeContext = /*#__PURE__*/createContext({
   theme: lightTheme,
-  isDark: false,
-  toggleTheme: () => console.warn("toggleTheme called outside of ThemeProvider"),
   isRTL: I18nManager.isRTL,
-  setRTL: () => console.warn("setRTL called outside of ThemeProvider")
+  isDark: useColorScheme() === "dark",
+  toggleTheme: () => {}
 });
+
+// Define props for ThemeProvider
+
+// Provider component
 export const RelatedProvider = ({
   children,
   customLightTheme,
   customDarkTheme,
-  initialDark,
-  initialRTL
+  dark,
+  forceRTL
 }) => {
-  const systemColorScheme = useColorScheme();
-  const [isDark, setIsDark] = useState(initialDark ?? systemColorScheme === "dark");
-  const [isRTL, setIsRTLState] = useState(initialRTL ?? I18nManager.isRTL);
-  useEffect(() => {
-    if (typeof initialDark === "boolean") {
-      setIsDark(initialDark);
-    }
-  }, [initialDark]);
-  useEffect(() => {
-    if (typeof initialRTL === "boolean") {
-      setIsRTLState(initialRTL);
-    }
-  }, [initialRTL]);
-  useEffect(() => {
-    if (initialDark === undefined) {
-      setIsDark(useColorScheme() === "dark");
-    }
-  }, [initialDark]);
-  const themes = React.useMemo(() => ({
+  const [isDark, setIsDark] = useState(dark || useColorScheme() === "dark");
+  const currentIsRTL = typeof forceRTL === "boolean" ? forceRTL : false;
+
+  // Allow custom themes to override defaults
+  const [themes, setThemes] = useState({
     light: {
       ...lightTheme,
       ...customLightTheme
@@ -45,25 +34,21 @@ export const RelatedProvider = ({
       ...darkTheme,
       ...customDarkTheme
     }
-  }), [customLightTheme, customDarkTheme]);
+  });
+  const toggleTheme = () => setIsDark(prev => !prev);
   const currentTheme = isDark ? themes.dark : themes.light;
-  const toggleTheme = useCallback(() => {
-    setIsDark(prevIsDark => !prevIsDark);
-  }, []);
-  const setRTL = useCallback(rtlValue => {
-    setIsRTLState(rtlValue);
-  }, []);
   const contextValue = {
     theme: currentTheme,
+    isRTL: currentIsRTL,
     isDark,
-    toggleTheme,
-    isRTL,
-    setRTL
+    toggleTheme
   };
   return /*#__PURE__*/_jsx(ThemeContext.Provider, {
     value: contextValue,
     children: children
   });
 };
+
+// Hook for easy access
 export const useTheme = () => useContext(ThemeContext);
 //# sourceMappingURL=ThemeContext.js.map

package/lib/module/theme/ThemeContext.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","createContext","useContext","useState","useEffect","useCallback","I18nManager","useColorScheme","lightTheme","darkTheme","jsx","_jsx","ThemeContext","theme","isDark","toggleTheme","console","warn","isRTL","setRTL","RelatedProvider","children","customLightTheme","customDarkTheme","initialDark","initialRTL","systemColorScheme","setIsDark","setIsRTLState","undefined","themes","useMemo","light","dark","currentTheme","prevIsDark","rtlValue","contextValue","Provider","value","useTheme"],"sourceRoot":"..\\..\\..\\src","sources":["theme/ThemeContext.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IACVC,aAAa,EACbC,UAAU,EACVC,QAAQ,EACRC,SAAS,EAETC,WAAW,QACN,OAAO;AACd,SAASC,WAAW,EAAEC,cAAc,QAAoB,cAAc,CAAC,CAAC;AACxE,SAASC,UAAU,EAAaC,SAAS,QAAQ,aAAU,CAAC,CAAC;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAU7D,OAAO,MAAMC,YAAY,gBAAGX,aAAa,CAAsB;EAC7DY,KAAK,EAAEL,UAAU;EACjBM,MAAM,EAAE,KAAK;EACbC,WAAW,EAAEA,CAAA,KAAMC,OAAO,CAACC,IAAI,CAAC,6CAA6C,CAAC;EAC9EC,KAAK,EAAEZ,WAAW,CAACY,KAAK;EACxBC,MAAM,EAAEA,CAAA,KAAMH,OAAO,CAACC,IAAI,CAAC,wCAAwC;AACrE,CAAC,CAAC;AAUF,OAAO,MAAMG,eAA+C,GAAGA,CAAC;EAC9DC,QAAQ;EACRC,gBAAgB;EAChBC,eAAe;EACfC,WAAW;EACXC;AACF,CAAC,KAAK;EACJ,MAAMC,iBAAiB,GAAGnB,cAAc,CAAC,CAAC;EAC1C,MAAM,CAACO,MAAM,EAAEa,SAAS,CAAC,GAAGxB,QAAQ,CAClCqB,WAAW,IAAKE,iBAAiB,KAAK,MACxC,CAAC;EAED,MAAM,CAACR,KAAK,EAAEU,aAAa,CAAC,GAAGzB,QAAQ,CACrCsB,UAAU,IAAInB,WAAW,CAACY,KAC5B,CAAC;EAEDd,SAAS,CAAC,MAAM;IACd,IAAI,OAAOoB,WAAW,KAAK,SAAS,EAAE;MACpCG,SAAS,CAACH,WAAW,CAAC;IACxB;EACF,CAAC,EAAE,CAACA,WAAW,CAAC,CAAC;EAEjBpB,SAAS,CAAC,MAAM;IACd,IAAI,OAAOqB,UAAU,KAAK,SAAS,EAAE;MACnCG,aAAa,CAACH,UAAU,CAAC;IAC3B;EACF,CAAC,EAAE,CAACA,UAAU,CAAC,CAAC;EAEhBrB,SAAS,CAAC,MAAM;IACd,IAAIoB,WAAW,KAAKK,SAAS,EAAE;MAC3BF,SAAS,CAACpB,cAAc,CAAC,CAAC,KAAK,MAAM,CAAC;IAC1C;EACF,CAAC,EAAE,CAACiB,WAAW,CAAC,CAAC;EAEjB,MAAMM,MAAM,GAAG9B,KAAK,CAAC+B,OAAO,CAAC,OAAO;IAClCC,KAAK,EAAE;MAAE,GAAGxB,UAAU;MAAE,GAAGc;IAAiB,CAAc;IAC1DW,IAAI,EAAE;MAAE,GAAGxB,SAAS;MAAE,GAAGc;IAAgB;EAC3C,CAAC,CAAC,EAAE,CAACD,gBAAgB,EAAEC,eAAe,CAAC,CAAC;EAExC,MAAMW,YAAY,GAAGpB,MAAM,GAAGgB,MAAM,CAACG,IAAI,GAAGH,MAAM,CAACE,KAAK;EAExD,MAAMjB,WAAW,GAAGV,WAAW,CAAC,MAAM;IACpCsB,SAAS,CAACQ,UAAU,IAAI,CAACA,UAAU,CAAC;EACtC,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMhB,MAAM,GAAGd,WAAW,CAAE+B,QAAiB,IAAK;IAChDR,aAAa,CAACQ,QAAQ,CAAC;EACzB,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,YAAiC,GAAG;IACxCxB,KAAK,EAAEqB,YAAY;IACnBpB,MAAM;IACNC,WAAW;IACXG,KAAK;IACLC;EACF,CAAC;EAED,oBACER,IAAA,CAACC,YAAY,CAAC0B,QAAQ;IAACC,KAAK,EAAEF,YAAa;IAAAhB,QAAA,EACxCA;EAAQ,CACY,CAAC;AAE5B,CAAC;AAED,OAAO,MAAMmB,QAAQ,GAAGA,CAAA,KAAMtC,UAAU,CAACU,YAAY,CAAC","ignoreList":[]}
+{"version":3,"names":["React","createContext","useContext","useState","I18nManager","useColorScheme","lightTheme","darkTheme","jsx","_jsx","ThemeContext","theme","isRTL","isDark","toggleTheme","RelatedProvider","children","customLightTheme","customDarkTheme","dark","forceRTL","setIsDark","currentIsRTL","themes","setThemes","light","prev","currentTheme","contextValue","Provider","value","useTheme"],"sourceRoot":"..\\..\\..\\src","sources":["theme/ThemeContext.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IACVC,aAAa,EACbC,UAAU,EACVC,QAAQ,QAGH,OAAO;AAEd,SAASC,WAAW,EAAEC,cAAc,QAAQ,cAAc;AAC1D,SAASC,UAAU,EAAaC,SAAS,QAAQ,aAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAQ5D,OAAO,MAAMC,YAAY,gBAAGT,aAAa,CAAiB;EACxDU,KAAK,EAAEL,UAAU;EACjBM,KAAK,EAAER,WAAW,CAACQ,KAAK;EACxBC,MAAM,EAAER,cAAc,CAAC,CAAC,KAAK,MAAM;EACnCS,WAAW,EAAEA,CAAA,KAAM,CAAC;AACtB,CAAC,CAAC;;AAEF;;AASA;AACA,OAAO,MAAMC,eAA+C,GAAGA,CAAC;EAC9DC,QAAQ;EACRC,gBAAgB;EAChBC,eAAe;EACfC,IAAI;EACJC;AACF,CAAC,KAAK;EACJ,MAAM,CAACP,MAAM,EAAEQ,SAAS,CAAC,GAAGlB,QAAQ,CAClCgB,IAAI,IAAId,cAAc,CAAC,CAAC,KAAK,MAC/B,CAAC;EACD,MAAMiB,YAAY,GAAG,OAAOF,QAAQ,KAAK,SAAS,GAAGA,QAAQ,GAAG,KAAK;;EAErE;EACA,MAAM,CAACG,MAAM,EAAEC,SAAS,CAAC,GAAGrB,QAAQ,CAAC;IACnCsB,KAAK,EAAE;MAAE,GAAGnB,UAAU;MAAE,GAAGW;IAAiB,CAAc;IAC1DE,IAAI,EAAE;MAAE,GAAGZ,SAAS;MAAE,GAAGW;IAAgB;EAC3C,CAAC,CAAC;EAEF,MAAMJ,WAAW,GAAGA,CAAA,KAAMO,SAAS,CAAEK,IAAI,IAAK,CAACA,IAAI,CAAC;EAEpD,MAAMC,YAAY,GAAGd,MAAM,GAAGU,MAAM,CAACJ,IAAI,GAAGI,MAAM,CAACE,KAAK;EAExD,MAAMG,YAA4B,GAAG;IACnCjB,KAAK,EAAEgB,YAAY;IACnBf,KAAK,EAAEU,YAAY;IACnBT,MAAM;IACNC;EACF,CAAC;EAED,oBACEL,IAAA,CAACC,YAAY,CAACmB,QAAQ;IAACC,KAAK,EAAEF,YAAa;IAAAZ,QAAA,EACxCA;EAAQ,CACY,CAAC;AAE5B,CAAC;;AAED;AACA,OAAO,MAAMe,QAAQ,GAAGA,CAAA,KAAM7B,UAAU,CAACQ,YAAY,CAAC","ignoreList":[]}

package/lib/typescript/src/theme/ThemeContext.d.ts

@@ -1,21 +1,20 @@
 import React, { ReactNode } from "react";
 import { ThemeType } from "./Colors";
-interface RelatedContextValue {
+interface RelatedContext {
     theme: ThemeType;
+    isRTL: boolean;
     isDark: boolean;
     toggleTheme: () => void;
-    isRTL: boolean;
-    setRTL: (rtl: boolean) => void;
 }
-export declare const ThemeContext: React.Context<RelatedContextValue>;
+export declare const ThemeContext: React.Context<RelatedContext>;
 interface RelatedProviderProps {
     children: ReactNode;
     customLightTheme?: Partial<ThemeType>;
     customDarkTheme?: Partial<ThemeType>;
-    initialDark?: boolean;
-    initialRTL?: boolean;
+    dark?: boolean;
+    forceRTL?: boolean;
 }
 export declare const RelatedProvider: React.FC<RelatedProviderProps>;
-export declare const useTheme: () => RelatedContextValue;
+export declare const useTheme: () => RelatedContext;
 export {};
 //# sourceMappingURL=ThemeContext.d.ts.map

package/lib/typescript/src/theme/ThemeContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../../../src/theme/ThemeContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAKZ,SAAS,EAEV,MAAM,OAAO,CAAC;AAEf,OAAO,EAAc,SAAS,EAAa,MAAM,UAAU,CAAC;AAE5D,UAAU,mBAAmB;IAC3B,KAAK,EAAE,SAAS,CAAC;IACjB,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,KAAK,EAAE,OAAO,CAAC;IACf,MAAM,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,CAAC;CAChC;AAED,eAAO,MAAM,YAAY,oCAMvB,CAAC;AAEH,UAAU,oBAAoB;IAC5B,QAAQ,EAAE,SAAS,CAAC;IACpB,gBAAgB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACtC,eAAe,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACrC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA8D1D,CAAC;AAEF,eAAO,MAAM,QAAQ,2BAAiC,CAAC"}
+{"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../../../src/theme/ThemeContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAKZ,SAAS,EACV,MAAM,OAAO,CAAC;AAGf,OAAO,EAAc,SAAS,EAAa,MAAM,UAAU,CAAC;AAE5D,UAAU,cAAc;IACtB,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,OAAO,CAAC;IACf,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB;AACD,eAAO,MAAM,YAAY,+BAKvB,CAAC;AAGH,UAAU,oBAAoB;IAC5B,QAAQ,EAAE,SAAS,CAAC;IACpB,gBAAgB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACtC,eAAe,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAGD,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAkC1D,CAAC;AAGF,eAAO,MAAM,QAAQ,sBAAiC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "related-ui-components",
-  "version": "1.9.7",
+  "version": "1.9.8",
   "main": "./lib\\module\\index.js",
   "scripts": {
     "start": "expo start",

package/src/theme/ThemeContext.tsx

@@ -4,90 +4,61 @@ import React, {
   useState,
   useEffect,
   ReactNode,
-  useCallback,
 } from "react";
-import { I18nManager, useColorScheme, Appearance } from "react-native"; // Added Appearance
-import { lightTheme, ThemeType, darkTheme } from "./Colors"; // Assuming Colors.ts exists
 
-interface RelatedContextValue {
+import { I18nManager, useColorScheme } from "react-native";
+import { lightTheme, ThemeType, darkTheme } from "./Colors";
+
+interface RelatedContext {
   theme: ThemeType;
-  isDark: boolean; // Expose isDark for components to know the mode
-  toggleTheme: () => void;
   isRTL: boolean;
-  setRTL: (rtl: boolean) => void; // More explicit than a toggle
+  isDark: boolean,
+  toggleTheme: () => void;
 }
-
-export const ThemeContext = createContext<RelatedContextValue>({
+export const ThemeContext = createContext<RelatedContext>({
   theme: lightTheme,
-  isDark: false,
-  toggleTheme: () => console.warn("toggleTheme called outside of ThemeProvider"),
   isRTL: I18nManager.isRTL,
-  setRTL: () => console.warn("setRTL called outside of ThemeProvider"),
+  isDark: useColorScheme() === "dark",
+  toggleTheme: () => {}
 });
 
+// Define props for ThemeProvider
 interface RelatedProviderProps {
   children: ReactNode;
   customLightTheme?: Partial<ThemeType>;
   customDarkTheme?: Partial<ThemeType>;
-  initialDark?: boolean;
-  initialRTL?: boolean; 
+  dark?: boolean;
+  forceRTL?: boolean;
 }
 
+// Provider component
 export const RelatedProvider: React.FC<RelatedProviderProps> = ({
   children,
   customLightTheme,
   customDarkTheme,
-  initialDark,
-  initialRTL,
+  dark,
+  forceRTL,
 }) => {
-  const systemColorScheme = useColorScheme();
   const [isDark, setIsDark] = useState<boolean>(
-    initialDark ?? (systemColorScheme === "dark")
-  );
-
-  const [isRTL, setIsRTLState] = useState<boolean>(
-    initialRTL ?? I18nManager.isRTL
+    dark || useColorScheme() === "dark"
   );
+  const currentIsRTL = typeof forceRTL === "boolean" ? forceRTL : false;
 
-  useEffect(() => {
-    if (typeof initialDark === "boolean") {
-      setIsDark(initialDark);
-    }
-  }, [initialDark]);
-
-  useEffect(() => {
-    if (typeof initialRTL === "boolean") {
-      setIsRTLState(initialRTL);
-    }
-  }, [initialRTL]);
-
-  useEffect(() => {
-    if (initialDark === undefined) {
-        setIsDark(useColorScheme() === "dark");
-    }
-  }, [initialDark]);
-
-  const themes = React.useMemo(() => ({
+  // Allow custom themes to override defaults
+  const [themes, setThemes] = useState({
     light: { ...lightTheme, ...customLightTheme } as ThemeType,
     dark: { ...darkTheme, ...customDarkTheme } as ThemeType,
-  }), [customLightTheme, customDarkTheme]);
+  });
 
-  const currentTheme = isDark ? themes.dark : themes.light;
-
-  const toggleTheme = useCallback(() => {
-    setIsDark(prevIsDark => !prevIsDark);
-  }, []);
+  const toggleTheme = () => setIsDark((prev) => !prev);
 
-  const setRTL = useCallback((rtlValue: boolean) => {
-    setIsRTLState(rtlValue);
-  }, []);
+  const currentTheme = isDark ? themes.dark : themes.light;
 
-  const contextValue: RelatedContextValue = {
+  const contextValue: RelatedContext = {
     theme: currentTheme,
+    isRTL: currentIsRTL,
     isDark,
-    toggleTheme,
-    isRTL,
-    setRTL,
+    toggleTheme
   };
 
   return (
@@ -97,4 +68,5 @@ export const RelatedProvider: React.FC<RelatedProviderProps> = ({
   );
 };
 
-export const useTheme = () => useContext(ThemeContext);
+// Hook for easy access
+export const useTheme = () => useContext(ThemeContext);