import React from "react";
import useTheme from "../hooks/useTheme";
import ThemeContext from "../contexts/themeContext";
import lightTheme from "./variants/light";
import darkTheme from "./variants/dark";
import cosmicTheme from "./variants/cosmic";
import { getThemeByType, mergeTheme, switchTheme } from "./utils";
import { CssBaseline } from "../components/CssBaseline";
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";

const ThemeProvider = ({
  children,
  theme,
  baseline = true
}) => {
  //  Case of theme being different from defaults
  let userTheme = lightTheme; // default theme

  if (typeof theme !== "string") {
    const customTheme = theme;
    const currentTheme = useTheme();
    const baseTheme = customTheme.type ? getThemeByType(customTheme.type) : currentTheme;
    const merged = mergeTheme(baseTheme, customTheme); // Case of theme being different from defaults

    userTheme = currentTheme.type !== merged.type ? switchTheme(merged) : merged;
  }

  return /*#__PURE__*/_jsxs(ThemeContext.Provider, {
    value: typeof theme === "string" ? theme === "light" ? lightTheme : theme === "dark" ? darkTheme : theme === "cosmic" ? cosmicTheme : userTheme // default
    : userTheme,
    children: [baseline && /*#__PURE__*/_jsx(CssBaseline, {}), children]
  });
};

export default ThemeProvider;