@pie-element/categorize 7.4.1-next.3 → 7.4.1-next.42

package/configure/lib/design/categories/index.js

@@ -145,8 +145,13 @@ var Categories = /*#__PURE__*/function (_React$Component) {
     }
 
     _this = _super.call.apply(_super, [this].concat(args));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
+      focusedEl: null
+    });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "add", function () {
-      var model = _this.props.model;
+      var _this$props = _this.props,
+          model = _this$props.model,
+          oldCategories = _this$props.categories;
       var categoriesPerRow = model.categoriesPerRow;
 
       var id = _configUi.choiceUtils.firstAvailableIndex(model.categories.map(function (a) {
@@ -164,15 +169,24 @@ var Categories = /*#__PURE__*/function (_React$Component) {
         rowLabels.push('');
       }
 
-      _this.props.onModelChanged({
-        rowLabels: rowLabels,
-        categories: model.categories.concat([data])
+      _this.setState({
+        focusedEl: oldCategories.length
+      }, function () {
+        _this.props.onModelChanged({
+          rowLabels: rowLabels,
+          categories: model.categories.concat([data])
+        });
+      });
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "deleteFocusedEl", function () {
+      _this.setState({
+        focusedEl: null
       });
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "delete", function (category) {
-      var _this$props = _this.props,
-          model = _this$props.model,
-          onModelChanged = _this$props.onModelChanged;
+      var _this$props2 = _this.props,
+          model = _this$props2.model,
+          onModelChanged = _this$props2.onModelChanged;
       var index = model.categories.findIndex(function (a) {
         return a.id === category.id;
       });
@@ -198,23 +212,51 @@ var Categories = /*#__PURE__*/function (_React$Component) {
       }
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "addChoiceToCategory", function (choice, categoryId) {
-      var _this$props2 = _this.props,
-          model = _this$props2.model,
-          onModelChanged = _this$props2.onModelChanged;
+      var _this$props3 = _this.props,
+          model = _this$props3.model,
+          onModelChanged = _this$props3.onModelChanged;
       var correctResponse = (0, _categorize.moveChoiceToCategory)(choice.id, undefined, categoryId, 0, model.correctResponse);
       onModelChanged({
         correctResponse: correctResponse
       });
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "deleteChoiceFromCategory", function (category, choice, choiceIndex) {
-      var _this$props3 = _this.props,
-          model = _this$props3.model,
-          onModelChanged = _this$props3.onModelChanged;
+      var _this$props4 = _this.props,
+          model = _this$props4.model,
+          onModelChanged = _this$props4.onModelChanged;
       var correctResponse = (0, _categorize.removeChoiceFromCategory)(choice.id, category.id, choiceIndex, model.correctResponse);
       onModelChanged({
         correctResponse: correctResponse
       });
     });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "moveChoice", function (choiceId, from, to, choiceIndex) {
+      var _this$props5 = _this.props,
+          model = _this$props5.model,
+          onModelChanged = _this$props5.onModelChanged;
+
+      var _ref2 = model || {},
+          choices = _ref2.choices,
+          _ref2$correctResponse = _ref2.correctResponse,
+          correctResponse = _ref2$correctResponse === void 0 ? [] : _ref2$correctResponse;
+
+      var choice = (choices || []).find(function (choice) {
+        return choice.id === choiceId;
+      });
+
+      if (to === from || !choice) {
+        return;
+      }
+
+      if (choice.categoryCount !== 0) {
+        correctResponse = (0, _categorize.moveChoiceToCategory)(choice.id, from, to, choiceIndex, correctResponse);
+      } else if (choice.categoryCount === 0) {
+        correctResponse = (0, _categorize.moveChoiceToCategory)(choice.id, undefined, to, 0, correctResponse);
+      }
+
+      onModelChanged({
+        correctResponse: correctResponse
+      });
+    });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "changeRowLabel", function (val, index) {
       var model = _this.props.model;
       var rowLabels = model.rowLabels;
@@ -238,33 +280,33 @@ var Categories = /*#__PURE__*/function (_React$Component) {
     value: function render() {
       var _this2 = this;
 
-      var _this$props4 = this.props,
-          model = _this$props4.model,
-          classes = _this$props4.classes,
-          className = _this$props4.className,
-          categories = _this$props4.categories,
-          imageSupport = _this$props4.imageSupport,
-          uploadSoundSupport = _this$props4.uploadSoundSupport,
-          toolbarOpts = _this$props4.toolbarOpts,
-          spellCheck = _this$props4.spellCheck,
-          configuration = _this$props4.configuration,
-          defaultImageMaxHeight = _this$props4.defaultImageMaxHeight,
-          defaultImageMaxWidth = _this$props4.defaultImageMaxWidth;
+      var _this$props6 = this.props,
+          model = _this$props6.model,
+          classes = _this$props6.classes,
+          className = _this$props6.className,
+          categories = _this$props6.categories,
+          imageSupport = _this$props6.imageSupport,
+          uploadSoundSupport = _this$props6.uploadSoundSupport,
+          toolbarOpts = _this$props6.toolbarOpts,
+          spellCheck = _this$props6.spellCheck,
+          configuration = _this$props6.configuration,
+          defaultImageMaxHeight = _this$props6.defaultImageMaxHeight,
+          defaultImageMaxWidth = _this$props6.defaultImageMaxWidth;
       var categoriesPerRow = model.categoriesPerRow,
           rowLabels = model.rowLabels,
           errors = model.errors;
 
-      var _ref2 = errors || {},
-          associationError = _ref2.associationError,
-          categoriesError = _ref2.categoriesError,
-          categoriesErrors = _ref2.categoriesErrors;
+      var _ref3 = errors || {},
+          associationError = _ref3.associationError,
+          categoriesError = _ref3.categoriesError,
+          categoriesErrors = _ref3.categoriesErrors;
 
-      var _ref3 = configuration || {},
-          maxCategories = _ref3.maxCategories,
-          _ref3$maxImageWidth = _ref3.maxImageWidth,
-          maxImageWidth = _ref3$maxImageWidth === void 0 ? {} : _ref3$maxImageWidth,
-          _ref3$maxImageHeight = _ref3.maxImageHeight,
-          maxImageHeight = _ref3$maxImageHeight === void 0 ? {} : _ref3$maxImageHeight;
+      var _ref4 = configuration || {},
+          maxCategories = _ref4.maxCategories,
+          _ref4$maxImageWidth = _ref4.maxImageWidth,
+          maxImageWidth = _ref4$maxImageWidth === void 0 ? {} : _ref4$maxImageWidth,
+          _ref4$maxImageHeight = _ref4.maxImageHeight,
+          maxImageHeight = _ref4$maxImageHeight === void 0 ? {} : _ref4$maxImageHeight;
 
       var holderStyle = {
         gridTemplateColumns: "repeat(".concat(categoriesPerRow, ", 1fr)")
@@ -319,6 +361,9 @@ var Categories = /*#__PURE__*/function (_React$Component) {
           uploadSoundSupport: uploadSoundSupport
         }), /*#__PURE__*/_react["default"].createElement(_category["default"], {
           imageSupport: imageSupport,
+          focusedEl: _this2.state.focusedEl,
+          deleteFocusedEl: _this2.deleteFocusedEl,
+          index: index,
           category: category,
           error: categoriesErrors && categoriesErrors[category.id],
           onChange: _this2.change,
@@ -326,6 +371,9 @@ var Categories = /*#__PURE__*/function (_React$Component) {
             return _this2["delete"](category);
           },
           onAddChoice: _this2.addChoiceToCategory,
+          onMoveChoice: function onMoveChoice(choiceId, from, to, choiceIndex) {
+            return _this2.moveChoice(choiceId, from, to, choiceIndex);
+          },
           toolbarOpts: toolbarOpts,
           spellCheck: spellCheck,
           onDeleteChoice: function onDeleteChoice(choice, choiceIndex) {

package/configure/lib/design/categories/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/design/categories/index.jsx"],"names":["styles","theme","categories","marginBottom","spacing","unit","categoriesHolder","display","gridRowGap","gridColumnGap","row","gridTemplateColumns","alignItems","width","marginTop","rowLabel","gridColumn","rowLabelHolder","tooltip","fontSize","whiteSpace","maxWidth","errorText","color","padding","RowLabel","categoriesPerRow","classes","markup","imageSupport","onChange","toolbarOpts","spellCheck","maxImageWidth","maxImageHeight","uploadSoundSupport","text","language","Categories","model","props","id","utils","firstAvailableIndex","map","a","data","label","addRowLabel","length","rowLabels","push","onModelChanged","concat","category","index","findIndex","splice","correctResponse","c","choice","categoryId","undefined","choiceIndex","val","newRowLabels","className","configuration","defaultImageMaxHeight","defaultImageMaxWidth","errors","associationError","categoriesError","categoriesErrors","maxCategories","holderStyle","validationMessage","add","marginLeft","hasRowLabel","rowIndex","changeRowLabel","change","addChoiceToCategory","deleteChoiceFromCategory","categoryLabel","React","Component","PropTypes","shape","func","isRequired","object","string","array"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport TextField from '@material-ui/core/TextField';\nimport Typography from '@material-ui/core/Typography';\nimport { choiceUtils as utils } from '@pie-lib/config-ui';\nimport EditableHtml from '@pie-lib/editable-html';\nimport classNames from 'classnames';\nimport Info from '@material-ui/icons/Info';\nimport Tooltip from '@material-ui/core/Tooltip';\nimport { moveChoiceToCategory, removeCategory, removeChoiceFromCategory } from '@pie-lib/categorize';\n\nimport Category from './category';\nimport Header from '../header';\nimport { generateValidationMessage } from '../../utils';\n\nconst styles = (theme) => ({\n  categories: {\n    marginBottom: theme.spacing.unit,\n  },\n  categoriesHolder: {\n    display: 'grid',\n    gridRowGap: `${theme.spacing.unit}px`,\n    gridColumnGap: `${theme.spacing.unit}px`,\n  },\n  row: {\n    display: 'grid',\n    gridTemplateColumns: 'repeat(2, 1fr)',\n    gridColumnGap: `${theme.spacing.unit}px`,\n    alignItems: 'baseline',\n    width: '100%',\n    marginTop: theme.spacing.unit,\n    marginBottom: 2 * theme.spacing.unit,\n  },\n  rowLabel: {\n    gridColumn: '1/3',\n  },\n  rowLabelHolder: {\n    width: '100%',\n  },\n  tooltip: {\n    fontSize: '12px',\n    whiteSpace: 'pre',\n    maxWidth: '500px',\n  },\n  errorText: {\n    fontSize: '12px',\n    color: 'red',\n    padding: '5px 0',\n  },\n});\n\nconst RowLabel = withStyles(styles)(\n  ({\n    categoriesPerRow,\n    classes,\n    markup,\n    imageSupport,\n    onChange,\n    toolbarOpts,\n    spellCheck,\n    maxImageWidth,\n    maxImageHeight,\n    uploadSoundSupport,\n  }) => {\n    return (\n      <div\n        style={{\n          gridColumn: `1/${categoriesPerRow + 1}`,\n          width: '100%',\n        }}\n      >\n        <Typography className={classes.text}>Row Label</Typography>\n        <EditableHtml\n          className={classes.rowLabelHolder}\n          markup={markup}\n          onChange={onChange}\n          imageSupport={imageSupport}\n          nonEmpty={false}\n          toolbarOpts={toolbarOpts}\n          spellCheck={spellCheck}\n          maxImageWidth={maxImageWidth}\n          maxImageHeight={maxImageHeight}\n          uploadSoundSupport={uploadSoundSupport}\n          languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n        />\n      </div>\n    );\n  },\n);\n\nexport class Categories extends React.Component {\n  static propTypes = {\n    imageSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired,\n    }),\n    uploadSoundSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired,\n    }),\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    categories: PropTypes.array,\n    onModelChanged: PropTypes.func,\n    model: PropTypes.object.isRequired,\n    configuration: PropTypes.object.isRequired,\n    toolbarOpts: PropTypes.object,\n  };\n\n  add = () => {\n    const { model } = this.props;\n    const { categoriesPerRow } = model;\n    const id = utils.firstAvailableIndex(\n      model.categories.map((a) => a.id),\n      0,\n    );\n    const data = { id, label: 'Category ' + id };\n    const addRowLabel = model.categories.length % categoriesPerRow === 0;\n    const rowLabels = [...model.rowLabels];\n\n    if (addRowLabel) {\n      rowLabels.push('');\n    }\n\n    this.props.onModelChanged({\n      rowLabels,\n      categories: model.categories.concat([data]),\n    });\n  };\n\n  delete = (category) => {\n    const { model, onModelChanged } = this.props;\n    const index = model.categories.findIndex((a) => a.id === category.id);\n\n    if (index !== -1) {\n      model.categories.splice(index, 1);\n      model.correctResponse = removeCategory(category.id, model.correctResponse);\n      onModelChanged(model);\n    }\n  };\n\n  change = (c) => {\n    const { categories } = this.props;\n    const index = categories.findIndex((a) => a.id === c.id);\n\n    if (index !== -1) {\n      categories.splice(index, 1, c);\n      this.props.onModelChanged({ categories });\n    }\n  };\n\n  addChoiceToCategory = (choice, categoryId) => {\n    const { model, onModelChanged } = this.props;\n    const correctResponse = moveChoiceToCategory(choice.id, undefined, categoryId, 0, model.correctResponse);\n\n    onModelChanged({ correctResponse });\n  };\n\n  deleteChoiceFromCategory = (category, choice, choiceIndex) => {\n    const { model, onModelChanged } = this.props;\n    const correctResponse = removeChoiceFromCategory(choice.id, category.id, choiceIndex, model.correctResponse);\n\n    onModelChanged({ correctResponse });\n  };\n\n  changeRowLabel = (val, index) => {\n    const { model } = this.props;\n    const { rowLabels } = model;\n    const newRowLabels = [...rowLabels];\n\n    if (newRowLabels.length < index) {\n      newRowLabels.push(val);\n    } else {\n      newRowLabels[index] = val;\n    }\n\n    this.props.onModelChanged({\n      rowLabels: newRowLabels,\n    });\n  };\n\n  render() {\n    const {\n      model,\n      classes,\n      className,\n      categories,\n      imageSupport,\n      uploadSoundSupport,\n      toolbarOpts,\n      spellCheck,\n      configuration,\n      defaultImageMaxHeight,\n      defaultImageMaxWidth,\n    } = this.props;\n\n    const { categoriesPerRow, rowLabels, errors } = model;\n    const { associationError, categoriesError, categoriesErrors } = errors || {};\n    const {\n      maxCategories,\n      maxImageWidth = {},\n      maxImageHeight = {},\n    } = configuration || {};\n    const holderStyle = {\n      gridTemplateColumns: `repeat(${categoriesPerRow}, 1fr)`,\n    };\n\n    const validationMessage = generateValidationMessage(configuration);\n\n    return (\n      <div className={classNames(classes.categories, className)}>\n        <Header\n          label=\"Categories\"\n          buttonLabel=\"ADD A CATEGORY\"\n          onAdd={this.add}\n          info={\n            <Tooltip\n              classes={{ tooltip: classes.tooltip }}\n              disableFocusListener\n              disableTouchListener\n              placement={'right'}\n              title={validationMessage}\n            >\n              <Info fontSize={'small'} color={'primary'} style={{ marginLeft: '5px' }} />\n            </Tooltip>\n          }\n          buttonDisabled={maxCategories && categories && maxCategories === categories.length}\n        />\n        {associationError && <div className={classes.errorText}>{associationError}</div>}\n        {categoriesError && <div className={classes.errorText}>{categoriesError}</div>}\n        <div className={classes.categoriesHolder} style={holderStyle}>\n          {categories.map((category, index) => {\n            const hasRowLabel = index % categoriesPerRow === 0;\n            const rowIndex = index / categoriesPerRow;\n\n            return (\n              <React.Fragment key={index}>\n                {hasRowLabel && (\n                  <RowLabel\n                    categoriesPerRow={categoriesPerRow}\n                    rowIndex={rowIndex}\n                    markup={rowLabels[rowIndex] || ''}\n                    onChange={(val) => this.changeRowLabel(val, rowIndex)}\n                    imageSupport={imageSupport}\n                    toolbarOpts={toolbarOpts}\n                    spellCheck={spellCheck}\n                    maxImageWidth={(maxImageWidth && maxImageWidth.rowLabel) || defaultImageMaxWidth}\n                    maxImageHeight={(maxImageHeight && maxImageHeight.rowLabel) || defaultImageMaxHeight}\n                    uploadSoundSupport={uploadSoundSupport}\n                  />\n                )}\n                <Category\n                  imageSupport={imageSupport}\n                  category={category}\n                  error={categoriesErrors && categoriesErrors[category.id]}\n                  onChange={this.change}\n                  onDelete={() => this.delete(category)}\n                  onAddChoice={this.addChoiceToCategory}\n                  toolbarOpts={toolbarOpts}\n                  spellCheck={spellCheck}\n                  onDeleteChoice={(choice, choiceIndex) => this.deleteChoiceFromCategory(category, choice, choiceIndex)}\n                  maxImageWidth={(maxImageWidth && maxImageWidth.categoryLabel) || defaultImageMaxWidth}\n                  maxImageHeight={(maxImageHeight && maxImageHeight.categoryLabel) || defaultImageMaxHeight}\n                  uploadSoundSupport={uploadSoundSupport}\n                />\n              </React.Fragment>\n            );\n          })}\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default withStyles(styles)(Categories);\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/design/categories/index.jsx"],"names":["styles","theme","categories","marginBottom","spacing","unit","categoriesHolder","display","gridRowGap","gridColumnGap","row","gridTemplateColumns","alignItems","width","marginTop","rowLabel","gridColumn","rowLabelHolder","tooltip","fontSize","whiteSpace","maxWidth","errorText","color","padding","RowLabel","categoriesPerRow","classes","markup","imageSupport","onChange","toolbarOpts","spellCheck","maxImageWidth","maxImageHeight","uploadSoundSupport","text","language","Categories","focusedEl","props","model","oldCategories","id","utils","firstAvailableIndex","map","a","data","label","addRowLabel","length","rowLabels","push","setState","onModelChanged","concat","category","index","findIndex","splice","correctResponse","c","choice","categoryId","undefined","choiceIndex","choiceId","from","to","choices","find","categoryCount","val","newRowLabels","className","configuration","defaultImageMaxHeight","defaultImageMaxWidth","errors","associationError","categoriesError","categoriesErrors","maxCategories","holderStyle","validationMessage","add","marginLeft","hasRowLabel","rowIndex","changeRowLabel","state","deleteFocusedEl","change","addChoiceToCategory","moveChoice","deleteChoiceFromCategory","categoryLabel","React","Component","PropTypes","shape","func","isRequired","object","string","array"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport TextField from '@material-ui/core/TextField';\nimport Typography from '@material-ui/core/Typography';\nimport { choiceUtils as utils } from '@pie-lib/config-ui';\nimport EditableHtml from '@pie-lib/editable-html';\nimport classNames from 'classnames';\nimport Info from '@material-ui/icons/Info';\nimport Tooltip from '@material-ui/core/Tooltip';\nimport {\n  moveChoiceToAlternate,\n  moveChoiceToCategory,\n  removeCategory,\n  removeChoiceFromCategory,\n} from '@pie-lib/categorize';\n\nimport Category from './category';\nimport Header from '../header';\nimport { generateValidationMessage } from '../../utils';\n\nconst styles = (theme) => ({\n  categories: {\n    marginBottom: theme.spacing.unit,\n  },\n  categoriesHolder: {\n    display: 'grid',\n    gridRowGap: `${theme.spacing.unit}px`,\n    gridColumnGap: `${theme.spacing.unit}px`,\n  },\n  row: {\n    display: 'grid',\n    gridTemplateColumns: 'repeat(2, 1fr)',\n    gridColumnGap: `${theme.spacing.unit}px`,\n    alignItems: 'baseline',\n    width: '100%',\n    marginTop: theme.spacing.unit,\n    marginBottom: 2 * theme.spacing.unit,\n  },\n  rowLabel: {\n    gridColumn: '1/3',\n  },\n  rowLabelHolder: {\n    width: '100%',\n  },\n  tooltip: {\n    fontSize: '12px',\n    whiteSpace: 'pre',\n    maxWidth: '500px',\n  },\n  errorText: {\n    fontSize: '12px',\n    color: 'red',\n    padding: '5px 0',\n  },\n});\n\nconst RowLabel = withStyles(styles)(\n  ({\n    categoriesPerRow,\n    classes,\n    markup,\n    imageSupport,\n    onChange,\n    toolbarOpts,\n    spellCheck,\n    maxImageWidth,\n    maxImageHeight,\n    uploadSoundSupport,\n  }) => {\n    return (\n      <div\n        style={{\n          gridColumn: `1/${categoriesPerRow + 1}`,\n          width: '100%',\n        }}\n      >\n        <Typography className={classes.text}>Row Label</Typography>\n        <EditableHtml\n          className={classes.rowLabelHolder}\n          markup={markup}\n          onChange={onChange}\n          imageSupport={imageSupport}\n          nonEmpty={false}\n          toolbarOpts={toolbarOpts}\n          spellCheck={spellCheck}\n          maxImageWidth={maxImageWidth}\n          maxImageHeight={maxImageHeight}\n          uploadSoundSupport={uploadSoundSupport}\n          languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n        />\n      </div>\n    );\n  },\n);\n\nexport class Categories extends React.Component {\n  static propTypes = {\n    imageSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired,\n    }),\n    uploadSoundSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired,\n    }),\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    categories: PropTypes.array,\n    onModelChanged: PropTypes.func,\n    model: PropTypes.object.isRequired,\n    configuration: PropTypes.object.isRequired,\n    toolbarOpts: PropTypes.object,\n  };\n\n  state = {\n    focusedEl: null,\n  };\n\n  add = () => {\n    const { model, categories: oldCategories } = this.props;\n    const { categoriesPerRow } = model;\n    const id = utils.firstAvailableIndex(\n      model.categories.map((a) => a.id),\n      0,\n    );\n    const data = { id, label: 'Category ' + id };\n    const addRowLabel = model.categories.length % categoriesPerRow === 0;\n    const rowLabels = [...model.rowLabels];\n\n    if (addRowLabel) {\n      rowLabels.push('');\n    }\n\n    this.setState(\n      {\n        focusedEl: oldCategories.length,\n      },\n      () => {\n        this.props.onModelChanged({\n          rowLabels,\n          categories: model.categories.concat([data]),\n        });\n      }\n    );\n  };\n\n  deleteFocusedEl = () => {\n    this.setState({\n      focusedEl: null,\n    });\n  };\n\n  delete = (category) => {\n    const { model, onModelChanged } = this.props;\n    const index = model.categories.findIndex((a) => a.id === category.id);\n\n    if (index !== -1) {\n      model.categories.splice(index, 1);\n      model.correctResponse = removeCategory(category.id, model.correctResponse);\n      onModelChanged(model);\n    }\n  };\n\n  change = (c) => {\n    const { categories } = this.props;\n    const index = categories.findIndex((a) => a.id === c.id);\n\n    if (index !== -1) {\n      categories.splice(index, 1, c);\n      this.props.onModelChanged({ categories });\n    }\n  };\n\n  addChoiceToCategory = (choice, categoryId) => {\n    const { model, onModelChanged } = this.props;\n    const correctResponse = moveChoiceToCategory(choice.id, undefined, categoryId, 0, model.correctResponse);\n\n    onModelChanged({ correctResponse });\n  };\n\n  deleteChoiceFromCategory = (category, choice, choiceIndex) => {\n    const { model, onModelChanged } = this.props;\n    const correctResponse = removeChoiceFromCategory(choice.id, category.id, choiceIndex, model.correctResponse);\n\n    onModelChanged({ correctResponse });\n  };\n\n  moveChoice = (choiceId, from, to, choiceIndex) => {\n    const { model, onModelChanged } = this.props;\n    let { choices, correctResponse = [] } = model || {};\n    const choice = (choices || []).find((choice) => choice.id === choiceId);\n    if (to === from || !choice) {\n      return;\n    }\n    if (choice.categoryCount !== 0) {\n      correctResponse = moveChoiceToCategory(choice.id, from, to, choiceIndex, correctResponse);\n    } else if (choice.categoryCount === 0) {\n      correctResponse = moveChoiceToCategory(choice.id, undefined, to, 0, correctResponse);\n    }\n    onModelChanged({ correctResponse });\n  };\n\n  changeRowLabel = (val, index) => {\n    const { model } = this.props;\n    const { rowLabels } = model;\n    const newRowLabels = [...rowLabels];\n\n    if (newRowLabels.length < index) {\n      newRowLabels.push(val);\n    } else {\n      newRowLabels[index] = val;\n    }\n\n    this.props.onModelChanged({\n      rowLabels: newRowLabels,\n    });\n  };\n\n  render() {\n    const {\n      model,\n      classes,\n      className,\n      categories,\n      imageSupport,\n      uploadSoundSupport,\n      toolbarOpts,\n      spellCheck,\n      configuration,\n      defaultImageMaxHeight,\n      defaultImageMaxWidth,\n    } = this.props;\n\n    const { categoriesPerRow, rowLabels, errors } = model;\n    const { associationError, categoriesError, categoriesErrors } = errors || {};\n    const { maxCategories, maxImageWidth = {}, maxImageHeight = {} } = configuration || {};\n    const holderStyle = {\n      gridTemplateColumns: `repeat(${categoriesPerRow}, 1fr)`,\n    };\n\n    const validationMessage = generateValidationMessage(configuration);\n\n    return (\n      <div className={classNames(classes.categories, className)}>\n        <Header\n          label=\"Categories\"\n          buttonLabel=\"ADD A CATEGORY\"\n          onAdd={this.add}\n          info={\n            <Tooltip\n              classes={{ tooltip: classes.tooltip }}\n              disableFocusListener\n              disableTouchListener\n              placement={'right'}\n              title={validationMessage}\n            >\n              <Info fontSize={'small'} color={'primary'} style={{ marginLeft: '5px' }} />\n            </Tooltip>\n          }\n          buttonDisabled={maxCategories && categories && maxCategories === categories.length}\n        />\n        {associationError && <div className={classes.errorText}>{associationError}</div>}\n        {categoriesError && <div className={classes.errorText}>{categoriesError}</div>}\n        <div className={classes.categoriesHolder} style={holderStyle}>\n          {categories.map((category, index) => {\n            const hasRowLabel = index % categoriesPerRow === 0;\n            const rowIndex = index / categoriesPerRow;\n\n            return (\n              <React.Fragment key={index}>\n                {hasRowLabel && (\n                  <RowLabel\n                    categoriesPerRow={categoriesPerRow}\n                    rowIndex={rowIndex}\n                    markup={rowLabels[rowIndex] || ''}\n                    onChange={(val) => this.changeRowLabel(val, rowIndex)}\n                    imageSupport={imageSupport}\n                    toolbarOpts={toolbarOpts}\n                    spellCheck={spellCheck}\n                    maxImageWidth={(maxImageWidth && maxImageWidth.rowLabel) || defaultImageMaxWidth}\n                    maxImageHeight={(maxImageHeight && maxImageHeight.rowLabel) || defaultImageMaxHeight}\n                    uploadSoundSupport={uploadSoundSupport}\n                  />\n                )}\n                <Category\n                  imageSupport={imageSupport}\n                  focusedEl={this.state.focusedEl}\n                  deleteFocusedEl={this.deleteFocusedEl}\n                  index={index}\n                  category={category}\n                  error={categoriesErrors && categoriesErrors[category.id]}\n                  onChange={this.change}\n                  onDelete={() => this.delete(category)}\n                  onAddChoice={this.addChoiceToCategory}\n                  onMoveChoice={(choiceId, from, to, choiceIndex) => this.moveChoice(choiceId, from, to, choiceIndex)}\n                  toolbarOpts={toolbarOpts}\n                  spellCheck={spellCheck}\n                  onDeleteChoice={(choice, choiceIndex) => this.deleteChoiceFromCategory(category, choice, choiceIndex)}\n                  maxImageWidth={(maxImageWidth && maxImageWidth.categoryLabel) || defaultImageMaxWidth}\n                  maxImageHeight={(maxImageHeight && maxImageHeight.categoryLabel) || defaultImageMaxHeight}\n                  uploadSoundSupport={uploadSoundSupport}\n                />\n              </React.Fragment>\n            );\n          })}\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default withStyles(styles)(Categories);\n"],"file":"index.js"}

package/configure/lib/design/choices/choice.js

@@ -114,6 +114,9 @@ var Choice = /*#__PURE__*/function (_React$Component) {
           classes = _this$props3.classes,
           className = _this$props3.className,
           choice = _this$props3.choice,
+          deleteFocusedEl = _this$props3.deleteFocusedEl,
+          focusedEl = _this$props3.focusedEl,
+          index = _this$props3.index,
           onDelete = _this$props3.onDelete,
           connectDragSource = _this$props3.connectDragSource,
           connectDragPreview = _this$props3.connectDragPreview,
@@ -136,6 +139,9 @@ var Choice = /*#__PURE__*/function (_React$Component) {
         color: draggable ? 'primary' : 'disabled'
       })))), connectDragPreview( /*#__PURE__*/_react["default"].createElement("span", null, /*#__PURE__*/_react["default"].createElement(_inputHeader["default"], {
         imageSupport: imageSupport,
+        focusedEl: focusedEl,
+        deleteFocusedEl: deleteFocusedEl,
+        index: index,
         label: choice.content,
         onChange: this.changeContent,
         onDelete: onDelete,
@@ -169,6 +175,9 @@ exports.Choice = Choice;
   classes: _propTypes["default"].object.isRequired,
   className: _propTypes["default"].string,
   choice: _propTypes["default"].object.isRequired,
+  deleteFocusedEl: _propTypes["default"].func,
+  focusedEl: _propTypes["default"].number,
+  index: _propTypes["default"].number,
   onChange: _propTypes["default"].func.isRequired,
   onDelete: _propTypes["default"].func.isRequired,
   connectDragSource: _propTypes["default"].func.isRequired,

package/configure/lib/design/choices/choice.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/design/choices/choice.jsx"],"names":["log","canDrag","props","count","choice","categoryCount","correctResponseCount","Choice","content","onChange","allowMultiplePlacements","multiplePlacements","perChoice","classes","className","onDelete","connectDragSource","connectDragPreview","imageSupport","spellCheck","toolbarOpts","error","maxImageWidth","maxImageHeight","uploadSoundSupport","draggable","showRemoveAfterPlacing","isCheckboxShown","actions","dragHandle","dragDisabled","changeContent","errorText","changeCategoryCount","React","Component","PropTypes","string","object","isRequired","func","number","shape","add","styles","theme","padding","justifyContent","spacing","unit","overflow","cursor","fontSize","color","paddingBottom","StyledChoice","spec","beginDrag","out","id","endDrag","monitor","didDrop","item","getItem","categoryId","onRemoveChoice","DraggableChoice","uid","connect","dragSource","dragPreview","isDragging","withUid"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\nimport Card from '@material-ui/core/Card';\nimport CardActions from '@material-ui/core/CardActions';\nimport InputHeader from '../input-header';\nimport { Checkbox } from '@pie-lib/config-ui';\nimport { DeleteButton } from '../buttons';\nimport DragHandle from '@material-ui/icons/DragHandle';\nimport { DragSource } from 'react-dnd';\nimport debug from 'debug';\nimport { uid } from '@pie-lib/drag';\nimport { multiplePlacements } from '../../utils';\n\nconst log = debug('@pie-element:categorize:configure:choice');\n\nconst canDrag = (props) => {\n  const count = props.choice.categoryCount || 0;\n  if (count === 0) {\n    return true;\n  } else {\n    return props.correctResponseCount < count;\n  }\n};\n\nexport class Choice extends React.Component {\n  static propTypes = {\n    allowMultiplePlacements: PropTypes.string,\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    choice: PropTypes.object.isRequired,\n    onChange: PropTypes.func.isRequired,\n    onDelete: PropTypes.func.isRequired,\n    connectDragSource: PropTypes.func.isRequired,\n    connectDragPreview: PropTypes.func.isRequired,\n    correctResponseCount: PropTypes.number.isRequired,\n    imageSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired,\n    }),\n    toolbarOpts: PropTypes.object,\n    error: PropTypes.string,\n    uploadSoundSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired,\n    }),\n  };\n\n  static defaultProps = {};\n\n  changeContent = (content) => {\n    const { onChange, choice } = this.props;\n    choice.content = content;\n    onChange(choice);\n  };\n\n  changeCategoryCount = () => {\n    const { onChange, choice } = this.props;\n    if (choice.categoryCount === 1) {\n      choice.categoryCount = 0;\n    } else {\n      choice.categoryCount = 1;\n    }\n    onChange(choice);\n  };\n\n  isCheckboxShown = (allowMultiplePlacements) => allowMultiplePlacements === multiplePlacements.perChoice;\n\n  render() {\n    const {\n      allowMultiplePlacements,\n      classes,\n      className,\n      choice,\n      onDelete,\n      connectDragSource,\n      connectDragPreview,\n      imageSupport,\n      spellCheck,\n      toolbarOpts,\n      error,\n      maxImageWidth,\n      maxImageHeight,\n      uploadSoundSupport,\n    } = this.props;\n\n    const draggable = canDrag(this.props);\n\n    const showRemoveAfterPlacing = this.isCheckboxShown(allowMultiplePlacements);\n\n    return (\n      <Card className={classNames(classes.choice, className)}>\n        <CardActions className={classes.actions}>\n          {connectDragSource(\n            <span className={classNames(classes.dragHandle, draggable === false && classes.dragDisabled)}>\n              <DragHandle color={draggable ? 'primary' : 'disabled'} />\n            </span>,\n          )}\n        </CardActions>\n        {connectDragPreview(\n          <span>\n            <InputHeader\n              imageSupport={imageSupport}\n              label={choice.content}\n              onChange={this.changeContent}\n              onDelete={onDelete}\n              toolbarOpts={toolbarOpts}\n              spellCheck={spellCheck}\n              error={error}\n              maxImageWidth={maxImageWidth}\n              maxImageHeight={maxImageHeight}\n              uploadSoundSupport={uploadSoundSupport}\n            />\n            {error && <div className={classes.errorText}>{error}</div>}\n          </span>,\n        )}\n\n        <CardActions className={classes.actions}>\n          <DeleteButton label={'delete'} onClick={onDelete} />\n          {showRemoveAfterPlacing && (\n            <Checkbox\n              mini\n              label={'Remove after placing'}\n              checked={choice.categoryCount === 1}\n              onChange={this.changeCategoryCount}\n            />\n          )}\n        </CardActions>\n      </Card>\n    );\n  }\n}\nconst styles = (theme) => ({\n  actions: {\n    padding: 0,\n    justifyContent: 'space-between',\n  },\n  choice: {\n    padding: theme.spacing.unit,\n    overflow: 'visible',\n  },\n  dragHandle: {\n    cursor: 'move',\n  },\n  dragDisabled: {\n    cursor: 'inherit',\n  },\n  errorText: {\n    fontSize: '11px',\n    color: 'red',\n    paddingBottom: '5px',\n  },\n});\n\nconst StyledChoice = withStyles(styles)(Choice);\n\nexport const spec = {\n  canDrag,\n  beginDrag: (props) => {\n    const out = {\n      id: props.choice.id,\n    };\n    log('[beginDrag] out:', out);\n    return out;\n  },\n  endDrag: (props, monitor) => {\n    if (!monitor.didDrop()) {\n      const item = monitor.getItem();\n      if (item.categoryId) {\n        log('wasnt droppped - what to do?');\n        props.onRemoveChoice(item);\n      }\n    }\n  },\n};\n\nconst DraggableChoice = DragSource(\n  ({ uid }) => uid,\n  spec,\n  (connect, monitor) => ({\n    connectDragSource: connect.dragSource(),\n    connectDragPreview: connect.dragPreview(),\n    isDragging: monitor.isDragging(),\n  }),\n)(StyledChoice);\n\nexport default uid.withUid(DraggableChoice);\n"],"file":"choice.js"}
+{"version":3,"sources":["../../../src/design/choices/choice.jsx"],"names":["log","canDrag","props","count","choice","categoryCount","correctResponseCount","Choice","content","onChange","allowMultiplePlacements","multiplePlacements","perChoice","classes","className","deleteFocusedEl","focusedEl","index","onDelete","connectDragSource","connectDragPreview","imageSupport","spellCheck","toolbarOpts","error","maxImageWidth","maxImageHeight","uploadSoundSupport","draggable","showRemoveAfterPlacing","isCheckboxShown","actions","dragHandle","dragDisabled","changeContent","errorText","changeCategoryCount","React","Component","PropTypes","string","object","isRequired","func","number","shape","add","styles","theme","padding","justifyContent","spacing","unit","overflow","cursor","fontSize","color","paddingBottom","StyledChoice","spec","beginDrag","out","id","endDrag","monitor","didDrop","item","getItem","categoryId","onRemoveChoice","DraggableChoice","uid","connect","dragSource","dragPreview","isDragging","withUid"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\nimport Card from '@material-ui/core/Card';\nimport CardActions from '@material-ui/core/CardActions';\nimport InputHeader from '../input-header';\nimport { Checkbox } from '@pie-lib/config-ui';\nimport { DeleteButton } from '../buttons';\nimport DragHandle from '@material-ui/icons/DragHandle';\nimport { DragSource } from 'react-dnd';\nimport debug from 'debug';\nimport { uid } from '@pie-lib/drag';\nimport { multiplePlacements } from '../../utils';\n\nconst log = debug('@pie-element:categorize:configure:choice');\n\nconst canDrag = (props) => {\n  const count = props.choice.categoryCount || 0;\n  if (count === 0) {\n    return true;\n  } else {\n    return props.correctResponseCount < count;\n  }\n};\n\nexport class Choice extends React.Component {\n  static propTypes = {\n    allowMultiplePlacements: PropTypes.string,\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    choice: PropTypes.object.isRequired,\n    deleteFocusedEl: PropTypes.func,\n    focusedEl: PropTypes.number,\n    index: PropTypes.number,\n    onChange: PropTypes.func.isRequired,\n    onDelete: PropTypes.func.isRequired,\n    connectDragSource: PropTypes.func.isRequired,\n    connectDragPreview: PropTypes.func.isRequired,\n    correctResponseCount: PropTypes.number.isRequired,\n    imageSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired,\n    }),\n    toolbarOpts: PropTypes.object,\n    error: PropTypes.string,\n    uploadSoundSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired,\n    }),\n  };\n\n  static defaultProps = {};\n\n  changeContent = (content) => {\n    const { onChange, choice } = this.props;\n    choice.content = content;\n    onChange(choice);\n  };\n\n  changeCategoryCount = () => {\n    const { onChange, choice } = this.props;\n    if (choice.categoryCount === 1) {\n      choice.categoryCount = 0;\n    } else {\n      choice.categoryCount = 1;\n    }\n    onChange(choice);\n  };\n\n  isCheckboxShown = (allowMultiplePlacements) => allowMultiplePlacements === multiplePlacements.perChoice;\n\n  render() {\n    const {\n      allowMultiplePlacements,\n      classes,\n      className,\n      choice,\n      deleteFocusedEl,\n      focusedEl,\n      index,\n      onDelete,\n      connectDragSource,\n      connectDragPreview,\n      imageSupport,\n      spellCheck,\n      toolbarOpts,\n      error,\n      maxImageWidth,\n      maxImageHeight,\n      uploadSoundSupport,\n    } = this.props;\n\n    const draggable = canDrag(this.props);\n\n    const showRemoveAfterPlacing = this.isCheckboxShown(allowMultiplePlacements);\n\n    return (\n      <Card className={classNames(classes.choice, className)}>\n        <CardActions className={classes.actions}>\n          {connectDragSource(\n            <span className={classNames(classes.dragHandle, draggable === false && classes.dragDisabled)}>\n              <DragHandle color={draggable ? 'primary' : 'disabled'} />\n            </span>,\n          )}\n        </CardActions>\n        {connectDragPreview(\n          <span>\n            <InputHeader\n              imageSupport={imageSupport}\n              focusedEl={focusedEl}\n              deleteFocusedEl={deleteFocusedEl}\n              index={index}\n              label={choice.content}\n              onChange={this.changeContent}\n              onDelete={onDelete}\n              toolbarOpts={toolbarOpts}\n              spellCheck={spellCheck}\n              error={error}\n              maxImageWidth={maxImageWidth}\n              maxImageHeight={maxImageHeight}\n              uploadSoundSupport={uploadSoundSupport}\n            />\n            {error && <div className={classes.errorText}>{error}</div>}\n          </span>,\n        )}\n\n        <CardActions className={classes.actions}>\n          <DeleteButton label={'delete'} onClick={onDelete} />\n          {showRemoveAfterPlacing && (\n            <Checkbox\n              mini\n              label={'Remove after placing'}\n              checked={choice.categoryCount === 1}\n              onChange={this.changeCategoryCount}\n            />\n          )}\n        </CardActions>\n      </Card>\n    );\n  }\n}\nconst styles = (theme) => ({\n  actions: {\n    padding: 0,\n    justifyContent: 'space-between',\n  },\n  choice: {\n    padding: theme.spacing.unit,\n    overflow: 'visible',\n  },\n  dragHandle: {\n    cursor: 'move',\n  },\n  dragDisabled: {\n    cursor: 'inherit',\n  },\n  errorText: {\n    fontSize: '11px',\n    color: 'red',\n    paddingBottom: '5px',\n  },\n});\n\nconst StyledChoice = withStyles(styles)(Choice);\n\nexport const spec = {\n  canDrag,\n  beginDrag: (props) => {\n    const out = {\n      id: props.choice.id,\n    };\n    log('[beginDrag] out:', out);\n    return out;\n  },\n  endDrag: (props, monitor) => {\n    if (!monitor.didDrop()) {\n      const item = monitor.getItem();\n      if (item.categoryId) {\n        log('wasnt droppped - what to do?');\n        props.onRemoveChoice(item);\n      }\n    }\n  },\n};\n\nconst DraggableChoice = DragSource(\n  ({ uid }) => uid,\n  spec,\n  (connect, monitor) => ({\n    connectDragSource: connect.dragSource(),\n    connectDragPreview: connect.dragPreview(),\n    isDragging: monitor.isDragging(),\n  }),\n)(StyledChoice);\n\nexport default uid.withUid(DraggableChoice);\n"],"file":"choice.js"}

package/configure/lib/design/choices/index.js

@@ -62,6 +62,9 @@ var Choices = /*#__PURE__*/function (_React$Component) {
     }
 
     _this = _super.call.apply(_super, [this].concat(args));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
+      focusedEl: null
+    });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "changeChoice", function (choice) {
       var _this$props = _this.props,
           choices = _this$props.choices,
@@ -86,7 +89,8 @@ var Choices = /*#__PURE__*/function (_React$Component) {
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "addChoice", function () {
       var _this$props2 = _this.props,
           onModelChanged = _this$props2.onModelChanged,
-          model = _this$props2.model;
+          model = _this$props2.model,
+          oldChoices = _this$props2.choices;
 
       var id = _configUi.choiceUtils.firstAvailableIndex(model.choices.map(function (a) {
         return a.id;
@@ -96,8 +100,18 @@ var Choices = /*#__PURE__*/function (_React$Component) {
         id: id,
         content: 'Choice ' + id
       };
-      onModelChanged({
-        choices: model.choices.concat([data])
+
+      _this.setState({
+        focusedEl: oldChoices.length
+      }, function () {
+        onModelChanged({
+          choices: model.choices.concat([data])
+        });
+      });
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "deleteFocusedEl", function () {
+      _this.setState({
+        focusedEl: null
       });
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "deleteChoice", function (choice) {
@@ -122,6 +136,7 @@ var Choices = /*#__PURE__*/function (_React$Component) {
     value: function render() {
       var _this2 = this;
 
+      var focusedEl = this.state.focusedEl;
       var _this$props4 = this.props,
           classes = _this$props4.classes,
           className = _this$props4.className,
@@ -172,8 +187,11 @@ var Choices = /*#__PURE__*/function (_React$Component) {
       }, choices.map(function (h, index) {
         return /*#__PURE__*/_react["default"].createElement(_choice["default"], {
           choice: h,
+          focusedEl: focusedEl,
+          deleteFocusedEl: _this2.deleteFocusedEl,
           correctResponseCount: h.correctResponseCount,
           allowMultiplePlacements: allowMultiplePlacementsEnabled,
+          index: index,
           key: index,
           imageSupport: imageSupport,
           onChange: _this2.changeChoice,

package/configure/lib/design/choices/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/design/choices/index.jsx"],"names":["Choices","choice","props","choices","onModelChanged","index","findIndex","h","id","splice","count","c","categoryCount","model","utils","firstAvailableIndex","map","a","data","content","concat","correctResponse","classes","className","imageSupport","uploadSoundSupport","spellCheck","toolbarOpts","configuration","defaultImageMaxWidth","defaultImageMaxHeight","errors","allowMultiplePlacementsEnabled","choicesError","choicesErrors","maxChoices","maxImageWidth","maxImageHeight","categoryCountIsOne","allChoicesHaveCount","choiceHolderStyle","gridTemplateColumns","categoriesPerRow","addChoice","length","errorText","choiceHolder","correctResponseCount","changeChoice","deleteChoice","React","Component","PropTypes","object","isRequired","string","array","func","shape","add","styles","theme","paddingTop","spacing","unit","paddingBottom","display","gridRowGap","gridColumnGap","label","fontSize","color","padding"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport { Divider } from '../buttons';\nimport classNames from 'classnames';\nimport Choice from './choice';\nimport Header from '../header';\nimport every from 'lodash/every';\nimport Config from './config';\nimport { choiceUtils as utils } from '@pie-lib/config-ui';\nimport { removeAllChoices } from '@pie-lib/categorize';\n\nexport class Choices extends React.Component {\n  static propTypes = {\n    model: PropTypes.object.isRequired,\n    configuration: PropTypes.object.isRequired,\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    choices: PropTypes.array.isRequired,\n    onModelChanged: PropTypes.func.isRequired,\n    imageSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired,\n    }),\n    uploadSoundSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired,\n    }),\n    toolbarOpts: PropTypes.object,\n  };\n\n  static defaultProps = {};\n\n  changeChoice = (choice) => {\n    const { choices, onModelChanged } = this.props;\n    const index = choices.findIndex((h) => h.id === choice.id);\n    if (index !== -1) {\n      choices.splice(index, 1, choice);\n      onModelChanged({ choices });\n    }\n  };\n\n  allChoicesHaveCount = (count) => {\n    const { choices } = this.props;\n    return every(choices, (c) => c.categoryCount === count);\n  };\n\n  addChoice = () => {\n    const { onModelChanged, model } = this.props;\n\n    const id = utils.firstAvailableIndex(\n      model.choices.map((a) => a.id),\n      0,\n    );\n    const data = { id, content: 'Choice ' + id };\n\n    onModelChanged({ choices: model.choices.concat([data]) });\n  };\n\n  deleteChoice = (choice) => {\n    const { model, onModelChanged } = this.props;\n    const index = model.choices.findIndex((a) => a.id === choice.id);\n    if (index !== -1) {\n      model.choices.splice(index, 1);\n      model.correctResponse = removeAllChoices(choice.id, model.correctResponse);\n      onModelChanged(model);\n    }\n  };\n\n  render() {\n    const {\n      classes,\n      className,\n      choices,\n      model,\n      imageSupport,\n      uploadSoundSupport,\n      onModelChanged,\n      spellCheck,\n      toolbarOpts,\n      configuration,\n      defaultImageMaxWidth,\n      defaultImageMaxHeight,\n    } = this.props;\n    const { errors, allowMultiplePlacementsEnabled } = model;\n    const { choicesError, choicesErrors } = errors || {};\n    const { maxChoices, maxImageWidth = {}, maxImageHeight = {} } = configuration || {};\n\n    const categoryCountIsOne = this.allChoicesHaveCount(1);\n    const choiceHolderStyle = {\n      gridTemplateColumns: `repeat(${model.categoriesPerRow}, 1fr)`,\n    };\n\n    return (\n      <div className={classNames(classes.choices, className)}>\n        <Header\n          label=\"Choices\"\n          buttonLabel=\"ADD A CHOICE\"\n          onAdd={this.addChoice}\n          buttonDisabled={maxChoices && choices && maxChoices === choices.length}\n        />\n        {choicesError && <div className={classes.errorText}>{choicesError}</div>}\n        <Config\n          config={model}\n          onModelChanged={onModelChanged}\n          spellCheck={spellCheck}\n        />\n        <div className={classes.choiceHolder} style={choiceHolderStyle}>\n          {choices.map((h, index) => (\n            <Choice\n              choice={h}\n              correctResponseCount={h.correctResponseCount}\n              allowMultiplePlacements={allowMultiplePlacementsEnabled}\n              key={index}\n              imageSupport={imageSupport}\n              onChange={this.changeChoice}\n              onDelete={() => this.deleteChoice(h)}\n              toolbarOpts={toolbarOpts}\n              spellCheck={spellCheck}\n              error={choicesErrors && choicesErrors[h.id]}\n              maxImageWidth={(maxImageWidth && maxImageWidth.choice) || defaultImageMaxWidth}\n              maxImageHeight={(maxImageHeight && maxImageHeight.choice) || defaultImageMaxHeight}\n              uploadSoundSupport={uploadSoundSupport}\n            />\n          ))}\n        </div>\n        <Divider />\n      </div>\n    );\n  }\n}\nconst styles = (theme) => ({\n  choiceHolder: {\n    paddingTop: theme.spacing.unit,\n    paddingBottom: theme.spacing.unit,\n    display: 'grid',\n    gridRowGap: `${theme.spacing.unit}px`,\n    gridColumnGap: `${theme.spacing.unit}px`,\n  },\n  choices: {\n    paddingTop: theme.spacing.unit * 2,\n    paddingBottom: theme.spacing.unit * 2,\n  },\n  label: {},\n  errorText: {\n    fontSize: '12px',\n    color: 'red',\n    padding: '5px 0',\n  },\n});\nexport default withStyles(styles)(Choices);\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/design/choices/index.jsx"],"names":["Choices","focusedEl","choice","props","choices","onModelChanged","index","findIndex","h","id","splice","count","c","categoryCount","model","oldChoices","utils","firstAvailableIndex","map","a","data","content","setState","length","concat","correctResponse","state","classes","className","imageSupport","uploadSoundSupport","spellCheck","toolbarOpts","configuration","defaultImageMaxWidth","defaultImageMaxHeight","errors","allowMultiplePlacementsEnabled","choicesError","choicesErrors","maxChoices","maxImageWidth","maxImageHeight","categoryCountIsOne","allChoicesHaveCount","choiceHolderStyle","gridTemplateColumns","categoriesPerRow","addChoice","errorText","choiceHolder","deleteFocusedEl","correctResponseCount","changeChoice","deleteChoice","React","Component","PropTypes","object","isRequired","string","array","func","shape","add","styles","theme","paddingTop","spacing","unit","paddingBottom","display","gridRowGap","gridColumnGap","label","fontSize","color","padding"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport { Divider } from '../buttons';\nimport classNames from 'classnames';\nimport Choice from './choice';\nimport Header from '../header';\nimport every from 'lodash/every';\nimport Config from './config';\nimport { choiceUtils as utils } from '@pie-lib/config-ui';\nimport { removeAllChoices } from '@pie-lib/categorize';\n\nexport class Choices extends React.Component {\n  static propTypes = {\n    model: PropTypes.object.isRequired,\n    configuration: PropTypes.object.isRequired,\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    choices: PropTypes.array.isRequired,\n    onModelChanged: PropTypes.func.isRequired,\n    imageSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired,\n    }),\n    uploadSoundSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired,\n    }),\n    toolbarOpts: PropTypes.object,\n  };\n\n  static defaultProps = {};\n\n  state = {\n    focusedEl: null,\n  };\n\n  changeChoice = (choice) => {\n    const { choices, onModelChanged } = this.props;\n    const index = choices.findIndex((h) => h.id === choice.id);\n    if (index !== -1) {\n      choices.splice(index, 1, choice);\n      onModelChanged({ choices });\n    }\n  };\n\n  allChoicesHaveCount = (count) => {\n    const { choices } = this.props;\n    return every(choices, (c) => c.categoryCount === count);\n  };\n\n  addChoice = () => {\n    const { onModelChanged, model, choices: oldChoices } = this.props;\n\n    const id = utils.firstAvailableIndex(\n      model.choices.map((a) => a.id),\n      0,\n    );\n    const data = { id, content: 'Choice ' + id };\n\n    this.setState(\n      {\n        focusedEl: oldChoices.length,\n      },\n      () => {\n        onModelChanged({ choices: model.choices.concat([data]) });\n      }\n    );\n  };\n\n  deleteFocusedEl = () => {\n    this.setState({\n      focusedEl: null,\n    });\n  };\n\n  deleteChoice = (choice) => {\n    const { model, onModelChanged } = this.props;\n    const index = model.choices.findIndex((a) => a.id === choice.id);\n    if (index !== -1) {\n      model.choices.splice(index, 1);\n      model.correctResponse = removeAllChoices(choice.id, model.correctResponse);\n      onModelChanged(model);\n    }\n  };\n\n  render() {\n    const { focusedEl } = this.state;\n    const {\n      classes,\n      className,\n      choices,\n      model,\n      imageSupport,\n      uploadSoundSupport,\n      onModelChanged,\n      spellCheck,\n      toolbarOpts,\n      configuration,\n      defaultImageMaxWidth,\n      defaultImageMaxHeight,\n    } = this.props;\n    const { errors, allowMultiplePlacementsEnabled } = model;\n    const { choicesError, choicesErrors } = errors || {};\n    const { maxChoices, maxImageWidth = {}, maxImageHeight = {} } = configuration || {};\n\n    const categoryCountIsOne = this.allChoicesHaveCount(1);\n    const choiceHolderStyle = {\n      gridTemplateColumns: `repeat(${model.categoriesPerRow}, 1fr)`,\n    };\n\n    return (\n      <div className={classNames(classes.choices, className)}>\n        <Header\n          label=\"Choices\"\n          buttonLabel=\"ADD A CHOICE\"\n          onAdd={this.addChoice}\n          buttonDisabled={maxChoices && choices && maxChoices === choices.length}\n        />\n        {choicesError && <div className={classes.errorText}>{choicesError}</div>}\n        <Config\n          config={model}\n          onModelChanged={onModelChanged}\n          spellCheck={spellCheck}\n        />\n        <div className={classes.choiceHolder} style={choiceHolderStyle}>\n          {choices.map((h, index) => {\n            return (\n              <Choice\n                choice={h}\n                focusedEl={focusedEl}\n                deleteFocusedEl={this.deleteFocusedEl}\n                correctResponseCount={h.correctResponseCount}\n                allowMultiplePlacements={allowMultiplePlacementsEnabled}\n                index={index}\n                key={index}\n                imageSupport={imageSupport}\n                onChange={this.changeChoice}\n                onDelete={() => this.deleteChoice(h)}\n                toolbarOpts={toolbarOpts}\n                spellCheck={spellCheck}\n                error={choicesErrors && choicesErrors[h.id]}\n                maxImageWidth={\n                  (maxImageWidth && maxImageWidth.choice) ||\n                  defaultImageMaxWidth\n                }\n                maxImageHeight={\n                  (maxImageHeight && maxImageHeight.choice) ||\n                  defaultImageMaxHeight\n                }\n                uploadSoundSupport={uploadSoundSupport}\n              />\n            );\n          })}\n        </div>\n        <Divider />\n      </div>\n    );\n  }\n}\nconst styles = (theme) => ({\n  choiceHolder: {\n    paddingTop: theme.spacing.unit,\n    paddingBottom: theme.spacing.unit,\n    display: 'grid',\n    gridRowGap: `${theme.spacing.unit}px`,\n    gridColumnGap: `${theme.spacing.unit}px`,\n  },\n  choices: {\n    paddingTop: theme.spacing.unit * 2,\n    paddingBottom: theme.spacing.unit * 2,\n  },\n  label: {},\n  errorText: {\n    fontSize: '12px',\n    color: 'red',\n    padding: '5px 0',\n  },\n});\nexport default withStyles(styles)(Choices);\n"],"file":"index.js"}