import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
import _inherits from "@babel/runtime/helpers/inherits";
import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import React from 'react';
import PropTypes from 'prop-types';
import { style } from 'typestyle';
import Button from '@material-ui/core/Button';
import Menu from '@material-ui/core/Menu';
import ArrowDropDown from '@material-ui/icons/ArrowDropDown';
import MenuItem from '@material-ui/core/MenuItem';
import Description from '@material-ui/icons/Description';
import Typography from '@material-ui/core/Typography';
import ArrowRight from '@material-ui/icons/ArrowRight';
import { Tab } from './';
var cn = {
  blank: style({
    flex: '1 1 auto'
  }),
  menuSize: {
    paper: style({
      width: 200
    })
  },
  menuItem: style({
    paddingTop: 4,
    paddingBottom: 4
  }),
  icon: style({
    width: 24,
    height: 24,
    marginRight: 4
  })
};

var Icon = function Icon(props) {
  return props.iconUrl ? React.createElement("img", {
    src: props.iconUrl,
    alt: "",
    className: cn.icon
  }) : React.createElement(Description, null);
};

Icon.propTypes = {
  iconUrl: PropTypes.string
};

var SelectTab =
/*#__PURE__*/
function (_React$Component) {
  _inherits(SelectTab, _React$Component);

  function SelectTab() {
    var _getPrototypeOf2;

    var _this;

    _classCallCheck(this, SelectTab);

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

    _this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(SelectTab)).call.apply(_getPrototypeOf2, [this].concat(args)));

    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "state", {
      anchorEl: null
    });

    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleClick", function (event) {
      _this.setState({
        anchorEl: event.currentTarget
      });
    });

    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleClose", function () {
      _this.setState({
        anchorEl: null
      });
    });

    return _this;
  }

  _createClass(SelectTab, [{
    key: "componentDidUpdate",
    value: function componentDidUpdate(prevProps) {
      if (prevProps.filePath !== this.props.filePath) {
        // ファイルが選択されたので Popout は閉じる
        this.handleClose();
      }
    }
  }, {
    key: "render",
    value: function render() {
      var anchorEl = this.state.anchorEl; // 現在選択中のタブの情報を filePath (ファイル名) から調べる. tabs の中にはない(nullになる)こともある

      var selected = Tab.find(this.props.tabs, this.props.filePath);
      return React.createElement(React.Fragment, null, React.createElement(Button, {
        variant: "text",
        onClick: this.handleClick,
        className: this.props.className
      }, selected ? React.createElement(Icon, {
        iconUrl: selected.iconUrl
      }) : null, React.createElement(ArrowDropDown, null)), React.createElement(Menu, {
        id: "file-select-menu",
        anchorEl: anchorEl,
        open: Boolean(anchorEl),
        classes: cn.menuSize,
        onClose: this.handleClose
      }, React.createElement(NestedMenus, {
        tabs: this.props.tabs,
        localization: this.props.localization,
        filePath: this.props.filePath,
        globalEvent: this.props.globalEvent
      })));
    }
  }]);

  return SelectTab;
}(React.Component);

_defineProperty(SelectTab, "propTypes", {
  className: PropTypes.string.isRequired,
  localization: PropTypes.object.isRequired,
  tabs: PropTypes.array.isRequired,
  filePath: PropTypes.string.isRequired,
  globalEvent: PropTypes.object.isRequired
});

export { SelectTab as default };

var NestedMenus =
/*#__PURE__*/
function (_React$Component2) {
  _inherits(NestedMenus, _React$Component2);

  function NestedMenus() {
    var _getPrototypeOf3;

    var _this2;

    _classCallCheck(this, NestedMenus);

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

    _this2 = _possibleConstructorReturn(this, (_getPrototypeOf3 = _getPrototypeOf(NestedMenus)).call.apply(_getPrototypeOf3, [this].concat(args)));

    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this2)), "state", {
      anchorEl: null,
      selectedIndex: -1
    });

    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this2)), "handleMenuItemClick", function (filePath) {
      _this2.props.globalEvent.emit('message.editor', {
        data: {
          value: filePath
        }
      });

      _this2.handleClose();
    });

    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this2)), "handleOpen", function (event, index) {
      _this2.setState({
        anchorEl: event.currentTarget,
        selectedIndex: index
      });
    });

    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this2)), "handleClose", function () {
      _this2.setState({
        anchorEl: null,
        selectedIndex: -1
      });
    });

    return _this2;
  }

  _createClass(NestedMenus, [{
    key: "render",
    value: function render() {
      var _this3 = this;

      var anchorEl = this.state.anchorEl;
      return React.createElement(React.Fragment, null, this.props.tabs.map(function (tab, index) {
        return tab.filePath ? React.createElement(MenuItem, {
          key: index,
          selected: tab.filePath === _this3.props.filePath,
          className: cn.menuItem,
          onClick: function onClick() {
            return _this3.handleMenuItemClick(tab.filePath);
          }
        }, React.createElement(Icon, {
          iconUrl: tab.iconUrl
        }), React.createElement(Typography, {
          variant: "body2"
        }, tab.label)) : tab.tabs ? React.createElement(React.Fragment, {
          key: index
        }, React.createElement(MenuItem, {
          selected: index === _this3.state.selectedIndex,
          className: cn.menuItem,
          onClick: function onClick(event) {
            return _this3.handleOpen(event, index);
          }
        }, React.createElement(Icon, {
          iconUrl: tab.iconUrl
        }), React.createElement(Typography, {
          variant: "body2"
        }, tab.label), React.createElement("div", {
          className: cn.blank
        }), React.createElement(ArrowRight, null)), React.createElement(Menu, {
          id: "file-select-menu-".concat(tab.label),
          classes: cn.menuSize,
          open: index === _this3.state.selectedIndex,
          anchorEl: anchorEl,
          onClose: _this3.handleClose,
          anchorOrigin: {
            horizontal: 'right',
            vertical: 'top'
          }
        }, React.createElement(NestedMenus, {
          tabs: tab.tabs,
          localization: _this3.props.localization,
          filePath: _this3.props.filePath,
          globalEvent: _this3.props.globalEvent
        }))) : null;
      }));
    }
  }]);

  return NestedMenus;
}(React.Component);

_defineProperty(NestedMenus, "propTypes", {
  tabs: PropTypes.array.isRequired,
  localization: PropTypes.object.isRequired,
  filePath: PropTypes.string.isRequired,
  globalEvent: PropTypes.object.isRequired
});