@pie-lib/render-ui 4.13.0 → 4.13.3
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 +30 -0
- package/lib/preview-prompt.js +31 -6
- package/lib/preview-prompt.js.map +1 -1
- package/package.json +3 -3
- package/src/preview-prompt.jsx +14 -6
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,36 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [4.13.3](https://github.com/pie-framework/pie-lib/compare/@pie-lib/render-ui@4.13.2...@pie-lib/render-ui@4.13.3) (2022-08-15)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* PD-1802 set style only to img parent ([d113b4e](https://github.com/pie-framework/pie-lib/commit/d113b4e48978c7619b4d9d4cfbf4996f400068e7))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
## [4.13.2](https://github.com/pie-framework/pie-lib/compare/@pie-lib/render-ui@4.13.1...@pie-lib/render-ui@4.13.2) (2022-08-08)
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
### Bug Fixes
|
|
21
|
+
|
|
22
|
+
* reverted changes for PD-1802 since it's causing PD-1937 ([b02fecb](https://github.com/pie-framework/pie-lib/commit/b02fecb54d8e243c34b864e4e5d3378899cb56d7))
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
## [4.13.1](https://github.com/pie-framework/pie-lib/compare/@pie-lib/render-ui@4.13.0...@pie-lib/render-ui@4.13.1) (2022-07-18)
|
|
29
|
+
|
|
30
|
+
**Note:** Version bump only for package @pie-lib/render-ui
|
|
31
|
+
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
|
|
6
36
|
# [4.13.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/render-ui@4.12.9...@pie-lib/render-ui@4.13.0) (2022-07-18)
|
|
7
37
|
|
|
8
38
|
|
package/lib/preview-prompt.js
CHANGED
|
@@ -35,6 +35,12 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
35
35
|
|
|
36
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
37
|
|
|
38
|
+
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
|
|
39
|
+
|
|
40
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
41
|
+
|
|
42
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
43
|
+
|
|
38
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); }; }
|
|
39
45
|
|
|
40
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; } }
|
|
@@ -78,6 +84,29 @@ var PreviewPrompt = /*#__PURE__*/function (_Component) {
|
|
|
78
84
|
}
|
|
79
85
|
|
|
80
86
|
(0, _createClass2["default"])(PreviewPrompt, [{
|
|
87
|
+
key: "componentDidUpdate",
|
|
88
|
+
value: function componentDidUpdate() {
|
|
89
|
+
// set image parent style so it can be horizontally aligned
|
|
90
|
+
var previewPrompt = document.querySelector('#preview-prompt');
|
|
91
|
+
var images = previewPrompt && previewPrompt.getElementsByTagName('img');
|
|
92
|
+
|
|
93
|
+
if (images && images.length) {
|
|
94
|
+
var _iterator = _createForOfIteratorHelper(images),
|
|
95
|
+
_step;
|
|
96
|
+
|
|
97
|
+
try {
|
|
98
|
+
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
|
99
|
+
var image = _step.value;
|
|
100
|
+
image.parentElement.style.display = 'flex';
|
|
101
|
+
}
|
|
102
|
+
} catch (err) {
|
|
103
|
+
_iterator.e(err);
|
|
104
|
+
} finally {
|
|
105
|
+
_iterator.f();
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
}, {
|
|
81
110
|
key: "render",
|
|
82
111
|
value: function render() {
|
|
83
112
|
var _this$props = this.props,
|
|
@@ -90,6 +119,7 @@ var PreviewPrompt = /*#__PURE__*/function (_Component) {
|
|
|
90
119
|
var CustomTag = tagName || 'div';
|
|
91
120
|
var customClasses = "".concat(classes.promptTable, " ").concat(classes[className] || '', " ").concat(defaultClassName || '');
|
|
92
121
|
return /*#__PURE__*/_react["default"].createElement(CustomTag, {
|
|
122
|
+
id: 'preview-prompt',
|
|
93
123
|
onClick: onClick,
|
|
94
124
|
className: customClasses,
|
|
95
125
|
dangerouslySetInnerHTML: {
|
|
@@ -118,12 +148,7 @@ var styles = function styles(theme) {
|
|
|
118
148
|
return {
|
|
119
149
|
prompt: {
|
|
120
150
|
verticalAlign: 'middle',
|
|
121
|
-
color: color.text()
|
|
122
|
-
display: 'flex',
|
|
123
|
-
flexDirection: 'column',
|
|
124
|
-
'& > *': {
|
|
125
|
-
display: 'flex'
|
|
126
|
-
}
|
|
151
|
+
color: color.text()
|
|
127
152
|
},
|
|
128
153
|
rationale: {
|
|
129
154
|
paddingLeft: theme.spacing.unit * 16
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/preview-prompt.jsx"],"names":["NEWLINE_BLOCK_REGEX","NEWLINE_LATEX","PreviewPrompt","text","div","document","createElement","innerHTML","audio","querySelector","source","setAttribute","getAttribute","removeAttribute","appendChild","props","prompt","classes","tagName","className","onClick","defaultClassName","CustomTag","customClasses","promptTable","__html","parsedText","replace","Component","PropTypes","object","string","func","styles","theme","verticalAlign","color","
|
|
1
|
+
{"version":3,"sources":["../src/preview-prompt.jsx"],"names":["NEWLINE_BLOCK_REGEX","NEWLINE_LATEX","PreviewPrompt","text","div","document","createElement","innerHTML","audio","querySelector","source","setAttribute","getAttribute","removeAttribute","appendChild","previewPrompt","images","getElementsByTagName","length","image","parentElement","style","display","props","prompt","classes","tagName","className","onClick","defaultClassName","CustomTag","customClasses","promptTable","__html","parsedText","replace","Component","PropTypes","object","string","func","styles","theme","verticalAlign","color","rationale","paddingLeft","spacing","unit","label","cursor","borderCollapse","backgroundColor","padding","textAlign"],"mappings":"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","sourcesContent":["import React, { Component } from 'react';\nimport { withStyles } from '@material-ui/core/styles';\nimport PropTypes from 'prop-types';\nimport * as color from './color';\n\n//Used these below to replace \\\\embed{newLine} with \\\\newline from prompt which will get parsed in MathJax\nconst NEWLINE_BLOCK_REGEX = /\\\\embed\\{newLine\\}\\[\\]/g;\nconst NEWLINE_LATEX = '\\\\newline ';\n\nexport class PreviewPrompt extends Component {\n static propTypes = {\n classes: PropTypes.object,\n prompt: PropTypes.string,\n tagName: PropTypes.string,\n className: PropTypes.string,\n onClick: PropTypes.func,\n defaultClassName: PropTypes.string\n };\n\n static defaultProps = {\n onClick: () => {}\n };\n\n parsedText = text => {\n // fix imported audio content for Safari PD-1419\n const div = document.createElement('div');\n div.innerHTML = text;\n\n const audio = div.querySelector('audio');\n if (audio) {\n const source = document.createElement('source');\n\n source.setAttribute('type', 'audio/mp3');\n source.setAttribute('src', audio.getAttribute('src'));\n\n audio.removeAttribute('src');\n audio.appendChild(source);\n }\n\n return div.innerHTML;\n };\n\n componentDidUpdate() {\n // set image parent style so it can be horizontally aligned\n const previewPrompt = document.querySelector('#preview-prompt');\n const images = previewPrompt && previewPrompt.getElementsByTagName('img');\n\n if (images && images.length) {\n for (let image of images) {\n image.parentElement.style.display = 'flex';\n }\n }\n }\n\n render() {\n const { prompt, classes, tagName, className, onClick, defaultClassName } = this.props;\n const CustomTag = tagName || 'div';\n const customClasses = `${classes.promptTable} ${classes[className] || ''} ${defaultClassName ||\n ''}`;\n\n return (\n <CustomTag\n id={'preview-prompt'}\n onClick={onClick}\n className={customClasses}\n dangerouslySetInnerHTML={{\n __html: this.parsedText(prompt || '').replace(NEWLINE_BLOCK_REGEX, NEWLINE_LATEX)\n }}\n />\n );\n }\n}\n\nconst styles = theme => ({\n prompt: {\n verticalAlign: 'middle',\n color: color.text()\n },\n rationale: {\n paddingLeft: theme.spacing.unit * 16\n },\n label: {\n color: `${color.text()} !important`, //'var(--choice-input-color, black)',\n display: 'inline-block',\n verticalAlign: 'middle',\n cursor: 'pointer'\n },\n promptTable: {\n '&:not(.MathJax) > table': {\n borderCollapse: 'collapse'\n },\n '&:not(.MathJax) > table tr': {\n '&:nth-child(2n)': {\n backgroundColor: '#f6f8fa'\n }\n },\n '&:not(.MathJax) > table td, &:not(.MathJax) > table th': {\n padding: '.6em 1em',\n textAlign: 'center'\n }\n }\n});\nexport default withStyles(styles)(PreviewPrompt);\n"],"file":"preview-prompt.js"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pie-lib/render-ui",
|
|
3
|
-
"version": "4.13.
|
|
3
|
+
"version": "4.13.3",
|
|
4
4
|
"description": "Some shared ui elements when rendering - but not worthy of their own package yet.",
|
|
5
5
|
"module": "src/index.js",
|
|
6
6
|
"main": "lib/index.js",
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
"@material-ui/core": "^3.8.3",
|
|
13
13
|
"@material-ui/icons": "^3.0.2",
|
|
14
14
|
"@pie-lib/icons": "^2.4.25",
|
|
15
|
-
"@pie-lib/math-rendering": "^2.4.
|
|
15
|
+
"@pie-lib/math-rendering": "^2.4.5",
|
|
16
16
|
"classnames": "^2.2.6",
|
|
17
17
|
"debug": "^4.1.1",
|
|
18
18
|
"prop-types": "^15.7.2",
|
|
@@ -26,5 +26,5 @@
|
|
|
26
26
|
"react": "^16.8.1",
|
|
27
27
|
"react-dom": "^16.8.1"
|
|
28
28
|
},
|
|
29
|
-
"gitHead": "
|
|
29
|
+
"gitHead": "5cd198308a7395a8faa8d9c09ab548964d9d65bf"
|
|
30
30
|
}
|
package/src/preview-prompt.jsx
CHANGED
|
@@ -40,6 +40,18 @@ export class PreviewPrompt extends Component {
|
|
|
40
40
|
return div.innerHTML;
|
|
41
41
|
};
|
|
42
42
|
|
|
43
|
+
componentDidUpdate() {
|
|
44
|
+
// set image parent style so it can be horizontally aligned
|
|
45
|
+
const previewPrompt = document.querySelector('#preview-prompt');
|
|
46
|
+
const images = previewPrompt && previewPrompt.getElementsByTagName('img');
|
|
47
|
+
|
|
48
|
+
if (images && images.length) {
|
|
49
|
+
for (let image of images) {
|
|
50
|
+
image.parentElement.style.display = 'flex';
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
|
|
43
55
|
render() {
|
|
44
56
|
const { prompt, classes, tagName, className, onClick, defaultClassName } = this.props;
|
|
45
57
|
const CustomTag = tagName || 'div';
|
|
@@ -48,6 +60,7 @@ export class PreviewPrompt extends Component {
|
|
|
48
60
|
|
|
49
61
|
return (
|
|
50
62
|
<CustomTag
|
|
63
|
+
id={'preview-prompt'}
|
|
51
64
|
onClick={onClick}
|
|
52
65
|
className={customClasses}
|
|
53
66
|
dangerouslySetInnerHTML={{
|
|
@@ -61,12 +74,7 @@ export class PreviewPrompt extends Component {
|
|
|
61
74
|
const styles = theme => ({
|
|
62
75
|
prompt: {
|
|
63
76
|
verticalAlign: 'middle',
|
|
64
|
-
color: color.text()
|
|
65
|
-
display: 'flex',
|
|
66
|
-
flexDirection: 'column',
|
|
67
|
-
'& > *': {
|
|
68
|
-
display: 'flex'
|
|
69
|
-
}
|
|
77
|
+
color: color.text()
|
|
70
78
|
},
|
|
71
79
|
rationale: {
|
|
72
80
|
paddingLeft: theme.spacing.unit * 16
|