related-ui-components 2.4.0 → 2.4.2

package/lib/module/theme/ThemeContext.js

@@ -1,20 +1,28 @@
 "use strict";
 
-import React, { createContext, useContext } from "react";
+import React, { createContext, useContext, useState, useMemo, useEffect } from "react";
 import { I18nManager } from "react-native";
 import { jsx as _jsx } from "react/jsx-runtime";
 export const ThemeContext = /*#__PURE__*/createContext({
   theme: {},
-  isRTL: I18nManager.isRTL
+  isRTL: I18nManager.isRTL,
+  setTheme: () => {
+    console.warn("setTheme was called without a ThemeProvider");
+  }
 });
 export const RelatedProvider = ({
   children,
-  theme
+  theme: initialTheme
 }) => {
-  const contextValue = {
+  const [theme, setTheme] = useState(initialTheme);
+  useEffect(() => {
+    setTheme(initialTheme);
+  }, [initialTheme]);
+  const contextValue = useMemo(() => ({
     theme,
+    setTheme,
     isRTL: I18nManager.isRTL
-  };
+  }), [theme]);
   return /*#__PURE__*/_jsx(ThemeContext.Provider, {
     value: contextValue,
     children: children

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

@@ -1 +1 @@
-{"version":3,"names":["React","createContext","useContext","I18nManager","jsx","_jsx","ThemeContext","theme","isRTL","RelatedProvider","children","contextValue","Provider","value","useTheme"],"sourceRoot":"..\\..\\..\\src","sources":["theme/ThemeContext.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,aAAa,EAAEC,UAAU,QAAmB,OAAO;AACnE,SAASC,WAAW,QAAQ,cAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAQ3C,OAAO,MAAMC,YAAY,gBAAGL,aAAa,CAAoB;EAC3DM,KAAK,EAAE,CAAC,CAAc;EACtBC,KAAK,EAAEL,WAAW,CAACK;AACrB,CAAC,CAAC;AAQF,OAAO,MAAMC,eAA6C,GAAGA,CAAC;EAC5DC,QAAQ;EACRH;AACF,CAAC,KAAK;EACJ,MAAMI,YAA+B,GAAG;IACtCJ,KAAK;IACLC,KAAK,EAAEL,WAAW,CAACK;EACrB,CAAC;EAED,oBACEH,IAAA,CAACC,YAAY,CAACM,QAAQ;IAACC,KAAK,EAAEF,YAAa;IAAAD,QAAA,EACxCA;EAAQ,CACY,CAAC;AAE5B,CAAC;AAED,OAAO,MAAMI,QAAQ,GAAGA,CAAA,KAAMZ,UAAU,CAACI,YAAY,CAAC","ignoreList":[]}
+{"version":3,"names":["React","createContext","useContext","useState","useMemo","useEffect","I18nManager","jsx","_jsx","ThemeContext","theme","isRTL","setTheme","console","warn","RelatedProvider","children","initialTheme","contextValue","Provider","value","useTheme"],"sourceRoot":"..\\..\\..\\src","sources":["theme/ThemeContext.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IACVC,aAAa,EACbC,UAAU,EAEVC,QAAQ,EACRC,OAAO,EACPC,SAAS,QACJ,OAAO;AACd,SAASC,WAAW,QAAQ,cAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAS3C,OAAO,MAAMC,YAAY,gBAAGR,aAAa,CAAoB;EAC3DS,KAAK,EAAE,CAAC,CAAc;EACtBC,KAAK,EAAEL,WAAW,CAACK,KAAK;EACxBC,QAAQ,EAAEA,CAAA,KAAM;IACdC,OAAO,CAACC,IAAI,CAAC,6CAA6C,CAAC;EAC7D;AACF,CAAC,CAAC;AAOF,OAAO,MAAMC,eAA6C,GAAGA,CAAC;EAC5DC,QAAQ;EACRN,KAAK,EAAEO;AACT,CAAC,KAAK;EACJ,MAAM,CAACP,KAAK,EAAEE,QAAQ,CAAC,GAAGT,QAAQ,CAAYc,YAAY,CAAC;EAE3DZ,SAAS,CAAC,MAAM;IACdO,QAAQ,CAACK,YAAY,CAAC;EACxB,CAAC,EAAE,CAACA,YAAY,CAAC,CAAC;EAElB,MAAMC,YAAY,GAAGd,OAAO,CAC1B,OAAO;IACLM,KAAK;IACLE,QAAQ;IACRD,KAAK,EAAEL,WAAW,CAACK;EACrB,CAAC,CAAC,EACF,CAACD,KAAK,CACR,CAAC;EAED,oBACEF,IAAA,CAACC,YAAY,CAACU,QAAQ;IAACC,KAAK,EAAEF,YAAa;IAAAF,QAAA,EACxCA;EAAQ,CACY,CAAC;AAE5B,CAAC;AAED,OAAO,MAAMK,QAAQ,GAAGA,CAAA,KAAMnB,UAAU,CAACO,YAAY,CAAC","ignoreList":[]}

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

@@ -3,12 +3,12 @@ import { ThemeType } from "./Colors";
 interface ThemeContextValue {
     theme: ThemeType;
     isRTL: boolean;
+    setTheme: (theme: ThemeType) => void;
 }
 export declare const ThemeContext: React.Context<ThemeContextValue>;
 interface ThemeProviderProps {
     children: ReactNode;
     theme: ThemeType;
-    toggleTheme: () => void;
 }
 export declare const RelatedProvider: React.FC<ThemeProviderProps>;
 export declare const useTheme: () => ThemeContextValue;

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,EAA6B,SAAS,EAAE,MAAM,OAAO,CAAC;AAEpE,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAErC,UAAU,iBAAiB;IACzB,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,OAAO,CAAC;CAChB;AAED,eAAO,MAAM,YAAY,kCAGvB,CAAC;AAEH,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAcxD,CAAC;AAEF,eAAO,MAAM,QAAQ,yBAAiC,CAAC"}
+{"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../../../src/theme/ThemeContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAGZ,SAAS,EAIV,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAErC,UAAU,iBAAiB;IACzB,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,OAAO,CAAC;IACf,QAAQ,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;CACtC;AAED,eAAO,MAAM,YAAY,kCAMvB,CAAC;AAEH,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,EAAE,SAAS,CAAC;CAClB;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAwBxD,CAAC;AAEF,eAAO,MAAM,QAAQ,yBAAiC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "related-ui-components",
-  "version": "2.4.0",
+  "version": "2.4.2",
   "main": "./src/index.ts",
   "scripts": {
     "start": "expo start",

package/src/theme/ThemeContext.tsx

@@ -1,31 +1,51 @@
-import React, { createContext, useContext, ReactNode } from "react";
+import React, {
+  createContext,
+  useContext,
+  ReactNode,
+  useState,
+  useMemo,
+  useEffect,
+} from "react";
 import { I18nManager } from "react-native";
-import { ThemeType } from "./Colors";
+import { ThemeType } from "./Colors"; 
 
 interface ThemeContextValue {
   theme: ThemeType;
   isRTL: boolean;
+  setTheme: (theme: ThemeType) => void;
 }
 
 export const ThemeContext = createContext<ThemeContextValue>({
   theme: {} as ThemeType,
   isRTL: I18nManager.isRTL,
+  setTheme: () => {
+    console.warn("setTheme was called without a ThemeProvider");
+  },
 });
 
 interface ThemeProviderProps {
   children: ReactNode;
   theme: ThemeType;
-  toggleTheme: () => void;
 }
 
 export const RelatedProvider: React.FC<ThemeProviderProps> = ({
   children,
-  theme,
+  theme: initialTheme,
 }) => {
-  const contextValue: ThemeContextValue = {
-    theme,
-    isRTL: I18nManager.isRTL,
-  };
+  const [theme, setTheme] = useState<ThemeType>(initialTheme);
+
+  useEffect(() => {
+    setTheme(initialTheme);
+  }, [initialTheme]);
+
+  const contextValue = useMemo(
+    () => ({
+      theme,
+      setTheme,
+      isRTL: I18nManager.isRTL,
+    }),
+    [theme],
+  );
 
   return (
     <ThemeContext.Provider value={contextValue}>
@@ -34,4 +54,4 @@ export const RelatedProvider: React.FC<ThemeProviderProps> = ({
   );
 };
 
-export const useTheme = () => useContext(ThemeContext);
+export const useTheme = () => useContext(ThemeContext);