@pie-element/fraction-model 4.3.4-next.0 → 5.0.0-beta.0

package/lib/main.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/main.jsx"],"names":["Main","props","onSessionChange","state","session","model","answers","response","allowedStudentConfig","noOfModel","partsPerModel","newAnswers","oldSession","newSession","length","setState","answerChangeDialog","open","text","callOnSessionChange","show","showCorrect","Math","floor","random","generateAnswers","classes","prompt","title","correctness","extraCSSRules","language","showCorrectAnswerToggle","fractionModelChartKey","generateRandomKey","modelPreview","titleContainer","toggleShowCorrect","view","onAnswerChange","correctResponse","modelTypeSelected","maxModelSelected","showGraphLabels","onResponseChange","prevState","React","Component","PropTypes","object","func","isRequired","styles","previewHeading","fontWeight","fontSize","margin","padding","textAlign"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport AnswerFraction from './answer-fraction';\nimport CorrectAnswerToggle from '@pie-lib/correct-answer-toggle';\nimport FractionModelChart from './fraction-model-chart';\nimport { AlertDialog } from '@pie-lib/config-ui';\nimport { PreviewPrompt, UiLayout } from '@pie-lib/render-ui';\nimport cloneDeep from 'lodash/cloneDeep';\n\nexport class Main extends React.Component {\n  static propTypes = {\n    model: PropTypes.object,\n    session: PropTypes.object,\n    onSessionChange: PropTypes.func.isRequired,\n  };\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      session: {\n        ...props.session,\n        answers: (props.session && props.session.answers) || this.generateAnswers(props.model),\n      },\n      showCorrect: false,\n      answerChangeDialog: {\n        open: false,\n        text: '',\n      },\n    };\n    this.callOnSessionChange();\n  }\n\n  /**\n   * Function to trigger when session value change for fraction model\n   */\n  callOnSessionChange = () => {\n    const { onSessionChange } = this.props;\n    if (onSessionChange) {\n      onSessionChange(this.state.session);\n    }\n  };\n\n  /**\n   * Function to generate answers for preview selection\n   * @param {object} model contains model object for fraction model\n   * @returns answer model\n   */\n  generateAnswers = (model) => {\n    const answers = {\n      response: [],\n    };\n    if (model.allowedStudentConfig) {\n      (answers.noOfModel = ''), (answers.partsPerModel = '');\n    }\n    return answers;\n  };\n\n  /**\n   * Function to trigger when answer change from preview\n   * @param {object} newAnswers contains updated answer model\n   */\n  onAnswerChange = (newAnswers) => {\n    let oldSession = cloneDeep(this.state.session);\n    let newSession = {\n      ...this.state.session,\n      answers: newAnswers,\n    };\n    if (newAnswers.response.length > 0) {\n      this.setState({\n        answerChangeDialog: {\n          open: true,\n          oldSession: oldSession,\n          newSession: newSession,\n          text: 'Changing either the Number of Models or Parts per Model will remove added answer. Are you sure you want to continue?',\n        },\n      });\n    } else {\n      this.setState(\n        (state) => ({\n          session: newSession,\n        }),\n        this.callOnSessionChange,\n      );\n    }\n  };\n\n  /*\n   * Function to toggle correct answer\n   * @param {boolean} show contains boolean value to show correct answer\n   * */\n  toggleShowCorrect = (show) => {\n    this.setState({ showCorrect: show });\n  };\n\n  /*\n   * Function to trigger when response change from preview\n   * @param {object} response contains updated response model\n   * */\n  onResponseChange = (response) => {\n    this.setState(\n      (state) => ({\n        session: {\n          ...state.session,\n          answers: {\n            ...state.session.answers,\n            response,\n          },\n        },\n      }),\n      this.callOnSessionChange,\n    );\n  };\n\n  /*\n   * Method to generate random key\n   * */\n  generateRandomKey = () => {\n    return Math.floor(Math.random() * 10000);\n  };\n\n  render() {\n    const { model, classes } = this.props;\n    const { showCorrect, session, answerChangeDialog } = this.state;\n    const { prompt, title, correctness = {}, extraCSSRules, language } = model;\n    const showCorrectAnswerToggle = correctness.correctness && correctness.correctness !== 'correct';\n    const fractionModelChartKey = this.generateRandomKey();\n\n    return (\n      <UiLayout extraCSSRules={extraCSSRules}>\n        <div className={classes.modelPreview}>\n          <div className={classes.titleContainer}>\n            <PreviewPrompt className=\"prompt\" prompt={title} tagName=\"h3\" />\n          </div>\n          <PreviewPrompt className=\"prompt\" prompt={prompt} tagName=\"p\" />\n\n          <CorrectAnswerToggle\n            language={language}\n            show={showCorrectAnswerToggle}\n            toggled={showCorrect}\n            onToggle={this.toggleShowCorrect}\n          />\n\n          <AnswerFraction\n            model={model}\n            showCorrect={showCorrect}\n            disabled={model.view}\n            onAnswerChange={this.onAnswerChange}\n            answers={session.answers}\n          />\n\n          <FractionModelChart\n            key={fractionModelChartKey}\n            disabled={model.view}\n            value={showCorrect ? model.correctResponse : session.answers.response}\n            modelType={model.modelTypeSelected}\n            noOfModels={\n              showCorrect\n                ? model.maxModelSelected\n                : model.allowedStudentConfig\n                ? session.answers.noOfModel\n                : model.maxModelSelected\n            }\n            partsPerModel={\n              showCorrect\n                ? model.partsPerModel\n                : model.allowedStudentConfig\n                ? session.answers.partsPerModel\n                : model.partsPerModel\n            }\n            showLabel={model.showGraphLabels}\n            onChange={this.onResponseChange}\n          ></FractionModelChart>\n\n          <AlertDialog\n            open={answerChangeDialog.open}\n            title=\"Warning\"\n            text={answerChangeDialog.text}\n            onConfirm={() => {\n              let newSession = this.state.answerChangeDialog.newSession;\n              newSession.answers.response = [];\n              this.setState(\n                () => ({\n                  session: newSession,\n                  answerChangeDialog: { open: false },\n                }),\n                this.callOnSessionChange,\n              );\n            }}\n            onClose={() => {\n              this.setState(\n                (prevState) => ({\n                  session: prevState.answerChangeDialog.oldSession,\n                  answerChangeDialog: { open: false },\n                }),\n                this.callOnSessionChange,\n              );\n            }}\n            onConfirmText={'OK'}\n            onCloseText={'Cancel'}\n          />\n        </div>\n      </UiLayout>\n    );\n  }\n}\n\nconst styles = () => ({\n  previewHeading: {\n    fontWeight: '400',\n    fontSize: '24px',\n    margin: '14px 0',\n  },\n  modelPreview: {\n    padding: '16px',\n  },\n  titleContainer: {\n    textAlign: 'center',\n    fontSize: '20px',\n  },\n});\n\nexport default withStyles(styles)(Main);\n"],"file":"main.js"}
+{"version":3,"file":"main.js","names":["_react","_interopRequireDefault","require","_propTypes","_styles","_answerFraction","_correctAnswerToggle","_fractionModelChart","_configUi","_renderUi","_cloneDeep","ModelPreview","styled","padding","TitleContainer","textAlign","fontSize","Main","React","Component","constructor","props","_defineProperty2","default","onSessionChange","state","session","model","answers","response","allowedStudentConfig","noOfModel","partsPerModel","newAnswers","oldSession","cloneDeep","newSession","length","setState","answerChangeDialog","open","text","callOnSessionChange","show","showCorrect","Math","floor","random","generateAnswers","render","prompt","title","correctness","extraCSSRules","language","showCorrectAnswerToggle","fractionModelChartKey","generateRandomKey","createElement","UiLayout","PreviewPrompt","className","tagName","toggled","onToggle","toggleShowCorrect","disabled","view","onAnswerChange","key","value","correctResponse","modelType","modelTypeSelected","noOfModels","maxModelSelected","showLabel","showGraphLabels","onChange","onResponseChange","AlertDialog","onConfirm","onClose","prevState","onConfirmText","onCloseText","exports","PropTypes","object","func","isRequired","_default"],"sources":["../src/main.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@mui/material/styles';\nimport AnswerFraction from './answer-fraction';\nimport CorrectAnswerToggle from '@pie-lib/correct-answer-toggle';\nimport FractionModelChart from './fraction-model-chart';\nimport { AlertDialog } from '@pie-lib/config-ui';\nimport { PreviewPrompt, UiLayout } from '@pie-lib/render-ui';\nimport cloneDeep from 'lodash/cloneDeep';\n\nconst ModelPreview = styled('div')({\n  padding: '16px',\n});\n\nconst TitleContainer = styled('div')({\n  textAlign: 'center',\n  fontSize: '20px',\n});\n\nexport class Main extends React.Component {\n  static propTypes = {\n    model: PropTypes.object,\n    session: PropTypes.object,\n    onSessionChange: PropTypes.func.isRequired,\n  };\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      session: {\n        ...props.session,\n        answers: (props.session && props.session.answers) || this.generateAnswers(props.model),\n      },\n      showCorrect: false,\n      answerChangeDialog: {\n        open: false,\n        text: '',\n      },\n    };\n    this.callOnSessionChange();\n  }\n\n  /**\n   * Function to trigger when session value change for fraction model\n   */\n  callOnSessionChange = () => {\n    const { onSessionChange } = this.props;\n    if (onSessionChange) {\n      onSessionChange(this.state.session);\n    }\n  };\n\n  /**\n   * Function to generate answers for preview selection\n   * @param {object} model contains model object for fraction model\n   * @returns answer model\n   */\n  generateAnswers = (model) => {\n    const answers = {\n      response: [],\n    };\n    if (model.allowedStudentConfig) {\n      (answers.noOfModel = ''), (answers.partsPerModel = '');\n    }\n    return answers;\n  };\n\n  /**\n   * Function to trigger when answer change from preview\n   * @param {object} newAnswers contains updated answer model\n   */\n  onAnswerChange = (newAnswers) => {\n    let oldSession = cloneDeep(this.state.session);\n    let newSession = {\n      ...this.state.session,\n      answers: newAnswers,\n    };\n    if (newAnswers.response.length > 0) {\n      this.setState({\n        answerChangeDialog: {\n          open: true,\n          oldSession: oldSession,\n          newSession: newSession,\n          text: 'Changing either the Number of Models or Parts per Model will remove added answer. Are you sure you want to continue?',\n        },\n      });\n    } else {\n      this.setState(\n        (state) => ({\n          session: newSession,\n        }),\n        this.callOnSessionChange,\n      );\n    }\n  };\n\n  /*\n   * Function to toggle correct answer\n   * @param {boolean} show contains boolean value to show correct answer\n   * */\n  toggleShowCorrect = (show) => {\n    this.setState({ showCorrect: show });\n  };\n\n  /*\n   * Function to trigger when response change from preview\n   * @param {object} response contains updated response model\n   * */\n  onResponseChange = (response) => {\n    this.setState(\n      (state) => ({\n        session: {\n          ...state.session,\n          answers: {\n            ...state.session.answers,\n            response,\n          },\n        },\n      }),\n      this.callOnSessionChange,\n    );\n  };\n\n  /*\n   * Method to generate random key\n   * */\n  generateRandomKey = () => {\n    return Math.floor(Math.random() * 10000);\n  };\n\n  render() {\n    const { model } = this.props;\n    const { showCorrect, session, answerChangeDialog } = this.state;\n    const { prompt, title, correctness = {}, extraCSSRules, language } = model;\n    const showCorrectAnswerToggle = correctness.correctness && correctness.correctness !== 'correct';\n    const fractionModelChartKey = this.generateRandomKey();\n\n    return (\n      <UiLayout extraCSSRules={extraCSSRules}>\n        <ModelPreview>\n          <TitleContainer>\n            <PreviewPrompt className=\"prompt\" prompt={title} tagName=\"h3\" />\n          </TitleContainer>\n          <PreviewPrompt className=\"prompt\" prompt={prompt} tagName=\"p\" />\n\n          <CorrectAnswerToggle\n            language={language}\n            show={showCorrectAnswerToggle}\n            toggled={showCorrect}\n            onToggle={this.toggleShowCorrect}\n          />\n\n          <AnswerFraction\n            model={model}\n            showCorrect={showCorrect}\n            disabled={model.view}\n            onAnswerChange={this.onAnswerChange}\n            answers={session.answers}\n          />\n\n          <FractionModelChart\n            key={fractionModelChartKey}\n            disabled={model.view}\n            value={showCorrect ? model.correctResponse : session.answers.response}\n            modelType={model.modelTypeSelected}\n            noOfModels={\n              showCorrect\n                ? model.maxModelSelected\n                : model.allowedStudentConfig\n                ? session.answers.noOfModel\n                : model.maxModelSelected\n            }\n            partsPerModel={\n              showCorrect\n                ? model.partsPerModel\n                : model.allowedStudentConfig\n                ? session.answers.partsPerModel\n                : model.partsPerModel\n            }\n            showLabel={model.showGraphLabels}\n            onChange={this.onResponseChange}\n          ></FractionModelChart>\n\n          <AlertDialog\n            open={answerChangeDialog.open}\n            title=\"Warning\"\n            text={answerChangeDialog.text}\n            onConfirm={() => {\n              let newSession = this.state.answerChangeDialog.newSession;\n              newSession.answers.response = [];\n              this.setState(\n                () => ({\n                  session: newSession,\n                  answerChangeDialog: { open: false },\n                }),\n                this.callOnSessionChange,\n              );\n            }}\n            onClose={() => {\n              this.setState(\n                (prevState) => ({\n                  session: prevState.answerChangeDialog.oldSession,\n                  answerChangeDialog: { open: false },\n                }),\n                this.callOnSessionChange,\n              );\n            }}\n            onConfirmText={'OK'}\n            onCloseText={'Cancel'}\n          />\n        </ModelPreview>\n      </UiLayout>\n    );\n  }\n}\n\nexport default Main;\n"],"mappings":"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","ignoreList":[]}

package/package.json

@@ -4,30 +4,30 @@
     "access": "public"
   },
   "repository": "pie-framework/pie-elements",
-  "version": "4.3.4-next.0+bb17c7e0a",
+  "version": "5.0.0-beta.0",
   "description": "",
   "dependencies": {
-    "@material-ui/core": "^3.9.2",
+    "@emotion/react": "^11.14.0",
+    "@emotion/style": "^0.8.0",
+    "@mui/icons-material": "^7.3.4",
+    "@mui/material": "^7.3.4",
     "@pie-framework/pie-player-events": "^0.1.0",
-    "@pie-lib/config-ui": "11.30.2",
-    "@pie-lib/correct-answer-toggle": "2.25.2",
-    "@pie-lib/math-rendering": "3.22.1",
-    "@pie-lib/render-ui": "4.35.2",
-    "@pie-lib/test-utils": "0.22.1",
+    "@pie-lib/config-ui": "11.30.4-next.0",
+    "@pie-lib/correct-answer-toggle": "2.25.4-next.0",
+    "@pie-lib/math-rendering": "3.22.3-next.0",
+    "@pie-lib/render-ui": "4.35.4-next.0",
+    "@pie-lib/test-utils": "0.22.3-next.0",
     "prop-types": "^15.6.1",
-    "react": "^16.8.1",
-    "react-dom": "^16.8.1",
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
     "recharts": "2.15.1"
   },
   "author": "",
   "license": "ISC",
-  "gitHead": "bb17c7e0a54b6b5ff139075cccf1e341cc6f859f",
+  "gitHead": "f63dcdd0432cb3ab6f6c6887b362381472247628",
   "scripts": {
     "postpublish": "../../scripts/postpublish"
   },
   "main": "lib/index.js",
-  "module": "src/index.js",
-  "exports": {
-    ".": "./src/index.js"
-  }
+  "module": "src/index.js"
 }