@pie-lib/mask-markup 1.11.0 → 1.11.4
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.json +15 -0
- package/CHANGELOG.md +35 -0
- package/lib/choices/choice.js +5 -1
- package/lib/choices/choice.js.map +1 -1
- package/lib/components/blank.js +5 -1
- package/lib/components/blank.js.map +1 -1
- package/lib/components/correct-input.js +20 -12
- package/lib/components/correct-input.js.map +1 -1
- package/lib/components/input.js +6 -2
- package/lib/components/input.js.map +1 -1
- package/lib/constructed-response.js +6 -2
- package/lib/constructed-response.js.map +1 -1
- package/lib/mask.js +14 -4
- package/lib/mask.js.map +1 -1
- package/lib/serialization.js +2 -1
- package/lib/serialization.js.map +1 -1
- package/package.json +4 -4
- package/src/choices/choice.jsx +5 -1
- package/src/components/blank.jsx +5 -1
- package/src/components/correct-input.jsx +26 -12
- package/src/components/input.jsx +15 -2
- package/src/constructed-response.jsx +5 -2
- package/src/mask.jsx +7 -1
- package/src/serialization.js +1 -1
package/CHANGELOG.json
CHANGED
|
@@ -868,5 +868,20 @@
|
|
|
868
868
|
"committerDate": "2021-10-05 15:36:43 +0300",
|
|
869
869
|
"isTagged": true,
|
|
870
870
|
"tag": "@pie-lib/mask-markup@1.11.0"
|
|
871
|
+
},
|
|
872
|
+
{
|
|
873
|
+
"type": "fix",
|
|
874
|
+
"scope": "mask-markup",
|
|
875
|
+
"subject": "Fixed border radius in pits",
|
|
876
|
+
"merge": null,
|
|
877
|
+
"header": "fix(mask-markup): Fixed border radius in pits",
|
|
878
|
+
"body": null,
|
|
879
|
+
"footer": null,
|
|
880
|
+
"notes": [],
|
|
881
|
+
"hash": "41c0acd332cbe8bceb3ed9059fee1d52ea73ebec",
|
|
882
|
+
"gitTags": " (origin/fix/mask-markup-border-radius)",
|
|
883
|
+
"committerDate": "2021-10-18 14:06:30 +0300",
|
|
884
|
+
"isTagged": true,
|
|
885
|
+
"tag": "@pie-lib/mask-markup@1.11.1"
|
|
871
886
|
}
|
|
872
887
|
]
|
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,41 @@
|
|
|
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
|
+
## [1.11.4](https://github.com/pie-framework/pie-lib/compare/@pie-lib/mask-markup@1.11.3...@pie-lib/mask-markup@1.11.4) (2021-12-13)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @pie-lib/mask-markup
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
## [1.11.3](https://github.com/pie-framework/pie-lib/compare/@pie-lib/mask-markup@1.11.2...@pie-lib/mask-markup@1.11.3) (2021-11-29)
|
|
15
|
+
|
|
16
|
+
**Note:** Version bump only for package @pie-lib/mask-markup
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
## [1.11.2](https://github.com/pie-framework/pie-lib/compare/@pie-lib/mask-markup@1.11.1...@pie-lib/mask-markup@1.11.2) (2021-11-10)
|
|
23
|
+
|
|
24
|
+
**Note:** Version bump only for package @pie-lib/mask-markup
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
## [1.11.1](https://github.com/pie-framework/pie-lib/compare/@pie-lib/mask-markup@1.11.0...@pie-lib/mask-markup@1.11.1) (2021-10-18)
|
|
31
|
+
|
|
32
|
+
|
|
33
|
+
### Bug Fixes
|
|
34
|
+
|
|
35
|
+
* **mask-markup:** Fixed border radius in pits ([41c0acd](https://github.com/pie-framework/pie-lib/commit/41c0acd))
|
|
36
|
+
|
|
37
|
+
|
|
38
|
+
|
|
39
|
+
|
|
40
|
+
|
|
6
41
|
# [1.11.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/mask-markup@1.10.22...@pie-lib/mask-markup@1.11.0) (2021-10-18)
|
|
7
42
|
|
|
8
43
|
|
package/lib/choices/choice.js
CHANGED
|
@@ -119,7 +119,11 @@ var BlankContent = (0, _styles.withStyles)(function (theme) {
|
|
|
119
119
|
margin: '4px'
|
|
120
120
|
},
|
|
121
121
|
chipLabel: {
|
|
122
|
-
whiteSpace: 'pre-wrap'
|
|
122
|
+
whiteSpace: 'pre-wrap',
|
|
123
|
+
'& img': {
|
|
124
|
+
display: 'block',
|
|
125
|
+
padding: '2px 0'
|
|
126
|
+
}
|
|
123
127
|
},
|
|
124
128
|
disabled: {}
|
|
125
129
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/choices/choice.jsx"],"names":["DRAG_TYPE","BlankContentComp","rootRef","props","connectDragSource","choice","classes","disabled","ref","ReactDOM","findDOMNode","chip","chipLabel","innerHTML","value","undefined","React","Component","PropTypes","bool","object","func","BlankContent","theme","border","palette","primary","main","alignItems","display","height","minHeight","fontSize","whiteSpace","maxWidth","margin","tileSource","canDrag","beginDrag","instanceId","DragDropTile","connect","monitor","dragSource","isDragging"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;;;;;AAEO,IAAMA,SAAS,GAAG,WAAlB;;;IAEDC,gB;;;;;;;;;;;;;yCAQiB;AACnB,qCAAW,KAAKC,OAAhB;AACD;;;6BAEQ;AAAA;;AAAA,wBACkD,KAAKC,KADvD;AAAA,UACCC,iBADD,eACCA,iBADD;AAAA,UACoBC,MADpB,eACoBA,MADpB;AAAA,UAC4BC,OAD5B,eAC4BA,OAD5B;AAAA,UACqCC,QADrC,eACqCA,QADrC;AAGP,aAAOH,iBAAiB,CACtB;AAAM,QAAA,SAAS,EAAE,4BAAWE,OAAO,CAACD,MAAnB,EAA2BE,QAAQ,IAAID,OAAO,CAACC,QAA/C;AAAjB,SACE,gCAAC,gBAAD;AACE,QAAA,GAAG,EAAE,aAAAC,KAAG,EAAI;AACV;AACA,UAAA,KAAI,CAACN,OAAL,GAAeO,qBAASC,WAAT,CAAqBF,KAArB,CAAf;AACD,SAJH;AAKE,QAAA,SAAS,EAAEF,OAAO,CAACK,IALrB;AAME,QAAA,KAAK,EACH;AACE,UAAA,SAAS,EAAEL,OAAO,CAACM,SADrB;AAEE,UAAA,GAAG,EAAE,aAAAJ,IAAG,EAAI;AACV,gBAAIA,IAAJ,EAAS;AACPA,cAAAA,IAAG,CAACK,SAAJ,GAAgBR,MAAM,CAACS,KAAP,IAAgB,GAAhC;AACD;AACF;AANH,WAQG,GARH,CAPJ;AAkBE,QAAA,OAAO,EAAEP,QAAQ,GAAG,UAAH,GAAgBQ;AAlBnC,QADF,CADsB,EAuBtB,EAvBsB,CAAxB;AAyBD;;;;EAxC4BC,kBAAMC,S;;gBAA/BhB,gB,eACe;AACjBM,EAAAA,QAAQ,EAAEW,sBAAUC,IADH;AAEjBd,EAAAA,MAAM,EAAEa,sBAAUE,MAFD;AAGjBd,EAAAA,OAAO,EAAEY,sBAAUE,MAHF;AAIjBhB,EAAAA,iBAAiB,EAAEc,sBAAUG;AAJZ,C;;AA0Cd,IAAMC,YAAY,GAAG,wBAAW,UAAAC,KAAK;AAAA,SAAK;AAC/ClB,IAAAA,MAAM,EAAE;AACNmB,MAAAA,MAAM,sBAAeD,KAAK,CAACE,OAAN,CAAcC,OAAd,CAAsBC,IAArC;AADA,KADuC;AAI/ChB,IAAAA,IAAI,EAAE;AACJiB,MAAAA,UAAU,EAAE,QADR;AAEJC,MAAAA,OAAO,EAAE,aAFL;AAGJC,MAAAA,MAAM,EAAE,SAHJ;AAIJC,MAAAA,SAAS,EAAE,MAJP;AAKJC,MAAAA,QAAQ,EAAE,SALN;AAMJC,MAAAA,UAAU,EAAE,UANR;AAOJC,MAAAA,QAAQ,EAAE,OAPN;AAQJC,MAAAA,MAAM,EAAE;AARJ,KAJyC;AAc/CvB,IAAAA,SAAS,EAAE;AACTqB,MAAAA,UAAU,EAAE;
|
|
1
|
+
{"version":3,"sources":["../../src/choices/choice.jsx"],"names":["DRAG_TYPE","BlankContentComp","rootRef","props","connectDragSource","choice","classes","disabled","ref","ReactDOM","findDOMNode","chip","chipLabel","innerHTML","value","undefined","React","Component","PropTypes","bool","object","func","BlankContent","theme","border","palette","primary","main","alignItems","display","height","minHeight","fontSize","whiteSpace","maxWidth","margin","padding","tileSource","canDrag","beginDrag","instanceId","DragDropTile","connect","monitor","dragSource","isDragging"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { DragSource } from '@pie-lib/drag';\nimport { withStyles } from '@material-ui/core/styles';\nimport Chip from '@material-ui/core/Chip';\nimport classnames from 'classnames';\nimport ReactDOM from 'react-dom';\nimport { renderMath } from '@pie-lib/math-rendering';\n\nexport const DRAG_TYPE = 'MaskBlank';\n\nclass BlankContentComp extends React.Component {\n static propTypes = {\n disabled: PropTypes.bool,\n choice: PropTypes.object,\n classes: PropTypes.object,\n connectDragSource: PropTypes.func\n };\n\n componentDidUpdate() {\n renderMath(this.rootRef);\n }\n\n render() {\n const { connectDragSource, choice, classes, disabled } = this.props;\n\n return connectDragSource(\n <span className={classnames(classes.choice, disabled && classes.disabled)}>\n <Chip\n ref={ref => {\n //eslint-disable-next-line\n this.rootRef = ReactDOM.findDOMNode(ref);\n }}\n className={classes.chip}\n label={\n <span\n className={classes.chipLabel}\n ref={ref => {\n if (ref) {\n ref.innerHTML = choice.value || ' ';\n }\n }}\n >\n {' '}\n </span>\n }\n variant={disabled ? 'outlined' : undefined}\n />\n </span>,\n {}\n );\n }\n}\n\nexport const BlankContent = withStyles(theme => ({\n choice: {\n border: `solid 0px ${theme.palette.primary.main}`\n },\n chip: {\n alignItems: 'center',\n display: 'inline-flex',\n height: 'initial',\n minHeight: '32px',\n fontSize: 'inherit',\n whiteSpace: 'pre-wrap',\n maxWidth: '374px',\n margin: '4px'\n },\n chipLabel: {\n whiteSpace: 'pre-wrap',\n '& img': {\n display: 'block',\n padding: '2px 0'\n }\n },\n disabled: {}\n}))(BlankContentComp);\n\nconst tileSource = {\n canDrag(props) {\n return !props.disabled;\n },\n beginDrag(props) {\n return {\n choice: props.choice,\n instanceId: props.instanceId\n };\n }\n};\n\nconst DragDropTile = DragSource(DRAG_TYPE, tileSource, (connect, monitor) => ({\n connectDragSource: connect.dragSource(),\n isDragging: monitor.isDragging()\n}))(BlankContent);\n\nexport default DragDropTile;\n"],"file":"choice.js"}
|
package/lib/components/blank.js
CHANGED
|
@@ -72,7 +72,11 @@ var useStyles = (0, _styles.withStyles)(function () {
|
|
|
72
72
|
position: 'relative'
|
|
73
73
|
},
|
|
74
74
|
chipLabel: {
|
|
75
|
-
whiteSpace: 'pre-wrap'
|
|
75
|
+
whiteSpace: 'pre-wrap',
|
|
76
|
+
'& img': {
|
|
77
|
+
display: 'block',
|
|
78
|
+
padding: '2px 0'
|
|
79
|
+
}
|
|
76
80
|
},
|
|
77
81
|
hidden: {
|
|
78
82
|
color: 'transparent',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/blank.jsx"],"names":["log","DRAG_TYPE","useStyles","content","border","color","primary","minWidth","chip","fontSize","minHeight","maxWidth","position","chipLabel","whiteSpace","hidden","opacity","dragged","left","correct","incorrect","over","overflow","BlankContent","state","height","prevProps","rootRef","currentChoice","props","choice","prevChoice","JSON","stringify","setState","setTimeout","spanRef","offsetHeight","parent","childNodes","forEach","elem","Element","HTMLDocument","setAttribute","disabled","classes","isOver","dragItem","draggedLabel","value","label","ref","ReactDOM","findDOMNode","innerHTML","addDraggableFalseAttributes","undefined","React","Component","id","PropTypes","oneOfType","string","number","bool","duplicates","object","onChange","func","StyledBlankContent","connectedBlankContent","connectDragSource","connectDropTarget","tileTarget","drop","monitor","draggedItem","getItem","instanceId","dropped","canDrop","DropTile","connect","dropTarget","tileSource","canDrag","beginDrag","fromChoice","endDrag","dropResult","getDropResult","DragDropTile","dragSource","isDragging"],"mappings":"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","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport debug from 'debug';\nimport { DragSource, DropTarget } from '@pie-lib/drag';\nimport { withStyles } from '@material-ui/core/styles';\nimport Chip from '@material-ui/core/Chip';\nimport classnames from 'classnames';\nimport { color } from '@pie-lib/render-ui';\nconst log = debug('pie-lib:mask-markup:blank');\nexport const DRAG_TYPE = 'MaskBlank';\n\nconst useStyles = withStyles(() => ({\n content: {\n border: `solid 0px ${color.primary()}`,\n minWidth: '200px'\n },\n chip: {\n minWidth: '90px',\n fontSize: 'inherit',\n minHeight: '32px',\n maxWidth: '374px',\n position: 'relative'\n },\n chipLabel: {\n whiteSpace: 'pre-wrap'\n },\n hidden: {\n color: 'transparent',\n opacity: 0\n },\n dragged: {\n position: 'absolute',\n left: 14,\n maxWidth: '60px'\n },\n correct: {\n border: `solid 1px ${color.correct()}`\n },\n incorrect: {\n border: `solid 1px ${color.incorrect()}`\n },\n over: {\n whiteSpace: 'nowrap',\n overflow: 'hidden'\n }\n}));\n\nexport class BlankContent extends React.Component {\n static propTypes = {\n id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n disabled: PropTypes.bool,\n duplicates: PropTypes.bool,\n choice: PropTypes.object,\n classes: PropTypes.object,\n isOver: PropTypes.bool,\n dragItem: PropTypes.object,\n correct: PropTypes.bool,\n onChange: PropTypes.func\n };\n\n constructor() {\n super();\n this.state = {\n height: 0\n };\n }\n\n componentDidUpdate(prevProps) {\n renderMath(this.rootRef);\n const { choice: currentChoice } = this.props;\n const { choice: prevChoice } = prevProps;\n\n if (JSON.stringify(currentChoice) !== JSON.stringify(prevChoice)) {\n if (!currentChoice) {\n this.setState({\n height: 0\n });\n return;\n }\n setTimeout(() => {\n this.setState({\n height: this.spanRef.offsetHeight\n });\n }, 300);\n }\n }\n\n addDraggableFalseAttributes(parent) {\n parent.childNodes.forEach(elem => {\n if (elem instanceof Element || elem instanceof HTMLDocument) {\n elem.setAttribute('draggable', false);\n }\n });\n }\n\n render() {\n const { disabled, choice, classes, isOver, dragItem, correct } = this.props;\n const draggedLabel = dragItem && isOver && dragItem.choice.value;\n const label = choice && choice.value;\n\n return (\n <Chip\n ref={ref => {\n //eslint-disable-next-line\n this.rootRef = ReactDOM.findDOMNode(ref);\n }}\n component=\"span\"\n label={\n <React.Fragment>\n <span\n className={classnames(classes.chipLabel, isOver && classes.over, {\n [classes.hidden]: draggedLabel\n })}\n ref={ref => {\n if (ref) {\n //eslint-disable-next-line\n this.spanRef = ReactDOM.findDOMNode(ref);\n ref.innerHTML = label || '';\n this.addDraggableFalseAttributes(ref);\n }\n }}\n >\n {' '}\n </span>\n {draggedLabel && (\n <span\n className={classnames(classes.chipLabel, isOver && classes.over, classes.dragged)}\n ref={ref => {\n if (ref) {\n //eslint-disable-next-line\n this.spanRef = ReactDOM.findDOMNode(ref);\n ref.innerHTML = draggedLabel || '';\n this.addDraggableFalseAttributes(ref);\n }\n }}\n >\n {' '}\n </span>\n )}\n </React.Fragment>\n }\n className={classnames(classes.chip, isOver && classes.over, {\n [classes.correct]: correct !== undefined && correct,\n [classes.incorrect]: correct !== undefined && !correct\n })}\n variant={disabled ? 'outlined' : undefined}\n style={{\n ...(this.state.height ? { height: this.state.height } : {})\n }}\n classes={{\n label: isOver && classes.over\n }}\n />\n );\n }\n}\n\nconst StyledBlankContent = useStyles(BlankContent);\n\nconst connectedBlankContent = useStyles(({ connectDragSource, connectDropTarget, ...props }) => {\n const { classes, isOver } = props;\n\n return connectDropTarget(\n connectDragSource(\n <span className={classnames(classes.content, isOver && classes.over)}>\n <StyledBlankContent {...props} />\n </span>\n )\n );\n});\n\nconst tileTarget = {\n drop(props, monitor) {\n const draggedItem = monitor.getItem();\n\n log('props.instanceId', props.instanceId, 'draggedItem.instanceId:', draggedItem.instanceId);\n\n if (draggedItem.id !== props.id) {\n props.onChange(props.id, draggedItem.choice.id);\n }\n\n return {\n dropped: draggedItem.id !== props.id\n };\n },\n canDrop(props, monitor) {\n const draggedItem = monitor.getItem();\n\n return draggedItem.instanceId === props.instanceId;\n }\n};\n\nconst DropTile = DropTarget(DRAG_TYPE, tileTarget, (connect, monitor) => ({\n connectDropTarget: connect.dropTarget(),\n isOver: monitor.isOver(),\n dragItem: monitor.getItem()\n}))(connectedBlankContent);\n\nconst tileSource = {\n canDrag(props) {\n return !props.disabled && !!props.choice;\n },\n beginDrag(props) {\n return {\n id: props.id,\n choice: props.choice,\n instanceId: props.instanceId,\n fromChoice: true\n };\n },\n endDrag(props, monitor) {\n // this will be null if it did not drop\n const dropResult = monitor.getDropResult();\n\n if (!dropResult || (dropResult.dropped && !props.duplicates)) {\n const draggedItem = monitor.getItem();\n\n if (draggedItem.fromChoice) {\n props.onChange(props.id, undefined);\n }\n }\n }\n};\n\nconst DragDropTile = DragSource(DRAG_TYPE, tileSource, (connect, monitor) => ({\n connectDragSource: connect.dragSource(),\n isDragging: monitor.isDragging()\n}))(DropTile);\n\nexport default DragDropTile;\n"],"file":"blank.js"}
|
|
1
|
+
{"version":3,"sources":["../../src/components/blank.jsx"],"names":["log","DRAG_TYPE","useStyles","content","border","color","primary","minWidth","chip","fontSize","minHeight","maxWidth","position","chipLabel","whiteSpace","display","padding","hidden","opacity","dragged","left","correct","incorrect","over","overflow","BlankContent","state","height","prevProps","rootRef","currentChoice","props","choice","prevChoice","JSON","stringify","setState","setTimeout","spanRef","offsetHeight","parent","childNodes","forEach","elem","Element","HTMLDocument","setAttribute","disabled","classes","isOver","dragItem","draggedLabel","value","label","ref","ReactDOM","findDOMNode","innerHTML","addDraggableFalseAttributes","undefined","React","Component","id","PropTypes","oneOfType","string","number","bool","duplicates","object","onChange","func","StyledBlankContent","connectedBlankContent","connectDragSource","connectDropTarget","tileTarget","drop","monitor","draggedItem","getItem","instanceId","dropped","canDrop","DropTile","connect","dropTarget","tileSource","canDrag","beginDrag","fromChoice","endDrag","dropResult","getDropResult","DragDropTile","dragSource","isDragging"],"mappings":"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","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport debug from 'debug';\nimport { DragSource, DropTarget } from '@pie-lib/drag';\nimport { withStyles } from '@material-ui/core/styles';\nimport Chip from '@material-ui/core/Chip';\nimport classnames from 'classnames';\nimport { color } from '@pie-lib/render-ui';\nconst log = debug('pie-lib:mask-markup:blank');\nexport const DRAG_TYPE = 'MaskBlank';\n\nconst useStyles = withStyles(() => ({\n content: {\n border: `solid 0px ${color.primary()}`,\n minWidth: '200px'\n },\n chip: {\n minWidth: '90px',\n fontSize: 'inherit',\n minHeight: '32px',\n maxWidth: '374px',\n position: 'relative'\n },\n chipLabel: {\n whiteSpace: 'pre-wrap',\n '& img': {\n display: 'block',\n padding: '2px 0'\n }\n },\n hidden: {\n color: 'transparent',\n opacity: 0\n },\n dragged: {\n position: 'absolute',\n left: 14,\n maxWidth: '60px'\n },\n correct: {\n border: `solid 1px ${color.correct()}`\n },\n incorrect: {\n border: `solid 1px ${color.incorrect()}`\n },\n over: {\n whiteSpace: 'nowrap',\n overflow: 'hidden'\n }\n}));\n\nexport class BlankContent extends React.Component {\n static propTypes = {\n id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n disabled: PropTypes.bool,\n duplicates: PropTypes.bool,\n choice: PropTypes.object,\n classes: PropTypes.object,\n isOver: PropTypes.bool,\n dragItem: PropTypes.object,\n correct: PropTypes.bool,\n onChange: PropTypes.func\n };\n\n constructor() {\n super();\n this.state = {\n height: 0\n };\n }\n\n componentDidUpdate(prevProps) {\n renderMath(this.rootRef);\n const { choice: currentChoice } = this.props;\n const { choice: prevChoice } = prevProps;\n\n if (JSON.stringify(currentChoice) !== JSON.stringify(prevChoice)) {\n if (!currentChoice) {\n this.setState({\n height: 0\n });\n return;\n }\n setTimeout(() => {\n this.setState({\n height: this.spanRef.offsetHeight\n });\n }, 300);\n }\n }\n\n addDraggableFalseAttributes(parent) {\n parent.childNodes.forEach(elem => {\n if (elem instanceof Element || elem instanceof HTMLDocument) {\n elem.setAttribute('draggable', false);\n }\n });\n }\n\n render() {\n const { disabled, choice, classes, isOver, dragItem, correct } = this.props;\n const draggedLabel = dragItem && isOver && dragItem.choice.value;\n const label = choice && choice.value;\n\n return (\n <Chip\n ref={ref => {\n //eslint-disable-next-line\n this.rootRef = ReactDOM.findDOMNode(ref);\n }}\n component=\"span\"\n label={\n <React.Fragment>\n <span\n className={classnames(classes.chipLabel, isOver && classes.over, {\n [classes.hidden]: draggedLabel\n })}\n ref={ref => {\n if (ref) {\n //eslint-disable-next-line\n this.spanRef = ReactDOM.findDOMNode(ref);\n ref.innerHTML = label || '';\n this.addDraggableFalseAttributes(ref);\n }\n }}\n >\n {' '}\n </span>\n {draggedLabel && (\n <span\n className={classnames(classes.chipLabel, isOver && classes.over, classes.dragged)}\n ref={ref => {\n if (ref) {\n //eslint-disable-next-line\n this.spanRef = ReactDOM.findDOMNode(ref);\n ref.innerHTML = draggedLabel || '';\n this.addDraggableFalseAttributes(ref);\n }\n }}\n >\n {' '}\n </span>\n )}\n </React.Fragment>\n }\n className={classnames(classes.chip, isOver && classes.over, {\n [classes.correct]: correct !== undefined && correct,\n [classes.incorrect]: correct !== undefined && !correct\n })}\n variant={disabled ? 'outlined' : undefined}\n style={{\n ...(this.state.height ? { height: this.state.height } : {})\n }}\n classes={{\n label: isOver && classes.over\n }}\n />\n );\n }\n}\n\nconst StyledBlankContent = useStyles(BlankContent);\n\nconst connectedBlankContent = useStyles(({ connectDragSource, connectDropTarget, ...props }) => {\n const { classes, isOver } = props;\n\n return connectDropTarget(\n connectDragSource(\n <span className={classnames(classes.content, isOver && classes.over)}>\n <StyledBlankContent {...props} />\n </span>\n )\n );\n});\n\nconst tileTarget = {\n drop(props, monitor) {\n const draggedItem = monitor.getItem();\n\n log('props.instanceId', props.instanceId, 'draggedItem.instanceId:', draggedItem.instanceId);\n\n if (draggedItem.id !== props.id) {\n props.onChange(props.id, draggedItem.choice.id);\n }\n\n return {\n dropped: draggedItem.id !== props.id\n };\n },\n canDrop(props, monitor) {\n const draggedItem = monitor.getItem();\n\n return draggedItem.instanceId === props.instanceId;\n }\n};\n\nconst DropTile = DropTarget(DRAG_TYPE, tileTarget, (connect, monitor) => ({\n connectDropTarget: connect.dropTarget(),\n isOver: monitor.isOver(),\n dragItem: monitor.getItem()\n}))(connectedBlankContent);\n\nconst tileSource = {\n canDrag(props) {\n return !props.disabled && !!props.choice;\n },\n beginDrag(props) {\n return {\n id: props.id,\n choice: props.choice,\n instanceId: props.instanceId,\n fromChoice: true\n };\n },\n endDrag(props, monitor) {\n // this will be null if it did not drop\n const dropResult = monitor.getDropResult();\n\n if (!dropResult || (dropResult.dropped && !props.duplicates)) {\n const draggedItem = monitor.getItem();\n\n if (draggedItem.fromChoice) {\n props.onChange(props.id, undefined);\n }\n }\n }\n};\n\nconst DragDropTile = DragSource(DRAG_TYPE, tileSource, (connect, monitor) => ({\n connectDragSource: connect.dragSource(),\n isDragging: monitor.isDragging()\n}))(DropTile);\n\nexport default DragDropTile;\n"],"file":"blank.js"}
|
|
@@ -36,7 +36,7 @@ var _default = (0, _styles.withStyles)(function () {
|
|
|
36
36
|
input: {
|
|
37
37
|
color: _renderUi.color.text(),
|
|
38
38
|
backgroundColor: _renderUi.color.background(),
|
|
39
|
-
borderRadius: '4px',
|
|
39
|
+
borderRadius: '4px !important',
|
|
40
40
|
borderWidth: '1px',
|
|
41
41
|
borderStyle: 'solid',
|
|
42
42
|
padding: '10px 20px 10px 10px',
|
|
@@ -54,6 +54,9 @@ var _default = (0, _styles.withStyles)(function () {
|
|
|
54
54
|
borderColor: _renderUi.color.primaryDark()
|
|
55
55
|
}
|
|
56
56
|
},
|
|
57
|
+
crInput: {
|
|
58
|
+
padding: '8px !important'
|
|
59
|
+
},
|
|
57
60
|
correct: correctStyle(_renderUi.color.correct()),
|
|
58
61
|
incorrect: correctStyle(_renderUi.color.incorrect()),
|
|
59
62
|
box: {
|
|
@@ -74,25 +77,30 @@ var _default = (0, _styles.withStyles)(function () {
|
|
|
74
77
|
var _classnames, _classnames2;
|
|
75
78
|
|
|
76
79
|
var correct = props.correct,
|
|
77
|
-
|
|
80
|
+
charactersLimit = props.charactersLimit,
|
|
78
81
|
classes = props.classes,
|
|
79
82
|
disabled = props.disabled,
|
|
80
|
-
|
|
81
|
-
|
|
83
|
+
isBox = props.isBox,
|
|
84
|
+
isConstructedResponse = props.isConstructedResponse,
|
|
85
|
+
width = props.width,
|
|
86
|
+
rest = _objectWithoutProperties(props, ["correct", "charactersLimit", "classes", "disabled", "isBox", "isConstructedResponse", "width"]);
|
|
82
87
|
|
|
83
88
|
var label = typeof correct === 'boolean' ? correct ? 'correct' : 'incorrect' : undefined;
|
|
84
|
-
var
|
|
85
|
-
|
|
86
|
-
var inputProps = maxLength ? {
|
|
87
|
-
maxLength: maxLength,
|
|
88
|
-
style: {
|
|
89
|
-
width: "".concat(maxLength + extraSpace, "ch")
|
|
90
|
-
}
|
|
89
|
+
var inputProps = charactersLimit ? {
|
|
90
|
+
maxLength: charactersLimit
|
|
91
91
|
} : {};
|
|
92
|
+
|
|
93
|
+
if (width) {
|
|
94
|
+
inputProps.style = {
|
|
95
|
+
width: "".concat(width + Math.round(width / 10) + 1, "ch") // added some extra space for capital letters
|
|
96
|
+
|
|
97
|
+
};
|
|
98
|
+
}
|
|
99
|
+
|
|
92
100
|
return _react["default"].createElement(_OutlinedInput["default"], _extends({
|
|
93
101
|
className: (0, _classnames3["default"])((_classnames = {}, _defineProperty(_classnames, classes.disabledInput, disabled), _defineProperty(_classnames, classes.box, isBox), _defineProperty(_classnames, classes.outlinedInput, true), _classnames)),
|
|
94
102
|
classes: {
|
|
95
|
-
input: (0, _classnames3["default"])((_classnames2 = {}, _defineProperty(_classnames2, classes.input, true), _defineProperty(_classnames2, classes[label], label), _classnames2))
|
|
103
|
+
input: (0, _classnames3["default"])((_classnames2 = {}, _defineProperty(_classnames2, classes.input, true), _defineProperty(_classnames2, classes[label], label), _defineProperty(_classnames2, classes.crInput, isConstructedResponse), _classnames2))
|
|
96
104
|
},
|
|
97
105
|
inputProps: inputProps,
|
|
98
106
|
labelWidth: 0,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/correct-input.jsx"],"names":["correctStyle","color","borderColor","input","text","backgroundColor","background","borderRadius","borderWidth","borderStyle","padding","opacity","cursor","primary","primaryDark","correct","incorrect","box","fontSize","outlinedInput","border","notchedOutline","props","
|
|
1
|
+
{"version":3,"sources":["../../src/components/correct-input.jsx"],"names":["correctStyle","color","borderColor","input","text","backgroundColor","background","borderRadius","borderWidth","borderStyle","padding","opacity","cursor","primary","primaryDark","crInput","correct","incorrect","box","fontSize","outlinedInput","border","notchedOutline","props","charactersLimit","classes","disabled","isBox","isConstructedResponse","width","rest","label","undefined","inputProps","maxLength","style","Math","round","disabledInput"],"mappings":"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","sourcesContent":["import React from 'react';\nimport OutlinedInput from '@material-ui/core/OutlinedInput';\nimport classnames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport { color } from '@pie-lib/render-ui';\n\nconst correctStyle = color => ({\n borderColor: `${color} !important`\n});\n\nexport default withStyles(() => ({\n input: {\n color: color.text(),\n backgroundColor: color.background(),\n borderRadius: '4px !important',\n borderWidth: '1px',\n borderStyle: 'solid',\n padding: '10px 20px 10px 10px',\n '&:disabled': {\n opacity: 0.8,\n cursor: 'not-allowed !important'\n },\n '&:hover': {\n borderColor: color.primary(),\n '&:disabled': {\n borderColor: 'initial'\n }\n },\n '&:focus': {\n borderColor: color.primaryDark()\n }\n },\n crInput: {\n padding: '8px !important'\n },\n correct: correctStyle(color.correct()),\n incorrect: correctStyle(color.incorrect()),\n box: {\n fontSize: 'inherit'\n },\n outlinedInput: {\n padding: '2px',\n borderRadius: '4px',\n '& fieldset': {\n border: 0\n }\n },\n notchedOutline: {\n borderColor: color.correct()\n }\n}))(props => {\n const {\n correct,\n charactersLimit,\n classes,\n disabled,\n isBox,\n isConstructedResponse,\n width,\n ...rest\n } = props;\n const label = typeof correct === 'boolean' ? (correct ? 'correct' : 'incorrect') : undefined;\n const inputProps = charactersLimit ? { maxLength: charactersLimit } : {};\n\n if (width) {\n inputProps.style = {\n width: `${width + Math.round(width / 10) + 1}ch` // added some extra space for capital letters\n };\n }\n\n return (\n <OutlinedInput\n className={classnames({\n [classes.disabledInput]: disabled,\n [classes.box]: isBox,\n [classes.outlinedInput]: true\n })}\n classes={{\n input: classnames({\n [classes.input]: true,\n [classes[label]]: label,\n [classes.crInput]: isConstructedResponse\n })\n }}\n inputProps={inputProps}\n labelWidth={0}\n disabled={disabled}\n {...rest}\n />\n );\n});\n"],"file":"correct-input.js"}
|
package/lib/components/input.js
CHANGED
|
@@ -16,18 +16,22 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
|
|
|
16
16
|
var Input = function Input(_ref) {
|
|
17
17
|
var disabled = _ref.disabled,
|
|
18
18
|
correct = _ref.correct,
|
|
19
|
+
charactersLimit = _ref.charactersLimit,
|
|
19
20
|
id = _ref.id,
|
|
21
|
+
isConstructedResponse = _ref.isConstructedResponse,
|
|
20
22
|
value = _ref.value,
|
|
21
23
|
_onChange = _ref.onChange,
|
|
22
24
|
showCorrectAnswer = _ref.showCorrectAnswer,
|
|
23
|
-
|
|
25
|
+
width = _ref.width;
|
|
24
26
|
return _react["default"].createElement(_correctInput["default"], {
|
|
25
27
|
disabled: disabled,
|
|
26
28
|
correct: showCorrectAnswer || correct,
|
|
29
|
+
charactersLimit: charactersLimit,
|
|
27
30
|
variant: "outlined",
|
|
28
31
|
value: value,
|
|
32
|
+
isConstructedResponse: isConstructedResponse,
|
|
29
33
|
isBox: true,
|
|
30
|
-
|
|
34
|
+
width: width,
|
|
31
35
|
onChange: function onChange(e) {
|
|
32
36
|
_onChange(id, e.target.value);
|
|
33
37
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/input.jsx"],"names":["Input","disabled","correct","id","value","onChange","showCorrectAnswer","
|
|
1
|
+
{"version":3,"sources":["../../src/components/input.jsx"],"names":["Input","disabled","correct","charactersLimit","id","isConstructedResponse","value","onChange","showCorrectAnswer","width","e","target","propTypes","PropTypes","string","func","bool"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;AAEA,IAAMA,KAAK,GAAG,SAARA,KAAQ,OAUR;AAAA,MATJC,QASI,QATJA,QASI;AAAA,MARJC,OAQI,QARJA,OAQI;AAAA,MAPJC,eAOI,QAPJA,eAOI;AAAA,MANJC,EAMI,QANJA,EAMI;AAAA,MALJC,qBAKI,QALJA,qBAKI;AAAA,MAJJC,KAII,QAJJA,KAII;AAAA,MAHJC,SAGI,QAHJA,QAGI;AAAA,MAFJC,iBAEI,QAFJA,iBAEI;AAAA,MADJC,KACI,QADJA,KACI;AACJ,SACE,gCAAC,wBAAD;AACE,IAAA,QAAQ,EAAER,QADZ;AAEE,IAAA,OAAO,EAAEO,iBAAiB,IAAIN,OAFhC;AAGE,IAAA,eAAe,EAAEC,eAHnB;AAIE,IAAA,OAAO,EAAC,UAJV;AAKE,IAAA,KAAK,EAAEG,KALT;AAME,IAAA,qBAAqB,EAAED,qBANzB;AAOE,IAAA,KAAK,EAAE,IAPT;AAQE,IAAA,KAAK,EAAEI,KART;AASE,IAAA,QAAQ,EAAE,kBAAAC,CAAC,EAAI;AACbH,MAAAA,SAAQ,CAACH,EAAD,EAAKM,CAAC,CAACC,MAAF,CAASL,KAAd,CAAR;AACD;AAXH,IADF;AAeD,CA1BD;;AA4BAN,KAAK,CAACY,SAAN,GAAkB;AAChBR,EAAAA,EAAE,EAAES,sBAAUC,MADE;AAEhBR,EAAAA,KAAK,EAAEO,sBAAUC,MAFD;AAGhBP,EAAAA,QAAQ,EAAEM,sBAAUE,IAHJ;AAIhBd,EAAAA,QAAQ,EAAEY,sBAAUG,IAJJ;AAKhBd,EAAAA,OAAO,EAAEW,sBAAUG,IALH;AAMhBR,EAAAA,iBAAiB,EAAEK,sBAAUG;AANb,CAAlB;eASehB,K","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport CorrectInput from './correct-input';\n\nconst Input = ({\n disabled,\n correct,\n charactersLimit,\n id,\n isConstructedResponse,\n value,\n onChange,\n showCorrectAnswer,\n width\n}) => {\n return (\n <CorrectInput\n disabled={disabled}\n correct={showCorrectAnswer || correct}\n charactersLimit={charactersLimit}\n variant=\"outlined\"\n value={value}\n isConstructedResponse={isConstructedResponse}\n isBox={true}\n width={width}\n onChange={e => {\n onChange(id, e.target.value);\n }}\n />\n );\n};\n\nInput.propTypes = {\n id: PropTypes.string,\n value: PropTypes.string,\n onChange: PropTypes.func,\n disabled: PropTypes.bool,\n correct: PropTypes.bool,\n showCorrectAnswer: PropTypes.bool\n};\n\nexport default Input;\n"],"file":"input.js"}
|
|
@@ -18,13 +18,15 @@ var _default = (0, _withMask.withMask)('input', function (props) {
|
|
|
18
18
|
var dataset = node.data ? node.data.dataset || {} : {};
|
|
19
19
|
|
|
20
20
|
if (dataset.component === 'input') {
|
|
21
|
-
var
|
|
21
|
+
var adjustedLimit = props.adjustedLimit,
|
|
22
|
+
disabled = props.disabled,
|
|
22
23
|
feedback = props.feedback,
|
|
23
24
|
showCorrectAnswer = props.showCorrectAnswer,
|
|
24
25
|
maxLength = props.maxLength; // the first answer is the correct one
|
|
25
26
|
|
|
26
27
|
var correctAnswer = (props.choices && dataset && props.choices[dataset.id] || [])[0];
|
|
27
28
|
var finalValue = showCorrectAnswer ? correctAnswer && correctAnswer.label : data[dataset.id] || '';
|
|
29
|
+
var width = maxLength && maxLength[dataset.id];
|
|
28
30
|
return _react["default"].createElement(_input["default"], {
|
|
29
31
|
key: "".concat(node.type, "-input-").concat(dataset.id),
|
|
30
32
|
correct: feedback && feedback[dataset.id] && feedback[dataset.id] === 'correct',
|
|
@@ -33,7 +35,9 @@ var _default = (0, _withMask.withMask)('input', function (props) {
|
|
|
33
35
|
id: dataset.id,
|
|
34
36
|
onChange: onChange,
|
|
35
37
|
showCorrectAnswer: showCorrectAnswer,
|
|
36
|
-
|
|
38
|
+
width: width,
|
|
39
|
+
charactersLimit: adjustedLimit ? width : 25,
|
|
40
|
+
isConstructedResponse: true
|
|
37
41
|
});
|
|
38
42
|
}
|
|
39
43
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/constructed-response.jsx"],"names":["props","node","data","onChange","dataset","component","disabled","feedback","showCorrectAnswer","maxLength","correctAnswer","choices","id","finalValue","label","type"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;eAEe,wBAAS,OAAT,EAAkB,UAAAA,KAAK;AAAA,SAAI,UAACC,IAAD,EAAOC,IAAP,EAAaC,QAAb,EAA0B;AAClE,QAAMC,OAAO,GAAGH,IAAI,CAACC,IAAL,GAAYD,IAAI,CAACC,IAAL,CAAUE,OAAV,IAAqB,EAAjC,GAAsC,EAAtD;;AACA,QAAIA,OAAO,CAACC,SAAR,KAAsB,OAA1B,EAAmC;AAAA,UACzBC,
|
|
1
|
+
{"version":3,"sources":["../src/constructed-response.jsx"],"names":["props","node","data","onChange","dataset","component","adjustedLimit","disabled","feedback","showCorrectAnswer","maxLength","correctAnswer","choices","id","finalValue","label","width","type"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;eAEe,wBAAS,OAAT,EAAkB,UAAAA,KAAK;AAAA,SAAI,UAACC,IAAD,EAAOC,IAAP,EAAaC,QAAb,EAA0B;AAClE,QAAMC,OAAO,GAAGH,IAAI,CAACC,IAAL,GAAYD,IAAI,CAACC,IAAL,CAAUE,OAAV,IAAqB,EAAjC,GAAsC,EAAtD;;AACA,QAAIA,OAAO,CAACC,SAAR,KAAsB,OAA1B,EAAmC;AAAA,UACzBC,aADyB,GAC2CN,KAD3C,CACzBM,aADyB;AAAA,UACVC,QADU,GAC2CP,KAD3C,CACVO,QADU;AAAA,UACAC,QADA,GAC2CR,KAD3C,CACAQ,QADA;AAAA,UACUC,iBADV,GAC2CT,KAD3C,CACUS,iBADV;AAAA,UAC6BC,SAD7B,GAC2CV,KAD3C,CAC6BU,SAD7B,EAEjC;;AACA,UAAMC,aAAa,GAAG,CAAEX,KAAK,CAACY,OAAN,IAAiBR,OAAjB,IAA4BJ,KAAK,CAACY,OAAN,CAAcR,OAAO,CAACS,EAAtB,CAA7B,IAA2D,EAA5D,EAAgE,CAAhE,CAAtB;AACA,UAAMC,UAAU,GAAGL,iBAAiB,GAChCE,aAAa,IAAIA,aAAa,CAACI,KADC,GAEhCb,IAAI,CAACE,OAAO,CAACS,EAAT,CAAJ,IAAoB,EAFxB;AAGA,UAAMG,KAAK,GAAGN,SAAS,IAAIA,SAAS,CAACN,OAAO,CAACS,EAAT,CAApC;AAEA,aACE,gCAAC,iBAAD;AACE,QAAA,GAAG,YAAKZ,IAAI,CAACgB,IAAV,oBAAwBb,OAAO,CAACS,EAAhC,CADL;AAEE,QAAA,OAAO,EAAEL,QAAQ,IAAIA,QAAQ,CAACJ,OAAO,CAACS,EAAT,CAApB,IAAoCL,QAAQ,CAACJ,OAAO,CAACS,EAAT,CAAR,KAAyB,SAFxE;AAGE,QAAA,QAAQ,EAAEJ,iBAAiB,IAAIF,QAHjC;AAIE,QAAA,KAAK,EAAEO,UAJT;AAKE,QAAA,EAAE,EAAEV,OAAO,CAACS,EALd;AAME,QAAA,QAAQ,EAAEV,QANZ;AAOE,QAAA,iBAAiB,EAAEM,iBAPrB;AAQE,QAAA,KAAK,EAAEO,KART;AASE,QAAA,eAAe,EAAEV,aAAa,GAAGU,KAAH,GAAW,EAT3C;AAUE,QAAA,qBAAqB,EAAE;AAVzB,QADF;AAcD;AACF,GA1BqC;AAAA,CAAvB,C","sourcesContent":["import React from 'react';\nimport Input from './components/input';\nimport { withMask } from './with-mask';\n\nexport default withMask('input', props => (node, data, onChange) => {\n const dataset = node.data ? node.data.dataset || {} : {};\n if (dataset.component === 'input') {\n const { adjustedLimit, disabled, feedback, showCorrectAnswer, maxLength } = props;\n // the first answer is the correct one\n const correctAnswer = ((props.choices && dataset && props.choices[dataset.id]) || [])[0];\n const finalValue = showCorrectAnswer\n ? correctAnswer && correctAnswer.label\n : data[dataset.id] || '';\n const width = maxLength && maxLength[dataset.id];\n\n return (\n <Input\n key={`${node.type}-input-${dataset.id}`}\n correct={feedback && feedback[dataset.id] && feedback[dataset.id] === 'correct'}\n disabled={showCorrectAnswer || disabled}\n value={finalValue}\n id={dataset.id}\n onChange={onChange}\n showCorrectAnswer={showCorrectAnswer}\n width={width}\n charactersLimit={adjustedLimit ? width : 25}\n isConstructedResponse={true}\n />\n );\n }\n});\n"],"file":"constructed-response.js"}
|
package/lib/mask.js
CHANGED
|
@@ -143,13 +143,23 @@ var renderChildren = function renderChildren(layout, value, onChange, rootRender
|
|
|
143
143
|
});
|
|
144
144
|
return children;
|
|
145
145
|
};
|
|
146
|
+
|
|
147
|
+
exports.renderChildren = renderChildren;
|
|
148
|
+
var MaskContainer = (0, _styles.withStyles)(function () {
|
|
149
|
+
return {
|
|
150
|
+
main: {
|
|
151
|
+
display: 'inherit'
|
|
152
|
+
}
|
|
153
|
+
};
|
|
154
|
+
})(function (props) {
|
|
155
|
+
return _react["default"].createElement("div", {
|
|
156
|
+
className: props.classes.main
|
|
157
|
+
}, props.children);
|
|
158
|
+
});
|
|
146
159
|
/**
|
|
147
160
|
* Renders a layout that uses the slate.js Value model structure.
|
|
148
161
|
*/
|
|
149
162
|
|
|
150
|
-
|
|
151
|
-
exports.renderChildren = renderChildren;
|
|
152
|
-
|
|
153
163
|
var Mask =
|
|
154
164
|
/*#__PURE__*/
|
|
155
165
|
function (_React$Component) {
|
|
@@ -184,7 +194,7 @@ function (_React$Component) {
|
|
|
184
194
|
value = _this$props.value,
|
|
185
195
|
layout = _this$props.layout;
|
|
186
196
|
var children = renderChildren(layout, value, this.handleChange, this.props.renderChildren);
|
|
187
|
-
return _react["default"].createElement(
|
|
197
|
+
return _react["default"].createElement(MaskContainer, null, children);
|
|
188
198
|
}
|
|
189
199
|
}]);
|
|
190
200
|
|
package/lib/mask.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/mask.jsx"],"names":["Paragraph","theme","para","paddingTop","spacing","unit","paddingBottom","props","classes","children","restrictWhitespaceTypes","addText","parentNode","text","isWhitespace","trim","parentType","type","includes","undefined","getMark","n","mark","leaves","find","leave","length","marks","renderChildren","layout","value","onChange","rootRenderChildren","nodes","forEach","index","key","c","push","object","content","reduce","acc","l","t","extraText","markKey","MARK_TAGS","Tag","subNodes","data","attributes","Mask","id","handleChange","React","Component","PropTypes","func"],"mappings":"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
|
|
1
|
+
{"version":3,"sources":["../src/mask.jsx"],"names":["Paragraph","theme","para","paddingTop","spacing","unit","paddingBottom","props","classes","children","restrictWhitespaceTypes","addText","parentNode","text","isWhitespace","trim","parentType","type","includes","undefined","getMark","n","mark","leaves","find","leave","length","marks","renderChildren","layout","value","onChange","rootRenderChildren","nodes","forEach","index","key","c","push","object","content","reduce","acc","l","t","extraText","markKey","MARK_TAGS","Tag","subNodes","data","attributes","MaskContainer","main","display","Mask","id","handleChange","React","Component","PropTypes","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport get from 'lodash/get';\nimport { withStyles } from '@material-ui/core/styles';\nimport { MARK_TAGS } from './serialization';\n\nconst Paragraph = withStyles(theme => ({\n para: {\n paddingTop: 2 * theme.spacing.unit,\n paddingBottom: 2 * theme.spacing.unit\n }\n}))(props => <div className={props.classes.para}>{props.children}</div>);\n\nconst restrictWhitespaceTypes = ['tbody', 'tr'];\n\nconst addText = (parentNode, text) => {\n const isWhitespace = text.trim() === '';\n const parentType = parentNode && parentNode.type;\n\n if (isWhitespace && restrictWhitespaceTypes.includes(parentType)) {\n return undefined;\n } else {\n return text;\n }\n};\n\nconst getMark = n => {\n const mark = n.leaves.find(leave => get(leave, 'marks', []).length);\n\n if (mark) {\n return mark.marks[0];\n }\n\n return null;\n};\n\nexport const renderChildren = (layout, value, onChange, rootRenderChildren, parentNode) => {\n if (!value) {\n return null;\n }\n\n const children = [];\n\n (layout.nodes || []).forEach((n, index) => {\n const key = `${n.type}-${index}`;\n\n if (rootRenderChildren) {\n const c = rootRenderChildren(n, value, onChange);\n if (c) {\n children.push(c);\n return;\n }\n }\n\n if (n.object === 'text') {\n const content = n.leaves.reduce((acc, l) => {\n const t = l.text;\n const extraText = addText(parentNode, t);\n return extraText ? acc + extraText : acc;\n }, '');\n const mark = getMark(n);\n\n if (mark) {\n let markKey;\n\n for (markKey in MARK_TAGS) {\n if (MARK_TAGS[markKey] === mark.type) {\n const Tag = markKey;\n\n children.push(<Tag>{content}</Tag>);\n break;\n }\n }\n } else if (content.length > 0) {\n children.push(content);\n }\n } else {\n const subNodes = renderChildren(n, value, onChange, rootRenderChildren, n);\n if (n.type === 'p' || n.type === 'paragraph') {\n children.push(<Paragraph key={key}>{subNodes}</Paragraph>);\n } else {\n const Tag = n.type;\n if (n.nodes && n.nodes.length > 0) {\n children.push(\n <Tag key={key} {...n.data.attributes}>\n {subNodes}\n </Tag>\n );\n } else {\n children.push(<Tag key={key} {...n.data.attributes} />);\n }\n }\n }\n });\n return children;\n};\n\nconst MaskContainer = withStyles(() => ({\n main: {\n display: 'inherit'\n }\n}))(props => <div className={props.classes.main}>{props.children}</div>);\n\n/**\n * Renders a layout that uses the slate.js Value model structure.\n */\nexport default class Mask extends React.Component {\n static propTypes = {\n renderChildren: PropTypes.func,\n layout: PropTypes.object,\n value: PropTypes.object,\n onChange: PropTypes.func\n };\n\n handleChange = (id, value) => {\n const data = { ...this.props.value, [id]: value };\n this.props.onChange(data);\n };\n\n render() {\n const { value, layout } = this.props;\n const children = renderChildren(layout, value, this.handleChange, this.props.renderChildren);\n\n return <MaskContainer>{children}</MaskContainer>;\n }\n}\n"],"file":"mask.js"}
|
package/lib/serialization.js
CHANGED
package/lib/serialization.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/serialization.js"],"names":["log","INLINE","MARK","TEXT_NODE","COMMENT_NODE","attr","el","attributes","length","undefined","out","i","a","name","value","getObject","type","includes","parseStyleString","s","regex","match","result","exec","trim","reactAttributes","o","camelize","handleStyles","attribute","styleString","getAttribute","handleClass","acc","classNames","attributesToMap","style","className","MARK_TAGS","b","em","u","code","strong","marks","deserialize","next","mark","tagName","toLowerCase","object","nodes","childNodes","rules","nodeType","leaves","text","textContent","normalAttrs","allAttrs","reduce","data","dataset","html","Html","defaultBlock","toJSON"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,IAAMA,GAAG,GAAG,uBAAM,oCAAN,CAAZ;AAEA,IAAMC,MAAM,GAAG,CAAC,MAAD,CAAf;AACA,IAAMC,IAAI,GAAG,CAAC,IAAD,EAAO,QAAP,EAAiB,GAAjB,CAAb;AACA,IAAMC,SAAS,GAAG,CAAlB;AACA,IAAMC,YAAY,GAAG,CAArB;;AAEA,IAAMC,IAAI,GAAG,SAAPA,IAAO,CAAAC,EAAE,EAAI;AACjB,MAAI,CAACA,EAAE,CAACC,UAAJ,IAAkBD,EAAE,CAACC,UAAH,CAAcC,MAAd,IAAwB,CAA9C,EAAiD;AAC/C,WAAOC,SAAP;AACD;;AAED,MAAMC,GAAG,GAAG,EAAZ;AACA,MAAIC,CAAJ;;AAEA,OAAKA,CAAC,GAAG,CAAT,EAAYA,CAAC,GAAGL,EAAE,CAACC,UAAH,CAAcC,MAA9B,EAAsCG,CAAC,EAAvC,EAA2C;AACzC,QAAMC,CAAC,GAAGN,EAAE,CAACC,UAAH,CAAcI,CAAd,CAAV;AAEAD,IAAAA,GAAG,CAACE,CAAC,CAACC,IAAH,CAAH,GAAcD,CAAC,CAACE,KAAhB;AACD;;AAED,SAAOJ,GAAP;AACD,CAfD;;AAiBA,IAAMK,SAAS,GAAG,SAAZA,SAAY,CAAAC,IAAI,EAAI;AACxB,MAAIf,MAAM,CAACgB,QAAP,CAAgBD,IAAhB,CAAJ,EAA2B;AACzB,WAAO,QAAP;AACD,GAFD,MAEO,IAAId,IAAI,CAACe,QAAL,CAAcD,IAAd,CAAJ,EAAyB;AAC9B,WAAO,MAAP;AACD;;AACD,SAAO,OAAP;AACD,CAPD;;AASO,IAAME,gBAAgB,GAAG,SAAnBA,gBAAmB,CAAAC,CAAC,EAAI;AACnC,MAAMC,KAAK,GAAG,yBAAd;AACA,MAAIC,KAAJ;AACA,MAAMC,MAAM,GAAG,EAAf;;AACA,SAAQD,KAAK,GAAGD,KAAK,CAACG,IAAN,CAAWJ,CAAX,CAAhB,EAAgC;AAC9BG,IAAAA,MAAM,CAACD,KAAK,CAAC,CAAD,CAAN,CAAN,GAAmBA,KAAK,CAAC,CAAD,CAAL,CAASG,IAAT,EAAnB;AACD;;AACD,SAAOF,MAAP;AACD,CARM;;;;AAUA,IAAMG,eAAe,GAAG,SAAlBA,eAAkB,CAAAC,CAAC;AAAA,SAAI,qBAAcA,CAAd,EAAiB;AAAEC,IAAAA,QAAQ,EAAE;
|
|
1
|
+
{"version":3,"sources":["../src/serialization.js"],"names":["log","INLINE","MARK","TEXT_NODE","COMMENT_NODE","attr","el","attributes","length","undefined","out","i","a","name","value","getObject","type","includes","parseStyleString","s","regex","match","result","exec","trim","reactAttributes","o","camelize","addUnits","handleStyles","attribute","styleString","getAttribute","handleClass","acc","classNames","attributesToMap","style","className","MARK_TAGS","b","em","u","code","strong","marks","deserialize","next","mark","tagName","toLowerCase","object","nodes","childNodes","rules","nodeType","leaves","text","textContent","normalAttrs","allAttrs","reduce","data","dataset","html","Html","defaultBlock","toJSON"],"mappings":"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","sourcesContent":["import React from 'react';\nimport Html from 'slate-html-serializer';\nimport { object as toStyleObject } from 'to-style';\nimport debug from 'debug';\n\nconst log = debug('@pie-lib:mask-markup:serialization');\n\nconst INLINE = ['span'];\nconst MARK = ['em', 'strong', 'u'];\nconst TEXT_NODE = 3;\nconst COMMENT_NODE = 8;\n\nconst attr = el => {\n if (!el.attributes || el.attributes.length <= 0) {\n return undefined;\n }\n\n const out = {};\n let i;\n\n for (i = 0; i < el.attributes.length; i++) {\n const a = el.attributes[i];\n\n out[a.name] = a.value;\n }\n\n return out;\n};\n\nconst getObject = type => {\n if (INLINE.includes(type)) {\n return 'inline';\n } else if (MARK.includes(type)) {\n return 'mark';\n }\n return 'block';\n};\n\nexport const parseStyleString = s => {\n const regex = /([\\w-]*)\\s*:\\s*([^;]*)/g;\n let match;\n const result = {};\n while ((match = regex.exec(s))) {\n result[match[1]] = match[2].trim();\n }\n return result;\n};\n\nexport const reactAttributes = o => toStyleObject(o, { camelize: true, addUnits: false });\n\nconst handleStyles = (el, attribute) => {\n const styleString = el.getAttribute(attribute);\n\n return reactAttributes(parseStyleString(styleString));\n};\n\nconst handleClass = (el, acc, attribute) => {\n const classNames = el.getAttribute(attribute);\n\n delete acc.class;\n\n return classNames;\n};\n\nconst attributesToMap = el => (acc, attribute) => {\n if (!el.getAttribute) {\n return acc;\n }\n\n const value = el.getAttribute(attribute);\n\n if (value) {\n switch (attribute) {\n case 'style':\n acc.style = handleStyles(el, attribute);\n break;\n case 'class':\n acc.className = handleClass(el, acc, attribute);\n break;\n default:\n acc[attribute] = el.getAttribute(attribute);\n break;\n }\n }\n\n return acc;\n};\n\nconst attributes = ['border', 'class', 'style'];\n\n/**\n * Tags to marks.\n *\n * @type {Object}\n */\n\nexport const MARK_TAGS = {\n b: 'bold',\n em: 'italic',\n u: 'underline',\n s: 'strikethrough',\n code: 'code',\n strong: 'strong'\n};\n\nconst marks = {\n deserialize(el, next) {\n const mark = MARK_TAGS[el.tagName.toLowerCase()];\n if (!mark) return;\n log('[deserialize] mark: ', mark);\n return {\n object: 'mark',\n type: mark,\n nodes: next(el.childNodes)\n };\n }\n};\n\nconst rules = [\n marks,\n {\n /**\n * deserialize everything, we're not fussy about the dom structure for now.\n */\n deserialize: (el, next) => {\n if (el.nodeType === COMMENT_NODE) {\n return undefined;\n }\n\n if (el.nodeType === TEXT_NODE) {\n return {\n object: 'text',\n leaves: [{ text: el.textContent }]\n };\n }\n\n const type = el.tagName.toLowerCase();\n\n const normalAttrs = attr(el) || {};\n const allAttrs = attributes.reduce(attributesToMap(el), { ...normalAttrs });\n const object = getObject(type);\n\n return {\n object,\n type,\n data: { dataset: { ...el.dataset }, attributes: { ...allAttrs } },\n nodes: next(el.childNodes)\n };\n }\n }\n];\n\n/**\n * Create a new serializer instance with our `rules` from above.\n * Having a default div block will just put every div on it's own line, which is not ideal.\n */\nconst html = new Html({ rules, defaultBlock: 'span' });\n\nexport const deserialize = s => html.deserialize(s, { toJSON: true });\n"],"file":"serialization.js"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pie-lib/mask-markup",
|
|
3
|
-
"version": "1.11.
|
|
3
|
+
"version": "1.11.4",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "src/index.js",
|
|
@@ -10,8 +10,8 @@
|
|
|
10
10
|
"dependencies": {
|
|
11
11
|
"@material-ui/core": "^3.9.3",
|
|
12
12
|
"@pie-lib/drag": "^1.1.52",
|
|
13
|
-
"@pie-lib/math-rendering": "^2.3.
|
|
14
|
-
"@pie-lib/render-ui": "^4.12.
|
|
13
|
+
"@pie-lib/math-rendering": "^2.3.12",
|
|
14
|
+
"@pie-lib/render-ui": "^4.12.4",
|
|
15
15
|
"classnames": "^2.2.6",
|
|
16
16
|
"debug": "^4.1.1",
|
|
17
17
|
"immutable": ">=3.8.1",
|
|
@@ -27,5 +27,5 @@
|
|
|
27
27
|
"keywords": [],
|
|
28
28
|
"author": "",
|
|
29
29
|
"license": "ISC",
|
|
30
|
-
"gitHead": "
|
|
30
|
+
"gitHead": "0fa7d2eea7cc8d058c396cbb3b74adaaf924b2fe"
|
|
31
31
|
}
|
package/src/choices/choice.jsx
CHANGED
package/src/components/blank.jsx
CHANGED
|
@@ -12,7 +12,7 @@ export default withStyles(() => ({
|
|
|
12
12
|
input: {
|
|
13
13
|
color: color.text(),
|
|
14
14
|
backgroundColor: color.background(),
|
|
15
|
-
borderRadius: '4px',
|
|
15
|
+
borderRadius: '4px !important',
|
|
16
16
|
borderWidth: '1px',
|
|
17
17
|
borderStyle: 'solid',
|
|
18
18
|
padding: '10px 20px 10px 10px',
|
|
@@ -30,6 +30,9 @@ export default withStyles(() => ({
|
|
|
30
30
|
borderColor: color.primaryDark()
|
|
31
31
|
}
|
|
32
32
|
},
|
|
33
|
+
crInput: {
|
|
34
|
+
padding: '8px !important'
|
|
35
|
+
},
|
|
33
36
|
correct: correctStyle(color.correct()),
|
|
34
37
|
incorrect: correctStyle(color.incorrect()),
|
|
35
38
|
box: {
|
|
@@ -46,17 +49,24 @@ export default withStyles(() => ({
|
|
|
46
49
|
borderColor: color.correct()
|
|
47
50
|
}
|
|
48
51
|
}))(props => {
|
|
49
|
-
const {
|
|
52
|
+
const {
|
|
53
|
+
correct,
|
|
54
|
+
charactersLimit,
|
|
55
|
+
classes,
|
|
56
|
+
disabled,
|
|
57
|
+
isBox,
|
|
58
|
+
isConstructedResponse,
|
|
59
|
+
width,
|
|
60
|
+
...rest
|
|
61
|
+
} = props;
|
|
50
62
|
const label = typeof correct === 'boolean' ? (correct ? 'correct' : 'incorrect') : undefined;
|
|
51
|
-
const
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
}
|
|
59
|
-
: {};
|
|
63
|
+
const inputProps = charactersLimit ? { maxLength: charactersLimit } : {};
|
|
64
|
+
|
|
65
|
+
if (width) {
|
|
66
|
+
inputProps.style = {
|
|
67
|
+
width: `${width + Math.round(width / 10) + 1}ch` // added some extra space for capital letters
|
|
68
|
+
};
|
|
69
|
+
}
|
|
60
70
|
|
|
61
71
|
return (
|
|
62
72
|
<OutlinedInput
|
|
@@ -66,7 +76,11 @@ export default withStyles(() => ({
|
|
|
66
76
|
[classes.outlinedInput]: true
|
|
67
77
|
})}
|
|
68
78
|
classes={{
|
|
69
|
-
input: classnames({
|
|
79
|
+
input: classnames({
|
|
80
|
+
[classes.input]: true,
|
|
81
|
+
[classes[label]]: label,
|
|
82
|
+
[classes.crInput]: isConstructedResponse
|
|
83
|
+
})
|
|
70
84
|
}}
|
|
71
85
|
inputProps={inputProps}
|
|
72
86
|
labelWidth={0}
|
package/src/components/input.jsx
CHANGED
|
@@ -2,21 +2,34 @@ import React from 'react';
|
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
3
|
import CorrectInput from './correct-input';
|
|
4
4
|
|
|
5
|
-
const Input = ({
|
|
5
|
+
const Input = ({
|
|
6
|
+
disabled,
|
|
7
|
+
correct,
|
|
8
|
+
charactersLimit,
|
|
9
|
+
id,
|
|
10
|
+
isConstructedResponse,
|
|
11
|
+
value,
|
|
12
|
+
onChange,
|
|
13
|
+
showCorrectAnswer,
|
|
14
|
+
width
|
|
15
|
+
}) => {
|
|
6
16
|
return (
|
|
7
17
|
<CorrectInput
|
|
8
18
|
disabled={disabled}
|
|
9
19
|
correct={showCorrectAnswer || correct}
|
|
20
|
+
charactersLimit={charactersLimit}
|
|
10
21
|
variant="outlined"
|
|
11
22
|
value={value}
|
|
23
|
+
isConstructedResponse={isConstructedResponse}
|
|
12
24
|
isBox={true}
|
|
13
|
-
|
|
25
|
+
width={width}
|
|
14
26
|
onChange={e => {
|
|
15
27
|
onChange(id, e.target.value);
|
|
16
28
|
}}
|
|
17
29
|
/>
|
|
18
30
|
);
|
|
19
31
|
};
|
|
32
|
+
|
|
20
33
|
Input.propTypes = {
|
|
21
34
|
id: PropTypes.string,
|
|
22
35
|
value: PropTypes.string,
|
|
@@ -5,12 +5,13 @@ import { withMask } from './with-mask';
|
|
|
5
5
|
export default withMask('input', props => (node, data, onChange) => {
|
|
6
6
|
const dataset = node.data ? node.data.dataset || {} : {};
|
|
7
7
|
if (dataset.component === 'input') {
|
|
8
|
-
const { disabled, feedback, showCorrectAnswer, maxLength } = props;
|
|
8
|
+
const { adjustedLimit, disabled, feedback, showCorrectAnswer, maxLength } = props;
|
|
9
9
|
// the first answer is the correct one
|
|
10
10
|
const correctAnswer = ((props.choices && dataset && props.choices[dataset.id]) || [])[0];
|
|
11
11
|
const finalValue = showCorrectAnswer
|
|
12
12
|
? correctAnswer && correctAnswer.label
|
|
13
13
|
: data[dataset.id] || '';
|
|
14
|
+
const width = maxLength && maxLength[dataset.id];
|
|
14
15
|
|
|
15
16
|
return (
|
|
16
17
|
<Input
|
|
@@ -21,7 +22,9 @@ export default withMask('input', props => (node, data, onChange) => {
|
|
|
21
22
|
id={dataset.id}
|
|
22
23
|
onChange={onChange}
|
|
23
24
|
showCorrectAnswer={showCorrectAnswer}
|
|
24
|
-
|
|
25
|
+
width={width}
|
|
26
|
+
charactersLimit={adjustedLimit ? width : 25}
|
|
27
|
+
isConstructedResponse={true}
|
|
25
28
|
/>
|
|
26
29
|
);
|
|
27
30
|
}
|
package/src/mask.jsx
CHANGED
|
@@ -95,6 +95,12 @@ export const renderChildren = (layout, value, onChange, rootRenderChildren, pare
|
|
|
95
95
|
return children;
|
|
96
96
|
};
|
|
97
97
|
|
|
98
|
+
const MaskContainer = withStyles(() => ({
|
|
99
|
+
main: {
|
|
100
|
+
display: 'inherit'
|
|
101
|
+
}
|
|
102
|
+
}))(props => <div className={props.classes.main}>{props.children}</div>);
|
|
103
|
+
|
|
98
104
|
/**
|
|
99
105
|
* Renders a layout that uses the slate.js Value model structure.
|
|
100
106
|
*/
|
|
@@ -115,6 +121,6 @@ export default class Mask extends React.Component {
|
|
|
115
121
|
const { value, layout } = this.props;
|
|
116
122
|
const children = renderChildren(layout, value, this.handleChange, this.props.renderChildren);
|
|
117
123
|
|
|
118
|
-
return <
|
|
124
|
+
return <MaskContainer>{children}</MaskContainer>;
|
|
119
125
|
}
|
|
120
126
|
}
|
package/src/serialization.js
CHANGED
|
@@ -46,7 +46,7 @@ export const parseStyleString = s => {
|
|
|
46
46
|
return result;
|
|
47
47
|
};
|
|
48
48
|
|
|
49
|
-
export const reactAttributes = o => toStyleObject(o, { camelize: true });
|
|
49
|
+
export const reactAttributes = o => toStyleObject(o, { camelize: true, addUnits: false });
|
|
50
50
|
|
|
51
51
|
const handleStyles = (el, attribute) => {
|
|
52
52
|
const styleString = el.getAttribute(attribute);
|