@pie-element/matrix 0.28.2-next.1 → 0.28.2-next.15

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.
Files changed (42) hide show
  1. package/configure/lib/HeaderCommon.js +31 -0
  2. package/configure/lib/HeaderCommon.js.map +1 -0
  3. package/configure/lib/Main.js +242 -0
  4. package/configure/lib/Main.js.map +1 -0
  5. package/configure/lib/MatrixColumnsSizeHeaderInput.js +76 -0
  6. package/configure/lib/MatrixColumnsSizeHeaderInput.js.map +1 -0
  7. package/configure/lib/MatrixLabelEditableButton.js +219 -0
  8. package/configure/lib/MatrixLabelEditableButton.js.map +1 -0
  9. package/configure/lib/MatrixLabelTypeHeaderInput.js +117 -0
  10. package/configure/lib/MatrixLabelTypeHeaderInput.js.map +1 -0
  11. package/configure/lib/MatrixRowsSizeHeaderInput.js +76 -0
  12. package/configure/lib/MatrixRowsSizeHeaderInput.js.map +1 -0
  13. package/configure/lib/MatrixValues.js +245 -0
  14. package/configure/lib/MatrixValues.js.map +1 -0
  15. package/configure/lib/NumberInput.js +98 -0
  16. package/configure/lib/NumberInput.js.map +1 -0
  17. package/configure/lib/columnLabelsGenerator.js +58 -0
  18. package/configure/lib/columnLabelsGenerator.js.map +1 -0
  19. package/configure/lib/defaults.js +74 -0
  20. package/configure/lib/defaults.js.map +1 -0
  21. package/configure/lib/index.js +162 -0
  22. package/configure/lib/index.js.map +1 -0
  23. package/configure/lib/isNumeric.js +13 -0
  24. package/configure/lib/isNumeric.js.map +1 -0
  25. package/configure/lib/matrixEntities.js +17 -0
  26. package/configure/lib/matrixEntities.js.map +1 -0
  27. package/configure/package.json +1 -1
  28. package/controller/lib/defaults.js +15 -0
  29. package/controller/lib/defaults.js.map +1 -0
  30. package/controller/lib/index.js +143 -0
  31. package/controller/lib/index.js.map +1 -0
  32. package/lib/ChoiceInput.js +71 -0
  33. package/lib/ChoiceInput.js.map +1 -0
  34. package/lib/Main.js +73 -0
  35. package/lib/Main.js.map +1 -0
  36. package/lib/Matrix.js +113 -0
  37. package/lib/Matrix.js.map +1 -0
  38. package/lib/index.js +124 -0
  39. package/lib/index.js.map +1 -0
  40. package/lib/session-updater.js +11 -0
  41. package/lib/session-updater.js.map +1 -0
  42. package/package.json +3 -3
@@ -0,0 +1,31 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.NumberInputFormGroupWrapper = exports.IconWrapper = exports.ColumnsWrapper = exports.ColumnsHeader = void 0;
9
+
10
+ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
11
+
12
+ var _styledComponents = _interopRequireDefault(require("styled-components"));
13
+
14
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4;
15
+
16
+ var ColumnsWrapper = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-direction: column;\n align-items: center;\n"])));
17
+
18
+ exports.ColumnsWrapper = ColumnsWrapper;
19
+
20
+ var ColumnsHeader = _styledComponents["default"].p(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n margin: 10px 0;\n color: #c3c3c3;\n font-size: 12px;\n"])));
21
+
22
+ exports.ColumnsHeader = ColumnsHeader;
23
+
24
+ var NumberInputFormGroupWrapper = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 110px;\n"])));
25
+
26
+ exports.NumberInputFormGroupWrapper = NumberInputFormGroupWrapper;
27
+
28
+ var IconWrapper = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n cursor: pointer;\n"])));
29
+
30
+ exports.IconWrapper = IconWrapper;
31
+ //# sourceMappingURL=HeaderCommon.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/HeaderCommon.js"],"names":["ColumnsWrapper","styled","div","ColumnsHeader","p","NumberInputFormGroupWrapper","IconWrapper"],"mappings":";;;;;;;;;;;AAAA;;;;AAEO,IAAMA,cAAc,GAAGC,6BAAOC,GAAV,6JAApB;;;;AAMA,IAAMC,aAAa,GAAGF,6BAAOG,CAAV,oJAAnB;;;;AAMA,IAAMC,2BAA2B,GAAGJ,6BAAOC,GAAV,wLAAjC;;;;AAOA,IAAMI,WAAW,GAAGL,6BAAOC,GAAV,8GAAjB","sourcesContent":["import styled from 'styled-components';\n\nexport const ColumnsWrapper = styled.div`\n display: flex;\n flex-direction: column;\n align-items: center;\n`;\n\nexport const ColumnsHeader = styled.p`\n margin: 10px 0;\n color: #c3c3c3;\n font-size: 12px;\n`;\n\nexport const NumberInputFormGroupWrapper = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 110px;\n`;\n\nexport const IconWrapper = styled.div`\n cursor: pointer;\n`;\n"],"file":"HeaderCommon.js"}
@@ -0,0 +1,242 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports["default"] = exports.Main = void 0;
9
+
10
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
11
+
12
+ var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
13
+
14
+ var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
15
+
16
+ var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
17
+
18
+ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
19
+
20
+ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
21
+
22
+ var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
23
+
24
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
25
+
26
+ var _react = _interopRequireDefault(require("react"));
27
+
28
+ var _propTypes = _interopRequireDefault(require("prop-types"));
29
+
30
+ var _editableHtml = require("@pie-lib/pie-toolbox/editable-html");
31
+
32
+ var _configUi = require("@pie-lib/pie-toolbox/config-ui");
33
+
34
+ var _styles = require("@material-ui/core/styles");
35
+
36
+ var _MatrixColumnsSizeHeaderInput = _interopRequireDefault(require("./MatrixColumnsSizeHeaderInput"));
37
+
38
+ var _MatrixRowsSizeHeaderInput = _interopRequireDefault(require("./MatrixRowsSizeHeaderInput"));
39
+
40
+ var _MatrixLabelTypeHeaderInput = _interopRequireDefault(require("./MatrixLabelTypeHeaderInput"));
41
+
42
+ var _MatrixValues = _interopRequireDefault(require("./MatrixValues"));
43
+
44
+ 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); }; }
45
+
46
+ 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; } }
47
+
48
+ 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; }
49
+
50
+ 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; }
51
+
52
+ var Panel = _configUi.settings.Panel,
53
+ toggle = _configUi.settings.toggle,
54
+ radio = _configUi.settings.radio;
55
+
56
+ var styles = function styles(theme) {
57
+ return {
58
+ promptHolder: {
59
+ width: '100%',
60
+ paddingTop: theme.spacing.unit * 2,
61
+ marginBottom: theme.spacing.unit * 2
62
+ },
63
+ matrixHeaderOptionsHolder: {
64
+ display: 'flex',
65
+ flexWrap: 'wrap',
66
+ width: '100%',
67
+ paddingBottom: theme.spacing.unit * 2.5,
68
+ justifyContent: 'space-around'
69
+ },
70
+ errorText: {
71
+ fontSize: theme.typography.fontSize - 2,
72
+ color: theme.palette.error.main,
73
+ paddingTop: theme.spacing.unit
74
+ }
75
+ };
76
+ };
77
+
78
+ var Design = (0, _styles.withStyles)(styles)(function (props) {
79
+ var classes = props.classes,
80
+ model = props.model,
81
+ configuration = props.configuration,
82
+ onPromptChanged = props.onPromptChanged,
83
+ imageSupport = props.imageSupport,
84
+ uploadSoundSupport = props.uploadSoundSupport,
85
+ onChangeModel = props.onChangeModel,
86
+ onConfigurationChanged = props.onConfigurationChanged,
87
+ onTeacherInstructionsChanged = props.onTeacherInstructionsChanged;
88
+
89
+ var _ref = configuration || {},
90
+ _ref$baseInputConfigu = _ref.baseInputConfiguration,
91
+ baseInputConfiguration = _ref$baseInputConfigu === void 0 ? {} : _ref$baseInputConfigu,
92
+ _ref$contentDimension = _ref.contentDimensions,
93
+ contentDimensions = _ref$contentDimension === void 0 ? {} : _ref$contentDimension,
94
+ _ref$prompt = _ref.prompt,
95
+ prompt = _ref$prompt === void 0 ? {} : _ref$prompt,
96
+ _ref$scoringType = _ref.scoringType,
97
+ scoringType = _ref$scoringType === void 0 ? {} : _ref$scoringType,
98
+ settingsPanelDisabled = _ref.settingsPanelDisabled,
99
+ _ref$spellCheck = _ref.spellCheck,
100
+ spellCheck = _ref$spellCheck === void 0 ? {} : _ref$spellCheck,
101
+ _ref$teacherInstructi = _ref.teacherInstructions,
102
+ teacherInstructions = _ref$teacherInstructi === void 0 ? {} : _ref$teacherInstructi;
103
+
104
+ var _ref2 = model || {},
105
+ _ref2$errors = _ref2.errors,
106
+ errors = _ref2$errors === void 0 ? {} : _ref2$errors,
107
+ teacherInstructionsEnabled = _ref2.teacherInstructionsEnabled,
108
+ spellCheckEnabled = _ref2.spellCheckEnabled;
109
+
110
+ var promptError = errors.prompt,
111
+ teacherInstructionsError = errors.teacherInstructions;
112
+ var panelProperties = {
113
+ teacherInstructionsEnabled: teacherInstructions.settings && toggle(teacherInstructions.label),
114
+ spellCheckEnabled: spellCheck.settings && toggle(spellCheck.label),
115
+ scoringType: scoringType.settings && radio(scoringType.label, ['auto', 'rubric'])
116
+ };
117
+
118
+ var getPluginProps = function getPluginProps() {
119
+ var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
120
+ return _objectSpread(_objectSpread({}, baseInputConfiguration), props);
121
+ };
122
+
123
+ return /*#__PURE__*/_react["default"].createElement(_configUi.layout.ConfigLayout, {
124
+ dimensions: contentDimensions,
125
+ hideSettings: settingsPanelDisabled,
126
+ settings: /*#__PURE__*/_react["default"].createElement(Panel, {
127
+ model: model,
128
+ onChangeModel: onChangeModel,
129
+ configuration: configuration,
130
+ onChangeConfiguration: onConfigurationChanged,
131
+ groups: {
132
+ Properties: panelProperties
133
+ }
134
+ })
135
+ }, teacherInstructionsEnabled && /*#__PURE__*/_react["default"].createElement(_configUi.InputContainer, {
136
+ label: teacherInstructions.label,
137
+ className: classes.promptHolder
138
+ }, /*#__PURE__*/_react["default"].createElement(_editableHtml.EditableHtml, {
139
+ className: classes.prompt,
140
+ markup: model.teacherInstructions || '',
141
+ onChange: onTeacherInstructionsChanged,
142
+ imageSupport: imageSupport,
143
+ error: teacherInstructionsError,
144
+ pluginProps: getPluginProps(teacherInstructions === null || teacherInstructions === void 0 ? void 0 : teacherInstructions.inputConfiguration),
145
+ nonEmpty: false,
146
+ spellCheck: spellCheckEnabled,
147
+ uploadSoundSupport: uploadSoundSupport
148
+ }), teacherInstructionsError && /*#__PURE__*/_react["default"].createElement("div", {
149
+ className: classes.errorText
150
+ }, teacherInstructionsError)), /*#__PURE__*/_react["default"].createElement(_configUi.InputContainer, {
151
+ label: prompt.label,
152
+ className: classes.promptHolder
153
+ }, /*#__PURE__*/_react["default"].createElement(_editableHtml.EditableHtml, {
154
+ className: classes.prompt,
155
+ markup: model.prompt,
156
+ onChange: onPromptChanged,
157
+ imageSupport: imageSupport,
158
+ error: promptError,
159
+ pluginProps: getPluginProps(prompt === null || prompt === void 0 ? void 0 : prompt.inputConfiguration),
160
+ nonEmpty: !prompt.settings,
161
+ spellCheck: spellCheckEnabled,
162
+ uploadSoundSupport: uploadSoundSupport,
163
+ disableUnderline: true
164
+ }), promptError && /*#__PURE__*/_react["default"].createElement("div", {
165
+ className: classes.errorText
166
+ }, promptError)), /*#__PURE__*/_react["default"].createElement("div", {
167
+ className: classes.matrixHeaderOptionsHolder
168
+ }, /*#__PURE__*/_react["default"].createElement(_MatrixRowsSizeHeaderInput["default"], {
169
+ model: model,
170
+ onChangeModel: onChangeModel
171
+ }), /*#__PURE__*/_react["default"].createElement(_MatrixColumnsSizeHeaderInput["default"], {
172
+ model: model,
173
+ onChangeModel: onChangeModel
174
+ }), /*#__PURE__*/_react["default"].createElement(_MatrixLabelTypeHeaderInput["default"], {
175
+ model: model,
176
+ onChangeModel: onChangeModel
177
+ })), /*#__PURE__*/_react["default"].createElement(_MatrixValues["default"], {
178
+ model: model,
179
+ onChangeModel: onChangeModel
180
+ }));
181
+ });
182
+
183
+ var Main = /*#__PURE__*/function (_React$Component) {
184
+ (0, _inherits2["default"])(Main, _React$Component);
185
+
186
+ var _super = _createSuper(Main);
187
+
188
+ function Main() {
189
+ var _this;
190
+
191
+ (0, _classCallCheck2["default"])(this, Main);
192
+
193
+ for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
194
+ args[_key] = arguments[_key];
195
+ }
196
+
197
+ _this = _super.call.apply(_super, [this].concat(args));
198
+ (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onPromptChanged", function (prompt) {
199
+ _this.props.onModelChanged(_objectSpread(_objectSpread({}, _this.props.model), {}, {
200
+ prompt: prompt
201
+ }));
202
+ });
203
+ (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onChangeModel", function (data) {
204
+ _this.props.onModelChanged(_objectSpread(_objectSpread({}, _this.props.model), data));
205
+ });
206
+ (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onTeacherInstructionsChanged", function (teacherInstructions) {
207
+ _this.props.onModelChanged(_objectSpread(_objectSpread({}, _this.props.model), {}, {
208
+ teacherInstructions: teacherInstructions
209
+ }));
210
+ });
211
+ return _this;
212
+ }
213
+
214
+ (0, _createClass2["default"])(Main, [{
215
+ key: "render",
216
+ value: function render() {
217
+ return /*#__PURE__*/_react["default"].createElement(Design, (0, _extends2["default"])({}, this.props, {
218
+ onChangeModel: this.props.onModelChanged,
219
+ onPromptChanged: this.onPromptChanged,
220
+ onTeacherInstructionsChanged: this.onTeacherInstructionsChanged
221
+ }));
222
+ }
223
+ }]);
224
+ return Main;
225
+ }(_react["default"].Component);
226
+
227
+ exports.Main = Main;
228
+ (0, _defineProperty2["default"])(Main, "propTypes", {
229
+ model: _propTypes["default"].object.isRequired,
230
+ disableSidePanel: _propTypes["default"].bool,
231
+ onModelChanged: _propTypes["default"].func.isRequired,
232
+ onConfigurationChanged: _propTypes["default"].func.isRequired,
233
+ classes: _propTypes["default"].object.isRequired,
234
+ imageSupport: _propTypes["default"].shape({
235
+ add: _propTypes["default"].func.isRequired,
236
+ "delete": _propTypes["default"].func.isRequired
237
+ })
238
+ });
239
+ var Styled = (0, _styles.withStyles)(styles)(Main);
240
+ var _default = Styled;
241
+ exports["default"] = _default;
242
+ //# sourceMappingURL=Main.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/Main.jsx"],"names":["Panel","settings","toggle","radio","styles","theme","promptHolder","width","paddingTop","spacing","unit","marginBottom","matrixHeaderOptionsHolder","display","flexWrap","paddingBottom","justifyContent","errorText","fontSize","typography","color","palette","error","main","Design","props","classes","model","configuration","onPromptChanged","imageSupport","uploadSoundSupport","onChangeModel","onConfigurationChanged","onTeacherInstructionsChanged","baseInputConfiguration","contentDimensions","prompt","scoringType","settingsPanelDisabled","spellCheck","teacherInstructions","errors","teacherInstructionsEnabled","spellCheckEnabled","promptError","teacherInstructionsError","panelProperties","label","getPluginProps","Properties","inputConfiguration","Main","onModelChanged","data","React","Component","PropTypes","object","isRequired","disableSidePanel","bool","func","shape","add","Styled"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,IAAQA,KAAR,GAAiCC,kBAAjC,CAAQD,KAAR;AAAA,IAAeE,MAAf,GAAiCD,kBAAjC,CAAeC,MAAf;AAAA,IAAuBC,KAAvB,GAAiCF,kBAAjC,CAAuBE,KAAvB;;AAEA,IAAMC,MAAM,GAAG,SAATA,MAAS,CAACC,KAAD;AAAA,SAAY;AACzBC,IAAAA,YAAY,EAAE;AACZC,MAAAA,KAAK,EAAE,MADK;AAEZC,MAAAA,UAAU,EAAEH,KAAK,CAACI,OAAN,CAAcC,IAAd,GAAqB,CAFrB;AAGZC,MAAAA,YAAY,EAAEN,KAAK,CAACI,OAAN,CAAcC,IAAd,GAAqB;AAHvB,KADW;AAMzBE,IAAAA,yBAAyB,EAAE;AACzBC,MAAAA,OAAO,EAAE,MADgB;AAEzBC,MAAAA,QAAQ,EAAE,MAFe;AAGzBP,MAAAA,KAAK,EAAE,MAHkB;AAIzBQ,MAAAA,aAAa,EAAEV,KAAK,CAACI,OAAN,CAAcC,IAAd,GAAqB,GAJX;AAKzBM,MAAAA,cAAc,EAAE;AALS,KANF;AAazBC,IAAAA,SAAS,EAAE;AACTC,MAAAA,QAAQ,EAAEb,KAAK,CAACc,UAAN,CAAiBD,QAAjB,GAA4B,CAD7B;AAETE,MAAAA,KAAK,EAAEf,KAAK,CAACgB,OAAN,CAAcC,KAAd,CAAoBC,IAFlB;AAGTf,MAAAA,UAAU,EAAEH,KAAK,CAACI,OAAN,CAAcC;AAHjB;AAbc,GAAZ;AAAA,CAAf;;AAoBA,IAAMc,MAAM,GAAG,wBAAWpB,MAAX,EAAmB,UAACqB,KAAD,EAAW;AAC3C,MACEC,OADF,GAUID,KAVJ,CACEC,OADF;AAAA,MAEEC,KAFF,GAUIF,KAVJ,CAEEE,KAFF;AAAA,MAGEC,aAHF,GAUIH,KAVJ,CAGEG,aAHF;AAAA,MAIEC,eAJF,GAUIJ,KAVJ,CAIEI,eAJF;AAAA,MAKEC,YALF,GAUIL,KAVJ,CAKEK,YALF;AAAA,MAMEC,kBANF,GAUIN,KAVJ,CAMEM,kBANF;AAAA,MAOEC,aAPF,GAUIP,KAVJ,CAOEO,aAPF;AAAA,MAQEC,sBARF,GAUIR,KAVJ,CAQEQ,sBARF;AAAA,MASEC,4BATF,GAUIT,KAVJ,CASES,4BATF;;AAWA,aAQIN,aAAa,IAAI,EARrB;AAAA,mCACEO,sBADF;AAAA,MACEA,sBADF,sCAC2B,EAD3B;AAAA,mCAEEC,iBAFF;AAAA,MAEEA,iBAFF,sCAEsB,EAFtB;AAAA,yBAGEC,MAHF;AAAA,MAGEA,MAHF,4BAGW,EAHX;AAAA,8BAIEC,WAJF;AAAA,MAIEA,WAJF,iCAIgB,EAJhB;AAAA,MAKEC,qBALF,QAKEA,qBALF;AAAA,6BAMEC,UANF;AAAA,MAMEA,UANF,gCAMe,EANf;AAAA,mCAOEC,mBAPF;AAAA,MAOEA,mBAPF,sCAOwB,EAPxB;;AASA,cAAuEd,KAAK,IAAI,EAAhF;AAAA,2BAAQe,MAAR;AAAA,MAAQA,MAAR,6BAAiB,EAAjB;AAAA,MAAqBC,0BAArB,SAAqBA,0BAArB;AAAA,MAAiDC,iBAAjD,SAAiDA,iBAAjD;;AACA,MAAgBC,WAAhB,GAA+EH,MAA/E,CAAQL,MAAR;AAAA,MAAkDS,wBAAlD,GAA+EJ,MAA/E,CAA6BD,mBAA7B;AAEA,MAAMM,eAAe,GAAG;AACtBJ,IAAAA,0BAA0B,EAAEF,mBAAmB,CAACxC,QAApB,IAAgCC,MAAM,CAACuC,mBAAmB,CAACO,KAArB,CAD5C;AAEtBJ,IAAAA,iBAAiB,EAAEJ,UAAU,CAACvC,QAAX,IAAuBC,MAAM,CAACsC,UAAU,CAACQ,KAAZ,CAF1B;AAGtBV,IAAAA,WAAW,EAAEA,WAAW,CAACrC,QAAZ,IAAwBE,KAAK,CAACmC,WAAW,CAACU,KAAb,EAAoB,CAAC,MAAD,EAAS,QAAT,CAApB;AAHpB,GAAxB;;AAMA,MAAMC,cAAc,GAAG,SAAjBA,cAAiB;AAAA,QAACxB,KAAD,uEAAS,EAAT;AAAA,2CAClBU,sBADkB,GAElBV,KAFkB;AAAA,GAAvB;;AAKA,sBACE,gCAAC,gBAAD,CAAQ,YAAR;AACE,IAAA,UAAU,EAAEW,iBADd;AAEE,IAAA,YAAY,EAAEG,qBAFhB;AAGE,IAAA,QAAQ,eACN,gCAAC,KAAD;AACE,MAAA,KAAK,EAAEZ,KADT;AAEE,MAAA,aAAa,EAAEK,aAFjB;AAGE,MAAA,aAAa,EAAEJ,aAHjB;AAIE,MAAA,qBAAqB,EAAEK,sBAJzB;AAKE,MAAA,MAAM,EAAE;AACNiB,QAAAA,UAAU,EAAEH;AADN;AALV;AAJJ,KAeGJ,0BAA0B,iBACzB,gCAAC,wBAAD;AAAgB,IAAA,KAAK,EAAEF,mBAAmB,CAACO,KAA3C;AAAkD,IAAA,SAAS,EAAEtB,OAAO,CAACpB;AAArE,kBACE,gCAAC,0BAAD;AACE,IAAA,SAAS,EAAEoB,OAAO,CAACW,MADrB;AAEE,IAAA,MAAM,EAAEV,KAAK,CAACc,mBAAN,IAA6B,EAFvC;AAGE,IAAA,QAAQ,EAAEP,4BAHZ;AAIE,IAAA,YAAY,EAAEJ,YAJhB;AAKE,IAAA,KAAK,EAAEgB,wBALT;AAME,IAAA,WAAW,EAAEG,cAAc,CAACR,mBAAD,aAACA,mBAAD,uBAACA,mBAAmB,CAAEU,kBAAtB,CAN7B;AAOE,IAAA,QAAQ,EAAE,KAPZ;AAQE,IAAA,UAAU,EAAEP,iBARd;AASE,IAAA,kBAAkB,EAAEb;AATtB,IADF,EAYGe,wBAAwB,iBAAI;AAAK,IAAA,SAAS,EAAEpB,OAAO,CAACT;AAAxB,KAAoC6B,wBAApC,CAZ/B,CAhBJ,eAgCE,gCAAC,wBAAD;AAAgB,IAAA,KAAK,EAAET,MAAM,CAACW,KAA9B;AAAqC,IAAA,SAAS,EAAEtB,OAAO,CAACpB;AAAxD,kBACE,gCAAC,0BAAD;AACE,IAAA,SAAS,EAAEoB,OAAO,CAACW,MADrB;AAEE,IAAA,MAAM,EAAEV,KAAK,CAACU,MAFhB;AAGE,IAAA,QAAQ,EAAER,eAHZ;AAIE,IAAA,YAAY,EAAEC,YAJhB;AAKE,IAAA,KAAK,EAAEe,WALT;AAME,IAAA,WAAW,EAAEI,cAAc,CAACZ,MAAD,aAACA,MAAD,uBAACA,MAAM,CAAEc,kBAAT,CAN7B;AAOE,IAAA,QAAQ,EAAE,CAACd,MAAM,CAACpC,QAPpB;AAQE,IAAA,UAAU,EAAE2C,iBARd;AASE,IAAA,kBAAkB,EAAEb,kBATtB;AAUE,IAAA,gBAAgB;AAVlB,IADF,EAaGc,WAAW,iBAAI;AAAK,IAAA,SAAS,EAAEnB,OAAO,CAACT;AAAxB,KAAoC4B,WAApC,CAblB,CAhCF,eAgDE;AAAK,IAAA,SAAS,EAAEnB,OAAO,CAACd;AAAxB,kBACE,gCAAC,qCAAD;AAA2B,IAAA,KAAK,EAAEe,KAAlC;AAAyC,IAAA,aAAa,EAAEK;AAAxD,IADF,eAEE,gCAAC,wCAAD;AAA8B,IAAA,KAAK,EAAEL,KAArC;AAA4C,IAAA,aAAa,EAAEK;AAA3D,IAFF,eAGE,gCAAC,sCAAD;AAA4B,IAAA,KAAK,EAAEL,KAAnC;AAA0C,IAAA,aAAa,EAAEK;AAAzD,IAHF,CAhDF,eAsDE,gCAAC,wBAAD;AAAc,IAAA,KAAK,EAAEL,KAArB;AAA4B,IAAA,aAAa,EAAEK;AAA3C,IAtDF,CADF;AA0DD,CA7Fc,CAAf;;IA+FaoB,I;;;;;;;;;;;;;;;wGAaO,UAACf,MAAD,EAAY;AAC5B,YAAKZ,KAAL,CAAW4B,cAAX,iCAA+B,MAAK5B,KAAL,CAAWE,KAA1C;AAAiDU,QAAAA,MAAM,EAANA;AAAjD;AACD,K;sGAEe,UAACiB,IAAD,EAAU;AACxB,YAAK7B,KAAL,CAAW4B,cAAX,iCAA+B,MAAK5B,KAAL,CAAWE,KAA1C,GAAoD2B,IAApD;AACD,K;qHAE8B,UAACb,mBAAD,EAAyB;AACtD,YAAKhB,KAAL,CAAW4B,cAAX,iCAA+B,MAAK5B,KAAL,CAAWE,KAA1C;AAAiDc,QAAAA,mBAAmB,EAAnBA;AAAjD;AACD,K;;;;;;WAED,kBAAS;AACP,0BACE,gCAAC,MAAD,gCACM,KAAKhB,KADX;AAEE,QAAA,aAAa,EAAE,KAAKA,KAAL,CAAW4B,cAF5B;AAGE,QAAA,eAAe,EAAE,KAAKxB,eAHxB;AAIE,QAAA,4BAA4B,EAAE,KAAKK;AAJrC,SADF;AAQD;;;EAlCuBqB,kBAAMC,S;;;iCAAnBJ,I,eACQ;AACjBzB,EAAAA,KAAK,EAAE8B,sBAAUC,MAAV,CAAiBC,UADP;AAEjBC,EAAAA,gBAAgB,EAAEH,sBAAUI,IAFX;AAGjBR,EAAAA,cAAc,EAAEI,sBAAUK,IAAV,CAAeH,UAHd;AAIjB1B,EAAAA,sBAAsB,EAAEwB,sBAAUK,IAAV,CAAeH,UAJtB;AAKjBjC,EAAAA,OAAO,EAAE+B,sBAAUC,MAAV,CAAiBC,UALT;AAMjB7B,EAAAA,YAAY,EAAE2B,sBAAUM,KAAV,CAAgB;AAC5BC,IAAAA,GAAG,EAAEP,sBAAUK,IAAV,CAAeH,UADQ;AAE5B,cAAQF,sBAAUK,IAAV,CAAeH;AAFK,GAAhB;AANG,C;AAoCrB,IAAMM,MAAM,GAAG,wBAAW7D,MAAX,EAAmBgD,IAAnB,CAAf;eAEea,M","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { EditableHtml } from '@pie-lib/pie-toolbox/editable-html';\nimport { InputContainer, settings, layout } from '@pie-lib/pie-toolbox/config-ui';\nimport { withStyles } from '@material-ui/core/styles';\nimport MatrixColumnsSizeHeaderInput from './MatrixColumnsSizeHeaderInput';\nimport MatrixRowsSizeHeaderInput from './MatrixRowsSizeHeaderInput';\nimport MatrixLabelTypeHeaderInput from './MatrixLabelTypeHeaderInput';\nimport MatrixValues from './MatrixValues';\n\nconst { Panel, toggle, radio } = settings;\n\nconst styles = (theme) => ({\n promptHolder: {\n width: '100%',\n paddingTop: theme.spacing.unit * 2,\n marginBottom: theme.spacing.unit * 2,\n },\n matrixHeaderOptionsHolder: {\n display: 'flex',\n flexWrap: 'wrap',\n width: '100%',\n paddingBottom: theme.spacing.unit * 2.5,\n justifyContent: 'space-around',\n },\n errorText: {\n fontSize: theme.typography.fontSize - 2,\n color: theme.palette.error.main,\n paddingTop: theme.spacing.unit,\n },\n});\n\nconst Design = withStyles(styles)((props) => {\n const {\n classes,\n model,\n configuration,\n onPromptChanged,\n imageSupport,\n uploadSoundSupport,\n onChangeModel,\n onConfigurationChanged,\n onTeacherInstructionsChanged,\n } = props;\n const {\n baseInputConfiguration = {},\n contentDimensions = {},\n prompt = {},\n scoringType = {},\n settingsPanelDisabled,\n spellCheck = {},\n teacherInstructions = {},\n } = configuration || {};\n const { errors = {}, teacherInstructionsEnabled, spellCheckEnabled } = model || {};\n const { prompt: promptError, teacherInstructions: teacherInstructionsError } = errors;\n\n const panelProperties = {\n teacherInstructionsEnabled: teacherInstructions.settings && toggle(teacherInstructions.label),\n spellCheckEnabled: spellCheck.settings && toggle(spellCheck.label),\n scoringType: scoringType.settings && radio(scoringType.label, ['auto', 'rubric']),\n };\n\n const getPluginProps = (props = {}) => ({\n ...baseInputConfiguration,\n ...props,\n });\n\n return (\n <layout.ConfigLayout\n dimensions={contentDimensions}\n hideSettings={settingsPanelDisabled}\n settings={\n <Panel\n model={model}\n onChangeModel={onChangeModel}\n configuration={configuration}\n onChangeConfiguration={onConfigurationChanged}\n groups={{\n Properties: panelProperties,\n }}\n />\n }\n >\n {teacherInstructionsEnabled && (\n <InputContainer label={teacherInstructions.label} className={classes.promptHolder}>\n <EditableHtml\n className={classes.prompt}\n markup={model.teacherInstructions || ''}\n onChange={onTeacherInstructionsChanged}\n imageSupport={imageSupport}\n error={teacherInstructionsError}\n pluginProps={getPluginProps(teacherInstructions?.inputConfiguration)}\n nonEmpty={false}\n spellCheck={spellCheckEnabled}\n uploadSoundSupport={uploadSoundSupport}\n />\n {teacherInstructionsError && <div className={classes.errorText}>{teacherInstructionsError}</div>}\n </InputContainer>\n )}\n\n <InputContainer label={prompt.label} className={classes.promptHolder}>\n <EditableHtml\n className={classes.prompt}\n markup={model.prompt}\n onChange={onPromptChanged}\n imageSupport={imageSupport}\n error={promptError}\n pluginProps={getPluginProps(prompt?.inputConfiguration)}\n nonEmpty={!prompt.settings}\n spellCheck={spellCheckEnabled}\n uploadSoundSupport={uploadSoundSupport}\n disableUnderline\n />\n {promptError && <div className={classes.errorText}>{promptError}</div>}\n </InputContainer>\n\n <div className={classes.matrixHeaderOptionsHolder}>\n <MatrixRowsSizeHeaderInput model={model} onChangeModel={onChangeModel} />\n <MatrixColumnsSizeHeaderInput model={model} onChangeModel={onChangeModel} />\n <MatrixLabelTypeHeaderInput model={model} onChangeModel={onChangeModel} />\n </div>\n\n <MatrixValues model={model} onChangeModel={onChangeModel} />\n </layout.ConfigLayout>\n );\n});\n\nexport class Main extends React.Component {\n static propTypes = {\n model: PropTypes.object.isRequired,\n disableSidePanel: PropTypes.bool,\n onModelChanged: PropTypes.func.isRequired,\n onConfigurationChanged: PropTypes.func.isRequired,\n classes: PropTypes.object.isRequired,\n imageSupport: PropTypes.shape({\n add: PropTypes.func.isRequired,\n delete: PropTypes.func.isRequired,\n }),\n };\n\n onPromptChanged = (prompt) => {\n this.props.onModelChanged({ ...this.props.model, prompt });\n };\n\n onChangeModel = (data) => {\n this.props.onModelChanged({ ...this.props.model, ...data });\n };\n\n onTeacherInstructionsChanged = (teacherInstructions) => {\n this.props.onModelChanged({ ...this.props.model, teacherInstructions });\n };\n\n render() {\n return (\n <Design\n {...this.props}\n onChangeModel={this.props.onModelChanged}\n onPromptChanged={this.onPromptChanged}\n onTeacherInstructionsChanged={this.onTeacherInstructionsChanged}\n />\n );\n }\n}\n\nconst Styled = withStyles(styles)(Main);\n\nexport default Styled;\n"],"file":"Main.js"}
@@ -0,0 +1,76 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports["default"] = void 0;
9
+
10
+ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
11
+
12
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
13
+
14
+ var _react = _interopRequireDefault(require("react"));
15
+
16
+ var _Add = _interopRequireDefault(require("@material-ui/icons/Add"));
17
+
18
+ var _Remove = _interopRequireDefault(require("@material-ui/icons/Remove"));
19
+
20
+ var _propTypes = _interopRequireDefault(require("prop-types"));
21
+
22
+ var _HeaderCommon = require("./HeaderCommon");
23
+
24
+ var _matrixEntities = require("./matrixEntities");
25
+
26
+ 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; }
27
+
28
+ 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; }
29
+
30
+ var MatrixColumnsSizeHeaderInput = function MatrixColumnsSizeHeaderInput(_ref) {
31
+ var model = _ref.model,
32
+ onChangeModel = _ref.onChangeModel;
33
+
34
+ var onIncrementColumnsSize = function onIncrementColumnsSize() {
35
+ onChangeModel(_objectSpread(_objectSpread({}, model), {}, {
36
+ columnLabels: [].concat((0, _toConsumableArray2["default"])(model.columnLabels), ["COLUMN ".concat(model.columnLabels.length + 1)]),
37
+ labelType: _matrixEntities.MATRIX_LABEL_TYPE.custom
38
+ }));
39
+ };
40
+
41
+ var onDecrementColumnsSize = function onDecrementColumnsSize() {
42
+ var columnLabelsLength = model.columnLabels.length;
43
+
44
+ if (columnLabelsLength <= 1) {
45
+ return;
46
+ }
47
+
48
+ var columnLabelsNext = (0, _toConsumableArray2["default"])(model.columnLabels);
49
+ columnLabelsNext.pop();
50
+
51
+ var matrixValuesClone = _objectSpread({}, model.matrixValues);
52
+
53
+ model.rowLabels.forEach(function (rowLabel, rowIndex) {
54
+ delete matrixValuesClone["".concat(rowIndex, "-").concat(columnLabelsLength - 1)];
55
+ });
56
+ onChangeModel(_objectSpread(_objectSpread({}, model), {}, {
57
+ columnLabels: columnLabelsNext,
58
+ matrixValues: matrixValuesClone,
59
+ labelType: _matrixEntities.MATRIX_LABEL_TYPE.custom
60
+ }));
61
+ };
62
+
63
+ return /*#__PURE__*/_react["default"].createElement(_HeaderCommon.ColumnsWrapper, null, /*#__PURE__*/_react["default"].createElement(_HeaderCommon.ColumnsHeader, null, "Matrix Columns"), /*#__PURE__*/_react["default"].createElement(_HeaderCommon.NumberInputFormGroupWrapper, null, /*#__PURE__*/_react["default"].createElement(_HeaderCommon.IconWrapper, null, /*#__PURE__*/_react["default"].createElement(_Remove["default"], {
64
+ onClick: onDecrementColumnsSize
65
+ })), /*#__PURE__*/_react["default"].createElement("p", null, model.columnLabels.length), /*#__PURE__*/_react["default"].createElement(_HeaderCommon.IconWrapper, null, /*#__PURE__*/_react["default"].createElement(_Add["default"], {
66
+ onClick: onIncrementColumnsSize
67
+ }))));
68
+ };
69
+
70
+ MatrixColumnsSizeHeaderInput.propTypes = {
71
+ model: _propTypes["default"].object.isRequired,
72
+ onChangeModel: _propTypes["default"].func.isRequired
73
+ };
74
+ var _default = MatrixColumnsSizeHeaderInput;
75
+ exports["default"] = _default;
76
+ //# sourceMappingURL=MatrixColumnsSizeHeaderInput.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/MatrixColumnsSizeHeaderInput.js"],"names":["MatrixColumnsSizeHeaderInput","model","onChangeModel","onIncrementColumnsSize","columnLabels","length","labelType","MATRIX_LABEL_TYPE","custom","onDecrementColumnsSize","columnLabelsLength","columnLabelsNext","pop","matrixValuesClone","matrixValues","rowLabels","forEach","rowLabel","rowIndex","propTypes","PropTypes","object","isRequired","func"],"mappings":";;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;AACA;;;;;;AAEA,IAAMA,4BAA4B,GAAG,SAA/BA,4BAA+B,OAA8B;AAAA,MAA3BC,KAA2B,QAA3BA,KAA2B;AAAA,MAApBC,aAAoB,QAApBA,aAAoB;;AACjE,MAAMC,sBAAsB,GAAG,SAAzBA,sBAAyB,GAAM;AACnCD,IAAAA,aAAa,iCACRD,KADQ;AAEXG,MAAAA,YAAY,gDAAMH,KAAK,CAACG,YAAZ,qBAAoCH,KAAK,CAACG,YAAN,CAAmBC,MAAnB,GAA4B,CAAhE,GAFD;AAGXC,MAAAA,SAAS,EAAEC,kCAAkBC;AAHlB,OAAb;AAKD,GAND;;AAQA,MAAMC,sBAAsB,GAAG,SAAzBA,sBAAyB,GAAM;AACnC,QAAMC,kBAAkB,GAAGT,KAAK,CAACG,YAAN,CAAmBC,MAA9C;;AACA,QAAIK,kBAAkB,IAAI,CAA1B,EAA6B;AAC3B;AACD;;AACD,QAAMC,gBAAgB,uCAAOV,KAAK,CAACG,YAAb,CAAtB;AACAO,IAAAA,gBAAgB,CAACC,GAAjB;;AAEA,QAAMC,iBAAiB,qBAAQZ,KAAK,CAACa,YAAd,CAAvB;;AACAb,IAAAA,KAAK,CAACc,SAAN,CAAgBC,OAAhB,CAAwB,UAACC,QAAD,EAAWC,QAAX,EAAwB;AAC9C,aAAOL,iBAAiB,WAAIK,QAAJ,cAAgBR,kBAAkB,GAAG,CAArC,EAAxB;AACD,KAFD;AAIAR,IAAAA,aAAa,iCACRD,KADQ;AAEXG,MAAAA,YAAY,EAAEO,gBAFH;AAGXG,MAAAA,YAAY,EAAED,iBAHH;AAIXP,MAAAA,SAAS,EAAEC,kCAAkBC;AAJlB,OAAb;AAMD,GAnBD;;AAoBA,sBACE,gCAAC,4BAAD,qBACE,gCAAC,2BAAD,yBADF,eAEE,gCAAC,yCAAD,qBACE,gCAAC,yBAAD,qBACE,gCAAC,kBAAD;AAAY,IAAA,OAAO,EAAEC;AAArB,IADF,CADF,eAIE,2CAAIR,KAAK,CAACG,YAAN,CAAmBC,MAAvB,CAJF,eAKE,gCAAC,yBAAD,qBACE,gCAAC,eAAD;AAAS,IAAA,OAAO,EAAEF;AAAlB,IADF,CALF,CAFF,CADF;AAcD,CA3CD;;AA6CAH,4BAA4B,CAACmB,SAA7B,GAAyC;AACvClB,EAAAA,KAAK,EAAEmB,sBAAUC,MAAV,CAAiBC,UADe;AAEvCpB,EAAAA,aAAa,EAAEkB,sBAAUG,IAAV,CAAeD;AAFS,CAAzC;eAKetB,4B","sourcesContent":["import React from 'react';\nimport AddIcon from '@material-ui/icons/Add';\nimport RemoveIcon from '@material-ui/icons/Remove';\nimport PropTypes from 'prop-types';\n\nimport { ColumnsHeader, ColumnsWrapper, IconWrapper, NumberInputFormGroupWrapper } from './HeaderCommon';\nimport { MATRIX_LABEL_TYPE } from './matrixEntities';\n\nconst MatrixColumnsSizeHeaderInput = ({ model, onChangeModel }) => {\n const onIncrementColumnsSize = () => {\n onChangeModel({\n ...model,\n columnLabels: [...model.columnLabels, `COLUMN ${model.columnLabels.length + 1}`],\n labelType: MATRIX_LABEL_TYPE.custom,\n });\n };\n\n const onDecrementColumnsSize = () => {\n const columnLabelsLength = model.columnLabels.length;\n if (columnLabelsLength <= 1) {\n return;\n }\n const columnLabelsNext = [...model.columnLabels];\n columnLabelsNext.pop();\n\n const matrixValuesClone = { ...model.matrixValues };\n model.rowLabels.forEach((rowLabel, rowIndex) => {\n delete matrixValuesClone[`${rowIndex}-${columnLabelsLength - 1}`];\n });\n\n onChangeModel({\n ...model,\n columnLabels: columnLabelsNext,\n matrixValues: matrixValuesClone,\n labelType: MATRIX_LABEL_TYPE.custom,\n });\n };\n return (\n <ColumnsWrapper>\n <ColumnsHeader>Matrix Columns</ColumnsHeader>\n <NumberInputFormGroupWrapper>\n <IconWrapper>\n <RemoveIcon onClick={onDecrementColumnsSize} />\n </IconWrapper>\n <p>{model.columnLabels.length}</p>\n <IconWrapper>\n <AddIcon onClick={onIncrementColumnsSize} />\n </IconWrapper>\n </NumberInputFormGroupWrapper>\n </ColumnsWrapper>\n );\n};\n\nMatrixColumnsSizeHeaderInput.propTypes = {\n model: PropTypes.object.isRequired,\n onChangeModel: PropTypes.func.isRequired,\n};\n\nexport default MatrixColumnsSizeHeaderInput;\n"],"file":"MatrixColumnsSizeHeaderInput.js"}
@@ -0,0 +1,219 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ var _typeof = require("@babel/runtime/helpers/typeof");
6
+
7
+ Object.defineProperty(exports, "__esModule", {
8
+ value: true
9
+ });
10
+ exports["default"] = exports.ACTION_TYPE = void 0;
11
+
12
+ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
13
+
14
+ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
15
+
16
+ var _react = _interopRequireWildcard(require("react"));
17
+
18
+ var _styledComponents = _interopRequireDefault(require("styled-components"));
19
+
20
+ var _KeyboardArrowDown = _interopRequireDefault(require("@material-ui/icons/KeyboardArrowDown"));
21
+
22
+ var _Menu = _interopRequireDefault(require("@material-ui/core/Menu"));
23
+
24
+ var _MenuItem = _interopRequireDefault(require("@material-ui/core/MenuItem"));
25
+
26
+ var _propTypes = _interopRequireDefault(require("prop-types"));
27
+
28
+ var _NumberInput = _interopRequireDefault(require("./NumberInput"));
29
+
30
+ var _isNumeric = _interopRequireDefault(require("./isNumeric"));
31
+
32
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
33
+
34
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
35
+
36
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
37
+
38
+ var MatrixEditableButtonWrapper = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n width: 100%;\n height: 50px;\n margin: 1px;\n background: #04b26e;\n border-radius: 5px;\n color: white;\n font-size: 14px;\n white-space: nowrap;\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
39
+
40
+ var MatrixEditableButtonContent = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n padding: 0 5px 0 12px;\n width: 100%;\n display: flex;\n align-items: center;\n overflow: hidden;\n"])));
41
+
42
+ var MatrixEditableButtonText = _styledComponents["default"].p(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n margin: 0;\n padding: 3px 0 3px 4px;\n cursor: pointer;\n width: 100%;\n\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n\n :hover {\n background: #00985d;\n }\n\n transition: all 0.1s ease-in-out;\n"])));
43
+
44
+ var MatrixEditableButtonActions = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n padding: 0 3px;\n height: 100%;\n cursor: pointer;\n display: flex;\n align-items: center;\n border-left: 3px solid #00985d;\n :hover {\n background: #00985d;\n border-top-right-radius: 5px;\n border-bottom-right-radius: 5px;\n }\n transition: all 0.1s ease-in-out;\n"])));
45
+
46
+ var IconWrapper = _styledComponents["default"].div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n font-size: 18px;\n"])));
47
+
48
+ var InputWrapper = _styledComponents["default"].input(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n margin: 0;\n padding: 0 0 0 4px;\n font-size: 14px;\n border: none;\n outline: none;\n color: white;\n width: 50px;\n width: 100%;\n background: #00985d;\n height: 22px;\n display: flex;\n align-items: center;\n"])));
49
+
50
+ var SetScoresToWrapper = _styledComponents["default"].div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n align-items: center;\n"])));
51
+
52
+ var SetScoresToInputWrapper = _styledComponents["default"].div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["\n width: 50px;\n margin-left: 10px;\n"])));
53
+
54
+ var ACTION_TYPE = {
55
+ clear: 'clear',
56
+ sortAscending: 'sortAscending',
57
+ sortDescending: 'sortDescending',
58
+ set: 'set'
59
+ };
60
+ exports.ACTION_TYPE = ACTION_TYPE;
61
+
62
+ var MatrixLabelEditableButton = function MatrixLabelEditableButton(props) {
63
+ var onLabelUpdate = props.onLabelUpdate,
64
+ value = props.value,
65
+ resourceIndex = props.resourceIndex,
66
+ onAction = props.onAction,
67
+ spellCheck = props.spellCheck;
68
+
69
+ var _useState = (0, _react.useState)(null),
70
+ _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
71
+ labelValue = _useState2[0],
72
+ setLabelValue = _useState2[1];
73
+
74
+ var _useState3 = (0, _react.useState)(''),
75
+ _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
76
+ scoreValue = _useState4[0],
77
+ setScoreValue = _useState4[1];
78
+
79
+ var _useState5 = (0, _react.useState)(false),
80
+ _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
81
+ showInput = _useState6[0],
82
+ setShowInput = _useState6[1];
83
+
84
+ var _React$useState = _react["default"].useState(null),
85
+ _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
86
+ anchorEl = _React$useState2[0],
87
+ setAnchorEl = _React$useState2[1];
88
+
89
+ var _React$useState3 = _react["default"].useState( /*#__PURE__*/_react["default"].createRef()),
90
+ _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 1),
91
+ scoresToRef = _React$useState4[0];
92
+
93
+ var open = Boolean(anchorEl);
94
+
95
+ var onActionClick = function onActionClick(event) {
96
+ setAnchorEl(event.currentTarget);
97
+ };
98
+
99
+ var handleClose = function handleClose(e) {
100
+ e.stopPropagation();
101
+ setAnchorEl(null);
102
+ setScoreValue('');
103
+ };
104
+
105
+ var onClearScores = function onClearScores(e) {
106
+ handleClose(e);
107
+ onAction({
108
+ resourceIndex: resourceIndex,
109
+ actionType: ACTION_TYPE.clear
110
+ });
111
+ };
112
+
113
+ var onSetScoresAscending = function onSetScoresAscending(e) {
114
+ handleClose(e);
115
+ onAction({
116
+ resourceIndex: resourceIndex,
117
+ actionType: ACTION_TYPE.sortAscending
118
+ });
119
+ };
120
+
121
+ var onSetScoresDescending = function onSetScoresDescending(e) {
122
+ handleClose(e);
123
+ onAction({
124
+ resourceIndex: resourceIndex,
125
+ actionType: ACTION_TYPE.sortDescending
126
+ });
127
+ };
128
+
129
+ var onSetScores = function onSetScores(value) {
130
+ if (!(0, _isNumeric["default"])(value)) {
131
+ setScoreValue('');
132
+ return;
133
+ }
134
+
135
+ var scoreValueNew = parseInt(value, 10);
136
+ setScoreValue(scoreValueNew);
137
+ onAction({
138
+ resourceIndex: resourceIndex,
139
+ actionType: ACTION_TYPE.set,
140
+ setValue: scoreValueNew
141
+ });
142
+ };
143
+
144
+ var onBlur = function onBlur() {
145
+ var labeValueTrimmed = labelValue.trim();
146
+
147
+ if (labeValueTrimmed) {
148
+ onLabelUpdate(labeValueTrimmed);
149
+ }
150
+
151
+ setLabelValue(null);
152
+ setShowInput(false);
153
+ };
154
+
155
+ var onShowInput = function onShowInput() {
156
+ setShowInput(true);
157
+ setLabelValue(value);
158
+ };
159
+
160
+ var onSetScoreToFocus = function onSetScoreToFocus() {
161
+ scoresToRef.current.focus();
162
+ };
163
+
164
+ return /*#__PURE__*/_react["default"].createElement(MatrixEditableButtonWrapper, null, /*#__PURE__*/_react["default"].createElement(MatrixEditableButtonContent, null, showInput ? /*#__PURE__*/_react["default"].createElement(InputWrapper, {
165
+ autoFocus: true,
166
+ value: labelValue,
167
+ onChange: function onChange(e) {
168
+ return setLabelValue(e.target.value);
169
+ },
170
+ onBlur: onBlur,
171
+ spellCheck: spellCheck
172
+ }) : /*#__PURE__*/_react["default"].createElement(MatrixEditableButtonText, {
173
+ onClick: onShowInput
174
+ }, value)), /*#__PURE__*/_react["default"].createElement(MatrixEditableButtonActions, {
175
+ onClick: onActionClick
176
+ }, /*#__PURE__*/_react["default"].createElement(IconWrapper, null, /*#__PURE__*/_react["default"].createElement(_KeyboardArrowDown["default"], {
177
+ fontSize: "inherit"
178
+ })), /*#__PURE__*/_react["default"].createElement(_Menu["default"], {
179
+ anchorEl: anchorEl,
180
+ open: open,
181
+ onClose: handleClose
182
+ }, /*#__PURE__*/_react["default"].createElement(_MenuItem["default"], {
183
+ key: "item1",
184
+ selected: false,
185
+ onClick: onClearScores
186
+ }, "Clear Scores"), /*#__PURE__*/_react["default"].createElement(_MenuItem["default"], {
187
+ key: "item2",
188
+ selected: false,
189
+ onClick: onSetScoresAscending
190
+ }, "Set Scores Ascending"), /*#__PURE__*/_react["default"].createElement(_MenuItem["default"], {
191
+ key: "item3",
192
+ selected: false,
193
+ onClick: onSetScoresDescending
194
+ }, "Set Scores Descending"), /*#__PURE__*/_react["default"].createElement(_MenuItem["default"], {
195
+ key: "item4",
196
+ selected: false
197
+ }, /*#__PURE__*/_react["default"].createElement(SetScoresToWrapper, null, /*#__PURE__*/_react["default"].createElement("p", {
198
+ onClick: onSetScoreToFocus
199
+ }, "Set Scores To"), /*#__PURE__*/_react["default"].createElement(SetScoresToInputWrapper, null, /*#__PURE__*/_react["default"].createElement(_NumberInput["default"], {
200
+ onFieldUpdate: onSetScores,
201
+ name: 'setScoreTo',
202
+ placeholder: "#",
203
+ fieldValue: {
204
+ value: scoreValue,
205
+ ref: scoresToRef
206
+ }
207
+ })))))));
208
+ };
209
+
210
+ MatrixLabelEditableButton.propTypes = {
211
+ value: _propTypes["default"].string.isRequired,
212
+ resourceIndex: _propTypes["default"].number.isRequired,
213
+ onLabelUpdate: _propTypes["default"].func.isRequired,
214
+ onAction: _propTypes["default"].func.isRequired,
215
+ spellCheck: _propTypes["default"].bool
216
+ };
217
+ var _default = MatrixLabelEditableButton;
218
+ exports["default"] = _default;
219
+ //# sourceMappingURL=MatrixLabelEditableButton.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/MatrixLabelEditableButton.js"],"names":["MatrixEditableButtonWrapper","styled","div","MatrixEditableButtonContent","MatrixEditableButtonText","p","MatrixEditableButtonActions","IconWrapper","InputWrapper","input","SetScoresToWrapper","SetScoresToInputWrapper","ACTION_TYPE","clear","sortAscending","sortDescending","set","MatrixLabelEditableButton","props","onLabelUpdate","value","resourceIndex","onAction","spellCheck","labelValue","setLabelValue","scoreValue","setScoreValue","showInput","setShowInput","React","useState","anchorEl","setAnchorEl","createRef","scoresToRef","open","Boolean","onActionClick","event","currentTarget","handleClose","e","stopPropagation","onClearScores","actionType","onSetScoresAscending","onSetScoresDescending","onSetScores","scoreValueNew","parseInt","setValue","onBlur","labeValueTrimmed","trim","onShowInput","onSetScoreToFocus","current","focus","target","ref","propTypes","PropTypes","string","isRequired","number","func","bool"],"mappings":"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","sourcesContent":["import React, { useState } from 'react';\nimport styled from 'styled-components';\nimport KeyboardArrowDownIcon from '@material-ui/icons/KeyboardArrowDown';\nimport Menu from '@material-ui/core/Menu';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport PropTypes from 'prop-types';\n\nimport NumberInput from './NumberInput';\nimport isNumeric from './isNumeric';\n\nconst MatrixEditableButtonWrapper = styled.div`\n width: 100%;\n height: 50px;\n margin: 1px;\n background: #04b26e;\n border-radius: 5px;\n color: white;\n font-size: 14px;\n white-space: nowrap;\n display: flex;\n align-items: center;\n justify-content: space-between;\n`;\n\nconst MatrixEditableButtonContent = styled.div`\n padding: 0 5px 0 12px;\n width: 100%;\n display: flex;\n align-items: center;\n overflow: hidden;\n`;\n\nconst MatrixEditableButtonText = styled.p`\n margin: 0;\n padding: 3px 0 3px 4px;\n cursor: pointer;\n width: 100%;\n\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n\n :hover {\n background: #00985d;\n }\n\n transition: all 0.1s ease-in-out;\n`;\n\nconst MatrixEditableButtonActions = styled.div`\n padding: 0 3px;\n height: 100%;\n cursor: pointer;\n display: flex;\n align-items: center;\n border-left: 3px solid #00985d;\n :hover {\n background: #00985d;\n border-top-right-radius: 5px;\n border-bottom-right-radius: 5px;\n }\n transition: all 0.1s ease-in-out;\n`;\n\nconst IconWrapper = styled.div`\n font-size: 18px;\n`;\n\nconst InputWrapper = styled.input`\n margin: 0;\n padding: 0 0 0 4px;\n font-size: 14px;\n border: none;\n outline: none;\n color: white;\n width: 50px;\n width: 100%;\n background: #00985d;\n height: 22px;\n display: flex;\n align-items: center;\n`;\n\nconst SetScoresToWrapper = styled.div`\n display: flex;\n align-items: center;\n`;\n\nconst SetScoresToInputWrapper = styled.div`\n width: 50px;\n margin-left: 10px;\n`;\n\nexport const ACTION_TYPE = {\n clear: 'clear',\n sortAscending: 'sortAscending',\n sortDescending: 'sortDescending',\n set: 'set',\n};\n\nconst MatrixLabelEditableButton = (props) => {\n const { onLabelUpdate, value, resourceIndex, onAction, spellCheck } = props;\n const [labelValue, setLabelValue] = useState(null);\n const [scoreValue, setScoreValue] = useState('');\n const [showInput, setShowInput] = useState(false);\n const [anchorEl, setAnchorEl] = React.useState(null);\n const [scoresToRef] = React.useState(React.createRef());\n\n const open = Boolean(anchorEl);\n\n const onActionClick = (event) => {\n setAnchorEl(event.currentTarget);\n };\n\n const handleClose = (e) => {\n e.stopPropagation();\n setAnchorEl(null);\n setScoreValue('');\n };\n\n const onClearScores = (e) => {\n handleClose(e);\n onAction({ resourceIndex, actionType: ACTION_TYPE.clear });\n };\n\n const onSetScoresAscending = (e) => {\n handleClose(e);\n onAction({ resourceIndex, actionType: ACTION_TYPE.sortAscending });\n };\n\n const onSetScoresDescending = (e) => {\n handleClose(e);\n onAction({ resourceIndex, actionType: ACTION_TYPE.sortDescending });\n };\n\n const onSetScores = (value) => {\n if (!isNumeric(value)) {\n setScoreValue('');\n return;\n }\n const scoreValueNew = parseInt(value, 10);\n setScoreValue(scoreValueNew);\n onAction({ resourceIndex, actionType: ACTION_TYPE.set, setValue: scoreValueNew });\n };\n\n const onBlur = () => {\n const labeValueTrimmed = labelValue.trim();\n if (labeValueTrimmed) {\n onLabelUpdate(labeValueTrimmed);\n }\n setLabelValue(null);\n setShowInput(false);\n };\n\n const onShowInput = () => {\n setShowInput(true);\n setLabelValue(value);\n };\n\n const onSetScoreToFocus = () => {\n scoresToRef.current.focus();\n };\n\n return (\n <MatrixEditableButtonWrapper>\n <MatrixEditableButtonContent>\n {showInput ? (\n <InputWrapper\n autoFocus\n value={labelValue}\n onChange={(e) => setLabelValue(e.target.value)}\n onBlur={onBlur}\n spellCheck={spellCheck}\n />\n ) : (\n <MatrixEditableButtonText onClick={onShowInput}>{value}</MatrixEditableButtonText>\n )}\n </MatrixEditableButtonContent>\n <MatrixEditableButtonActions onClick={onActionClick}>\n <IconWrapper>\n <KeyboardArrowDownIcon fontSize=\"inherit\" />\n </IconWrapper>\n <Menu anchorEl={anchorEl} open={open} onClose={handleClose}>\n <MenuItem key=\"item1\" selected={false} onClick={onClearScores}>\n Clear Scores\n </MenuItem>\n <MenuItem key=\"item2\" selected={false} onClick={onSetScoresAscending}>\n Set Scores Ascending\n </MenuItem>\n <MenuItem key=\"item3\" selected={false} onClick={onSetScoresDescending}>\n Set Scores Descending\n </MenuItem>\n <MenuItem key=\"item4\" selected={false}>\n <SetScoresToWrapper>\n <p onClick={onSetScoreToFocus}>Set Scores To</p>\n <SetScoresToInputWrapper>\n <NumberInput\n onFieldUpdate={onSetScores}\n name={'setScoreTo'}\n placeholder=\"#\"\n fieldValue={{\n value: scoreValue,\n ref: scoresToRef,\n }}\n />\n </SetScoresToInputWrapper>\n </SetScoresToWrapper>\n </MenuItem>\n </Menu>\n </MatrixEditableButtonActions>\n </MatrixEditableButtonWrapper>\n );\n};\n\nMatrixLabelEditableButton.propTypes = {\n value: PropTypes.string.isRequired,\n resourceIndex: PropTypes.number.isRequired,\n onLabelUpdate: PropTypes.func.isRequired,\n onAction: PropTypes.func.isRequired,\n spellCheck: PropTypes.bool,\n};\n\nexport default MatrixLabelEditableButton;\n"],"file":"MatrixLabelEditableButton.js"}