"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.useStyles = exports["default"] = void 0;
var _react = _interopRequireDefault(require("react"));
var _FullScreenView = _interopRequireWildcard(require("../../../../Screens/Configurator/Components/FullScreenView"));
var _styles = require("@material-ui/core/styles");
var _useMediaQuery = _interopRequireDefault(require("@material-ui/core/useMediaQuery"));
var _combineMediaQueries = require("../../../../../Utils/Styles/combineMediaQueries");
var _excluded = ["thumbnailDots"],
  _excluded2 = ["width"];
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(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 (var _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); }
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
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 _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
var useStyles = exports.useStyles = (0, _styles.makeStyles)(function (theme) {
  var _thumbnailGrid;
  return {
    viewsContainer: {
      width: '100%',
      '@media (max-height: 650px)': {
        bottom: 0
      }
    },
    button: _defineProperty({}, theme.breakpoints.down('sm'), {
      bottom: 'auto'
    }),
    thumbnailGrid: (_thumbnailGrid = {
      width: '100%',
      maxWidth: '100%',
      left: 0
    }, _defineProperty(_thumbnailGrid, theme.breakpoints.up('md'), {
      width: '25%',
      left: '50%'
    }), _defineProperty(_thumbnailGrid, theme.breakpoints.up(theme.creator.viewSelectBreakpoint), {
      height: 136 // same as the checkout box
    }), _defineProperty(_thumbnailGrid, theme.breakpoints.down(theme.creator.viewSelectBreakpoint), {
      maxWidth: '100%',
      marginBottom: 0
    }), _defineProperty(_thumbnailGrid, theme.breakpoints.up('lg'), {
      width: 450
    }), _defineProperty(_thumbnailGrid, (0, _combineMediaQueries.combineMediaQueriesWithAnd)(theme.orientation.portrait, theme.breakpoints.down('md')), {
      maxWidth: '100%',
      width: '100%'
    }), _defineProperty(_thumbnailGrid, (0, _combineMediaQueries.combineMediaQueriesWithAnd)(theme.orientation.portrait, theme.breakpoints.up('md')), {
      bottom: 20
    }), _defineProperty(_thumbnailGrid, theme.orientation.portrait, {
      maxWidth: '100%',
      width: '100%'
    }), _defineProperty(_thumbnailGrid, theme.breakpoints.down('xs'), {
      maxWidth: '100%'
    }), _thumbnailGrid)
  };
}, {
  name: 'CreatorFullScreenView'
});
var _default = exports["default"] = function _default(props) {
  var _useStyles = useStyles(props),
    thumbnailDots = _useStyles.thumbnailDots,
    classes = _objectWithoutProperties(_useStyles, _excluded);
  var theme = (0, _styles.useTheme)();
  var renderButtonOnTop = (0, _useMediaQuery["default"])("(max-width : ".concat(theme.creator.viewSelectBreakpoint, "px)"));
  return /*#__PURE__*/_react["default"].createElement(_FullScreenView["default"], _extends({
    classes: classes,
    renderButtonOnTop: renderButtonOnTop,
    renderTopPreviewButton: function renderTopPreviewButton(_ref) {
      var width = _ref.width,
        props = _objectWithoutProperties(_ref, _excluded2);
      return (width === 'xs' || renderButtonOnTop) && /*#__PURE__*/_react["default"].createElement(_FullScreenView.PreviewButton, props);
    },
    thumbnailProps: {
      classes: {
        dots: thumbnailDots
      }
    }
  }, props));
};