@pie-element/rubric 3.6.1 → 3.6.2

package/configure/node_modules/@pie-lib/pie-toolbox/src/code/math-toolbar/index.jsx

@@ -1,213 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import cx from 'classnames';
-import EditorAndPad from './editor-and-pad';
-import { DoneButton } from './done-button';
-import { withStyles } from '@material-ui/core/styles';
-import MathPreview from './math-preview';
-
-export { MathPreview };
-
-export class MathToolbar extends React.Component {
-  static propTypes = {
-    autoFocus: PropTypes.bool,
-    allowAnswerBlock: PropTypes.bool,
-    controlledKeypad: PropTypes.bool,
-    controlledKeypadMode: PropTypes.bool,
-    keypadMode: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    classNames: PropTypes.object,
-    error: PropTypes.string,
-    maxResponseAreas: PropTypes.number,
-    showKeypad: PropTypes.bool,
-    noDecimal: PropTypes.bool,
-    additionalKeys: PropTypes.array,
-    latex: PropTypes.string.isRequired,
-    onAnswerBlockAdd: PropTypes.func,
-    onChange: PropTypes.func,
-    onDone: PropTypes.func.isRequired,
-    onFocus: PropTypes.func,
-    onBlur: PropTypes.func,
-    hideDoneButton: PropTypes.bool,
-  };
-
-  static defaultProps = {
-    classNames: {},
-    keypadMode: 'item-authoring',
-    autoFocus: false,
-    allowAnswerBlock: false,
-    controlledKeypad: false,
-    controlledKeypadMode: false,
-    noDecimal: false,
-    showKeypad: true,
-    additionalKeys: [],
-    onChange: () => {},
-    onAnswerBlockAdd: () => {},
-    onFocus: () => {},
-    hideDoneButton: false,
-  };
-
-  constructor(props) {
-    super(props);
-    this.state = {
-      latex: props.latex,
-    };
-  }
-
-  done = () => {
-    this.props.onDone(this.state.latex);
-  };
-
-  UNSAFE_componentWillReceiveProps(nextProps) {
-    this.setState({ latex: nextProps.latex });
-  }
-
-  onChange = (latex) => {
-    this.setState({ latex });
-    this.props.onChange(latex);
-  };
-
-  render() {
-    const { latex } = this.state;
-    const {
-      classNames,
-      autoFocus,
-      allowAnswerBlock,
-      onAnswerBlockAdd,
-      controlledKeypad,
-      controlledKeypadMode,
-      keypadMode,
-      noDecimal,
-      additionalKeys,
-      showKeypad,
-      onFocus,
-      onBlur,
-      hideDoneButton,
-      error,
-      maxResponseAreas,
-    } = this.props;
-
-    return (
-      <PureToolbar
-        autoFocus={autoFocus}
-        classNames={classNames}
-        onAnswerBlockAdd={onAnswerBlockAdd}
-        allowAnswerBlock={allowAnswerBlock}
-        latex={latex}
-        additionalKeys={additionalKeys}
-        noDecimal={noDecimal}
-        keypadMode={keypadMode}
-        onChange={this.onChange}
-        onDone={this.done}
-        onFocus={onFocus}
-        onBlur={onBlur}
-        showKeypad={showKeypad}
-        controlledKeypad={controlledKeypad}
-        controlledKeypadMode={controlledKeypadMode}
-        hideDoneButton={hideDoneButton}
-        error={error}
-        maxResponseAreas={maxResponseAreas}
-      />
-    );
-  }
-}
-
-export class RawPureToolbar extends React.Component {
-  static propTypes = {
-    classNames: PropTypes.object,
-    latex: PropTypes.string.isRequired,
-    keypadMode: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    hideInput: PropTypes.bool,
-    noLatexHandling: PropTypes.bool,
-    layoutForKeyPad: PropTypes.object,
-    onChange: PropTypes.func.isRequired,
-    onDone: PropTypes.func.isRequired,
-    onBlur: PropTypes.func,
-    onAnswerBlockAdd: PropTypes.func,
-    additionalKeys: PropTypes.array,
-    onFocus: PropTypes.func,
-    classes: PropTypes.object.isRequired,
-    autoFocus: PropTypes.bool,
-    noDecimal: PropTypes.bool,
-    allowAnswerBlock: PropTypes.bool,
-    controlledKeypad: PropTypes.bool,
-    controlledKeypadMode: PropTypes.bool,
-    showKeypad: PropTypes.bool,
-    hideDoneButton: PropTypes.bool,
-    hideDoneButtonBackground: PropTypes.bool,
-    error: PropTypes.any,
-    maxResponseAreas: PropTypes.number,
-  };
-
-  static defaultProps = {
-    classNames: {},
-    hideDoneButtonBackground: false,
-  };
-
-  render() {
-    const {
-      classNames,
-      autoFocus,
-      allowAnswerBlock,
-      onAnswerBlockAdd,
-      controlledKeypad,
-      controlledKeypadMode,
-      additionalKeys,
-      showKeypad,
-      keypadMode,
-      noDecimal,
-      hideInput,
-      noLatexHandling,
-      layoutForKeyPad,
-      latex,
-      onChange,
-      onDone,
-      onFocus,
-      onBlur,
-      hideDoneButton,
-      hideDoneButtonBackground,
-      classes,
-      error,
-      maxResponseAreas,
-    } = this.props;
-
-    return (
-      <div className={cx(classes.pureToolbar, (classNames || {}).toolbar)}>
-        <div />
-        <EditorAndPad
-          autoFocus={autoFocus}
-          keypadMode={keypadMode}
-          classNames={classNames || {}}
-          controlledKeypad={controlledKeypad}
-          controlledKeypadMode={controlledKeypadMode}
-          noDecimal={noDecimal}
-          hideInput={hideInput}
-          noLatexHandling={noLatexHandling}
-          layoutForKeyPad={layoutForKeyPad}
-          showKeypad={showKeypad}
-          additionalKeys={additionalKeys}
-          allowAnswerBlock={allowAnswerBlock}
-          onAnswerBlockAdd={onAnswerBlockAdd}
-          latex={latex}
-          onChange={onChange}
-          onFocus={onFocus}
-          onBlur={onBlur}
-          error={error}
-          maxResponseAreas={maxResponseAreas}
-        />
-        {(!controlledKeypad || (controlledKeypad && showKeypad)) && !hideDoneButton && (
-          <DoneButton hideBackground={hideDoneButtonBackground} onClick={onDone} />
-        )}
-      </div>
-    );
-  }
-}
-const styles = () => ({
-  pureToolbar: {
-    display: 'flex',
-    width: '100%',
-    zIndex: 8,
-    alignItems: 'center',
-  },
-});
-
-export const PureToolbar = withStyles(styles)(RawPureToolbar);

package/configure/node_modules/@pie-lib/pie-toolbox/src/code/math-toolbar/math-preview.jsx

@@ -1,199 +0,0 @@
-import React from 'react';
-import classNames from 'classnames';
-import debug from 'debug';
-import { withStyles } from '@material-ui/core/styles';
-import PropTypes from 'prop-types';
-import { mq } from '../math-input';
-
-const log = debug('@pie-lib:math-toolbar:math-preview');
-
-export class RawMathPreview extends React.Component {
-  static propTypes = {
-    latex: PropTypes.string,
-    node: PropTypes.object,
-    classes: PropTypes.object,
-    isSelected: PropTypes.bool,
-    onFocus: PropTypes.func,
-    onBlur: PropTypes.func,
-  };
-
-  render() {
-    log('[render] data: ', this.props.node.data);
-    const latex = this.props.node.data.get('latex');
-    const { classes, isSelected, onFocus, onBlur } = this.props;
-    return (
-      <div className={classNames(classes.root, isSelected && classes.selected)}>
-        {' '}
-        <span className={classes.insideOverlay} />
-        <mq.Static latex={latex} onFocus={onFocus} onBlur={onBlur} />
-      </div>
-    );
-  }
-}
-
-const mp = (theme) => ({
-  root: {
-    display: 'inline-flex',
-    alignItems: 'center',
-    position: 'relative',
-    '& *': {
-      fontFamily: 'MJXZERO, MJXTEX !important',
-      '-webkit-font-smoothing': 'antialiased !important',
-    },
-    '& > .mq-math-mode > span > var': {
-      fontFamily: 'MJXZERO, MJXTEX-I !important',
-    },
-    '& > .mq-math-mode span var': {
-      fontFamily: 'MJXZERO, MJXTEX-I !important',
-    },
-    '& > .mq-math-mode .mq-nonSymbola': {
-      fontFamily: 'MJXZERO, MJXTEX-I !important',
-    },
-    '& > .mq-math-mode > span > var.mq-operator-name': {
-      fontFamily: 'MJXZERO, MJXTEX !important',
-    },
-    '& > .mq-math-mode': {
-      border: 'solid 1px lightgrey',
-    },
-    '& > .mq-focused': {
-      outline: 'none',
-      boxShadow: 'none',
-      border: 'solid 1px black',
-      borderRadius: '0px',
-    },
-    '& > .mq-math-mode .mq-root-block': {
-      paddingTop: '7px !important',
-    },
-    '& > .mq-math-mode .mq-overarc ': {
-      paddingTop: '0.45em !important',
-    },
-    '& > .mq-math-mode .mq-sqrt-prefix': {
-      verticalAlign: 'baseline !important',
-      top: '1px !important',
-      left: '-0.1em !important',
-    },
-    '& > .mq-math-mode .mq-denominator': {
-      marginTop: '-5px !important',
-      padding: '0.5em 0.1em 0.1em !important',
-    },
-    '& > .mq-math-mode .mq-numerator, .mq-math-mode .mq-over': {
-      padding: '0 0.1em !important',
-      paddingBottom: '0 !important',
-      marginBottom: '-2px',
-    },
-    '& > .mq-math-mode sup.mq-nthroot': {
-      fontSize: '70.7% !important',
-      verticalAlign: '0.5em !important',
-      paddingRight: '0.15em',
-    },
-    '& > .mq-longdiv-inner': {
-      marginTop: '-1px',
-      marginLeft: '5px !important;',
-
-      '& > .mq-empty': {
-        padding: '0 !important',
-        marginLeft: '0px !important',
-        marginTop: '2px',
-      },
-    },
-    '& > .mq-math-mode .mq-longdiv': {
-      display: 'inline-flex !important',
-    },
-    '& > .mq-math-mode .mq-longdiv .mq-longdiv-inner .mq-empty': {
-      paddingTop: '6px !important',
-      paddingLeft: '4px !important',
-    },
-    '& > .mq-math-mode .mq-longdiv .mq-longdiv-inner': {
-      marginLeft: '0 !important',
-    },
-    '& > .mq-math-mode .mq-supsub': {
-      fontSize: '70.7% !important',
-    },
-    '& > .mq-math-mode .mq-overarrow': {
-      fontFamily: 'Roboto, Helvetica, Arial, sans-serif !important',
-    },
-    '& > .mq-math-mode .mq-paren': {
-      verticalAlign: 'top !important',
-      padding: '1px 0.1em !important',
-    },
-
-    '& > .mq-math-mode .mq-sqrt-stem': {
-      borderTop: '0.07em solid',
-      marginLeft: '-1.5px',
-      marginTop: '-2px !important',
-      paddingTop: '5px !important',
-    },
-    '& > .mq-supsub ': {
-      fontSize: '70.7%',
-    },
-
-    '& > .mq-math-mode .mq-supsub.mq-sup-only': {
-      verticalAlign: '-0.1em !important',
-
-      '& .mq-sup': {
-        marginBottom: '0px !important',
-      },
-    },
-    '& .mq-overarrow-inner': {
-      paddingTop: '0 !important',
-      border: 'none !important',
-    },
-    '& .mq-editable-field .mq-cursor': {
-      marginTop: '-15px !important',
-    },
-    '& .mq-overarrow.mq-arrow-both': {
-      top: '7.5px',
-      marginTop: '0px',
-      minWidth: '1.23em',
-      '& *': {
-        lineHeight: '1 !important',
-      },
-      '&:before': {
-        top: '-0.4em',
-        left: '-1px',
-      },
-      '&:after': {
-        top: '0px !important',
-        position: 'absolute',
-        right: '-2px',
-      },
-      '&.mq-empty:after': {
-        top: '-0.45em',
-      },
-    },
-    '& .mq-overarrow.mq-arrow-right': {
-      '&:before': {
-        top: '-0.4em',
-        right: '-1px',
-      },
-    },
-    '& .mq-overarrow-inner-right': {
-      display: 'none !important',
-    },
-    '& .mq-overarrow-inner-left': {
-      display: 'none !important',
-    },
-    '& .mq-longdiv-inner': {
-      borderTop: '1px solid !important',
-      paddingTop: '1.5px !important',
-    },
-    '& .mq-parallelogram': {
-      lineHeight: 0.85,
-    },
-  },
-  selected: {
-    border: `solid 1px ${theme.palette.primary.main}`,
-    '& > .mq-math-mode': {
-      border: 'solid 0px lightgrey',
-    },
-  },
-  insideOverlay: {
-    position: 'absolute',
-    bottom: 0,
-    left: 0,
-    right: 0,
-    top: 0,
-  },
-});
-
-export default withStyles(mp)(RawMathPreview);

package/configure/node_modules/@pie-lib/pie-toolbox/src/code/plot/draggable.jsx

@@ -1,11 +0,0 @@
-import Draggable, { DraggableCore } from 'react-draggable';
-
-export default class LocalDraggable extends Draggable {
-  componentWillReceiveProps(next) {
-    super.componentWillReceiveProps(next);
-    //Remove the x/y state as these values have now been updated and will come through as props.
-    this.setState({ x: 0, y: 0 });
-  }
-}
-
-export { DraggableCore };

package/configure/node_modules/@pie-lib/pie-toolbox/src/code/plot/graph-props.js

@@ -1,38 +0,0 @@
-import invariant from 'invariant';
-import { snapTo } from './utils';
-import { scaleLinear } from 'd3-scale';
-
-const createSnapMinAndMax = ({ min, max, step }) => {
-  // for graphing, if step is a value with decimals, we have to calculate the min & max for the grid taking in consideration that 0 has to be exactly in the middle
-  // for example, if min: -5 & max: 5 & step: 0.75, in order to keep 0 in the middle we have to set min: -4.5 & max: 4.5
-
-  return {
-    step,
-    min: parseInt(min / step) * step,
-    max: parseInt(max / step) * step,
-  };
-};
-
-export const create = (domain, range, size, getRootNode) => {
-  invariant(domain.min < domain.max, 'domain: min must be less than max');
-  invariant(range.min < range.max, 'range: min must be less than max');
-
-  const domainMinMax = createSnapMinAndMax(domain);
-  const rangeMinMax = createSnapMinAndMax(range);
-
-  const scale = {
-    x: scaleLinear()
-      .domain([domain.min, domain.max])
-      .range([0, size.width]),
-    y: scaleLinear()
-      .domain([range.max, range.min])
-      .range([0, size.height]),
-  };
-
-  const snap = {
-    x: snapTo.bind(null, domainMinMax.min, domainMinMax.max, domainMinMax.step),
-    y: snapTo.bind(null, rangeMinMax.min, rangeMinMax.max, rangeMinMax.step),
-  };
-
-  return { scale, snap, domain, range, size, getRootNode };
-};

package/configure/node_modules/@pie-lib/pie-toolbox/src/code/plot/grid-draggable.jsx

@@ -1,225 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { GraphPropsType } from './types';
-import { DraggableCore } from './draggable';
-import debug from 'debug';
-import * as utils from './utils';
-import isFunction from 'lodash/isFunction';
-import invariant from 'invariant';
-import { clientPoint } from 'd3-selection';
-
-const log = debug('pie-lib:plot:grid-draggable');
-
-export const deltaFn = (scale, snap, val) => (delta) => {
-  const normalized = delta + scale(0);
-  const inverted = scale.invert(normalized);
-
-  const fixDecimalsArithmetic = (snap(val + inverted).toFixed(4) * 1000) / 1000;
-
-  return fixDecimalsArithmetic;
-};
-
-/**
- * Creates a Component that is draggable, within a bounded grid.
- * @param {*} opts
- */
-export const gridDraggable = (opts) => (Comp) => {
-  invariant(
-    !!opts && isFunction(opts.fromDelta) && isFunction(opts.bounds) && isFunction(opts.anchorPoint),
-    'You must supply an object with: { anchorPoint: Function, fromDelta: Function, bounds: Function }',
-  );
-  return class GridDraggable extends React.Component {
-    static propTypes = {
-      disabled: PropTypes.bool,
-      onDragStart: PropTypes.func,
-      onDrag: PropTypes.func,
-      onDragStop: PropTypes.func,
-      onClick: PropTypes.func,
-      onMove: PropTypes.func,
-      graphProps: GraphPropsType.isRequired,
-    };
-    grid = () => {
-      const { graphProps } = this.props;
-      const { scale, domain, range } = graphProps;
-      return {
-        x: scale.x(domain.step) - scale.x(0),
-        y: scale.y(range.step) - scale.y(0),
-      };
-    };
-    onStart = (e) => {
-      const { onDragStart } = this.props;
-      if (document.activeElement) {
-        document.activeElement.blur();
-      }
-      this.setState({ startX: e.clientX, startY: e.clientY });
-      if (onDragStart) {
-        onDragStart();
-      }
-    };
-    position = () => {
-      const { x, y } = opts.anchorPoint(this.props);
-      const { graphProps } = this.props;
-      const { scale, snap } = graphProps;
-
-      return {
-        anchorPoint: {
-          x,
-          y,
-        },
-        x: deltaFn(scale.x, snap.x, x),
-        y: deltaFn(scale.y, snap.y, y),
-      };
-    };
-
-    tiny = (key, event) => {
-      const K = key.toUpperCase();
-      const end = event[`client${K}`];
-      const start = this.state[`start${K}`];
-      const delta = Math.abs(end - start);
-      const out = delta < Math.abs(this.grid()[key]) / 10;
-      log('[tiny] key: ', key, 'delta: ', delta, 'out: ', out);
-      return out;
-    };
-
-    getScaledBounds = () => {
-      const bounds = opts.bounds(this.props, this.props.graphProps);
-      log('bounds: ', bounds);
-      const grid = this.grid();
-
-      const scaled = {
-        left: (bounds.left / grid.interval) * grid.x,
-        right: (bounds.right / grid.interval) * grid.x,
-        top: (bounds.top / grid.interval) * grid.y,
-        bottom: (bounds.bottom / grid.interval) * grid.y,
-      };
-      log('[getScaledBounds]: ', scaled);
-      return scaled;
-    };
-
-    skipDragOutsideOfBounds = (dd, e, graphProps) => {
-      // ignore drag movement outside of the domain and range.
-      const rootNode = graphProps.getRootNode();
-      const [rawX, rawY] = clientPoint(rootNode, e);
-      const { scale, domain, range } = graphProps;
-      let x = scale.x.invert(rawX);
-      let y = scale.y.invert(rawY);
-
-      const xOutside = (dd.deltaX > 0 && x < domain.min) || (dd.deltaX < 0 && x > domain.max);
-      const yOutside = (dd.deltaY > 0 && y > range.max) || (dd.deltaY < 0 && y < range.min);
-      return xOutside || yOutside;
-    };
-
-    onDrag = (e, dd) => {
-      const { onDrag, graphProps } = this.props;
-
-      if (!onDrag) {
-        return;
-      }
-
-      const bounds = this.getScaledBounds();
-
-      if (dd.deltaX < 0 && dd.deltaX < bounds.left) {
-        return;
-      }
-
-      if (dd.deltaX > 0 && dd.deltaX > bounds.right) {
-        return;
-      }
-
-      if (dd.deltaY < 0 && dd.deltaY < bounds.top) {
-        return;
-      }
-
-      if (dd.deltaY > 0 && dd.deltaY > bounds.bottom) {
-        return;
-      }
-
-      if (this.skipDragOutsideOfBounds(dd, e, graphProps)) {
-        return;
-      }
-
-      const dragArg = this.applyDelta({ x: dd.deltaX, y: dd.deltaY });
-
-      if (dragArg !== undefined || dragArg !== null) {
-        onDrag(dragArg);
-      }
-    };
-
-    getDelta = (point) => {
-      const pos = this.position();
-
-      const p = {
-        x: pos.x(point.x),
-        y: pos.y(point.y),
-      };
-
-      return utils.getDelta(pos.anchorPoint, p);
-    };
-
-    applyDelta = (point) => {
-      const delta = this.getDelta(point);
-      log('[applyDelta] delta:', delta);
-      return opts.fromDelta(this.props, delta);
-    };
-
-    onStop = (e, dd) => {
-      log('[onStop] dd:', dd);
-      const { onDragStop, onClick } = this.props;
-
-      if (onDragStop) {
-        onDragStop();
-      }
-
-      log('[onStop] lastX/Y: ', dd.lastX, dd.lastY);
-      const isClick = this.tiny('x', e) && this.tiny('y', e);
-
-      if (isClick) {
-        if (onClick) {
-          log('call onClick');
-          this.setState({ startX: null });
-          const { graphProps } = this.props;
-          const { scale, snap } = graphProps;
-          const [rawX, rawY] = clientPoint(e.target, e);
-          let x = scale.x.invert(rawX);
-          let y = scale.y.invert(rawY);
-          x = snap.x(x);
-          y = snap.y(y);
-          onClick({ x, y });
-          return false;
-        }
-      }
-
-      this.setState({ startX: null, startY: null });
-      // return false to prevent state updates in the underlying draggable - a move will have triggered an update already.
-      return false;
-    };
-
-    render() {
-      const { disabled, ...rest } = this.props;
-      const grid = this.grid();
-
-      // prevent the text select icon from rendering.
-      const onMouseDown = (e) => e.nativeEvent.preventDefault();
-
-      /**
-       * TODO: This shouldnt be necessary, we should be able to use the r-d classnames.
-       * But they aren't being unset. If we continue with this lib, we'll have to fix this.
-       */
-      const isDragging = this.state ? !!this.state.startX : false;
-
-      return (
-        <DraggableCore
-          disabled={disabled}
-          onMouseDown={onMouseDown}
-          onStart={this.onStart}
-          onDrag={this.onDrag}
-          onStop={this.onStop}
-          axis={opts.axis || 'both'}
-          grid={[grid.x, grid.y]}
-        >
-          <Comp {...rest} disabled={disabled} isDragging={isDragging} />
-        </DraggableCore>
-      );
-    }
-  };
-};

package/configure/node_modules/@pie-lib/pie-toolbox/src/code/plot/index.js

@@ -1,9 +0,0 @@
-import Root from './root';
-import Draggable from './draggable';
-import { gridDraggable } from './grid-draggable';
-import * as utils from './utils';
-import * as trig from './trig';
-import * as types from './types';
-import { create as createGraphProps } from './graph-props';
-
-export { Root, Draggable, gridDraggable, utils, trig, types, createGraphProps };