text: import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
  import _extends from "@babel/runtime/helpers/esm/extends";
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
  import _typeof from "@babel/runtime/helpers/esm/typeof";
  import { formatMuiErrorMessage as _formatMuiErrorMessage } from "@mui/utils";
  import * as React from 'react';
  import PropTypes from 'prop-types';
  import { GlobalStyles } from '@mui/styled-engine';
  import { deepmerge } from '@mui/utils';
  import cssVarsParser from './cssVarsParser';
  import ThemeProvider from '../ThemeProvider';
  import getInitColorSchemeScript, { DEFAULT_ATTRIBUTE, DEFAULT_MODE_STORAGE_KEY } from './getInitColorSchemeScript';
  import useCurrentColorScheme from './useCurrentColorScheme';
  import { jsx as _jsx } from "react/jsx-runtime";
  import { jsxs as _jsxs } from "react/jsx-runtime";
  export default function createCssVarsProvider(options) {
    var _options$theme = options.theme,
        baseTheme = _options$theme === void 0 ? {} : _options$theme,
        _options$defaultMode = options.defaultMode,
        desisgnSystemMode = _options$defaultMode === void 0 ? 'light' : _options$defaultMode,
        designSystemColorScheme = options.defaultColorScheme,
        _options$prefix = options.prefix,
        designSystemPrefix = _options$prefix === void 0 ? '' : _options$prefix,
        shouldSkipGeneratingVar = options.shouldSkipGeneratingVar;
  
    if (!baseTheme.colorSchemes || typeof designSystemColorScheme === 'string' && !baseTheme.colorSchemes[designSystemColorScheme] || _typeof(designSystemColorScheme) === 'object' && !baseTheme.colorSchemes[designSystemColorScheme == null ? void 0 : designSystemColorScheme.light] || _typeof(designSystemColorScheme) === 'object' && !baseTheme.colorSchemes[designSystemColorScheme == null ? void 0 : designSystemColorScheme.dark]) {
      console.error("MUI: `".concat(designSystemColorScheme, "` does not exist in `theme.colorSchemes`."));
    }
  
    var ColorSchemeContext = /*#__PURE__*/React.createContext(undefined);
  
    var useColorScheme = function useColorScheme() {
      var value = React.useContext(ColorSchemeContext);
  
      if (!value) {
        throw new Error(process.env.NODE_ENV !== "production" ? "MUI: `useColorScheme` must be called under <CssVarsProvider />" : _formatMuiErrorMessage(19));
      }
  
      return value;
    };
  
    function CssVarsProvider(_ref) {
      var children = _ref.children,
          _ref$theme = _ref.theme,
          themeProp = _ref$theme === void 0 ? {} : _ref$theme,
          _ref$prefix = _ref.prefix,
          prefix = _ref$prefix === void 0 ? designSystemPrefix : _ref$prefix,
          _ref$modeStorageKey = _ref.modeStorageKey,
          modeStorageKey = _ref$modeStorageKey === void 0 ? DEFAULT_MODE_STORAGE_KEY : _ref$modeStorageKey,
          _ref$attribute = _ref.attribute,
          attribute = _ref$attribute === void 0 ? DEFAULT_ATTRIBUTE : _ref$attribute,
          _ref$defaultMode = _ref.defaultMode,
          defaultMode = _ref$defaultMode === void 0 ? desisgnSystemMode : _ref$defaultMode,
          _ref$defaultColorSche = _ref.defaultColorScheme,
          defaultColorScheme = _ref$defaultColorSche === void 0 ? designSystemColorScheme : _ref$defaultColorSche;
  
      var _baseTheme$colorSchem = baseTheme.colorSchemes,
          baseColorSchemes = _baseTheme$colorSchem === void 0 ? {} : _baseTheme$colorSchem,
          restBaseTheme = _objectWithoutProperties(baseTheme, ["colorSchemes"]);
  
      var _themeProp$colorSchem = themeProp.colorSchemes,
          colorSchemesProp = _themeProp$colorSchem === void 0 ? {} : _themeProp$colorSchem,
          restThemeProp = _objectWithoutProperties(themeProp, ["colorSchemes"]);
  
      var mergedTheme = deepmerge(restBaseTheme, restThemeProp);
      var colorSchemes = deepmerge(baseColorSchemes, colorSchemesProp);
      var allColorSchemes = Object.keys(colorSchemes);
      var defaultLightColorScheme = typeof defaultColorScheme === 'string' ? defaultColorScheme : defaultColorScheme.light;
      var defaultDarkColorScheme = typeof defaultColorScheme === 'string' ? defaultColorScheme : defaultColorScheme.dark;
  
      var _useCurrentColorSchem = useCurrentColorScheme({
        supportedColorSchemes: allColorSchemes,
        defaultLightColorScheme: defaultLightColorScheme,
        defaultDarkColorScheme: defaultDarkColorScheme,
        modeStorageKey: modeStorageKey,
        defaultMode: defaultMode
      }),
          mode = _useCurrentColorSchem.mode,
          setMode = _useCurrentColorSchem.setMode,
          lightColorScheme = _useCurrentColorSchem.lightColorScheme,
          darkColorScheme = _useCurrentColorSchem.darkColorScheme,
          colorScheme = _useCurrentColorSchem.colorScheme,
          setColorScheme = _useCurrentColorSchem.setColorScheme;
  
      var resolvedColorScheme = function () {
        if (!colorScheme) {
          // This scope occurs on the server
          if (defaultMode === 'dark') {
            return defaultDarkColorScheme;
          } // use light color scheme, if default mode is 'light' | 'auto'
  
  
          return defaultLightColorScheme;
        }
  
        return colorScheme;
      }();
  
      var _cssVarsParser = cssVarsParser(mergedTheme, {
        prefix: prefix,
        basePrefix: designSystemPrefix,
        shouldSkipGeneratingVar: shouldSkipGeneratingVar
      }),
          rootCss = _cssVarsParser.css,
          rootVars = _cssVarsParser.vars;
  
      mergedTheme = _extends({}, mergedTheme, colorSchemes[resolvedColorScheme], {
        colorSchemes: colorSchemes,
        vars: rootVars
      });
      var styleSheet = {};
      Object.entries(colorSchemes).forEach(function (_ref2) {
        var _ref3 = _slicedToArray(_ref2, 2),
            key = _ref3[0],
            scheme = _ref3[1];
  
        var _cssVarsParser2 = cssVarsParser(scheme, {
          prefix: prefix,
          basePrefix: designSystemPrefix,
          shouldSkipGeneratingVar: shouldSkipGeneratingVar
        }),
            css = _cssVarsParser2.css,
            vars = _cssVarsParser2.vars;
  
        mergedTheme.vars = deepmerge(mergedTheme.vars, vars);
  
        var resolvedDefaultColorScheme = function () {
          if (typeof defaultColorScheme === 'string') {
            return defaultColorScheme;
          }
  
          if (defaultMode === 'dark') {
            return defaultColorScheme.dark;
          }
  
          return defaultColorScheme.light;
        }();
  
        if (key === resolvedDefaultColorScheme) {
          styleSheet[':root'] = css;
        } else {
          styleSheet["[".concat(attribute, "=\"").concat(key, "\"]")] = css;
        }
      });
      React.useEffect(function () {
        if (colorScheme) {
          document.body.setAttribute(attribute, colorScheme);
        }
      }, [colorScheme, attribute]);
      return /*#__PURE__*/_jsxs(ColorSchemeContext.Provider, {
        value: {
          mode: mode,
          setMode: setMode,
          lightColorScheme: lightColorScheme,
          darkColorScheme: darkColorScheme,
          colorScheme: colorScheme,
          setColorScheme: setColorScheme,
          allColorSchemes: allColorSchemes
        },
        children: [/*#__PURE__*/_jsx(GlobalStyles, {
          styles: {
            ':root': rootCss
          }
        }), /*#__PURE__*/_jsx(GlobalStyles, {
          styles: styleSheet
        }), /*#__PURE__*/_jsx(ThemeProvider, {
          theme: mergedTheme,
          children: children
        })]
      });
    }
  
    process.env.NODE_ENV !== "production" ? CssVarsProvider.propTypes = {
      /**
       * The body attribute name to attach colorScheme.
       */
      attribute: PropTypes.string,
  
      /**
       * Your component tree.
       */
      children: PropTypes.node,
  
      /**
       * The initial color scheme used.
       */
      defaultColorScheme: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
  
      /**
       * The initial mode used.
       */
      defaultMode: PropTypes.string,
  
      /**
       * The key in the local storage used to store current color scheme.
       */
      modeStorageKey: PropTypes.string,
  
      /**
       * css variable prefix
       */
      prefix: PropTypes.string,
  
      /**
       * The calculated theme object that will be passed through context.
       */
      theme: PropTypes.object
    } : void 0;
    return {
      CssVarsProvider: CssVarsProvider,
      useColorScheme: useColorScheme,
      getInitColorSchemeScript: getInitColorSchemeScript
    };
  }