@pie-lib/rubric 2.1.0-beta.9 → 3.0.0-next.36

package/lib/point-menu.js

@@ -1,125 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.IconMenu = void 0;
-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 _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _Menu = _interopRequireDefault(require("@mui/material/Menu"));
-var _MenuItem = _interopRequireDefault(require("@mui/material/MenuItem"));
-var _MoreVert = _interopRequireDefault(require("@mui/icons-material/MoreVert"));
-var _MoreHoriz = _interopRequireDefault(require("@mui/icons-material/MoreHoriz"));
-var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _react = _interopRequireDefault(require("react"));
-function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
-var IconMenu = exports.IconMenu = /*#__PURE__*/function (_React$Component) {
-  function IconMenu(props) {
-    var _this;
-    (0, _classCallCheck2["default"])(this, IconMenu);
-    _this = _callSuper(this, IconMenu, [props]);
-    (0, _defineProperty2["default"])(_this, "handleClick", function (event) {
-      return _this.setState({
-        open: true,
-        anchorEl: event.currentTarget
-      });
-    });
-    (0, _defineProperty2["default"])(_this, "handleRequestClose", function () {
-      return _this.setState({
-        open: false
-      });
-    });
-    _this.state = {
-      anchorEl: undefined,
-      open: false
-    };
-    return _this;
-  }
-  (0, _inherits2["default"])(IconMenu, _React$Component);
-  return (0, _createClass2["default"])(IconMenu, [{
-    key: "render",
-    value: function render() {
-      var _this2 = this;
-      var _this$props = this.props,
-        opts = _this$props.opts,
-        onClick = _this$props.onClick;
-      var _this$state = this.state,
-        open = _this$state.open,
-        anchorEl = _this$state.anchorEl;
-      var keys = Object.keys(opts) || [];
-      var handleMenuClick = function handleMenuClick(key) {
-        return function () {
-          onClick(key);
-          _this2.handleRequestClose();
-        };
-      };
-      var iconColor = open ? 'inherit' : 'disabled';
-      return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("div", {
-        onClick: this.handleClick
-      }, /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
-        size: "large"
-      }, open ? /*#__PURE__*/_react["default"].createElement(_MoreVert["default"], {
-        color: iconColor
-      }) : /*#__PURE__*/_react["default"].createElement(_MoreHoriz["default"], {
-        color: iconColor
-      }))), /*#__PURE__*/_react["default"].createElement(_Menu["default"], {
-        id: "point-menu",
-        anchorEl: anchorEl,
-        open: open,
-        onClose: this.handleRequestClose,
-        style: {
-          transform: 'translate(-15px, -15px)'
-        },
-        transformOrigin: {
-          vertical: 'center',
-          horizontal: 'right'
-        }
-      }, keys.map(function (k, index) {
-        return /*#__PURE__*/_react["default"].createElement(_MenuItem["default"], {
-          key: index,
-          onClick: handleMenuClick(k)
-        }, opts[k]);
-      })));
-    }
-  }]);
-}(_react["default"].Component);
-(0, _defineProperty2["default"])(IconMenu, "propTypes", {
-  opts: _propTypes["default"].object,
-  onClick: _propTypes["default"].func.isRequired
-});
-var PointMenu = exports["default"] = /*#__PURE__*/function (_React$Component2) {
-  function PointMenu() {
-    (0, _classCallCheck2["default"])(this, PointMenu);
-    return _callSuper(this, PointMenu, arguments);
-  }
-  (0, _inherits2["default"])(PointMenu, _React$Component2);
-  return (0, _createClass2["default"])(PointMenu, [{
-    key: "render",
-    value: function render() {
-      var _this$props2 = this.props,
-        onChange = _this$props2.onChange,
-        showSampleAnswer = _this$props2.showSampleAnswer;
-      var sampleText = showSampleAnswer ? 'Provide Sample Response' : 'Remove Sample Response';
-      return /*#__PURE__*/_react["default"].createElement(IconMenu, {
-        onClick: function onClick(key) {
-          return onChange(key);
-        },
-        opts: {
-          sample: sampleText
-        }
-      });
-    }
-  }]);
-}(_react["default"].Component);
-(0, _defineProperty2["default"])(PointMenu, "propTypes", {
-  onChange: _propTypes["default"].func.isRequired,
-  showSampleAnswer: _propTypes["default"].bool.isRequired
-});
-//# sourceMappingURL=point-menu.js.map

package/lib/point-menu.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"point-menu.js","names":["_Menu","_interopRequireDefault","require","_MenuItem","_MoreVert","_MoreHoriz","_IconButton","_propTypes","_react","_callSuper","t","o","e","_getPrototypeOf2","_possibleConstructorReturn2","_isNativeReflectConstruct","Reflect","construct","constructor","apply","Boolean","prototype","valueOf","call","IconMenu","exports","_React$Component","props","_this","_classCallCheck2","_defineProperty2","event","setState","open","anchorEl","currentTarget","state","undefined","_inherits2","_createClass2","key","value","render","_this2","_this$props","opts","onClick","_this$state","keys","Object","handleMenuClick","handleRequestClose","iconColor","createElement","handleClick","size","color","id","onClose","style","transform","transformOrigin","vertical","horizontal","map","k","index","React","Component","PropTypes","object","func","isRequired","PointMenu","_React$Component2","arguments","_this$props2","onChange","showSampleAnswer","sampleText","sample","bool"],"sources":["../src/point-menu.jsx"],"sourcesContent":["import Menu from '@mui/material/Menu';\nimport MenuItem from '@mui/material/MenuItem';\nimport MoreVertIcon from '@mui/icons-material/MoreVert';\nimport MoreHorizIcon from '@mui/icons-material/MoreHoriz';\nimport IconButton from '@mui/material/IconButton';\nimport PropTypes from 'prop-types';\nimport React from 'react';\n\nexport class IconMenu extends React.Component {\n  static propTypes = {\n    opts: PropTypes.object,\n    onClick: PropTypes.func.isRequired,\n  };\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      anchorEl: undefined,\n      open: false,\n    };\n  }\n\n  handleClick = (event) => this.setState({ open: true, anchorEl: event.currentTarget });\n\n  handleRequestClose = () => this.setState({ open: false });\n\n  render() {\n    const { opts, onClick } = this.props;\n    const { open, anchorEl } = this.state;\n    const keys = Object.keys(opts) || [];\n\n    const handleMenuClick = (key) => () => {\n      onClick(key);\n      this.handleRequestClose();\n    };\n\n    const iconColor = open ? 'inherit' : 'disabled';\n\n    return (\n      <div>\n        <div onClick={this.handleClick}>\n          <IconButton size=\"large\">\n            {open ? <MoreVertIcon color={iconColor} /> : <MoreHorizIcon color={iconColor} />}\n          </IconButton>\n        </div>\n        <Menu\n          id=\"point-menu\"\n          anchorEl={anchorEl}\n          open={open}\n          onClose={this.handleRequestClose}\n          style={{ transform: 'translate(-15px, -15px)' }}\n          transformOrigin={{\n            vertical: 'center',\n            horizontal: 'right',\n          }}\n        >\n          {keys.map((k, index) => (\n            <MenuItem key={index} onClick={handleMenuClick(k)}>\n              {opts[k]}\n            </MenuItem>\n          ))}\n        </Menu>\n      </div>\n    );\n  }\n}\n\nexport default class PointMenu extends React.Component {\n  static propTypes = {\n    onChange: PropTypes.func.isRequired,\n    showSampleAnswer: PropTypes.bool.isRequired,\n  };\n\n  render() {\n    const { onChange, showSampleAnswer } = this.props;\n    const sampleText = showSampleAnswer ? 'Provide Sample Response' : 'Remove Sample Response';\n\n    return (\n      <IconMenu\n        onClick={(key) => onChange(key)}\n        opts={{\n          sample: sampleText,\n        }}\n      />\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/src/authoring.jsx

@@ -1,413 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { styled } from '@mui/material/styles';
-
-import InputLabel from '@mui/material/InputLabel';
-import OutlinedInput from '@mui/material/OutlinedInput';
-import Select from '@mui/material/Select';
-import FormControl from '@mui/material/FormControl';
-import MenuItem from '@mui/material/MenuItem';
-import { range, takeRight, times } from 'lodash-es';
-import Checkbox from '@mui/material/Checkbox';
-import FormGroup from '@mui/material/FormGroup';
-import FormControlLabel from '@mui/material/FormControlLabel';
-import Typography from '@mui/material/Typography';
-import DragIndicator from '@mui/icons-material/DragIndicator';
-import { DragDropContext, Draggable, Droppable } from '@hello-pangea/dnd';
-import debug from 'debug';
-import PointMenu from './point-menu';
-import EditableHtml from '@pie-lib/editable-html-tip-tap';
-import { InputContainer } from '@pie-lib/config-ui';
-import { grey } from '@mui/material/colors';
-
-const log = debug('pie-lib:rubric:authoring');
-
-const reorder = (list, startIndex, endIndex) => {
-  const result = Array.from(list);
-  const [removed] = result.splice(startIndex, 1);
-
-  result.splice(endIndex, 0, removed);
-
-  return result;
-};
-
-export const RubricType = PropTypes.shape({
-  excludeZero: PropTypes.bool,
-  points: PropTypes.arrayOf(PropTypes.string),
-  sampleAnswers: PropTypes.arrayOf(PropTypes.string),
-  maxPoints: PropTypes.number,
-  rubriclessInstruction: PropTypes.string,
-});
-
-const MaxPoints = (props) => {
-  const { value, onChange, max } = props;
-  const labelId = 'max-points-label';
-
-  return (
-    <FormControl sx={{ minWidth: 120, m: 1 }} variant="outlined">
-      <InputLabel id={labelId}>Max Points</InputLabel>
-      <Select
-        labelId={labelId}
-        label="Max Points"
-        value={value}
-        onChange={(e) => onChange(e.target.value)}
-        input={<OutlinedInput label="Max Points" />}
-        MenuProps={{ transitionDuration: { enter: 225, exit: 195 } }}
-      >
-        {range(1, max + 1).map((v) => (
-          <MenuItem key={`${v}`} value={v}>
-            {v}
-          </MenuItem>
-        ))}
-      </Select>
-    </FormControl>
-  );
-};
-
-// if the value is null or 'null', the Sample Answer input field for that point will not be dispalyed
-// if the value is '', the Sample Answer input field will be empty
-const checkSampleAnswer = (sampleAnswer) => sampleAnswer === null || sampleAnswer === 'null';
-
-const Row = styled('div')(() => ({ display: 'flex', width: '100%', position: 'relative' }));
-
-const EditorDiv = styled('div')(({ theme }) => ({ width: '100%', backgroundColor: `${theme.palette.common.white}` }));
-
-const DragIndicatorStyled = styled(DragIndicator)(({ theme }) => ({ paddingTop: theme.spacing(1), color: grey[500] }));
-
-const PointsLabel = styled(Typography)(({ theme }) => ({
-  color: grey[500],
-  paddingBottom: theme.spacing(1),
-  textTransform: 'uppercase',
-}));
-
-const SampleAnswersEditor = styled('div')(({ theme }) => ({ paddingLeft: theme.spacing(3) }));
-
-const ErrorText = styled('div')(({ theme }) => ({
-  fontSize: theme.typography.fontSize - 2,
-  color: theme.palette.error.main,
-  paddingLeft: theme.spacing(3),
-  paddingTop: theme.spacing(1),
-}));
-
-const PointMenuWrapper = styled('div')(() => ({ position: 'absolute', right: 0 }));
-
-export const PointConfig = (props) => {
-  const { points, content, sampleAnswer, mathMlOptions = {}, error, pluginOpts = {} } = props;
-  const pointsLabel = `${points} ${points <= 1 ? 'pt' : 'pts'}`;
-  const showSampleAnswer = checkSampleAnswer(sampleAnswer);
-
-  return (
-    <div>
-      <PointsLabel variant="overline">{pointsLabel}</PointsLabel>
-      <Row>
-        <DragIndicatorStyled />
-        <EditorDiv>
-          <EditableHtml
-            error={error}
-            pluginProps={pluginOpts}
-            markup={content}
-            onChange={props.onChange}
-            mathMlOptions={mathMlOptions}
-          />
-        </EditorDiv>
-        <PointMenuWrapper>
-          <PointMenu showSampleAnswer={showSampleAnswer} onChange={props.onMenuChange} />
-        </PointMenuWrapper>
-      </Row>
-      {error && <ErrorText>{error}</ErrorText>}
-      {!showSampleAnswer && (
-        <SampleAnswersEditor>
-          <DragIndicatorStyled as={Typography} variant="overline">
-            Sample Response
-          </DragIndicatorStyled>
-          <EditorDiv>
-            <EditableHtml
-              markup={sampleAnswer}
-              pluginProps={pluginOpts}
-              onChange={props.onSampleChange}
-              mathMlOptions={mathMlOptions}
-            />
-          </EditorDiv>
-        </SampleAnswersEditor>
-      )}
-    </div>
-  );
-};
-
-const Container = styled('div')(({ theme }) => ({
-  backgroundColor: grey[200],
-  borderWidth: 1,
-  borderStyle: 'solid',
-  borderColor: grey[300],
-  padding: theme.spacing(2),
-  margin: theme.spacing(1),
-}));
-
-const StyledInputContainer = styled(InputContainer)(({ theme }) => ({
-  width: '100%',
-  paddingTop: theme.spacing(2.5),
-  marginBottom: theme.spacing(2),
-  marginTop: theme.spacing(1),
-  '& .MuiFormControl-root': { width: '100%' },
-  '& > .MuiFormLabel-root.MuiInputLabel-shrink': {
-    fontSize: theme.typography.fontSize + 2,
-    transform: 'translate(0, 1.5px) scale(0.75)',
-  },
-}));
-
-const Rubricless = styled('div')(() => ({ display: 'none' }));
-const ConfigHolder = styled('div')(({ theme }) => ({ paddingTop: theme.spacing(1), paddingBottom: theme.spacing(1) }));
-const RubricTitle = styled(Typography)(({ theme }) => ({ paddingLeft: theme.spacing(1), margin: theme.spacing(1) }));
-
-export class RawAuthoring extends React.Component {
-  static propTypes = {
-    value: RubricType,
-    config: PropTypes.object,
-    pluginOpts: PropTypes.object,
-    rubricless: PropTypes.bool,
-    onChange: PropTypes.func,
-  };
-
-  static defaultProps = {};
-
-  dragEnd = (result) => {
-    if (!result.destination) {
-      return;
-    }
-
-    const { value, onChange } = this.props;
-
-    const points = reorder(value.points, result.source.index, result.destination.index);
-    const sampleAnswers = reorder(value.sampleAnswers, result.source.index, result.destination.index);
-
-    onChange({ ...value, points, sampleAnswers });
-  };
-
-  changeRubriclessInstruction = (input) => {
-    const { value, onChange } = this.props;
-    onChange({ ...value, rubriclessInstruction: input });
-  };
-
-  changeMaxPoints = (maxPoints) => {
-    const { value, onChange, rubricless } = this.props;
-    const currentMax = value.points.length - 1;
-
-    log('current', currentMax, 'new: ', maxPoints);
-
-    let points, sampleAnswers;
-    if (maxPoints > currentMax) {
-      points = times(maxPoints - currentMax)
-        .map(() => '')
-        .concat(value.points);
-      sampleAnswers = times(maxPoints - currentMax)
-        .map(() => null)
-        .concat(value.sampleAnswers);
-    }
-
-    if (maxPoints < currentMax) {
-      log('less than');
-      points = takeRight(value.points, maxPoints + 1);
-      sampleAnswers = takeRight(value.sampleAnswers, maxPoints + 1);
-    }
-
-    if (points && !rubricless) {
-      onChange({ ...value, points, sampleAnswers, maxPoints });
-    } else {
-      onChange({ ...value, maxPoints });
-    }
-  };
-
-  changeContent = (index, content, type) => {
-    // type could be 'points' or 'sampleAnswers'
-    log(`changeModel[${type}]:`, index, content);
-
-    if (type !== 'points' && type !== 'sampleAnswers') {
-      return;
-    }
-
-    const { value, onChange } = this.props;
-    const items = value[type] && Array.from(value[type]);
-
-    items.splice(index, 1, content);
-    log(`changeModel[${type}]:`, items);
-
-    onChange({ ...value, [type]: items });
-  };
-
-  excludeZeros = () => {
-    const { value, onChange } = this.props;
-
-    onChange({ ...value, excludeZero: !value.excludeZero });
-  };
-
-  getPointForIndex = (index, value) => {
-    const maxPoint = value.excludeZero ? value.points.length - 1 + 1 : value.points.length - 1;
-    return maxPoint - index;
-  };
-
-  getMaxPoint = (value) => (value.excludeZero ? value.points.length : value.points.length - 1);
-
-  shouldRenderPoint = (index, value) => {
-    const point = this.getPointForIndex(index, value);
-    return point > 0 || !value.excludeZero;
-  };
-
-  onPointMenuChange = (index, clickedItem) => {
-    if (clickedItem === 'sample') {
-      const { value } = this.props;
-      const sampleAnswers = Array.from(value.sampleAnswers || []);
-
-      if (checkSampleAnswer(sampleAnswers[index])) {
-        // an empty string will display an empty Sample Answer input field
-        this.changeContent(index, '', 'sampleAnswers');
-      } else {
-        // when the content is null or 'null', the Sample Answer input field will not be displayed
-        this.changeContent(index, null, 'sampleAnswers');
-      }
-    }
-  };
-
-  render() {
-    const { value, mathMlOptions = {}, config = {}, rubricless = false, pluginOpts = {} } = this.props;
-    let {
-      excludeZeroEnabled = true,
-      maxPointsEnabled = true,
-      errors = {},
-      rubriclessInstructionEnabled = false,
-      maxPoints = 10,
-    } = value || {};
-    // rubric will contain a max value for maxPoints
-    const { rubriclessInstruction = {}, maxMaxPoints = 10 } = config || {};
-    const { pointsDescriptorsErrors } = errors || {};
-    if (value && Number.isFinite(value.maxPoints)) {
-      // eslint-disable-next-line no-console
-      console.warn('maxPoints is deprecated - remove from model');
-    }
-
-    // for rubric value is computed based on points
-    const maxPointsValue = rubricless ? maxPoints : value.excludeZero ? value.points.length : value.points.length - 1;
-
-    return (
-      <div>
-        <RubricTitle variant="h5">Rubric</RubricTitle>
-        <FormGroup row>
-          {maxPointsEnabled && (
-            <MaxPoints
-              max={maxMaxPoints < 100 ? maxMaxPoints : 100}
-              value={maxPointsValue}
-              onChange={this.changeMaxPoints}
-              pluginOpts={pluginOpts}
-            />
-          )}
-          {excludeZeroEnabled && (
-            <FormControlLabel
-              label="Exclude zeros"
-              control={<Checkbox checked={value.excludeZero} onChange={this.excludeZeros} />}
-            />
-          )}
-        </FormGroup>
-
-        {rubriclessInstructionEnabled && rubricless && (
-          <StyledInputContainer label={rubriclessInstruction.label}>
-            <EditableHtml
-              markup={value.rubriclessInstruction || ''}
-              onChange={this.changeRubriclessInstruction}
-              pluginProps={pluginOpts}
-              nonEmpty={false}
-              disableUnderline
-              languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}
-              mathMlOptions={mathMlOptions}
-              autoWidthToolbar
-            />
-          </StyledInputContainer>
-        )}
-
-        <div>
-          {rubricless ? (
-            <Rubricless />
-          ) : (
-            <Container>
-              <DragDropContext onDragEnd={this.dragEnd}>
-                <Droppable droppableId="droppable">
-                  {(provided) => (
-                    <div {...provided.droppableProps} ref={provided.innerRef}>
-                      {value.points.map(
-                        (p, index) =>
-                          this.shouldRenderPoint(index, value) && (
-                            <Draggable key={`${p.points}-${index}`} index={index} draggableId={index.toString()}>
-                              {(provided) => (
-                                <ConfigHolder
-                                  ref={provided.innerRef}
-                                  {...provided.draggableProps}
-                                  {...provided.dragHandleProps}
-                                >
-                                  <PointConfig
-                                    points={this.getPointForIndex(index, value)}
-                                    content={p}
-                                    error={
-                                      pointsDescriptorsErrors &&
-                                      pointsDescriptorsErrors[value.points.length - 1 - index]
-                                    }
-                                    sampleAnswer={value.sampleAnswers && value.sampleAnswers[index]}
-                                    onChange={(content) => this.changeContent(index, content, 'points')}
-                                    onSampleChange={(content) => this.changeContent(index, content, 'sampleAnswers')}
-                                    onMenuChange={(clickedItem) => this.onPointMenuChange(index, clickedItem)}
-                                    mathMlOptions={mathMlOptions}
-                                    pluginOpts={pluginOpts}
-                                  />
-                                </ConfigHolder>
-                              )}
-                            </Draggable>
-                          ),
-                      )}
-                      {provided.placeholder}
-                    </div>
-                  )}
-                </Droppable>
-              </DragDropContext>
-            </Container>
-          )}
-        </div>
-      </div>
-    );
-  }
-}
-
-// styles migrated to styled-components above
-
-const Reverse = (props) => {
-  const { rubricless = false, config = {}, pluginOpts = {} } = props || {};
-  const points = Array.from(props.value.points || []).reverse();
-  let sampleAnswers = Array.from(props.value.sampleAnswers || []).reverse();
-
-  if (points.length > sampleAnswers.length) {
-    sampleAnswers = times(points.length - sampleAnswers.length)
-      .map(() => null)
-      .concat(sampleAnswers);
-  }
-
-  const value = { ...props.value, points, sampleAnswers };
-
-  const onChange = (value) => {
-    props.onChange({
-      ...value,
-      points: Array.from(value.points || []).reverse(),
-      sampleAnswers: Array.from(value.sampleAnswers || []).reverse(),
-    });
-  };
-
-  return (
-    <RawAuthoring value={value} config={config} onChange={onChange} rubricless={rubricless} pluginOpts={pluginOpts} />
-  );
-};
-
-Reverse.propTypes = {
-  value: RubricType,
-  config: PropTypes.object,
-  pluginOpts: PropTypes.object,
-  rubricless: PropTypes.bool,
-  getIndex: PropTypes.func,
-  onChange: PropTypes.func,
-};
-
-export default Reverse;

package/src/index.js

@@ -1,9 +0,0 @@
-import Authoring from './authoring';
-
-const RUBRIC_TYPES = {
-  SIMPLE_RUBRIC: 'simpleRubric',
-  MULTI_TRAIT_RUBRIC: 'multiTraitRubric',
-  RUBRICLESS: 'rubricless',
-};
-
-export { Authoring, RUBRIC_TYPES };

package/src/point-menu.jsx

@@ -1,87 +0,0 @@
-import Menu from '@mui/material/Menu';
-import MenuItem from '@mui/material/MenuItem';
-import MoreVertIcon from '@mui/icons-material/MoreVert';
-import MoreHorizIcon from '@mui/icons-material/MoreHoriz';
-import IconButton from '@mui/material/IconButton';
-import PropTypes from 'prop-types';
-import React from 'react';
-
-export class IconMenu extends React.Component {
-  static propTypes = {
-    opts: PropTypes.object,
-    onClick: PropTypes.func.isRequired,
-  };
-
-  constructor(props) {
-    super(props);
-    this.state = {
-      anchorEl: undefined,
-      open: false,
-    };
-  }
-
-  handleClick = (event) => this.setState({ open: true, anchorEl: event.currentTarget });
-
-  handleRequestClose = () => this.setState({ open: false });
-
-  render() {
-    const { opts, onClick } = this.props;
-    const { open, anchorEl } = this.state;
-    const keys = Object.keys(opts) || [];
-
-    const handleMenuClick = (key) => () => {
-      onClick(key);
-      this.handleRequestClose();
-    };
-
-    const iconColor = open ? 'inherit' : 'disabled';
-
-    return (
-      <div>
-        <div onClick={this.handleClick}>
-          <IconButton size="large">
-            {open ? <MoreVertIcon color={iconColor} /> : <MoreHorizIcon color={iconColor} />}
-          </IconButton>
-        </div>
-        <Menu
-          id="point-menu"
-          anchorEl={anchorEl}
-          open={open}
-          onClose={this.handleRequestClose}
-          style={{ transform: 'translate(-15px, -15px)' }}
-          transformOrigin={{
-            vertical: 'center',
-            horizontal: 'right',
-          }}
-        >
-          {keys.map((k, index) => (
-            <MenuItem key={index} onClick={handleMenuClick(k)}>
-              {opts[k]}
-            </MenuItem>
-          ))}
-        </Menu>
-      </div>
-    );
-  }
-}
-
-export default class PointMenu extends React.Component {
-  static propTypes = {
-    onChange: PropTypes.func.isRequired,
-    showSampleAnswer: PropTypes.bool.isRequired,
-  };
-
-  render() {
-    const { onChange, showSampleAnswer } = this.props;
-    const sampleText = showSampleAnswer ? 'Provide Sample Response' : 'Remove Sample Response';
-
-    return (
-      <IconMenu
-        onClick={(key) => onChange(key)}
-        opts={{
-          sample: sampleText,
-        }}
-      />
-    );
-  }
-}