mobile: Add dark mode support

1 files changed, 25 insertions, 0 deletions

diff --git a/apps/mobile/components/navigation/tabs.tsx b/apps/mobile/components/navigation/tabs.tsx
new file mode 100644
index 00000000..976731bc
--- /dev/null
+++ b/apps/mobile/components/navigation/tabs.tsx
@@ -0,0 +1,25 @@
+import { ViewStyle } from "react-native";
+import { Tabs } from "expo-router";
+import { cssInterop } from "nativewind";
+
+function StyledTabsImpl({
+  tabBarStyle,
+  headerStyle,
+  ...props
+}: React.ComponentProps<typeof Tabs> & {
+  tabBarStyle?: ViewStyle;
+  headerStyle?: ViewStyle;
+}) {
+  props.screenOptions = {
+    ...props.screenOptions,
+    tabBarStyle,
+    headerStyle,
+  };
+  return <Tabs {...props} />;
+}
+
+export const StyledTabs = cssInterop(StyledTabsImpl, {
+  tabBarClassName: "tabBarStyle",
+  headerClassName: "headerStyle",
+  sceneContainerClassName: "sceneContainerStyle",
+});