@e-group/material-module/SurveyQuestions/QuestionRating/QuestionRating.js

EGroup Team react component modules.

"use strict";

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

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

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

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

var _Typography = _interopRequireDefault(require("@material-ui/core/Typography"));

var _Grid = _interopRequireDefault(require("@material-ui/core/Grid"));

var _RadioButtonUnchecked = _interopRequireDefault(require("@material-ui/icons/RadioButtonUnchecked"));

const useStyles = (0, _core.makeStyles)(theme => ({
  root: {
    margin: theme.spacing(3, 0)
  },
  label: {
    marginBottom: theme.spacing(3)
  },
  edgeLabel: {
    marginBottom: 4
  }
}));

const QuestionRating = ({
  question
}) => {
  var _question$questionRat, _question$questionRat2;

  const classes = useStyles();
  const start = (_question$questionRat = question === null || question === void 0 ? void 0 : question.questionRatingStartValue) !== null && _question$questionRat !== void 0 ? _question$questionRat : 1;
  const end = (_question$questionRat2 = question === null || question === void 0 ? void 0 : question.questionRatingEndValue) !== null && _question$questionRat2 !== void 0 ? _question$questionRat2 : 5;
  return /*#__PURE__*/_react.default.createElement("div", {
    className: classes.root
  }, /*#__PURE__*/_react.default.createElement(_Grid.default, {
    container: true,
    alignItems: "flex-end",
    justify: "space-around"
  }, /*#__PURE__*/_react.default.createElement(_Grid.default, {
    item: true
  }, /*#__PURE__*/_react.default.createElement(_Typography.default, {
    variant: "body1",
    color: "textSecondary",
    className: classes.edgeLabel
  }, question.questionRatingStartName)), end > start && Array.from(Array(end - start + 1).keys()).map(num => {
    const sNum = num + start;
    return /*#__PURE__*/_react.default.createElement(_Grid.default, {
      key: sNum,
      item: true
    }, /*#__PURE__*/_react.default.createElement(_Typography.default, {
      align: "center",
      variant: "body2",
      className: classes.label
    }, sNum), /*#__PURE__*/_react.default.createElement(_RadioButtonUnchecked.default, {
      color: "disabled"
    }));
  }), /*#__PURE__*/_react.default.createElement(_Grid.default, {
    item: true
  }, /*#__PURE__*/_react.default.createElement(_Typography.default, {
    variant: "body1",
    color: "textSecondary",
    className: classes.edgeLabel
  }, question.questionRatingEndName))));
};

var _default = QuestionRating;
exports.default = _default;