"use strict";

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

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = exports.RubricType = 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 _react = _interopRequireDefault(require("react"));

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

var _ListItem = _interopRequireDefault(require("@material-ui/core/ListItem"));

var _List = _interopRequireDefault(require("@material-ui/core/List"));

var _Collapse = _interopRequireDefault(require("@material-ui/core/Collapse"));

var _renderUi = require("@pie-lib/render-ui");

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

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 RubricType = _propTypes["default"].shape({
  excludeZero: _propTypes["default"].bool,
  points: _propTypes["default"].arrayOf(_propTypes["default"].string),
  sampleAnswers: _propTypes["default"].arrayOf(_propTypes["default"].string),
  animationsDisabled: _propTypes["default"].bool
});

exports.RubricType = RubricType;

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

  var _super = _createSuper(Rubric);

  function Rubric(props) {
    var _this;

    (0, _classCallCheck2["default"])(this, Rubric);
    _this = _super.call(this, props);
    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "dudUrl", 'javascript:;');
    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "shouldRenderPoint", function (index, value) {
      if (!value.excludeZero) {
        return true;
      } else {
        return index !== 0;
      }
    });
    _this.state = {
      rubricOpen: false,
      linkPrefix: 'Show'
    };
    _this.toggleRubric = _this.toggleRubric.bind((0, _assertThisInitialized2["default"])(_this));
    return _this;
  }

  (0, _createClass2["default"])(Rubric, [{
    key: "toggleRubric",
    value: function toggleRubric() {
      this.setState({
        rubricOpen: !this.state.rubricOpen
      });
      this.setState({
        linkPrefix: this.state.rubricOpen ? 'Show' : 'Hide'
      });
    }
  }, {
    key: "render",
    value: function render() {
      var _this2 = this;

      var _this$props = this.props,
          model = _this$props.model,
          value = _this$props.value,
          classes = _this$props.classes;
      var animationsDisabled = this.props.animationsDisabled;
      animationsDisabled = animationsDisabled || value.animationsDisabled;

      if (value && value.points) {
        var _ref = model || {},
            extraCSSRules = _ref.extraCSSRules;

        var points = value.points,
            sampleAnswers = value.sampleAnswers;

        var rubricList = /*#__PURE__*/_react["default"].createElement(_List["default"], {
          component: "nav"
        }, points.slice(0).reverse().map(function (desc, index) {
          index = points.length - index - 1;
          var pointsLabel = value.excludeZero ? index + 1 : index;
          return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, {
            key: index
          }, /*#__PURE__*/_react["default"].createElement(_ListItem["default"], {
            key: "P".concat(index),
            className: classes.listColumn
          }, /*#__PURE__*/_react["default"].createElement("h3", {
            className: classes.titleText
          }, pointsLabel === 1 ? "".concat(pointsLabel, " PT") : "".concat(pointsLabel, " PTS")), /*#__PURE__*/_react["default"].createElement("div", {
            className: classes.text,
            dangerouslySetInnerHTML: {
              __html: desc
            }
          })), sampleAnswers && sampleAnswers[index] && /*#__PURE__*/_react["default"].createElement(_ListItem["default"], {
            key: "S".concat(index),
            className: classes.listColumn
          }, /*#__PURE__*/_react["default"].createElement("h4", {
            className: classes.titleText,
            style: {
              fontWeight: 'normal'
            }
          }, "Sample Answer"), /*#__PURE__*/_react["default"].createElement("div", {
            className: classes.text,
            dangerouslySetInnerHTML: {
              __html: sampleAnswers[index]
            }
          })));
        }));

        return /*#__PURE__*/_react["default"].createElement(_renderUi.UiLayout, {
          extraCSSRules: extraCSSRules,
          className: classes.root
        }, /*#__PURE__*/_react["default"].createElement("h2", {
          className: classes.hiddenScreenReader
        }, "Rubric"), !animationsDisabled ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("h2", {
          id: 'rubric-toggle',
          className: classes.rubricToggle,
          tabIndex: 0,
          role: "button",
          "aria-expanded": this.state.rubricOpen,
          onClick: this.toggleRubric,
          onKeyPress: function onKeyPress(e) {
            if (e.key === 'Enter' || e.key === ' ') _this2.toggleRubric();
          }
        }, this.state.linkPrefix, " Rubric", /*#__PURE__*/_react["default"].createElement("span", {
          className: classes.chevronStyle,
          "aria-hidden": "true"
        }, this.state.rubricOpen ? /*#__PURE__*/_react["default"].createElement("svg", {
          width: "20",
          height: "20",
          viewBox: "0 0 24 24",
          fill: "none",
          stroke: "currentColor",
          strokeWidth: "2",
          strokeLinecap: "round",
          strokeLinejoin: "round"
        }, /*#__PURE__*/_react["default"].createElement("polyline", {
          points: "18 15 12 9 6 15"
        })) : /*#__PURE__*/_react["default"].createElement("svg", {
          width: "20",
          height: "20",
          viewBox: "0 0 24 24",
          fill: "none",
          stroke: "currentColor",
          strokeWidth: "2",
          strokeLinecap: "round",
          strokeLinejoin: "round"
        }, /*#__PURE__*/_react["default"].createElement("polyline", {
          points: "6 9 12 15 18 9"
        })))), /*#__PURE__*/_react["default"].createElement(_Collapse["default"], {
          "in": this.state.rubricOpen,
          timeout: "auto"
        }, rubricList)) : rubricList);
      } else {
        return null;
      }
    }
  }]);
  return Rubric;
}(_react["default"].Component);

(0, _defineProperty2["default"])(Rubric, "propTypes", {
  classes: _propTypes["default"].object.isRequired,
  model: _propTypes["default"].object.isRequired,
  animationsDisabled: _propTypes["default"].bool,
  value: RubricType
});

var styles = function styles(theme) {
  return {
    root: {
      color: _renderUi.color.text(),
      backgroundColor: _renderUi.color.background(),
      // apply styles to tables to match the rest of the UI
      '&:not(.MathJax) table': {
        borderCollapse: 'collapse'
      },
      '&:not(.MathJax) table td, &:not(.MathJax) table th': {
        padding: '8px 12px',
        textAlign: 'left'
      },
      // reset paragraph margins and line-height inside lists to override client styles
      '& ul p, & ol p': {
        marginBottom: 0,
        marginTop: 0,
        lineHeight: 'normal'
      }
    },
    listColumn: {
      display: 'flex',
      flexDirection: 'column',
      alignItems: 'flex-start',
      padding: '12px 0px'
    },
    listColumnItem: {
      padding: 0
    },
    text: {
      color: _renderUi.color.text()
    },
    titleText: {
      color: _renderUi.color.text(),
      fontSize: '16px',
      fontWeight: '700',
      margin: 0,
      paddingBottom: '6px'
    },
    rubricToggle: {
      display: 'flex',
      alignItems: 'center',
      cursor: 'pointer',
      userSelect: 'none',
      fontSize: theme.typography.fontSize,
      fontWeight: '500',
      color: _renderUi.color.tertiary(),
      margin: 0
    },
    chevronStyle: {
      display: 'inline-flex',
      transition: 'transform 0.2s',
      marginLeft: 2,
      alignSelf: 'center'
    },
    hiddenScreenReader: {
      position: 'absolute',
      width: '1px',
      height: '1px',
      padding: 0,
      margin: '-1px',
      overflow: 'hidden',
      clip: 'rect(0,0,0,0)',
      border: 0,
      whiteSpace: 'nowrap'
    }
  };
};

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

exports["default"] = _default;
//# sourceMappingURL=main.js.map