@pie-element/extended-text-entry 6.5.4-next.411 → 6.5.4-next.428
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/CHANGELOG.md +21 -0
- package/configure/CHANGELOG.md +18 -0
- package/configure/package.json +1 -1
- package/controller/CHANGELOG.md +8 -0
- package/controller/lib/defaults.js +66 -1
- package/controller/lib/defaults.js.map +1 -1
- package/controller/lib/index.js +25 -15
- package/controller/lib/index.js.map +1 -1
- package/controller/package.json +1 -1
- package/docs/pie-schema.json +65 -0
- package/docs/pie-schema.json.md +47 -1
- package/lib/annotation/annotation-editor.js +702 -0
- package/lib/annotation/annotation-editor.js.map +1 -0
- package/lib/annotation/annotation-menu.js +205 -0
- package/lib/annotation/annotation-menu.js.map +1 -0
- package/lib/annotation/annotation-utils.js +249 -0
- package/lib/annotation/annotation-utils.js.map +1 -0
- package/lib/annotation/freeform-editor.js +265 -0
- package/lib/annotation/freeform-editor.js.map +1 -0
- package/lib/index.js +27 -4
- package/lib/index.js.map +1 -1
- package/lib/main.js +44 -14
- package/lib/main.js.map +1 -1
- package/package.json +2 -2
|
@@ -0,0 +1,265 @@
|
|
|
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 _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
11
|
+
|
|
12
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
13
|
+
|
|
14
|
+
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
15
|
+
|
|
16
|
+
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
17
|
+
|
|
18
|
+
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
|
|
19
|
+
|
|
20
|
+
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
|
21
|
+
|
|
22
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
23
|
+
|
|
24
|
+
var _react = _interopRequireDefault(require("react"));
|
|
25
|
+
|
|
26
|
+
var _classnames = _interopRequireDefault(require("classnames"));
|
|
27
|
+
|
|
28
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
29
|
+
|
|
30
|
+
var _core = require("@material-ui/core");
|
|
31
|
+
|
|
32
|
+
var _styles = require("@material-ui/core/styles");
|
|
33
|
+
|
|
34
|
+
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); }; }
|
|
35
|
+
|
|
36
|
+
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; } }
|
|
37
|
+
|
|
38
|
+
var styles = {
|
|
39
|
+
wrapper: {
|
|
40
|
+
width: '200px',
|
|
41
|
+
overflow: 'hidden',
|
|
42
|
+
borderRadius: '4px',
|
|
43
|
+
backgroundColor: '#ffffff',
|
|
44
|
+
border: '4px solid #d3d3d3',
|
|
45
|
+
'&.negative': {
|
|
46
|
+
borderColor: 'rgb(255, 204, 238) !important'
|
|
47
|
+
},
|
|
48
|
+
'&.positive': {
|
|
49
|
+
borderColor: 'rgb(153, 255, 153) !important'
|
|
50
|
+
}
|
|
51
|
+
},
|
|
52
|
+
holder: {
|
|
53
|
+
display: 'flex',
|
|
54
|
+
flexWrap: 'wrap',
|
|
55
|
+
borderTop: '2px solid #d3d3d3'
|
|
56
|
+
},
|
|
57
|
+
positive: {
|
|
58
|
+
backgroundColor: 'rgb(153, 255, 153) !important',
|
|
59
|
+
'&:hover': {
|
|
60
|
+
filter: 'brightness(85%)'
|
|
61
|
+
}
|
|
62
|
+
},
|
|
63
|
+
negative: {
|
|
64
|
+
backgroundColor: 'rgb(255, 204, 238) !important',
|
|
65
|
+
'&:hover': {
|
|
66
|
+
filter: 'brightness(85%)'
|
|
67
|
+
}
|
|
68
|
+
},
|
|
69
|
+
button: {
|
|
70
|
+
flexGrow: 1,
|
|
71
|
+
width: '28%',
|
|
72
|
+
textAlign: 'center',
|
|
73
|
+
padding: '4px',
|
|
74
|
+
cursor: 'pointer',
|
|
75
|
+
'&:not(:nth-child(3n))': {
|
|
76
|
+
borderRight: '1px solid #d3d3d3'
|
|
77
|
+
},
|
|
78
|
+
'&:hover': {
|
|
79
|
+
backgroundColor: '#d3d3d3'
|
|
80
|
+
},
|
|
81
|
+
'&.negative:hover': {
|
|
82
|
+
backgroundColor: 'rgb(153, 255, 153) !important'
|
|
83
|
+
},
|
|
84
|
+
'&.positive:hover': {
|
|
85
|
+
backgroundColor: 'rgb(255, 204, 238) !important'
|
|
86
|
+
}
|
|
87
|
+
},
|
|
88
|
+
arrow: {
|
|
89
|
+
overflowX: 'unset',
|
|
90
|
+
overflowY: 'unset',
|
|
91
|
+
marginLeft: '16px',
|
|
92
|
+
'&::before': {
|
|
93
|
+
position: 'absolute',
|
|
94
|
+
right: '100%',
|
|
95
|
+
top: '13px',
|
|
96
|
+
border: 'solid transparent',
|
|
97
|
+
content: '""',
|
|
98
|
+
height: 0,
|
|
99
|
+
width: 0,
|
|
100
|
+
pointerEvents: 'none',
|
|
101
|
+
borderWidth: '7px',
|
|
102
|
+
borderRightColor: '#d3d3d3'
|
|
103
|
+
},
|
|
104
|
+
'&.negative::before': {
|
|
105
|
+
borderRightColor: 'rgb(255, 204, 238) !important'
|
|
106
|
+
},
|
|
107
|
+
'&.positive::before': {
|
|
108
|
+
borderRightColor: 'rgb(153, 255, 153) !important'
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
};
|
|
112
|
+
|
|
113
|
+
var FreeformEditor = /*#__PURE__*/function (_React$Component) {
|
|
114
|
+
(0, _inherits2["default"])(FreeformEditor, _React$Component);
|
|
115
|
+
|
|
116
|
+
var _super = _createSuper(FreeformEditor);
|
|
117
|
+
|
|
118
|
+
function FreeformEditor(props) {
|
|
119
|
+
var _this;
|
|
120
|
+
|
|
121
|
+
(0, _classCallCheck2["default"])(this, FreeformEditor);
|
|
122
|
+
_this = _super.call(this, props);
|
|
123
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onValueChange", function (event) {
|
|
124
|
+
return _this.setState({
|
|
125
|
+
value: event.target.value
|
|
126
|
+
});
|
|
127
|
+
});
|
|
128
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleSave", function () {
|
|
129
|
+
var _this$props = _this.props,
|
|
130
|
+
oldValue = _this$props.value,
|
|
131
|
+
onSave = _this$props.onSave,
|
|
132
|
+
onClose = _this$props.onClose,
|
|
133
|
+
onDelete = _this$props.onDelete;
|
|
134
|
+
var value = _this.state.value;
|
|
135
|
+
|
|
136
|
+
if (value === '') {
|
|
137
|
+
onDelete();
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
if (oldValue !== value) {
|
|
141
|
+
onSave(oldValue, value);
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
_this.setState({
|
|
145
|
+
value: ''
|
|
146
|
+
});
|
|
147
|
+
|
|
148
|
+
onClose();
|
|
149
|
+
});
|
|
150
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleTypeChange", function () {
|
|
151
|
+
var _this$props2 = _this.props,
|
|
152
|
+
onTypeChange = _this$props2.onTypeChange,
|
|
153
|
+
onDelete = _this$props2.onDelete;
|
|
154
|
+
var value = _this.state.value;
|
|
155
|
+
|
|
156
|
+
if (value === '') {
|
|
157
|
+
onDelete();
|
|
158
|
+
} else {
|
|
159
|
+
onTypeChange(value);
|
|
160
|
+
}
|
|
161
|
+
|
|
162
|
+
_this.setState({
|
|
163
|
+
value: ''
|
|
164
|
+
});
|
|
165
|
+
});
|
|
166
|
+
_this.state = {
|
|
167
|
+
value: props.value
|
|
168
|
+
};
|
|
169
|
+
return _this;
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
(0, _createClass2["default"])(FreeformEditor, [{
|
|
173
|
+
key: "UNSAFE_componentWillReceiveProps",
|
|
174
|
+
value: function UNSAFE_componentWillReceiveProps(nextProps) {
|
|
175
|
+
var value = nextProps.value;
|
|
176
|
+
var propsValue = this.props.value;
|
|
177
|
+
|
|
178
|
+
if (value !== propsValue) {
|
|
179
|
+
this.setState({
|
|
180
|
+
value: value
|
|
181
|
+
});
|
|
182
|
+
}
|
|
183
|
+
}
|
|
184
|
+
}, {
|
|
185
|
+
key: "render",
|
|
186
|
+
value: function render() {
|
|
187
|
+
var _this$props3 = this.props,
|
|
188
|
+
anchorEl = _this$props3.anchorEl,
|
|
189
|
+
classes = _this$props3.classes,
|
|
190
|
+
offset = _this$props3.offset,
|
|
191
|
+
onDelete = _this$props3.onDelete,
|
|
192
|
+
open = _this$props3.open,
|
|
193
|
+
type = _this$props3.type;
|
|
194
|
+
var value = this.state.value;
|
|
195
|
+
return /*#__PURE__*/_react["default"].createElement(_core.Popover, {
|
|
196
|
+
anchorEl: anchorEl,
|
|
197
|
+
elevation: 2,
|
|
198
|
+
open: open,
|
|
199
|
+
onClose: this.handleSave,
|
|
200
|
+
classes: {
|
|
201
|
+
paper: (0, _classnames["default"])(classes.arrow, type)
|
|
202
|
+
},
|
|
203
|
+
style: {
|
|
204
|
+
marginTop: "".concat(offset, "px"),
|
|
205
|
+
transition: 'margin-top 2s ease-out'
|
|
206
|
+
},
|
|
207
|
+
anchorOrigin: {
|
|
208
|
+
vertical: 'top',
|
|
209
|
+
horizontal: 'right'
|
|
210
|
+
},
|
|
211
|
+
transformOrigin: {
|
|
212
|
+
vertical: 'top',
|
|
213
|
+
horizontal: 'left'
|
|
214
|
+
}
|
|
215
|
+
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
216
|
+
className: (0, _classnames["default"])(classes.wrapper, type)
|
|
217
|
+
}, /*#__PURE__*/_react["default"].createElement(_core.TextField, {
|
|
218
|
+
id: "annotation-editor",
|
|
219
|
+
style: {
|
|
220
|
+
padding: '2px 5px',
|
|
221
|
+
width: '95%'
|
|
222
|
+
},
|
|
223
|
+
autoFocus: true,
|
|
224
|
+
multiline: true,
|
|
225
|
+
rows: 1,
|
|
226
|
+
rowsMax: 4,
|
|
227
|
+
value: value,
|
|
228
|
+
onChange: this.onValueChange,
|
|
229
|
+
InputProps: {
|
|
230
|
+
disableUnderline: true
|
|
231
|
+
}
|
|
232
|
+
}), /*#__PURE__*/_react["default"].createElement("div", {
|
|
233
|
+
className: classes.holder
|
|
234
|
+
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
235
|
+
className: classes.button,
|
|
236
|
+
onClick: onDelete
|
|
237
|
+
}, "Delete"), /*#__PURE__*/_react["default"].createElement("div", {
|
|
238
|
+
className: (0, _classnames["default"])(classes.button, type),
|
|
239
|
+
onClick: this.handleTypeChange
|
|
240
|
+
}, type === 'negative' ? 'Green' : 'Pink'), /*#__PURE__*/_react["default"].createElement("div", {
|
|
241
|
+
className: classes.button,
|
|
242
|
+
onClick: this.handleSave
|
|
243
|
+
}, "Save"))));
|
|
244
|
+
}
|
|
245
|
+
}]);
|
|
246
|
+
return FreeformEditor;
|
|
247
|
+
}(_react["default"].Component);
|
|
248
|
+
|
|
249
|
+
(0, _defineProperty2["default"])(FreeformEditor, "propTypes", {
|
|
250
|
+
anchorEl: _propTypes["default"].object,
|
|
251
|
+
open: _propTypes["default"].bool,
|
|
252
|
+
offset: _propTypes["default"].number,
|
|
253
|
+
value: _propTypes["default"].string,
|
|
254
|
+
type: _propTypes["default"].string,
|
|
255
|
+
onClose: _propTypes["default"].func,
|
|
256
|
+
onDelete: _propTypes["default"].func,
|
|
257
|
+
onSave: _propTypes["default"].func,
|
|
258
|
+
onTypeChange: _propTypes["default"].func
|
|
259
|
+
});
|
|
260
|
+
;
|
|
261
|
+
|
|
262
|
+
var _default = (0, _styles.withStyles)(styles)(FreeformEditor);
|
|
263
|
+
|
|
264
|
+
exports["default"] = _default;
|
|
265
|
+
//# sourceMappingURL=freeform-editor.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/annotation/freeform-editor.jsx"],"names":["styles","wrapper","width","overflow","borderRadius","backgroundColor","border","borderColor","holder","display","flexWrap","borderTop","positive","filter","negative","button","flexGrow","textAlign","padding","cursor","borderRight","arrow","overflowX","overflowY","marginLeft","position","right","top","content","height","pointerEvents","borderWidth","borderRightColor","FreeformEditor","props","event","setState","value","target","oldValue","onSave","onClose","onDelete","state","onTypeChange","nextProps","propsValue","anchorEl","classes","offset","open","type","handleSave","paper","marginTop","transition","vertical","horizontal","onValueChange","disableUnderline","handleTypeChange","React","Component","PropTypes","object","bool","number","string","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport PropTypes from 'prop-types';\nimport { Popover, TextField } from '@material-ui/core';\nimport { withStyles } from '@material-ui/core/styles';\n\nconst styles = {\n wrapper: {\n width: '200px',\n overflow: 'hidden',\n borderRadius: '4px',\n backgroundColor: '#ffffff',\n border: '4px solid #d3d3d3',\n '&.negative': {\n borderColor: 'rgb(255, 204, 238) !important'\n },\n '&.positive': {\n borderColor: 'rgb(153, 255, 153) !important'\n }\n },\n holder: {\n display: 'flex',\n flexWrap: 'wrap',\n borderTop: '2px solid #d3d3d3'\n },\n positive: {\n backgroundColor: 'rgb(153, 255, 153) !important',\n '&:hover': {\n filter: 'brightness(85%)'\n }\n },\n negative: {\n backgroundColor: 'rgb(255, 204, 238) !important',\n '&:hover': {\n filter: 'brightness(85%)'\n }\n },\n button: {\n flexGrow: 1,\n width: '28%',\n textAlign: 'center',\n padding: '4px',\n cursor: 'pointer',\n '&:not(:nth-child(3n))': {\n borderRight: '1px solid #d3d3d3',\n },\n '&:hover': {\n backgroundColor: '#d3d3d3'\n },\n '&.negative:hover': {\n backgroundColor: 'rgb(153, 255, 153) !important',\n },\n '&.positive:hover': {\n backgroundColor: 'rgb(255, 204, 238) !important',\n }\n },\n arrow: {\n overflowX: 'unset',\n overflowY: 'unset',\n marginLeft: '16px',\n '&::before': {\n position: 'absolute',\n right: '100%',\n top: '13px',\n border: 'solid transparent',\n content: '\"\"',\n height: 0,\n width: 0,\n pointerEvents: 'none',\n borderWidth: '7px',\n borderRightColor: '#d3d3d3'\n },\n '&.negative::before': {\n borderRightColor: 'rgb(255, 204, 238) !important'\n },\n '&.positive::before': {\n borderRightColor: 'rgb(153, 255, 153) !important'\n }\n }\n};\n\nclass FreeformEditor extends React.Component {\n static propTypes = {\n anchorEl: PropTypes.object,\n open: PropTypes.bool,\n offset: PropTypes.number,\n value: PropTypes.string,\n type: PropTypes.string,\n onClose: PropTypes.func,\n onDelete: PropTypes.func,\n onSave: PropTypes.func,\n onTypeChange: PropTypes.func,\n };\n\n constructor(props) {\n super(props);\n this.state = { value: props.value };\n };\n\n UNSAFE_componentWillReceiveProps(nextProps) {\n const { value } = nextProps;\n const { value: propsValue } = this.props;\n\n if (value !== propsValue) {\n this.setState({ value });\n }\n };\n\n onValueChange = event => this.setState({ value: event.target.value });\n\n handleSave = () => {\n const { value: oldValue, onSave, onClose, onDelete } = this.props;\n const { value } = this.state;\n\n if (value === '') {\n onDelete();\n }\n\n if (oldValue !== value) {\n onSave(oldValue, value);\n }\n\n this.setState({ value: '' });\n onClose();\n };\n\n handleTypeChange = () => {\n const { onTypeChange, onDelete } = this.props;\n const { value } = this.state;\n\n if (value === '') {\n onDelete();\n } else {\n onTypeChange(value);\n }\n\n this.setState({ value: '' });\n };\n\n render() {\n const { anchorEl, classes, offset, onDelete, open, type } = this.props;\n const { value } = this.state;\n\n return (\n <Popover\n anchorEl={anchorEl}\n elevation={2}\n open={open}\n onClose={this.handleSave}\n classes={{ paper: classNames(classes.arrow, type) }}\n style={{ marginTop: `${offset}px`, transition: 'margin-top 2s ease-out' }}\n anchorOrigin={{\n vertical: 'top',\n horizontal: 'right',\n }}\n transformOrigin={{\n vertical: 'top',\n horizontal: 'left',\n }}\n >\n <div className={classNames(classes.wrapper, type)}>\n <TextField\n id=\"annotation-editor\"\n style={{\n padding: '2px 5px',\n width: '95%'\n }}\n autoFocus\n multiline\n rows={1}\n rowsMax={4}\n value={value}\n onChange={this.onValueChange}\n InputProps={{ disableUnderline: true }}\n />\n <div className={classes.holder}>\n <div className={classes.button} onClick={onDelete}>\n Delete\n </div>\n <div className={classNames(classes.button, type)} onClick={this.handleTypeChange} >\n { type === 'negative' ? 'Green' : 'Pink' }\n </div>\n <div className={classes.button} onClick={this.handleSave} >\n Save\n </div>\n </div>\n </div>\n </Popover>\n );\n }\n};\n\nexport default withStyles(styles)(FreeformEditor);\n"],"file":"freeform-editor.js"}
|
package/lib/index.js
CHANGED
|
@@ -31,6 +31,8 @@ var _reactDom = _interopRequireDefault(require("react-dom"));
|
|
|
31
31
|
|
|
32
32
|
var _piePlayerEvents = require("@pie-framework/pie-player-events");
|
|
33
33
|
|
|
34
|
+
var _mathRendering = require("@pie-lib/math-rendering");
|
|
35
|
+
|
|
34
36
|
var _debug = _interopRequireDefault(require("debug"));
|
|
35
37
|
|
|
36
38
|
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); }; }
|
|
@@ -94,10 +96,25 @@ var RootExtendedTextEntry = /*#__PURE__*/function (_HTMLElement) {
|
|
|
94
96
|
this.render();
|
|
95
97
|
}
|
|
96
98
|
}, {
|
|
97
|
-
key: "
|
|
98
|
-
value: function
|
|
99
|
+
key: "valueChange",
|
|
100
|
+
value: function valueChange(value) {
|
|
99
101
|
this._session.value = value;
|
|
100
102
|
this.dispatchEvent(new _piePlayerEvents.SessionChangedEvent(this.tagName.toLowerCase(), isComplete(value)));
|
|
103
|
+
this.render();
|
|
104
|
+
}
|
|
105
|
+
}, {
|
|
106
|
+
key: "annotationsChange",
|
|
107
|
+
value: function annotationsChange(annotations) {
|
|
108
|
+
this._session.annotations = annotations;
|
|
109
|
+
this.dispatchEvent(new _piePlayerEvents.SessionChangedEvent(this.tagName.toLowerCase(), true));
|
|
110
|
+
this.render();
|
|
111
|
+
}
|
|
112
|
+
}, {
|
|
113
|
+
key: "commentChange",
|
|
114
|
+
value: function commentChange(comment) {
|
|
115
|
+
this._session.comment = comment;
|
|
116
|
+
this.dispatchEvent(new _piePlayerEvents.SessionChangedEvent(this.tagName.toLowerCase(), isComplete(comment)));
|
|
117
|
+
this.render();
|
|
101
118
|
}
|
|
102
119
|
}, {
|
|
103
120
|
key: "connectedCallback",
|
|
@@ -107,14 +124,20 @@ var RootExtendedTextEntry = /*#__PURE__*/function (_HTMLElement) {
|
|
|
107
124
|
}, {
|
|
108
125
|
key: "render",
|
|
109
126
|
value: function render() {
|
|
127
|
+
var _this2 = this;
|
|
128
|
+
|
|
110
129
|
if (this._model && this._session) {
|
|
111
130
|
var elem = /*#__PURE__*/_react["default"].createElement(_main["default"], {
|
|
112
131
|
model: this._model,
|
|
113
132
|
session: this._session,
|
|
114
|
-
|
|
133
|
+
onValueChange: this.valueChange.bind(this),
|
|
134
|
+
onAnnotationsChange: this.annotationsChange.bind(this),
|
|
135
|
+
onCommentChange: this.commentChange.bind(this)
|
|
115
136
|
});
|
|
116
137
|
|
|
117
|
-
_reactDom["default"].render(elem, this)
|
|
138
|
+
_reactDom["default"].render(elem, this, function () {
|
|
139
|
+
(0, _mathRendering.renderMath)(_this2);
|
|
140
|
+
});
|
|
118
141
|
}
|
|
119
142
|
}
|
|
120
143
|
}]);
|
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.js"],"names":["log","domParser","window","undefined","DOMParser","parseFromString","v","textContent","value","document","body","err","isComplete","tc","out","length","RootExtendedTextEntry","_model","_session","m","dispatchEvent","ModelSetEvent","tagName","toLowerCase","render","s","SessionChangedEvent","elem","React","createElement","Main","model","session","
|
|
1
|
+
{"version":3,"sources":["../src/index.js"],"names":["log","domParser","window","undefined","DOMParser","parseFromString","v","textContent","value","document","body","err","isComplete","tc","out","length","RootExtendedTextEntry","_model","_session","m","dispatchEvent","ModelSetEvent","tagName","toLowerCase","render","s","SessionChangedEvent","annotations","comment","elem","React","createElement","Main","model","session","onValueChange","valueChange","bind","onAnnotationsChange","annotationsChange","onCommentChange","commentChange","ReactDOM","HTMLElement"],"mappings":"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","sourcesContent":["import Main from './main';\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport {\n ModelSetEvent,\n SessionChangedEvent\n} from '@pie-framework/pie-player-events';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport debug from 'debug';\n\nconst log = debug('@pie-ui:extended-text-entry');\n\nconst domParser =\n typeof window !== undefined ? new DOMParser() : { parseFromString: v => v };\n\nexport function textContent(value) {\n if (typeof value !== 'string') {\n return undefined;\n }\n\n try {\n const document = domParser.parseFromString(value, 'text/html');\n const textContent = document.body.textContent;\n\n return textContent;\n } catch (err) {\n log('tried to parse as dom and failed', value);\n return value;\n }\n}\n\nexport function isComplete(value) {\n const tc = textContent(value);\n const out = tc !== undefined && tc.length > 0;\n\n return out;\n}\n\nexport default class RootExtendedTextEntry extends HTMLElement {\n constructor() {\n super();\n this._model = null;\n this._session = null;\n }\n\n set model(m) {\n this._model = m;\n this.dispatchEvent(\n new ModelSetEvent(this.tagName.toLowerCase(), false, !!this._model)\n );\n\n this.render();\n }\n\n set session(s) {\n this._session = s;\n this.render();\n }\n\n valueChange(value) {\n this._session.value = value;\n this.dispatchEvent(\n new SessionChangedEvent(this.tagName.toLowerCase(), isComplete(value))\n );\n\n this.render();\n }\n\n annotationsChange(annotations) {\n this._session.annotations = annotations;\n this.dispatchEvent(\n new SessionChangedEvent(this.tagName.toLowerCase(), true)\n );\n\n this.render();\n }\n\n commentChange(comment) {\n this._session.comment = comment;\n this.dispatchEvent(\n new SessionChangedEvent(this.tagName.toLowerCase(), isComplete(comment))\n );\n\n this.render();\n }\n\n connectedCallback() {\n this.render();\n }\n\n render() {\n if (this._model && this._session) {\n let elem = React.createElement(Main, {\n model: this._model,\n session: this._session,\n onValueChange: this.valueChange.bind(this),\n onAnnotationsChange: this.annotationsChange.bind(this),\n onCommentChange: this.commentChange.bind(this),\n });\n\n ReactDOM.render(elem, this, () => {\n renderMath(this);\n });\n }\n }\n}\n"],"file":"index.js"}
|
package/lib/main.js
CHANGED
|
@@ -41,6 +41,8 @@ var _mathRendering = require("@pie-lib/math-rendering");
|
|
|
41
41
|
|
|
42
42
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
43
43
|
|
|
44
|
+
var _annotationEditor = _interopRequireDefault(require("./annotation/annotation-editor"));
|
|
45
|
+
|
|
44
46
|
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
47
|
|
|
46
48
|
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; } }
|
|
@@ -77,7 +79,8 @@ var Main = /*#__PURE__*/function (_React$Component) {
|
|
|
77
79
|
}
|
|
78
80
|
|
|
79
81
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
80
|
-
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "
|
|
82
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "changeSessionValue", (0, _debounce["default"])(_this.props.onValueChange, 1500));
|
|
83
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "changeSessionComment", (0, _debounce["default"])(_this.props.onCommentChange, 1500));
|
|
81
84
|
return _this;
|
|
82
85
|
}
|
|
83
86
|
|
|
@@ -96,14 +99,23 @@ var Main = /*#__PURE__*/function (_React$Component) {
|
|
|
96
99
|
var _this$props = this.props,
|
|
97
100
|
model = _this$props.model,
|
|
98
101
|
classes = _this$props.classes,
|
|
99
|
-
session = _this$props.session
|
|
100
|
-
|
|
102
|
+
session = _this$props.session,
|
|
103
|
+
onAnnotationsChange = _this$props.onAnnotationsChange;
|
|
104
|
+
var animationsDisabled = model.animationsDisabled,
|
|
105
|
+
annotatorMode = model.annotatorMode,
|
|
106
|
+
customKeys = model.customKeys,
|
|
107
|
+
dimensions = model.dimensions,
|
|
101
108
|
disabled = model.disabled,
|
|
109
|
+
disabledAnnotator = model.disabledAnnotator,
|
|
110
|
+
equationEditor = model.equationEditor,
|
|
102
111
|
feedback = model.feedback,
|
|
103
|
-
teacherInstructions = model.teacherInstructions,
|
|
104
112
|
mathInput = model.mathInput,
|
|
105
|
-
|
|
106
|
-
|
|
113
|
+
predefinedAnnotations = model.predefinedAnnotations,
|
|
114
|
+
prompt = model.prompt,
|
|
115
|
+
teacherInstructions = model.teacherInstructions;
|
|
116
|
+
var annotations = session.annotations,
|
|
117
|
+
comment = session.comment,
|
|
118
|
+
value = session.value;
|
|
107
119
|
|
|
108
120
|
var _ref = dimensions || {},
|
|
109
121
|
width = _ref.width,
|
|
@@ -130,13 +142,27 @@ var Main = /*#__PURE__*/function (_React$Component) {
|
|
|
130
142
|
visible: 'Hide Teacher Instructions'
|
|
131
143
|
},
|
|
132
144
|
className: classes.collapsible
|
|
133
|
-
}, teacherInstructionsDiv) : teacherInstructionsDiv, /*#__PURE__*/_react["default"].createElement("br", null)),
|
|
145
|
+
}, teacherInstructionsDiv) : teacherInstructionsDiv, /*#__PURE__*/_react["default"].createElement("br", null)), prompt && /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
|
|
134
146
|
className: (0, _classnames["default"])(classes.prompt, 'prompt'),
|
|
135
147
|
dangerouslySetInnerHTML: {
|
|
136
|
-
__html:
|
|
148
|
+
__html: prompt
|
|
137
149
|
}
|
|
138
|
-
}), /*#__PURE__*/_react["default"].createElement(
|
|
139
|
-
|
|
150
|
+
}), annotatorMode ? /*#__PURE__*/_react["default"].createElement(_annotationEditor["default"], {
|
|
151
|
+
text: value || '',
|
|
152
|
+
annotations: annotations || [],
|
|
153
|
+
comment: comment || '',
|
|
154
|
+
predefinedAnnotations: predefinedAnnotations || [],
|
|
155
|
+
onChange: onAnnotationsChange,
|
|
156
|
+
onCommentChange: this.changeSessionComment,
|
|
157
|
+
width: width,
|
|
158
|
+
height: height,
|
|
159
|
+
maxHeight: maxHeight,
|
|
160
|
+
disabled: disabledAnnotator,
|
|
161
|
+
disabledMath: !mathInput,
|
|
162
|
+
customKeys: customKeys,
|
|
163
|
+
keypadMode: equationEditor
|
|
164
|
+
}) : /*#__PURE__*/_react["default"].createElement(_editableHtml["default"], {
|
|
165
|
+
onChange: this.changeSessionValue,
|
|
140
166
|
markup: value || '',
|
|
141
167
|
width: width && width.toString(),
|
|
142
168
|
minHeight: height && height.toString(),
|
|
@@ -146,8 +172,8 @@ var Main = /*#__PURE__*/function (_React$Component) {
|
|
|
146
172
|
pluginProps: {
|
|
147
173
|
math: {
|
|
148
174
|
disabled: !mathInput,
|
|
149
|
-
customKeys:
|
|
150
|
-
keypadMode:
|
|
175
|
+
customKeys: customKeys,
|
|
176
|
+
keypadMode: equationEditor,
|
|
151
177
|
controlledKeypadMode: false
|
|
152
178
|
},
|
|
153
179
|
video: {
|
|
@@ -168,11 +194,15 @@ var Main = /*#__PURE__*/function (_React$Component) {
|
|
|
168
194
|
|
|
169
195
|
exports.Main = Main;
|
|
170
196
|
(0, _defineProperty2["default"])(Main, "propTypes", {
|
|
171
|
-
|
|
197
|
+
onValueChange: _propTypes["default"].func.isRequired,
|
|
198
|
+
onAnnotationsChange: _propTypes["default"].func.isRequired,
|
|
199
|
+
onCommentChange: _propTypes["default"].func.isRequired,
|
|
172
200
|
model: _propTypes["default"].object,
|
|
173
201
|
classes: _propTypes["default"].object.isRequired,
|
|
174
202
|
session: _propTypes["default"].shape({
|
|
175
|
-
value: _propTypes["default"].string
|
|
203
|
+
value: _propTypes["default"].string,
|
|
204
|
+
annotations: _propTypes["default"].array,
|
|
205
|
+
comment: _propTypes["default"].string
|
|
176
206
|
}).isRequired
|
|
177
207
|
});
|
|
178
208
|
|
package/lib/main.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/main.jsx"],"names":["log","style","theme","main","backgroundColor","color","background","text","prompt","width","marginBottom","spacing","unit","fontSize","Main","props","
|
|
1
|
+
{"version":3,"sources":["../src/main.jsx"],"names":["log","style","theme","main","backgroundColor","color","background","text","prompt","width","marginBottom","spacing","unit","fontSize","Main","props","onValueChange","onCommentChange","containerRef","model","classes","session","onAnnotationsChange","animationsDisabled","annotatorMode","customKeys","dimensions","disabled","disabledAnnotator","equationEditor","feedback","mathInput","predefinedAnnotations","teacherInstructions","annotations","comment","value","height","maxHeight","teacherInstructionsDiv","__html","ref","hidden","visible","collapsible","changeSessionComment","changeSessionValue","toString","math","keypadMode","controlledKeypadMode","video","audio","React","Component","PropTypes","func","isRequired","object","shape","string","array"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA,IAAMA,GAAG,GAAG,uBAAM,6BAAN,CAAZ;;AAEA,IAAMC,KAAK,GAAG,SAARA,KAAQ,CAAAC,KAAK;AAAA,SAAK;AACtBC,IAAAA,IAAI,EAAE;AACJC,MAAAA,eAAe,EAAEC,gBAAMC,UAAN,EADb;AAEJD,MAAAA,KAAK,EAAEA,gBAAME,IAAN;AAFH,KADgB;AAKtBC,IAAAA,MAAM,EAAE;AACNC,MAAAA,KAAK,EAAE,MADD;AAENJ,MAAAA,KAAK,EAAEA,gBAAME,IAAN,EAFD;AAGNG,MAAAA,YAAY,EAAER,KAAK,CAACS,OAAN,CAAcC,IAAd,GAAqB,CAH7B;AAINC,MAAAA,QAAQ,EAAE;AAJJ;AALc,GAAL;AAAA,CAAnB;;IAaaC,I;;;;;;;;;;;;;;;2GAoBU,0BAAS,MAAKC,KAAL,CAAWC,aAApB,EAAmC,IAAnC,C;6GAEE,0BAAS,MAAKD,KAAL,CAAWE,eAApB,EAAqC,IAArC,C;;;;;;WARvB,8BAAqB;AACnB,UAAI,KAAKC,YAAT,EAAuB;AACrB,uCAAW,KAAKA,YAAhB;AACD;AACF;;;WAMD,kBAAS;AAAA;;AACP,wBAAyD,KAAKH,KAA9D;AAAA,UAAQI,KAAR,eAAQA,KAAR;AAAA,UAAeC,OAAf,eAAeA,OAAf;AAAA,UAAwBC,OAAxB,eAAwBA,OAAxB;AAAA,UAAiCC,mBAAjC,eAAiCA,mBAAjC;AACA,UACEC,kBADF,GAaIJ,KAbJ,CACEI,kBADF;AAAA,UAEEC,aAFF,GAaIL,KAbJ,CAEEK,aAFF;AAAA,UAGEC,UAHF,GAaIN,KAbJ,CAGEM,UAHF;AAAA,UAIEC,UAJF,GAaIP,KAbJ,CAIEO,UAJF;AAAA,UAKEC,QALF,GAaIR,KAbJ,CAKEQ,QALF;AAAA,UAMEC,iBANF,GAaIT,KAbJ,CAMES,iBANF;AAAA,UAOEC,cAPF,GAaIV,KAbJ,CAOEU,cAPF;AAAA,UAQEC,QARF,GAaIX,KAbJ,CAQEW,QARF;AAAA,UASEC,SATF,GAaIZ,KAbJ,CASEY,SATF;AAAA,UAUEC,qBAVF,GAaIb,KAbJ,CAUEa,qBAVF;AAAA,UAWExB,MAXF,GAaIW,KAbJ,CAWEX,MAXF;AAAA,UAYEyB,mBAZF,GAaId,KAbJ,CAYEc,mBAZF;AAcA,UAAQC,WAAR,GAAwCb,OAAxC,CAAQa,WAAR;AAAA,UAAqBC,OAArB,GAAwCd,OAAxC,CAAqBc,OAArB;AAAA,UAA8BC,KAA9B,GAAwCf,OAAxC,CAA8Be,KAA9B;;AACA,iBAA0BV,UAAU,IAAI,EAAxC;AAAA,UAAQjB,KAAR,QAAQA,KAAR;AAAA,UAAe4B,MAAf,QAAeA,MAAf;;AACA,UAAMC,SAAS,GAAG,MAAlB;AACAtC,MAAAA,GAAG,CAAC,qBAAD,EAAwB2B,QAAxB,CAAH;;AAEA,UAAMY,sBAAsB,gBAAG;AAC7B,QAAA,SAAS,EAAC,sBADmB;AAE7B,QAAA,uBAAuB,EAAE;AAAEC,UAAAA,MAAM,EAAEP;AAAV;AAFI,QAA/B;;AAKA,0BACE;AACE,QAAA,SAAS,EAAEb,OAAO,CAACjB,IADrB;AAEE,QAAA,GAAG,EAAE,aAAAsC,KAAG,EAAI;AACV,UAAA,MAAI,CAACvB,YAAL,GAAoBuB,KAApB;AACD;AAJH,SAOIR,mBAAmB,iBACjB,6CACG,CAACV,kBAAD,gBACC,gCAAC,qBAAD;AACE,QAAA,MAAM,EAAE;AAAEmB,UAAAA,MAAM,EAAE,2BAAV;AAAuCC,UAAAA,OAAO,EAAE;AAAhD,SADV;AAEE,QAAA,SAAS,EAAEvB,OAAO,CAACwB;AAFrB,SAIGL,sBAJH,CADD,GAOGA,sBARN,eASE,2CATF,CARN,EAqBG/B,MAAM,iBACL,gCAAC,sBAAD;AACE,QAAA,SAAS,EAAE,4BAAWY,OAAO,CAACZ,MAAnB,EAA2B,QAA3B,CADb;AAEE,QAAA,uBAAuB,EAAE;AAAEgC,UAAAA,MAAM,EAAEhC;AAAV;AAF3B,QAtBJ,EA2BGgB,aAAa,gBACZ,gCAAC,4BAAD;AACE,QAAA,IAAI,EAAEY,KAAK,IAAI,EADjB;AAEE,QAAA,WAAW,EAAEF,WAAW,IAAI,EAF9B;AAGE,QAAA,OAAO,EAAEC,OAAO,IAAI,EAHtB;AAIE,QAAA,qBAAqB,EAAEH,qBAAqB,IAAI,EAJlD;AAKE,QAAA,QAAQ,EAAEV,mBALZ;AAME,QAAA,eAAe,EAAE,KAAKuB,oBANxB;AAOE,QAAA,KAAK,EAAEpC,KAPT;AAQE,QAAA,MAAM,EAAE4B,MARV;AASE,QAAA,SAAS,EAAEC,SATb;AAUE,QAAA,QAAQ,EAAEV,iBAVZ;AAWE,QAAA,YAAY,EAAE,CAACG,SAXjB;AAYE,QAAA,UAAU,EAAEN,UAZd;AAaE,QAAA,UAAU,EAAEI;AAbd,QADY,gBAiBZ,gCAAC,wBAAD;AACE,QAAA,QAAQ,EAAE,KAAKiB,kBADjB;AAEE,QAAA,MAAM,EAAEV,KAAK,IAAI,EAFnB;AAGE,QAAA,KAAK,EAAE3B,KAAK,IAAIA,KAAK,CAACsC,QAAN,EAHlB;AAIE,QAAA,SAAS,EAAEV,MAAM,IAAIA,MAAM,CAACU,QAAP,EAJvB;AAKE,QAAA,SAAS,EAAET,SALb;AAME,QAAA,QAAQ,EAAEX,QANZ;AAOE,QAAA,cAAc,EAAE,IAPlB;AAQE,QAAA,WAAW,EAAE;AACXqB,UAAAA,IAAI,EAAE;AACJrB,YAAAA,QAAQ,EAAE,CAACI,SADP;AAEJN,YAAAA,UAAU,EAAEA,UAFR;AAGJwB,YAAAA,UAAU,EAAEpB,cAHR;AAIJqB,YAAAA,oBAAoB,EAAE;AAJlB,WADK;AAOXC,UAAAA,KAAK,EAAE;AACLxB,YAAAA,QAAQ,EAAE;AADL,WAPI;AAUXyB,UAAAA,KAAK,EAAE;AACLzB,YAAAA,QAAQ,EAAE;AADL;AAVI;AARf,QA5CJ,EAoEGG,QAAQ,iBACP,0DACE,2CADF,eAEE,gCAAC,kBAAD;AAAU,QAAA,WAAW,EAAC,SAAtB;AAAgC,QAAA,QAAQ,EAAEA;AAA1C,QAFF,CArEJ,CADF;AA6ED;;;EA/HuBuB,kBAAMC,S;;;iCAAnBxC,I,eACQ;AACjBE,EAAAA,aAAa,EAAEuC,sBAAUC,IAAV,CAAeC,UADb;AAEjBnC,EAAAA,mBAAmB,EAAEiC,sBAAUC,IAAV,CAAeC,UAFnB;AAGjBxC,EAAAA,eAAe,EAAEsC,sBAAUC,IAAV,CAAeC,UAHf;AAIjBtC,EAAAA,KAAK,EAAEoC,sBAAUG,MAJA;AAKjBtC,EAAAA,OAAO,EAAEmC,sBAAUG,MAAV,CAAiBD,UALT;AAMjBpC,EAAAA,OAAO,EAAEkC,sBAAUI,KAAV,CAAgB;AACvBvB,IAAAA,KAAK,EAAEmB,sBAAUK,MADM;AAEvB1B,IAAAA,WAAW,EAAEqB,sBAAUM,KAFA;AAGvB1B,IAAAA,OAAO,EAAEoB,sBAAUK;AAHI,GAAhB,EAINH;AAVc,C;;eAiIN,wBAAWxD,KAAX,EAAkBa,IAAlB,C","sourcesContent":["import React from 'react';\nimport EditableHTML from '@pie-lib/editable-html';\nimport PropTypes from 'prop-types';\nimport Typography from '@material-ui/core/Typography';\nimport { withStyles } from '@material-ui/core/styles';\nimport debug from 'debug';\nimport debounce from 'lodash/debounce';\nimport { color, Feedback, Collapsible } from '@pie-lib/render-ui';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport classNames from 'classnames';\nimport AnnotationEditor from './annotation/annotation-editor';\n\nconst log = debug('@pie-ui:extended-text-entry');\n\nconst style = theme => ({\n main: {\n backgroundColor: color.background(),\n color: color.text()\n },\n prompt: {\n width: '100%',\n color: color.text(),\n marginBottom: theme.spacing.unit * 2,\n fontSize: 'inherit'\n }\n});\n\nexport class Main extends React.Component {\n static propTypes = {\n onValueChange: PropTypes.func.isRequired,\n onAnnotationsChange: PropTypes.func.isRequired,\n onCommentChange: PropTypes.func.isRequired,\n model: PropTypes.object,\n classes: PropTypes.object.isRequired,\n session: PropTypes.shape({\n value: PropTypes.string,\n annotations: PropTypes.array,\n comment: PropTypes.string\n }).isRequired\n };\n\n componentDidUpdate() {\n if (this.containerRef) {\n renderMath(this.containerRef);\n }\n }\n\n changeSessionValue = debounce(this.props.onValueChange, 1500);\n\n changeSessionComment = debounce(this.props.onCommentChange, 1500);\n\n render() {\n const { model, classes, session, onAnnotationsChange } = this.props;\n const {\n animationsDisabled,\n annotatorMode,\n customKeys,\n dimensions,\n disabled,\n disabledAnnotator,\n equationEditor,\n feedback,\n mathInput,\n predefinedAnnotations,\n prompt,\n teacherInstructions\n } = model;\n const { annotations, comment, value } = session;\n const { width, height } = dimensions || {};\n const maxHeight = '40vh';\n log('[render] disabled? ', disabled);\n\n const teacherInstructionsDiv = <div\n className=\"teacher-instructions\"\n dangerouslySetInnerHTML={{ __html: teacherInstructions }}\n />;\n\n return (\n <div\n className={classes.main}\n ref={ref => {\n this.containerRef = ref;\n }}\n >\n {\n teacherInstructions && (\n <div>\n {!animationsDisabled ? (\n <Collapsible\n labels={{ hidden: 'Show Teacher Instructions', visible: 'Hide Teacher Instructions' }}\n className={classes.collapsible}\n >\n {teacherInstructionsDiv}\n </Collapsible>\n ) : teacherInstructionsDiv }\n <br/>\n </div>\n )\n }\n {prompt && (\n <Typography\n className={classNames(classes.prompt, 'prompt')}\n dangerouslySetInnerHTML={{ __html: prompt }}\n />\n )}\n {annotatorMode ? (\n <AnnotationEditor\n text={value || ''}\n annotations={annotations || []}\n comment={comment || ''}\n predefinedAnnotations={predefinedAnnotations || []}\n onChange={onAnnotationsChange}\n onCommentChange={this.changeSessionComment}\n width={width}\n height={height}\n maxHeight={maxHeight}\n disabled={disabledAnnotator}\n disabledMath={!mathInput}\n customKeys={customKeys}\n keypadMode={equationEditor}\n />\n ) : (\n <EditableHTML\n onChange={this.changeSessionValue}\n markup={value || ''}\n width={width && width.toString()}\n minHeight={height && height.toString()}\n maxHeight={maxHeight}\n disabled={disabled}\n highlightShape={true}\n pluginProps={{\n math: {\n disabled: !mathInput,\n customKeys: customKeys,\n keypadMode: equationEditor,\n controlledKeypadMode: false\n },\n video: {\n disabled: true\n },\n audio: {\n disabled: true\n }\n }}\n />\n )}\n {feedback && (\n <div>\n <br />\n <Feedback correctness=\"correct\" feedback={feedback}/>\n </div>\n )}\n </div>\n );\n }\n}\n\nexport default withStyles(style)(Main);\n"],"file":"main.js"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pie-element/extended-text-entry",
|
|
3
|
-
"version": "6.5.4-next.
|
|
3
|
+
"version": "6.5.4-next.428+16d0c65ce",
|
|
4
4
|
"description": "",
|
|
5
5
|
"repository": "pie-framework/pie-elements",
|
|
6
6
|
"publishConfig": {
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
"react": "^16.8.1",
|
|
23
23
|
"react-dom": "^16.8.1"
|
|
24
24
|
},
|
|
25
|
-
"gitHead": "
|
|
25
|
+
"gitHead": "16d0c65cee4c19f26d7045e1794b8115bd4a5fbd",
|
|
26
26
|
"scripts": {
|
|
27
27
|
"postpublish": "../../scripts/postpublish"
|
|
28
28
|
},
|