@nayan-ui/react-native/dist/module/components/NTheme.js

React Native Component Library for smooth and faster mobile application development.

"use strict";

import React, { useEffect, useMemo } from 'react';
import { View } from 'react-native';
import { GestureHandlerRootView } from 'react-native-gesture-handler';
import { SafeAreaProvider } from 'react-native-safe-area-context';
import { BottomSheetModalProvider } from '@gorhom/bottom-sheet';
import { ThemeProvider } from '@react-navigation/native';
import { PortalHost } from '@rn-primitives/portal';
import { StatusBar } from 'expo-status-bar';
import { vars } from 'nativewind';
import { useNTheme } from "../hooks/useNTheme.js";
import { setAndroidNavigationBar } from "../lib/android-navigation-bar.js";
import { THEMES } from "../lib/utils.js";
import { NToast } from "./NToast.js";
import { jsx as _jsx, jsxs as _jsxs } from "react-native-css-interop/jsx-runtime";
export const NTheme = /*#__PURE__*/React.memo(({
  children,
  theme: rawTheme,
  themeColors
}) => {
  const {
    theme,
    setTheme,
    setThemeColors,
    isDarkMode
  } = useNTheme();
  useEffect(() => {
    const finalTheme = rawTheme ?? theme ?? THEMES.light;
    setTheme(finalTheme);
    setThemeColors(themeColors);
    setAndroidNavigationBar(finalTheme);
  }, [rawTheme, theme, themeColors]);
  useEffect(() => {
    if (theme) {
      setAndroidNavigationBar(theme);
    }
  }, [theme, themeColors]);
  const themeVars = useMemo(() => ({
    light: vars({
      '--color-primary': themeColors.light.colors.primary,
      '--color-background': themeColors.light.colors.background,
      '--color-card': themeColors.light.colors.card,
      '--color-text': themeColors.light.colors.text,
      '--color-muted': themeColors.light.colors.muted,
      '--color-border': themeColors.light.colors.border,
      '--color-notification': themeColors.light.colors.notification
    }),
    dark: vars({
      '--color-primary': themeColors.dark.colors.primary,
      '--color-background': themeColors.dark.colors.background,
      '--color-card': themeColors.dark.colors.card,
      '--color-text': themeColors.dark.colors.text,
      '--color-muted': themeColors.dark.colors.muted,
      '--color-border': themeColors.dark.colors.border,
      '--color-notification': themeColors.dark.colors.notification
    })
  }), [themeColors]);
  const currentThemeColors = useMemo(() => isDarkMode ? themeColors.dark : themeColors.light, [isDarkMode, themeColors]);
  return _jsx(ThemeProvider, {
    value: currentThemeColors,
    children: _jsxs(View, {
      className: "flex-1",
      style: themeVars[theme],
      children: [_jsx(StatusBar, {
        style: isDarkMode ? THEMES.light : THEMES.dark
      }), _jsx(GestureHandlerRootView, {
        className: "flex-1",
        children: _jsxs(SafeAreaProvider, {
          children: [_jsx(BottomSheetModalProvider, {
            children: children
          }), _jsx(PortalHost, {}), _jsx(NToast, {})]
        })
      })]
    })
  });
});
NTheme.displayName = 'NTheme';
//# sourceMappingURL=NTheme.js.map