@pie-element/complex-rubric 1.12.2-next.8 → 1.12.2

package/configure/node_modules/@pie-element/rubric/node_modules/@pie-lib/pie-toolbox/src/code/text-select/text-select.jsx

@@ -1,79 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-
-import TokenSelect from './token-select';
-import { normalize } from './tokenizer/builder';
-import { TokenTypes } from './token-select/token';
-import debug from 'debug';
-
-const log = debug('@pie-lib:text-select');
-/**
- * Built on TokenSelect uses build.normalize to build the token set.
- */
-export default class TextSelect extends React.Component {
-  static propTypes = {
-    onChange: PropTypes.func,
-    disabled: PropTypes.bool,
-    tokens: PropTypes.arrayOf(PropTypes.shape(TokenTypes)).isRequired,
-    selectedTokens: PropTypes.arrayOf(PropTypes.shape(TokenTypes)).isRequired,
-    text: PropTypes.string.isRequired,
-    className: PropTypes.string,
-    highlightChoices: PropTypes.bool,
-    animationsDisabled: PropTypes.bool,
-    maxNoOfSelections: PropTypes.number,
-  };
-
-  change = (tokens) => {
-    const { onChange } = this.props;
-
-    if (!onChange) {
-      return;
-    }
-    const out = tokens.filter((t) => t.selected).map((t) => ({ start: t.start, end: t.end }));
-
-    onChange(out);
-  };
-
-  render() {
-    const {
-      text,
-      disabled,
-      tokens,
-      selectedTokens,
-      className,
-      highlightChoices,
-      maxNoOfSelections,
-      animationsDisabled,
-    } = this.props;
-
-    const normalized = normalize(text, tokens);
-    log('normalized: ', normalized);
-    const prepped = normalized.map((t) => {
-      const selectedIndex = selectedTokens.findIndex((s) => {
-        return s.start === t.start && s.end === t.end;
-      });
-      const selected = selectedIndex !== -1;
-      const correct = selected ? t.correct : undefined;
-      const isMissing = t.isMissing;
-      return {
-        ...t,
-        selectable: !disabled && t.predefined,
-        selected,
-        correct,
-        isMissing,
-      };
-    });
-
-    return (
-      <TokenSelect
-        highlightChoices={!disabled && highlightChoices}
-        className={className}
-        tokens={prepped}
-        disabled={disabled}
-        onChange={this.change}
-        maxNoOfSelections={maxNoOfSelections}
-        animationsDisabled={animationsDisabled}
-      />
-    );
-  }
-}

package/configure/node_modules/@pie-element/rubric/node_modules/@pie-lib/pie-toolbox/src/code/text-select/token-select/index.jsx

@@ -1,162 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import Token, { TokenTypes } from './token';
-import { withStyles } from '@material-ui/core/styles';
-import classNames from 'classnames';
-import clone from 'lodash/clone';
-import debug from 'debug';
-import { noSelect } from '../../style-utils';
-import { renderToString } from 'react-dom/server';
-import isEqual from 'lodash/isEqual';
-
-const log = debug('@pie-lib:text-select:token-select');
-
-export class TokenSelect extends React.Component {
-  static propTypes = {
-    tokens: PropTypes.arrayOf(PropTypes.shape(TokenTypes)).isRequired,
-    className: PropTypes.string,
-    classes: PropTypes.object.isRequired,
-    onChange: PropTypes.func.isRequired,
-    disabled: PropTypes.bool,
-    highlightChoices: PropTypes.bool,
-    animationsDisabled: PropTypes.bool,
-    maxNoOfSelections: PropTypes.number,
-  };
-
-  static defaultProps = {
-    highlightChoices: false,
-    maxNoOfSelections: 0,
-    tokens: [],
-  };
-
-  selectedCount = () => this.props.tokens.filter((t) => t.selected).length;
-
-  canSelectMore = (selectedCount) => {
-    const { maxNoOfSelections } = this.props;
-
-    if (maxNoOfSelections === 1) {
-      return true;
-    }
-
-    log('[canSelectMore] maxNoOfSelections: ', maxNoOfSelections, 'selectedCount: ', selectedCount);
-    return maxNoOfSelections <= 0 || (isFinite(maxNoOfSelections) && selectedCount < maxNoOfSelections);
-  };
-
-  /**
-   @function
-   @param { object } event
-
-   @description
-    each token is wrapped into a span that has Token.rootClassName class and indexkey attribute (represents the index of the token)
-    tokens are updated with the targeted token having the correct value set for 'selected' property
-   */
-  toggleToken = (event) => {
-    const { target } = event;
-    const { tokens, animationsDisabled } = this.props;
-    const tokensCloned = clone(tokens);
-    const targetSpanWrapper = target.closest(`.${Token.rootClassName}`);
-    const targetedTokenIndex = targetSpanWrapper && targetSpanWrapper.dataset && targetSpanWrapper.dataset.indexkey;
-    const t = targetedTokenIndex && tokensCloned[targetedTokenIndex];
-
-    if (t && t.correct === undefined && !animationsDisabled) {
-      const { onChange, maxNoOfSelections } = this.props;
-      const selected = !t.selected;
-
-      if (maxNoOfSelections === 1 && this.selectedCount() === 1) {
-        const selectedToken = (tokens || []).filter((t) => t.selected);
-
-        const updatedTokens = tokensCloned.map((token) => {
-          if (isEqual(token, selectedToken[0])) {
-            return { ...token, selected: false };
-          }
-
-          return { ...token, selectable: true };
-        });
-
-        const update = { ...t, selected: !t.selected };
-
-        updatedTokens.splice(targetedTokenIndex, 1, update);
-        onChange(updatedTokens);
-      } else {
-        if (selected && maxNoOfSelections > 0 && this.selectedCount() >= maxNoOfSelections) {
-          log('skip toggle max reached');
-          return;
-        }
-
-        const update = { ...t, selected: !t.selected };
-
-        tokensCloned.splice(targetedTokenIndex, 1, update);
-        onChange(tokensCloned);
-      }
-    }
-  };
-
-  generateTokensInHtml = () => {
-    const { tokens, disabled, highlightChoices, animationsDisabled } = this.props;
-    const selectedCount = this.selectedCount();
-    const isLineBreak = (text) => text === '\n';
-    const isNewParagraph = (text) => text === '\n\n';
-
-    const reducer = (accumulator, t, index) => {
-      const selectable = t.selected || (t.selectable && this.canSelectMore(selectedCount));
-      const showCorrectAnswer = t.correct !== undefined && (t.selectable || t.selected);
-      let finalAcc = accumulator;
-
-      if (isNewParagraph(t.text)) {
-        return finalAcc + '</p><p>';
-      }
-
-      if (isLineBreak(t.text)) {
-        return finalAcc + '<br>';
-      }
-
-      if (
-        (selectable && !disabled) ||
-        showCorrectAnswer ||
-        t.selected ||
-        t.isMissing ||
-        (animationsDisabled && t.predefined) // if we are in print mode
-      ) {
-        return (
-          finalAcc +
-          renderToString(
-            <Token
-              key={index}
-              disabled={disabled}
-              index={index}
-              {...t}
-              selectable={selectable}
-              highlight={highlightChoices}
-              animationsDisabled={animationsDisabled}
-            />,
-          )
-        );
-      } else {
-        return accumulator + t.text;
-      }
-    };
-
-    const reduceResult = (tokens || []).reduce(reducer, '<p>');
-
-    return reduceResult + '</p>';
-  };
-
-  render() {
-    const { classes, className: classNameProp } = this.props;
-    const className = classNames(classes.tokenSelect, classNameProp);
-    const html = this.generateTokensInHtml();
-
-    return <div className={className} dangerouslySetInnerHTML={{ __html: html }} onClick={this.toggleToken} />;
-  }
-}
-
-export default withStyles(() => ({
-  tokenSelect: {
-    backgroundColor: 'none',
-    whiteSpace: 'pre',
-    ...noSelect(),
-    '& p': {
-      whiteSpace: 'break-spaces',
-    },
-  },
-}))(TokenSelect);

package/configure/node_modules/@pie-element/rubric/node_modules/@pie-lib/pie-toolbox/src/code/text-select/token-select/token.jsx

@@ -1,199 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { withStyles } from '@material-ui/core/styles';
-import classNames from 'classnames';
-import { color } from '../../render-ui';
-import Check from '@material-ui/icons/Check';
-import Close from '@material-ui/icons/Close';
-
-const Wrapper = ({ useWrapper, children, classNameContainer, iconClass, Icon }) => {
-  if (useWrapper) {
-    return (
-      <span className={classNameContainer}>
-        {children}
-        <Icon className={iconClass} viewBox={'0 1 24 24'} />
-      </span>
-    );
-  }
-
-  return children;
-};
-
-Wrapper.propTypes = {
-  useWrapper: PropTypes.bool,
-  classNameContainer: PropTypes.string,
-  iconClass: PropTypes.string,
-  Icon: PropTypes.func,
-  children: PropTypes.element,
-};
-
-export const TokenTypes = {
-  text: PropTypes.string,
-  selectable: PropTypes.bool,
-};
-
-export class Token extends React.Component {
-  static rootClassName = 'tokenRootClass';
-
-  static propTypes = {
-    ...TokenTypes,
-    classes: PropTypes.object.isRequired,
-    className: PropTypes.string,
-    disabled: PropTypes.bool,
-    highlight: PropTypes.bool,
-    correct: PropTypes.bool,
-    text: PropTypes.string.isRequired,
-  };
-
-  static defaultProps = {
-    selectable: false,
-    text: '',
-  };
-
-  render() {
-    const {
-      text,
-      selectable,
-      selected,
-      classes,
-      className: classNameProp,
-      disabled,
-      index,
-      highlight,
-      correct,
-      animationsDisabled,
-      isMissing,
-    } = this.props;
-    const isTouchEnabled = 'ontouchstart' in window || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0;
-
-    let className;
-    let classNameContainer;
-    let Icon;
-    let iconClass;
-
-    if (correct === undefined && selected && disabled) {
-      className = classNames(classes.token, classes.selected, classes.disabledBlack);
-    } else if (correct !== undefined) {
-      className = classNames(Token.rootClassName, classes.custom);
-      Icon = correct ? Check : Close;
-      classNameContainer = correct === true ? classes.correct : classes.incorrect;
-      iconClass = correct === true ? classes.correctIcon : classes.incorrectIcon;
-    } else if (isMissing) {
-      className = classNames(Token.rootClassName, classes.custom, isMissing === true && classes.missing);
-    } else {
-      className = classNames(
-        Token.rootClassName,
-        classes.token,
-        disabled && classes.disabled,
-        selectable && !disabled && !isTouchEnabled && classes.selectable,
-        selected && !disabled && classes.selected,
-        selected && disabled && classes.disabledAndSelected,
-        highlight && selectable && !disabled && !selected && classes.highlight,
-        animationsDisabled && classes.print,
-        classNameProp,
-      );
-    }
-    return (
-      <Wrapper
-        useWrapper={correct !== undefined}
-        classNameContainer={classNameContainer}
-        iconClass={iconClass}
-        Icon={Icon}
-      >
-        <span
-          className={className}
-          dangerouslySetInnerHTML={{ __html: (text || '').replace(/\n/g, '<br>') }}
-          data-indexkey={index}
-        />
-      </Wrapper>
-    );
-  }
-}
-
-export default withStyles((theme) => {
-  return {
-    token: {
-      cursor: 'pointer',
-      textIndent: 0,
-      padding: theme.spacing.unit / 2,
-      paddingRight: 0,
-      paddingLeft: 0,
-      transition: 'background-color 100ms ease-in',
-    },
-    disabled: {
-      cursor: 'inherit',
-      color: color.disabled(),
-    },
-    disabledBlack: {
-      cursor: 'inherit',
-    },
-    disabledAndSelected: {
-      backgroundColor: color.secondaryLight(),
-    },
-    selectable: {
-      [theme.breakpoints.up(769)]: {
-        '&:hover': {
-          backgroundColor: color.primaryLight(),
-          '& > *': {
-            backgroundColor: color.primaryLight(),
-          },
-        },
-      },
-    },
-    selected: {
-      lineHeight: 2,
-      marginTop: theme.spacing.unit / 2,
-      backgroundColor: color.primaryLight(),
-      '& > *': {
-        backgroundColor: color.primaryLight(),
-      },
-    },
-    highlight: {
-      border: `dashed 2px ${color.disabled()}`,
-      lineHeight: 2,
-      boxSizing: 'border-box',
-      marginTop: theme.spacing.unit / 2,
-      display: 'inline-block',
-      padding: theme.spacing.unit,
-    },
-    print: {
-      border: `dashed 2px ${color.disabled()}`,
-      lineHeight: 2,
-      boxSizing: 'border-box',
-      marginTop: theme.spacing.unit / 2,
-      display: 'inline-block',
-      padding: theme.spacing.unit,
-      color: color.text(),
-    },
-
-    custom: {
-      display: 'initial',
-    },
-    correct: {
-      backgroundColor: color.correctSecondary(),
-      border: `${color.correct()} solid 2px`,
-      lineHeight: `${theme.spacing.unit * 4}px`,
-    },
-    incorrect: {
-      backgroundColor: color.incorrectSecondary(),
-      border: `${color.missing()} solid 2px`,
-      lineHeight: `${theme.spacing.unit * 4}px`,
-    },
-    missing: {
-      backgroundColor: color.incorrectSecondary(),
-      border: `${color.missing()} dashed 2px`,
-      textDecoration: `line-through ${color.missing()}`,
-    },
-    incorrectIcon: {
-      verticalAlign: 'middle',
-      fontSize: 'larger',
-      color: color.missing(),
-    },
-
-    correctIcon: {
-      verticalAlign: 'middle',
-      fontSize: 'larger',
-      color: color.correct(),
-    },
-  };
-})(Token);

package/configure/node_modules/@pie-element/rubric/node_modules/@pie-lib/pie-toolbox/src/code/text-select/tokenizer/builder.js

@@ -1,259 +0,0 @@
-import compact from 'lodash/compact';
-import English from '@pie-framework/parse-english';
-import clone from 'lodash/clone';
-
-const g = (str, node) => {
-  if (node.children) {
-    return node.children.reduce(g, str);
-  } else if (node.value) {
-    return str + node.value;
-  } else {
-    return str;
-  }
-};
-
-const getParagraph = (p) => g('', p);
-
-const getSentence = (s) => g('', s);
-
-const getWord = (w) => g('', w);
-
-export const paragraphs = (text) => {
-  const tree = new English().parse(text);
-
-  const out = tree.children.reduce((acc, child) => {
-    if (child.type === 'ParagraphNode') {
-      const paragraph = {
-        text: getParagraph(child),
-        start: child.position.start.offset,
-        end: child.position.end.offset,
-      };
-
-      return acc.concat([paragraph]);
-    } else {
-      return acc;
-    }
-  }, []);
-
-  return out;
-};
-
-export const handleSentence = (child, acc) => {
-  const sentenceChilds = [];
-  // we parse the children of the sentence
-  let newAcc = child.children.reduce(function(acc, child) {
-    // if we find a whitespace node that's \n, we end the sentence
-    if (child.type === 'WhiteSpaceNode' && child.value === '\n') {
-      if (sentenceChilds.length) {
-        const firstWord = sentenceChilds[0];
-        // we create a sentence starting from the first word until the new line
-        const sentence = {
-          text: sentenceChilds.map((d) => getSentence(d)).join(''),
-          start: firstWord.position.start.offset,
-          end: child.position.start.offset,
-        };
-
-        // we remove all the elements from the array
-        sentenceChilds.splice(0, sentenceChilds.length);
-        return acc.concat([sentence]);
-      }
-    } else {
-      // otherwise we add it to the array that contains the child forming a sentence
-      sentenceChilds.push(child);
-    }
-
-    return acc;
-  }, acc);
-
-  // we treat the case when no \n character is found at the end
-  // so we create a sentence from the last words or white spaces found
-  if (sentenceChilds.length) {
-    const firstWord = sentenceChilds[0];
-    const lastWord = sentenceChilds[sentenceChilds.length - 1];
-    const sentence = {
-      text: sentenceChilds.map((d) => getSentence(d)).join(''),
-      start: firstWord.position.start.offset,
-      end: lastWord.position.end.offset,
-    };
-
-    newAcc = newAcc.concat([sentence]);
-
-    sentenceChilds.splice(0, sentenceChilds.length);
-  }
-
-  return newAcc;
-};
-
-export const sentences = (text) => {
-  const tree = new English().parse(text);
-
-  const out = tree.children.reduce((acc, child) => {
-    if (child.type === 'ParagraphNode') {
-      return child.children.reduce((acc, child) => {
-        if (child.type === 'SentenceNode') {
-          const newAcc = handleSentence(child, acc);
-
-          return newAcc || acc;
-        } else {
-          return acc;
-        }
-      }, acc);
-    } else {
-      return acc;
-    }
-  }, []);
-
-  return out;
-};
-export const words = (text) => {
-  const tree = new English().parse(text);
-
-  const out = tree.children.reduce((acc, child) => {
-    if (child.type === 'ParagraphNode') {
-      return child.children.reduce((acc, child) => {
-        if (child.type === 'SentenceNode') {
-          return child.children.reduce((acc, child) => {
-            if (child.type === 'WordNode') {
-              const node = {
-                text: getWord(child),
-                start: child.position.start.offset,
-                end: child.position.end.offset,
-              };
-              return acc.concat([node]);
-            } else {
-              return acc;
-            }
-          }, acc);
-        } else {
-          return acc;
-        }
-      }, acc);
-    } else {
-      return acc;
-    }
-  }, []);
-
-  return out;
-};
-
-class Intersection {
-  constructor(results) {
-    this.results = results;
-  }
-
-  get hasOverlap() {
-    return this.results.filter((r) => r.type === 'overlap').length > 0;
-  }
-
-  get surroundedTokens() {
-    return this.results.filter((r) => r.type === 'within-selection').map((t) => t.token);
-  }
-}
-/**
- * get intersection info for the selection in relation to tokens.
- * @param {{start: number, end: number}} selection
- * @param {{start: number, end: number}[]} tokens
- * @return {tokens: [], type: 'overlap|no-overlap|contains'}
- */
-export const intersection = (selection, tokens) => {
-  const { start, end } = selection;
-
-  const startsWithin = (t) => start >= t.start && start < t.end;
-  const endsWithin = (t) => end > t.start && end <= t.end;
-
-  const mapped = tokens.map((t) => {
-    if (start === t.start && end === t.end) {
-      return { token: t, type: 'exact-fit' };
-    } else if (start <= t.start && end >= t.end) {
-      return { token: t, type: 'within-selection' };
-    } else if (startsWithin(t) || endsWithin(t)) {
-      return { token: t, type: 'overlap' };
-    }
-  });
-  return new Intersection(compact(mapped));
-};
-
-export const sort = (tokens) => {
-  if (!Array.isArray(tokens)) {
-    return tokens;
-  } else {
-    const out = clone(tokens);
-    out.sort((a, b) => {
-      const s = a.start < b.start ? -1 : a.start > b.start ? 1 : 0;
-      const e = a.end < b.end ? -1 : a.end > b.end ? 1 : 0;
-      if (s === -1 && e !== -1) {
-        throw new Error(`sort does not support intersecting tokens. a: ${a.start}-${a.end}, b: ${b.start}-${b.end}`);
-      }
-      return s;
-    });
-    return out;
-  }
-};
-
-export const normalize = (textToNormalize, tokens) => {
-  // making sure text provided is a string
-  const text = textToNormalize || '';
-
-  if (!Array.isArray(tokens) || tokens.length === 0) {
-    return [
-      {
-        text,
-        start: 0,
-        end: text.length,
-      },
-    ];
-  }
-
-  const out = sort(tokens).reduce(
-    (acc, t, index, outer) => {
-      let tokens = [];
-      const lastIndex = acc.lastIndex;
-
-      if (t.start === lastIndex) {
-        tokens = [
-          {
-            text: text.substring(lastIndex, t.end),
-            start: lastIndex,
-            end: t.end,
-            predefined: true,
-            correct: t.correct,
-            isMissing: t.isMissing,
-          },
-        ];
-      } else if (lastIndex < t.start) {
-        tokens = [
-          {
-            text: text.substring(lastIndex, t.start),
-            start: lastIndex,
-            end: t.start,
-          },
-          {
-            text: text.substring(t.start, t.end),
-            start: t.start,
-            end: t.end,
-            predefined: true,
-            correct: t.correct,
-            isMissing: t.isMissing,
-          },
-        ];
-      }
-
-      if (index === outer.length - 1 && t.end < text.length) {
-        const last = {
-          text: text.substring(t.end),
-          start: t.end,
-          end: text.length,
-        };
-        tokens.push(last);
-      }
-
-      return {
-        lastIndex: tokens.length ? tokens[tokens.length - 1].end : lastIndex,
-        result: acc.result.concat(tokens),
-      };
-    },
-    { result: [], lastIndex: 0 },
-  );
-
-  return out.result;
-};