@dnb/eufemia/cjs/shared/Theme.js

DNB Eufemia Design System UI Library

"use strict";
"use client";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.ThemeWrapper = ThemeWrapper;
exports.default = Theme;
exports.getThemeClasses = getThemeClasses;
var _react = _interopRequireDefault(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _Context = _interopRequireDefault(require("./Context"));
var _Provider = _interopRequireDefault(require("./Provider"));
var _componentHelper = require("./component-helper");
const _excluded = ["children", "element", "name", "variant", "size", "propMapping", "contrastMode", "darkMode", "darkBackground"],
  _excluded2 = ["element"],
  _excluded3 = ["children", "theme", "element", "className"];
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
function Theme(themeProps) {
  const context = _react.default.useContext(_Context.default);
  const {
      children,
      element,
      name,
      variant,
      size,
      propMapping,
      contrastMode,
      darkMode,
      darkBackground
    } = themeProps,
    restProps = _objectWithoutProperties(themeProps, _excluded);
  const theme = (0, _componentHelper.extendPropsWithContext)({
    name,
    variant,
    size,
    propMapping,
    contrastMode,
    darkMode,
    darkBackground
  }, null, context === null || context === void 0 ? void 0 : context.theme);
  return _react.default.createElement(_Provider.default, {
    theme: theme
  }, _react.default.createElement(ThemeWrapper, _extends({
    element: element,
    theme: theme
  }, restProps), children));
}
Theme.Provider = _ref => {
  let {
      element
    } = _ref,
    themeProps = _objectWithoutProperties(_ref, _excluded2);
  return _react.default.createElement(Theme, _extends({}, themeProps, {
    element: false
  }));
};
Theme.Provider['_supportsSpacingProps'] = 'children';
function ThemeWrapper(_ref2) {
  let {
      children,
      theme,
      element = null,
      className = null
    } = _ref2,
    rest = _objectWithoutProperties(_ref2, _excluded3);
  const Wrapper = element === false ? _react.default.Fragment : element || 'div';
  const ref = _react.default.useRef(null);
  if (Wrapper === _react.default.Fragment) {
    return children;
  }
  rest['ref'] = ref;
  const classNames = getThemeClasses(theme, className);
  const {
    name,
    variant,
    size
  } = theme;
  return _react.default.createElement(Wrapper, _extends({
    "data-name": name,
    "data-variant": variant,
    "data-size": size,
    className: classNames
  }, rest), children);
}
function getThemeClasses(theme) {
  let className = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
  if (!theme) {
    return className;
  }
  const {
    name,
    variant,
    size,
    propMapping,
    contrastMode,
    darkMode
  } = theme;
  return (0, _classnames.default)(className, 'eufemia-theme', name && `eufemia-theme__${name}` + (variant ? ` eufemia-theme__${name}--${variant}` : ""), propMapping && `eufemia-theme__prop-mapping--${propMapping}`, contrastMode && 'eufemia-theme__contrast-mode', darkMode && 'eufemia-theme__dark-mode', size && `eufemia-theme__size--${size}`);
}
//# sourceMappingURL=Theme.js.map