"use strict";

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

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

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 _Input = _interopRequireDefault(require("@material-ui/core/Input"));

var _InputLabel = _interopRequireDefault(require("@material-ui/core/InputLabel"));

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

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

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

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

var _Select = _interopRequireDefault(require("@material-ui/core/Select"));

var _MenuItem = _interopRequireDefault(require("@material-ui/core/MenuItem"));

var _FormControl = _interopRequireDefault(require("@material-ui/core/FormControl"));

var _debug = _interopRequireDefault(require("debug"));

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 log = (0, _debug["default"])('pie-elements:config-ui:langs');

var styles = function styles(theme) {
  return {
    root: {
      flexDirection: 'column',
      alignItems: 'start',
      display: 'flex',
      position: 'relative',
      paddingTop: '0px',
      paddingRight: '0px'
    },
    formControl: {
      position: 'initial'
    },
    inputLabel: {
      paddingBottom: theme.spacing.unit
    }
  };
};

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

  var _super = _createSuper(RawLangs);

  function RawLangs(props) {
    var _this;

    (0, _classCallCheck2["default"])(this, RawLangs);
    _this = _super.call(this, props);
    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "choose", function (event) {
      log('[choose] event: ', event);

      if (_this.props.onChange) {
        _this.props.onChange(event.target.value);
      }
    });
    _this.uid = props.uid || (Math.random() * 10000).toFixed();
    return _this;
  }

  (0, _createClass2["default"])(RawLangs, [{
    key: "render",
    value: function render() {
      var _this$props = this.props,
          langs = _this$props.langs,
          selected = _this$props.selected,
          label = _this$props.label,
          classes = _this$props.classes;
      log('[render] selected:', selected);
      return /*#__PURE__*/_react["default"].createElement("div", {
        className: classes.root
      }, /*#__PURE__*/_react["default"].createElement(_FormControl["default"], {
        className: classes.formControl
      }, /*#__PURE__*/_react["default"].createElement(_InputLabel["default"], {
        className: classes.inputLabel,
        htmlFor: this.uid
      }, label), /*#__PURE__*/_react["default"].createElement(_Select["default"], {
        value: selected,
        onChange: this.choose,
        input: /*#__PURE__*/_react["default"].createElement(_Input["default"], {
          id: this.uid
        })
      }, langs.map(function (l, index) {
        return /*#__PURE__*/_react["default"].createElement(_MenuItem["default"], {
          key: index,
          value: l
        }, l);
      }))));
    }
  }]);
  return RawLangs;
}(_react["default"].Component);

exports.RawLangs = RawLangs;
(0, _defineProperty2["default"])(RawLangs, "propTypes", {
  onChange: _propTypes["default"].func,
  langs: _propTypes["default"].array,
  selected: _propTypes["default"].string,
  label: _propTypes["default"].string,
  classes: _propTypes["default"].object.isRequired,
  uid: _propTypes["default"].string
});
var Langs = (0, _styles.withStyles)(styles, {
  name: 'Langs'
})(RawLangs);
var _default = Langs;
exports["default"] = _default;
var LanguageControls = (0, _styles.withStyles)({
  languageControls: {
    display: 'grid',
    gridAutoFlow: 'column',
    gridAutoColumns: '1fr',
    gridGap: '8px'
  }
})(function (_ref) {
  var classes = _ref.classes,
      langs = _ref.langs,
      activeLang = _ref.activeLang,
      defaultLang = _ref.defaultLang,
      onActiveLangChange = _ref.onActiveLangChange,
      onDefaultLangChange = _ref.onDefaultLangChange,
      className = _ref.className;
  var names = (0, _classnames["default"])(classes.languageControls, className);
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: names
  }, /*#__PURE__*/_react["default"].createElement(Langs, {
    label: "Choose language to edit",
    langs: langs,
    selected: activeLang,
    onChange: function onChange(l) {
      return onActiveLangChange(l);
    }
  }), /*#__PURE__*/_react["default"].createElement(Langs, {
    label: "Default language",
    langs: langs,
    selected: defaultLang,
    onChange: function onChange(l) {
      return onDefaultLangChange(l);
    }
  }));
});
exports.LanguageControls = LanguageControls;
LanguageControls.propTypes = {
  langs: _propTypes["default"].array,
  activeLang: _propTypes["default"].string.isRequired,
  defaultLang: _propTypes["default"].string.isRequired,
  onActiveLangChange: _propTypes["default"].func.isRequired,
  onDefaultLangChange: _propTypes["default"].func.isRequired
};
//# sourceMappingURL=langs.js.map