"use strict";

exports.__esModule = true;
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _image = _interopRequireDefault(require("../../util/image"));
var _provider = _interopRequireDefault(require("../../atom/provider"));
var _style = _interopRequireDefault(require("./style.css"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function ThemeImage({
  image
}, {
  skin
}) {
  const extract = (0, _image.default)(skin);
  const defaultStyle = extract(image);
  const extractWithDefault = (0, _image.default)(skin, image);
  const mobileStyle = extractWithDefault(`${image}-mobile`);
  const tabletStyle = extractWithDefault(`${image}-tablet`);
  const desktopStyle = extractWithDefault(`${image}-desktop`);
  return /*#__PURE__*/_react.default.createElement("div", {
    className: _style.default.wrapper
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: _style.default.defaultStyle
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: _style.default.background,
    style: defaultStyle
  })), /*#__PURE__*/_react.default.createElement("div", {
    className: _style.default.desktopContainer
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: _style.default.background,
    style: desktopStyle
  })), /*#__PURE__*/_react.default.createElement("div", {
    className: _style.default.tabletContainer
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: _style.default.background,
    style: tabletStyle
  })), /*#__PURE__*/_react.default.createElement("div", {
    className: _style.default.mobileContainer
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: _style.default.background,
    style: mobileStyle
  })));
}
ThemeImage.contextTypes = {
  skin: _provider.default.childContextTypes.skin
};
ThemeImage.propTypes = process.env.NODE_ENV !== "production" ? {
  image: _propTypes.default.string.isRequired
} : {};
var _default = exports.default = ThemeImage;
//# sourceMappingURL=index.js.map