@pie-element/match 4.9.4 → 4.9.5

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [4.9.5](https://github.com/pie-framework/pie-elements/compare/@pie-element/match@4.9.4...@pie-element/match@4.9.5) (2021-12-13)
+
+**Note:** Version bump only for package @pie-element/match
+
+
+
+
+
 ## [4.9.2](https://github.com/pie-framework/pie-elements/compare/@pie-element/match@4.9.1...@pie-element/match@4.9.2) (2021-11-29)
 
 **Note:** Version bump only for package @pie-element/match

package/configure/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [4.4.5](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-configure@4.4.4...@pie-element/match-configure@4.4.5) (2021-12-13)
+
+**Note:** Version bump only for package @pie-element/match-configure
+
+
+
+
+
 ## [4.4.2](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-configure@4.4.1...@pie-element/match-configure@4.4.2) (2021-11-29)
 
 **Note:** Version bump only for package @pie-element/match-configure

package/configure/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pie-element/match-configure",
   "private": true,
-  "version": "4.4.4",
+  "version": "4.4.5",
   "description": "",
   "main": "lib/index.js",
   "module": "src/index.js",
@@ -10,10 +10,10 @@
     "@material-ui/core": "^3.9.2",
     "@material-ui/icons": "^3.0.1",
     "@pie-framework/pie-configure-events": "^1.2.0",
-    "@pie-lib/config-ui": "^10.10.12",
+    "@pie-lib/config-ui": "^10.10.13",
     "@pie-lib/drag": "^1.1.52",
-    "@pie-lib/editable-html": "^7.17.12",
-    "@pie-lib/scoring-config": "^3.5.141",
+    "@pie-lib/editable-html": "^7.17.13",
+    "@pie-lib/scoring-config": "^3.5.142",
     "classnames": "^2.2.5",
     "debug": "^3.1.0",
     "prop-types": "^15.6.2",

package/lib/main.js

@@ -147,16 +147,13 @@ var Main = /*#__PURE__*/function (_React$Component) {
           visible: 'Hide Teacher Instructions'
         },
         className: classes.collapsible
-      }, /*#__PURE__*/_react["default"].createElement("div", {
-        dangerouslySetInnerHTML: {
-          __html: model.teacherInstructions
-        }
+      }, /*#__PURE__*/_react["default"].createElement(_renderUi.PreviewPrompt, {
+        prompt: model.teacherInstructions
       })), model.prompt && /*#__PURE__*/_react["default"].createElement("div", {
-        className: classes.prompt,
-        dangerouslySetInnerHTML: {
-          __html: model.prompt
-        }
-      }), /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.prompt
+      }, /*#__PURE__*/_react["default"].createElement(_renderUi.PreviewPrompt, {
+        prompt: model.prompt
+      })), /*#__PURE__*/_react["default"].createElement("div", {
         className: classes.main
       }, /*#__PURE__*/_react["default"].createElement(_correctAnswerToggle["default"], {
         show: showCorrectAnswerToggle,
@@ -178,10 +175,8 @@ var Main = /*#__PURE__*/function (_React$Component) {
           visible: 'Hide Rationale'
         },
         className: classes.collapsible
-      }, /*#__PURE__*/_react["default"].createElement("div", {
-        dangerouslySetInnerHTML: {
-          __html: model.rationale
-        }
+      }, /*#__PURE__*/_react["default"].createElement(_renderUi.PreviewPrompt, {
+        prompt: model.rationale
       })), model.feedback && /*#__PURE__*/_react["default"].createElement(_renderUi.Feedback, {
         correctness: model.correctness.correctness,
         feedback: model.feedback

package/lib/main.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/main.jsx"],"names":["Main","props","model","config","answers","rows","forEach","row","id","Array","layout","fill","nextProps","isRequired","choiceMode","length","session","Object","keys","onSessionChange","state","show","setState","showCorrect","newAnswers","callOnSessionChange","generateAnswers","regenAnswers","isAnswerRegenerationRequired","disabled","classes","correctness","showCorrectAnswerToggle","mainContainer","teacherInstructions","hidden","visible","collapsible","__html","prompt","main","toggleShowCorrect","correctResponse","view","onAnswerChange","headers","rationale","feedback","React","Component","PropTypes","object","func","styles","theme","color","text","backgroundColor","background","display","flexDirection","justifyContent","width","toggle","paddingBottom","spacing","unit","verticalAlign","marginBottom","paddingTop"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport CorrectAnswerToggle from '@pie-lib/correct-answer-toggle';\nimport { color, Collapsible, Feedback, hasText } from '@pie-lib/render-ui';\nimport AnswerGrid from './answer-grid';\nimport { withStyles } from '@material-ui/core/styles';\n\nexport class Main extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object,\n    session: PropTypes.object.isRequired,\n    onSessionChange: PropTypes.func,\n    model: PropTypes.object.isRequired\n  };\n\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      session: {\n        ...props.session,\n        answers:\n          (props.session && props.session.answers) ||\n          this.generateAnswers(props.model)\n      },\n      showCorrect: false\n    };\n\n    this.callOnSessionChange();\n  }\n\n  generateAnswers = model => {\n    const { config } = model;\n    const answers = {};\n\n    config.rows.forEach(row => {\n      answers[row.id] = new Array(config.layout - 1).fill(false);\n    });\n\n    return answers;\n  };\n\n  isAnswerRegenerationRequired = nextProps => {\n    let isRequired = false;\n\n    if (\n      this.props.model.config.choiceMode !== nextProps.model.config.choiceMode\n    ) {\n      isRequired = true;\n    }\n\n    if (this.props.model.config.layout !== nextProps.model.config.layout) {\n      isRequired = true;\n    }\n\n    if (\n      this.props.model.config.rows.length !==\n        nextProps.model.config.rows.length ||\n      (nextProps.session.answers &&\n        nextProps.model.config.rows.length !==\n          Object.keys(nextProps.session.answers).length)\n    ) {\n      isRequired = true;\n    }\n\n    return isRequired || !nextProps.session.answers;\n  };\n\n  UNSAFE_componentWillReceiveProps(nextProps) {\n    const regenAnswers = this.isAnswerRegenerationRequired(nextProps);\n\n    this.setState(\n      state => ({\n        session: {\n          ...nextProps.session,\n          // regenerate answers if layout or choiceMode change\n          answers: regenAnswers\n            ? this.generateAnswers(nextProps.model)\n            : nextProps.session.answers\n        },\n        showCorrect:\n          this.props.model.disabled &&\n          !nextProps.model.disabled &&\n          state.showCorrect\n            ? false\n            : state.showCorrect\n      }),\n      () => {\n        if (regenAnswers) this.callOnSessionChange();\n      }\n    );\n  }\n\n  callOnSessionChange = () => {\n    const { onSessionChange } = this.props;\n\n    if (onSessionChange) {\n      onSessionChange(this.state.session);\n    }\n  };\n\n  toggleShowCorrect = show => {\n    this.setState({ showCorrect: show });\n  };\n\n  onAnswerChange = newAnswers => {\n    this.setState(\n      state => ({\n        session: {\n          ...state.session,\n          answers: newAnswers\n        }\n      }),\n      this.callOnSessionChange\n    );\n  };\n\n  render() {\n    const { model, classes } = this.props;\n    const { showCorrect, session } = this.state;\n    const { correctness = {} } = model;\n    const showCorrectAnswerToggle = correctness.correctness && correctness.correctness !== 'correct';\n\n    return (\n      <div className={classes.mainContainer}>\n        {model.teacherInstructions && hasText(model.teacherInstructions) && (\n          <Collapsible\n            labels={{\n              hidden: 'Show Teacher Instructions',\n              visible: 'Hide Teacher Instructions'\n            }}\n            className={classes.collapsible}\n          >\n            <div\n              dangerouslySetInnerHTML={{ __html: model.teacherInstructions }}\n            />\n          </Collapsible>\n        )}\n\n        {model.prompt && (\n          <div\n            className={classes.prompt}\n            dangerouslySetInnerHTML={{ __html: model.prompt }}\n          />\n        )}\n\n        <div className={classes.main}>\n          <CorrectAnswerToggle\n            show={showCorrectAnswerToggle}\n            toggled={showCorrect}\n            onToggle={this.toggleShowCorrect}\n          />\n          {showCorrectAnswerToggle && <br />}\n          <AnswerGrid\n            showCorrect={showCorrect}\n            correctAnswers={model.correctResponse}\n            disabled={model.disabled}\n            view={model.view}\n            onAnswerChange={this.onAnswerChange}\n            choiceMode={model.config.choiceMode}\n            answers={showCorrect ? model.correctResponse : session.answers}\n            headers={model.config.headers}\n            rows={model.config.rows}\n          />\n        </div>\n        {model.rationale && hasText(model.rationale) && (\n          <Collapsible\n            labels={{ hidden: 'Show Rationale', visible: 'Hide Rationale' }}\n            className={classes.collapsible}\n          >\n            <div dangerouslySetInnerHTML={{ __html: model.rationale }} />\n          </Collapsible>\n        )}\n        {model.feedback && (\n          <Feedback\n            correctness={model.correctness.correctness}\n            feedback={model.feedback}\n          />\n        )}\n      </div>\n    );\n  }\n}\n\nconst styles = theme => ({\n  mainContainer: {\n    color: color.text(),\n    backgroundColor: color.background(),\n    display: 'flex',\n    flexDirection: 'column',\n    justifyContent: 'center'\n  },\n  main: {\n    width: '100%'\n  },\n  toggle: {\n    paddingBottom: theme.spacing.unit * 3\n  },\n  prompt: {\n    verticalAlign: 'middle',\n    marginBottom: theme.spacing.unit * 2\n  },\n  collapsible: {\n    paddingTop: theme.spacing.unit * 2,\n    paddingBottom: theme.spacing.unit * 2\n  }\n});\n\nexport default withStyles(styles)(Main);\n"],"file":"main.js"}
+{"version":3,"sources":["../src/main.jsx"],"names":["Main","props","model","config","answers","rows","forEach","row","id","Array","layout","fill","nextProps","isRequired","choiceMode","length","session","Object","keys","onSessionChange","state","show","setState","showCorrect","newAnswers","callOnSessionChange","generateAnswers","regenAnswers","isAnswerRegenerationRequired","disabled","classes","correctness","showCorrectAnswerToggle","mainContainer","teacherInstructions","hidden","visible","collapsible","prompt","main","toggleShowCorrect","correctResponse","view","onAnswerChange","headers","rationale","feedback","React","Component","PropTypes","object","func","styles","theme","color","text","backgroundColor","background","display","flexDirection","justifyContent","width","toggle","paddingBottom","spacing","unit","verticalAlign","marginBottom","paddingTop"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport CorrectAnswerToggle from '@pie-lib/correct-answer-toggle';\nimport {color, Collapsible, Feedback, hasText, PreviewPrompt} from '@pie-lib/render-ui';\nimport AnswerGrid from './answer-grid';\nimport { withStyles } from '@material-ui/core/styles';\n\nexport class Main extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object,\n    session: PropTypes.object.isRequired,\n    onSessionChange: PropTypes.func,\n    model: PropTypes.object.isRequired\n  };\n\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      session: {\n        ...props.session,\n        answers:\n          (props.session && props.session.answers) ||\n          this.generateAnswers(props.model)\n      },\n      showCorrect: false\n    };\n\n    this.callOnSessionChange();\n  }\n\n  generateAnswers = model => {\n    const { config } = model;\n    const answers = {};\n\n    config.rows.forEach(row => {\n      answers[row.id] = new Array(config.layout - 1).fill(false);\n    });\n\n    return answers;\n  };\n\n  isAnswerRegenerationRequired = nextProps => {\n    let isRequired = false;\n\n    if (\n      this.props.model.config.choiceMode !== nextProps.model.config.choiceMode\n    ) {\n      isRequired = true;\n    }\n\n    if (this.props.model.config.layout !== nextProps.model.config.layout) {\n      isRequired = true;\n    }\n\n    if (\n      this.props.model.config.rows.length !==\n        nextProps.model.config.rows.length ||\n      (nextProps.session.answers &&\n        nextProps.model.config.rows.length !==\n          Object.keys(nextProps.session.answers).length)\n    ) {\n      isRequired = true;\n    }\n\n    return isRequired || !nextProps.session.answers;\n  };\n\n  UNSAFE_componentWillReceiveProps(nextProps) {\n    const regenAnswers = this.isAnswerRegenerationRequired(nextProps);\n\n    this.setState(\n      state => ({\n        session: {\n          ...nextProps.session,\n          // regenerate answers if layout or choiceMode change\n          answers: regenAnswers\n            ? this.generateAnswers(nextProps.model)\n            : nextProps.session.answers\n        },\n        showCorrect:\n          this.props.model.disabled &&\n          !nextProps.model.disabled &&\n          state.showCorrect\n            ? false\n            : state.showCorrect\n      }),\n      () => {\n        if (regenAnswers) this.callOnSessionChange();\n      }\n    );\n  }\n\n  callOnSessionChange = () => {\n    const { onSessionChange } = this.props;\n\n    if (onSessionChange) {\n      onSessionChange(this.state.session);\n    }\n  };\n\n  toggleShowCorrect = show => {\n    this.setState({ showCorrect: show });\n  };\n\n  onAnswerChange = newAnswers => {\n    this.setState(\n      state => ({\n        session: {\n          ...state.session,\n          answers: newAnswers\n        }\n      }),\n      this.callOnSessionChange\n    );\n  };\n\n  render() {\n    const { model, classes } = this.props;\n    const { showCorrect, session } = this.state;\n    const { correctness = {} } = model;\n    const showCorrectAnswerToggle = correctness.correctness && correctness.correctness !== 'correct';\n\n    return (\n      <div className={classes.mainContainer}>\n        {model.teacherInstructions && hasText(model.teacherInstructions) && (\n          <Collapsible\n            labels={{\n              hidden: 'Show Teacher Instructions',\n              visible: 'Hide Teacher Instructions'\n            }}\n            className={classes.collapsible}\n          >\n            <PreviewPrompt prompt={model.teacherInstructions} />\n          </Collapsible>\n        )}\n\n        {model.prompt && (\n          <div className={classes.prompt}>\n            <PreviewPrompt prompt={model.prompt} />\n          </div>\n        )}\n\n        <div className={classes.main}>\n          <CorrectAnswerToggle\n            show={showCorrectAnswerToggle}\n            toggled={showCorrect}\n            onToggle={this.toggleShowCorrect}\n          />\n          {showCorrectAnswerToggle && <br />}\n          <AnswerGrid\n            showCorrect={showCorrect}\n            correctAnswers={model.correctResponse}\n            disabled={model.disabled}\n            view={model.view}\n            onAnswerChange={this.onAnswerChange}\n            choiceMode={model.config.choiceMode}\n            answers={showCorrect ? model.correctResponse : session.answers}\n            headers={model.config.headers}\n            rows={model.config.rows}\n          />\n        </div>\n        {model.rationale && hasText(model.rationale) && (\n          <Collapsible\n            labels={{ hidden: 'Show Rationale', visible: 'Hide Rationale' }}\n            className={classes.collapsible}\n          >\n            <PreviewPrompt prompt={model.rationale} />\n          </Collapsible>\n        )}\n        {model.feedback && (\n          <Feedback\n            correctness={model.correctness.correctness}\n            feedback={model.feedback}\n          />\n        )}\n      </div>\n    );\n  }\n}\n\nconst styles = theme => ({\n  mainContainer: {\n    color: color.text(),\n    backgroundColor: color.background(),\n    display: 'flex',\n    flexDirection: 'column',\n    justifyContent: 'center'\n  },\n  main: {\n    width: '100%'\n  },\n  toggle: {\n    paddingBottom: theme.spacing.unit * 3\n  },\n  prompt: {\n    verticalAlign: 'middle',\n    marginBottom: theme.spacing.unit * 2\n  },\n  collapsible: {\n    paddingTop: theme.spacing.unit * 2,\n    paddingBottom: theme.spacing.unit * 2\n  }\n});\n\nexport default withStyles(styles)(Main);\n"],"file":"main.js"}

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "repository": "pie-framework/pie-elements",
-  "version": "4.9.4",
+  "version": "4.9.5",
   "main": "lib/index.js",
   "description": "",
   "scripts": {
@@ -14,9 +14,9 @@
   "dependencies": {
     "@material-ui/core": "^3.9.2",
     "@pie-framework/pie-player-events": "^0.1.0",
-    "@pie-lib/correct-answer-toggle": "^2.3.32",
+    "@pie-lib/correct-answer-toggle": "^2.3.33",
     "@pie-lib/math-rendering": "^2.3.12",
-    "@pie-lib/render-ui": "^4.12.3",
+    "@pie-lib/render-ui": "^4.12.4",
     "classnames": "^2.2.5",
     "debug": "^4.1.1",
     "lodash": "^4.17.10",
@@ -26,6 +26,6 @@
   },
   "author": "",
   "license": "ISC",
-  "gitHead": "6f1f221659a13d56f6c7e73b2bf5488c63943123",
+  "gitHead": "a1c13d49a8db2188145733261dd177cfb6b617fb",
   "module": "src/index.js"
 }