"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.StableThemeSwitcher = StableThemeSwitcher;
function _react() {
  const data = _interopRequireWildcard(require("react"));
  _react = function () {
    return data;
  };
  return data;
}
function _designThemes() {
  const data = require("@teambit/design.themes.base-theme");
  _designThemes = function () {
    return data;
  };
  return data;
}
function _designThemes2() {
  const data = require("@teambit/design.themes.dark-theme");
  _designThemes2 = function () {
    return data;
  };
  return data;
}
function _baseReactThemes() {
  const data = require("@teambit/base-react.themes.theme-switcher");
  _baseReactThemes = function () {
    return data;
  };
  return data;
}
function _designThemes3() {
  const data = require("@teambit/design.themes.light-theme");
  _designThemes3 = function () {
    return data;
  };
  return data;
}
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
// These must match the overrides each theme component passes to BaseTheme.
// LightTheme passes these 3 overrides; DarkTheme passes darkThemeValues.
const lightOverrides = {
  backgroundColor: '#fdfdff',
  surface01Color: '#f7f7f7',
  warningColor: '#BB8C25'
};
const themeOverridesMap = {
  light: lightOverrides,
  dark: _designThemes2().darkThemeValues
};
const themes = [_designThemes3().LightTheme, _designThemes2().DarkTheme];
/**
 * A stable theme switcher that does NOT swap React component types on theme change.
 * Instead, it renders a single stable <BaseTheme> and only changes the CSS variable
 * overrides, preventing the entire React tree from unmounting and remounting.
 */
function StableThemeSwitcher({
  children,
  defaultTheme
}) {
  const getInitialTheme = (0, _react().useCallback)(() => defaultTheme && themes.find(t => t.themeName === defaultTheme) || themes[0], [defaultTheme]);
  const [theme, setThemeState] = (0, _react().useState)(getInitialTheme);
  (0, _react().useEffect)(() => {
    setThemeState(getInitialTheme);
  }, [getInitialTheme]);
  const setTheme = (0, _react().useCallback)(option => {
    setThemeState(() => option);
  }, []);
  const picker = (0, _react().useMemo)(() => ({
    current: theme,
    get currentIdx() {
      return themes.indexOf(theme);
    },
    options: themes,
    setTheme
  }), [theme, setTheme]);
  const overrides = themeOverridesMap[theme.themeName || 'light'];
  return /*#__PURE__*/_react().default.createElement(_baseReactThemes().ThemePickerContext.Provider, {
    value: picker
  }, /*#__PURE__*/_react().default.createElement(_designThemes().BaseTheme, {
    overrides: overrides
  }, children));
}

//# sourceMappingURL=stable-theme-switcher.js.map