@momentum-ui/react-collaboration
Version:
Cisco Momentum UI Framework for React Collaboration Applications
40 lines • 2.65 kB
JavaScript
import React from 'react';
import classNames from 'classnames';
// TODO: legacy tokens - to be removed:
import '@momentum-ui/design-tokens/dist/index.css';
// TODO: we should not use core colors, only theme colors - to be removed:
import '@momentum-design/tokens/dist/css/core/complete.css';
import '@momentum-design/tokens/dist/css/elevation/complete.css';
// import Momentum fonts and typography defaults:
import '@momentum-design/fonts/dist/css/fonts.css';
import '@momentum-design/tokens/dist/css/typography/complete.css';
// import Momentum theme tokens:
import '@momentum-design/tokens/dist/css/theme/webex/dark-stable.css';
import '@momentum-design/tokens/dist/css/theme/webex/dark-bronze-stable.css';
import '@momentum-design/tokens/dist/css/theme/webex/dark-indigo-stable.css';
import '@momentum-design/tokens/dist/css/theme/webex/dark-jade-stable.css';
import '@momentum-design/tokens/dist/css/theme/webex/dark-lavender-stable.css';
import '@momentum-design/tokens/dist/css/theme/webex/dark-rose-stable.css';
import '@momentum-design/tokens/dist/css/theme/webex/light-stable.css';
import '@momentum-design/tokens/dist/css/theme/webex/light-bronze-stable.css';
import '@momentum-design/tokens/dist/css/theme/webex/light-indigo-stable.css';
import '@momentum-design/tokens/dist/css/theme/webex/light-jade-stable.css';
import '@momentum-design/tokens/dist/css/theme/webex/light-lavender-stable.css';
import '@momentum-design/tokens/dist/css/theme/webex/light-rose-stable.css';
import { ThemeProvider as MdcThemeProvider, IconProvider as MdcIconProvider, } from '@momentum-design/components/dist/react';
import { DEFAULTS, STYLE, THEME_CLASS_PREFIX, THEME_CLASS_PREFIX_STABLE, } from './ThemeProvider.constants';
import './ThemeProvider.style.scss';
/**
* Provides a collection of CSSVariables based on a ThemeToken to all child elements inside of a rendered `<div />` element.
*/
var ThemeProvider = function (_a) {
var children = _a.children, id = _a.id, style = _a.style, theme = _a.theme;
// TODO: get rid of legacy theme
var themeClass = "".concat(THEME_CLASS_PREFIX, "-").concat(theme || DEFAULTS.THEME);
var themeClassStable = "".concat(THEME_CLASS_PREFIX_STABLE, "-").concat(theme || DEFAULTS.THEME);
return (React.createElement(MdcThemeProvider, { themeclass: themeClassStable, className: classNames(themeClass, STYLE.typography, STYLE.elevation) },
React.createElement(MdcIconProvider, null,
React.createElement("div", { className: "".concat(STYLE.wrapper, " ").concat(STYLE.globals), style: style, id: id }, children))));
};
export default ThemeProvider;
//# sourceMappingURL=ThemeProvider.js.map