"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _react = _interopRequireDefault(require("react"));

var _classnames = _interopRequireDefault(require("classnames"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _core = require("@material-ui/core");

var _tabs = _interopRequireDefault(require("../tabs"));

function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }

function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }

var RawLayoutContents = /*#__PURE__*/function (_React$Component) {
  (0, _inherits2["default"])(RawLayoutContents, _React$Component);

  var _super = _createSuper(RawLayoutContents);

  function RawLayoutContents() {
    var _this;

    (0, _classCallCheck2["default"])(this, RawLayoutContents);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = _super.call.apply(_super, [this].concat(args));
    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "getConfiguration", function () {
      var _secondary$props, _secondary$props2, _secondary$props2$chi, _secondary$props2$chi2;

      var secondary = _this.props.secondary; // in config-layout, secondary can be: <SettingsBox>{settings}</SettingsBox>, settings, null

      return (secondary === null || secondary === void 0 ? void 0 : (_secondary$props = secondary.props) === null || _secondary$props === void 0 ? void 0 : _secondary$props.configuration) || (secondary === null || secondary === void 0 ? void 0 : (_secondary$props2 = secondary.props) === null || _secondary$props2 === void 0 ? void 0 : (_secondary$props2$chi = _secondary$props2.children) === null || _secondary$props2$chi === void 0 ? void 0 : (_secondary$props2$chi2 = _secondary$props2$chi.props) === null || _secondary$props2$chi2 === void 0 ? void 0 : _secondary$props2$chi2.configuration) || undefined;
    });
    return _this;
  }

  (0, _createClass2["default"])(RawLayoutContents, [{
    key: "render",
    value: // // eslint-disable-next-line no-unused-vars
    // componentDidUpdate(prevProps, prevState, snapshot) {
    //   const configuration = this.getConfiguration();
    //   const { mode } = this.props;
    //
    //   // promptHolder class is used to wrap up inputs:
    //   // we don't want inputs to fill the entire scrollable container,
    //   // but instead we want inputs to fit in the first view,
    //   // so we calculate the maximum space inputs need
    //   try {
    //     if (
    //       configuration?.maxWidth &&
    //       getComputedStyle(document.documentElement).getPropertyValue('--pie-prompt-holder-max-width') !==
    //         configuration?.maxWidth
    //     ) {
    //       document.documentElement.style.setProperty(
    //         '--pie-prompt-holder-max-width',
    //         mode === 'inline' ? `calc(${configuration.maxWidth} - 340px)` : configuration.maxWidth,
    //       );
    //     }
    //   } catch (e) {
    //     console.log(e.toString());
    //   }
    // }
    function render() {
      var _this$props = this.props,
          mode = _this$props.mode,
          secondary = _this$props.secondary,
          children = _this$props.children,
          classes = _this$props.classes,
          dimensions = _this$props.dimensions;

      var _ref = dimensions || {},
          minHeight = _ref.minHeight,
          minWidth = _ref.minWidth,
          maxHeight = _ref.maxHeight,
          maxWidth = _ref.maxWidth;

      var configuration = this.getConfiguration();
      var hasSettingsPanel = Object.entries(configuration || {}).some(function (_ref2) {
        var _ref3 = (0, _slicedToArray2["default"])(_ref2, 2),
            obj = _ref3[1];

        return !!(obj !== null && obj !== void 0 && obj.settings);
      }); // ebsr has configuration.partA and configuration.partB
      // because we might have nested configuration for other item types as well, let's add this simple regex to check values for settings

      if (!hasSettingsPanel) {
        try {
          var _JSON$stringify, _JSON$stringify$match;

          hasSettingsPanel = (_JSON$stringify = JSON.stringify(configuration)) === null || _JSON$stringify === void 0 ? void 0 : (_JSON$stringify$match = _JSON$stringify.match(/settings":true/)) === null || _JSON$stringify$match === void 0 ? void 0 : _JSON$stringify$match.length;
        } catch (e) {
          // eslint-disable-next-line no-console
          console.log(e.toString());
        }
      }

      return /*#__PURE__*/_react["default"].createElement("div", {
        className: classes.container,
        style: {
          minHeight: minHeight,
          minWidth: minWidth,
          maxHeight: maxHeight,
          maxWidth: maxWidth
        }
      }, mode === 'inline' && /*#__PURE__*/_react["default"].createElement("div", {
        className: (0, _classnames["default"])(classes.flow, classes.contentContainer)
      }, /*#__PURE__*/_react["default"].createElement("div", {
        className: (0, _classnames["default"])(classes.configContainer, 'design-container')
      }, children), hasSettingsPanel && /*#__PURE__*/_react["default"].createElement("div", {
        className: (0, _classnames["default"])(classes.settingsContainer, 'settings-container')
      }, secondary)), mode === 'tabbed' && hasSettingsPanel && /*#__PURE__*/_react["default"].createElement(_tabs["default"], {
        onChange: this.onTabsChange,
        contentClassName: classes.contentContainer,
        indicatorColor: "primary"
      }, /*#__PURE__*/_react["default"].createElement("div", {
        title: "Design",
        className: "design-container"
      }, children), /*#__PURE__*/_react["default"].createElement("div", {
        title: "Settings",
        className: "settings-container"
      }, secondary)), mode === 'tabbed' && !hasSettingsPanel && /*#__PURE__*/_react["default"].createElement("div", {
        className: (0, _classnames["default"])(classes.contentContainer, 'design-container')
      }, children));
    }
  }]);
  return RawLayoutContents;
}(_react["default"].Component);

(0, _defineProperty2["default"])(RawLayoutContents, "propTypes", {
  mode: _propTypes["default"].oneOf(['tabbed', 'inline']),
  secondary: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]),
  children: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]),
  classes: _propTypes["default"].object,
  dimensions: _propTypes["default"].object
});

var styles = function styles(theme) {
  return {
    flow: {
      display: 'flex',
      justifyContent: 'space-between'
    },
    container: {
      display: 'flex',
      flexDirection: 'column',
      position: 'relative'
    },
    contentContainer: {
      padding: "".concat(theme.spacing.unit * 2, "px 0")
    },
    configContainer: {
      flex: '1'
    },
    settingsContainer: {
      marginLeft: theme.spacing.unit * 2
    }
  };
};

var _default = (0, _core.withStyles)(styles)(RawLayoutContents);

exports["default"] = _default;
//# sourceMappingURL=layout-contents.js.map