@pie-element/categorize 6.6.0 → 6.6.1-beta.587

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","choiceBoard","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;;;;;;;;;;;;WASX,kBAAS;AACP,wBAQI,KAAKC,KART;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;AAAA,UAOEC,WAPF,eAOEA,WAPF;AAUA,aAAOL,iBAAiB,eACtB;AAAK,QAAA,KAAK,EAAE;AAAEM,UAAAA,IAAI,EAAE;AAAR;AAAZ,sBACE,gCAAC,iBAAD;AACE,QAAA,SAAS,EAAEJ,SADb;AAEE,QAAA,MAAM,EAAED,MAFV;AAGE,QAAA,IAAI,EAAEE,IAHR;AAIE,QAAA,QAAQ,EAAEC,QAJZ;AAKE,QAAA,WAAW,EAAEC;AALf,SAOGN,QAPH,CADF,CADsB,CAAxB;AAaD;;;EAjCuCQ,kBAAMC,S;;;iCAAnCX,oB,eACQ;AACjBG,EAAAA,iBAAiB,EAAES,sBAAUC,IAAV,CAAeC,UADjB;AAEjBV,EAAAA,MAAM,EAAEQ,sBAAUG,IAFD;AAGjBb,EAAAA,QAAQ,EAAEU,sBAAUI,SAAV,CAAoB,CAACJ,sBAAUK,OAAV,CAAkBL,sBAAUM,IAA5B,CAAD,EAAoCN,sBAAUM,IAA9C,CAApB,EAAyEJ,UAHlE;AAIjBT,EAAAA,SAAS,EAAEO,sBAAUO,MAJJ;AAKjBb,EAAAA,IAAI,EAAEM,sBAAUQ,MALC;AAMjBb,EAAAA,QAAQ,EAAEK,sBAAUG;AANH,C;AAmCd,IAAMM,IAAI,GAAG;AAClBC,EAAAA,IAAI,EAAE,cAACrB,KAAD,EAAQsB,OAAR,EAAoB;AACxBxB,IAAAA,GAAG,CAAC,gBAAD,EAAmBE,KAAnB,CAAH;AACA,QAAMuB,IAAI,GAAGD,OAAO,CAACE,OAAR,EAAb;AACAxB,IAAAA,KAAK,CAACyB,YAAN,CAAmBF,IAAnB;AACD,GALiB;AAMlBG,EAAAA,OAAO,EAAE,iBAAC1B;AAAM;AAAP,IAAyB;AAChC,WAAO,CAACA,KAAK,CAACM,QAAd;AACD;AARiB,CAAb;;AAWP,IAAMqB,UAAU,GAAG,0BACjB;AAAA,MAAGC,GAAH,QAAGA,GAAH;AAAA,SAAaA,GAAb;AAAA,CADiB,EAEjBR,IAFiB,EAGjB,UAACS,OAAD,EAAUP,OAAV;AAAA,SAAuB;AACrBpB,IAAAA,iBAAiB,EAAE2B,OAAO,CAACC,UAAR,EADE;AAErB3B,IAAAA,MAAM,EAAEmB,OAAO,CAACnB,MAAR;AAFa,GAAvB;AAAA,CAHiB,EAOjBJ,oBAPiB,CAAnB;;eASe6B,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([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).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      choiceBoard\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          choiceBoard={choiceBoard}\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(\n  ({ uid }) => uid,\n  spec,\n  (connect, monitor) => ({\n    connectDropTarget: connect.dropTarget(),\n    isOver: monitor.isOver(),\n  }),\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;;;;;;;;;;;;WAcX,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;;;EA3B8BQ,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,CAACJ,sBAAUK,OAAV,CAAkBL,sBAAUM,IAA5B,CAAD,EAAoCN,sBAAUM,IAA9C,CAApB,EAAyEJ,UAHlE;AAIjBX,EAAAA,OAAO,EAAES,sBAAUO,MAJF;AAKjBd,EAAAA,IAAI,EAAEO,sBAAUO,MALC;AAMjBf,EAAAA,UAAU,EAAEQ,sBAAUC;AANL,C;iCADRf,W,kBASW;AACpBK,EAAAA,OAAO,EAAE,CADW;AAEpBE,EAAAA,IAAI,EAAE;AAFc,C;;AAqBxB,IAAMe,MAAM,GAAG,SAATA,MAAS,CAACC,KAAD;AAAA,SAAY;AACzBZ,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;AADY,GAAZ;AAAA,CAAf;;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([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).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');
 
@@ -64,22 +64,31 @@ var Categorize = /*#__PURE__*/function (_React$Component) {
 
     (0, _classCallCheck2["default"])(this, Categorize);
     _this = _super.call(this, props);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "dropChoice", function (categoryId, draggedChoice) {
-      var _this$props = _this.props,
-          session = _this$props.session,
-          onAnswersChange = _this$props.onAnswersChange;
-      log('[dropChoice] category: ', draggedChoice.categoryId, 'choice: ', draggedChoice);
-      var answers = (0, _categorize.moveChoiceToCategory)(draggedChoice.id, draggedChoice.categoryId, categoryId, draggedChoice.choiceIndex, session.answers);
-      onAnswersChange(answers);
-    });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "removeChoice", function (c) {
       log('[removeChoice]: ', c);
-      var _this$props2 = _this.props,
-          onAnswersChange = _this$props2.onAnswersChange,
-          session = _this$props2.session;
+      var _this$props = _this.props,
+          onAnswersChange = _this$props.onAnswersChange,
+          session = _this$props.session;
       var answers = (0, _categorize.removeChoiceFromCategory)(c.id, c.categoryId, c.choiceIndex, session.answers);
       onAnswersChange(answers);
     });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "dropChoice", function (categoryId, draggedChoice) {
+      var _this$props2 = _this.props,
+          session = _this$props2.session,
+          onAnswersChange = _this$props2.onAnswersChange;
+
+      if (draggedChoice) {
+        log('[dropChoice] category: ', draggedChoice.categoryId, 'choice: ', draggedChoice);
+      } else {
+        log('[dropChoice] category: ', undefined, 'choice: ', undefined);
+      }
+
+      var answers = draggedChoice ? (0, _categorize.moveChoiceToCategory)(draggedChoice.id, draggedChoice.categoryId, categoryId, draggedChoice.choiceIndex, session.answers) : _this.removeChoice(categoryId);
+
+      if (draggedChoice) {
+        onAnswersChange(answers);
+      }
+    });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "toggleShowCorrect", function () {
       return _this.setState({
         showCorrect: !_this.state.showCorrect
@@ -111,6 +120,13 @@ var Categorize = /*#__PURE__*/function (_React$Component) {
 
       return flexDirection;
     });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "existAlternateResponse", function (correctResponse) {
+      return correctResponse === null || correctResponse === void 0 ? void 0 : correctResponse.some(function (correctRes) {
+        var _correctRes$alternate;
+
+        return ((_correctRes$alternate = correctRes.alternateResponses) === null || _correctRes$alternate === void 0 ? void 0 : _correctRes$alternate.length) > 0;
+      });
+    });
     _this.state = {
       showCorrect: false
     };
@@ -132,7 +148,15 @@ var Categorize = /*#__PURE__*/function (_React$Component) {
           model = _this$props3.model,
           session = _this$props3.session;
       var showCorrect = this.state.showCorrect;
-      var choicesPosition = model.choicesPosition;
+      var choicesPosition = model.choicesPosition,
+          note = model.note,
+          showNote = model.showNote,
+          env = model.env;
+
+      var _ref = env || {},
+          mode = _ref.mode,
+          role = _ref.role;
+
       var choicePosition = choicesPosition || 'above';
       var style = {
         flexDirection: this.getPositionDirection(choicePosition)
@@ -144,41 +168,43 @@ var Categorize = /*#__PURE__*/function (_React$Component) {
           correct = _buildState.correct;
 
       log('[render] disabled: ', model.disabled);
-      var rowLabels = model.rowLabels;
+      var rowLabels = model.rowLabels,
+          categoriesPerRow = model.categoriesPerRow,
+          correctResponse = model.correctResponse;
+      var nbOfRows = categories && Math.ceil(categories.length / categoriesPerRow) || 0;
+      var existAlternate = this.existAlternateResponse(correctResponse) || false;
+      var displayNote = (showCorrect || mode === 'view' && role === 'instructor') && showNote && note && existAlternate;
       return /*#__PURE__*/_react["default"].createElement("div", {
         className: classes.mainContainer
-      }, model.teacherInstructions && (0, _renderUi.hasText)(model.teacherInstructions) && /*#__PURE__*/_react["default"].createElement(_renderUi.Collapsible, {
+      }, model.teacherInstructions && (0, _renderUi.hasText)(model.teacherInstructions) && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_renderUi.Collapsible, {
         labels: {
           hidden: 'Show Teacher Instructions',
           visible: 'Hide Teacher Instructions'
         },
         className: classes.collapsible
-      }, /*#__PURE__*/_react["default"].createElement("div", {
-        dangerouslySetInnerHTML: {
-          __html: model.teacherInstructions
-        }
-      })), /*#__PURE__*/_react["default"].createElement("br", null), /*#__PURE__*/_react["default"].createElement(_correctAnswerToggle["default"], {
+      }, /*#__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
-      }), removeHTMLTags(model.prompt) && /*#__PURE__*/_react["default"].createElement("div", {
-        className: classes.prompt,
-        dangerouslySetInnerHTML: {
-          __html: model.prompt
-        }
-      }), /*#__PURE__*/_react["default"].createElement("div", {
+      }), model.prompt && removeHTMLTags(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 && /*#__PURE__*/_react["default"].createElement("div", {
+      }, !!(rowLabels && nbOfRows) && /*#__PURE__*/_react["default"].createElement("div", {
         style: {
-          display: 'grid',
-          marginRight: '20px'
+          display: 'grid'
         }
-      }, rowLabels.map(function (label, index) {
+      }, rowLabels.slice(0, nbOfRows).map(function (label, index) {
         return /*#__PURE__*/_react["default"].createElement("div", {
           key: index,
           style: {
@@ -200,17 +226,22 @@ var Categorize = /*#__PURE__*/function (_React$Component) {
         disabled: model.disabled,
         model: model,
         choices: choices,
-        choicePosition: choicePosition
-      })), model.rationale && (0, _renderUi.hasText)(model.rationale) && /*#__PURE__*/_react["default"].createElement(_renderUi.Collapsible, {
+        choicePosition: choicePosition,
+        onDropChoice: this.dropChoice,
+        onRemoveChoice: this.removeChoice
+      })), displayNote && /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.note,
+        dangerouslySetInnerHTML: {
+          __html: "<strong>Note:</strong> ".concat(note)
+        }
+      }), model.rationale && (0, _renderUi.hasText)(model.rationale) && /*#__PURE__*/_react["default"].createElement(_renderUi.Collapsible, {
         labels: {
           hidden: 'Show Rationale',
           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
@@ -273,6 +304,9 @@ var styles = function styles(theme) {
       marginBottom: '35px',
       verticalAlign: 'middle'
     },
+    note: {
+      padding: '5px 0'
+    },
     categorize: {
       marginBottom: theme.spacing.unit,
       display: 'flex',

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","style","getPositionDirection","categories","choices","correctResponse","correct","disabled","rowLabels","mainContainer","teacherInstructions","hidden","visible","collapsible","__html","toggleShowCorrect","prompt","categorize","display","marginRight","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 } = model;\n\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 } = model;\n\n    return (\n      <div className={classes.mainContainer}>\n        {\n          model.teacherInstructions && hasText(model.teacherInstructions) && (\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          )\n        }\n        <br />\n        <CorrectAnswerToggle\n          show={showCorrect || correct === false}\n          toggled={showCorrect}\n          onToggle={this.toggleShowCorrect}\n        />\n        {\n          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 && (\n                <div style={{ display: 'grid', marginRight: '20px' }}>\n                  {rowLabels.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        {\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  categorize: {\n    marginBottom: theme.spacing.unit,\n    display: 'flex',\n    flexDirection: 'column'\n  },\n  collapsible: {\n    paddingBottom: theme.spacing.unit * 2\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","c","onAnswersChange","session","answers","id","categoryId","choiceIndex","draggedChoice","undefined","removeChoice","setState","showCorrect","state","onShowCorrectToggle","choicePosition","flexDirection","correctResponse","some","correctRes","alternateResponses","length","classes","model","choicesPosition","note","showNote","env","mode","role","style","getPositionDirection","categories","choices","correct","disabled","rowLabels","categoriesPerRow","nbOfRows","Math","ceil","existAlternate","existAlternateResponse","displayNote","mainContainer","teacherInstructions","hidden","visible","collapsible","toggleShowCorrect","prompt","categorize","display","flex","slice","map","label","index","alignItems","justifyContent","__html","dropChoice","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 {\n  color,\n  Feedback,\n  Collapsible,\n  hasText,\n  PreviewPrompt,\n} 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  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  dropChoice = (categoryId, draggedChoice) => {\n    const { session, onAnswersChange } = this.props;\n    if (draggedChoice) {\n      log(\n        '[dropChoice] category: ',\n        draggedChoice.categoryId,\n        'choice: ',\n        draggedChoice\n      );\n    } else {\n      log('[dropChoice] category: ', undefined, 'choice: ', undefined);\n    }\n\n    const answers = draggedChoice ? moveChoiceToCategory(\n      draggedChoice.id,\n      draggedChoice.categoryId,\n      categoryId,\n      draggedChoice.choiceIndex,\n      session.answers\n    ) : this.removeChoice(categoryId)\n\n    if (draggedChoice) {\n      onAnswersChange(answers);\n    } \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  existAlternateResponse = (correctResponse) => correctResponse?.some(correctRes => correctRes.alternateResponses?.length > 0);\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, correctResponse } = model;\n    const nbOfRows = categories && Math.ceil(categories.length / categoriesPerRow) || 0;\n    const existAlternate = this.existAlternateResponse(correctResponse) || false;\n    const displayNote = (showCorrect || mode === 'view' && role === 'instructor') && showNote && note && existAlternate;\n\n    return (\n      <div className={classes.mainContainer}>\n        {model.teacherInstructions && hasText(model.teacherInstructions) && (\n          <React.Fragment>\n            <Collapsible\n              labels={{\n                hidden: 'Show Teacher Instructions',\n                visible: 'Hide Teacher Instructions',\n              }}\n              className={classes.collapsible}\n            >\n              <PreviewPrompt prompt={model.teacherInstructions} />\n            </Collapsible>\n            <br />\n          </React.Fragment>\n        )}\n        <CorrectAnswerToggle\n          show={showCorrect || correct === false}\n          toggled={showCorrect}\n          onToggle={this.toggleShowCorrect}\n        />\n        {model.prompt && removeHTMLTags(model.prompt) && (\n          <div className={classes.prompt}>\n            <PreviewPrompt prompt={model.prompt} />\n          </div>\n        )}\n        <div className={classes.categorize} style={style}>\n          <div style={{ display: 'flex', flex: 1 }}>\n\n            {\n              !!(rowLabels && nbOfRows) && (\n                <div style={{ display: 'grid'}}>\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            onDropChoice={this.dropChoice}\n            onRemoveChoice={this.removeChoice}\n          />\n        </div>\n        {displayNote && (\n          <div\n            className={classes.note}\n            dangerouslySetInnerHTML={{\n              __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        {model.correctness && model.feedback && !showCorrect && (\n          <Feedback correctness={model.correctness} feedback={model.feedback} />\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"}

package/lib/index.js

@@ -31,7 +31,7 @@ var _categorize = _interopRequireDefault(require("./categorize"));
 
 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 Categorize = /*#__PURE__*/function (_HTMLElement) {
   (0, _inherits2["default"])(Categorize, _HTMLElement);
@@ -61,6 +61,9 @@ var Categorize = /*#__PURE__*/function (_HTMLElement) {
     }
   }, {
     key: "session",
+    get: function get() {
+      return this._session;
+    },
     set: function set(s) {
       if (s && !s.answers) {
         s.answers = [];

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.js"],"names":["Categorize","m","_model","dispatchEvent","ModelSetEvent","tagName","toLowerCase","isComplete","render","_session","Array","isArray","answers","length","s","SessionChangedEvent","el","React","createElement","CategorizeComponent","model","session","onAnswersChange","changeAnswers","bind","onShowCorrectToggle","ReactDOM","HTMLElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAIA;;;;;;IAEqBA,U;;;;;;;;;;;;SACnB,aAAUC,CAAV,EAAa;AACX,WAAKC,MAAL,GAAcD,CAAd;AAEA,WAAKE,aAAL,CACE,IAAIC,8BAAJ,CACE,KAAKC,OAAL,CAAaC,WAAb,EADF,EAEE,KAAKC,UAAL,EAFF,EAGE,CAAC,CAAC,KAAKL,MAHT,CADF;AAOA,WAAKM,MAAL;AACD;;;WAED,sBAAa;AACX,UAAI,CAAC,KAAKC,QAAV,EAAoB;AAClB,eAAO,KAAP;AACD;;AAED,aACEC,KAAK,CAACC,OAAN,CAAc,KAAKF,QAAL,CAAcG,OAA5B,KAAwC,KAAKH,QAAL,CAAcG,OAAd,CAAsBC,MAAtB,GAA+B,CADzE;AAGD;;;SAED,aAAYC,CAAZ,EAAe;AACb,UAAIA,CAAC,IAAI,CAACA,CAAC,CAACF,OAAZ,EAAqB;AACnBE,QAAAA,CAAC,CAACF,OAAF,GAAY,EAAZ;AACD;;AAED,WAAKH,QAAL,GAAgBK,CAAhB;AACA,WAAKN,MAAL;AACD;;;WAED,uBAAcI,OAAd,EAAuB;AACrB,WAAKH,QAAL,CAAcG,OAAd,GAAwBA,OAAxB;AAEA,WAAKT,aAAL,CACE,IAAIY,oCAAJ,CAAwB,KAAKV,OAAL,CAAaC,WAAb,EAAxB,EAAoD,KAAKC,UAAL,EAApD,CADF;AAIA,WAAKC,MAAL;AACD;;;WAED,+BAAsB;AACpB,qCAAW,IAAX;AACD;;;WAED,kBAAS;AAAA;;AACP,UAAI,KAAKN,MAAL,IAAe,KAAKO,QAAxB,EAAkC;AAChC,YAAMO,EAAE,gBAAGC,kBAAMC,aAAN,CAAoBC,sBAApB,EAAyC;AAClDC,UAAAA,KAAK,EAAE,KAAKlB,MADsC;AAElDmB,UAAAA,OAAO,EAAE,KAAKZ,QAFoC;AAGlDa,UAAAA,eAAe,EAAE,KAAKC,aAAL,CAAmBC,IAAnB,CAAwB,IAAxB,CAHiC;AAIlDC,UAAAA,mBAAmB,EAAE,KAAKA,mBAAL,CAAyBD,IAAzB,CAA8B,IAA9B;AAJ6B,SAAzC,CAAX;;AAMAE,6BAASlB,MAAT,CAAgBQ,EAAhB,EAAoB,IAApB,EAA0B,YAAM;AAC9B,yCAAW,KAAX;AACD,SAFD;AAGD;AACF;;;kDA3DqCW,W","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport {\n  SessionChangedEvent,\n  ModelSetEvent\n} from '@pie-framework/pie-player-events';\nimport CategorizeComponent from './categorize';\n\nexport default class Categorize extends HTMLElement {\n  set model(m) {\n    this._model = m;\n\n    this.dispatchEvent(\n      new ModelSetEvent(\n        this.tagName.toLowerCase(),\n        this.isComplete(),\n        !!this._model\n      )\n    );\n    this.render();\n  }\n\n  isComplete() {\n    if (!this._session) {\n      return false;\n    }\n\n    return (\n      Array.isArray(this._session.answers) && this._session.answers.length > 0\n    );\n  }\n\n  set session(s) {\n    if (s && !s.answers) {\n      s.answers = [];\n    }\n\n    this._session = s;\n    this.render();\n  }\n\n  changeAnswers(answers) {\n    this._session.answers = answers;\n\n    this.dispatchEvent(\n      new SessionChangedEvent(this.tagName.toLowerCase(), this.isComplete())\n    );\n\n    this.render();\n  }\n\n  onShowCorrectToggle() {\n    renderMath(this);\n  }\n\n  render() {\n    if (this._model && this._session) {\n      const el = React.createElement(CategorizeComponent, {\n        model: this._model,\n        session: this._session,\n        onAnswersChange: this.changeAnswers.bind(this),\n        onShowCorrectToggle: this.onShowCorrectToggle.bind(this),\n      });\n      ReactDOM.render(el, this, () => {\n        renderMath(this);\n      });\n    }\n  }\n}\n"],"file":"index.js"}
+{"version":3,"sources":["../src/index.js"],"names":["Categorize","m","_model","dispatchEvent","ModelSetEvent","tagName","toLowerCase","isComplete","render","_session","Array","isArray","answers","length","s","SessionChangedEvent","el","React","createElement","CategorizeComponent","model","session","onAnswersChange","changeAnswers","bind","onShowCorrectToggle","ReactDOM","HTMLElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;IAEqBA,U;;;;;;;;;;;;SACnB,aAAUC,CAAV,EAAa;AACX,WAAKC,MAAL,GAAcD,CAAd;AAEA,WAAKE,aAAL,CAAmB,IAAIC,8BAAJ,CAAkB,KAAKC,OAAL,CAAaC,WAAb,EAAlB,EAA8C,KAAKC,UAAL,EAA9C,EAAiE,CAAC,CAAC,KAAKL,MAAxE,CAAnB;AACA,WAAKM,MAAL;AACD;;;WAED,sBAAa;AACX,UAAI,CAAC,KAAKC,QAAV,EAAoB;AAClB,eAAO,KAAP;AACD;;AAED,aAAOC,KAAK,CAACC,OAAN,CAAc,KAAKF,QAAL,CAAcG,OAA5B,KAAwC,KAAKH,QAAL,CAAcG,OAAd,CAAsBC,MAAtB,GAA+B,CAA9E;AACD;;;SAWD,eAAc;AACZ,aAAO,KAAKJ,QAAZ;AACD,K;SAXD,aAAYK,CAAZ,EAAe;AACb,UAAIA,CAAC,IAAI,CAACA,CAAC,CAACF,OAAZ,EAAqB;AACnBE,QAAAA,CAAC,CAACF,OAAF,GAAY,EAAZ;AACD;;AAED,WAAKH,QAAL,GAAgBK,CAAhB;AACA,WAAKN,MAAL;AACD;;;WAMD,uBAAcI,OAAd,EAAuB;AACrB,WAAKH,QAAL,CAAcG,OAAd,GAAwBA,OAAxB;AAEA,WAAKT,aAAL,CAAmB,IAAIY,oCAAJ,CAAwB,KAAKV,OAAL,CAAaC,WAAb,EAAxB,EAAoD,KAAKC,UAAL,EAApD,CAAnB;AAEA,WAAKC,MAAL;AACD;;;WAED,+BAAsB;AACpB,qCAAW,IAAX;AACD;;;WAED,kBAAS;AAAA;;AACP,UAAI,KAAKN,MAAL,IAAe,KAAKO,QAAxB,EAAkC;AAChC,YAAMO,EAAE,gBAAGC,kBAAMC,aAAN,CAAoBC,sBAApB,EAAyC;AAClDC,UAAAA,KAAK,EAAE,KAAKlB,MADsC;AAElDmB,UAAAA,OAAO,EAAE,KAAKZ,QAFoC;AAGlDa,UAAAA,eAAe,EAAE,KAAKC,aAAL,CAAmBC,IAAnB,CAAwB,IAAxB,CAHiC;AAIlDC,UAAAA,mBAAmB,EAAE,KAAKA,mBAAL,CAAyBD,IAAzB,CAA8B,IAA9B;AAJ6B,SAAzC,CAAX;;AAOAE,6BAASlB,MAAT,CAAgBQ,EAAhB,EAAoB,IAApB,EAA0B,YAAM;AAC9B,yCAAW,KAAX;AACD,SAFD;AAGD;AACF;;;kDAtDqCW,W","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport { SessionChangedEvent, ModelSetEvent } from '@pie-framework/pie-player-events';\nimport CategorizeComponent from './categorize';\n\nexport default class Categorize extends HTMLElement {\n  set model(m) {\n    this._model = m;\n\n    this.dispatchEvent(new ModelSetEvent(this.tagName.toLowerCase(), this.isComplete(), !!this._model));\n    this.render();\n  }\n\n  isComplete() {\n    if (!this._session) {\n      return false;\n    }\n\n    return Array.isArray(this._session.answers) && this._session.answers.length > 0;\n  }\n\n  set session(s) {\n    if (s && !s.answers) {\n      s.answers = [];\n    }\n\n    this._session = s;\n    this.render();\n  }\n\n  get session() {\n    return this._session;\n  }\n\n  changeAnswers(answers) {\n    this._session.answers = answers;\n\n    this.dispatchEvent(new SessionChangedEvent(this.tagName.toLowerCase(), this.isComplete()));\n\n    this.render();\n  }\n\n  onShowCorrectToggle() {\n    renderMath(this);\n  }\n\n  render() {\n    if (this._model && this._session) {\n      const el = React.createElement(CategorizeComponent, {\n        model: this._model,\n        session: this._session,\n        onAnswersChange: this.changeAnswers.bind(this),\n        onShowCorrectToggle: this.onShowCorrectToggle.bind(this),\n      });\n\n      ReactDOM.render(el, this, () => {\n        renderMath(this);\n      });\n    }\n  }\n}\n"],"file":"index.js"}

package/package.json

@@ -4,27 +4,28 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "6.6.0",
+  "version": "6.6.1-beta.587+40df32c2f",
   "description": "",
   "author": "pie framework developers",
   "license": "ISC",
   "dependencies": {
     "@material-ui/core": "^3.9.2",
     "@pie-framework/pie-player-events": "^0.1.0",
-    "@pie-lib/categorize": "^0.6.22",
-    "@pie-lib/correct-answer-toggle": "^2.3.23",
-    "@pie-lib/drag": "^1.1.50",
-    "@pie-lib/math-rendering": "^2.3.6",
-    "@pie-lib/render-ui": "^4.11.5",
+    "@pie-lib/categorize": "^0.8.12",
+    "@pie-lib/correct-answer-toggle": "^2.3.62",
+    "@pie-lib/drag": "^2.1.12",
+    "@pie-lib/math-rendering": "^2.5.12",
+    "@pie-lib/render-ui": "^4.14.12",
     "classnames": "^2.2.5",
     "debug": "^4.1.1",
+    "is-plain-object": "^5.0.0",
     "lodash": "^4.17.15",
     "prop-types": "^15.6.1",
     "react": "^16.8.1",
-    "react-dnd": "^9.3.2",
+    "react-dnd": "^14.0.5",
     "react-dom": "^16.8.1"
   },
-  "gitHead": "8f4eaa4018dffb68e135ec9e274688a8ae05d865",
+  "gitHead": "40df32c2f78966706cb168843567c9df174f1d88",
   "scripts": {
     "postpublish": "../../scripts/postpublish"
   },