@pie-element/categorize 6.7.2 → 6.7.3-next.1016

package/docs/pie-schema.json.md

@@ -150,6 +150,10 @@ Indicates if Feedback is enabled
 
 Indicates if Rationale are enabled
 
+# `spellCheckEnabled` (boolean, required)
+
+Indicates if spellcheck is enabled for the author. Default value is true
+
 # `studentInstructionsEnabled` (boolean, required)
 
 Indicates if Student Instructions are enabled
@@ -162,6 +166,17 @@ Indicates if Teacher Instructions are enabled
 
 Indicates the note for the answer
 
+# `toolbarEditorPosition` (string, enum)
+
+Indicates the editor's toolbar position which can be 'bottom' or 'top'
+
+This element must be one of the following enum values:
+
+* `bottom`
+* `top`
+
+Default: `": 'bottom'"`
+
 # `id` (string, required)
 
 Identifier to identify the Pie Element in html markup, Must be unique within a pie item config.
@@ -188,6 +203,34 @@ Indicates if the item has to be displayed in the Settings Panel
 
 Indicates the label for the item that has to be displayed in the Settings Panel
 
+## `ConfigureMaxImageDimensionsProp` (object)
+
+Properties of the `ConfigureMaxImageDimensionsProp` object:
+
+### `teacherInstructions` (number)
+
+Indicates the max dimension for images in teacher instructions
+
+### `prompt` (number)
+
+Indicates the max dimension for images in prompt - this is also the default dimension for all other input fields if it's not specified
+
+### `rationale` (number)
+
+Indicates the max dimension for images in rationale
+
+### `choices` (number)
+
+Indicates the max dimension for images in choices
+
+### `rowLabel` (number)
+
+Indicates the max dimension for images in row labels
+
+### `categoryLabel` (number)
+
+Indicates the max dimension for images in category labels
+
 ## `CategoryChoice` (object)
 
 Properties of the `CategoryChoice` object:

package/lib/categorize/categories.js

@@ -1,19 +1,20 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
+var _typeof = require("@babel/runtime/helpers/typeof");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.Categories = void 0;
 Object.defineProperty(exports, "CategoryType", {
   enumerable: true,
   get: function get() {
     return _category.CategoryType;
   }
 });
-exports["default"] = exports.Categories = void 0;
+exports["default"] = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
@@ -45,9 +46,13 @@ var _gridContent = _interopRequireDefault(require("./grid-content"));
 
 var _category = _interopRequireWildcard(require("./category"));
 
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 var Categories = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2["default"])(Categories, _React$Component);

package/lib/categorize/categories.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/categorize/categories.jsx"],"names":["Categories","props","classes","categories","model","disabled","onDropChoice","onRemoveChoice","categoriesPerRow","chunkedCategories","Math","ceil","length","map","cat","rowIndex","items","forEach","c","columnIndex","push","label","__html","concat","Array","fill","h","id","category","React","Component","PropTypes","object","isRequired","arrayOf","shape","CategoryType","number","bool","func","styles","theme","flex","color","text","backgroundColor","background","fontSize","typography","textAlign","paddingTop","spacing","unit"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport Typography from '@material-ui/core/Typography';\nimport { color } from '@pie-lib/render-ui';\n\nimport chunk from 'lodash/chunk';\n\nimport GridContent from './grid-content';\nimport Category, { CategoryType } from './category';\n\nexport { CategoryType };\n\nexport class Categories extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    categories: PropTypes.arrayOf(PropTypes.shape(CategoryType)),\n    model: PropTypes.shape({\n      categoriesPerRow: PropTypes.number\n    }),\n    disabled: PropTypes.bool,\n    onDropChoice: PropTypes.func.isRequired,\n    onRemoveChoice: PropTypes.func.isRequired,\n  };\n\n  static defaultProps = {\n    model: {\n      categoriesPerRow: 1\n    }\n  };\n\n  render() {\n    const {\n      classes,\n      categories,\n      model,\n      disabled,\n      onDropChoice,\n      onRemoveChoice,\n    } = this.props;\n    const { categoriesPerRow } = model;\n\n    // split categories into an array of arrays (inner array),\n    // where each inner array represents how many categories should be displayed on one row\n    const chunkedCategories = chunk(categories, categoriesPerRow);\n\n    return (\n      <GridContent\n        columns={categoriesPerRow}\n        className={classes.categories}\n        rows={Math.ceil(categories.length / categoriesPerRow) * 2}\n      >\n        {\n          chunkedCategories.map((cat, rowIndex) => {\n            let items = [];\n\n            // for each inner array of categories, create a row with category titles\n            cat.forEach((c, columnIndex) => {\n              items.push((\n                <Typography className={classes.label} key={`category-label-${rowIndex}-${columnIndex}`}>\n                  <span dangerouslySetInnerHTML={{ __html: c.label }}/>\n                </Typography>));\n            });\n\n            // if the last row has less categories than max on a row, fill the spaces with divs\n            items = items.concat(Array(categoriesPerRow - cat.length).fill(<div/>));\n\n            // for each inner array of categories, create a row with category containers\n            cat.forEach((c, columnIndex) => {\n              items.push(<Category\n                onDropChoice={h => onDropChoice(c.id, h)}\n                onRemoveChoice={onRemoveChoice}\n                disabled={disabled}\n                className={classes.category}\n                key={`category-element-${rowIndex}-${columnIndex}`}\n                {...c}\n              />);\n            });\n\n            // if the last row has less categories than max on a row, fill the spaces with divs\n            items = items.concat(Array(categoriesPerRow - cat.length).fill(<div/>));\n\n            return items;\n          })\n        }\n      </GridContent>\n    );\n  }\n}\n\nconst styles = theme => ({\n  categories: {\n    flex: 1\n  },\n  label: {\n    color: color.text(),\n    backgroundColor: color.background(),\n    fontSize: theme.typography.fontSize,\n    textAlign: 'center',\n    paddingTop: theme.spacing.unit\n  }\n});\nexport default withStyles(styles)(Categories);\n"],"file":"categories.js"}
+{"version":3,"sources":["../../src/categorize/categories.jsx"],"names":["Categories","props","classes","categories","model","disabled","onDropChoice","onRemoveChoice","categoriesPerRow","chunkedCategories","Math","ceil","length","map","cat","rowIndex","items","forEach","c","columnIndex","push","label","__html","concat","Array","fill","h","id","category","React","Component","PropTypes","object","isRequired","arrayOf","shape","CategoryType","number","bool","func","styles","theme","flex","color","text","backgroundColor","background","fontSize","typography","textAlign","paddingTop","spacing","unit"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport Typography from '@material-ui/core/Typography';\nimport { color } from '@pie-lib/render-ui';\n\nimport chunk from 'lodash/chunk';\n\nimport GridContent from './grid-content';\nimport Category, { CategoryType } from './category';\n\nexport { CategoryType };\n\nexport class Categories extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    categories: PropTypes.arrayOf(PropTypes.shape(CategoryType)),\n    model: PropTypes.shape({\n      categoriesPerRow: PropTypes.number\n    }),\n    disabled: PropTypes.bool,\n    onDropChoice: PropTypes.func.isRequired,\n    onRemoveChoice: PropTypes.func.isRequired,\n  };\n\n  static defaultProps = {\n    model: {\n      categoriesPerRow: 1\n    }\n  };\n\n  render() {\n    const {\n      classes,\n      categories,\n      model,\n      disabled,\n      onDropChoice,\n      onRemoveChoice,\n    } = this.props;\n    const { categoriesPerRow } = model;\n\n    // split categories into an array of arrays (inner array),\n    // where each inner array represents how many categories should be displayed on one row\n    const chunkedCategories = chunk(categories, categoriesPerRow);\n\n    return (\n      <GridContent\n        columns={categoriesPerRow}\n        className={classes.categories}\n        rows={Math.ceil(categories.length / categoriesPerRow) * 2}\n      >\n        {\n          chunkedCategories.map((cat, rowIndex) => {\n            let items = [];\n\n            // for each inner array of categories, create a row with category titles\n            cat.forEach((c, columnIndex) => {\n              items.push((\n                <Typography className={classes.label} key={`category-label-${rowIndex}-${columnIndex}`}>\n                  <span dangerouslySetInnerHTML={{ __html: c.label }}/>\n                </Typography>));\n            });\n\n            // if the last row has less categories than max on a row, fill the spaces with divs\n            items = items.concat(Array(categoriesPerRow - cat.length).fill(<div/>));\n\n            // for each inner array of categories, create a row with category containers\n            cat.forEach((c, columnIndex) => {\n              items.push(<Category\n                onDropChoice={h => onDropChoice(c.id, h)}\n                onRemoveChoice={onRemoveChoice}\n                disabled={disabled}\n                className={classes.category}\n                key={`category-element-${rowIndex}-${columnIndex}`}\n                {...c}\n              />);\n            });\n\n            // if the last row has less categories than max on a row, fill the spaces with divs\n            items = items.concat(Array(categoriesPerRow - cat.length).fill(<div/>));\n\n            return items;\n          })\n        }\n      </GridContent>\n    );\n  }\n}\n\nconst styles = theme => ({\n  categories: {\n    flex: 1\n  },\n  label: {\n    color: color.text(),\n    backgroundColor: color.background(),\n    fontSize: theme.typography.fontSize,\n    textAlign: 'center',\n    paddingTop: theme.spacing.unit\n  }\n});\nexport default withStyles(styles)(Categories);\n"],"file":"categories.js"}

package/lib/categorize/category.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.Category = exports.CategoryType = void 0;
+exports["default"] = exports.CategoryType = exports.Category = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
@@ -35,13 +35,13 @@ var _droppablePlaceholder = _interopRequireDefault(require("./droppable-placehol
 
 var _renderUi = require("@pie-lib/render-ui");
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 var CategoryType = {
   id: _propTypes["default"].string.isRequired,

package/lib/categorize/category.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/categorize/category.jsx"],"names":["CategoryType","id","PropTypes","string","isRequired","categoryId","Category","props","classes","className","choices","disabled","onDropChoice","onRemoveChoice","correct","names","category","placeholderNames","placeholder","incorrect","map","c","index","React","Component","bool","object","func","styles","theme","border","color","minHeight","padding","spacing","unit","borderRadius","gridColumnGap","gridRowGap","display","flexWrap","justifyContent","alignItems","alignContent","flexDirection"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEO,IAAMA,YAAY,GAAG;AAC1BC,EAAAA,EAAE,EAAEC,sBAAUC,MAAV,CAAiBC,UADK;AAE1BC,EAAAA,UAAU,EAAEH,sBAAUC;AAFI,CAArB;;;IAKMG,Q;;;;;;;;;;;;WAYX,kBAAS;AAAA,wBAUH,KAAKC,KAVF;AAAA,UAELC,OAFK,eAELA,OAFK;AAAA,UAGLC,SAHK,eAGLA,SAHK;AAAA,4CAILC,OAJK;AAAA,UAILA,OAJK,oCAIK,EAJL;AAAA,UAKLC,QALK,eAKLA,QALK;AAAA,UAMLC,YANK,eAMLA,YANK;AAAA,UAOLC,cAPK,eAOLA,cAPK;AAAA,UAQLZ,EARK,eAQLA,EARK;AAAA,UASLa,OATK,eASLA,OATK;AAYP,UAAMC,KAAK,GAAG,4BAAWP,OAAO,CAACQ,QAAnB,EAA6BP,SAA7B,CAAd;AACA,UAAMQ,gBAAgB,GAAG,4BACvBT,OAAO,CAACU,WADe,EAEvBJ,OAAO,KAAK,KAAZ,IAAqBN,OAAO,CAACW,SAFN,CAAzB;AAKA,0BACE;AAAK,QAAA,SAAS,EAAEJ;AAAhB,sBACE,gCAAC,gCAAD;AACE,QAAA,YAAY,EAAEH,YADhB;AAEE,QAAA,QAAQ,EAAED,QAFZ;AAGE,QAAA,SAAS,EAAEM;AAHb,SAKGP,OAAO,CAACU,GAAR,CAAY,UAACC,CAAD,EAAIC,KAAJ;AAAA,4BACX,gCAAC,kBAAD;AACE,UAAA,cAAc,EAAET,cADlB;AAEE,UAAA,QAAQ,EAAEF,QAFZ;AAGE,UAAA,GAAG,EAAEW,KAHP;AAIE,UAAA,WAAW,EAAEA,KAJf;AAKE,UAAA,UAAU,EAAErB;AALd,WAMMoB,CANN,EADW;AAAA,OAAZ,CALH,CADF,CADF;AAoBD;;;EAlD2BE,kBAAMC,S;;;iCAAvBlB,Q,+CAENN,Y;AACHS,EAAAA,SAAS,EAAEP,sBAAUC,M;AACrBQ,EAAAA,QAAQ,EAAET,sBAAUuB,I;AACpBjB,EAAAA,OAAO,EAAEN,sBAAUwB,MAAV,CAAiBtB,U;AAC1BQ,EAAAA,YAAY,EAAEV,sBAAUyB,I;AACxBd,EAAAA,cAAc,EAAEX,sBAAUyB;;iCAPjBrB,Q,kBAUW,E;;AA2CxB,IAAMsB,MAAM,GAAG,SAATA,MAAS,CAACC,KAAD;AAAA,SAAY;AACzBV,IAAAA,SAAS,EAAE;AACTW,MAAAA,MAAM,sBAAeC,gBAAMZ,SAAN,EAAf;AADG,KADc;AAIzBD,IAAAA,WAAW,EAAE;AACXc,MAAAA,SAAS,EAAE,MADA;AAEXC,MAAAA,OAAO,EAAEJ,KAAK,CAACK,OAAN,CAAcC,IAAd,GAAqB,CAFnB;AAGXC,MAAAA,YAAY,EAAEP,KAAK,CAACK,OAAN,CAAcC,IAAd,GAAqB,CAHxB;AAIXE,MAAAA,aAAa,EAAE,CAJJ;AAKXC,MAAAA,UAAU,EAAE,CALD;AAMXC,MAAAA,OAAO,EAAE,MANE;AAOXC,MAAAA,QAAQ,EAAE,MAPC;AAQXC,MAAAA,cAAc,EAAE,QARL;AASXC,MAAAA,UAAU,EAAE,QATD;AAUXC,MAAAA,YAAY,EAAE;AAVH,KAJY;AAgBzB3B,IAAAA,QAAQ,EAAE;AACRuB,MAAAA,OAAO,EAAE,MADD;AAERK,MAAAA,aAAa,EAAE;AAFP;AAhBe,GAAZ;AAAA,CAAf;;eAsBe,wBAAWhB,MAAX,EAAmBtB,QAAnB,C","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\nimport Choice from './choice';\nimport PlaceHolder from './droppable-placeholder';\nimport { color } from '@pie-lib/render-ui';\n\nexport const CategoryType = {\n  id: PropTypes.string.isRequired,\n  categoryId: PropTypes.string,\n};\n\nexport class Category extends React.Component {\n  static propTypes = {\n    ...CategoryType,\n    className: PropTypes.string,\n    disabled: PropTypes.bool,\n    classes: PropTypes.object.isRequired,\n    onDropChoice: PropTypes.func,\n    onRemoveChoice: PropTypes.func,\n  };\n\n  static defaultProps = {};\n\n  render() {\n    const {\n      classes,\n      className,\n      choices = [],\n      disabled,\n      onDropChoice,\n      onRemoveChoice,\n      id,\n      correct,\n    } = this.props;\n\n    const names = classNames(classes.category, className);\n    const placeholderNames = classNames(\n      classes.placeholder,\n      correct === false && classes.incorrect\n    );\n\n    return (\n      <div className={names}>\n        <PlaceHolder\n          onDropChoice={onDropChoice}\n          disabled={disabled}\n          className={placeholderNames}\n        >\n          {choices.map((c, index) => (\n            <Choice\n              onRemoveChoice={onRemoveChoice}\n              disabled={disabled}\n              key={index}\n              choiceIndex={index}\n              categoryId={id}\n              {...c}\n            />\n          ))}\n        </PlaceHolder>\n      </div>\n    );\n  }\n}\n\nconst styles = (theme) => ({\n  incorrect: {\n    border: `solid 2px ${color.incorrect()}`,\n  },\n  placeholder: {\n    minHeight: '80px',\n    padding: theme.spacing.unit / 2,\n    borderRadius: theme.spacing.unit / 2,\n    gridColumnGap: 0,\n    gridRowGap: 0,\n    display: 'flex',\n    flexWrap: 'wrap',\n    justifyContent: 'center',\n    alignItems: 'center',\n    alignContent: 'flex-start'\n  },\n  category: {\n    display: 'flex',\n    flexDirection: 'column',\n  },\n});\n\nexport default withStyles(styles)(Category);\n"],"file":"category.js"}
+{"version":3,"sources":["../../src/categorize/category.jsx"],"names":["CategoryType","id","PropTypes","string","isRequired","categoryId","Category","props","classes","className","choices","disabled","onDropChoice","onRemoveChoice","correct","names","category","placeholderNames","placeholder","incorrect","map","c","index","React","Component","bool","object","func","styles","theme","border","color","minHeight","padding","spacing","unit","borderRadius","gridColumnGap","gridRowGap","display","flexWrap","justifyContent","alignItems","alignContent","flexDirection"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEO,IAAMA,YAAY,GAAG;AAC1BC,EAAAA,EAAE,EAAEC,sBAAUC,MAAV,CAAiBC,UADK;AAE1BC,EAAAA,UAAU,EAAEH,sBAAUC;AAFI,CAArB;;;IAKMG,Q;;;;;;;;;;;;WAYX,kBAAS;AACP,wBASI,KAAKC,KATT;AAAA,UACEC,OADF,eACEA,OADF;AAAA,UAEEC,SAFF,eAEEA,SAFF;AAAA,4CAGEC,OAHF;AAAA,UAGEA,OAHF,oCAGY,EAHZ;AAAA,UAIEC,QAJF,eAIEA,QAJF;AAAA,UAKEC,YALF,eAKEA,YALF;AAAA,UAMEC,cANF,eAMEA,cANF;AAAA,UAOEZ,EAPF,eAOEA,EAPF;AAAA,UAQEa,OARF,eAQEA,OARF;AAWA,UAAMC,KAAK,GAAG,4BAAWP,OAAO,CAACQ,QAAnB,EAA6BP,SAA7B,CAAd;AACA,UAAMQ,gBAAgB,GAAG,4BACvBT,OAAO,CAACU,WADe,EAEvBJ,OAAO,KAAK,KAAZ,IAAqBN,OAAO,CAACW,SAFN,CAAzB;AAKA,0BACE;AAAK,QAAA,SAAS,EAAEJ;AAAhB,sBACE,gCAAC,gCAAD;AACE,QAAA,YAAY,EAAEH,YADhB;AAEE,QAAA,QAAQ,EAAED,QAFZ;AAGE,QAAA,SAAS,EAAEM;AAHb,SAKGP,OAAO,CAACU,GAAR,CAAY,UAACC,CAAD,EAAIC,KAAJ;AAAA,4BACX,gCAAC,kBAAD;AACE,UAAA,cAAc,EAAET,cADlB;AAEE,UAAA,QAAQ,EAAEF,QAFZ;AAGE,UAAA,GAAG,EAAEW,KAHP;AAIE,UAAA,WAAW,EAAEA,KAJf;AAKE,UAAA,UAAU,EAAErB;AALd,WAMMoB,CANN,EADW;AAAA,OAAZ,CALH,CADF,CADF;AAoBD;;;EAlD2BE,kBAAMC,S;;;iCAAvBlB,Q,+CAENN,Y;AACHS,EAAAA,SAAS,EAAEP,sBAAUC,M;AACrBQ,EAAAA,QAAQ,EAAET,sBAAUuB,I;AACpBjB,EAAAA,OAAO,EAAEN,sBAAUwB,MAAV,CAAiBtB,U;AAC1BQ,EAAAA,YAAY,EAAEV,sBAAUyB,I;AACxBd,EAAAA,cAAc,EAAEX,sBAAUyB;;iCAPjBrB,Q,kBAUW,E;;AA2CxB,IAAMsB,MAAM,GAAG,SAATA,MAAS,CAACC,KAAD;AAAA,SAAY;AACzBV,IAAAA,SAAS,EAAE;AACTW,MAAAA,MAAM,sBAAeC,gBAAMZ,SAAN,EAAf;AADG,KADc;AAIzBD,IAAAA,WAAW,EAAE;AACXc,MAAAA,SAAS,EAAE,MADA;AAEXC,MAAAA,OAAO,EAAEJ,KAAK,CAACK,OAAN,CAAcC,IAAd,GAAqB,CAFnB;AAGXC,MAAAA,YAAY,EAAEP,KAAK,CAACK,OAAN,CAAcC,IAAd,GAAqB,CAHxB;AAIXE,MAAAA,aAAa,EAAE,CAJJ;AAKXC,MAAAA,UAAU,EAAE,CALD;AAMXC,MAAAA,OAAO,EAAE,MANE;AAOXC,MAAAA,QAAQ,EAAE,MAPC;AAQXC,MAAAA,cAAc,EAAE,QARL;AASXC,MAAAA,UAAU,EAAE,QATD;AAUXC,MAAAA,YAAY,EAAE;AAVH,KAJY;AAgBzB3B,IAAAA,QAAQ,EAAE;AACRuB,MAAAA,OAAO,EAAE,MADD;AAERK,MAAAA,aAAa,EAAE;AAFP;AAhBe,GAAZ;AAAA,CAAf;;eAsBe,wBAAWhB,MAAX,EAAmBtB,QAAnB,C","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\nimport Choice from './choice';\nimport PlaceHolder from './droppable-placeholder';\nimport { color } from '@pie-lib/render-ui';\n\nexport const CategoryType = {\n  id: PropTypes.string.isRequired,\n  categoryId: PropTypes.string,\n};\n\nexport class Category extends React.Component {\n  static propTypes = {\n    ...CategoryType,\n    className: PropTypes.string,\n    disabled: PropTypes.bool,\n    classes: PropTypes.object.isRequired,\n    onDropChoice: PropTypes.func,\n    onRemoveChoice: PropTypes.func,\n  };\n\n  static defaultProps = {};\n\n  render() {\n    const {\n      classes,\n      className,\n      choices = [],\n      disabled,\n      onDropChoice,\n      onRemoveChoice,\n      id,\n      correct,\n    } = this.props;\n\n    const names = classNames(classes.category, className);\n    const placeholderNames = classNames(\n      classes.placeholder,\n      correct === false && classes.incorrect\n    );\n\n    return (\n      <div className={names}>\n        <PlaceHolder\n          onDropChoice={onDropChoice}\n          disabled={disabled}\n          className={placeholderNames}\n        >\n          {choices.map((c, index) => (\n            <Choice\n              onRemoveChoice={onRemoveChoice}\n              disabled={disabled}\n              key={index}\n              choiceIndex={index}\n              categoryId={id}\n              {...c}\n            />\n          ))}\n        </PlaceHolder>\n      </div>\n    );\n  }\n}\n\nconst styles = (theme) => ({\n  incorrect: {\n    border: `solid 2px ${color.incorrect()}`,\n  },\n  placeholder: {\n    minHeight: '80px',\n    padding: theme.spacing.unit / 2,\n    borderRadius: theme.spacing.unit / 2,\n    gridColumnGap: 0,\n    gridRowGap: 0,\n    display: 'flex',\n    flexWrap: 'wrap',\n    justifyContent: 'center',\n    alignItems: 'center',\n    alignContent: 'flex-start'\n  },\n  category: {\n    display: 'flex',\n    flexDirection: 'column',\n  },\n});\n\nexport default withStyles(styles)(Category);\n"],"file":"category.js"}

package/lib/categorize/choice.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.spec = exports.Choice = exports.Layout = exports.ChoiceType = void 0;
+exports.spec = exports["default"] = exports.Layout = exports.ChoiceType = exports.Choice = void 0;
 
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 
@@ -39,13 +39,13 @@ var _renderUi = require("@pie-lib/render-ui");
 
 var _debug = _interopRequireDefault(require("debug"));
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 var log = (0, _debug["default"])('@pie-ui:categorize:choice');
 var ChoiceType = {
@@ -105,6 +105,7 @@ exports.Layout = Layout;
 var styles = function styles(theme) {
   return {
     choice: {
+      direction: 'initial',
       cursor: 'pointer',
       width: '100%',
       '&.correct': {

package/lib/categorize/choice.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/categorize/choice.jsx"],"names":["log","ChoiceType","content","PropTypes","string","isRequired","id","Layout","props","classes","className","isDragging","disabled","correct","rootNames","choice","dragging","cardNames","card","root","cardRoot","__html","React","Component","object","bool","styles","theme","cursor","width","border","color","incorrect","borderRadius","text","backgroundColor","background","fontSize","typography","paddingBottom","spacing","unit","opacity","Styled","Choice","connectDragSource","extraStyle","margin","func","spec","canDrag","beginDrag","out","categoryId","choiceIndex","endDrag","monitor","didDrop","item","getItem","onRemoveChoice","DraggableChoice","uid","connect","dragSource","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 { DragSource } from 'react-dnd';\nimport { uid } from '@pie-lib/drag';\nimport Card from '@material-ui/core/Card';\nimport CardContent from '@material-ui/core/CardContent';\nimport { color } from '@pie-lib/render-ui';\nimport debug from 'debug';\n\nconst log = debug('@pie-ui:categorize:choice');\n\nexport const ChoiceType = {\n  content: PropTypes.string.isRequired,\n  id: PropTypes.string\n};\n\nexport class Layout extends React.Component {\n  static propTypes = {\n    ...ChoiceType,\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    disabled: PropTypes.bool,\n    correct: PropTypes.bool\n  };\n  static defaultProps = {};\n  render() {\n    const {\n      classes,\n      className,\n      content,\n      isDragging,\n      disabled,\n      correct\n    } = this.props;\n\n    const rootNames = classNames(\n      correct === true && 'correct',\n      correct === false && 'incorrect',\n      classes.choice,\n      isDragging && classes.dragging,\n      disabled && classes.disabled,\n      className\n    );\n    const cardNames = classNames(classes.card);\n    return (\n      <div className={rootNames}>\n        <Card className={cardNames}>\n          <CardContent classes={{ root: classes.cardRoot }} dangerouslySetInnerHTML={{ __html: content }} />\n        </Card>\n      </div>\n    );\n  }\n}\n\nconst styles = theme => ({\n  choice: {\n    cursor: 'pointer',\n    width: '100%',\n    '&.correct': {\n      border: `solid 2px ${color.correct()}`\n    },\n    '&.incorrect': {\n      border: `solid 2px ${color.incorrect()}`\n    },\n    borderRadius: '6px'\n  },\n  cardRoot: {\n    color: color.text(),\n    backgroundColor: color.background(),\n    fontSize: theme.typography.fontSize + 2,\n    '&:last-child': {\n      paddingBottom: theme.spacing.unit * 2\n    },\n    borderRadius: '4px',\n    border: '1px solid'\n  },\n  disabled: {\n    cursor: 'not-allowed',\n    opacity: '0.6'\n  },\n  dragging: {\n    cursor: 'move'\n  },\n  card: {\n    color: color.text(),\n    backgroundColor: color.background(),\n    width: '100%'\n  }\n});\n\nconst Styled = withStyles(styles)(Layout);\n\nexport class Choice extends React.Component {\n  static propTypes = {\n    ...ChoiceType,\n    extraStyle: PropTypes.object,\n    connectDragSource: PropTypes.func.isRequired\n  };\n\n  render() {\n    const {\n      connectDragSource,\n      id,\n      content,\n      disabled,\n      isDragging,\n      correct,\n      extraStyle\n    } = this.props;\n\n    return connectDragSource(\n      <div style={{ margin: '4px', ...extraStyle }}>\n        <Styled\n          id={id}\n          content={content}\n          disabled={disabled}\n          correct={correct}\n          isDragging={isDragging}\n        />\n      </div>\n    );\n  }\n}\n\nexport const spec = {\n  canDrag: props => !props.disabled,\n  beginDrag: props => {\n    const out = {\n      id: props.id,\n      categoryId: props.categoryId,\n      choiceIndex: props.choiceIndex\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    isDragging: monitor.isDragging()\n  })\n)(Choice);\n\nexport default uid.withUid(DraggableChoice);\n"],"file":"choice.js"}
+{"version":3,"sources":["../../src/categorize/choice.jsx"],"names":["log","ChoiceType","content","PropTypes","string","isRequired","id","Layout","props","classes","className","isDragging","disabled","correct","rootNames","choice","dragging","cardNames","card","root","cardRoot","__html","React","Component","object","bool","styles","theme","direction","cursor","width","border","color","incorrect","borderRadius","text","backgroundColor","background","fontSize","typography","paddingBottom","spacing","unit","opacity","Styled","Choice","connectDragSource","extraStyle","margin","func","spec","canDrag","beginDrag","out","categoryId","choiceIndex","endDrag","monitor","didDrop","item","getItem","onRemoveChoice","DraggableChoice","uid","connect","dragSource","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 { DragSource } from 'react-dnd';\nimport { uid } from '@pie-lib/drag';\nimport Card from '@material-ui/core/Card';\nimport CardContent from '@material-ui/core/CardContent';\nimport { color } from '@pie-lib/render-ui';\nimport debug from 'debug';\n\nconst log = debug('@pie-ui:categorize:choice');\n\nexport const ChoiceType = {\n  content: PropTypes.string.isRequired,\n  id: PropTypes.string\n};\n\nexport class Layout extends React.Component {\n  static propTypes = {\n    ...ChoiceType,\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    disabled: PropTypes.bool,\n    correct: PropTypes.bool\n  };\n  static defaultProps = {};\n  render() {\n    const {\n      classes,\n      className,\n      content,\n      isDragging,\n      disabled,\n      correct\n    } = this.props;\n\n    const rootNames = classNames(\n      correct === true && 'correct',\n      correct === false && 'incorrect',\n      classes.choice,\n      isDragging && classes.dragging,\n      disabled && classes.disabled,\n      className\n    );\n    const cardNames = classNames(classes.card);\n    return (\n      <div className={rootNames}>\n        <Card className={cardNames}>\n          <CardContent classes={{ root: classes.cardRoot }} dangerouslySetInnerHTML={{ __html: content }} />\n        </Card>\n      </div>\n    );\n  }\n}\n\nconst styles = theme => ({\n  choice: {\n    direction: 'initial',\n    cursor: 'pointer',\n    width: '100%',\n    '&.correct': {\n      border: `solid 2px ${color.correct()}`\n    },\n    '&.incorrect': {\n      border: `solid 2px ${color.incorrect()}`\n    },\n    borderRadius: '6px'\n  },\n  cardRoot: {\n    color: color.text(),\n    backgroundColor: color.background(),\n    fontSize: theme.typography.fontSize + 2,\n    '&:last-child': {\n      paddingBottom: theme.spacing.unit * 2\n    },\n    borderRadius: '4px',\n    border: '1px solid'\n  },\n  disabled: {\n    cursor: 'not-allowed',\n    opacity: '0.6'\n  },\n  dragging: {\n    cursor: 'move'\n  },\n  card: {\n    color: color.text(),\n    backgroundColor: color.background(),\n    width: '100%'\n  }\n});\n\nconst Styled = withStyles(styles)(Layout);\n\nexport class Choice extends React.Component {\n  static propTypes = {\n    ...ChoiceType,\n    extraStyle: PropTypes.object,\n    connectDragSource: PropTypes.func.isRequired\n  };\n\n  render() {\n    const {\n      connectDragSource,\n      id,\n      content,\n      disabled,\n      isDragging,\n      correct,\n      extraStyle\n    } = this.props;\n\n    return connectDragSource(\n      <div style={{ margin: '4px', ...extraStyle }}>\n        <Styled\n          id={id}\n          content={content}\n          disabled={disabled}\n          correct={correct}\n          isDragging={isDragging}\n        />\n      </div>\n    );\n  }\n}\n\nexport const spec = {\n  canDrag: props => !props.disabled,\n  beginDrag: props => {\n    const out = {\n      id: props.id,\n      categoryId: props.categoryId,\n      choiceIndex: props.choiceIndex\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    isDragging: monitor.isDragging()\n  })\n)(Choice);\n\nexport default uid.withUid(DraggableChoice);\n"],"file":"choice.js"}

package/lib/categorize/choices.js

@@ -1,9 +1,9 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
+var _typeof = require("@babel/runtime/helpers/typeof");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -37,9 +37,13 @@ var _styles = require("@material-ui/core/styles");
 
 var _choice = _interopRequireWildcard(require("./choice"));
 
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 var Blank = function Blank() {
   return /*#__PURE__*/_react["default"].createElement("div", null);
@@ -76,8 +80,11 @@ var Choices = /*#__PURE__*/function (_React$Component) {
       return /*#__PURE__*/_react["default"].createElement("div", {
         className: classes.wrapper
       }, model.choicesLabel && model.choicesLabel !== '' && /*#__PURE__*/_react["default"].createElement("div", {
-        className: classes.labelHolder
-      }, model.choicesLabel), /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.labelHolder,
+        dangerouslySetInnerHTML: {
+          __html: model.choicesLabel
+        }
+      }), /*#__PURE__*/_react["default"].createElement("div", {
         className: classes.choices,
         style: style
       }, choices.map(function (c, index) {

package/lib/categorize/choices.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/categorize/choices.jsx"],"names":["Blank","Choices","props","classes","choices","model","disabled","choicePosition","style","textAlign","direction","wrapper","choicesLabel","labelHolder","map","c","index","empty","choice","maxWidth","categoriesPerRow","React","Component","PropTypes","object","isRequired","arrayOf","oneOfType","shape","ChoiceType","bool","number","string","styles","theme","flex","padding","spacing","unit","display","justifyContent","alignItems","flexWrap","margin","paddingTop"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport Choice, { ChoiceType } from './choice';\nexport { ChoiceType };\n\nconst Blank = () => <div />;\n\nexport class Choices extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    choices: PropTypes.arrayOf(\n      PropTypes.oneOfType([\n        PropTypes.shape(ChoiceType),\n        PropTypes.shape({ empty: PropTypes.bool }),\n      ])\n    ),\n    model: PropTypes.shape({\n      categoriesPerRow: PropTypes.number,\n      choicesLabel: PropTypes.string,\n    }),\n    disabled: PropTypes.bool,\n    choicePosition: PropTypes.string,\n  };\n\n  static defaultProps = {\n    model: {\n      categoriesPerRow: 1,\n      choicesLabel: '',\n    },\n  };\n\n  render() {\n    const {\n      classes,\n      choices = [],\n      model,\n      disabled,\n      choicePosition,\n    } = this.props;\n    let style = {\n      textAlign: 'center',\n    };\n\n    if (choicePosition === 'left') {\n      style.direction = 'rtl';\n    }\n\n    return (\n      <div className={classes.wrapper}>\n        {model.choicesLabel && model.choicesLabel !== '' && (\n          <div className={classes.labelHolder}>{model.choicesLabel}</div>\n        )}\n        <div className={classes.choices} style={style}>\n          {choices.map((c, index) => {\n            return c.empty ? (\n              <Blank key={index} />\n            ) : (\n              <Choice\n                disabled={disabled}\n                className={classes.choice}\n                key={index}\n                extraStyle={{ maxWidth: `${95 / model.categoriesPerRow}%` }}\n                {...c}\n              />\n            );\n          })}\n        </div>\n      </div>\n    );\n  }\n}\n\nconst styles = (theme) => ({\n  wrapper: {\n    flex: 1,\n    padding: theme.spacing.unit,\n  },\n  choices: {\n    padding: theme.spacing.unit / 2,\n    display: 'flex',\n    justifyContent: 'center',\n    alignItems: 'center',\n    flexWrap: 'wrap'\n  },\n  labelHolder: {\n    margin: '0 auto',\n    textAlign: 'center',\n    paddingTop: theme.spacing.unit,\n  },\n});\n\nexport default withStyles(styles)(Choices);\n"],"file":"choices.js"}
+{"version":3,"sources":["../../src/categorize/choices.jsx"],"names":["Blank","Choices","props","classes","choices","model","disabled","choicePosition","style","textAlign","direction","wrapper","choicesLabel","labelHolder","__html","map","c","index","empty","choice","maxWidth","categoriesPerRow","React","Component","PropTypes","object","isRequired","arrayOf","oneOfType","shape","ChoiceType","bool","number","string","styles","theme","flex","padding","spacing","unit","display","justifyContent","alignItems","flexWrap","margin","paddingTop"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport Choice, { ChoiceType } from './choice';\nexport { ChoiceType };\n\nconst Blank = () => <div />;\n\nexport class Choices extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    choices: PropTypes.arrayOf(\n      PropTypes.oneOfType([\n        PropTypes.shape(ChoiceType),\n        PropTypes.shape({ empty: PropTypes.bool }),\n      ])\n    ),\n    model: PropTypes.shape({\n      categoriesPerRow: PropTypes.number,\n      choicesLabel: PropTypes.string,\n    }),\n    disabled: PropTypes.bool,\n    choicePosition: PropTypes.string,\n  };\n\n  static defaultProps = {\n    model: {\n      categoriesPerRow: 1,\n      choicesLabel: '',\n    },\n  };\n\n  render() {\n    const {\n      classes,\n      choices = [],\n      model,\n      disabled,\n      choicePosition,\n    } = this.props;\n    let style = {\n      textAlign: 'center',\n    };\n\n    if (choicePosition === 'left') {\n      style.direction = 'rtl';\n    }\n\n    return (\n      <div className={classes.wrapper}>\n        {model.choicesLabel && model.choicesLabel !== '' && (\n          <div className={classes.labelHolder} dangerouslySetInnerHTML={{__html: model.choicesLabel}}></div>\n        )}\n        <div className={classes.choices} style={style}>\n          {choices.map((c, index) => {\n            return c.empty ? (\n              <Blank key={index} />\n            ) : (\n              <Choice\n                disabled={disabled}\n                className={classes.choice}\n                key={index}\n                extraStyle={{ maxWidth: `${95 / model.categoriesPerRow}%` }}\n                {...c}\n              />\n            );\n          })}\n        </div>\n      </div>\n    );\n  }\n}\n\nconst styles = (theme) => ({\n  wrapper: {\n    flex: 1,\n    padding: theme.spacing.unit,\n  },\n  choices: {\n    padding: theme.spacing.unit / 2,\n    display: 'flex',\n    justifyContent: 'center',\n    alignItems: 'center',\n    flexWrap: 'wrap'\n  },\n  labelHolder: {\n    margin: '0 auto',\n    textAlign: 'center',\n    paddingTop: theme.spacing.unit,\n  },\n});\n\nexport default withStyles(styles)(Choices);\n"],"file":"choices.js"}

package/lib/categorize/droppable-placeholder.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.spec = exports.DroppablePlaceholder = void 0;
+exports.spec = exports["default"] = exports.DroppablePlaceholder = void 0;
 
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 
@@ -31,7 +31,7 @@ var _debug = _interopRequireDefault(require("debug"));
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 var log = (0, _debug["default"])('@pie-ui:categorize:droppable-placeholder');
 

package/lib/categorize/droppable-placeholder.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/categorize/droppable-placeholder.jsx"],"names":["log","DroppablePlaceholder","props","children","connectDropTarget","isOver","className","grid","disabled","flex","React","Component","PropTypes","func","isRequired","bool","oneOfType","arrayOf","node","string","object","spec","drop","monitor","item","getItem","onDropChoice","canDrop","WithTarget","uid","connect","dropTarget","withUid"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;;;;;AAEA,IAAMA,GAAG,GAAG,uBAAM,0CAAN,CAAZ;;IAEaC,oB;;;;;;;;;;;;WAYX,kBAAS;AAAA,wBAQH,KAAKC,KARF;AAAA,UAELC,QAFK,eAELA,QAFK;AAAA,UAGLC,iBAHK,eAGLA,iBAHK;AAAA,UAILC,MAJK,eAILA,MAJK;AAAA,UAKLC,SALK,eAKLA,SALK;AAAA,UAMLC,IANK,eAMLA,IANK;AAAA,UAOLC,QAPK,eAOLA,QAPK;AAUP,aAAOJ,iBAAiB,eACtB;AAAK,QAAA,KAAK,EAAE;AAAEK,UAAAA,IAAI,EAAE;AAAR;AAAZ,sBACE,gCAAC,iBAAD;AACE,QAAA,SAAS,EAAEH,SADb;AAEE,QAAA,MAAM,EAAED,MAFV;AAGE,QAAA,IAAI,EAAEE,IAHR;AAIE,QAAA,QAAQ,EAAEC;AAJZ,SAMGL,QANH,CADF,CADsB,CAAxB;AAYD;;;EAlCuCO,kBAAMC,S;;;iCAAnCV,oB,eACQ;AACjBG,EAAAA,iBAAiB,EAAEQ,sBAAUC,IAAV,CAAeC,UADjB;AAEjBT,EAAAA,MAAM,EAAEO,sBAAUG,IAFD;AAGjBZ,EAAAA,QAAQ,EAAES,sBAAUI,SAAV,CAAoB,CAC5BJ,sBAAUK,OAAV,CAAkBL,sBAAUM,IAA5B,CAD4B,EAE5BN,sBAAUM,IAFkB,CAApB,EAGPJ,UANc;AAOjBR,EAAAA,SAAS,EAAEM,sBAAUO,MAPJ;AAQjBZ,EAAAA,IAAI,EAAEK,sBAAUQ,MARC;AASjBZ,EAAAA,QAAQ,EAAEI,sBAAUG;AATH,C;AAoCd,IAAMM,IAAI,GAAG;AAClBC,EAAAA,IAAI,EAAE,cAACpB,KAAD,EAAQqB,OAAR,EAAoB;AACxBvB,IAAAA,GAAG,CAAC,gBAAD,EAAmBE,KAAnB,CAAH;AACA,QAAMsB,IAAI,GAAGD,OAAO,CAACE,OAAR,EAAb;AACAvB,IAAAA,KAAK,CAACwB,YAAN,CAAmBF,IAAnB;AACD,GALiB;AAMlBG,EAAAA,OAAO,EAAE,iBAACzB;AAAM;AAAP,IAAyB;AAChC,WAAO,CAACA,KAAK,CAACM,QAAd;AACD;AARiB,CAAb;;AAWP,IAAMoB,UAAU,GAAG,0BAAW;AAAA,MAAGC,GAAH,QAAGA,GAAH;AAAA,SAAaA,GAAb;AAAA,CAAX,EAA6BR,IAA7B,EAAmC,UAACS,OAAD,EAAUP,OAAV;AAAA,SAAuB;AAC3EnB,IAAAA,iBAAiB,EAAE0B,OAAO,CAACC,UAAR,EADwD;AAE3E1B,IAAAA,MAAM,EAAEkB,OAAO,CAAClB,MAAR;AAFmE,GAAvB;AAAA,CAAnC,EAGfJ,oBAHe,CAAnB;;eAKe4B,UAAIG,OAAJ,CAAYJ,UAAZ,C","sourcesContent":["import React from 'react';\nimport { PlaceHolder } from '@pie-lib/drag';\nimport PropTypes from 'prop-types';\nimport { DropTarget } from 'react-dnd';\nimport { uid } from '@pie-lib/drag';\nimport debug from 'debug';\n\nconst log = debug('@pie-ui:categorize:droppable-placeholder');\n\nexport class DroppablePlaceholder extends React.Component {\n  static propTypes = {\n    connectDropTarget: PropTypes.func.isRequired,\n    isOver: PropTypes.bool,\n    children: PropTypes.oneOfType([\n      PropTypes.arrayOf(PropTypes.node),\n      PropTypes.node\n    ]).isRequired,\n    className: PropTypes.string,\n    grid: PropTypes.object,\n    disabled: PropTypes.bool\n  };\n  render() {\n    const {\n      children,\n      connectDropTarget,\n      isOver,\n      className,\n      grid,\n      disabled\n    } = this.props;\n\n    return connectDropTarget(\n      <div style={{ flex: 1 }}>\n        <PlaceHolder\n          className={className}\n          isOver={isOver}\n          grid={grid}\n          disabled={disabled}\n        >\n          {children}\n        </PlaceHolder>\n      </div>\n    );\n  }\n}\n\nexport const spec = {\n  drop: (props, monitor) => {\n    log('[drop] props: ', props);\n    const item = monitor.getItem();\n    props.onDropChoice(item);\n  },\n  canDrop: (props /*, monitor*/) => {\n    return !props.disabled;\n  }\n};\n\nconst WithTarget = DropTarget(({ uid }) => uid, spec, (connect, monitor) => ({\n  connectDropTarget: connect.dropTarget(),\n  isOver: monitor.isOver()\n}))(DroppablePlaceholder);\n\nexport default uid.withUid(WithTarget);\n"],"file":"droppable-placeholder.js"}
+{"version":3,"sources":["../../src/categorize/droppable-placeholder.jsx"],"names":["log","DroppablePlaceholder","props","children","connectDropTarget","isOver","className","grid","disabled","flex","React","Component","PropTypes","func","isRequired","bool","oneOfType","arrayOf","node","string","object","spec","drop","monitor","item","getItem","onDropChoice","canDrop","WithTarget","uid","connect","dropTarget","withUid"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;;;;;AAEA,IAAMA,GAAG,GAAG,uBAAM,0CAAN,CAAZ;;IAEaC,oB;;;;;;;;;;;;WAYX,kBAAS;AACP,wBAOI,KAAKC,KAPT;AAAA,UACEC,QADF,eACEA,QADF;AAAA,UAEEC,iBAFF,eAEEA,iBAFF;AAAA,UAGEC,MAHF,eAGEA,MAHF;AAAA,UAIEC,SAJF,eAIEA,SAJF;AAAA,UAKEC,IALF,eAKEA,IALF;AAAA,UAMEC,QANF,eAMEA,QANF;AASA,aAAOJ,iBAAiB,eACtB;AAAK,QAAA,KAAK,EAAE;AAAEK,UAAAA,IAAI,EAAE;AAAR;AAAZ,sBACE,gCAAC,iBAAD;AACE,QAAA,SAAS,EAAEH,SADb;AAEE,QAAA,MAAM,EAAED,MAFV;AAGE,QAAA,IAAI,EAAEE,IAHR;AAIE,QAAA,QAAQ,EAAEC;AAJZ,SAMGL,QANH,CADF,CADsB,CAAxB;AAYD;;;EAlCuCO,kBAAMC,S;;;iCAAnCV,oB,eACQ;AACjBG,EAAAA,iBAAiB,EAAEQ,sBAAUC,IAAV,CAAeC,UADjB;AAEjBT,EAAAA,MAAM,EAAEO,sBAAUG,IAFD;AAGjBZ,EAAAA,QAAQ,EAAES,sBAAUI,SAAV,CAAoB,CAC5BJ,sBAAUK,OAAV,CAAkBL,sBAAUM,IAA5B,CAD4B,EAE5BN,sBAAUM,IAFkB,CAApB,EAGPJ,UANc;AAOjBR,EAAAA,SAAS,EAAEM,sBAAUO,MAPJ;AAQjBZ,EAAAA,IAAI,EAAEK,sBAAUQ,MARC;AASjBZ,EAAAA,QAAQ,EAAEI,sBAAUG;AATH,C;AAoCd,IAAMM,IAAI,GAAG;AAClBC,EAAAA,IAAI,EAAE,cAACpB,KAAD,EAAQqB,OAAR,EAAoB;AACxBvB,IAAAA,GAAG,CAAC,gBAAD,EAAmBE,KAAnB,CAAH;AACA,QAAMsB,IAAI,GAAGD,OAAO,CAACE,OAAR,EAAb;AACAvB,IAAAA,KAAK,CAACwB,YAAN,CAAmBF,IAAnB;AACD,GALiB;AAMlBG,EAAAA,OAAO,EAAE,iBAACzB;AAAM;AAAP,IAAyB;AAChC,WAAO,CAACA,KAAK,CAACM,QAAd;AACD;AARiB,CAAb;;AAWP,IAAMoB,UAAU,GAAG,0BAAW;AAAA,MAAGC,GAAH,QAAGA,GAAH;AAAA,SAAaA,GAAb;AAAA,CAAX,EAA6BR,IAA7B,EAAmC,UAACS,OAAD,EAAUP,OAAV;AAAA,SAAuB;AAC3EnB,IAAAA,iBAAiB,EAAE0B,OAAO,CAACC,UAAR,EADwD;AAE3E1B,IAAAA,MAAM,EAAEkB,OAAO,CAAClB,MAAR;AAFmE,GAAvB;AAAA,CAAnC,EAGfJ,oBAHe,CAAnB;;eAKe4B,UAAIG,OAAJ,CAAYJ,UAAZ,C","sourcesContent":["import React from 'react';\nimport { PlaceHolder } from '@pie-lib/drag';\nimport PropTypes from 'prop-types';\nimport { DropTarget } from 'react-dnd';\nimport { uid } from '@pie-lib/drag';\nimport debug from 'debug';\n\nconst log = debug('@pie-ui:categorize:droppable-placeholder');\n\nexport class DroppablePlaceholder extends React.Component {\n  static propTypes = {\n    connectDropTarget: PropTypes.func.isRequired,\n    isOver: PropTypes.bool,\n    children: PropTypes.oneOfType([\n      PropTypes.arrayOf(PropTypes.node),\n      PropTypes.node\n    ]).isRequired,\n    className: PropTypes.string,\n    grid: PropTypes.object,\n    disabled: PropTypes.bool\n  };\n  render() {\n    const {\n      children,\n      connectDropTarget,\n      isOver,\n      className,\n      grid,\n      disabled\n    } = this.props;\n\n    return connectDropTarget(\n      <div style={{ flex: 1 }}>\n        <PlaceHolder\n          className={className}\n          isOver={isOver}\n          grid={grid}\n          disabled={disabled}\n        >\n          {children}\n        </PlaceHolder>\n      </div>\n    );\n  }\n}\n\nexport const spec = {\n  drop: (props, monitor) => {\n    log('[drop] props: ', props);\n    const item = monitor.getItem();\n    props.onDropChoice(item);\n  },\n  canDrop: (props /*, monitor*/) => {\n    return !props.disabled;\n  }\n};\n\nconst WithTarget = DropTarget(({ uid }) => uid, spec, (connect, monitor) => ({\n  connectDropTarget: connect.dropTarget(),\n  isOver: monitor.isOver()\n}))(DroppablePlaceholder);\n\nexport default uid.withUid(WithTarget);\n"],"file":"droppable-placeholder.js"}

package/lib/categorize/grid-content.js

@@ -27,13 +27,13 @@ var _styles = require("@material-ui/core/styles");
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 var GridContent = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2["default"])(GridContent, _React$Component);

package/lib/categorize/grid-content.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/categorize/grid-content.jsx"],"names":["GridContent","props","classes","className","children","columns","extraStyle","rows","style","gridTemplateColumns","gridTemplateRows","gridContent","React","Component","PropTypes","object","isRequired","string","oneOfType","arrayOf","node","number","styles","theme","display","columnGap","spacing","unit","gridColumnGap","rowGap","gridRowGap","gridAutoRows"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;;;IAEaA,W;;;;;;;;;;;;WAiBX,kBAAS;AAAA,wBAC6D,KAAKC,KADlE;AAAA,UACCC,OADD,eACCA,OADD;AAAA,UACUC,SADV,eACUA,SADV;AAAA,UACqBC,QADrB,eACqBA,QADrB;AAAA,UAC+BC,OAD/B,eAC+BA,OAD/B;AAAA,UACwCC,UADxC,eACwCA,UADxC;AAAA,UACoDC,IADpD,eACoDA,IADpD;;AAEP,UAAMC,KAAK;AACTC,QAAAA,mBAAmB,mBAAYJ,OAAZ,WADV;AAETK,QAAAA,gBAAgB,mBAAYH,IAAZ;AAFP,SAGND,UAHM,CAAX;;AAMA,0BACE;AAAK,QAAA,KAAK,EAAEE,KAAZ;AAAmB,QAAA,SAAS,EAAE,4BAAWN,OAAO,CAACS,WAAnB,EAAgCR,SAAhC;AAA9B,SACGC,QADH,CADF;AAKD;;;EA9B8BQ,kBAAMC,S;;;iCAA1Bb,W,eACQ;AACjBE,EAAAA,OAAO,EAAEY,sBAAUC,MAAV,CAAiBC,UADT;AAEjBb,EAAAA,SAAS,EAAEW,sBAAUG,MAFJ;AAGjBb,EAAAA,QAAQ,EAAEU,sBAAUI,SAAV,CAAoB,CAC5BJ,sBAAUK,OAAV,CAAkBL,sBAAUM,IAA5B,CAD4B,EAE5BN,sBAAUM,IAFkB,CAApB,EAGPJ,UANc;AAOjBX,EAAAA,OAAO,EAAES,sBAAUO,MAPF;AAQjBd,EAAAA,IAAI,EAAEO,sBAAUO,MARC;AASjBf,EAAAA,UAAU,EAAEQ,sBAAUC;AATL,C;iCADRf,W,kBAYW;AACpBK,EAAAA,OAAO,EAAE,CADW;AAEpBE,EAAAA,IAAI,EAAE;AAFc,C;;AAqBxB,IAAMe,MAAM,GAAG,SAATA,MAAS,CAAAC,KAAK;AAAA,SAAK;AACvBZ,IAAAA,WAAW,EAAE;AACXa,MAAAA,OAAO,EAAE,MADE;AAEXC,MAAAA,SAAS,YAAKF,KAAK,CAACG,OAAN,CAAcC,IAAnB,OAFE;AAGXC,MAAAA,aAAa,YAAKL,KAAK,CAACG,OAAN,CAAcC,IAAnB,OAHF;AAIXE,MAAAA,MAAM,YAAKN,KAAK,CAACG,OAAN,CAAcC,IAAnB,OAJK;AAKXG,MAAAA,UAAU,YAAKP,KAAK,CAACG,OAAN,CAAcC,IAAnB,OALC;AAMXI,MAAAA,YAAY,EAAE;AANH;AADU,GAAL;AAAA,CAApB;;eAWe,wBAAWT,MAAX,EAAmBtB,WAAnB,C","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\n\nexport class GridContent extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    children: PropTypes.oneOfType([\n      PropTypes.arrayOf(PropTypes.node),\n      PropTypes.node\n    ]).isRequired,\n    columns: PropTypes.number,\n    rows: PropTypes.number,\n    extraStyle: PropTypes.object\n  };\n  static defaultProps = {\n    columns: 2,\n    rows: 2,\n  };\n\n  render() {\n    const { classes, className, children, columns, extraStyle, rows } = this.props;\n    const style = {\n      gridTemplateColumns: `repeat(${columns}, 1fr)`,\n      gridTemplateRows: `repeat(${rows}, auto)`,\n      ...extraStyle\n    };\n\n    return (\n      <div style={style} className={classNames(classes.gridContent, className)}>\n        {children}\n      </div>\n    );\n  }\n}\n\nconst styles = theme => ({\n  gridContent: {\n    display: 'grid',\n    columnGap: `${theme.spacing.unit}px`,\n    gridColumnGap: `${theme.spacing.unit}px`,\n    rowGap: `${theme.spacing.unit}px`,\n    gridRowGap: `${theme.spacing.unit}px`,\n    gridAutoRows: '1fr'\n  }\n});\n\nexport default withStyles(styles)(GridContent);\n"],"file":"grid-content.js"}
+{"version":3,"sources":["../../src/categorize/grid-content.jsx"],"names":["GridContent","props","classes","className","children","columns","extraStyle","rows","style","gridTemplateColumns","gridTemplateRows","gridContent","React","Component","PropTypes","object","isRequired","string","oneOfType","arrayOf","node","number","styles","theme","display","columnGap","spacing","unit","gridColumnGap","rowGap","gridRowGap","gridAutoRows"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;;;IAEaA,W;;;;;;;;;;;;WAiBX,kBAAS;AACP,wBAAoE,KAAKC,KAAzE;AAAA,UAAQC,OAAR,eAAQA,OAAR;AAAA,UAAiBC,SAAjB,eAAiBA,SAAjB;AAAA,UAA4BC,QAA5B,eAA4BA,QAA5B;AAAA,UAAsCC,OAAtC,eAAsCA,OAAtC;AAAA,UAA+CC,UAA/C,eAA+CA,UAA/C;AAAA,UAA2DC,IAA3D,eAA2DA,IAA3D;;AACA,UAAMC,KAAK;AACTC,QAAAA,mBAAmB,mBAAYJ,OAAZ,WADV;AAETK,QAAAA,gBAAgB,mBAAYH,IAAZ;AAFP,SAGND,UAHM,CAAX;;AAMA,0BACE;AAAK,QAAA,KAAK,EAAEE,KAAZ;AAAmB,QAAA,SAAS,EAAE,4BAAWN,OAAO,CAACS,WAAnB,EAAgCR,SAAhC;AAA9B,SACGC,QADH,CADF;AAKD;;;EA9B8BQ,kBAAMC,S;;;iCAA1Bb,W,eACQ;AACjBE,EAAAA,OAAO,EAAEY,sBAAUC,MAAV,CAAiBC,UADT;AAEjBb,EAAAA,SAAS,EAAEW,sBAAUG,MAFJ;AAGjBb,EAAAA,QAAQ,EAAEU,sBAAUI,SAAV,CAAoB,CAC5BJ,sBAAUK,OAAV,CAAkBL,sBAAUM,IAA5B,CAD4B,EAE5BN,sBAAUM,IAFkB,CAApB,EAGPJ,UANc;AAOjBX,EAAAA,OAAO,EAAES,sBAAUO,MAPF;AAQjBd,EAAAA,IAAI,EAAEO,sBAAUO,MARC;AASjBf,EAAAA,UAAU,EAAEQ,sBAAUC;AATL,C;iCADRf,W,kBAYW;AACpBK,EAAAA,OAAO,EAAE,CADW;AAEpBE,EAAAA,IAAI,EAAE;AAFc,C;;AAqBxB,IAAMe,MAAM,GAAG,SAATA,MAAS,CAAAC,KAAK;AAAA,SAAK;AACvBZ,IAAAA,WAAW,EAAE;AACXa,MAAAA,OAAO,EAAE,MADE;AAEXC,MAAAA,SAAS,YAAKF,KAAK,CAACG,OAAN,CAAcC,IAAnB,OAFE;AAGXC,MAAAA,aAAa,YAAKL,KAAK,CAACG,OAAN,CAAcC,IAAnB,OAHF;AAIXE,MAAAA,MAAM,YAAKN,KAAK,CAACG,OAAN,CAAcC,IAAnB,OAJK;AAKXG,MAAAA,UAAU,YAAKP,KAAK,CAACG,OAAN,CAAcC,IAAnB,OALC;AAMXI,MAAAA,YAAY,EAAE;AANH;AADU,GAAL;AAAA,CAApB;;eAWe,wBAAWT,MAAX,EAAmBtB,WAAnB,C","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\n\nexport class GridContent extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    children: PropTypes.oneOfType([\n      PropTypes.arrayOf(PropTypes.node),\n      PropTypes.node\n    ]).isRequired,\n    columns: PropTypes.number,\n    rows: PropTypes.number,\n    extraStyle: PropTypes.object\n  };\n  static defaultProps = {\n    columns: 2,\n    rows: 2,\n  };\n\n  render() {\n    const { classes, className, children, columns, extraStyle, rows } = this.props;\n    const style = {\n      gridTemplateColumns: `repeat(${columns}, 1fr)`,\n      gridTemplateRows: `repeat(${rows}, auto)`,\n      ...extraStyle\n    };\n\n    return (\n      <div style={style} className={classNames(classes.gridContent, className)}>\n        {children}\n      </div>\n    );\n  }\n}\n\nconst styles = theme => ({\n  gridContent: {\n    display: 'grid',\n    columnGap: `${theme.spacing.unit}px`,\n    gridColumnGap: `${theme.spacing.unit}px`,\n    rowGap: `${theme.spacing.unit}px`,\n    gridRowGap: `${theme.spacing.unit}px`,\n    gridAutoRows: '1fr'\n  }\n});\n\nexport default withStyles(styles)(GridContent);\n"],"file":"grid-content.js"}

package/lib/categorize/index.js

@@ -43,7 +43,7 @@ var _debug = _interopRequireDefault(require("debug"));
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 var log = (0, _debug["default"])('@pie-ui:categorize');
 
@@ -164,25 +164,23 @@ var Categorize = /*#__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
       })), /*#__PURE__*/_react["default"].createElement("br", null)), /*#__PURE__*/_react["default"].createElement(_correctAnswerToggle["default"], {
         show: showCorrect || correct === false,
         toggled: showCorrect,
         onToggle: this.toggleShowCorrect
       }), model.prompt && removeHTMLTags(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.categorize,
         style: style
       }, /*#__PURE__*/_react["default"].createElement("div", {
         style: {
-          display: 'flex'
+          display: 'flex',
+          flex: 1
         }
       }, rowLabels && nbOfRows && /*#__PURE__*/_react["default"].createElement("div", {
         style: {
@@ -223,10 +221,8 @@ var Categorize = /*#__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.correctness && model.feedback && !showCorrect && /*#__PURE__*/_react["default"].createElement(_renderUi.Feedback, {
         correctness: model.correctness,
         feedback: model.feedback

package/lib/categorize/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/categorize/index.jsx"],"names":["log","removeHTMLTags","html","tmp","document","createElement","innerHTML","value","textContent","innerText","trim","Categorize","props","categoryId","draggedChoice","session","onAnswersChange","answers","id","choiceIndex","c","setState","showCorrect","state","onShowCorrectToggle","choicePosition","flexDirection","classes","model","choicesPosition","note","showNote","env","mode","role","style","getPositionDirection","categories","choices","correctResponse","correct","disabled","rowLabels","categoriesPerRow","nbOfRows","Math","ceil","length","displayNote","mainContainer","teacherInstructions","hidden","visible","collapsible","__html","toggleShowCorrect","prompt","categorize","display","marginRight","slice","map","label","index","alignItems","justifyContent","dropChoice","removeChoice","rationale","correctness","feedback","React","Component","PropTypes","object","isRequired","shape","arrayOf","choice","string","category","func","CategorizeProvider","uid","generateId","styles","theme","padding","spacing","unit","color","text","backgroundColor","background","marginBottom","verticalAlign","paddingBottom"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Choices from './choices';\nimport Categories from './categories';\nimport CorrectAnswerToggle from '@pie-lib/correct-answer-toggle';\nimport { withStyles } from '@material-ui/core/styles';\nimport {\n  buildState,\n  removeChoiceFromCategory,\n  moveChoiceToCategory\n} from '@pie-lib/categorize';\nimport { withDragContext, uid } from '@pie-lib/drag';\nimport { color, Feedback, Collapsible, hasText } from '@pie-lib/render-ui';\nimport debug from 'debug';\n\nconst log = debug('@pie-ui:categorize');\n\nconst removeHTMLTags = html => {\n  const tmp = document.createElement('DIV');\n\n  tmp.innerHTML = html;\n\n  const value = tmp.textContent || tmp.innerText || '';\n\n  return value.trim();\n};\n\nexport class Categorize extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    model: PropTypes.object,\n    session: PropTypes.shape({\n      answers: PropTypes.arrayOf(\n        PropTypes.shape({\n          choice: PropTypes.string,\n          category: PropTypes.string\n        })\n      )\n    }),\n    onAnswersChange: PropTypes.func.isRequired,\n    onShowCorrectToggle: PropTypes.func.isRequired\n  };\n\n  static defaultProps = {\n    disabled: false\n  };\n\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      showCorrect: false\n    };\n  }\n\n  dropChoice = (categoryId, draggedChoice) => {\n    const { session, onAnswersChange } = this.props;\n    log(\n      '[dropChoice] category: ',\n      draggedChoice.categoryId,\n      'choice: ',\n      draggedChoice\n    );\n\n    const answers = moveChoiceToCategory(\n      draggedChoice.id,\n      draggedChoice.categoryId,\n      categoryId,\n      draggedChoice.choiceIndex,\n      session.answers\n    );\n\n    onAnswersChange(answers);\n  };\n\n  removeChoice = c => {\n    log('[removeChoice]: ', c);\n    const { onAnswersChange, session } = this.props;\n    const answers = removeChoiceFromCategory(\n      c.id,\n      c.categoryId,\n      c.choiceIndex,\n      session.answers\n    );\n    onAnswersChange(answers);\n  };\n\n  UNSAFE_componentWillReceiveProps() {\n    this.setState({ showCorrect: false });\n  }\n\n  toggleShowCorrect = () =>\n    this.setState({ showCorrect: !this.state.showCorrect }, () => {\n      this.props.onShowCorrectToggle();\n    });\n\n  getPositionDirection = (choicePosition) => {\n    let flexDirection;\n\n    switch (choicePosition) {\n      case 'left':\n        flexDirection = 'row-reverse';\n        break;\n      case 'right':\n        flexDirection = 'row';\n        break;\n      case 'below':\n        flexDirection = 'column';\n        break;\n      default:\n        // above\n        flexDirection = 'column-reverse';\n        break;\n    }\n\n    return flexDirection;\n  };\n\n  render() {\n    const { classes, model, session } = this.props;\n    const { showCorrect } = this.state;\n    const { choicesPosition, note, showNote, env } = model;\n    const { mode, role } = env || {};\n    const choicePosition = choicesPosition || 'above';\n\n    const style = {\n      flexDirection: this.getPositionDirection(choicePosition)\n    };\n\n    const { categories, choices, correct } = buildState(\n      model.categories,\n      model.choices,\n      showCorrect ? model.correctResponse : session.answers,\n      model.correctResponse\n    );\n\n    log('[render] disabled: ', model.disabled);\n\n    const { rowLabels, categoriesPerRow } = model;\n    const nbOfRows = categories && Math.ceil(categories.length / categoriesPerRow) || 0;\n    const displayNote = (showCorrect || mode === 'view' && role === 'instructor') && showNote && note;\n\n    return (\n      <div className={classes.mainContainer}>\n        {\n          model.teacherInstructions && hasText(model.teacherInstructions) && (\n            <React.Fragment>\n              <Collapsible\n                labels={{ hidden: 'Show Teacher Instructions', visible: 'Hide Teacher Instructions' }}\n                className={classes.collapsible}\n              >\n                <div dangerouslySetInnerHTML={{ __html: model.teacherInstructions }}/>\n              </Collapsible>\n              <br />\n            </React.Fragment>\n          )\n        }\n        <CorrectAnswerToggle\n          show={showCorrect || correct === false}\n          toggled={showCorrect}\n          onToggle={this.toggleShowCorrect}\n        />\n        {\n          model.prompt && removeHTMLTags(model.prompt) &&\n          <div\n            className={classes.prompt}\n            dangerouslySetInnerHTML={{ __html: model.prompt }}\n          />\n        }\n        <div className={classes.categorize} style={style}>\n          <div style={{ display: 'flex' }}>\n            {\n              rowLabels && nbOfRows && (\n                <div style={{ display: 'grid', marginRight: '20px' }}>\n                  {rowLabels.slice(0, nbOfRows).map((label, index) => (\n                    <div\n                      key={index}\n                      style={{\n                        alignItems: 'center',\n                        display: 'flex',\n                        justifyContent: 'center'\n                      }}\n                      dangerouslySetInnerHTML={{\n                        __html: label\n                      }}\n                    />\n                  ))}\n                </div>\n              )\n            }\n            <Categories\n              model={model}\n              disabled={model.disabled}\n              categories={categories}\n              onDropChoice={this.dropChoice}\n              onRemoveChoice={this.removeChoice}\n            />\n          </div>\n          <Choices\n            disabled={model.disabled}\n            model={model}\n            choices={choices}\n            choicePosition={choicePosition}\n          />\n        </div>\n        {displayNote && (\n          <div\n            className={classes.note}\n            dangerouslySetInnerHTML={{ __html: `<strong>Note:</strong> ${note}` }}\n          />\n        )}\n        {\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        }\n        {\n          model.correctness &&\n          model.feedback &&\n          !showCorrect && (\n            <Feedback\n              correctness={model.correctness}\n              feedback={model.feedback}\n            />\n          )\n        }\n      </div>\n    );\n  }\n}\n\nclass CategorizeProvider extends React.Component {\n  constructor(props) {\n    super(props);\n    this.uid = uid.generateId();\n  }\n\n  render() {\n    return (\n      <uid.Provider value={this.uid}>\n        <Categorize { ...this.props } />\n      </uid.Provider>\n    );\n  }\n}\n\nconst styles = (theme) => ({\n  mainContainer: {\n    padding: theme.spacing.unit,\n    color: color.text(),\n    backgroundColor: color.background()\n  },\n  prompt: {\n    marginBottom: '35px',\n    verticalAlign: 'middle'\n  },\n  note: {\n    padding: '5px 0'\n  },\n  categorize: {\n    marginBottom: theme.spacing.unit,\n    display: 'flex',\n    flexDirection: 'column'\n  },\n  collapsible: {\n    paddingBottom: theme.spacing.unit * 2\n  }\n});\n\nexport default withDragContext(withStyles(styles)(CategorizeProvider));\n"],"file":"index.js"}
+{"version":3,"sources":["../../src/categorize/index.jsx"],"names":["log","removeHTMLTags","html","tmp","document","createElement","innerHTML","value","textContent","innerText","trim","Categorize","props","categoryId","draggedChoice","session","onAnswersChange","answers","id","choiceIndex","c","setState","showCorrect","state","onShowCorrectToggle","choicePosition","flexDirection","classes","model","choicesPosition","note","showNote","env","mode","role","style","getPositionDirection","categories","choices","correctResponse","correct","disabled","rowLabels","categoriesPerRow","nbOfRows","Math","ceil","length","displayNote","mainContainer","teacherInstructions","hidden","visible","collapsible","toggleShowCorrect","prompt","categorize","display","flex","marginRight","slice","map","label","index","alignItems","justifyContent","__html","dropChoice","removeChoice","rationale","correctness","feedback","React","Component","PropTypes","object","isRequired","shape","arrayOf","choice","string","category","func","CategorizeProvider","uid","generateId","styles","theme","padding","spacing","unit","color","text","backgroundColor","background","marginBottom","verticalAlign","paddingBottom"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAKA;;AACA;;AACA;;;;;;AAEA,IAAMA,GAAG,GAAG,uBAAM,oBAAN,CAAZ;;AAEA,IAAMC,cAAc,GAAG,SAAjBA,cAAiB,CAAAC,IAAI,EAAI;AAC7B,MAAMC,GAAG,GAAGC,QAAQ,CAACC,aAAT,CAAuB,KAAvB,CAAZ;AAEAF,EAAAA,GAAG,CAACG,SAAJ,GAAgBJ,IAAhB;AAEA,MAAMK,KAAK,GAAGJ,GAAG,CAACK,WAAJ,IAAmBL,GAAG,CAACM,SAAvB,IAAoC,EAAlD;AAEA,SAAOF,KAAK,CAACG,IAAN,EAAP;AACD,CARD;;IAUaC,U;;;;;AAoBX,sBAAYC,KAAZ,EAAmB;AAAA;;AAAA;AACjB,8BAAMA,KAAN;AADiB,mGAQN,UAACC,UAAD,EAAaC,aAAb,EAA+B;AAC1C,wBAAqC,MAAKF,KAA1C;AAAA,UAAQG,OAAR,eAAQA,OAAR;AAAA,UAAiBC,eAAjB,eAAiBA,eAAjB;AACAhB,MAAAA,GAAG,CACD,yBADC,EAEDc,aAAa,CAACD,UAFb,EAGD,UAHC,EAIDC,aAJC,CAAH;AAOA,UAAMG,OAAO,GAAG,sCACdH,aAAa,CAACI,EADA,EAEdJ,aAAa,CAACD,UAFA,EAGdA,UAHc,EAIdC,aAAa,CAACK,WAJA,EAKdJ,OAAO,CAACE,OALM,CAAhB;AAQAD,MAAAA,eAAe,CAACC,OAAD,CAAf;AACD,KA1BkB;AAAA,qGA4BJ,UAAAG,CAAC,EAAI;AAClBpB,MAAAA,GAAG,CAAC,kBAAD,EAAqBoB,CAArB,CAAH;AACA,yBAAqC,MAAKR,KAA1C;AAAA,UAAQI,eAAR,gBAAQA,eAAR;AAAA,UAAyBD,OAAzB,gBAAyBA,OAAzB;AACA,UAAME,OAAO,GAAG,0CACdG,CAAC,CAACF,EADY,EAEdE,CAAC,CAACP,UAFY,EAGdO,CAAC,CAACD,WAHY,EAIdJ,OAAO,CAACE,OAJM,CAAhB;AAMAD,MAAAA,eAAe,CAACC,OAAD,CAAf;AACD,KAtCkB;AAAA,0GA4CC;AAAA,aAClB,MAAKI,QAAL,CAAc;AAAEC,QAAAA,WAAW,EAAE,CAAC,MAAKC,KAAL,CAAWD;AAA3B,OAAd,EAAwD,YAAM;AAC5D,cAAKV,KAAL,CAAWY,mBAAX;AACD,OAFD,CADkB;AAAA,KA5CD;AAAA,6GAiDI,UAACC,cAAD,EAAoB;AACzC,UAAIC,aAAJ;;AAEA,cAAQD,cAAR;AACE,aAAK,MAAL;AACEC,UAAAA,aAAa,GAAG,aAAhB;AACA;;AACF,aAAK,OAAL;AACEA,UAAAA,aAAa,GAAG,KAAhB;AACA;;AACF,aAAK,OAAL;AACEA,UAAAA,aAAa,GAAG,QAAhB;AACA;;AACF;AACE;AACAA,UAAAA,aAAa,GAAG,gBAAhB;AACA;AAbJ;;AAgBA,aAAOA,aAAP;AACD,KArEkB;AAGjB,UAAKH,KAAL,GAAa;AACXD,MAAAA,WAAW,EAAE;AADF,KAAb;AAHiB;AAMlB;;;;WAkCD,4CAAmC;AACjC,WAAKD,QAAL,CAAc;AAAEC,QAAAA,WAAW,EAAE;AAAf,OAAd;AACD;;;WA6BD,kBAAS;AACP,yBAAoC,KAAKV,KAAzC;AAAA,UAAQe,OAAR,gBAAQA,OAAR;AAAA,UAAiBC,KAAjB,gBAAiBA,KAAjB;AAAA,UAAwBb,OAAxB,gBAAwBA,OAAxB;AACA,UAAQO,WAAR,GAAwB,KAAKC,KAA7B,CAAQD,WAAR;AACA,UAAQO,eAAR,GAAiDD,KAAjD,CAAQC,eAAR;AAAA,UAAyBC,IAAzB,GAAiDF,KAAjD,CAAyBE,IAAzB;AAAA,UAA+BC,QAA/B,GAAiDH,KAAjD,CAA+BG,QAA/B;AAAA,UAAyCC,GAAzC,GAAiDJ,KAAjD,CAAyCI,GAAzC;;AACA,iBAAuBA,GAAG,IAAI,EAA9B;AAAA,UAAQC,IAAR,QAAQA,IAAR;AAAA,UAAcC,IAAd,QAAcA,IAAd;;AACA,UAAMT,cAAc,GAAGI,eAAe,IAAI,OAA1C;AAEA,UAAMM,KAAK,GAAG;AACZT,QAAAA,aAAa,EAAE,KAAKU,oBAAL,CAA0BX,cAA1B;AADH,OAAd;;AAIA,wBAAyC,4BACvCG,KAAK,CAACS,UADiC,EAEvCT,KAAK,CAACU,OAFiC,EAGvChB,WAAW,GAAGM,KAAK,CAACW,eAAT,GAA2BxB,OAAO,CAACE,OAHP,EAIvCW,KAAK,CAACW,eAJiC,CAAzC;AAAA,UAAQF,UAAR,eAAQA,UAAR;AAAA,UAAoBC,OAApB,eAAoBA,OAApB;AAAA,UAA6BE,OAA7B,eAA6BA,OAA7B;;AAOAxC,MAAAA,GAAG,CAAC,qBAAD,EAAwB4B,KAAK,CAACa,QAA9B,CAAH;AAEA,UAAQC,SAAR,GAAwCd,KAAxC,CAAQc,SAAR;AAAA,UAAmBC,gBAAnB,GAAwCf,KAAxC,CAAmBe,gBAAnB;AACA,UAAMC,QAAQ,GAAGP,UAAU,IAAIQ,IAAI,CAACC,IAAL,CAAUT,UAAU,CAACU,MAAX,GAAoBJ,gBAA9B,CAAd,IAAiE,CAAlF;AACA,UAAMK,WAAW,GAAG,CAAC1B,WAAW,IAAIW,IAAI,KAAK,MAAT,IAAmBC,IAAI,KAAK,YAA5C,KAA6DH,QAA7D,IAAyED,IAA7F;AAEA,0BACE;AAAK,QAAA,SAAS,EAAEH,OAAO,CAACsB;AAAxB,SAEIrB,KAAK,CAACsB,mBAAN,IAA6B,uBAAQtB,KAAK,CAACsB,mBAAd,CAA7B,iBACE,gCAAC,iBAAD,CAAO,QAAP,qBACE,gCAAC,qBAAD;AACE,QAAA,MAAM,EAAE;AAAEC,UAAAA,MAAM,EAAE,2BAAV;AAAuCC,UAAAA,OAAO,EAAE;AAAhD,SADV;AAEE,QAAA,SAAS,EAAEzB,OAAO,CAAC0B;AAFrB,sBAIE,gCAAC,uBAAD;AAAe,QAAA,MAAM,EAAEzB,KAAK,CAACsB;AAA7B,QAJF,CADF,eAOE,2CAPF,CAHN,eAcE,gCAAC,+BAAD;AACE,QAAA,IAAI,EAAE5B,WAAW,IAAIkB,OAAO,KAAK,KADnC;AAEE,QAAA,OAAO,EAAElB,WAFX;AAGE,QAAA,QAAQ,EAAE,KAAKgC;AAHjB,QAdF,EAoBI1B,KAAK,CAAC2B,MAAN,IAAgBtD,cAAc,CAAC2B,KAAK,CAAC2B,MAAP,CAA9B,iBACA;AACE,QAAA,SAAS,EAAE5B,OAAO,CAAC4B;AADrB,sBAGE,gCAAC,uBAAD;AAAe,QAAA,MAAM,EAAE3B,KAAK,CAAC2B;AAA7B,QAHF,CArBJ,eA2BE;AAAK,QAAA,SAAS,EAAE5B,OAAO,CAAC6B,UAAxB;AAAoC,QAAA,KAAK,EAAErB;AAA3C,sBACE;AAAK,QAAA,KAAK,EAAE;AAAEsB,UAAAA,OAAO,EAAE,MAAX;AAAmBC,UAAAA,IAAI,EAAE;AAAzB;AAAZ,SAEIhB,SAAS,IAAIE,QAAb,iBACE;AAAK,QAAA,KAAK,EAAE;AAAEa,UAAAA,OAAO,EAAE,MAAX;AAAmBE,UAAAA,WAAW,EAAE;AAAhC;AAAZ,SACGjB,SAAS,CAACkB,KAAV,CAAgB,CAAhB,EAAmBhB,QAAnB,EAA6BiB,GAA7B,CAAiC,UAACC,KAAD,EAAQC,KAAR;AAAA,4BAChC;AACE,UAAA,GAAG,EAAEA,KADP;AAEE,UAAA,KAAK,EAAE;AACLC,YAAAA,UAAU,EAAE,QADP;AAELP,YAAAA,OAAO,EAAE,MAFJ;AAGLQ,YAAAA,cAAc,EAAE;AAHX,WAFT;AAOE,UAAA,uBAAuB,EAAE;AACvBC,YAAAA,MAAM,EAAEJ;AADe;AAP3B,UADgC;AAAA,OAAjC,CADH,CAHN,eAoBE,gCAAC,sBAAD;AACE,QAAA,KAAK,EAAElC,KADT;AAEE,QAAA,QAAQ,EAAEA,KAAK,CAACa,QAFlB;AAGE,QAAA,UAAU,EAAEJ,UAHd;AAIE,QAAA,YAAY,EAAE,KAAK8B,UAJrB;AAKE,QAAA,cAAc,EAAE,KAAKC;AALvB,QApBF,CADF,eA6BE,gCAAC,mBAAD;AACE,QAAA,QAAQ,EAAExC,KAAK,CAACa,QADlB;AAEE,QAAA,KAAK,EAAEb,KAFT;AAGE,QAAA,OAAO,EAAEU,OAHX;AAIE,QAAA,cAAc,EAAEb;AAJlB,QA7BF,CA3BF,EA+DGuB,WAAW,iBACV;AACE,QAAA,SAAS,EAAErB,OAAO,CAACG,IADrB;AAEE,QAAA,uBAAuB,EAAE;AAAEoC,UAAAA,MAAM,mCAA4BpC,IAA5B;AAAR;AAF3B,QAhEJ,EAsEIF,KAAK,CAACyC,SAAN,IAAmB,uBAAQzC,KAAK,CAACyC,SAAd,CAAnB,iBACE,gCAAC,qBAAD;AACE,QAAA,MAAM,EAAE;AAAElB,UAAAA,MAAM,EAAE,gBAAV;AAA4BC,UAAAA,OAAO,EAAE;AAArC,SADV;AAEE,QAAA,SAAS,EAAEzB,OAAO,CAAC0B;AAFrB,sBAIE,gCAAC,uBAAD;AAAe,QAAA,MAAM,EAAEzB,KAAK,CAACyC;AAA7B,QAJF,CAvEN,EAgFIzC,KAAK,CAAC0C,WAAN,IACA1C,KAAK,CAAC2C,QADN,IAEA,CAACjD,WAFD,iBAGE,gCAAC,kBAAD;AACE,QAAA,WAAW,EAAEM,KAAK,CAAC0C,WADrB;AAEE,QAAA,QAAQ,EAAE1C,KAAK,CAAC2C;AAFlB,QAnFN,CADF;AA4FD;;;EA/M6BC,kBAAMC,S;;;iCAAzB9D,U,eACQ;AACjBgB,EAAAA,OAAO,EAAE+C,sBAAUC,MAAV,CAAiBC,UADT;AAEjBhD,EAAAA,KAAK,EAAE8C,sBAAUC,MAFA;AAGjB5D,EAAAA,OAAO,EAAE2D,sBAAUG,KAAV,CAAgB;AACvB5D,IAAAA,OAAO,EAAEyD,sBAAUI,OAAV,CACPJ,sBAAUG,KAAV,CAAgB;AACdE,MAAAA,MAAM,EAAEL,sBAAUM,MADJ;AAEdC,MAAAA,QAAQ,EAAEP,sBAAUM;AAFN,KAAhB,CADO;AADc,GAAhB,CAHQ;AAWjBhE,EAAAA,eAAe,EAAE0D,sBAAUQ,IAAV,CAAeN,UAXf;AAYjBpD,EAAAA,mBAAmB,EAAEkD,sBAAUQ,IAAV,CAAeN;AAZnB,C;iCADRjE,U,kBAgBW;AACpB8B,EAAAA,QAAQ,EAAE;AADU,C;;IAkMlB0C,kB;;;;;AACJ,8BAAYvE,KAAZ,EAAmB;AAAA;;AAAA;AACjB,gCAAMA,KAAN;AACA,WAAKwE,GAAL,GAAWA,UAAIC,UAAJ,EAAX;AAFiB;AAGlB;;;;WAED,kBAAS;AACP,0BACE,gCAAC,SAAD,CAAK,QAAL;AAAc,QAAA,KAAK,EAAE,KAAKD;AAA1B,sBACE,gCAAC,UAAD,EAAiB,KAAKxE,KAAtB,CADF,CADF;AAKD;;;EAZ8B4D,kBAAMC,S;;AAevC,IAAMa,MAAM,GAAG,SAATA,MAAS,CAACC,KAAD;AAAA,SAAY;AACzBtC,IAAAA,aAAa,EAAE;AACbuC,MAAAA,OAAO,EAAED,KAAK,CAACE,OAAN,CAAcC,IADV;AAEbC,MAAAA,KAAK,EAAEA,gBAAMC,IAAN,EAFM;AAGbC,MAAAA,eAAe,EAAEF,gBAAMG,UAAN;AAHJ,KADU;AAMzBvC,IAAAA,MAAM,EAAE;AACNwC,MAAAA,YAAY,EAAE,MADR;AAENC,MAAAA,aAAa,EAAE;AAFT,KANiB;AAUzBlE,IAAAA,IAAI,EAAE;AACJ0D,MAAAA,OAAO,EAAE;AADL,KAVmB;AAazBhC,IAAAA,UAAU,EAAE;AACVuC,MAAAA,YAAY,EAAER,KAAK,CAACE,OAAN,CAAcC,IADlB;AAEVjC,MAAAA,OAAO,EAAE,MAFC;AAGV/B,MAAAA,aAAa,EAAE;AAHL,KAba;AAkBzB2B,IAAAA,WAAW,EAAE;AACX4C,MAAAA,aAAa,EAAEV,KAAK,CAACE,OAAN,CAAcC,IAAd,GAAqB;AADzB;AAlBY,GAAZ;AAAA,CAAf;;eAuBe,2BAAgB,wBAAWJ,MAAX,EAAmBH,kBAAnB,CAAhB,C","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Choices from './choices';\nimport Categories from './categories';\nimport CorrectAnswerToggle from '@pie-lib/correct-answer-toggle';\nimport { withStyles } from '@material-ui/core/styles';\nimport {\n  buildState,\n  removeChoiceFromCategory,\n  moveChoiceToCategory\n} from '@pie-lib/categorize';\nimport { withDragContext, uid } from '@pie-lib/drag';\nimport {color, Feedback, Collapsible, hasText, PreviewPrompt} from '@pie-lib/render-ui';\nimport debug from 'debug';\n\nconst log = debug('@pie-ui:categorize');\n\nconst removeHTMLTags = html => {\n  const tmp = document.createElement('DIV');\n\n  tmp.innerHTML = html;\n\n  const value = tmp.textContent || tmp.innerText || '';\n\n  return value.trim();\n};\n\nexport class Categorize extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    model: PropTypes.object,\n    session: PropTypes.shape({\n      answers: PropTypes.arrayOf(\n        PropTypes.shape({\n          choice: PropTypes.string,\n          category: PropTypes.string\n        })\n      )\n    }),\n    onAnswersChange: PropTypes.func.isRequired,\n    onShowCorrectToggle: PropTypes.func.isRequired\n  };\n\n  static defaultProps = {\n    disabled: false\n  };\n\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      showCorrect: false\n    };\n  }\n\n  dropChoice = (categoryId, draggedChoice) => {\n    const { session, onAnswersChange } = this.props;\n    log(\n      '[dropChoice] category: ',\n      draggedChoice.categoryId,\n      'choice: ',\n      draggedChoice\n    );\n\n    const answers = moveChoiceToCategory(\n      draggedChoice.id,\n      draggedChoice.categoryId,\n      categoryId,\n      draggedChoice.choiceIndex,\n      session.answers\n    );\n\n    onAnswersChange(answers);\n  };\n\n  removeChoice = c => {\n    log('[removeChoice]: ', c);\n    const { onAnswersChange, session } = this.props;\n    const answers = removeChoiceFromCategory(\n      c.id,\n      c.categoryId,\n      c.choiceIndex,\n      session.answers\n    );\n    onAnswersChange(answers);\n  };\n\n  UNSAFE_componentWillReceiveProps() {\n    this.setState({ showCorrect: false });\n  }\n\n  toggleShowCorrect = () =>\n    this.setState({ showCorrect: !this.state.showCorrect }, () => {\n      this.props.onShowCorrectToggle();\n    });\n\n  getPositionDirection = (choicePosition) => {\n    let flexDirection;\n\n    switch (choicePosition) {\n      case 'left':\n        flexDirection = 'row-reverse';\n        break;\n      case 'right':\n        flexDirection = 'row';\n        break;\n      case 'below':\n        flexDirection = 'column';\n        break;\n      default:\n        // above\n        flexDirection = 'column-reverse';\n        break;\n    }\n\n    return flexDirection;\n  };\n\n  render() {\n    const { classes, model, session } = this.props;\n    const { showCorrect } = this.state;\n    const { choicesPosition, note, showNote, env } = model;\n    const { mode, role } = env || {};\n    const choicePosition = choicesPosition || 'above';\n\n    const style = {\n      flexDirection: this.getPositionDirection(choicePosition)\n    };\n\n    const { categories, choices, correct } = buildState(\n      model.categories,\n      model.choices,\n      showCorrect ? model.correctResponse : session.answers,\n      model.correctResponse\n    );\n\n    log('[render] disabled: ', model.disabled);\n\n    const { rowLabels, categoriesPerRow } = model;\n    const nbOfRows = categories && Math.ceil(categories.length / categoriesPerRow) || 0;\n    const displayNote = (showCorrect || mode === 'view' && role === 'instructor') && showNote && note;\n\n    return (\n      <div className={classes.mainContainer}>\n        {\n          model.teacherInstructions && hasText(model.teacherInstructions) && (\n            <React.Fragment>\n              <Collapsible\n                labels={{ hidden: 'Show Teacher Instructions', visible: 'Hide Teacher Instructions' }}\n                className={classes.collapsible}\n              >\n                <PreviewPrompt prompt={model.teacherInstructions} />\n              </Collapsible>\n              <br />\n            </React.Fragment>\n          )\n        }\n        <CorrectAnswerToggle\n          show={showCorrect || correct === false}\n          toggled={showCorrect}\n          onToggle={this.toggleShowCorrect}\n        />\n        {\n          model.prompt && removeHTMLTags(model.prompt) &&\n          <div\n            className={classes.prompt}\n           >\n            <PreviewPrompt prompt={model.prompt} />\n          </div>\n        }\n        <div className={classes.categorize} style={style}>\n          <div style={{ display: 'flex', flex: 1 }}>\n            {\n              rowLabels && nbOfRows && (\n                <div style={{ display: 'grid', marginRight: '20px' }}>\n                  {rowLabels.slice(0, nbOfRows).map((label, index) => (\n                    <div\n                      key={index}\n                      style={{\n                        alignItems: 'center',\n                        display: 'flex',\n                        justifyContent: 'center'\n                      }}\n                      dangerouslySetInnerHTML={{\n                        __html: label\n                      }}\n                    />\n                  ))}\n                </div>\n              )\n            }\n            <Categories\n              model={model}\n              disabled={model.disabled}\n              categories={categories}\n              onDropChoice={this.dropChoice}\n              onRemoveChoice={this.removeChoice}\n            />\n          </div>\n          <Choices\n            disabled={model.disabled}\n            model={model}\n            choices={choices}\n            choicePosition={choicePosition}\n          />\n        </div>\n        {displayNote && (\n          <div\n            className={classes.note}\n            dangerouslySetInnerHTML={{ __html: `<strong>Note:</strong> ${note}` }}\n          />\n        )}\n        {\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        }\n        {\n          model.correctness &&\n          model.feedback &&\n          !showCorrect && (\n            <Feedback\n              correctness={model.correctness}\n              feedback={model.feedback}\n            />\n          )\n        }\n      </div>\n    );\n  }\n}\n\nclass CategorizeProvider extends React.Component {\n  constructor(props) {\n    super(props);\n    this.uid = uid.generateId();\n  }\n\n  render() {\n    return (\n      <uid.Provider value={this.uid}>\n        <Categorize { ...this.props } />\n      </uid.Provider>\n    );\n  }\n}\n\nconst styles = (theme) => ({\n  mainContainer: {\n    padding: theme.spacing.unit,\n    color: color.text(),\n    backgroundColor: color.background()\n  },\n  prompt: {\n    marginBottom: '35px',\n    verticalAlign: 'middle'\n  },\n  note: {\n    padding: '5px 0'\n  },\n  categorize: {\n    marginBottom: theme.spacing.unit,\n    display: 'flex',\n    flexDirection: 'column'\n  },\n  collapsible: {\n    paddingBottom: theme.spacing.unit * 2\n  }\n});\n\nexport default withDragContext(withStyles(styles)(CategorizeProvider));\n"],"file":"index.js"}