@pie-element/categorize 7.3.1-next.8 → 7.3.1-next.90
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/configure/lib/defaults.js +6 -1
- package/configure/lib/defaults.js.map +1 -1
- package/configure/lib/design/builder.js.map +1 -1
- package/configure/lib/design/buttons.js.map +1 -1
- package/configure/lib/design/categories/alternateResponses.js +9 -1
- package/configure/lib/design/categories/alternateResponses.js.map +1 -1
- package/configure/lib/design/categories/category.js +18 -3
- package/configure/lib/design/categories/category.js.map +1 -1
- package/configure/lib/design/categories/choice-preview.js.map +1 -1
- package/configure/lib/design/categories/droppable-placeholder.js.map +1 -1
- package/configure/lib/design/categories/index.js +3 -1
- package/configure/lib/design/categories/index.js.map +1 -1
- package/configure/lib/design/choices/choice.js.map +1 -1
- package/configure/lib/design/choices/config.js +1 -78
- package/configure/lib/design/choices/config.js.map +1 -1
- package/configure/lib/design/choices/index.js +0 -2
- package/configure/lib/design/choices/index.js.map +1 -1
- package/configure/lib/design/header.js.map +1 -1
- package/configure/lib/design/index.js +8 -4
- package/configure/lib/design/index.js.map +1 -1
- package/configure/lib/design/input-header.js.map +1 -1
- package/configure/lib/index.js.map +1 -1
- package/configure/lib/main.js.map +1 -1
- package/configure/lib/utils.js.map +1 -1
- package/configure/package.json +3 -3
- package/controller/lib/defaults.js.map +1 -1
- package/controller/lib/index.js +62 -7
- package/controller/lib/index.js.map +1 -1
- package/controller/lib/utils.js +48 -2
- package/controller/lib/utils.js.map +1 -1
- package/docs/config-schema.json +21 -0
- package/docs/config-schema.json.md +17 -1
- package/docs/demo/config.js +2 -2
- package/docs/demo/generate.js +2 -3
- package/docs/demo/index.html +1 -1
- package/docs/pie-schema.json.md +1 -1
- package/lib/categorize/categories.js +10 -2
- package/lib/categorize/categories.js.map +1 -1
- package/lib/categorize/category.js.map +1 -1
- package/lib/categorize/choice.js.map +1 -1
- package/lib/categorize/choices.js +16 -7
- package/lib/categorize/choices.js.map +1 -1
- package/lib/categorize/droppable-placeholder.js +4 -2
- package/lib/categorize/droppable-placeholder.js.map +1 -1
- package/lib/categorize/grid-content.js.map +1 -1
- package/lib/categorize/index.js +35 -15
- package/lib/categorize/index.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/package.json +3 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
{"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","
|
|
1
|
+
{"version":3,"sources":["../../src/categorize/choices.jsx"],"names":["Blank","Choices","props","classes","choices","model","disabled","onDropChoice","onRemoveChoice","choicePosition","style","textAlign","direction","wrapper","background","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","touchAction","display","justifyContent","alignItems","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';\nimport DroppablePlaceholder from './droppable-placeholder';\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([PropTypes.shape(ChoiceType), PropTypes.shape({ empty: PropTypes.bool })]),\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 onDropChoice,\n onRemoveChoice,\n choicePosition,\n } = this.props;\n\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 <DroppablePlaceholder\n onDropChoice={onDropChoice}\n onRemoveChoice={onRemoveChoice}\n disabled={disabled}\n style={{background: 'none', }}\n choiceBoard={true}\n >\n {model.choicesLabel && model.choicesLabel !== '' && (\n <div className={classes.labelHolder} dangerouslySetInnerHTML={{ __html: model.choicesLabel }}></div>\n )}\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 </DroppablePlaceholder>\n </div>\n );\n }\n}\n\nconst styles = (theme) => ({\n wrapper: {\n flex: 1,\n padding: theme.spacing.unit,\n touchAction: 'none',\n },\n choices: {\n padding: theme.spacing.unit / 2,\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\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"}
|
|
@@ -54,7 +54,8 @@ var DroppablePlaceholder = /*#__PURE__*/function (_React$Component) {
|
|
|
54
54
|
isOver = _this$props.isOver,
|
|
55
55
|
className = _this$props.className,
|
|
56
56
|
grid = _this$props.grid,
|
|
57
|
-
disabled = _this$props.disabled
|
|
57
|
+
disabled = _this$props.disabled,
|
|
58
|
+
choiceBoard = _this$props.choiceBoard;
|
|
58
59
|
return connectDropTarget( /*#__PURE__*/_react["default"].createElement("div", {
|
|
59
60
|
style: {
|
|
60
61
|
flex: 1
|
|
@@ -63,7 +64,8 @@ var DroppablePlaceholder = /*#__PURE__*/function (_React$Component) {
|
|
|
63
64
|
className: className,
|
|
64
65
|
isOver: isOver,
|
|
65
66
|
grid: grid,
|
|
66
|
-
disabled: disabled
|
|
67
|
+
disabled: disabled,
|
|
68
|
+
choiceBoard: choiceBoard
|
|
67
69
|
}, children)));
|
|
68
70
|
}
|
|
69
71
|
}]);
|
|
@@ -1 +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;;;;;;;;;;;;
|
|
1
|
+
{"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"}
|
|
@@ -1 +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;;;;;;;;;;;;
|
|
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;;;;;;;;;;;;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
CHANGED
|
@@ -64,22 +64,31 @@ var Categorize = /*#__PURE__*/function (_React$Component) {
|
|
|
64
64
|
|
|
65
65
|
(0, _classCallCheck2["default"])(this, Categorize);
|
|
66
66
|
_this = _super.call(this, props);
|
|
67
|
-
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "dropChoice", function (categoryId, draggedChoice) {
|
|
68
|
-
var _this$props = _this.props,
|
|
69
|
-
session = _this$props.session,
|
|
70
|
-
onAnswersChange = _this$props.onAnswersChange;
|
|
71
|
-
log('[dropChoice] category: ', draggedChoice.categoryId, 'choice: ', draggedChoice);
|
|
72
|
-
var answers = (0, _categorize.moveChoiceToCategory)(draggedChoice.id, draggedChoice.categoryId, categoryId, draggedChoice.choiceIndex, session.answers);
|
|
73
|
-
onAnswersChange(answers);
|
|
74
|
-
});
|
|
75
67
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "removeChoice", function (c) {
|
|
76
68
|
log('[removeChoice]: ', c);
|
|
77
|
-
var _this$
|
|
78
|
-
onAnswersChange = _this$
|
|
79
|
-
session = _this$
|
|
69
|
+
var _this$props = _this.props,
|
|
70
|
+
onAnswersChange = _this$props.onAnswersChange,
|
|
71
|
+
session = _this$props.session;
|
|
80
72
|
var answers = (0, _categorize.removeChoiceFromCategory)(c.id, c.categoryId, c.choiceIndex, session.answers);
|
|
81
73
|
onAnswersChange(answers);
|
|
82
74
|
});
|
|
75
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "dropChoice", function (categoryId, draggedChoice) {
|
|
76
|
+
var _this$props2 = _this.props,
|
|
77
|
+
session = _this$props2.session,
|
|
78
|
+
onAnswersChange = _this$props2.onAnswersChange;
|
|
79
|
+
|
|
80
|
+
if (draggedChoice) {
|
|
81
|
+
log('[dropChoice] category: ', draggedChoice.categoryId, 'choice: ', draggedChoice);
|
|
82
|
+
} else {
|
|
83
|
+
log('[dropChoice] category: ', undefined, 'choice: ', undefined);
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
var answers = draggedChoice ? (0, _categorize.moveChoiceToCategory)(draggedChoice.id, draggedChoice.categoryId, categoryId, draggedChoice.choiceIndex, session.answers) : _this.removeChoice(categoryId);
|
|
87
|
+
|
|
88
|
+
if (draggedChoice) {
|
|
89
|
+
onAnswersChange(answers);
|
|
90
|
+
}
|
|
91
|
+
});
|
|
83
92
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "toggleShowCorrect", function () {
|
|
84
93
|
return _this.setState({
|
|
85
94
|
showCorrect: !_this.state.showCorrect
|
|
@@ -111,6 +120,13 @@ var Categorize = /*#__PURE__*/function (_React$Component) {
|
|
|
111
120
|
|
|
112
121
|
return flexDirection;
|
|
113
122
|
});
|
|
123
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "existAlternateResponse", function (correctResponse) {
|
|
124
|
+
return correctResponse === null || correctResponse === void 0 ? void 0 : correctResponse.some(function (correctRes) {
|
|
125
|
+
var _correctRes$alternate;
|
|
126
|
+
|
|
127
|
+
return ((_correctRes$alternate = correctRes.alternateResponses) === null || _correctRes$alternate === void 0 ? void 0 : _correctRes$alternate.length) > 0;
|
|
128
|
+
});
|
|
129
|
+
});
|
|
114
130
|
_this.state = {
|
|
115
131
|
showCorrect: false
|
|
116
132
|
};
|
|
@@ -153,9 +169,11 @@ var Categorize = /*#__PURE__*/function (_React$Component) {
|
|
|
153
169
|
|
|
154
170
|
log('[render] disabled: ', model.disabled);
|
|
155
171
|
var rowLabels = model.rowLabels,
|
|
156
|
-
categoriesPerRow = model.categoriesPerRow
|
|
172
|
+
categoriesPerRow = model.categoriesPerRow,
|
|
173
|
+
correctResponse = model.correctResponse;
|
|
157
174
|
var nbOfRows = categories && Math.ceil(categories.length / categoriesPerRow) || 0;
|
|
158
|
-
var
|
|
175
|
+
var existAlternate = this.existAlternateResponse(correctResponse) || false;
|
|
176
|
+
var displayNote = (showCorrect || mode === 'view' && role === 'instructor') && showNote && note && existAlternate;
|
|
159
177
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
160
178
|
className: classes.mainContainer
|
|
161
179
|
}, model.teacherInstructions && (0, _renderUi.hasText)(model.teacherInstructions) && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_renderUi.Collapsible, {
|
|
@@ -182,7 +200,7 @@ var Categorize = /*#__PURE__*/function (_React$Component) {
|
|
|
182
200
|
display: 'flex',
|
|
183
201
|
flex: 1
|
|
184
202
|
}
|
|
185
|
-
}, rowLabels && nbOfRows && /*#__PURE__*/_react["default"].createElement("div", {
|
|
203
|
+
}, !!(rowLabels && nbOfRows) && /*#__PURE__*/_react["default"].createElement("div", {
|
|
186
204
|
style: {
|
|
187
205
|
display: 'grid',
|
|
188
206
|
marginRight: '20px'
|
|
@@ -209,7 +227,9 @@ var Categorize = /*#__PURE__*/function (_React$Component) {
|
|
|
209
227
|
disabled: model.disabled,
|
|
210
228
|
model: model,
|
|
211
229
|
choices: choices,
|
|
212
|
-
choicePosition: choicePosition
|
|
230
|
+
choicePosition: choicePosition,
|
|
231
|
+
onDropChoice: this.dropChoice,
|
|
232
|
+
onRemoveChoice: this.removeChoice
|
|
213
233
|
})), displayNote && /*#__PURE__*/_react["default"].createElement("div", {
|
|
214
234
|
className: classes.note,
|
|
215
235
|
dangerouslySetInnerHTML: {
|
|
@@ -1 +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","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":"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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, 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"}
|
|
1
|
+
{"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","marginRight","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', 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 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.map
CHANGED
|
@@ -1 +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;;
|
|
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;;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
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
7
|
-
"version": "7.3.1-next.
|
|
7
|
+
"version": "7.3.1-next.90+7fa8d08ff",
|
|
8
8
|
"description": "",
|
|
9
9
|
"author": "pie framework developers",
|
|
10
10
|
"license": "ISC",
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
"@pie-framework/pie-player-events": "^0.1.0",
|
|
14
14
|
"@pie-lib/categorize": "^0.6.25",
|
|
15
15
|
"@pie-lib/correct-answer-toggle": "^2.3.47",
|
|
16
|
-
"@pie-lib/drag": "^2.0.
|
|
16
|
+
"@pie-lib/drag": "^2.0.2",
|
|
17
17
|
"@pie-lib/math-rendering": "^2.5.1",
|
|
18
18
|
"@pie-lib/render-ui": "^4.13.7",
|
|
19
19
|
"classnames": "^2.2.5",
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
"react-dnd": "^14.0.5",
|
|
25
25
|
"react-dom": "^16.8.1"
|
|
26
26
|
},
|
|
27
|
-
"gitHead": "
|
|
27
|
+
"gitHead": "7fa8d08ffe380da32c8411b3890a7bc8b633538e",
|
|
28
28
|
"scripts": {
|
|
29
29
|
"postpublish": "../../scripts/postpublish"
|
|
30
30
|
},
|