@6thquake/react-material/Table/AwesomeTable/ThCell.js

React components that implement Google's Material Design.

"use strict";

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

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

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

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

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

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

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

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

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

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

var _reactDom = _interopRequireDefault(require("react-dom"));

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

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

var _styles = require("../../styles");

var styles = function styles(theme) {
  return {
    root: {},
    actionTopRight: {
      position: 'absolute',
      top: 0,
      right: 0,
      borderTop: "10px solid ".concat(theme.palette.grey[500]),
      borderLeft: '10px solid transparent',
      width: 0,
      height: 0,
      cursor: 'pointer'
    },
    actionTopLeft: {
      position: 'absolute',
      top: 0,
      left: 0,
      borderTop: "10px solid ".concat(theme.palette.grey[500]),
      borderRight: '10px solid transparent',
      width: 0,
      height: 0,
      cursor: 'pointer'
    },
    active: {
      borderTop: "10px solid ".concat(theme.palette.primary.main)
    }
  };
};
/**
 * @ignore - internal component.
 */


var ThCell =
/*#__PURE__*/
function (_React$Component) {
  (0, _inherits2.default)(ThCell, _React$Component);

  function ThCell() {
    var _getPrototypeOf2;

    var _this;

    (0, _classCallCheck2.default)(this, ThCell);

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

    _this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(ThCell)).call.apply(_getPrototypeOf2, [this].concat(args)));
    _this.state = {};

    _this.handleClick = function (value) {
      return function (e) {
        e.stopPropagation();
        var fixed = _this.props.fixed;
        var maps = {
          topLeft: 'left',
          topRight: 'right'
        };
        var _this$props = _this.props,
            index = _this$props.index,
            onColumnFixChange = _this$props.onColumnFixChange;
        fixed = fixed ? undefined : maps[value];

        _this.setState((0, _defineProperty2.default)({}, value, !_this.state[value]), function () {
          onColumnFixChange && onColumnFixChange(index, fixed);
        });
      };
    };

    return _this;
  }

  (0, _createClass2.default)(ThCell, [{
    key: "render",
    value: function render() {
      var _this$props2 = this.props,
          show = _this$props2.show,
          children = _this$props2.children,
          classes = _this$props2.classes,
          other = (0, _objectWithoutProperties2.default)(_this$props2, ["show", "children", "classes"]);
      var _this$state = this.state,
          topRight = _this$state.topRight,
          topLeft = _this$state.topLeft;
      var leftClassName = (0, _classnames.default)(classes.actionTopLeft, (0, _defineProperty2.default)({}, classes.active, true));
      var rightClassName = (0, _classnames.default)(classes.actionTopRight, (0, _defineProperty2.default)({}, classes.active, true));
      return show ? _react.default.createElement(_react.default.Fragment, null, _react.default.createElement("div", {
        onClick: this.handleClick('topLeft'),
        className: leftClassName
      }), _react.default.createElement("div", {
        onClick: this.handleClick('topRight'),
        className: rightClassName
      })) : null;
    }
  }]);
  return ThCell;
}(_react.default.Component);

var _default = (0, _styles.withStyles)(styles)(ThCell);

exports.default = _default;