@pie-element/select-text 6.5.20 → 6.5.21

package/lib/index.js

@@ -7,6 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
@@ -29,6 +31,12 @@ var _main = _interopRequireDefault(require("./main"));
 
 var _mathRendering = require("@pie-lib/math-rendering");
 
+var _utils = _interopRequireDefault(require("./utils"));
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
 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; } }
@@ -55,6 +63,34 @@ var SelectText = /*#__PURE__*/function (_HTMLElement) {
     set: function set(s) {
       this._session = s;
 
+      if (this._model) {
+        var generatedModel = (0, _utils["default"])(this._model) || {};
+        var tokens = generatedModel.tokens; // make sure initial session tokens are parsed and have correct start and end (according to the regenerated model) - this case was introduced mostly for createCorrectSession
+        // check if the selectedTokens have the correct start and end
+
+        var areCorrect = (s.selectedTokens || []).filter(function (_ref) {
+          var start = _ref.start,
+              end = _ref.end;
+          return tokens.find(function (_ref2) {
+            var tStart = _ref2.start,
+                tEnd = _ref2.end;
+            return start === tStart && end === tEnd;
+          });
+        }).length;
+
+        if (!areCorrect) {
+          var _generatedModel = (0, _utils["default"])(_objectSpread(_objectSpread({}, this._model), {}, {
+            tokens: s.selectedTokens
+          })) || {};
+
+          var _tokens = _generatedModel.tokens;
+
+          if (_tokens) {
+            this._session.selectedTokens = _tokens;
+          }
+        }
+      }
+
       if (!Array.isArray(this._session.selectedTokens)) {
         this._session.selectedTokens = [];
       }
@@ -64,8 +100,8 @@ var SelectText = /*#__PURE__*/function (_HTMLElement) {
   }, {
     key: "isSessionComplete",
     value: function isSessionComplete() {
-      var _ref = this._session || {},
-          selectedTokens = _ref.selectedTokens;
+      var _ref3 = this._session || {},
+          selectedTokens = _ref3.selectedTokens;
 
       return Array.isArray(selectedTokens) && selectedTokens.length > 0;
     }

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.js"],"names":["SelectText","m","_model","render","dispatchEvent","ModelSetEvent","tagName","toLowerCase","isSessionComplete","undefined","s","_session","Array","isArray","selectedTokens","length","selection","SessionChangedEvent","el","React","createElement","Main","model","session","onSelectionChange","selectionChanged","bind","ReactDOM","HTMLElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAIA;;AACA;;;;;;IAEqBA,U;;;;;AACnB,wBAAc;AAAA;AAAA;AAEb;;;;SAED,aAAUC,CAAV,EAAa;AACX,WAAKC,MAAL,GAAcD,CAAd;AAEA,WAAKE,MAAL;AACA,WAAKC,aAAL,CACE,IAAIC,8BAAJ,CACE,KAAKC,OAAL,CAAaC,WAAb,EADF,EAEE,KAAKC,iBAAL,EAFF,EAGE,KAAKN,MAAL,KAAgBO,SAHlB,CADF;AAOD;;;SAED,aAAYC,CAAZ,EAAe;AACb,WAAKC,QAAL,GAAgBD,CAAhB;;AACA,UAAI,CAACE,KAAK,CAACC,OAAN,CAAc,KAAKF,QAAL,CAAcG,cAA5B,CAAL,EAAkD;AAChD,aAAKH,QAAL,CAAcG,cAAd,GAA+B,EAA/B;AACD;;AACD,WAAKX,MAAL;AACD;;;WAED,6BAAoB;AAClB,iBAA2B,KAAKQ,QAAL,IAAiB,EAA5C;AAAA,UAAQG,cAAR,QAAQA,cAAR;;AACA,aAAOF,KAAK,CAACC,OAAN,CAAcC,cAAd,KAAiCA,cAAc,CAACC,MAAf,GAAwB,CAAhE;AACD;;;WAED,0BAAiBC,SAAjB,EAA4B;AAC1B,WAAKL,QAAL,CAAcG,cAAd,GAA+BE,SAA/B;AAEA,WAAKZ,aAAL,CACE,IAAIa,oCAAJ,CACE,KAAKX,OAAL,CAAaC,WAAb,EADF,EAEE,KAAKC,iBAAL,EAFF,CADF;AAMD;;;WAED,6BAAoB;AAClB,WAAKL,MAAL;AACD;;;WAED,kBAAS;AAAA;;AACP,UAAI,KAAKD,MAAL,IAAe,KAAKS,QAAxB,EAAkC;AAChC,YAAMO,EAAE,gBAAGC,kBAAMC,aAAN,CAAoBC,gBAApB,EAA0B;AACnCC,UAAAA,KAAK,EAAE,KAAKpB,MADuB;AAEnCqB,UAAAA,OAAO,EAAE,KAAKZ,QAFqB;AAGnCa,UAAAA,iBAAiB,EAAE,KAAKC,gBAAL,CAAsBC,IAAtB,CAA2B,IAA3B;AAHgB,SAA1B,CAAX;;AAMAC,6BAASxB,MAAT,CAAgBe,EAAhB,EAAoB,IAApB,EAA0B,YAAM;AAC9B,yCAAW,KAAX;AACD,SAFD;AAGD;AACF;;;kDA1DqCU,W","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport {\n  SessionChangedEvent,\n  ModelSetEvent\n} from '@pie-framework/pie-player-events';\nimport Main from './main';\nimport { renderMath } from '@pie-lib/math-rendering';\n\nexport default class SelectText extends HTMLElement {\n  constructor() {\n    super();\n  }\n\n  set model(m) {\n    this._model = m;\n\n    this.render();\n    this.dispatchEvent(\n      new ModelSetEvent(\n        this.tagName.toLowerCase(),\n        this.isSessionComplete(),\n        this._model !== undefined\n      )\n    );\n  }\n\n  set session(s) {\n    this._session = s;\n    if (!Array.isArray(this._session.selectedTokens)) {\n      this._session.selectedTokens = [];\n    }\n    this.render();\n  }\n\n  isSessionComplete() {\n    const { selectedTokens } = this._session || {};\n    return Array.isArray(selectedTokens) && selectedTokens.length > 0;\n  }\n\n  selectionChanged(selection) {\n    this._session.selectedTokens = selection;\n\n    this.dispatchEvent(\n      new SessionChangedEvent(\n        this.tagName.toLowerCase(),\n        this.isSessionComplete()\n      )\n    );\n  }\n\n  connectedCallback() {\n    this.render();\n  }\n\n  render() {\n    if (this._model && this._session) {\n      const el = React.createElement(Main, {\n        model: this._model,\n        session: this._session,\n        onSelectionChange: this.selectionChanged.bind(this)\n      });\n\n      ReactDOM.render(el, this, () => {\n        renderMath(this);\n      });\n    }\n  }\n}\n"],"file":"index.js"}
+{"version":3,"sources":["../src/index.js"],"names":["SelectText","m","_model","render","dispatchEvent","ModelSetEvent","tagName","toLowerCase","isSessionComplete","undefined","s","_session","generatedModel","tokens","areCorrect","selectedTokens","filter","start","end","find","tStart","tEnd","length","Array","isArray","selection","SessionChangedEvent","el","React","createElement","Main","model","session","onSelectionChange","selectionChanged","bind","ReactDOM","HTMLElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAIA;;AACA;;AACA;;;;;;;;;;IAEqBA,U;;;;;AACnB,wBAAc;AAAA;AAAA;AAEb;;;;SAED,aAAUC,CAAV,EAAa;AACX,WAAKC,MAAL,GAAcD,CAAd;AAEA,WAAKE,MAAL;AACA,WAAKC,aAAL,CACE,IAAIC,8BAAJ,CACE,KAAKC,OAAL,CAAaC,WAAb,EADF,EAEE,KAAKC,iBAAL,EAFF,EAGE,KAAKN,MAAL,KAAgBO,SAHlB,CADF;AAOD;;;SAED,aAAYC,CAAZ,EAAe;AACb,WAAKC,QAAL,GAAgBD,CAAhB;;AAEA,UAAI,KAAKR,MAAT,EAAiB;AACf,YAAMU,cAAc,GAAG,uBAAc,KAAKV,MAAnB,KAA8B,EAArD;AACA,YAAQW,MAAR,GAAmBD,cAAnB,CAAQC,MAAR,CAFe,CAIf;AAEA;;AACA,YAAMC,UAAU,GAAG,CAACJ,CAAC,CAACK,cAAF,IAAoB,EAArB,EAAyBC,MAAzB,CAAgC;AAAA,cAAGC,KAAH,QAAGA,KAAH;AAAA,cAAUC,GAAV,QAAUA,GAAV;AAAA,iBAAoBL,MAAM,CAACM,IAAP,CAAY;AAAA,gBAAUC,MAAV,SAAGH,KAAH;AAAA,gBAAuBI,IAAvB,SAAkBH,GAAlB;AAAA,mBAAkCD,KAAK,KAAKG,MAAV,IAAoBF,GAAG,KAAKG,IAA9D;AAAA,WAAZ,CAApB;AAAA,SAAhC,EAAqIC,MAAxJ;;AAEA,YAAI,CAACR,UAAL,EAAiB;AACf,cAAMF,eAAc,GAAG,uDAAmB,KAAKV,MAAxB;AAAgCW,YAAAA,MAAM,EAAEH,CAAC,CAACK;AAA1C,iBAA+D,EAAtF;;AACA,cAAQF,OAAR,GAAmBD,eAAnB,CAAQC,MAAR;;AAEA,cAAIA,OAAJ,EAAY;AACV,iBAAKF,QAAL,CAAcI,cAAd,GAA+BF,OAA/B;AACD;AACF;AACF;;AAGD,UAAI,CAACU,KAAK,CAACC,OAAN,CAAc,KAAKb,QAAL,CAAcI,cAA5B,CAAL,EAAkD;AAChD,aAAKJ,QAAL,CAAcI,cAAd,GAA+B,EAA/B;AACD;;AACD,WAAKZ,MAAL;AACD;;;WAED,6BAAoB;AAClB,kBAA2B,KAAKQ,QAAL,IAAiB,EAA5C;AAAA,UAAQI,cAAR,SAAQA,cAAR;;AACA,aAAOQ,KAAK,CAACC,OAAN,CAAcT,cAAd,KAAiCA,cAAc,CAACO,MAAf,GAAwB,CAAhE;AACD;;;WAED,0BAAiBG,SAAjB,EAA4B;AAC1B,WAAKd,QAAL,CAAcI,cAAd,GAA+BU,SAA/B;AAEA,WAAKrB,aAAL,CACE,IAAIsB,oCAAJ,CACE,KAAKpB,OAAL,CAAaC,WAAb,EADF,EAEE,KAAKC,iBAAL,EAFF,CADF;AAMD;;;WAED,6BAAoB;AAClB,WAAKL,MAAL;AACD;;;WAED,kBAAS;AAAA;;AACP,UAAI,KAAKD,MAAL,IAAe,KAAKS,QAAxB,EAAkC;AAChC,YAAMgB,EAAE,gBAAGC,kBAAMC,aAAN,CAAoBC,gBAApB,EAA0B;AACnCC,UAAAA,KAAK,EAAE,KAAK7B,MADuB;AAEnC8B,UAAAA,OAAO,EAAE,KAAKrB,QAFqB;AAGnCsB,UAAAA,iBAAiB,EAAE,KAAKC,gBAAL,CAAsBC,IAAtB,CAA2B,IAA3B;AAHgB,SAA1B,CAAX;;AAMAC,6BAASjC,MAAT,CAAgBwB,EAAhB,EAAoB,IAApB,EAA0B,YAAM;AAC9B,yCAAW,KAAX;AACD,SAFD;AAGD;AACF;;;kDA/EqCU,W","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport {\n  SessionChangedEvent,\n  ModelSetEvent\n} from '@pie-framework/pie-player-events';\nimport Main from './main';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport generateModel from './utils';\n\nexport default class SelectText extends HTMLElement {\n  constructor() {\n    super();\n  }\n\n  set model(m) {\n    this._model = m;\n\n    this.render();\n    this.dispatchEvent(\n      new ModelSetEvent(\n        this.tagName.toLowerCase(),\n        this.isSessionComplete(),\n        this._model !== undefined\n      )\n    );\n  }\n\n  set session(s) {\n    this._session = s;\n\n    if (this._model) {\n      const generatedModel = generateModel(this._model) || {};\n      const { tokens } = generatedModel;\n\n      // make sure initial session tokens are parsed and have correct start and end (according to the regenerated model) - this case was introduced mostly for createCorrectSession\n\n      // check if the selectedTokens have the correct start and end\n      const areCorrect = (s.selectedTokens || []).filter(({ start, end }) => tokens.find(({ start: tStart, end: tEnd }) => start === tStart && end === tEnd)).length;\n\n      if (!areCorrect) {\n        const generatedModel = generateModel({ ...this._model, tokens: s.selectedTokens }) || {};\n        const { tokens } = generatedModel;\n\n        if (tokens) {\n          this._session.selectedTokens = tokens;\n        }\n      }\n    }\n\n\n    if (!Array.isArray(this._session.selectedTokens)) {\n      this._session.selectedTokens = [];\n    }\n    this.render();\n  }\n\n  isSessionComplete() {\n    const { selectedTokens } = this._session || {};\n    return Array.isArray(selectedTokens) && selectedTokens.length > 0;\n  }\n\n  selectionChanged(selection) {\n    this._session.selectedTokens = selection;\n\n    this.dispatchEvent(\n      new SessionChangedEvent(\n        this.tagName.toLowerCase(),\n        this.isSessionComplete()\n      )\n    );\n  }\n\n  connectedCallback() {\n    this.render();\n  }\n\n  render() {\n    if (this._model && this._session) {\n      const el = React.createElement(Main, {\n        model: this._model,\n        session: this._session,\n        onSelectionChange: this.selectionChanged.bind(this)\n      });\n\n      ReactDOM.render(el, this, () => {\n        renderMath(this);\n      });\n    }\n  }\n}\n"],"file":"index.js"}

package/lib/main.js

@@ -68,7 +68,7 @@ var Main = /*#__PURE__*/function (_React$Component) {
       });
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "correctAnswer", function () {
-      var model = _this.props.model;
+      var model = _this.state.model;
       return model.tokens.filter(function (t) {
         return t.correct;
       });
@@ -97,8 +97,7 @@ var Main = /*#__PURE__*/function (_React$Component) {
           classes = _this$props.classes;
       var _this$state = this.state,
           showCorrectAnswer = _this$state.showCorrectAnswer,
-          model = _this$state.model; // const model = generateTokens(this.props.model)
-
+          model = _this$state.model;
       var selectedTokens = showCorrectAnswer ? this.correctAnswer() : session.selectedTokens;
       log('[render] selectedTokens:', selectedTokens);
       return /*#__PURE__*/_react["default"].createElement("div", {
@@ -127,7 +126,22 @@ var Main = /*#__PURE__*/function (_React$Component) {
         text: model.text,
         tokens: model.tokens,
         selectedTokens: selectedTokens,
-        onChange: onSelectionChange,
+        onChange: function onChange(selection) {
+          var newSelections = selection.map(function (select) {
+            var token = model.tokens.find(function (_ref) {
+              var start = _ref.start,
+                  end = _ref.end;
+              return select.start === start && select.end === end;
+            }); // needed for getScore when tokens position is recalculated, to keep oldStart and oldEnd
+
+            if (token) {
+              return token;
+            }
+
+            return select;
+          });
+          onSelectionChange(newSelections);
+        },
         highlightChoices: model.highlightChoices,
         maxNoOfSelections: model.maxSelections,
         animationsDisabled: model.animationsDisabled

package/lib/main.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/main.jsx"],"names":["log","Types","model","PropTypes","object","session","onSelectionChange","func","isRequired","Main","props","setState","showCorrectAnswer","state","tokens","filter","t","correct","alwaysShowCorrect","nextProps","classes","selectedTokens","correctAnswer","mainContainer","teacherInstructions","animationsDisabled","hidden","visible","collapsible","prompt","disabled","incorrect","toggleShowCorrect","textSelect","text","highlightChoices","maxSelections","rationale","correctness","feedback","React","Component","StyledMain","theme","paddingLeft","spacing","unit","paddingRight","paddingBottom","color","backgroundColor","background","marginBottom","marginTop","whiteSpace","verticalAlign","paddingTop","Stateful","change"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { TextSelect } from '@pie-lib/text-select';\nimport CorrectAnswerToggle from '@pie-lib/correct-answer-toggle';\nimport { color, Feedback, Collapsible, hasText, PreviewPrompt } from '@pie-lib/render-ui';\nimport { withStyles } from '@material-ui/core/styles';\nimport generateModel from './utils';\n\nimport debug from 'debug';\n\nconst log = debug('@pie-ui:select-text');\n\nconst Types = {\n  model: PropTypes.object,\n  session: PropTypes.object,\n  onSelectionChange: PropTypes.func.isRequired\n};\n\nexport class Main extends React.Component {\n  static propTypes = { ...Types, classes: PropTypes.object.isRequired };\n\n  static defaultProps = {};\n\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      showCorrectAnswer: this.props.model.alwaysShowCorrect || false,\n      model: generateModel(props.model)\n    };\n  }\n\n  UNSAFE_componentWillReceiveProps(nextProps) {\n    this.setState({\n      showCorrectAnswer: !!nextProps.model.alwaysShowCorrect,\n      model: generateModel(nextProps.model)\n    });\n  }\n\n  toggleShowCorrect = () => {\n    this.setState({ showCorrectAnswer: !this.state.showCorrectAnswer });\n  };\n\n  correctAnswer = () => {\n    const { model } = this.props;\n\n    return model.tokens.filter(t => t.correct);\n  };\n\n  render() {\n    const { session, onSelectionChange, classes } = this.props;\n    const { showCorrectAnswer, model } = this.state;\n\n    // const model = generateTokens(this.props.model)\n\n    const selectedTokens = showCorrectAnswer\n      ? this.correctAnswer()\n      : session.selectedTokens;\n\n    log('[render] selectedTokens:', selectedTokens);\n\n    return (\n      <div className={classes.mainContainer}>\n        {\n          model.teacherInstructions && hasText(model.teacherInstructions) && (\n            <React.Fragment>\n              {!model.animationsDisabled ? <Collapsible\n                  labels={{hidden: 'Show Teacher Instructions', visible: 'Hide Teacher Instructions'}}\n                  className={classes.collapsible}\n                >\n                  <PreviewPrompt prompt={model.teacherInstructions}/>\n\n                </Collapsible>\n                : <PreviewPrompt prompt={model.teacherInstructions}/>}\n\n                <br />\n                </React.Fragment>\n          )\n        }\n        <div className={classes.prompt}>\n          <PreviewPrompt prompt={model.prompt}/>\n        </div>\n        {!model.alwaysShowCorrect && (\n          <CorrectAnswerToggle\n            show={model.disabled && model.incorrect}\n            toggled={showCorrectAnswer}\n            onToggle={this.toggleShowCorrect}\n          />\n        )}\n        <TextSelect\n          className={classes.textSelect}\n          disabled={model.disabled}\n          text={model.text}\n          tokens={model.tokens}\n          selectedTokens={selectedTokens}\n          onChange={onSelectionChange}\n          highlightChoices={model.highlightChoices}\n          maxNoOfSelections={model.maxSelections}\n          animationsDisabled={model.animationsDisabled}\n        />\n        {\n          model.rationale && hasText(model.rationale) && (\n            <React.Fragment>\n              {!model.animationsDisabled ? <Collapsible\n                  labels={{hidden: 'Show Rationale', visible: 'Hide Rationale'}} className={classes.collapsible}\n                  className={classes.collapsible}\n                >\n                  <PreviewPrompt prompt={model.rationale}/>\n                </Collapsible>\n                : <PreviewPrompt prompt={model.rationale}/>\n              }\n            </React.Fragment>)\n        }\n        {model.correctness && model.feedback && !showCorrectAnswer && (\n          <Feedback correctness={model.correctness} feedback={model.feedback}/>\n        )}\n      </div>\n    );\n  }\n}\n\nconst StyledMain = withStyles(theme => ({\n  mainContainer: {\n    paddingLeft: theme.spacing.unit,\n    paddingRight: theme.spacing.unit,\n    paddingBottom: theme.spacing.unit,\n    color: color.text(),\n    backgroundColor: color.background()\n  },\n  textSelect: {\n    marginBottom: theme.spacing.unit,\n    marginTop: theme.spacing.unit,\n    whiteSpace: 'normal'\n  },\n  prompt: {\n    verticalAlign: 'middle',\n    marginBottom: theme.spacing.unit\n  },\n  collapsible: {\n    paddingTop: theme.spacing.unit * 2,\n    paddingBottom: theme.spacing.unit * 3\n  }\n}))(Main);\n\nexport default class Stateful extends React.Component {\n  static propTypes = Types;\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      model: props.model,\n      session: props.session\n    };\n  }\n\n  UNSAFE_componentWillReceiveProps(nextProps) {\n    this.setState({ model: nextProps.model, session: nextProps.session });\n  }\n\n  change = selectedTokens => {\n    const session = { ...this.state.session, selectedTokens };\n    this.setState({ session }, () => {\n      this.props.onSelectionChange(this.state.session.selectedTokens);\n    });\n  };\n\n  render() {\n    const { model, session } = this.state;\n    return (\n      <StyledMain\n        model={model}\n        session={session}\n        onSelectionChange={this.change}\n      />\n    );\n  }\n}\n"],"file":"main.js"}
+{"version":3,"sources":["../src/main.jsx"],"names":["log","Types","model","PropTypes","object","session","onSelectionChange","func","isRequired","Main","props","setState","showCorrectAnswer","state","tokens","filter","t","correct","alwaysShowCorrect","nextProps","classes","selectedTokens","correctAnswer","mainContainer","teacherInstructions","animationsDisabled","hidden","visible","collapsible","prompt","disabled","incorrect","toggleShowCorrect","textSelect","text","selection","newSelections","map","select","token","find","start","end","highlightChoices","maxSelections","rationale","correctness","feedback","React","Component","StyledMain","theme","paddingLeft","spacing","unit","paddingRight","paddingBottom","color","backgroundColor","background","marginBottom","marginTop","whiteSpace","verticalAlign","paddingTop","Stateful","change"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { TextSelect } from '@pie-lib/text-select';\nimport CorrectAnswerToggle from '@pie-lib/correct-answer-toggle';\nimport { color, Feedback, Collapsible, hasText, PreviewPrompt } from '@pie-lib/render-ui';\nimport { withStyles } from '@material-ui/core/styles';\nimport generateModel from './utils';\n\nimport debug from 'debug';\n\nconst log = debug('@pie-ui:select-text');\n\nconst Types = {\n  model: PropTypes.object,\n  session: PropTypes.object,\n  onSelectionChange: PropTypes.func.isRequired\n};\n\nexport class Main extends React.Component {\n  static propTypes = { ...Types, classes: PropTypes.object.isRequired };\n\n  static defaultProps = {};\n\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      showCorrectAnswer: this.props.model.alwaysShowCorrect || false,\n      model: generateModel(props.model)\n    };\n  }\n\n  UNSAFE_componentWillReceiveProps(nextProps) {\n    this.setState({\n      showCorrectAnswer: !!nextProps.model.alwaysShowCorrect,\n      model: generateModel(nextProps.model)\n    });\n  }\n\n  toggleShowCorrect = () => {\n    this.setState({ showCorrectAnswer: !this.state.showCorrectAnswer });\n  };\n\n  correctAnswer = () => {\n    const { model } = this.state;\n\n    return model.tokens.filter(t => t.correct);\n  };\n\n  render() {\n    const { session, onSelectionChange, classes } = this.props;\n    const { showCorrectAnswer, model } = this.state;\n\n    const selectedTokens = showCorrectAnswer\n      ? this.correctAnswer()\n      : session.selectedTokens;\n\n    log('[render] selectedTokens:', selectedTokens);\n\n    return (\n      <div className={classes.mainContainer}>\n        {\n          model.teacherInstructions && hasText(model.teacherInstructions) && (\n            <React.Fragment>\n              {!model.animationsDisabled ? <Collapsible\n                  labels={{ hidden: 'Show Teacher Instructions', visible: 'Hide Teacher Instructions' }}\n                  className={classes.collapsible}\n                >\n                  <PreviewPrompt prompt={model.teacherInstructions}/>\n\n                </Collapsible>\n                : <PreviewPrompt prompt={model.teacherInstructions}/>}\n\n              <br/>\n            </React.Fragment>\n          )\n        }\n        <div className={classes.prompt}>\n          <PreviewPrompt prompt={model.prompt}/>\n        </div>\n        {!model.alwaysShowCorrect && (\n          <CorrectAnswerToggle\n            show={model.disabled && model.incorrect}\n            toggled={showCorrectAnswer}\n            onToggle={this.toggleShowCorrect}\n          />\n        )}\n        <TextSelect\n          className={classes.textSelect}\n          disabled={model.disabled}\n          text={model.text}\n          tokens={model.tokens}\n          selectedTokens={selectedTokens}\n          onChange={selection => {\n            const newSelections = selection.map(select => {\n              const token = model.tokens.find(({ start, end }) => select.start === start && select.end === end);\n\n              // needed for getScore when tokens position is recalculated, to keep oldStart and oldEnd\n              if (token) {\n                return token;\n              }\n\n              return select;\n            })\n\n            onSelectionChange(newSelections);\n          }}\n          highlightChoices={model.highlightChoices}\n          maxNoOfSelections={model.maxSelections}\n          animationsDisabled={model.animationsDisabled}\n        />\n        {\n          model.rationale && hasText(model.rationale) && (\n            <React.Fragment>\n              {!model.animationsDisabled ? <Collapsible\n                  labels={{ hidden: 'Show Rationale', visible: 'Hide Rationale' }} className={classes.collapsible}\n                  className={classes.collapsible}\n                >\n                  <PreviewPrompt prompt={model.rationale}/>\n                </Collapsible>\n                : <PreviewPrompt prompt={model.rationale}/>\n              }\n            </React.Fragment>)\n        }\n        {model.correctness && model.feedback && !showCorrectAnswer && (\n          <Feedback correctness={model.correctness} feedback={model.feedback}/>\n        )}\n      </div>\n    );\n  }\n}\n\nconst StyledMain = withStyles(theme => ({\n  mainContainer: {\n    paddingLeft: theme.spacing.unit,\n    paddingRight: theme.spacing.unit,\n    paddingBottom: theme.spacing.unit,\n    color: color.text(),\n    backgroundColor: color.background()\n  },\n  textSelect: {\n    marginBottom: theme.spacing.unit,\n    marginTop: theme.spacing.unit,\n    whiteSpace: 'normal'\n  },\n  prompt: {\n    verticalAlign: 'middle',\n    marginBottom: theme.spacing.unit\n  },\n  collapsible: {\n    paddingTop: theme.spacing.unit * 2,\n    paddingBottom: theme.spacing.unit * 3\n  }\n}))(Main);\n\nexport default class Stateful extends React.Component {\n  static propTypes = Types;\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      model: props.model,\n      session: props.session\n    };\n  }\n\n  UNSAFE_componentWillReceiveProps(nextProps) {\n    this.setState({ model: nextProps.model, session: nextProps.session });\n  }\n\n  change = selectedTokens => {\n    const session = { ...this.state.session, selectedTokens };\n    this.setState({ session }, () => {\n      this.props.onSelectionChange(this.state.session.selectedTokens);\n    });\n  };\n\n  render() {\n    const { model, session } = this.state;\n    return (\n      <StyledMain\n        model={model}\n        session={session}\n        onSelectionChange={this.change}\n      />\n    );\n  }\n}\n"],"file":"main.js"}

package/lib/utils.js

@@ -90,7 +90,10 @@ var _default = function _default(model) {
     return [].concat((0, _toConsumableArray2["default"])(acc), [_objectSpread(_objectSpread({}, token), {}, {
       text: tokenText,
       start: newStart,
-      end: newEnd
+      end: newEnd,
+      // needed for getScore when tokens position is recalculated
+      oldStart: token.start,
+      oldEnd: token.end
     })]);
   }, []);
   return _objectSpread(_objectSpread({}, model), {}, {

package/lib/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils.js"],"names":["createElementFromHTML","htmlString","arguments","length","undefined","div","document","createElement","innerHTML","trim","parseParagraph","paragraph","end","concat","parseParagraphs","dom","paragraphs","querySelectorAll","str","forEach","par","index","prepareText","text","txtDom","allDomElements","Array","from","model","modelText","newTokens","tokens","reduce","acc","token","tokenText","slice","start","getStartIndex","newStartIndex","indexOf","lastToken","newStart","newEnd"],"mappings":"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","sourcesContent":["import React from 'react';\n\nvar createElementFromHTML = function createElementFromHTML() {\n  var htmlString = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';\n  var div = document.createElement('div');\n  div.innerHTML = htmlString.trim();\n  return div;\n};\n\nvar parseParagraph = function parseParagraph(paragraph, end) {\n  if (end) {\n    return paragraph.innerHTML;\n  }\n\n  return ''.concat(paragraph.innerHTML, '\\n\\n');\n};\n\nvar parseParagraphs = function parseParagraphs(dom) {\n  var paragraphs = dom.querySelectorAll('div[separator=true]'); // separate variable for easily debugging, if needed\n\n  var str = '';\n  paragraphs.forEach(function (par, index) {\n    str += parseParagraph(par, index === paragraphs.length - 1);\n  });\n  return str || null;\n};\n\nvar prepareText = function prepareText(text) {\n  var txtDom = createElementFromHTML(text);\n\n  var div = document.createElement('div');\n  div.innerHTML = '<div separator=\\'true\\'>'.concat(txtDom.innerHTML, '</div>');\n  txtDom = div;\n\n  var allDomElements = Array.from(txtDom.querySelectorAll('*'));\n\n  if (allDomElements.length === 0) {\n    return text;\n  }\n\n  return parseParagraphs(txtDom);\n};\n\nexport default (model) => {\n  if (!model) return model;\n\n  // parsing\n  const modelText = prepareText(model.text || '');\n\n  const newTokens = (model.tokens || []).reduce((acc, token = {}) => {\n    const tokenText = prepareText((model.text || '').slice(token.start, token.end));\n\n    if (!tokenText) {\n      return [...acc, token];\n    }\n\n    const getStartIndex = (start) => {\n      let length = start;\n\n      while (length >= 0) {\n        let newStartIndex = modelText.slice(length).indexOf(tokenText);\n\n        if (newStartIndex >= 0) {\n          return newStartIndex + length;\n        }\n\n        length--;\n      }\n\n      return 0;\n    };\n\n    const lastToken = acc[acc.length - 1];\n    const newStart = getStartIndex(lastToken ? lastToken.end : token.start);\n    const newEnd = newStart + tokenText.length;\n\n    return [\n      ...acc,\n      {\n        ...token,\n        text: tokenText,\n        start: newStart,\n        end: newEnd\n      }\n    ];\n  }, []);\n\n\n  return {\n    ...model,\n    tokens: newTokens,\n    text: modelText\n  }\n}\n"],"file":"utils.js"}
+{"version":3,"sources":["../src/utils.js"],"names":["createElementFromHTML","htmlString","arguments","length","undefined","div","document","createElement","innerHTML","trim","parseParagraph","paragraph","end","concat","parseParagraphs","dom","paragraphs","querySelectorAll","str","forEach","par","index","prepareText","text","txtDom","allDomElements","Array","from","model","modelText","newTokens","tokens","reduce","acc","token","tokenText","slice","start","getStartIndex","newStartIndex","indexOf","lastToken","newStart","newEnd","oldStart","oldEnd"],"mappings":"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","sourcesContent":["import React from 'react';\n\nvar createElementFromHTML = function createElementFromHTML() {\n  var htmlString = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';\n  var div = document.createElement('div');\n  div.innerHTML = htmlString.trim();\n  return div;\n};\n\nvar parseParagraph = function parseParagraph(paragraph, end) {\n  if (end) {\n    return paragraph.innerHTML;\n  }\n\n  return ''.concat(paragraph.innerHTML, '\\n\\n');\n};\n\nvar parseParagraphs = function parseParagraphs(dom) {\n  var paragraphs = dom.querySelectorAll('div[separator=true]'); // separate variable for easily debugging, if needed\n\n  var str = '';\n  paragraphs.forEach(function (par, index) {\n    str += parseParagraph(par, index === paragraphs.length - 1);\n  });\n  return str || null;\n};\n\nvar prepareText = function prepareText(text) {\n  var txtDom = createElementFromHTML(text);\n\n  var div = document.createElement('div');\n  div.innerHTML = '<div separator=\\'true\\'>'.concat(txtDom.innerHTML, '</div>');\n  txtDom = div;\n\n  var allDomElements = Array.from(txtDom.querySelectorAll('*'));\n\n  if (allDomElements.length === 0) {\n    return text;\n  }\n\n  return parseParagraphs(txtDom);\n};\n\nexport default (model) => {\n  if (!model) return model;\n\n  // parsing\n  const modelText = prepareText(model.text || '');\n\n  const newTokens = (model.tokens || []).reduce((acc, token = {}) => {\n    const tokenText = prepareText((model.text || '').slice(token.start, token.end));\n\n    if (!tokenText) {\n      return [...acc, token];\n    }\n\n    const getStartIndex = (start) => {\n      let length = start;\n\n      while (length >= 0) {\n        let newStartIndex = modelText.slice(length).indexOf(tokenText);\n\n        if (newStartIndex >= 0) {\n          return newStartIndex + length;\n        }\n\n        length--;\n      }\n\n      return 0;\n    };\n\n    const lastToken = acc[acc.length - 1];\n    const newStart = getStartIndex(lastToken ? lastToken.end : token.start);\n    const newEnd = newStart + tokenText.length;\n\n    return [\n      ...acc,\n      {\n        ...token,\n        text: tokenText,\n        start: newStart,\n        end: newEnd,\n        // needed for getScore when tokens position is recalculated\n        oldStart: token.start,\n        oldEnd: token.end\n      }\n    ];\n  }, []);\n\n\n  return {\n    ...model,\n    tokens: newTokens,\n    text: modelText\n  };\n};\n"],"file":"utils.js"}

package/module/configure.js

@@ -2650,7 +2650,9 @@ var generateModel = model => {
       ...token,
       text: tokenText,
       start: newStart,
-      end: newEnd
+      end: newEnd,
+      oldStart: token.start,
+      oldEnd: token.end
     }];
   }, []);
   return {

package/module/controller.js

@@ -18993,7 +18993,12 @@ const getCorrectness = (tokens, selected) => {
 const getCorrectSelected = (tokens, selected) => {
   return (selected || []).filter((s) => {
     const index = tokens.findIndex((c) => {
-      return c.correct && c.start === s.start && c.end === s.end;
+      return c.correct &&
+        (
+          (c.start === s.start && c.end === s.end) ||
+          // this case is used for the cases when the token's start & end were recalculated
+          (c.start === s.oldStart && c.end === s.oldEnd)
+        );
     });
     return index !== -1;
   });