@jobber/components-native 0.76.0 → 0.77.1

package/dist/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@jobber/components-native",
-    "version": "0.76.0",
+    "version": "0.77.1",
     "license": "MIT",
     "description": "React Native implementation of Atlantis",
     "repository": {
@@ -80,5 +80,5 @@
         "react-native-safe-area-context": "^4.5.2",
         "react-native-svg": ">=12.0.0"
     },
-    "gitHead": "3dbb361d102c6ae833d1dce373125b7bf68508c0"
+    "gitHead": "ddce093f19e0b03e0d33b7706842dc94b6c65739"
 }

package/dist/src/AtlantisThemeContext/AtlantisThemeContext.js

@@ -0,0 +1,32 @@
+import { androidTokens, darkTokens, iosTokens } from "@jobber/design";
+import React, { createContext, useContext, useState } from "react";
+import merge from "lodash/merge";
+import { Platform } from "react-native";
+const lightTokens = Platform.select({
+    ios: () => iosTokens,
+    android: () => androidTokens,
+    default: () => androidTokens,
+})();
+const completeDarkTokens = merge({}, lightTokens, darkTokens);
+const AtlantisThemeContext = createContext({
+    theme: "light",
+    tokens: lightTokens,
+    setTheme: () => {
+        console.error("useAtlantisTheme accessed outside of AtlantisThemeContextProvider");
+    },
+});
+export function AtlantisThemeContextProvider({ children, dangerouslyOverrideTheme, }) {
+    // TODO: check last saved theme from local/device storage
+    const initialTheme = "light";
+    const [globalTheme, setGlobalTheme] = useState(initialTheme);
+    const currentTheme = dangerouslyOverrideTheme !== null && dangerouslyOverrideTheme !== void 0 ? dangerouslyOverrideTheme : globalTheme;
+    const currentTokens = currentTheme === "dark" ? completeDarkTokens : lightTokens;
+    return (React.createElement(AtlantisThemeContext.Provider, { value: {
+            theme: currentTheme,
+            tokens: currentTokens,
+            setTheme: setGlobalTheme,
+        } }, children));
+}
+export function useAtlantisTheme() {
+    return useContext(AtlantisThemeContext);
+}

package/dist/src/AtlantisThemeContext/index.js

@@ -0,0 +1 @@
+export { AtlantisThemeContextProvider, useAtlantisTheme, } from "./AtlantisThemeContext";

package/dist/src/AtlantisThemeContext/types.js

@@ -0,0 +1 @@
+export {};

package/dist/src/index.js

@@ -2,6 +2,7 @@ export * from "./ActionItem";
 export * from "./ActionLabel";
 export * from "./ActivityIndicator";
 export * from "./AtlantisContext";
+export * from "./AtlantisThemeContext";
 export * from "./AutoLink";
 export * from "./Banner";
 export * from "./BottomSheet";

package/dist/src/utils/design/index.js

@@ -1,5 +1,10 @@
 import { Platform } from "react-native";
 import { androidTokens, iosTokens } from "@jobber/design";
+/**
+ * These design tokens don't react to theme changes. Only use these if you need to access
+ * tokens that are not affected by the current theme, otherwise you should be using our
+ * useAtlantisTheme() hook to access the current theme's tokens.
+ */
 export const tokens = Platform.select({
     ios: () => iosTokens,
     android: () => androidTokens,

package/dist/src/utils/meta/meta.json

@@ -8,6 +8,7 @@
         "AtlantisContext.Provider",
         "AtlantisFormContext.Consumer",
         "AtlantisFormContext.Provider",
+        "AtlantisThemeContextProvider",
         "AutoLink",
         "Banner",
         "BottomSheet",